@goldenpath-cloud/frontend-standards/configs/.amazonq.json

Golden Path frontend development standards for Svelte 5 with TypeScript, testing, and validation

{
  "version": "1.0",
  "description": "Golden Path frontend development standards for Svelte 5 with TypeScript, testing, and validation",
  "standards": {
    "language": "typescript",
    "frontend": {
      "framework": "svelte5",
      "styling": "css",
      "accessibility": "wcag-aa"
    },
    "validation": "zod",
    "testing": {
      "unit": "vitest",
      "component": "testing-library",
      "e2e": "playwright",
      "accessibility": "automated"
    }
  },
  "rules": {
    "typescript": {
      "interfaces": "required",
      "strictMode": true,
      "noImplicitAny": true,
      "explicitReturnTypes": false
    },
    "svelte": {
      "version": "5",
      "runes": "required",
      "accessibility": "enforce",
      "semanticHtml": "required"
    },
    "validation": {
      "library": "zod",
      "formValidation": "required",
      "errorHandling": "comprehensive"
    },
    "testing": {
      "accessibility": "required",
      "userCentric": "required",
      "asyncHandling": "proper",
      "mocking": "comprehensive"
    }
  },
  "codeGeneration": {
    "style": "functional",
    "comments": "minimal",
    "errorHandling": "explicit",
    "accessibility": "automatic",
    "testing": "included"
  },
  "validation": {
    "typescript": {
      "enabled": true,
      "config": "tsconfig.json"
    },
    "eslint": {
      "enabled": true,
      "config": ".eslintrc.js"
    },
    "testing": {
      "unit": "vitest",
      "e2e": "playwright",
      "coverage": "enabled"
    }
  },
  "patterns": {
    "componentWithProps": {
      "description": "Basic Svelte 5 component with TypeScript props interface",
      "tags": [
        "component",
        "typescript",
        "props"
      ]
    },
    "reactiveState": {
      "description": "Svelte 5 reactive state with $state, $derived, and $effect",
      "tags": [
        "state",
        "reactive",
        "runes"
      ]
    },
    "formWithValidation": {
      "description": "Form component with Zod schema validation",
      "tags": [
        "form",
        "validation",
        "zod"
      ]
    },
    "e2eTest": {
      "description": "End-to-end test with Playwright and accessibility checks",
      "tags": [
        "testing",
        "e2e",
        "playwright",
        "accessibility"
      ]
    },
    "componentTest": {
      "description": "Component test with Testing Library and user-event",
      "tags": [
        "testing",
        "component",
        "testing-library",
        "user-event"
      ]
    },
    "integrationTest": {
      "description": "Integration test with API mocking and error handling",
      "tags": [
        "testing",
        "integration",
        "api",
        "mocking"
      ]
    }
  },
  "instructions": [
    "Always use TypeScript interfaces for type definitions",
    "Use strict TypeScript configuration",
    "Prefer explicit error handling over implicit any",
    "Use functional programming patterns where appropriate",
    "Use Svelte 5 runes ($state, $derived, $effect) instead of legacy reactive statements",
    "Include proper ARIA attributes for accessibility",
    "Use semantic HTML elements (button, form, input, etc.)",
    "Follow mobile-first responsive design principles",
    "Implement Zod validation for all form inputs",
    "Include error handling and loading states",
    "Use comprehensive validation schemas",
    "For testing: use accessibility-first locators (getByRole, getByLabelText)",
    "For testing: prefer user-event over fireEvent for user interactions",
    "For testing: include both success and error scenarios",
    "For testing: mock external dependencies properly",
    "For testing: verify accessibility attributes and keyboard navigation"
  ]
}