@digilogiclabs/create-saas-app 1.1.0

package/package.json

@@ -0,0 +1,105 @@
+{
+  "name": "@digilogiclabs/create-saas-app",
+  "version": "1.1.0",
+  "description": "Create modern SaaS applications with DigitalLogic Labs packages",
+  "main": "dist/cli/index.js",
+  "bin": {
+    "create-saas-app": "bin/index.js"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "test:templates": "tsx scripts/test-all-templates.ts",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:fix": "eslint src --ext .ts,.tsx --fix",
+    "type-check": "tsc --noEmit",
+    "validate": "tsx scripts/validate-templates.ts",
+    "update-deps": "tsx scripts/update-dependencies.ts",
+    "changeset": "changeset",
+    "version": "changeset version",
+    "release": "npm run build && changeset publish",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "cli",
+    "saas",
+    "template",
+    "nextjs",
+    "react-native",
+    "expo",
+    "typescript",
+    "tailwind",
+    "firebase",
+    "supabase",
+    "digilogiclabs"
+  ],
+  "author": "DigitalLogic Labs",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/DigiLogicLabs/create-saas-app.git"
+  },
+  "bugs": {
+    "url": "https://github.com/DigiLogicLabs/create-saas-app/issues"
+  },
+  "homepage": "https://github.com/DigiLogicLabs/create-saas-app#readme",
+  "files": [
+    "dist",
+    "bin",
+    "src/templates",
+    "README.md",
+    "CHANGELOG.md"
+  ],
+  "engines": {
+    "node": ">=16.0.0"
+  },
+  "dependencies": {
+    "commander": "^11.1.0",
+    "inquirer": "^9.2.12",
+    "chalk": "^5.3.0",
+    "ora": "^7.0.1",
+    "mustache": "^4.2.0",
+    "fs-extra": "^11.1.1",
+    "glob": "^10.3.10",
+    "semver": "^7.5.4",
+    "validate-npm-package-name": "^5.0.0",
+    "execa": "^8.0.1",
+    "listr2": "^7.0.2",
+    "cosmiconfig": "^8.3.6",
+    "zod": "^3.22.4"
+  },
+  "devDependencies": {
+    "@types/node": "^20.8.7",
+    "@types/inquirer": "^9.0.7",
+    "@types/mustache": "^4.2.5",
+    "@types/fs-extra": "^11.0.4",
+    "@types/semver": "^7.5.4",
+    "@types/validate-npm-package-name": "^4.0.2",
+    "@types/jest": "^29.5.6",
+    "@typescript-eslint/eslint-plugin": "^6.9.0",
+    "@typescript-eslint/parser": "^6.9.0",
+    "@changesets/cli": "^2.26.2",
+    "eslint": "^8.52.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-prettier": "^5.0.1",
+    "jest": "^29.7.0",
+    "ts-jest": "^29.1.1",
+    "tsx": "^3.14.0",
+    "tsup": "^7.2.0",
+    "typescript": "^5.2.2",
+    "prettier": "^3.0.3"
+  },
+  "peerDependencies": {
+    "typescript": ">=4.9.0"
+  },
+  "publishConfig": {
+    "access": "restricted"
+  },
+  "directories": {
+    "doc": "docs",
+    "test": "tests"
+  }
+}

package/src/templates/mobile/base/template/App.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+import { StatusBar } from 'expo-status-bar';
+import { StyleSheet, Text, View } from 'react-native';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+
+export default function App() {
+  return (
+    <SafeAreaProvider>
+      <View style={styles.container}>
+        <Text style={styles.title}>Welcome to {{titleCaseName}}</Text>
+        <Text style={styles.subtitle}>{{description}}</Text>
+        <Text style={styles.description}>
+          Built with Expo and DigitalLogic Labs packages
+        </Text>
+        <StatusBar style="auto" />
+      </View>
+    </SafeAreaProvider>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 20,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    marginBottom: 10,
+    textAlign: 'center',
+  },
+  subtitle: {
+    fontSize: 16,
+    color: '#666',
+    marginBottom: 20,
+    textAlign: 'center',
+  },
+  description: {
+    fontSize: 14,
+    color: '#999',
+    textAlign: 'center',
+  },
+});
+

