@polymorphism-tech/morph-spec 4.3.4 → 4.3.6

package/.morph/templates/IDE-SNIPPETS.md

@@ -0,0 +1,266 @@
+# IDE Snippets for MORPH Templates
+
+> Boost your productivity with IDE snippets for Handlebars template syntax
+
+---
+
+## 📦 Installation
+
+### VS Code
+
+**Option 1: Project Snippets (Recommended)**
+
+Snippets are already configured in `framework/templates/.vscode/morph-templates.code-snippets`.
+
+To use them:
+1. Open your project in VS Code
+2. Snippets auto-activate when editing template files
+3. Type a prefix (e.g., `morph-pascal`) and press `Tab`
+
+**Option 2: Global Snippets**
+
+To use snippets across all projects:
+1. Open VS Code
+2. Go to `File > Preferences > Configure User Snippets`
+3. Select `New Global Snippets file...`
+4. Name it `morph-templates.code-snippets`
+5. Copy content from `framework/templates/.vscode/morph-templates.code-snippets`
+
+---
+
+### JetBrains IDEs (Rider, WebStorm, IntelliJ IDEA)
+
+**Installation:**
+
+1. Open your IDE
+2. Go to `File > Settings > Editor > Live Templates`
+3. Click the `⚙️` gear icon → `Import Settings...`
+4. Select `framework/templates/.idea/morph-templates.xml`
+5. Click `OK` to import
+
+**Activation:**
+
+Snippets will be available in the "MORPH Templates" group. Type the prefix and press `Tab`.
+
+---
+
+## 🎯 Available Snippets
+
+### Handlebars Helpers (Case Transformations)
+
+| Prefix | Output | Example Result |
+|--------|--------|----------------|
+| `morph-pascal` | `{{pascalCase FEATURE_NAME}}` | `UserAuthentication` |
+| `morph-camel` | `{{camelCase FEATURE_NAME}}` | `userAuthentication` |
+| `morph-snake` | `{{snakeCase FEATURE_NAME}}` | `user_authentication` |
+| `morph-title` | `{{titleCase FEATURE_NAME}}` | `User Authentication` |
+| `morph-kebab` | `{{kebabCase FEATURE_NAME}}` | `user-authentication` |
+| `morph-upper-snake` | `{{upperSnakeCase FEATURE_NAME}}` | `USER_AUTHENTICATION` |
+
+### Handlebars Control Flow
+
+| Prefix | Description | Example |
+|--------|-------------|---------|
+| `morph-if` | If block | `{{#if condition}}...{{/if}}` |
+| `morph-if-else` | If-else block | `{{#if condition}}...{{else}}...{{/if}}` |
+| `morph-each` | Loop over array | `{{#each items}}{{this.name}}{{/each}}` |
+| `morph-unless` | Unless block | `{{#unless condition}}...{{/unless}}` |
+
+### .NET Templates
+
+| Prefix | Template | File Extension |
+|--------|----------|----------------|
+| `morph-service` | Service class (business logic) | `.cs` |
+| `morph-repository` | Repository class (data access) | `.cs` |
+| `morph-component` | Blazor component | `.razor` |
+| `morph-migration` | EF Core migration | `.cs` |
+| `morph-job` | Hangfire background job | `.cs` |
+
+### TypeScript Templates
+
+| Prefix | Template | File Extension |
+|--------|----------|----------------|
+| `morph-ts-contract` | TypeScript interfaces (DTOs) | `.ts` |
+
+---
+
+## 🚀 Usage Examples
+
+### Example 1: Creating a Service Template
+
+**Steps:**
+1. Create new file: `UserService.cs`
+2. Type `morph-service` → Press `Tab`
+3. Result:
+   ```csharp
+   namespace {{NAMESPACE}}.Application.Features.{{pascalCase FEATURE_NAME}}.Services;
+
+   public class {{pascalCase FEATURE_NAME}}Service(
+       I{{pascalCase FEATURE_NAME}}Repository repository,
+       ILogger<{{pascalCase FEATURE_NAME}}Service> logger) : I{{pascalCase FEATURE_NAME}}Service
+   {
+       public async Task<{{pascalCase FEATURE_NAME}}Dto?> GetByIdAsync(int id, CancellationToken cancellationToken = default)
+       {
+           // Cursor here
+       }
+   }
+   ```
+
+### Example 2: Using Case Helpers
+
+**Scenario:** Convert `user-authentication` to different cases
+
+```handlebars
+// Type: morph-pascal → Tab
+{{pascalCase FEATURE_NAME}}  // Output: UserAuthentication
+
+// Type: morph-camel → Tab
+{{camelCase FEATURE_NAME}}   // Output: userAuthentication
+
+// Type: morph-snake → Tab
+{{snakeCase FEATURE_NAME}}   // Output: user_authentication
+```
+
+### Example 3: Conditional Rendering
+
+**Scenario:** Show different content based on stack
+
+```handlebars
+// Type: morph-if-else → Tab
+{{#if (eq STACK "Blazor")}}
+  // Blazor-specific code
+{{else}}
+  // Generic code
+{{/if}}
+```
+
+### Example 4: Looping Over Items
+
+**Scenario:** Generate multiple DTOs
+
+```handlebars
+// Type: morph-each → Tab
+{{#each entities}}
+  public class {{pascalCase this.name}}Dto
+  {
+      // Properties
+  }
+{{/each}}
+```
+
+---
+
+## 📝 Customizing Snippets
+
+### VS Code
+
+Edit `framework/templates/.vscode/morph-templates.code-snippets`:
+
+```json
+{
+  "MORPH Template - Custom": {
+    "prefix": "morph-custom",
+    "body": [
+      "// Your custom template",
+      "$1"
+    ],
+    "description": "Your description"
+  }
+}
+```
+
+### JetBrains IDEs
+
+1. Go to `File > Settings > Editor > Live Templates`
+2. Select "MORPH Templates" group
+3. Click `+` → `Live Template`
+4. Set abbreviation (prefix), description, and template text
+
+---
+
+## 🎨 Snippet Scopes
+
+| Snippet | VS Code Scope | JetBrains Scope |
+|---------|---------------|-----------------|
+| Handlebars helpers | All files | All files |
+| .NET templates | `.cs`, `.razor` | C#, HTML |
+| TypeScript templates | `.ts`, `.tsx` | TypeScript |
+
+---
+
+## 💡 Best Practices
+
+**1. Use Helpers Over Pre-computed Variables**
+
+```handlebars
+✅ GOOD: {{pascalCase FEATURE_NAME}}Service
+❌ BAD: {{FEATURE_NAME_PASCAL}}Service  // Deprecated
+```
+
+**2. Chain Helpers for Complex Transformations**
+
+```handlebars
+// Pluralize a PascalCase name
+{{pascalCase (pluralize FEATURE_NAME)}}  // Users, Orders, etc.
+```
+
+**3. Use Conditional Blocks for Stack-Specific Code**
+
+```handlebars
+{{#if (eq STACK "Blazor")}}
+  @inject NavigationManager Navigation
+{{/if}}
+{{#if (eq STACK "Nextjs")}}
+  import { useRouter } from 'next/navigation';
+{{/if}}
+```
+
+**4. Extract Common Patterns to Snippets**
+
+If you find yourself typing the same template code repeatedly, create a custom snippet!
+
+---
+
+## 🔧 Troubleshooting
+
+### Snippets Not Showing Up (VS Code)
+
+**Solution:**
+1. Check file extension matches snippet scope (e.g., `.cs` for C# snippets)
+2. Reload VS Code: `Ctrl+Shift+P` → `Developer: Reload Window`
+3. Verify snippet file location: `framework/templates/.vscode/morph-templates.code-snippets`
+
+### Snippets Not Showing Up (JetBrains)
+
+**Solution:**
+1. Verify import: `File > Settings > Editor > Live Templates` → Check "MORPH Templates" group exists
+2. Check snippet scope: Click snippet → Verify "Applicable in" contexts
+3. Restart IDE
+
+### Tab Not Expanding Snippet
+
+**Solution:**
+- **VS Code:** Ensure `editor.tabCompletion` is enabled in settings
+- **JetBrains:** Ensure `Tab` is set as expansion key in `Settings > Editor > Live Templates`
+
+---
+
+## 📚 Related Documentation
+
+- [Template System README](framework/templates/README.md) - Complete template system documentation
+- [Handlebars Helpers](framework/templates/README.md#handlebars-helpers) - Full list of available helpers
+- [CLI Template Commands](CLAUDE.md#templates) - Command-line template management
+
+---
+
+## 🎁 Contributing Custom Snippets
+
+Have a useful snippet? Share it!
+
+1. Add snippet to appropriate file (`.vscode/` or `.idea/`)
+2. Document it in this README (add row to tables)
+3. Submit PR with description of use case
+
+---
+
+*MORPH-SPEC Template Snippets by Polymorphism Tech*