Algebra Tiles / Blocos Algébricos

Português

Aplicativo interativo para aprender álgebra usando peças (tiles) e manipulação visual. Construído com React + Vite + TypeScript e suporte a PT/EN.

Principais recursos

• Inventário de peças algébricas com arrastar e soltar.
• Grade com snap para posicionamento preciso.
• Seleção múltipla por arrasto (retângulo de seleção) e suporte a seleção com Shift/Ctrl.
• Menu de contexto (botão direito) com ações: limpar, zero pair, rotacionar, apagar, desfazer/refazer (e validar no Workspace).
• Rotação das peças lineares x (inclui atalho R).
• Legenda das peças acessível pelo ícone ? no topo.
• Telas: Home, Equações, Dificuldade, Workspace, Canvas básico, Solve (dois lados) e Factor (modelagem de área).

Como rodar

npm install
npm run dev

Outros comandos

npm run build
npm run preview
npm run lint
npm run typecheck
npm run format

Estado e limitações

As interações de arrastar e soltar, snap na grade, seleção, rotação e desfazer/refazer estão implementadas no cliente. O repositório ainda não possui testes automatizados de interação; a CI valida lint, tipos e build.

English

Interactive app to learn algebra using tiles and visual manipulation. Built with React + Vite + TypeScript and PT/EN support.

Key features

• Algebra tiles inventory with drag and drop.
• Snap-to-grid board for precise placement.
• Multi-selection via drag (selection rectangle) and Shift/Ctrl selection.
• Right-click context menu: clear, zero pair, rotate, delete, undo/redo (and validation in Workspace).
• Rotate linear x tiles (includes the R shortcut).
• Piece legend available via the ? icon in the header.
• Screens: Home, Equations, Difficulty, Workspace, Basic Canvas, Solve (two sides), and Factor (area modeling).

Run locally

npm install
npm run dev

Other commands

npm run build
npm run preview
npm run lint
npm run typecheck
npm run format

Status and limitations

Drag and drop, grid snapping, selection, rotation, and undo/redo are implemented in the client. Automated interaction tests are not yet available; CI validates lint, types, and the production build.