package/src/templates/mobile/base/template/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "{{packageName}}",
+  "version": "1.0.0",
+  "description": "{{description}}",
+  "main": "node_modules/expo/AppEntry.js",
+  "scripts": {
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web",
+    "build": "expo build",
+    "eject": "expo eject"
+  },
+  "dependencies": {
+    "expo": "~49.0.0",
+    "react": "18.2.0",
+    "react-native": "0.72.6",
+    "@expo/vector-icons": "^13.0.0",
+    "@react-navigation/native": "^6.1.0",
+    "@react-navigation/stack": "^6.3.0",
+    "@react-navigation/bottom-tabs": "^6.5.0",
+    "react-native-screens": "~3.22.0",
+    "react-native-safe-area-context": "4.6.3",
+    "react-native-gesture-handler": "~2.12.0",
+    "@digilogiclabs/saas-factory-ui": "^1.0.0",
+    "@digilogiclabs/saas-factory-auth": "^1.0.0"{{#auth}}{{#firebase}},
+    "firebase": "^10.0.0"{{/firebase}}{{#supabase}},
+    "@supabase/supabase-js": "^2.0.0"{{/supabase}}{{/auth}}
+  },
+  "devDependencies": {
+    "@babel/core": "^7.20.0",
+    "@types/react": "~18.2.14",
+    "@types/react-native": "~0.72.2",
+    "typescript": "^5.1.3"
+  },
+  "private": true
+}
+

package/src/templates/shared/auth/firebase/web/config.ts

@@ -0,0 +1,24 @@
+import { initializeApp } from 'firebase/app';
+import { getAuth } from 'firebase/auth';
+import { getFirestore } from 'firebase/firestore';
+
+const firebaseConfig = {
+  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
+  authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
+  projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
+  storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET,
+  messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID,
+  appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID,
+};
+
+// Initialize Firebase
+const app = initializeApp(firebaseConfig);
+
+// Initialize Firebase Authentication and get a reference to the service
+export const auth = getAuth(app);
+
+// Initialize Cloud Firestore and get a reference to the service
+export const db = getFirestore(app);
+
+export default app;
+

package/src/templates/shared/auth/supabase/web/config.ts

@@ -0,0 +1,9 @@
+import { createClient } from '@supabase/supabase-js';
+
+const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL!;
+const supabaseAnonKey = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!;
+
+export const supabase = createClient(supabaseUrl, supabaseAnonKey);
+
+export default supabase;
+

package/src/templates/web/base/template/.env.example

@@ -0,0 +1,34 @@
+# App Configuration
+NEXT_PUBLIC_APP_NAME={{projectName}}
+NEXT_PUBLIC_APP_URL=http://localhost:3000
+
+{{#auth}}
+{{#firebase}}
+# Firebase Configuration
+NEXT_PUBLIC_FIREBASE_API_KEY=your_firebase_api_key
+NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
+NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
+NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_project.appspot.com
+NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
+NEXT_PUBLIC_FIREBASE_APP_ID=your_app_id
+{{/firebase}}
+{{#supabase}}
+# Supabase Configuration
+NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
+NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
+{{/supabase}}
+{{/auth}}
+
+# Database Configuration
+{{#database}}
+{{#supabase}}
+DATABASE_URL=your_database_url
+{{/supabase}}
+{{#firebase}}
+# Firebase Admin (Server-side)
+FIREBASE_ADMIN_PROJECT_ID=your_project_id
+FIREBASE_ADMIN_CLIENT_EMAIL=your_service_account_email
+FIREBASE_ADMIN_PRIVATE_KEY=your_private_key
+{{/firebase}}
+{{/database}}
+

package/src/templates/web/base/template/.eslintrc.js

@@ -0,0 +1,8 @@
+/** @type {import('eslint').Linter.Config} */
+module.exports = {
+  extends: ['next/core-web-vitals'],
+  rules: {
+    // Add any custom rules here
+  },
+}
+

package/src/templates/web/base/template/README.md

@@ -0,0 +1,68 @@
+# {{titleCaseName}}
+
+{{description}}
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+## Features
+
+- ⚡ **Next.js 14** - React framework with App Router
+- 🎨 **Tailwind CSS** - Utility-first CSS framework
+- 🔒 **{{#auth}}{{#firebase}}Firebase{{/firebase}}{{#supabase}}Supabase{{/supabase}}{{/auth}} Auth** - Authentication ready
+- 📱 **Responsive Design** - Mobile-first approach
+- 🌙 **Dark Mode** - Built-in theme switching
+- 📦 **TypeScript** - Type-safe development
+- 🎯 **ESLint & Prettier** - Code quality tools
+
+## Project Structure
+
+```
+src/
+├── app/                 # Next.js App Router
+│   ├── globals.css     # Global styles
+│   ├── layout.tsx      # Root layout
+│   └── page.tsx        # Home page
+├── components/         # React components
+│   ├── ui/            # UI components
+│   └── providers/     # Context providers
+├── lib/               # Utility functions
+├── hooks/             # Custom React hooks
+└── types/             # TypeScript definitions
+```
+
+## Environment Variables
+
+Copy `.env.example` to `.env.local` and fill in your configuration:
+
+```bash
+cp .env.example .env.local
+```
+
+## Deployment
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new).
+
+Check out the [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+
+## Learn More
+
+- [Next.js Documentation](https://nextjs.org/docs)
+- [Tailwind CSS Documentation](https://tailwindcss.com/docs)
+- [{{#auth}}{{#firebase}}Firebase Documentation{{/firebase}}{{#supabase}}Supabase Documentation{{/supabase}}{{/auth}}]({{#auth}}{{#firebase}}https://firebase.google.com/docs{{/firebase}}{{#supabase}}https://supabase.com/docs{{/supabase}}{{/auth}})
+
+## Support
+
+For support, email support@digilogiclabs.com or join our Discord community.
+

package/src/templates/web/base/template/next.config.js

@@ -0,0 +1,15 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  experimental: {
+    appDir: true,
+  },
+  images: {
+    domains: ['localhost'],
+  },
+  env: {
+    CUSTOM_KEY: process.env.CUSTOM_KEY,
+  },
+}
+
+module.exports = nextConfig
+

package/src/templates/web/base/template/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "{{packageName}}",
+  "version": "0.1.0",
+  "description": "{{description}}",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "type-check": "tsc --noEmit"
+  },
+  "dependencies": {
+    "next": "^14.0.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "@digilogiclabs/saas-factory-ui": "^1.0.0",
+    "@digilogiclabs/saas-factory-auth": "^1.0.0",
+    "tailwindcss": "^3.3.0",
+    "autoprefixer": "^10.4.16",
+    "postcss": "^8.4.31",
+    "clsx": "^2.0.0",
+    "class-variance-authority": "^0.7.0",
+    "tailwind-merge": "^2.0.0",
+    "next-themes": "^0.2.1",
+    "@radix-ui/react-slot": "^1.0.2",
+    "tailwindcss-animate": "^1.0.7",
+    "lucide-react": "^0.292.0"{{#auth}}{{#firebase}},
+    "firebase": "^10.0.0"{{/firebase}}{{#supabase}},
+    "@supabase/supabase-js": "^2.0.0"{{/supabase}}{{/auth}}
+  },
+  "devDependencies": {
+    "typescript": "^5.0.0",
+    "@types/node": "^20.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "eslint": "^8.0.0",
+    "eslint-config-next": "^14.0.0",
+    "@typescript-eslint/eslint-plugin": "^6.0.0",
+    "@typescript-eslint/parser": "^6.0.0",
+    "prettier": "^3.0.0",
+    "prettier-plugin-tailwindcss": "^0.5.0"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}
+

package/src/templates/web/base/template/postcss.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}
+

package/src/templates/web/base/template/src/app/globals.css

@@ -0,0 +1,60 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 222.2 84% 4.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 222.2 84% 4.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 222.2 84% 4.9%;
+    --primary: 221.2 83.2% 53.3%;
+    --primary-foreground: 210 40% 98%;
+    --secondary: 210 40% 96%;
+    --secondary-foreground: 222.2 84% 4.9%;
+    --muted: 210 40% 96%;
+    --muted-foreground: 215.4 16.3% 46.9%;
+    --accent: 210 40% 96%;
+    --accent-foreground: 222.2 84% 4.9%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 214.3 31.8% 91.4%;
+    --input: 214.3 31.8% 91.4%;
+    --ring: 221.2 83.2% 53.3%;
+    --radius: 0.5rem;
+  }
+
+  .dark {
+    --background: 222.2 84% 4.9%;
+    --foreground: 210 40% 98%;
+    --card: 222.2 84% 4.9%;
+    --card-foreground: 210 40% 98%;
+    --popover: 222.2 84% 4.9%;
+    --popover-foreground: 210 40% 98%;
+    --primary: 217.2 91.2% 59.8%;
+    --primary-foreground: 222.2 84% 4.9%;
+    --secondary: 217.2 32.6% 17.5%;
+    --secondary-foreground: 210 40% 98%;
+    --muted: 217.2 32.6% 17.5%;
+    --muted-foreground: 215 20.2% 65.1%;
+    --accent: 217.2 32.6% 17.5%;
+    --accent-foreground: 210 40% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 217.2 32.6% 17.5%;
+    --input: 217.2 32.6% 17.5%;
+    --ring: 224.3 76.3% 94.1%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+

package/src/templates/web/base/template/src/app/layout.tsx

@@ -0,0 +1,28 @@
+import type { Metadata } from 'next'
+import { Inter } from 'next/font/google'
+import './globals.css'
+import { AppProviders } from '@/components/providers/app-providers'
+
+const inter = Inter({ subsets: ['latin'] })
+
+export const metadata: Metadata = {
+  title: '{{titleCaseName}}',
+  description: '{{description}}',
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className={inter.className}>
+        <AppProviders>
+          {children}
+        </AppProviders>
+      </body>
+    </html>
+  )
+}
+

package/src/templates/web/base/template/src/app/page.tsx

@@ -0,0 +1,108 @@
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
+import { Badge } from '@/components/ui/badge'
+import { ArrowRight, Zap, Shield, Rocket } from 'lucide-react'
+
+export default function Home() {
+  return (
+    <main className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100 dark:from-gray-900 dark:to-gray-800">
+      <div className="container mx-auto px-4 py-16">
+        {/* Hero Section */}
+        <div className="text-center mb-16">
+          <Badge variant="secondary" className="mb-4">
+            Built with DigitalLogic Labs
+          </Badge>
+          <h1 className="text-4xl md:text-6xl font-bold text-gray-900 dark:text-white mb-6">
+            Welcome to{' '}
+            <span className="text-blue-600 dark:text-blue-400">{{titleCaseName}}</span>
+          </h1>
+          <p className="text-xl text-gray-600 dark:text-gray-300 mb-8 max-w-2xl mx-auto">
+            {{description}}. Get started by editing{' '}
+            <code className="bg-gray-100 dark:bg-gray-800 px-2 py-1 rounded text-sm">
+              src/app/page.tsx
+            </code>
+          </p>
+          <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            <Button size="lg" className="text-lg px-8">
+              Get Started
+              <ArrowRight className="ml-2 h-5 w-5" />
+            </Button>
+            <Button variant="outline" size="lg" className="text-lg px-8">
+              Learn More
+            </Button>
+          </div>
+        </div>
+
+        {/* Features Grid */}
+        <div className="grid md:grid-cols-3 gap-8 mb-16">
+          <Card className="text-center">
+            <CardHeader>
+              <div className="mx-auto w-12 h-12 bg-blue-100 dark:bg-blue-900 rounded-lg flex items-center justify-center mb-4">
+                <Zap className="h-6 w-6 text-blue-600 dark:text-blue-400" />
+              </div>
+              <CardTitle>Lightning Fast</CardTitle>
+              <CardDescription>
+                Built with Next.js 14 and optimized for performance
+              </CardDescription>
+            </CardHeader>
+          </Card>
+
+          <Card className="text-center">
+            <CardHeader>
+              <div className="mx-auto w-12 h-12 bg-green-100 dark:bg-green-900 rounded-lg flex items-center justify-center mb-4">
+                <Shield className="h-6 w-6 text-green-600 dark:text-green-400" />
+              </div>
+              <CardTitle>Secure by Default</CardTitle>
+              <CardDescription>
+                {{#auth}}{{#firebase}}Firebase{{/firebase}}{{#supabase}}Supabase{{/supabase}}{{/auth}} authentication and security best practices
+              </CardDescription>
+            </CardHeader>
+          </Card>
+
+          <Card className="text-center">
+            <CardHeader>
+              <div className="mx-auto w-12 h-12 bg-purple-100 dark:bg-purple-900 rounded-lg flex items-center justify-center mb-4">
+                <Rocket className="h-6 w-6 text-purple-600 dark:text-purple-400" />
+              </div>
+              <CardTitle>Ready to Scale</CardTitle>
+              <CardDescription>
+                Production-ready with TypeScript, Tailwind CSS, and modern tooling
+              </CardDescription>
+            </CardHeader>
+          </Card>
+        </div>
+
+        {/* Tech Stack */}
+        <Card className="max-w-4xl mx-auto">
+          <CardHeader className="text-center">
+            <CardTitle className="text-2xl">Built with Modern Technologies</CardTitle>
+            <CardDescription>
+              This template includes everything you need to build a modern SaaS application
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <div className="grid grid-cols-2 md:grid-cols-4 gap-4 text-center">
+              <div className="p-4">
+                <div className="font-semibold">Next.js 14</div>
+                <div className="text-sm text-gray-600 dark:text-gray-400">React Framework</div>
+              </div>
+              <div className="p-4">
+                <div className="font-semibold">TypeScript</div>
+                <div className="text-sm text-gray-600 dark:text-gray-400">Type Safety</div>
+              </div>
+              <div className="p-4">
+                <div className="font-semibold">Tailwind CSS</div>
+                <div className="text-sm text-gray-600 dark:text-gray-400">Styling</div>
+              </div>
+              <div className="p-4">
+                <div className="font-semibold">{{#auth}}{{#firebase}}Firebase{{/firebase}}{{#supabase}}Supabase{{/supabase}}{{/auth}}</div>
+                <div className="text-sm text-gray-600 dark:text-gray-400">Authentication</div>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+    </main>
+  )
+}
+

package/src/templates/web/base/template/src/components/providers/app-providers.tsx

@@ -0,0 +1,21 @@
+'use client'
+
+import { ThemeProvider } from 'next-themes'
+
+interface AppProvidersProps {
+  children: React.ReactNode
+}
+
+export function AppProviders({ children }: AppProvidersProps) {
+  return (
+    <ThemeProvider
+      attribute="class"
+      defaultTheme="system"
+      enableSystem
+      disableTransitionOnChange
+    >
+      {children}
+    </ThemeProvider>
+  )
+}
+

package/src/templates/web/base/template/src/components/ui/badge.tsx

@@ -0,0 +1,36 @@
+import * as React from "react"
+import { cva, type VariantProps } from "class-variance-authority"
+import { cn } from "@/lib/utils"
+
+const badgeVariants = cva(
+  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default:
+          "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+        secondary:
+          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive:
+          "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+        outline: "text-foreground",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+export interface BadgeProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof badgeVariants> {}
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+  return (
+    <div className={cn(badgeVariants({ variant }), className)} {...props} />
+  )
+}
+
+export { Badge, badgeVariants }
+