@unciatech/file-manager 0.0.29 → 0.0.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/cli.cjs +40 -161
  2. package/dist/cli.js +40 -161
  3. package/package.json +1 -1
package/dist/cli.cjs CHANGED
@@ -40,11 +40,11 @@ var askQuestion = (query) => {
40
40
  };
41
41
  var TEMPLATE = `"use client";
42
42
 
43
- import React, { Suspense } from "react";
43
+ import React, { Suspense, useMemo } from "react";
44
44
  import { FileManager, MockProvider } from "@unciatech/file-manager";
45
45
 
46
46
  export default function FileManagerDemo() {
47
- const mockProvider = new MockProvider();
47
+ const provider = useMemo(() => new MockProvider(), []);
48
48
 
49
49
  return (
50
50
  <div className="h-screen w-full">
@@ -52,7 +52,7 @@ export default function FileManagerDemo() {
52
52
  <FileManager
53
53
  allowedFileTypes={["audios", "videos", "images", "files"]}
54
54
  viewMode="grid"
55
- provider={mockProvider}
55
+ provider={provider}
56
56
  />
57
57
  </Suspense>
58
58
  </div>
@@ -79,9 +79,6 @@ async function main() {
79
79
  }
80
80
  import_fs.default.writeFileSync(targetFile, TEMPLATE, "utf-8");
81
81
  console.log(`\u2705 Success! Created ${targetFile}`);
82
- console.log("");
83
- console.log("You can now import and render <FileManagerDemo /> anywhere in your application.");
84
- console.log("Don't forget to configure your Tailwind CSS content to scan the library for styles!");
85
82
  process.exit(0);
86
83
  }
87
84
  console.log(`
