create-nara 1.0.0 → 1.0.3

package/dist/template.js

@@ -11,12 +11,6 @@ export async function setupProject(options) {
     }
     // 1. Copy base template (shared files like .gitignore, tsconfig, etc)
     copyDir(path.join(templatesDir, 'base'), targetDir);
-    // Rename gitignore.template to .gitignore (npm doesn't include dotfiles)
-    const gitignoreTemplate = path.join(targetDir, 'gitignore.template');
-    const gitignoreDest = path.join(targetDir, '.gitignore');
-    if (fs.existsSync(gitignoreTemplate)) {
-        fs.renameSync(gitignoreTemplate, gitignoreDest);
-    }
     // 2. Copy mode-specific template
     const modeTemplateDir = path.join(templatesDir, mode);
     if (fs.existsSync(modeTemplateDir)) {
@@ -30,7 +24,32 @@ export async function setupProject(options) {
             copyDir(featureDir, targetDir);
         }
     }
-    // 4. Ensure required directories exist
+    // 4. Rename dotfiles (npm doesn't include them by default)
+    // Must happen AFTER all templates are copied
+    const gitignoreTemplate = path.join(targetDir, 'gitignore.template');
+    const gitignoreDest = path.join(targetDir, '.gitignore');
+    if (fs.existsSync(gitignoreTemplate)) {
+        fs.renameSync(gitignoreTemplate, gitignoreDest);
+    }
+    // Rename env files
+    const envFiles = [
+        { src: 'env.example', dest: '.env.example' },
+        { src: 'env.production.example', dest: '.env.production.example' }
+    ];
+    for (const envFile of envFiles) {
+        const envSrc = path.join(targetDir, envFile.src);
+        const envDest = path.join(targetDir, envFile.dest);
+        if (fs.existsSync(envSrc)) {
+            fs.renameSync(envSrc, envDest);
+        }
+    }
+    // Copy .env.example to .env for development convenience
+    const envExample = path.join(targetDir, '.env.example');
+    const envFile = path.join(targetDir, '.env');
+    if (fs.existsSync(envExample)) {
+        fs.copyFileSync(envExample, envFile);
+    }
+    // 5. Ensure required directories exist
     fs.mkdirSync(path.join(targetDir, 'app/controllers'), { recursive: true });
     fs.mkdirSync(path.join(targetDir, 'app/models'), { recursive: true });
     // Create database directory if db feature is selected
@@ -41,7 +60,7 @@ export async function setupProject(options) {
     if (features.includes('uploads')) {
         fs.mkdirSync(path.join(targetDir, 'uploads'), { recursive: true });
     }
-    // 5. Generate package.json (dynamic content)
+    // 6. Generate package.json (dynamic content)
     const pkg = createPackageJson(projectName, mode, features);
     fs.writeFileSync(path.join(targetDir, 'package.json'), JSON.stringify(pkg, null, 2));
 }
