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.
Phorte
Cartão de matrícula que acompanha a rolagem.
- Grupo
- Cursos Livres (E-commerce) — fora do catálogo
- Mora em
- app/components/organisms/cursos-phorte/PhorteStickyEnrollCard.tsx
- Última mudança
- 2026-09-29
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.
Na largura da página: 0px
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 { PhorteStickyEnrollCard } from '@/app/components/organisms/cursos-phorte/PhorteStickyEnrollCard';
<PhorteStickyEnrollCard course={…} />Propriedades
Lidas do código da peça no build — não escritas à mão.
| Prop | Tipo | Padrão | Obrigatória | Descrição |
|---|---|---|---|---|
course | PhorteCourse | — | sim | — |
hrefDaMatricula | string | — | não | Destino do CTA principal (course.ctaLabel). Sem ele — e sem onMatricular — o botão não aparece (E74). |
onMatricular | () => void | — | não | — |
hrefDoConsultor | string | — | não | Destino de "Falar com consultor". Mesma regra, com onFalarComConsultor. |
onFalarComConsultor | () => void | — | 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 |
|---|---|---|
--border | #E5E5E5 | border-border |
--card | #FFFFFF | bg-card |
--foreground | #1A1A1A | text-ink |
--muted | #F4F6F9 | bg-muted |
--muted-foreground | #595959 | text-muted-foreground |
--success | #2E844A | text-success |
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/PhorteStickyEnrollCard.tsx | Disponível |
| Ficha | stories/cursos-livres/phorte-sticky-enroll-card.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.
fdd10ff2026-09-29ESTADO: E109 concluida, roteiro final fechado; proximo o merge na main
O histórico completo está no GitHub (abre em outra aba).