Fora do catálogo
Peça de produto do fluxo de cursos livres. Não é uma das 81 peças do kit, não tem estado de promoção e não foi feita para reuso em outras páginas. Segue as mesmas regras de cor e acessibilidade que o resto do repositório.
Track
Comparação entre as trilhas.
- Grupo
- Cursos Livres (E-commerce) — fora do catálogo
- Mora em
- app/components/organisms/cursos-phorte/blocks/TrackComparisonBlock.tsx
- Última mudança
- 2026-09-30
Prévia
A peça ao vivo, vinda da ficha, na largura escolhida. Em larguras fixas, ela roda num quadro do tamanho de uma tela de verdade.
1280px, em tamanho real
Variantes na ficha
Lidas da ficha no build, na ordem do palco. Cada uma abre sozinha, sem o styleguide em volta — é o endereço que o palco carrega.
Como usar no código
A importação e o menor uso, lidos do arquivo. O … marca as props obrigatórias.
import { TrackComparisonBlock } from '@/app/components/organisms/cursos-phorte/blocks/TrackComparisonBlock';
<TrackComparisonBlock />Propriedades
Lidas do código da peça no build — não escritas à mão.
| Prop | Tipo | Padrão | Obrigatória | Descrição |
|---|---|---|---|---|
hrefDaTrilha | (trilha: TrackLevel) => string | — | não | Destino do botão de cada trilha (E77). Sem ele, a linha dos botões não aparece — eram três botões sem ação (decisão de 2026-09-28). |
theme | TemaDeBloco | 'light' | não | — |
Tokens de cor
Os tokens semânticos que o código da peça usa, com o valor de hoje em app/globals.css.
| Token | Valor | Usado como |
|---|---|---|
--primary | #D42B2B | bg-primarybg-primary/5border-primary/20text-primary |
--foreground | #1A1A1A | text-inktext-ink/80 |
--success | #2E844A | bg-success/10text-success |
--border | #E5E5E5 | divide-border/50 |
--ink-inverse | #FAFAFA | text-ink-inverse |
--ink-inverse-muted | #C7C7C7 | text-ink-inverse-muted |
--muted | #F4F6F9 | bg-muted/30 |
--muted-foreground | #595959 | text-muted-foreground |
Sem estado de promoção
A peça está fora do catálogo e não passa pela promoção de estado. O axe roda nas variantes da ficha em npm run test; contraste abaixo de AA vira exceção declarada na própria ficha, com a conta — pendência registrada, não aprovação.
Status e recursos
| Tipo | Recurso | Status |
|---|---|---|
| Código | app/components/organisms/cursos-phorte/blocks/TrackComparisonBlock.tsx | Disponível |
| Ficha | stories/cursos-livres/track-comparison-block.stories.tsx | Storybook local |
| Teste de acessibilidade | axe em npm run test | No gate de todo commit |
| Design | Figma | Desativado até a Fase 2 |
Histórico
Os últimos commits que tocaram o arquivo, lidos do git no build.
0298af82026-09-30E147: fechamento da Entrega 11 — REPORT.md, verificação cross-agent e o gate estático estrito
O histórico completo está no GitHub (abre em outra aba).