@@ -74,6 +93,8 @@ function createPackageJson(name, mode, features) {
         pkg.devDependencies['vite'] = '^6.0.0';
         pkg.devDependencies['@sveltejs/vite-plugin-svelte'] = '^5.0.0';
         pkg.devDependencies['concurrently'] = '^9.0.0';
+        pkg.devDependencies['tailwindcss'] = '^4.0.0';
+        pkg.devDependencies['@tailwindcss/vite'] = '^4.0.0';
     }
     else if (mode === 'vue') {
         pkg.dependencies['@nara-web/inertia-vue'] = '^1.0.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-nara",
-  "version": "1.0.0",
+  "version": "1.0.3",
   "description": "CLI to scaffold NARA projects",
   "type": "module",
   "bin": {

package/templates/svelte/env.example

@@ -0,0 +1,17 @@
+# Application
+PORT=3000
+NODE_ENV=development
+APP_URL=http://localhost:3000
+APP_KEY=change-me-to-random-string
+
+# Database
+DB_CONNECTION=sqlite
+DB_DATABASE=./database/dev.sqlite3
+
+# Authentication (if auth feature enabled)
+JWT_SECRET=change-me-to-random-jwt-secret
+JWT_EXPIRES_IN=7d
+
+# Session
+SESSION_SECRET=change-me-to-random-session-secret
+SESSION_NAME=nara_session

package/templates/svelte/env.production.example

@@ -0,0 +1,17 @@
+# Application
+PORT=3000
+NODE_ENV=production
+APP_URL=https://your-domain.com
+APP_KEY=generate-a-strong-random-key-here
+
+# Database
+DB_CONNECTION=sqlite
+DB_DATABASE=./database/prod.sqlite3
+
+# Authentication (if auth feature enabled)
+JWT_SECRET=generate-a-strong-jwt-secret-here
+JWT_EXPIRES_IN=7d
+
+# Session
+SESSION_SECRET=generate-a-strong-session-secret-here
+SESSION_NAME=nara_session

package/templates/svelte/resources/js/app.ts

@@ -1,3 +1,4 @@
+import './index.css';
 import { createInertiaApp } from '@inertiajs/svelte';
 import { mount } from 'svelte';
 

package/templates/svelte/resources/js/index.css

@@ -0,0 +1,76 @@
+@import url('https://rsms.me/inter/inter.css');
+@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&display=swap');
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  html {
+    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  }
+
+  body::-webkit-scrollbar {
+    width: 4px;
+  }
+
+  body::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  body::-webkit-scrollbar-thumb {
+    background-color: theme('colors.primary.500');
+    border-radius: 3px;
+  }
+}
+
+@layer components {
+  .card-hover {
+    @apply transition-all duration-300 hover:shadow-soft hover:-translate-y-1;
+  }
+
+  .nav-link {
+    @apply px-4 py-2 text-gray-600 dark:text-gray-200 hover:text-gray-900 hover:bg-gray-100 rounded-lg transition-colors duration-300;
+  }
+
+  .nav-link.active {
+    @apply bg-primary-50 dark:bg-gray-800 text-primary-600;
+  }
+
+  .gradient-text {
+    @apply bg-clip-text text-transparent bg-gradient-to-r from-primary-600 to-primary-400;
+  }
+
+  .btn-primary {
+    @apply bg-primary-600 text-white px-4 py-2 rounded-lg hover:bg-primary-700
+           transition-all duration-300 active:bg-primary-800
+           disabled:opacity-50 disabled:cursor-not-allowed
+           focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2;
+  }
+
+  .btn-secondary {
+    @apply bg-white text-gray-900 px-4 py-2 rounded-lg border border-gray-300
+           hover:bg-gray-50 transition-all duration-300 active:bg-gray-100
+           disabled:opacity-50 disabled:cursor-not-allowed
+           focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2;
+  }
+
+  .btn-danger {
+    @apply bg-danger-600 text-white px-4 py-2 rounded-lg hover:bg-danger-700
+           transition-all duration-300 active:bg-danger-800
+           disabled:opacity-50 disabled:cursor-not-allowed
+           focus:outline-none focus:ring-2 focus:ring-danger-500 focus:ring-offset-2;
+  }
+
+  .card {
+    @apply bg-white rounded-xl shadow-soft p-6 transition-all duration-300
+           shadow-lg hover:shadow-xl hover:-translate-y-0.5;
+  }
+
+  .bg-surface {
+    @apply bg-surface-light dark:bg-surface-dark;
+  }
+
+  .bg-surface-card {
+    @apply bg-surface-card-light dark:bg-surface-card-dark;
+  }
+}

package/templates/svelte/tailwind.config.js

@@ -0,0 +1,120 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./resources/**/*.{svelte,html,js,ts}",
+  ],
+  darkMode: 'class',
+  theme: {
+    extend: {
+      fontFamily: {
+        sans: ['Inter var', 'Inter', 'system-ui', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Arial', 'sans-serif'],
+        serif: ['Playfair Display', 'Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif'],
+      },
+      colors: {
+        primary: {
+          50: '#ecfdf5',
+          100: '#d1fae5',
+          200: '#a7f3d0',
+          300: '#6ee7b7',
+          400: '#34d399',
+          500: '#10b981',
+          600: '#059669',
+          700: '#047857',
+          800: '#065f46',
+          900: '#064e3b',
+          950: '#022c22',
+        },
+        secondary: {
+          50: '#fffbeb',
+          100: '#fef3c7',
+          200: '#fde68a',
+          300: '#fcd34d',
+          400: '#fbbf24',
+          500: '#f59e0b',
+          600: '#d97706',
+          700: '#b45309',
+          800: '#92400e',
+          900: '#78350f',
+          950: '#451a03',
+        },
+        accent: {
+          50: '#faf5ff',
+          100: '#f3e8ff',
+          200: '#e9d5ff',
+          300: '#d8b4fe',
+          400: '#c084fc',
+          500: '#a855f7',
+          600: '#9333ea',
+          700: '#7c3aed',
+          800: '#6b21a8',
+          900: '#581c87',
+          950: '#3b0764',
+        },
+        info: {
+          50: '#ecfeff',
+          100: '#cffafe',
+          200: '#a5f3fc',
+          300: '#67e8f9',
+          400: '#22d3ee',
+          500: '#06b6d4',
+          600: '#0891b2',
+          700: '#0e7490',
+          800: '#155e75',
+          900: '#164e63',
+          950: '#083344',
+        },
+        warning: {
+          50: '#fff7ed',
+          100: '#ffedd5',
+          200: '#fed7aa',
+          300: '#fdba74',
+          400: '#fb923c',
+          500: '#f97316',
+          600: '#ea580c',
+          700: '#c2410c',
+          800: '#9a3412',
+          900: '#7c2d12',
+          950: '#431407',
+        },
+        danger: {
+          50: '#fef2f2',
+          100: '#fee2e2',
+          200: '#fecaca',
+          300: '#fca5a5',
+          400: '#f87171',
+          500: '#ef4444',
+          600: '#dc2626',
+          700: '#b91c1c',
+          800: '#991b1b',
+          900: '#7f1d1d',
+          950: '#450a0a',
+        },
+        success: {
+          50: '#ecfdf5',
+          100: '#d1fae5',
+          200: '#a7f3d0',
+          300: '#6ee7b7',
+          400: '#34d399',
+          500: '#10b981',
+          600: '#059669',
+          700: '#047857',
+          800: '#065f46',
+          900: '#064e3b',
+          950: '#022c22',
+        },
+        surface: {
+          light: '#f8f8f8',
+          dark: '#0a0a0a',
+          card: {
+            light: '#f1f5f9',
+            dark: '#0f0f0f',
+          }
+        },
+      },
+      boxShadow: {
+        'soft': '0 2px 15px -3px rgba(0, 0, 0, 0.07), 0 10px 20px -2px rgba(0, 0, 0, 0.04)',
+      },
+    },
+  },
+  plugins: [],
+}

package/templates/svelte/vite.config.ts

@@ -1,9 +1,10 @@
 import { defineConfig } from 'vite';
 import { svelte } from '@sveltejs/vite-plugin-svelte';
+import tailwindcss from '@tailwindcss/vite';
 import path from 'path';
 
 export default defineConfig({
-  plugins: [svelte()],
+  plugins: [svelte(), tailwindcss()],
   resolve: {
     alias: {
       '@': path.resolve(__dirname, './resources/js')