create-oven 0.3.0 → 0.3.1

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 (2) hide show
  1. package/index.js +119 -41
  2. package/package.json +1 -1
package/index.js CHANGED
@@ -88,14 +88,14 @@ async function main() {
88
88
  }
89
89
 
90
90
  if (args.includes('--version') || args.includes('-v')) {
91
- console.log('create-oven v0.3.0');
91
+ console.log('create-oven v0.3.1');
92
92
  process.exit(0);
93
93
  }
94
94
 
95
95
  console.log(`
96
96
  ${c.bold}${c.cyan} ╔═══════════════════════════════════════╗
97
97
  ║ ║
98
- ║ 🔥 Create Oven App v0.3.0
98
+ ║ 🔥 Create Oven App v0.3.1
99
99
  ║ ║
100
100
  ║ Next.js-style framework for Bun ║
101
101
  ║ ║
@@ -157,6 +157,16 @@ ${c.bold}${c.cyan} ╔═══════════════════
157
157
  fs.mkdirSync(path.join(projectDir, 'app'), { recursive: true });
158
158
  fs.mkdirSync(path.join(projectDir, 'public'), { recursive: true });
159
159
 
160
+ // ============ public/oven.svg ============
161
+ fs.writeFileSync(path.join(projectDir, 'public', 'oven.svg'), `<svg width="100" height="24" viewBox="0 0 100 24" fill="none" xmlns="http://www.w3.org/2000/svg">
162
+ <text x="0" y="20" font-family="system-ui, sans-serif" font-size="20" font-weight="bold" fill="currentColor">🔥 Oven</text>
163
+ </svg>`);
164
+
165
+ // ============ public/github.svg ============
166
+ fs.writeFileSync(path.join(projectDir, 'public', 'github.svg'), `<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
167
+ <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
168
+ </svg>`);
169
+
160
170
  // ============ package.json ============
161
171
  const spin1 = spinner('Creating package.json...');
162
172
  const pkg = {
@@ -283,31 +293,34 @@ body {
283
293
  const spin6 = spinner(`Creating app/layout.${ext}...`);
284
294
  const layoutContent = useTypescript ? `import "./globals.css";
285
295
 
286
- export const metadata = {
296
+ export const metadata${useTypescript ? ': { title: string; description: string }' : ''} = {
287
297
  title: "Create Oven App",
288
298
  description: "Generated by create-oven",
289
299
  };
290
300
 
291
301
  export default function RootLayout({
292
302
  children,
293
- }: {
303
+ }: Readonly<{
294
304
  children: string;
295
- }) {
296
- return \`
297
- <!DOCTYPE html>
305
+ }>) {
306
+ return (
307
+ \`<!DOCTYPE html>
298
308
  <html lang="en">
299
309
  <head>
300
- <meta charset="UTF-8">
301
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
310
+ <meta charset="UTF-8" />
311
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
302
312
  <title>\${metadata.title}</title>
303
- <meta name="description" content="\${metadata.description}">
304
- <link rel="icon" href="/favicon.ico">
313
+ <meta name="description" content="\${metadata.description}" />
314
+ <link rel="icon" href="/favicon.ico" />
315
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
316
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
317
+ <link href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono&display=swap" rel="stylesheet" />
305
318
  </head>
306
- <body>
319
+ <body class="antialiased" style="font-family: 'Geist', sans-serif;">
307
320
  \${children}
308
321
  </body>
309
- </html>
310
- \`;
322
+ </html>\`
323
+ );
311
324
  }
312
325
  ` : `import "./globals.css";
313
326
 
@@ -317,21 +330,24 @@ export const metadata = {
317
330
  };
318
331
 
319
332
  export default function RootLayout({ children }) {
320
- return \`
321
- <!DOCTYPE html>
333
+ return (
334
+ \`<!DOCTYPE html>
322
335
  <html lang="en">
323
336
  <head>
324
- <meta charset="UTF-8">
325
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
337
+ <meta charset="UTF-8" />
338
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
326
339
  <title>\${metadata.title}</title>
327
- <meta name="description" content="\${metadata.description}">
328
- <link rel="icon" href="/favicon.ico">
340
+ <meta name="description" content="\${metadata.description}" />
341
+ <link rel="icon" href="/favicon.ico" />
342
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
343
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
344
+ <link href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono&display=swap" rel="stylesheet" />
329
345
  </head>
330
- <body>
346
+ <body class="antialiased" style="font-family: 'Geist', sans-serif;">
331
347
  \${children}
332
348
  </body>
333
- </html>
334
- \`;
349
+ </html>\`
350
+ );
335
351
  }
336
352
  `;
337
353
  fs.writeFileSync(path.join(projectDir, 'app', `layout.${ext}`), layoutContent);
@@ -339,41 +355,103 @@ export default function RootLayout({ children }) {
339
355
 
340
356
  // ============ app/page.tsx ============
341
357
  const spin7 = spinner(`Creating app/page.${ext}...`);
342
- const tailwindClasses = useTailwind;
343
- const pageContent = `export default function Home() {
344
- return \`
345
- <div ${tailwindClasses ? 'class="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black"' : 'style="display: flex; min-height: 100vh; align-items: center; justify-content: center; background: #fafafa;"'}>
346
- <main ${tailwindClasses ? 'class="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black"' : 'style="display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 48rem; padding: 8rem 4rem; background: white;"'}>
347
- <div ${tailwindClasses ? 'class="text-6xl mb-8"' : 'style="font-size: 4rem; margin-bottom: 2rem;"'}>🔥</div>
348
-
349
- <div ${tailwindClasses ? 'class="flex flex-col items-center gap-6 text-center"' : 'style="display: flex; flex-direction: column; align-items: center; gap: 1.5rem; text-align: center;"'}>
350
- <h1 ${tailwindClasses ? 'class="text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50"' : 'style="font-size: 1.875rem; font-weight: 600; line-height: 2.5rem; color: black;"'}>
351
- Welcome to Oven
358
+ const pageContent = useTailwind ? `export default function Home() {
359
+ return (
360
+ \`<div class="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
361
+ <main class="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
362
+ <img
363
+ class="dark:invert"
364
+ src="/oven.svg"
365
+ alt="Oven logo"
366
+ width="100"
367
+ height="24"
368
+ />
369
+ <div class="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
370
+ <h1 class="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
371
+ Get started by editing app/page.${ext}
352
372
  </h1>
353
- <p ${tailwindClasses ? 'class="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400"' : 'style="max-width: 28rem; font-size: 1.125rem; line-height: 2rem; color: #666;"'}>
354
- Get started by editing <code ${tailwindClasses ? 'class="bg-zinc-100 dark:bg-zinc-800 px-2 py-1 rounded"' : 'style="background: #f5f5f5; padding: 0.25rem 0.5rem; border-radius: 4px;"'}>app/page.${ext}</code>
373
+ <p class="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
374
+ Looking for a starting point? Head over to the{" "}
375
+ <a
376
+ href="https://github.com/oven-ttta/oven-framework"
377
+ class="font-medium text-zinc-950 dark:text-zinc-50"
378
+ >
379
+ Documentation
380
+ </a>{" "}
381
+ or{" "}
382
+ <a
383
+ href="https://bun.sh/docs"
384
+ class="font-medium text-zinc-950 dark:text-zinc-50"
385
+ >
386
+ Bun Docs
387
+ </a>.
355
388
  </p>
356
389
  </div>
357
-
358
- <div ${tailwindClasses ? 'class="flex flex-col gap-4 text-base font-medium sm:flex-row mt-8"' : 'style="display: flex; gap: 1rem; margin-top: 2rem;"'}>
390
+ <div class="flex flex-col gap-4 text-base font-medium sm:flex-row">
391
+ <a
392
+ class="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
393
+ href="https://github.com/oven-ttta/oven-framework"
394
+ target="_blank"
395
+ rel="noopener noreferrer"
396
+ style="background: #171717; color: white;"
397
+ >
398
+ <img
399
+ class="dark:invert"
400
+ src="/github.svg"
401
+ alt="GitHub"
402
+ width="16"
403
+ height="16"
404
+ />
405
+ GitHub
406
+ </a>
407
+ <a
408
+ class="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
409
+ href="https://bun.sh/docs"
410
+ target="_blank"
411
+ rel="noopener noreferrer"
412
+ >
413
+ Bun Docs
414
+ </a>
415
+ </div>
416
+ </main>
417
+ </div>\`
418
+ );
419
+ }
420
+ ` : `export default function Home() {
421
+ return (
422
+ \`<div style="display: flex; min-height: 100vh; align-items: center; justify-content: center; background: #fafafa;">
423
+ <main style="display: flex; flex-direction: column; align-items: center; justify-content: space-between; max-width: 48rem; padding: 8rem 4rem; background: white;">
424
+ <div style="font-size: 4rem; margin-bottom: 2rem;">🔥</div>
425
+ <div style="display: flex; flex-direction: column; align-items: center; gap: 1.5rem; text-align: center;">
426
+ <h1 style="font-size: 1.875rem; font-weight: 600; line-height: 2.5rem; color: black;">
427
+ Get started by editing app/page.${ext}
428
+ </h1>
429
+ <p style="max-width: 28rem; font-size: 1.125rem; line-height: 2rem; color: #666;">
430
+ Looking for a starting point? Head over to the
431
+ <a href="https://github.com/oven-ttta/oven-framework" style="font-weight: 500; color: black;">Documentation</a>
432
+ or
433
+ <a href="https://bun.sh/docs" style="font-weight: 500; color: black;">Bun Docs</a>.
434
+ </p>
435
+ </div>
436
+ <div style="display: flex; gap: 1rem; margin-top: 2rem;">
359
437
  <a
360
- ${tailwindClasses ? 'class="flex h-12 items-center justify-center gap-2 rounded-full bg-black text-white px-6 hover:bg-zinc-800 transition-colors"' : 'style="display: flex; height: 3rem; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 9999px; background: black; color: white; padding: 0 1.5rem; text-decoration: none;"'}
361
438
  href="https://github.com/oven-ttta/oven-framework"
362
439
  target="_blank"
440
+ style="display: flex; height: 3rem; align-items: center; justify-content: center; gap: 0.5rem; border-radius: 9999px; background: black; color: white; padding: 0 1.5rem; text-decoration: none;"
363
441
  >
364
442
  GitHub
365
443
  </a>
366
444
  <a
367
- ${tailwindClasses ? 'class="flex h-12 items-center justify-center rounded-full border border-zinc-200 dark:border-zinc-700 px-6 hover:bg-zinc-50 dark:hover:bg-zinc-900 transition-colors"' : 'style="display: flex; height: 3rem; align-items: center; justify-content: center; border-radius: 9999px; border: 1px solid #e5e5e5; padding: 0 1.5rem; text-decoration: none; color: inherit;"'}
368
445
  href="https://bun.sh/docs"
369
446
  target="_blank"
447
+ style="display: flex; height: 3rem; align-items: center; justify-content: center; border-radius: 9999px; border: 1px solid #e5e5e5; padding: 0 1.5rem; text-decoration: none; color: inherit;"
370
448
  >
371
449
  Bun Docs
372
450
  </a>
373
451
  </div>
374
452
  </main>
375
- </div>
376
- \`;
453
+ </div>\`
454
+ );
377
455
  }
378
456
  `;
379
457
  fs.writeFileSync(path.join(projectDir, 'app', `page.${ext}`), pageContent);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-oven",
3
- "version": "0.3.0",
3
+ "version": "0.3.1",
4
4
  "description": "Create a new Oven project - Next.js-style framework for Bun",
5
5
  "type": "module",
6
6
  "bin": {