@unciatech/file-manager 0.0.30 → 0.0.31

package/dist/cli.cjs

@@ -79,9 +79,6 @@ async function main() {
     }
     import_fs.default.writeFileSync(targetFile, TEMPLATE, "utf-8");
     console.log(`\u2705 Success! Created ${targetFile}`);
-    console.log("");
-    console.log("You can now import and render <FileManagerDemo /> anywhere in your application.");
-    console.log("Don't forget to configure your Tailwind CSS content to scan the library for styles!");
     process.exit(0);
   }
   console.log(`
@@ -92,12 +89,11 @@ async function main() {
   console.log("  2) Vite (React, Tailwind v4)");
   console.log("  3) Cancel");
   const choice = await askQuestion("\nSelect an option (1-3): ");
+  rl.close();
   const targetDir = import_path.default.join(process.cwd(), projectName);
   if (import_fs.default.existsSync(targetDir)) {
     console.error(`
-\u274C Error: Directory "${projectName}" already exists in ${process.cwd()}.`);
-    console.error(`   Please choose a different project name or delete the existing directory first.`);
-    rl.close();
+\u274C Error: Directory "${projectName}" already exists.`);
     process.exit(1);
   }
   try {
@@ -116,9 +112,9 @@ async function main() {
   process.exit(0);
 }
 async function scaffoldNextjs(projectName2, targetDir) {
-  console.log("\n\u{1F4E6} Creating Next.js application (this may take a minute)...");
+  console.log("\n\u{1F4E6} Creating Next.js application...");
   (0, import_child_process.execSync)(`npx create-next-app@latest ${projectName2} --ts --tailwind --eslint --app --src-dir --import-alias "@/*" --use-npm`, { stdio: "inherit" });
-  console.log("\n\u{1F4E6} Installing dependencies (@unciatech/file-manager, tailwindcss-animate)...");
+  console.log("\n\u{1F4E6} Installing dependencies...");
   (0, import_child_process.execSync)("npm install @unciatech/file-manager tailwindcss-animate", { cwd: targetDir, stdio: "inherit" });
   const componentsDir = import_path.default.join(targetDir, "src", "components");
   if (!import_fs.default.existsSync(componentsDir)) import_fs.default.mkdirSync(componentsDir, { recursive: true });
@@ -133,153 +129,22 @@ export default function Home() {
     </main>
   );
 }
-`);
-  const mediaRouteDir = import_path.default.join(targetDir, "src", "app", "media", "[[...path]]");
-  import_fs.default.mkdirSync(mediaRouteDir, { recursive: true });
-  import_fs.default.writeFileSync(
-    import_path.default.join(mediaRouteDir, "page.tsx"),
-    `import FileManagerDemo from "@/components/FileManagerDemo";
-
-export default function MediaPage() {
-  return (
-    <main className="min-h-screen bg-neutral-50">
-      <FileManagerDemo />
-    </main>
-  );
-}
-`
-  );
-  const layoutPath = import_path.default.join(targetDir, "src", "app", "layout.tsx");
-  if (import_fs.default.existsSync(layoutPath)) {
-    let layoutContent = import_fs.default.readFileSync(layoutPath, "utf8");
-    if (!layoutContent.includes("@unciatech/file-manager/styles")) {
-      layoutContent = layoutContent.replace(
-        /^(import type)/m,
-        `import '@unciatech/file-manager/styles';
-$1`
-      );
-      import_fs.default.writeFileSync(layoutPath, layoutContent);
-    }
-  }
-  const cssPath = import_path.default.join(targetDir, "src", "app", "globals.css");
-  import_fs.default.writeFileSync(cssPath, `@import 'tailwindcss';
-@import 'tw-animate-css';
-@source "../../node_modules/@unciatech/file-manager/dist";
-
-/** Dark Mode Variant **/
-@custom-variant dark (&:is(.dark *));
-
-@theme {
-  --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
-}
-
-/** Colors **/
-:root {
-  --background: var(--color-white);
-  --foreground: var(--color-zinc-950);
-  --card: var(--color-white);
-  --card-foreground: var(--color-zinc-950);
-  --popover: var(--color-white);
-  --popover-foreground: var(--color-zinc-950);
-  --primary: var(--color-blue-500);
-  --primary-foreground: var(--color-white);
-  --secondary: var(--color-zinc-100);
-  --secondary-foreground: var(--color-zinc-900);
-  --muted: var(--color-zinc-100);
-  --muted-foreground: var(--color-zinc-500);
-  --accent: var(--color-zinc-100);
-  --accent-foreground: var(--color-zinc-900);
-  --destructive: var(--color-red-600);
-  --destructive-foreground: var(--color-white);
-  --border: oklch(94% 0.004 286.32);
-  --input: var(--color-zinc-200);
-  --ring: var(--color-zinc-400);
-  --radius: 0.5rem;
-}
-
-.dark {
-  --background: var(--color-zinc-950);
-  --foreground: var(--color-zinc-50);
-  --card: var(--color-zinc-950);
-  --card-foreground: var(--color-zinc-50);
-  --popover: var(--color-zinc-950);
-  --popover-foreground: var(--color-zinc-50);
-  --primary: var(--color-blue-600);
-  --primary-foreground: var(--color-white);
-  --secondary: var(--color-zinc-800);
-  --secondary-foreground: var(--color-zinc-50);
-  --muted: var(--color-zinc-900);
-  --muted-foreground: var(--color-zinc-500);
-  --accent: var(--color-zinc-900);
-  --accent-foreground: var(--color-zinc-50);
-  --destructive: var(--color-red-600);
-  --destructive-foreground: var(--color-white);
-  --border: var(--color-zinc-800);
-  --input: var(--color-zinc-800);
-  --ring: var(--color-zinc-600);
-}
-
-/** Theme Setup **/
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --radius-xl: calc(var(--radius) + 4px);
-  --radius-lg: var(--radius);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-sm: calc(var(--radius) - 4px);
-}
-
-/** Global Styles **/
-@layer base {
-  * {
-    @apply border-border;
-  }
-  *:focus-visible {
-    @apply outline-ring rounded-xs shadow-none outline-2 outline-offset-3 transition-none!;
-  }
-}
-
-/** Custom Scrollbar **/
-@layer base {
-  ::-webkit-scrollbar { width: 5px; }
-  ::-webkit-scrollbar-track { background: transparent; }
-  ::-webkit-scrollbar-thumb { background: var(--input); border-radius: 5px; }
-  * { scrollbar-width: thin; scrollbar-color: var(--input) transparent; }
-}
-
-/** Smooth scroll **/
-html {
-  scroll-behavior: smooth;
-}
 `);
   printSuccess(projectName2);
 }
 async function scaffoldVite(projectName2, targetDir) {
   console.log("\n\u{1F4E6} Creating Vite React application...");
   (0, import_child_process.execSync)(`npm create vite@latest ${projectName2} -- --template react-ts`, { stdio: "inherit" });
-  console.log("\n\u{1F4E6} Installing dependencies (Tailwind + File Manager)...");
+  console.log("\n\u{1F4E6} Installing dependencies...");
   (0, import_child_process.execSync)("npm install", { cwd: targetDir, stdio: "inherit" });
-  (0, import_child_process.execSync)("npm install @unciatech/file-manager tailwindcss @tailwindcss/vite tw-animate-css", { cwd: targetDir, stdio: "inherit" });
+  (0, import_child_process.execSync)(
+    "npm install tailwindcss @tailwindcss/vite @unciatech/file-manager tw-animate-css",
+    { cwd: targetDir, stdio: "inherit" }
+  );
   const viteConfigPath = import_path.default.join(targetDir, "vite.config.ts");
-  const viteConfig = `import { defineConfig } from 'vite'
+  import_fs.default.writeFileSync(
+    viteConfigPath,
+    `import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import tailwindcss from '@tailwindcss/vite'
 
@@ -289,26 +154,39 @@ export default defineConfig({
     tailwindcss(),
   ],
 })
-`;
-  import_fs.default.writeFileSync(viteConfigPath, viteConfig);
+`
+  );
   const cssPath = import_path.default.join(targetDir, "src", "index.css");
-  import_fs.default.writeFileSync(cssPath, `@import "tailwindcss";
+  import_fs.default.writeFileSync(
+    cssPath,
+    `@import "tailwindcss";
+@import "tw-animate-css";
+
 @source "../node_modules/@unciatech/file-manager/dist/**/*.{js,ts,jsx,tsx}";
-`);
+`
+  );
   const mainPath = import_path.default.join(targetDir, "src", "main.tsx");
   if (import_fs.default.existsSync(mainPath)) {
     let mainContent = import_fs.default.readFileSync(mainPath, "utf8");
     if (!mainContent.includes("@unciatech/file-manager/styles")) {
-      mainContent = `import '@unciatech/file-manager/styles';
+      mainContent = `import "@unciatech/file-manager/styles";
 ` + mainContent;
       import_fs.default.writeFileSync(mainPath, mainContent);
     }
   }
   const componentsDir = import_path.default.join(targetDir, "src", "components");
