|
| 1 | +<!-- |
| 2 | + Sync Impact Report |
| 3 | + ================== |
| 4 | + Version change: N/A → 1.0.0 (initial ratification) |
| 5 | + Modified principles: N/A (all new) |
| 6 | + Added sections: |
| 7 | + - Core Principles (5 principles) |
| 8 | + - Technology Constraints |
| 9 | + - Development Workflow |
| 10 | + - Governance |
| 11 | + Removed sections: N/A |
| 12 | + Templates requiring updates: |
| 13 | + - .specify/templates/plan-template.md ✅ aligned (Constitution Check section present) |
| 14 | + - .specify/templates/spec-template.md ✅ aligned (mandatory sections match principles) |
| 15 | + - .specify/templates/tasks-template.md ✅ aligned (test-first ordering present) |
| 16 | + - .specify/templates/checklist-template.md ✅ aligned (generic structure) |
| 17 | + Follow-up TODOs: None |
| 18 | +--> |
| 19 | + |
| 20 | +# Diff Constitution |
| 21 | + |
| 22 | +## Core Principles |
| 23 | + |
| 24 | +### I. Client-Side Only |
| 25 | + |
| 26 | +All logic MUST execute in the browser. This application is a static |
| 27 | +single-page React app with zero backend dependencies. No server-side |
| 28 | +processing, no API calls, and no external data persistence are permitted. |
| 29 | +Build output MUST be deployable to any static hosting provider. |
| 30 | + |
| 31 | +**Rationale**: A diff checker is a developer utility that operates on |
| 32 | +user-provided text. Keeping it client-side ensures privacy (no data |
| 33 | +leaves the browser), eliminates infrastructure costs, and enables |
| 34 | +offline use after initial load. |
| 35 | + |
| 36 | +### II. Full Test Coverage (NON-NEGOTIABLE) |
| 37 | + |
| 38 | +Every component, utility, and feature MUST have 100% test coverage |
| 39 | +across statements, branches, functions, and lines. Tests MUST use |
| 40 | +Testing Library with user-event for interaction simulation. Vitest |
| 41 | +globals are the test runner. No code merges with failing tests or |
| 42 | +coverage below 100%. |
| 43 | + |
| 44 | +**Rationale**: The AGENTS.md contract and CI pipeline (`npm run test:ci`) |
| 45 | +enforce 100% coverage. This is a hard gate — not aspirational. |
| 46 | + |
| 47 | +### III. Accessibility First |
| 48 | + |
| 49 | +All interactive elements MUST be keyboard-navigable and screen-reader |
| 50 | +compatible. Semantic HTML elements MUST be used (button, main, nav, |
| 51 | +textarea, label). ARIA attributes MUST be applied where semantic HTML |
| 52 | +alone is insufficient. Color MUST NOT be the sole means of conveying |
| 53 | +diff information. |
| 54 | + |
| 55 | +**Rationale**: A diff checker is a developer tool used by people with |
| 56 | +diverse abilities. Accessibility is a functional requirement, not a |
| 57 | +polish item. |
| 58 | + |
| 59 | +### IV. Type Safety |
| 60 | + |
| 61 | +TypeScript strict mode MUST be enabled with no escape hatches. All |
| 62 | +component props MUST be defined with explicit interfaces. No `any` |
| 63 | +types are permitted. Type checking (`npm run lint:tsc`) MUST pass |
| 64 | +before any merge. |
| 65 | + |
| 66 | +**Rationale**: Strict typing catches diff-logic edge cases at compile |
| 67 | +time (empty inputs, mismatched line counts, encoding issues) and |
| 68 | +serves as living documentation for component contracts. |
| 69 | + |
| 70 | +### V. Simplicity and Performance |
| 71 | + |
| 72 | +Start with the simplest implementation that satisfies requirements. |
| 73 | +No premature abstractions, no state management libraries unless |
| 74 | +justified by measured complexity. Components MUST remain small and |
| 75 | +focused. Tailwind CSS is the sole styling approach — no custom CSS |
| 76 | +files unless explicitly justified. Bundle size MUST remain minimal |
| 77 | +for fast initial load. |
| 78 | + |
| 79 | +**Rationale**: A diff checker has a bounded feature set. YAGNI |
| 80 | +applies aggressively. Users expect instant interaction with pasted |
| 81 | +text — unnecessary complexity degrades both DX and UX. |
| 82 | + |
| 83 | +## Technology Constraints |
| 84 | + |
| 85 | +The following stack is fixed and MUST NOT be changed without a |
| 86 | +constitution amendment: |
| 87 | + |
| 88 | +- **UI Library**: React 19 (functional components only, React Compiler enabled) |
| 89 | +- **Language**: TypeScript 5 (strict mode) |
| 90 | +- **Build Tool**: Vite 7 |
| 91 | +- **Test Framework**: Vitest 4 with @testing-library/react and @testing-library/user-event |
| 92 | +- **Styling**: Tailwind CSS 4 (utility classes only) |
| 93 | +- **Linting**: ESLint 9 with typescript-eslint, simple-import-sort, react-hooks, tsdoc |
| 94 | +- **Formatting**: Prettier with Tailwind plugin |
| 95 | +- **Node**: 24 (per .nvmrc) |
| 96 | +- **Module System**: ESM only (`"type": "module"`) |
| 97 | + |
| 98 | +Adding new runtime dependencies MUST be justified against the |
| 99 | +Simplicity principle. Dev dependencies for tooling are permitted |
| 100 | +with less scrutiny. |
| 101 | + |
| 102 | +## Development Workflow |
| 103 | + |
| 104 | +All code changes MUST pass these quality gates before merge: |
| 105 | + |
| 106 | +1. **Lint**: `npm run lint` — zero errors, zero warnings |
| 107 | +2. **Type Check**: `npm run lint:tsc` — zero errors |
| 108 | +3. **Tests**: `npm run test:ci` — all pass with 100% coverage |
| 109 | +4. **Build**: `npm run build` — clean production build |
| 110 | + |
| 111 | +Commit messages MUST follow Conventional Commits (enforced by |
| 112 | +commitlint via Husky pre-commit hooks). lint-staged runs on |
| 113 | +every commit to enforce formatting and linting on staged files. |
| 114 | + |
| 115 | +Import order MUST follow simple-import-sort convention: |
| 116 | + |
| 117 | +1. External libraries |
| 118 | +2. Internal absolute imports (`src/`) |
| 119 | +3. Relative imports |
| 120 | + |
| 121 | +File organization MUST follow the established pattern: |
| 122 | + |
| 123 | +``` |
| 124 | +src/components/ComponentName/ |
| 125 | +├── ComponentName.tsx |
| 126 | +├── ComponentName.types.ts (if needed) |
| 127 | +├── ComponentName.test.tsx |
| 128 | +└── index.ts |
| 129 | +``` |
| 130 | + |
| 131 | +## Governance |
| 132 | + |
| 133 | +This constitution supersedes all ad-hoc practices. Every pull |
| 134 | +request and code review MUST verify compliance with these |
| 135 | +principles. Violations MUST be documented and justified in the |
| 136 | +PR description — unjustified violations block merge. |
| 137 | + |
| 138 | +Amendments to this constitution require: |
| 139 | + |
| 140 | +1. A documented rationale for the change |
| 141 | +2. An updated version number following semver (MAJOR for |
| 142 | + principle removals/redefinitions, MINOR for additions, |
| 143 | + PATCH for clarifications) |
| 144 | +3. An updated Sync Impact Report (HTML comment at top of file) |
| 145 | +4. Propagation of changes to dependent templates |
| 146 | + |
| 147 | +Runtime development guidance is maintained in `AGENTS.md` at the |
| 148 | +repository root. The constitution defines principles; AGENTS.md |
| 149 | +provides tactical instructions for AI-assisted development. |
| 150 | + |
| 151 | +**Version**: 1.0.0 | **Ratified**: 2026-02-07 | **Last Amended**: 2026-02-07 |
0 commit comments