@digilogiclabs/create-saas-app 1.14.1 → 1.17.1

package/CHANGELOG.md

@@ -1,5 +1,36 @@
 # @digilogiclabs/create-saas-app
 
+## 1.17.1
+
+### Patch Changes
+
+- 🎉 **Quality of Life Enhancements Across All Templates**
+
+  #### 🌐 **Web Template Improvements**
+  - **Toast Notification System**: Added `Toaster` component to all web app providers for user feedback
+  - **Enhanced Loading States**: Upgraded loading screens with `SkeletonCard` and `SkeletonText` components
+  - **Search Functionality**: Added `SearchBar` with mobile-responsive design and toast feedback
+  - **Command Palette**: Verified and enhanced existing `CommandPalette` integration across dashboards
+  - **Theme System**: Maintained existing `ThemeToggle` with light/dark/system support
+  - **Fixed**: JSON parsing issue in ui-auth-ai template package.json
+
+  #### 📱 **Mobile Template Enhancements**
+  - **Native Toast System**: Added `NativeToast` component to all mobile app providers
+  - **Advanced Skeleton Loading**: Enhanced loading states with realistic content placeholders
+  - **Verified Existing Features**: Confirmed all premium mobile QoL features are properly implemented:
+    - Pull-to-refresh with haptic feedback ✅
+    - Search functionality with `NativeSearchBar` ✅
+    - Comprehensive haptic feedback integration ✅
+    - Swipe gestures with `SwipeableCard` components ✅
+    - Network-aware content and offline support ✅
+    - Native tours and progressive image loading ✅
+
+  #### 🛠 **Technical Improvements**
+  - **Build Verification**: All templates compile successfully
+  - **Package Integrity**: 2.6MB compressed, 14.8MB unpacked
+  - **Backward Compatibility**: All changes are non-destructive
+  - **Cross-Platform**: Enhanced both web and mobile template experiences
+
 ## 1.6.0
 
 ### Minor Changes

package/README.md