-  if (!import_fs.default.existsSync(componentsDir)) import_fs.default.mkdirSync(componentsDir, { recursive: true });
-  import_fs.default.writeFileSync(import_path.default.join(componentsDir, "FileManagerDemo.tsx"), TEMPLATE, "utf-8");
+  if (!import_fs.default.existsSync(componentsDir)) {
+    import_fs.default.mkdirSync(componentsDir, { recursive: true });
+  }
+  import_fs.default.writeFileSync(
+    import_path.default.join(componentsDir, "FileManagerDemo.tsx"),
+    TEMPLATE,
+    "utf-8"
+  );
   const appPath = import_path.default.join(targetDir, "src", "App.tsx");
-  import_fs.default.writeFileSync(appPath, `import FileManagerDemo from "./components/FileManagerDemo";
+  import_fs.default.writeFileSync(
+    appPath,
+    `import FileManagerDemo from "./components/FileManagerDemo";
 
 function App() {
   return (
@@ -319,8 +197,9 @@ function App() {
 }
 
 export default App;
-`);
-  printSuccess(projectName2, "npm run dev");
+`
+  );
+  printSuccess(projectName2);
 }
 function printSuccess(projectName2, devCmd = "npm run dev") {
   console.log("\n=========================================");

package/dist/cli.js

@@ -56,9 +56,6 @@ async function main() {
     }
     fs.writeFileSync(targetFile, TEMPLATE, "utf-8");
     console.log(`\u2705 Success! Created ${targetFile}`);
-    console.log("");
-    console.log("You can now import and render <FileManagerDemo /> anywhere in your application.");
-    console.log("Don't forget to configure your Tailwind CSS content to scan the library for styles!");
     process.exit(0);
   }
   console.log(`
@@ -69,12 +66,11 @@ async function main() {
   console.log("  2) Vite (React, Tailwind v4)");
   console.log("  3) Cancel");
   const choice = await askQuestion("\nSelect an option (1-3): ");
+  rl.close();
   const targetDir = path.join(process.cwd(), projectName);
   if (fs.existsSync(targetDir)) {
     console.error(`
-\u274C Error: Directory "${projectName}" already exists in ${process.cwd()}.`);
-    console.error(`   Please choose a different project name or delete the existing directory first.`);
-    rl.close();
+\u274C Error: Directory "${projectName}" already exists.`);
     process.exit(1);
   }
   try {
@@ -93,9 +89,9 @@ async function main() {
   process.exit(0);
 }
 async function scaffoldNextjs(projectName2, targetDir) {
-  console.log("\n\u{1F4E6} Creating Next.js application (this may take a minute)...");
+  console.log("\n\u{1F4E6} Creating Next.js application...");
   execSync(`npx create-next-app@latest ${projectName2} --ts --tailwind --eslint --app --src-dir --import-alias "@/*" --use-npm`, { stdio: "inherit" });
-  console.log("\n\u{1F4E6} Installing dependencies (@unciatech/file-manager, tailwindcss-animate)...");
+  console.log("\n\u{1F4E6} Installing dependencies...");
   execSync("npm install @unciatech/file-manager tailwindcss-animate", { cwd: targetDir, stdio: "inherit" });
   const componentsDir = path.join(targetDir, "src", "components");
   if (!fs.existsSync(componentsDir)) fs.mkdirSync(componentsDir, { recursive: true });
@@ -110,153 +106,22 @@ export default function Home() {
     </main>
   );
 }
-`);
-  const mediaRouteDir = path.join(targetDir, "src", "app", "media", "[[...path]]");
-  fs.mkdirSync(mediaRouteDir, { recursive: true });
-  fs.writeFileSync(
-    path.join(mediaRouteDir, "page.tsx"),
-    `import FileManagerDemo from "@/components/FileManagerDemo";
-
-export default function MediaPage() {
-  return (
-    <main className="min-h-screen bg-neutral-50">
-      <FileManagerDemo />
-    </main>
-  );
-}
-`
-  );
-  const layoutPath = path.join(targetDir, "src", "app", "layout.tsx");
-  if (fs.existsSync(layoutPath)) {
-    let layoutContent = fs.readFileSync(layoutPath, "utf8");
-    if (!layoutContent.includes("@unciatech/file-manager/styles")) {
-      layoutContent = layoutContent.replace(
-        /^(import type)/m,
-        `import '@unciatech/file-manager/styles';
-$1`
-      );
-      fs.writeFileSync(layoutPath, layoutContent);
-    }
-  }
-  const cssPath = path.join(targetDir, "src", "app", "globals.css");
-  fs.writeFileSync(cssPath, `@import 'tailwindcss';
-@import 'tw-animate-css';
-@source "../../node_modules/@unciatech/file-manager/dist";
-
-/** Dark Mode Variant **/
-@custom-variant dark (&:is(.dark *));
-
-@theme {
-  --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
-}
-
-/** Colors **/
-:root {
-  --background: var(--color-white);
-  --foreground: var(--color-zinc-950);
-  --card: var(--color-white);
-  --card-foreground: var(--color-zinc-950);
-  --popover: var(--color-white);
-  --popover-foreground: var(--color-zinc-950);
-  --primary: var(--color-blue-500);
-  --primary-foreground: var(--color-white);
-  --secondary: var(--color-zinc-100);
-  --secondary-foreground: var(--color-zinc-900);
-  --muted: var(--color-zinc-100);
-  --muted-foreground: var(--color-zinc-500);
-  --accent: var(--color-zinc-100);
-  --accent-foreground: var(--color-zinc-900);
-  --destructive: var(--color-red-600);
-  --destructive-foreground: var(--color-white);
-  --border: oklch(94% 0.004 286.32);
-  --input: var(--color-zinc-200);
-  --ring: var(--color-zinc-400);
-  --radius: 0.5rem;
-}
-
-.dark {
-  --background: var(--color-zinc-950);
-  --foreground: var(--color-zinc-50);
-  --card: var(--color-zinc-950);
-  --card-foreground: var(--color-zinc-50);
-  --popover: var(--color-zinc-950);
-  --popover-foreground: var(--color-zinc-50);
-  --primary: var(--color-blue-600);
-  --primary-foreground: var(--color-white);
-  --secondary: var(--color-zinc-800);
-  --secondary-foreground: var(--color-zinc-50);
-  --muted: var(--color-zinc-900);
-  --muted-foreground: var(--color-zinc-500);
-  --accent: var(--color-zinc-900);
-  --accent-foreground: var(--color-zinc-50);
-  --destructive: var(--color-red-600);
-  --destructive-foreground: var(--color-white);
-  --border: var(--color-zinc-800);
-  --input: var(--color-zinc-800);
-  --ring: var(--color-zinc-600);
-}
-
-/** Theme Setup **/
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --radius-xl: calc(var(--radius) + 4px);
-  --radius-lg: var(--radius);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-sm: calc(var(--radius) - 4px);
-}
-
-/** Global Styles **/
-@layer base {
-  * {
-    @apply border-border;
-  }
-  *:focus-visible {
-    @apply outline-ring rounded-xs shadow-none outline-2 outline-offset-3 transition-none!;
-  }
-}
-
-/** Custom Scrollbar **/
-@layer base {
-  ::-webkit-scrollbar { width: 5px; }
-  ::-webkit-scrollbar-track { background: transparent; }
-  ::-webkit-scrollbar-thumb { background: var(--input); border-radius: 5px; }
-  * { scrollbar-width: thin; scrollbar-color: var(--input) transparent; }
-}
-
-/** Smooth scroll **/
-html {
-  scroll-behavior: smooth;
-}
 `);
   printSuccess(projectName2);
 }
 async function scaffoldVite(projectName2, targetDir) {
   console.log("\n\u{1F4E6} Creating Vite React application...");
   execSync(`npm create vite@latest ${projectName2} -- --template react-ts`, { stdio: "inherit" });
-  console.log("\n\u{1F4E6} Installing dependencies (Tailwind + File Manager)...");
+  console.log("\n\u{1F4E6} Installing dependencies...");
   execSync("npm install", { cwd: targetDir, stdio: "inherit" });
-  execSync("npm install @unciatech/file-manager tailwindcss @tailwindcss/vite tw-animate-css", { cwd: targetDir, stdio: "inherit" });
+  execSync(
+    "npm install tailwindcss @tailwindcss/vite @unciatech/file-manager tw-animate-css",
+    { cwd: targetDir, stdio: "inherit" }
+  );
   const viteConfigPath = path.join(targetDir, "vite.config.ts");
-  const viteConfig = `import { defineConfig } from 'vite'
+  fs.writeFileSync(
+    viteConfigPath,
+    `import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import tailwindcss from '@tailwindcss/vite'
 
@@ -266,26 +131,39 @@ export default defineConfig({
     tailwindcss(),
   ],
 })
-`;
-  fs.writeFileSync(viteConfigPath, viteConfig);
+`
+  );
   const cssPath = path.join(targetDir, "src", "index.css");
-  fs.writeFileSync(cssPath, `@import "tailwindcss";
+  fs.writeFileSync(
+    cssPath,
+    `@import "tailwindcss";
+@import "tw-animate-css";
+
 @source "../node_modules/@unciatech/file-manager/dist/**/*.{js,ts,jsx,tsx}";
-`);
+`
+  );
   const mainPath = path.join(targetDir, "src", "main.tsx");
   if (fs.existsSync(mainPath)) {
     let mainContent = fs.readFileSync(mainPath, "utf8");
     if (!mainContent.includes("@unciatech/file-manager/styles")) {
-      mainContent = `import '@unciatech/file-manager/styles';
+      mainContent = `import "@unciatech/file-manager/styles";
 ` + mainContent;
       fs.writeFileSync(mainPath, mainContent);
     }
   }
   const componentsDir = path.join(targetDir, "src", "components");