@@ -92,12 +89,11 @@ async function main() {
92
89
  console.log(" 2) Vite (React, Tailwind v4)");
93
90
  console.log(" 3) Cancel");
94
91
  const choice = await askQuestion("\nSelect an option (1-3): ");
92
+ rl.close();
95
93
  const targetDir = import_path.default.join(process.cwd(), projectName);
96
94
  if (import_fs.default.existsSync(targetDir)) {
97
95
  console.error(`
98
- \u274C Error: Directory "${projectName}" already exists in ${process.cwd()}.`);
99
- console.error(` Please choose a different project name or delete the existing directory first.`);
100
- rl.close();
96
+ \u274C Error: Directory "${projectName}" already exists.`);
101
97
  process.exit(1);
102
98
  }
103
99
  try {
@@ -116,9 +112,9 @@ async function main() {
116
112
  process.exit(0);
117
113
  }
118
114
  async function scaffoldNextjs(projectName2, targetDir) {
119
- console.log("\n\u{1F4E6} Creating Next.js application (this may take a minute)...");
115
+ console.log("\n\u{1F4E6} Creating Next.js application...");
120
116
  (0, import_child_process.execSync)(`npx create-next-app@latest ${projectName2} --ts --tailwind --eslint --app --src-dir --import-alias "@/*" --use-npm`, { stdio: "inherit" });
121
- console.log("\n\u{1F4E6} Installing dependencies (@unciatech/file-manager, tailwindcss-animate)...");
117
+ console.log("\n\u{1F4E6} Installing dependencies...");
122
118
  (0, import_child_process.execSync)("npm install @unciatech/file-manager tailwindcss-animate", { cwd: targetDir, stdio: "inherit" });
123
119
  const componentsDir = import_path.default.join(targetDir, "src", "components");
124
120
  if (!import_fs.default.existsSync(componentsDir)) import_fs.default.mkdirSync(componentsDir, { recursive: true });
@@ -133,153 +129,22 @@ export default function Home() {
133
129
  </main>
134
130
  );
135
131
  }
136
- `);
137
- const mediaRouteDir = import_path.default.join(targetDir, "src", "app", "media", "[[...path]]");
138
- import_fs.default.mkdirSync(mediaRouteDir, { recursive: true });
139
- import_fs.default.writeFileSync(
140
- import_path.default.join(mediaRouteDir, "page.tsx"),
141
- `import FileManagerDemo from "@/components/FileManagerDemo";
142
-
143
- export default function MediaPage() {
144
- return (
145
- <main className="min-h-screen bg-neutral-50">
146
- <FileManagerDemo />
147
- </main>
148
- );
149
- }
150
- `
151
- );
152
- const layoutPath = import_path.default.join(targetDir, "src", "app", "layout.tsx");
153
- if (import_fs.default.existsSync(layoutPath)) {
154
- let layoutContent = import_fs.default.readFileSync(layoutPath, "utf8");
155
- if (!layoutContent.includes("@unciatech/file-manager/styles")) {
156
- layoutContent = layoutContent.replace(
157
- /^(import type)/m,
158
- `import '@unciatech/file-manager/styles';
159
- $1`
160
- );
161
- import_fs.default.writeFileSync(layoutPath, layoutContent);
162
- }
163
- }
164
- const cssPath = import_path.default.join(targetDir, "src", "app", "globals.css");
165
- import_fs.default.writeFileSync(cssPath, `@import 'tailwindcss';
166
- @import 'tw-animate-css';
167
- @source "../../node_modules/@unciatech/file-manager/dist";
168
-
169
- /** Dark Mode Variant **/
170
- @custom-variant dark (&:is(.dark *));
171
-
172
- @theme {
173
- --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
174
- --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
175
- }
176
-
177
- /** Colors **/
178
- :root {
179
- --background: var(--color-white);
180
- --foreground: var(--color-zinc-950);
181
- --card: var(--color-white);
182
- --card-foreground: var(--color-zinc-950);
183
- --popover: var(--color-white);
184
- --popover-foreground: var(--color-zinc-950);
185
- --primary: var(--color-blue-500);
186
- --primary-foreground: var(--color-white);
187
- --secondary: var(--color-zinc-100);
188
- --secondary-foreground: var(--color-zinc-900);
189
- --muted: var(--color-zinc-100);
190
- --muted-foreground: var(--color-zinc-500);
191
- --accent: var(--color-zinc-100);
192
- --accent-foreground: var(--color-zinc-900);
193
- --destructive: var(--color-red-600);
194
- --destructive-foreground: var(--color-white);
195
- --border: oklch(94% 0.004 286.32);
196
- --input: var(--color-zinc-200);
197
- --ring: var(--color-zinc-400);
198
- --radius: 0.5rem;
199
- }
200
-
201
- .dark {
202
- --background: var(--color-zinc-950);
203
- --foreground: var(--color-zinc-50);
204
- --card: var(--color-zinc-950);
205
- --card-foreground: var(--color-zinc-50);
206
- --popover: var(--color-zinc-950);
207
- --popover-foreground: var(--color-zinc-50);
208
- --primary: var(--color-blue-600);
209
- --primary-foreground: var(--color-white);
210
- --secondary: var(--color-zinc-800);
211
- --secondary-foreground: var(--color-zinc-50);
212
- --muted: var(--color-zinc-900);
213
- --muted-foreground: var(--color-zinc-500);
214
- --accent: var(--color-zinc-900);
215
- --accent-foreground: var(--color-zinc-50);
216
- --destructive: var(--color-red-600);
217
- --destructive-foreground: var(--color-white);
218
- --border: var(--color-zinc-800);
219
- --input: var(--color-zinc-800);
220
- --ring: var(--color-zinc-600);
221
- }
222
-
223
- /** Theme Setup **/
224
- @theme inline {
225
- --color-background: var(--background);
226
- --color-foreground: var(--foreground);
227
- --color-card: var(--card);
228
- --color-card-foreground: var(--card-foreground);
229
- --color-popover: var(--popover);
230
- --color-popover-foreground: var(--popover-foreground);
231
- --color-muted: var(--muted);
232
- --color-muted-foreground: var(--muted-foreground);
233
- --color-accent: var(--accent);
234
- --color-accent-foreground: var(--accent-foreground);
235
- --color-primary: var(--primary);
236
- --color-primary-foreground: var(--primary-foreground);
237
- --color-secondary: var(--secondary);
238
- --color-secondary-foreground: var(--secondary-foreground);
239
- --color-destructive: var(--destructive);
240
- --color-destructive-foreground: var(--destructive-foreground);
241
- --color-border: var(--border);
242
- --color-input: var(--input);
243
- --color-ring: var(--ring);
244
- --radius-xl: calc(var(--radius) + 4px);
245
- --radius-lg: var(--radius);
246
- --radius-md: calc(var(--radius) - 2px);
247
- --radius-sm: calc(var(--radius) - 4px);
248
- }
249
-
250
- /** Global Styles **/
251
- @layer base {
252
- * {
253
- @apply border-border;
254
- }
255
- *:focus-visible {
256
- @apply outline-ring rounded-xs shadow-none outline-2 outline-offset-3 transition-none!;
257
- }
258
- }
259
-
260
- /** Custom Scrollbar **/
261
- @layer base {
262
- ::-webkit-scrollbar { width: 5px; }
263
- ::-webkit-scrollbar-track { background: transparent; }
264
- ::-webkit-scrollbar-thumb { background: var(--input); border-radius: 5px; }
265
- * { scrollbar-width: thin; scrollbar-color: var(--input) transparent; }
266
- }
267
-
268
- /** Smooth scroll **/
269
- html {
270
- scroll-behavior: smooth;
271
- }
272
132
  `);
273
133
  printSuccess(projectName2);
274
134
  }
