nemonix-cli 1.0.0

package/src/config/claude-code-config/commands/prompts/saas-implement-landing-page.md

@@ -0,0 +1,257 @@
+---
+description: Implement a production-ready landing page from specification using shadcn/ui components
+---
+
+<objective>
+Implement a complete, production-ready landing page from a markdown specification file using high-quality Shadcn UI components.
+
+This comes AFTER the PRD, ARCHI, and LANDING_PAGE copywriting. Transform the specification into a fully functional, modern landing page using the Shadcn UI ecosystem.
+</objective>
+
+<role>
+You are a senior frontend developer and design systems specialist with 10+ years experience building production-ready landing pages using modern UI components and design patterns.
+</role>
+
+<context>
+Project structure: !`ls -la`
+Existing components: !`ls src/components/ 2>/dev/null || ls components/ 2>/dev/null || echo "No components folder"`
+CSS variables: !`cat app/globals.css 2>/dev/null | head -50 || cat src/app/globals.css 2>/dev/null | head -50 || echo "No globals.css"`
+</context>
+
+<process>
+## Phase 1: Read Specification
+
+1. **Ask for spec file location**:
+   > "Please provide the path to your landing page specification file (LANDING_PAGE.md)."
+
+2. **Read and extract from spec**:
+   - Sections needed (Hero, Features, Pricing, FAQ, etc.)
+   - Content (headlines, descriptions, CTAs, images)
+   - Design preferences (colors, style, brand)
+   - Target audience
+
+3. **STOP if spec is missing** - Ask user for complete specification
+
+## Phase 2: Analyze Project
+
+4. **Ask for project location** if not provided
+
+5. **Explore project structure** (use Glob):
+   - `**/*.tsx` - existing components
+   - `**/globals.css` - styling and CSS variables
+   - `**/tsconfig.json` - path aliases
+   - `components.json` - shadcn setup
+
+6. **Read key config files**:
+   - `tsconfig.json` - path aliases (@/*)
+   - `app/globals.css` - CSS variables and theme
+
+7. **Document findings**:
+   - Framework version (Next.js 14/15)
+   - Component organization pattern
+   - Existing UI components
+   - Path aliases and imports
+
+## Phase 3: Research Components
+
+8. **Use MCP Context7** to research Shadcn UI:
+   - `mcp__context7__resolve-library-id` with "shadcn-ui"
+   - `mcp__context7__get-library-docs` for component patterns
+
+9. **Component source hierarchy** (priority order):
+   - **Official Shadcn UI** (ui.shadcn.com) - Base components
+   - **Shadcn UI Blocks** (shadcn-ui-blocks.akashmoradiya.com) - Pre-built sections
+   - **Coss.com** (coss.com/origin) - Modern components
+   - **Aceternity UI** (ui.aceternity.com) - Advanced effects (selective use)
+
+10. **Create `landing-page-components.md`** documenting:
+    - Component source for each section
+    - Installation command
+    - Customization notes
+
+## Phase 4: Configure Theme
+
+11. **Configure CSS variables** in `app/globals.css` based on spec brand colors:
+    ```css
+    :root {
+      --primary: /* brand primary */;
+      --secondary: /* brand secondary */;
+    }
+    ```
+
+12. **Ensure contrast** - 4.5:1 for text (WCAG AA)
+
+## Phase 5: Install Components
+
+13. **Install base components**:
+    ```bash
+    npx shadcn@latest add button card input label badge separator
+    npx shadcn@latest add navigation-menu dropdown-menu sheet
+    npx shadcn@latest add accordion dialog
+    ```
+
+14. **Install section-specific components** from blocks:
+    ```bash
+    npx shadcn add https://shadcn-ui-blocks.akashmoradiya.com/r/hero-03.json
+    npx shadcn add https://shadcn-ui-blocks.akashmoradiya.com/r/features-01.json
+    ```
+
+## Phase 6: Build Sections
+
+15. **Create component files** in `src/features/landing/` (or match existing structure):
+
+**Navigation** (`navbar.tsx`):
+- Logo, nav links, mobile menu
+- Sticky header with backdrop blur
+- CTA button
+
+**Hero** (`hero.tsx`):
+- Headline from spec (H1)
+- Subheadline (H2)
+- Primary/secondary CTAs
+- Hero image with next/image
+
+**Features** (`features.tsx`):
+- Section headline
+- Feature cards with icons (lucide-react)
+- Grid layout (3 columns desktop)
+
+**Social Proof** (`testimonials.tsx`) - if in spec:
+- Testimonial cards
+- Logo cloud
+- Statistics
+
+**Pricing** (`pricing.tsx`) - if in spec:
+- Pricing tiers with Card component
+- Feature lists with checkmarks
+- Popular tier highlight
+- CTA buttons
+
+**FAQ** (`faq.tsx`) - if in spec:
+- Accordion component
+- All questions from spec
+
+**CTA** (`cta.tsx`):
+- Compelling headline
+- Action buttons
+- Background styling
+
+**Footer** (`footer.tsx`):
+- Navigation columns
+- Social links (lucide-react icons)
+- Legal links
+- Copyright
+
+## Phase 7: Assemble Page
+
+16. **Update `app/page.tsx`**:
+    ```typescript
+    import { Navbar } from "@/features/landing/navbar"
+    import { Hero } from "@/features/landing/hero"
+    import { Features } from "@/features/landing/features"
+    // ... other imports
+
+    export default function HomePage() {
+      return (
+        <>
+          <Navbar />
+          <main>
+            <Hero />
+            <Features />
+            {/* Other sections */}
+          </main>
+          <Footer />
+        </>
+      )
+    }
+    ```
+
+17. **Add smooth scrolling** in `globals.css`:
+    ```css
+    html { scroll-behavior: smooth; }
+    ```
+
+## Phase 8: Quality Assurance
+
+18. **Mobile responsiveness**:
+    - Test at 375px (iPhone SE)
+    - Verify touch targets (44x44px min)
+    - Check text readability (16px min)
+    - Test mobile navigation
+
+19. **Accessibility audit**:
+    - Tab through entire page
+    - Verify heading hierarchy (h1 → h2 → h3)
+    - Check alt text on images
+    - Verify color contrast
+    - Add ARIA labels on icon buttons
+
+20. **Performance optimization**:
+    - Use next/image with width/height
+    - Add `priority` to hero image
+    - Use `loading="lazy"` below fold
+
+21. **Final verification**:
+    ```bash
+    pnpm format
+    pnpm lint
+    pnpm ts
+    pnpm build
+    ```
+</process>
+
+<constraints>
+**DESIGN STANDARDS**:
+- Modern, contemporary design (not dated Bootstrap-style)
+- Mobile-first responsive approach
+- WCAG 2.1 AA accessibility compliance
+- Lighthouse score 90+ target
+
+**CODE QUALITY**:
+- Follow existing project conventions
+- Use path aliases (@/components, @/features)
+- TypeScript strict mode
+- No placeholder content - use real spec content
+
+**COMPONENT RULES**:
+- Prioritize official Shadcn UI components
+- Use next/image for all images
+- Use next/font for typography
+- Respect existing component patterns
+
+**NEVER**:
+- Overwrite existing components without understanding
+- Use placeholder text instead of spec content
+- Skip mobile responsiveness
+- Ignore accessibility requirements
+- Add unused dependencies
+</constraints>
+
+<output>
+**Files created in `src/features/landing/`** (or matching structure):
+- `navbar.tsx` - Navigation header
+- `hero.tsx` - Hero section
+- `features.tsx` - Features grid
+- `pricing.tsx` - Pricing tiers (if in spec)
+- `faq.tsx` - FAQ accordion (if in spec)
+- `cta.tsx` - Call-to-action sections
+- `footer.tsx` - Footer navigation
+
+**Documentation**:
+- `landing-page-components.md` - Component sources and customizations
+
+**Updated files**:
+- `app/page.tsx` - Assembled landing page
+- `app/globals.css` - Theme variables and brand colors
+</output>
+
+<success_criteria>
+- All spec sections implemented with real content (not placeholders)
+- Mobile responsive on all breakpoints (375px, 768px, 1024px, 1440px)
+- WCAG 2.1 AA accessible (keyboard nav, contrast, alt text)
+- Lighthouse performance score 90+
+- All links and CTAs functional
+- No console errors
+- Build passes without warnings
+- Matches spec design preferences and brand colors
+</success_criteria>

package/src/config/claude-code-config/commands/prompts/setup-tmux.md

@@ -0,0 +1,160 @@
+Install and configure tmux with Ghostty on macOS. This sets up a minimalist tmux with direct keyboard shortcuts (no prefix needed for common actions), auto-naming tabs, session persistence, and a clean status bar.
+
+## Step 1: Install tmux
+
+```bash
+brew install tmux
+```
+
+## Step 2: Install TPM (plugin manager)
+
+```bash
+git clone https://github.com/tmux-plugins/tpm ~/.tmux/plugins/tpm
+```
+
+## Step 3: Write `~/.tmux.conf`
+
+```
+# Mouse
+set -g mouse on
+
+# Start at 1
+set -g base-index 1
+setw -g pane-base-index 1
+
+# Prefix = Ctrl+A
+unbind C-b
+set -g prefix C-a
+bind C-a send-prefix
+
+# Visual feedback when prefix is pressed
+set -g status-left '#{?client_prefix,#[fg=green bold] TMUX ,}'
+
+# Actions (Ctrl+A puis...)
+bind c new-window -c "#{pane_current_path}"
+bind s split-window -h -c "#{pane_current_path}"
+bind d split-window -v -c "#{pane_current_path}"
+bind w kill-pane
+bind r command-prompt -I "#W" "rename-window '%%'"
+bind f copy-mode
+bind h list-keys
+
+# Switch panes (no prefix)
+bind -n M-Left select-pane -L
+bind -n M-Right select-pane -R
+bind -n M-Up select-pane -U
+bind -n M-Down select-pane -D
+
+# Switch windows (no prefix)
+bind -n S-Left previous-window
+bind -n S-Right next-window
+
+# Settings
+set -g history-limit 50000
+set -sg escape-time 0
+set -g default-terminal "screen-256color"
+set -ag terminal-overrides ",xterm-256color:RGB"
+set -g renumber-windows on
+
+# Minimal status bar
+set -g status-position bottom
+set -g status-style 'bg=default fg=#555555'
+set -g status-right '#[fg=#555555]#S'
+set -g allow-rename on
+set -g set-titles on
+set -g set-titles-string '#{pane_title}'
+setw -g automatic-rename on
+setw -g automatic-rename-format '#{pane_title}'
+setw -g window-status-format '#[fg=#555555] #I:#W'
+setw -g window-status-current-format '#[fg=white,bold] #I:#W'
+set -g status-justify left
+
+# Pane borders
+set -g pane-border-style 'fg=#333333'
+set -g pane-active-border-style 'fg=#555555'
+
+# Plugins
+set -g @plugin 'tmux-plugins/tpm'
+set -g @plugin 'tmux-plugins/tmux-resurrect'
+set -g @plugin 'tmux-plugins/tmux-continuum'
+set -g @plugin 'tmux-plugins/tmux-yank'
+
+set -g @resurrect-capture-pane-contents 'on'
+set -g @continuum-restore 'on'
+
+run '~/.tmux/plugins/tpm/tpm'
+```
+
+## Step 4: Add Ghostty keybinds
+
+Add these lines to `~/Library/Application Support/com.mitchellh.ghostty/config`:
+
+```
+keybind = ctrl+shift+t=text:\x01c
+keybind = ctrl+shift+s=text:\x01s
+keybind = ctrl+shift+d=text:\x01d
+keybind = ctrl+shift+w=text:\x01w
+keybind = ctrl+shift+r=text:\x01r
+macos-option-as-alt = left
+```
+
+`macos-option-as-alt = left` is required for Alt+Arrow pane switching to work.
+
+## Step 5: Install plugins
+
+```bash
+~/.tmux/plugins/tpm/bin/install_plugins
+```
+
+## Step 6: Reload
+
+```bash
+tmux source-file ~/.tmux.conf
+```
+
+Then restart Ghostty (Cmd+Q and reopen).
+
+## Shortcuts
+
+### Direct shortcuts (no prefix)
+
+| Action | Shortcut |
+| --- | --- |
+| New tab | `Ctrl+Shift+T` |
+| Split côte à côte | `Ctrl+Shift+S` |
+| Split haut/bas | `Ctrl+Shift+D` |
+| Fermer pane | `Ctrl+Shift+W` |
+| Renommer tab | `Ctrl+Shift+R` |
+| Changer de pane | `Alt + Flèches` |
+| Changer de tab | `Shift + Left/Right` |
+| Scroll | Molette souris |
+
+### Prefix shortcuts (Ctrl+A puis...)
+
+When you press Ctrl+A, " TMUX " appears in green = tmux is listening.
+
+| Touche | Action |
+| --- | --- |
+| `c` | nouveau tab |
+| `s` | split côte à côte |
+| `d` | split haut/bas |
+| `w` | fermer pane |
+| `r` | renommer tab |
+| `f` | mode scroll |
+| `h` | voir tous les raccourcis |
+| `1-9` | aller au tab N |
+
+### Sessions
+
+| Action | Command |
+| --- | --- |
+| Nouvelle session | `tmux new -s nom` |
+| Lister sessions | `tmux ls` |
+| Se rattacher | `tmux a` |
+| Détacher | `Ctrl+A` puis `d` |
+
+## Plugins installed
+
+- **tmux-resurrect**: save/restore sessions (survives reboot)
+- **tmux-continuum**: auto-restore last session on launch
+- **tmux-yank**: copy in tmux goes to system clipboard

package/src/config/claude-code-config/commands/prompts/tools.md

@@ -0,0 +1,148 @@
+---
+description: Reference document listing all recommended tools and libraries for AIBlueprint development
+---
+
+# AIBlueprint Tools & Libraries Reference
+
+This document lists all recommended tools and libraries for development with the AIBlueprint stack. Use this as a reference when making architecture decisions.
+
+## Quick Reference Table
+
+| Name | Description | Tags |
+|------|-------------|------|
+| [Next.js](https://nextjs.org/) | Main React framework with App Router | `framework`, `frontend`, `backend` |
+| [TanStack Query](https://tanstack.com/query) | Data fetching & caching for API routes | `frontend`, `library` |
+| [Zustand](https://zustand.docs.pmnd.rs/) | Client-side state management | `frontend`, `library` |
+| [nuqs](https://nuqs.47ng.com/) | URL state management | `frontend`, `library` |
+| [shadcn/ui](https://ui.shadcn.com/) | Customizable React components | `frontend`, `library` |
+| [Convex](https://www.convex.dev/) | Realtime database & backend | `backend`, `database`, `realtime` |
+| [Liveblocks](https://liveblocks.io/) | Multiplayer collaboration features | `frontend`, `backend`, `realtime` |
+| [Neon](https://neon.tech/) | Serverless PostgreSQL | `backend`, `database`, `sql` |
+| [Supabase](https://supabase.com/) | PostgreSQL + Backend as a Service | `backend`, `database`, `sql` |
+| [Prisma](https://prisma.io/) | Type-safe ORM (recommended for teams) | `backend`, `database`, `orm` |
+| [Drizzle ORM](https://orm.drizzle.team/) | Lightweight type-safe ORM | `backend`, `database`, `orm` |
+| [Better Auth](https://www.better-auth.com/) | Complete authentication solution | `backend`, `library` |
+| [Inngest](https://www.inngest.com/) | Background jobs & workflows | `backend`, `service` |
+| [Next Safe Action](https://next-safe-action.dev/) | Secure Server Actions | `backend`, `library` |
+| [next-zod-route](https://github.com/Melvynx/next-zod-route) | Secure API Routes | `backend`, `library` |
+| [Zod](https://zod.dev/) | Runtime validation (v4) | `library`, `validation` |
+| [AI SDK](https://ai-sdk.dev/) | LLM integration wrapper | `backend`, `frontend`, `library` |
+| [up-fetch](https://github.com/L-Blondy/up-fetch) | Modern fetch wrapper | `backend`, `frontend`, `library` |
+| [Vitest](https://vitest.dev/) | Fast unit testing | `testing`, `library` |
+| [Playwright](https://playwright.dev/) | E2E testing | `testing`, `library` |
+| [Sentry](https://sentry.io/) | Error tracking & monitoring | `monitoring`, `service` |
+| [Resend](https://resend.com/) | Developer email service | `email`, `service` |
+| [React Email](https://react.email/) | Email templates in React | `email`, `library` |
+| [AWS SES](https://aws.amazon.com/ses/) | High-volume email | `email`, `service` |
+| [Stripe](https://stripe.com/) | Complete payment solution | `payment`, `service` |
+| [Lemon Squeezy](https://lemonsqueezy.com/) | Payments with tax handling | `payment`, `service` |
+| [PostHog](https://posthog.com/) | Product analytics | `analytics`, `service` |
+| [Plausible](https://plausible.io/) | Simple web analytics | `analytics`, `service` |
+| [React Hook Form](https://react-hook-form.com/) | Form management (recommended) | `frontend`, `library`, `forms` |
+| [TanStack Form](https://tanstack.com/form) | Headless form management | `frontend`, `library`, `forms` |
+| [Uploadthing](https://uploadthing.com/) | Simple file uploads | `upload`, `images`, `service` |
+| [Cloudflare R2](https://developers.cloudflare.com/r2/) | S3-compatible storage | `backend`, `images`, `storage` |
+| [AWS S3](https://aws.amazon.com/s3/) | Object storage standard | `storage`, `images`, `infra` |
+
+## Categories
+
+### Framework & Frontend
+- **Next.js** - Main framework
+- **TanStack Query** - Data fetching & cache
+- **Zustand** - Client state management
+- **nuqs** - URL state
+- **shadcn/ui** - UI components
+
+### Backend & API
+- **Next Safe Action** - Secure Server Actions
+- **next-zod-route** - Secure API Routes
+- **Better Auth** - Authentication
+- **AI SDK** - LLM integration
+- **up-fetch** - HTTP client
+
+### Database & ORM
+- **Neon** - Serverless PostgreSQL (recommended)
+- **Supabase** - PostgreSQL + BaaS
+- **Prisma** - Type-safe ORM (recommended for teams)
+- **Drizzle ORM** - Lightweight ORM (recommended for performance)
+
+### Realtime & Collaboration
+- **Convex** - Realtime database + backend (recommended for realtime apps)
+- **Liveblocks** - Multiplayer collaboration (cursors, presence, comments)
+
+### Validation & Forms
+- **Zod** - Data validation (v4)
+- **React Hook Form** - Form management (recommended)
+- **TanStack Form** - Modern alternative
+
+### Testing
+- **Vitest** - Unit tests
+- **Playwright** - E2E tests
+
+### Monitoring & Analytics
+- **Sentry** - Error tracking & performance
+- **PostHog** - Product analytics (recommended)
+- **Plausible** - Simple web analytics
+
+### Payments
+- **Stripe** - Complete solution (recommended for flexibility)
+- **Lemon Squeezy** - Simple + handles taxes (recommended for solopreneurs)
+
+### Email
+- **Resend** - Transactional emails (recommended)
+- **React Email** - Email templates in React
+- **AWS SES** - High volume
+
+### Images & Upload
+- **Uploadthing** - Simple Next.js uploads (recommended)
+- **Cloudflare R2** - Cheap object storage
+- **AWS S3** - Standard object storage
+
+### Services & Infrastructure
+- **Inngest** - Async jobs & workflows
+- **Cloudflare Browser Rendering** - Serverless scraping
+
+## Recommended Stack
+
+### Frontend
+- Next.js + TanStack Query + Zustand + shadcn/ui
+- React Hook Form + Zod
+
+### Backend
+- Neon (DB) + Prisma or Drizzle (ORM)
+- Next Safe Action + Better Auth
+- Resend + React Email
+
+### Services
+- Stripe (payments)
+- Uploadthing (upload)
+- Cloudflare R2 (storage)
+- PostHog (analytics)
+- Sentry (monitoring)
+
+### Testing
+- Vitest + Playwright
+
+## Decision Guide
+
+| Decision | Recommendation |
+|----------|----------------|
+| Database | Neon + Prisma to start, Drizzle for performance |
+| Realtime | Convex for full realtime, Liveblocks for collaboration only |
+| Email | Resend to start, AWS SES for >100k/month |
+| Payments | Stripe for flexibility, Lemon Squeezy for tax simplicity |
+| Analytics | PostHog for product analytics, Plausible for simple web analytics |
+| Forms | React Hook Form (standard), TanStack Form (more control) |
+| ORM | Prisma (better DX), Drizzle (better perf, 2-3x faster) |
+| Upload | Uploadthing (simple), R2/S3 (more control) |
+| Testing | Vitest (unit), Playwright (E2E, more reliable than Cypress) |
+
+## Important Notes
+
+- **Zod**: Now v4, specify version to AI
+- **Supabase Auth**: Prefer Better-Auth for flexibility
+- **Convex vs Neon+Liveblocks**: Convex if entire app is realtime, Neon+Liveblocks if only some features need collaboration
+- **AWS S3**: Watch egress costs, prefer R2 for serving assets
+- **Stripe Tax**: Enable for automatic tax handling
+- **Sentry**: Configure source maps for real stack traces
+- **Prisma vs Drizzle**: Prisma = better DX, Drizzle = better perf