-  if (!fs.existsSync(componentsDir)) fs.mkdirSync(componentsDir, { recursive: true });
-  fs.writeFileSync(path.join(componentsDir, "FileManagerDemo.tsx"), TEMPLATE, "utf-8");
+  if (!fs.existsSync(componentsDir)) {
+    fs.mkdirSync(componentsDir, { recursive: true });
+  }
+  fs.writeFileSync(
+    path.join(componentsDir, "FileManagerDemo.tsx"),
+    TEMPLATE,
+    "utf-8"
+  );
   const appPath = path.join(targetDir, "src", "App.tsx");
-  fs.writeFileSync(appPath, `import FileManagerDemo from "./components/FileManagerDemo";
+  fs.writeFileSync(
+    appPath,
+    `import FileManagerDemo from "./components/FileManagerDemo";
 
 function App() {
   return (
@@ -296,8 +174,9 @@ function App() {
 }
 
 export default App;
-`);
-  printSuccess(projectName2, "npm run dev");
+`
+  );
+  printSuccess(projectName2);
 }
 function printSuccess(projectName2, devCmd = "npm run dev") {
   console.log("\n=========================================");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unciatech/file-manager",
-  "version": "0.0.30",
+  "version": "0.0.31",
   "description": "Modern file manager component for React and Next.js",
   "author": "Avi",
   "license": "MIT",