275
135
  async function scaffoldVite(projectName2, targetDir) {
276
136
  console.log("\n\u{1F4E6} Creating Vite React application...");
277
137
  (0, import_child_process.execSync)(`npm create vite@latest ${projectName2} -- --template react-ts`, { stdio: "inherit" });
278
- console.log("\n\u{1F4E6} Installing dependencies (Tailwind + File Manager)...");
138
+ console.log("\n\u{1F4E6} Installing dependencies...");
279
139
  (0, import_child_process.execSync)("npm install", { cwd: targetDir, stdio: "inherit" });
280
- (0, import_child_process.execSync)("npm install tailwindcss @tailwindcss/vite @unciatech/file-manager", { cwd: targetDir, stdio: "inherit" });
140
+ (0, import_child_process.execSync)(
141
+ "npm install tailwindcss @tailwindcss/vite @unciatech/file-manager tw-animate-css",
142
+ { cwd: targetDir, stdio: "inherit" }
143
+ );
281
144
  const viteConfigPath = import_path.default.join(targetDir, "vite.config.ts");
282
- const viteConfig = `import { defineConfig } from 'vite'
145
+ import_fs.default.writeFileSync(
146
+ viteConfigPath,
147
+ `import { defineConfig } from 'vite'
283
148
  import react from '@vitejs/plugin-react'
284
149
  import tailwindcss from '@tailwindcss/vite'
285
150
 
@@ -289,26 +154,39 @@ export default defineConfig({
289
154
  tailwindcss(),
290
155
  ],
291
156
  })
292
- `;
293
- import_fs.default.writeFileSync(viteConfigPath, viteConfig);
157
+ `
158
+ );
294
159
  const cssPath = import_path.default.join(targetDir, "src", "index.css");
295
- import_fs.default.writeFileSync(cssPath, `@import "tailwindcss";
296
- @source "../node_modules/@unciatech/file-manager/dist";
297
- `);
160
+ import_fs.default.writeFileSync(
161
+ cssPath,
162
+ `@import "tailwindcss";
163
+ @import "tw-animate-css";
164
+
165
+ @source "../node_modules/@unciatech/file-manager/dist/**/*.{js,ts,jsx,tsx}";
166
+ `
167
+ );
298
168
  const mainPath = import_path.default.join(targetDir, "src", "main.tsx");
