src/ contains the application code. Use src/canvas/ for interactive canvas state and UI, src/inference/ for layout-detection logic and unit tests, and src/output/ for preview/CSS rendering. Shared types live in src/types.ts. Static assets belong in public/ or src/assets/. End-to-end tests live in tests/, with JSON fixtures in tests/fixtures/ and screenshot artifacts in tests/screenshots/.
Run npm run dev to start the Vite dev server at http://localhost:5173. Use npm run build for a production build; it runs TypeScript compilation first, so treat it as the main correctness gate. Run npm run lint for ESLint checks. Use npm run test:unit for Vitest unit coverage in src/inference/__tests__/, npm run test:e2e for Playwright browser tests, and npm test to run both suites.
This repo uses TypeScript with React function components. Follow the existing style: 2-space indentation, single quotes, semicolons omitted, and small, typed helper functions close to their consumers. Use PascalCase for React components (OutputPanel.tsx), camelCase for functions and variables, and descriptive filenames for tests such as cluster.test.ts. Linting is defined in eslint.config.js with @eslint/js, typescript-eslint, eslint-plugin-react-hooks, and eslint-plugin-react-refresh.
Add inference-focused unit tests beside the engine under src/inference/__tests__/. Prefer narrow fixtures that exercise one scoring or sizing behavior at a time. Browser flows belong in tests/canvas.spec.ts; reuse fixtures from tests/fixtures/*.json when possible. Before opening a PR, run at least npm run build, npm run test:unit, and any affected Playwright coverage.
The visible history currently contains a single commit: Initial commit: VisualCompiler — visual-to-CSS layout inference tool. Until a stronger pattern emerges, use short imperative subjects with a scope when helpful, for example Fix preview fit scaling for wrapped flex layouts. PRs should include a concise description, linked issue if one exists, and screenshots or generated CSS snippets for UI or inference changes.
Do not commit dist/, test-results/, or ad hoc screenshots unless they are intentional fixtures. Playwright starts the app through npm run dev, so keep port 5173 available when running E2E tests locally.