@@ -5,6 +5,134 @@
 [![npm version](https://badge.fury.io/js/%40digilogiclabs%2Fcreate-saas-app.svg)](https://badge.fury.io/js/%40digilogiclabs%2Fcreate-saas-app)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
+## 🚀 Template Generator Guide
+
+### **Quick Command Reference**
+
+```bash
+# Interactive mode (recommended for beginners)
+npx @digilogiclabs/create-saas-app create
+
+# Direct command format
+npx @digilogiclabs/create-saas-app create <platform> <template> <project-name> [options]
+
+# Get help anytime
+npx @digilogiclabs/create-saas-app --help
+npx @digilogiclabs/create-saas-app create --help
+```
+
+### **📋 All Available Templates (12 Total)**
+
+#### **🌐 Web Templates (9)**
+| Template | Description | Command |
+|----------|-------------|---------|
+| `base` | Clean Next.js 15 starter | `npx @digilogiclabs/create-saas-app create web base my-app` |
+| `ui-only` | Component library showcase | `npx @digilogiclabs/create-saas-app create web ui-only design-system` |
+| `ui-auth` | Authentication flow | `npx @digilogiclabs/create-saas-app create web ui-auth auth-app` |
+| `ui-auth-payments` | Complete SaaS foundation | `npx @digilogiclabs/create-saas-app create web ui-auth-payments saas-app` |
+| `ui-auth-ai` | Text & chat AI platform | `npx @digilogiclabs/create-saas-app create web ui-auth-ai text-ai-app --with-ai=text` |
+| `ui-auth-payments-ai` | Full AI SaaS platform | `npx @digilogiclabs/create-saas-app create web ui-auth-payments-ai ai-platform --with-ai=all` |
+| `ui-auth-payments-audio` | Audio streaming SaaS | `npx @digilogiclabs/create-saas-app create web ui-auth-payments-audio music-platform` |
+| `ui-auth-payments-video` | Video streaming SaaS | `npx @digilogiclabs/create-saas-app create web ui-auth-payments-video video-studio` |
+| `ui-package-test` | Component testing env | `npx @digilogiclabs/create-saas-app create web ui-package-test component-test` |
+
+#### **📱 Mobile Templates (3)**
+| Template | Description | Command |
+|----------|-------------|---------|
+| `base` | React Native + Expo starter | `npx @digilogiclabs/create-saas-app create mobile base mobile-app` |
+| `ui-auth-payments` | Full mobile SaaS (v0.22.0) | `npx @digilogiclabs/create-saas-app create mobile ui-auth-payments mobile-saas` |
+| `ui-auth-payments-ai` | Mobile AI SaaS with generation | `npx @digilogiclabs/create-saas-app create mobile ui-auth-payments-ai ai-mobile-app --with-ai=all` |
+
+#### **🚀 Cross-Platform Templates**
+| Template | Description | Command |
+|----------|-------------|---------|
+| `ui-auth-payments` | Web + Mobile SaaS | `npx @digilogiclabs/create-saas-app create both ui-auth-payments fullstack-app` |
+| `ui-auth-payments-ai` | Web + Mobile AI platform | `npx @digilogiclabs/create-saas-app create both ui-auth-payments-ai ai-fullstack --with-ai=all` |
+
+### **🛠 CLI Options**
+
+#### **Core Arguments**
+```bash
+<platform>       # web | mobile | both
+<template>       # Template name (see table above)
+<project-name>   # Your project name (kebab-case recommended)
+```
+
+#### **Configuration Flags**
+```bash
+-a, --auth <provider>        # firebase | supabase (default: supabase)
+-d, --database <provider>    # supabase | firebase (default: supabase)
+-t, --theme <theme>          # default | corporate | startup (default: default)
+-c, --theme-color <color>    # blue | green | purple | orange | red | slate (default: blue)
+--default-theme <mode>       # light | dark | system (default: system)
+--with-ai [capabilities]     # text | audio | video | text,audio | all (for AI templates)
+--ai-provider <provider>     # openai | anthropic | gemini (default: openai)
+--no-install                 # Skip package installation
+--no-git                     # Skip git initialization
+-y, --yes                    # Skip interactive prompts
+```
+
+### **💡 Usage Examples**
+
+#### **Beginner: Interactive Mode**
+```bash
+# Let the CLI guide you through all options
+npx @digilogiclabs/create-saas-app create
+```
+
+#### **Advanced: Direct Commands**
+```bash
+# Full AI platform with all features
+npx @digilogiclabs/create-saas-app create web ui-auth-payments-ai my-ai-saas \
+  --with-ai=all \
+  --ai-provider=openai \
+  --theme=startup \
+  --theme-color=purple \
+  --auth=supabase \
+  --database=supabase
+
+# Mobile-first AI app
+npx @digilogiclabs/create-saas-app create mobile ui-auth-payments-ai mobile-ai-app \
+  --with-ai=all \
+  --theme=corporate \
+  --theme-color=blue \
+  --no-git
+
+# Cross-platform SaaS with Firebase
+npx @digilogiclabs/create-saas-app create both ui-auth-payments fullstack-saas \
+  --auth=firebase \
+  --database=firebase \
+  --theme=default \
+  --default-theme=dark
+
+# Quick prototyping (no deps install)
+npx @digilogiclabs/create-saas-app create web ui-auth-payments prototype \
+  --no-install \
+  --no-git \
+  --yes
+```
+
+### **🎯 Template Selection Guide**
+
+#### **Choose by Use Case**
+- **Learning/Prototyping**: `base` or `ui-only`
+- **Authentication App**: `ui-auth`
+- **SaaS with Billing**: `ui-auth-payments`
+- **AI Applications**: `ui-auth-payments-ai` or `ui-auth-ai`
+- **Media Platforms**: `ui-auth-payments-audio` or `ui-auth-payments-video`
+- **Mobile Apps**: Mobile versions of above
+- **Full-Stack**: `both` platform with any template
+
+#### **Choose by Complexity**
+1. **Simple**: `base`, `ui-only`
+2. **Medium**: `ui-auth`, `ui-auth-payments`
+3. **Advanced**: `ui-auth-payments-ai`, `ui-auth-payments-audio`, `ui-auth-payments-video`
+
+#### **Choose by Platform**
+- **Web Only**: Use `web` platform
+- **Mobile Only**: Use `mobile` platform  
+- **Universal**: Use `both` platform (web + mobile)
+
 ## 🎉 What's New in v1.13.0
 
 ### 🤖 **Complete AI Integration**
@@ -31,19 +159,17 @@
 ## 🚀 Quick Start
 
 ```bash
-# Create an AI-powered SaaS platform
-npx @digilogiclabs/create-saas-app create web ui-auth-payments-ai my-ai-saas --with-ai=all
+# Interactive mode (recommended)
+npx @digilogiclabs/create-saas-app create
 
-# Create an audio streaming platform
-npx @digilogiclabs/create-saas-app create web ui-auth-payments-audio music-platform
-
-# Create a video generation platform  
-npx @digilogiclabs/create-saas-app create web ui-auth-payments-video video-studio
-
-# Create a simple authentication app
-npx @digilogiclabs/create-saas-app create web ui-auth simple-app
+# Or create directly with popular templates
+npx @digilogiclabs/create-saas-app create web ui-auth-payments-ai my-ai-saas --with-ai=all
+npx @digilogiclabs/create-saas-app create mobile ui-auth-payments-ai mobile-ai-app --with-ai=all
+npx @digilogiclabs/create-saas-app create web ui-auth-payments saas-app
 ```
 
+> 💡 **New to the CLI?** See the complete [Template Generator Guide](#-template-generator-guide) above for all options and examples.
+
 ## ⚡ What You Get
 
 ### 🤖 **AI-First Development**
@@ -67,11 +193,76 @@ npx @digilogiclabs/create-saas-app create web ui-auth simple-app
 
 ## 🎨 Template Gallery
 
-### 🤖 **AI-Powered Templates**
+> 📋 **Quick Reference?** See the [Template Generator Guide](#-template-generator-guide) at the top for a complete table of all templates and commands.
 
-#### **Full-Stack AI Platform** (`ui-auth-payments-ai`)
-Complete AI platform with text, audio, and video generation
-- **Multi-modal AI** - OpenAI, ElevenLabs, Replicate integration
+Choose from **12 production-ready templates** across web and mobile platforms:
+
+### 🌐 **Web Templates (9 Available)**
+
+#### **Core Templates**
+
+##### **Base Template** (`base`)
+Clean Next.js 15 starter with minimal dependencies
+- **Next.js 15.3** - App Router with Server Components
+- **TypeScript** - Strict typing throughout
+- **Tailwind CSS v4** - Modern utility-first styling
+- **Essential setup** - Perfect foundation for custom builds
+
+```bash
+npx @digilogiclabs/create-saas-app create web base my-app
+```
+
+##### **UI Only Template** (`ui-only`)
+Components library showcase without authentication
+- **Component gallery** - All @digilogiclabs/saas-factory-ui components
+- **Design system** - Glassmorphism and modern patterns
+- **No auth required** - Perfect for design system demos
+- **Storybook-style** - Interactive component documentation
+
+```bash
+npx @digilogiclabs/create-saas-app create web ui-only design-system
+```
+
+#### **Authentication Templates**
+
+##### **UI + Auth** (`ui-auth`)
+Modern authentication flow with beautiful UI
+- **User management** - Sign up, login, profile management
+- **12 OAuth providers** - Google, GitHub, Microsoft, LinkedIn, Spotify, and more
+- **Protected routes** - Authentication-gated content
+- **Email verification** - Secure account activation
+
+```bash
+npx @digilogiclabs/create-saas-app create web ui-auth auth-app
+```
+
+##### **UI + Auth + Payments** (`ui-auth-payments`)
+Complete SaaS foundation with billing
+- **Subscription management** - Stripe integration with webhooks
+- **User dashboards** - Account management and billing portal
+- **Team features** - Multi-user support and permissions
+- **Analytics** - Revenue and usage tracking
+
+```bash
+npx @digilogiclabs/create-saas-app create web ui-auth-payments saas-platform
+```
+
+#### **AI-Powered Templates**
+
+##### **AI + Auth** (`ui-auth-ai`)
+Text and chat AI integration platform
+- **Text generation** - OpenAI GPT-4 integration
+- **AI chat interface** - Interactive conversation UI
+- **Content management** - Save and organize AI outputs
+- **Usage tracking** - Monitor API consumption
+
+```bash
+npx @digilogiclabs/create-saas-app create web ui-auth-ai text-ai-app --with-ai=text
+```
+
+##### **AI + Auth + Payments** (`ui-auth-payments-ai`)
+Full AI SaaS platform with multi-modal generation
+- **Multi-modal AI** - Text, audio, and video generation
 - **AI Dashboard** - Generation history and usage analytics  
 - **Smart UI** - Tabbed interface for different AI tools
 - **Real-time features** - Live generation status and updates
@@ -80,50 +271,102 @@ Complete AI platform with text, audio, and video generation
 npx @digilogiclabs/create-saas-app create web ui-auth-payments-ai ai-platform --with-ai=all
 ```
 
-#### **Audio Platform** (`ui-auth-payments-audio`)  
-Professional audio streaming and generation platform
+#### **Media Templates**
+
+##### **Audio SaaS** (`ui-auth-payments-audio`)
+Music streaming and audio processing platform
 - **Audio streaming** - Playlist management and playback
 - **Audio generation** - AI-powered voice synthesis
 - **Waveform visualization** - Real-time audio analysis
 - **Offline support** - Cached playback and PWA features
 
 ```bash
-npx @digilogiclabs/create-saas-app create web ui-auth-payments-audio music-app
+npx @digilogiclabs/create-saas-app create web ui-auth-payments-audio music-platform
 ```
 
-#### **Video Platform** (`ui-auth-payments-video`)
-Video streaming and generation platform  
+##### **Video SaaS** (`ui-auth-payments-video`)
+Video streaming and media platform
 - **Video streaming** - Quality selection and adaptive bitrate
 - **Video generation** - AI-powered video creation
 - **Content management** - Upload, process, and organize videos
 - **Analytics dashboard** - View counts and engagement metrics
 
 ```bash
-npx @digilogiclabs/create-saas-app create web ui-auth-payments-video video-platform
+npx @digilogiclabs/create-saas-app create web ui-auth-payments-video video-studio
 ```
 
-### 🏢 **Business Templates**
+#### **Development Templates**
 
-#### **SaaS with Payments** (`ui-auth-payments`)
-Complete SaaS platform with billing
-- **Subscription management** - Stripe integration with webhooks
-- **User dashboards** - Account management and billing portal
-- **Team features** - Multi-user support and permissions
-- **Analytics** - Revenue and usage tracking
+##### **UI Package Test** (`ui-package-test`)
+Component testing environment for package development
+- **Component testing** - Isolated testing environment
+- **Package validation** - Test UI components before release
+- **Development tools** - Hot reload and debugging setup
+- **Documentation** - Auto-generated component docs
 
 ```bash
-npx @digilogiclabs/create-saas-app create web ui-auth-payments saas-platform
+npx @digilogiclabs/create-saas-app create web ui-package-test component-test
 ```
 
-#### **Authentication App** (`ui-auth`)
-Simple auth-enabled application
-- **User management** - Sign up, login, profile management
-- **Protected routes** - Authentication-gated content
-- **Social logins** - Google, GitHub, and more
-- **Email verification** - Secure account activation
+### 📱 **Mobile Templates (3 Available)**
+
+#### **Base Mobile** (`base`)
+React Native + Expo starter for mobile development
+- **Expo 50** - Modern React Native development platform
+- **TypeScript** - Full type safety for mobile
+- **Navigation** - React Navigation v6 setup
+- **Cross-platform** - iOS and Android support
 
 ```bash
-npx @digilogiclabs/create-saas-app create web ui-auth auth-app
+npx @digilogiclabs/create-saas-app create mobile base mobile-app
+```
+
+#### **Mobile SaaS** (`ui-auth-payments`)
+Full mobile SaaS platform with native UI v0.22.0
+- **Native UI components** - 240+ components with 75% feature parity
+- **Authentication** - Supabase Auth with biometric support
+- **Payments** - Stripe React Native integration
+- **Advanced features** - Onboarding, tours, offline support, haptic feedback
+
+```bash
+npx @digilogiclabs/create-saas-app create mobile ui-auth-payments mobile-saas
+```
+
+#### **Mobile AI SaaS** (`ui-auth-payments-ai`)
+Complete mobile AI platform with generation capabilities
+- **AI Generation Suite** - Text, audio, and video AI generation
+- **Native AI Components** - AITextGenerator, AIAudioGenerator, AIVideoGenerator, AIChat
+- **AI Dashboard** - Usage statistics and generation history
+- **Multi-modal AI** - OpenAI, ElevenLabs, Replicate integration
+- **Mobile-optimized** - Touch-friendly AI interfaces with haptic feedback
+- **Offline AI Cache** - Cached responses for better mobile experience
+
+```bash
+npx @digilogiclabs/create-saas-app create mobile ui-auth-payments-ai ai-mobile-app --with-ai=all
+```
+
+### 🚀 **Cross-Platform Templates**
+
+#### **Full Stack Platform** (`ui-auth-payments`)
+Web + Mobile SaaS platform
+- **Shared codebase** - Unified components and logic
+- **Web dashboard** - Full-featured admin interface
+- **Mobile app** - Native mobile experience
+- **Real-time sync** - Cross-platform data synchronization
+
+```bash
+npx @digilogiclabs/create-saas-app create both ui-auth-payments fullstack-platform
+```
+
+#### **AI Full Stack** (`ui-auth-payments-ai`)
+Web + Mobile AI platform
+- **AI everywhere** - Consistent AI features across platforms
+- **Mobile-optimized** - Touch-friendly AI interfaces
+- **Cloud sync** - AI generations sync across devices
+- **Offline capable** - Cached AI responses for mobile
+
+```bash
+npx @digilogiclabs/create-saas-app create both ui-auth-payments-ai ai-fullstack --with-ai=all
 ```
 
 ## 🤖 AI Development Workflow
@@ -300,10 +543,12 @@ Built-in validation ensures your app is deployment-ready:
 
 ## 📦 Package Ecosystem
 
-### 🎨 **UI & Design** (v0.18.4)
-- **@digilogiclabs/saas-factory-ui** - Modern components with enhanced glassmorphism
-- **6 New Components** - Switch, Slider, Textarea, Accordion, Breadcrumbs, EmptyState
+### 🎨 **UI & Design** (v0.22.0)
+- **@digilogiclabs/saas-factory-ui** - 240+ components with mobile-first design
+- **75% Component Increase** - From 140+ to 240+ components in v0.22.0
 - **Cross-Platform Support** - Single codebase for Next.js + React Native/Expo
+- **Native Mobile Components** - AppShell, BottomTabBar, NativeTour, VirtualScrollList
+- **Advanced Features** - Haptic feedback, gesture support, offline capabilities
 - **Enhanced Glassmorphism** - Fixed API with proper `border` and `accent` properties
 - **Next.js 15.3** - App Router with Server Components  
 - **Tailwind CSS v4** - Design tokens and utility classes
@@ -532,11 +777,12 @@ MIT © [Digi Logic Labs](https://digilogiclabs.com)
 
 ## 🚀 What's Next?
 
-- 📱 **Mobile Templates** - React Native templates with AI capabilities
+- 📱 **Enhanced Mobile Templates** - Additional React Native templates with specialized features
 - 🔌 **Plugin System** - Extensible architecture for custom features  
 - 🤖 **More AI Providers** - Anthropic, Google, and custom model support
 - 📊 **Analytics Integration** - Built-in analytics and monitoring
 - 🌍 **Internationalization** - Multi-language support out of the box
+- 🎨 **Theme Marketplace** - Community-contributed themes and components
 
 ---
 

package/bin/index.js

@@ -1,4 +1,4 @@
-#!/usr/bin/env node
+#!/usr/bin/env node
 
 const { execSync } = require('child_process');
 const path = require('path');