299
169
  if (import_fs.default.existsSync(mainPath)) {
300
170
  let mainContent = import_fs.default.readFileSync(mainPath, "utf8");
301
171
  if (!mainContent.includes("@unciatech/file-manager/styles")) {
302
- mainContent = `import '@unciatech/file-manager/styles';
172
+ mainContent = `import "@unciatech/file-manager/styles";
303
173
  ` + mainContent;
304
174
  import_fs.default.writeFileSync(mainPath, mainContent);
305
175
  }
306
176
  }
307
177
  const componentsDir = import_path.default.join(targetDir, "src", "components");
308
- if (!import_fs.default.existsSync(componentsDir)) import_fs.default.mkdirSync(componentsDir, { recursive: true });
309
- import_fs.default.writeFileSync(import_path.default.join(componentsDir, "FileManagerDemo.tsx"), TEMPLATE, "utf-8");
178
+ if (!import_fs.default.existsSync(componentsDir)) {
179
+ import_fs.default.mkdirSync(componentsDir, { recursive: true });
180
+ }
181
+ import_fs.default.writeFileSync(
182
+ import_path.default.join(componentsDir, "FileManagerDemo.tsx"),
183
+ TEMPLATE,
184
+ "utf-8"
185
+ );
310
186
  const appPath = import_path.default.join(targetDir, "src", "App.tsx");
311
- import_fs.default.writeFileSync(appPath, `import FileManagerDemo from "./components/FileManagerDemo";
187
+ import_fs.default.writeFileSync(
188
+ appPath,
189
+ `import FileManagerDemo from "./components/FileManagerDemo";
312
190
 
313
191
  function App() {
314
192
  return (
@@ -319,8 +197,9 @@ function App() {
319
197
  }
320
198
 
321
199
  export default App;
322
- `);
323
- printSuccess(projectName2, "npm run dev");
200
+ `
201
+ );
202
+ printSuccess(projectName2);
324
203
  }
325
204
  function printSuccess(projectName2, devCmd = "npm run dev") {
326
205
  console.log("\n=========================================");
package/dist/cli.js CHANGED
@@ -17,11 +17,11 @@ var askQuestion = (query) => {
17
17
  };
18
18
  var TEMPLATE = `"use client";
19
19
 
20
- import React, { Suspense } from "react";
20
+ import React, { Suspense, useMemo } from "react";
21
21
  import { FileManager, MockProvider } from "@unciatech/file-manager";
22
22
 
23
23
  export default function FileManagerDemo() {
24
- const mockProvider = new MockProvider();
24
+ const provider = useMemo(() => new MockProvider(), []);
25
25
 
26
26
  return (
27
27
  <div className="h-screen w-full">
@@ -29,7 +29,7 @@ export default function FileManagerDemo() {
29
29
  <FileManager
30
30
  allowedFileTypes={["audios", "videos", "images", "files"]}
31
31
  viewMode="grid"
32
- provider={mockProvider}
32
+ provider={provider}
33
33
  />
34
34
  </Suspense>
35
35
  </div>
@@ -56,9 +56,6 @@ async function main() {
56
56
  }
57
57
  fs.writeFileSync(targetFile, TEMPLATE, "utf-8");
58
58
  console.log(`\u2705 Success! Created ${targetFile}`);
59
- console.log("");
60
- console.log("You can now import and render <FileManagerDemo /> anywhere in your application.");
61
- console.log("Don't forget to configure your Tailwind CSS content to scan the library for styles!");
62
59
  process.exit(0);
63
60
  }
64
61
  console.log(`
@@ -69,12 +66,11 @@ async function main() {
69
66
  console.log(" 2) Vite (React, Tailwind v4)");
70
67
  console.log(" 3) Cancel");
71
68
  const choice = await askQuestion("\nSelect an option (1-3): ");
69
+ rl.close();
72
70
  const targetDir = path.join(process.cwd(), projectName);
73
71
  if (fs.existsSync(targetDir)) {
74
72
  console.error(`
75
- \u274C Error: Directory "${projectName}" already exists in ${process.cwd()}.`);
76
- console.error(` Please choose a different project name or delete the existing directory first.`);
77
- rl.close();
73
+ \u274C Error: Directory "${projectName}" already exists.`);
78
74
  process.exit(1);
79
75
  }
80
76
  try {
@@ -93,9 +89,9 @@ async function main() {
93
89
  process.exit(0);
94
90
  }
95
91
  async function scaffoldNextjs(projectName2, targetDir) {
96
- console.log("\n\u{1F4E6} Creating Next.js application (this may take a minute)...");
92
+ console.log("\n\u{1F4E6} Creating Next.js application...");
97
93
  execSync(`npx create-next-app@latest ${projectName2} --ts --tailwind --eslint --app --src-dir --import-alias "@/*" --use-npm`, { stdio: "inherit" });
98
- console.log("\n\u{1F4E6} Installing dependencies (@unciatech/file-manager, tailwindcss-animate)...");
94
+ console.log("\n\u{1F4E6} Installing dependencies...");
99
95
  execSync("npm install @unciatech/file-manager tailwindcss-animate", { cwd: targetDir, stdio: "inherit" });
100
96
  const componentsDir = path.join(targetDir, "src", "components");
101
97
  if (!fs.existsSync(componentsDir)) fs.mkdirSync(componentsDir, { recursive: true });
@@ -110,153 +106,22 @@ export default function Home() {
110
106
  </main>
111
107
  );
112
108
  }
113
- `);
114
- const mediaRouteDir = path.join(targetDir, "src", "app", "media", "[[...path]]");
115
- fs.mkdirSync(mediaRouteDir, { recursive: true });
116
- fs.writeFileSync(
117
- path.join(mediaRouteDir, "page.tsx"),
118
- `import FileManagerDemo from "@/components/FileManagerDemo";
119
-
120
- export default function MediaPage() {
121
- return (
122
- <main className="min-h-screen bg-neutral-50">
123
- <FileManagerDemo />
124
- </main>
125
- );
126
- }
127
- `
128
- );
129
- const layoutPath = path.join(targetDir, "src", "app", "layout.tsx");
130
- if (fs.existsSync(layoutPath)) {
131
- let layoutContent = fs.readFileSync(layoutPath, "utf8");
132
- if (!layoutContent.includes("@unciatech/file-manager/styles")) {
133
- layoutContent = layoutContent.replace(
134
- /^(import type)/m,
135
- `import '@unciatech/file-manager/styles';
136
- $1`
137
- );
138
- fs.writeFileSync(layoutPath, layoutContent);
139
- }
140
- }
141
- const cssPath = path.join(targetDir, "src", "app", "globals.css");
142
- fs.writeFileSync(cssPath, `@import 'tailwindcss';
143
- @import 'tw-animate-css';
144
- @source "../../node_modules/@unciatech/file-manager/dist";
145
-
146
- /** Dark Mode Variant **/
147
- @custom-variant dark (&:is(.dark *));
148
-
149
- @theme {
150
- --font-sans: 'Geist', 'Geist Fallback', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
151
- --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
152
- }
153
-
154
- /** Colors **/
155
- :root {
156
- --background: var(--color-white);
157
- --foreground: var(--color-zinc-950);
158
- --card: var(--color-white);
159
- --card-foreground: var(--color-zinc-950);
160
- --popover: var(--color-white);
161
- --popover-foreground: var(--color-zinc-950);
162
- --primary: var(--color-blue-500);
163
- --primary-foreground: var(--color-white);
164
- --secondary: var(--color-zinc-100);
165
- --secondary-foreground: var(--color-zinc-900);
166
- --muted: var(--color-zinc-100);
167
- --muted-foreground: var(--color-zinc-500);
168
- --accent: var(--color-zinc-100);
169
- --accent-foreground: var(--color-zinc-900);
170
- --destructive: var(--color-red-600);
171
- --destructive-foreground: var(--color-white);
172
- --border: oklch(94% 0.004 286.32);
173
- --input: var(--color-zinc-200);
174
- --ring: var(--color-zinc-400);
175
- --radius: 0.5rem;
176
- }
177
-
178
- .dark {
179
- --background: var(--color-zinc-950);
180
- --foreground: var(--color-zinc-50);
181
- --card: var(--color-zinc-950);
182
- --card-foreground: var(--color-zinc-50);
183
- --popover: var(--color-zinc-950);
184
- --popover-foreground: var(--color-zinc-50);
185
- --primary: var(--color-blue-600);
186
- --primary-foreground: var(--color-white);
187
- --secondary: var(--color-zinc-800);
188
- --secondary-foreground: var(--color-zinc-50);
189
- --muted: var(--color-zinc-900);
190
- --muted-foreground: var(--color-zinc-500);
191
- --accent: var(--color-zinc-900);
192
- --accent-foreground: var(--color-zinc-50);
193
- --destructive: var(--color-red-600);
194
- --destructive-foreground: var(--color-white);
195
- --border: var(--color-zinc-800);
196
- --input: var(--color-zinc-800);
197
- --ring: var(--color-zinc-600);
198
- }
199
-
200
- /** Theme Setup **/
201
- @theme inline {
202
- --color-background: var(--background);
203
- --color-foreground: var(--foreground);
204
- --color-card: var(--card);
205
- --color-card-foreground: var(--card-foreground);
206
- --color-popover: var(--popover);
207
- --color-popover-foreground: var(--popover-foreground);
208
- --color-muted: var(--muted);
209
- --color-muted-foreground: var(--muted-foreground);
210
- --color-accent: var(--accent);
211
- --color-accent-foreground: var(--accent-foreground);
212
- --color-primary: var(--primary);
213
- --color-primary-foreground: var(--primary-foreground);
214
- --color-secondary: var(--secondary);
215
- --color-secondary-foreground: var(--secondary-foreground);
216
- --color-destructive: var(--destructive);
217
- --color-destructive-foreground: var(--destructive-foreground);
218
- --color-border: var(--border);
219
- --color-input: var(--input);
220
- --color-ring: var(--ring);
221
- --radius-xl: calc(var(--radius) + 4px);
222
- --radius-lg: var(--radius);
223
- --radius-md: calc(var(--radius) - 2px);
224
- --radius-sm: calc(var(--radius) - 4px);
225
- }
226
-
227
- /** Global Styles **/
228
- @layer base {
229
- * {
230
- @apply border-border;
231
- }
232
- *:focus-visible {
233
- @apply outline-ring rounded-xs shadow-none outline-2 outline-offset-3 transition-none!;
234
- }
235
- }
236
-
237
- /** Custom Scrollbar **/
238
- @layer base {
239
- ::-webkit-scrollbar { width: 5px; }
240
- ::-webkit-scrollbar-track { background: transparent; }
241
- ::-webkit-scrollbar-thumb { background: var(--input); border-radius: 5px; }
242
- * { scrollbar-width: thin; scrollbar-color: var(--input) transparent; }
243
- }
244
-
245
- /** Smooth scroll **/
246
- html {
247
- scroll-behavior: smooth;
248
- }
249
109
  `);
250
110
  printSuccess(projectName2);
251
111
  }
252
112
  async function scaffoldVite(projectName2, targetDir) {
253
113
  console.log("\n\u{1F4E6} Creating Vite React application...");
254
114
  execSync(`npm create vite@latest ${projectName2} -- --template react-ts`, { stdio: "inherit" });
255
- console.log("\n\u{1F4E6} Installing dependencies (Tailwind + File Manager)...");
115
+ console.log("\n\u{1F4E6} Installing dependencies...");
256
116
  execSync("npm install", { cwd: targetDir, stdio: "inherit" });
257
- execSync("npm install tailwindcss @tailwindcss/vite @unciatech/file-manager", { cwd: targetDir, stdio: "inherit" });
117
+ execSync(
118
+ "npm install tailwindcss @tailwindcss/vite @unciatech/file-manager tw-animate-css",
119
+ { cwd: targetDir, stdio: "inherit" }
120
+ );
258
121
  const viteConfigPath = path.join(targetDir, "vite.config.ts");
259
- const viteConfig = `import { defineConfig } from 'vite'
122
+ fs.writeFileSync(
123
+ viteConfigPath,
124
+ `import { defineConfig } from 'vite'
260
125
  import react from '@vitejs/plugin-react'
261
126
  import tailwindcss from '@tailwindcss/vite'
262
127
 
@@ -266,26 +131,39 @@ export default defineConfig({
266
131
  tailwindcss(),
267
132
  ],
268
133
  })
269
- `;
270
- fs.writeFileSync(viteConfigPath, viteConfig);
134
+ `
135
+ );
271
136
  const cssPath = path.join(targetDir, "src", "index.css");
272
- fs.writeFileSync(cssPath, `@import "tailwindcss";
273
- @source "../node_modules/@unciatech/file-manager/dist";
274
- `);
137
+ fs.writeFileSync(
138
+ cssPath,
139
+ `@import "tailwindcss";
140
+ @import "tw-animate-css";
141
+
142
+ @source "../node_modules/@unciatech/file-manager/dist/**/*.{js,ts,jsx,tsx}";
143
+ `
144
+ );
275
145
  const mainPath = path.join(targetDir, "src", "main.tsx");
276
146
  if (fs.existsSync(mainPath)) {
277
147
  let mainContent = fs.readFileSync(mainPath, "utf8");
278
148
  if (!mainContent.includes("@unciatech/file-manager/styles")) {
279
- mainContent = `import '@unciatech/file-manager/styles';
149
+ mainContent = `import "@unciatech/file-manager/styles";
280
150
  ` + mainContent;
281
151
  fs.writeFileSync(mainPath, mainContent);
282
152
  }
283
153
  }
284
154
  const componentsDir = path.join(targetDir, "src", "components");
285
- if (!fs.existsSync(componentsDir)) fs.mkdirSync(componentsDir, { recursive: true });
286
- fs.writeFileSync(path.join(componentsDir, "FileManagerDemo.tsx"), TEMPLATE, "utf-8");
155
+ if (!fs.existsSync(componentsDir)) {
156
+ fs.mkdirSync(componentsDir, { recursive: true });
157
+ }
158
+ fs.writeFileSync(
159
+ path.join(componentsDir, "FileManagerDemo.tsx"),
160
+ TEMPLATE,
161
+ "utf-8"
162
+ );
287
163
  const appPath = path.join(targetDir, "src", "App.tsx");
288
- fs.writeFileSync(appPath, `import FileManagerDemo from "./components/FileManagerDemo";
164
+ fs.writeFileSync(
165
+ appPath,
166
+ `import FileManagerDemo from "./components/FileManagerDemo";
289
167
 
290
168
  function App() {
291
169
  return (
@@ -296,8 +174,9 @@ function App() {
296
174
  }
297
175
 
298
176
  export default App;
299
- `);
300
- printSuccess(projectName2, "npm run dev");
177
+ `
178
+ );
179
+ printSuccess(projectName2);
301
180
  }
302
181
  function printSuccess(projectName2, devCmd = "npm run dev") {
303
182
  console.log("\n=========================================");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unciatech/file-manager",
3
- "version": "0.0.29",
3
+ "version": "0.0.31",
4
4
  "description": "Modern file manager component for React and Next.js",
5
5
  "author": "Avi",
6
6
  "license": "MIT",