Skip to main content

​
Visão Geral

O ecossistema Easy Goal é composto por repositórios de aplicações independentes e um monorepo de packages compartilhados (easygoal-monorepo) que centraliza identidade visual e autenticação.

​
Monorepo de Packages (easygoal-monorepo)

easygoal-monorepo/             github.com/Easy-Goal/easygoal-monorepo
├── packages/
│   ├── ui/                    @easygoal/ui — Design tokens + componentes React
│   │   ├── src/
│   │   │   ├── components/Logo/   Componente <Logo />
│   │   │   ├── tokens/colors.ts   Paleta oficial (hex + CSS vars)
│   │   │   └── index.ts
│   │   ├── package.json
│   │   └── tsup.config.ts
│   └── auth/                  @easygoal/auth — SSO providers + middleware
│       ├── src/
│       │   ├── providers/AuthProvider.tsx
│       │   ├── callback/handler.ts
│       │   ├── callback/route.ts
│       │   ├── middleware/updateSession.ts
│       │   ├── types.ts
│       │   └── index.ts
│       ├── package.json
│       └── tsup.config.ts
├── package.json               root — pnpm workspaces
└── pnpm-workspace.yaml

​
Packages disponíveis

@easygoal/ui

Componente <Logo /> e tokens de cor da identidade visual — azul escuro e laranja. Disponível.

@easygoal/auth

AuthProvider, handleAuthCallback, updateSession — SSO com Next.js + Supabase. Disponível.

@easygoal/types

Interfaces TypeScript compartilhadas: UserProfile, Subscription, WebhookPayload. Planejado.

@easygoal/webhooks

Utilitário de validação HMAC SHA256 para webhooks entre app-front e SSO. Planejado.

​
Paleta de Cores Oficial

Os valores abaixo são a fonte da verdade. Use @easygoal/ui/tokens para importar programaticamente.
TokenHSLHexUso
primary24 95% 53%#F97316Botões, links, destaques
primaryLight24 90% 60%#FB923CHover states
primaryDark21 90% 48%#EA580CActive states
background222 47% 11%#0F1729Fundo principal
card222 47% 13%#121E34Cards e painéis
secondary222 47% 18%#182644Elementos secundários
mutedForeground215 20% 55%#798BAATexto secundário
/* globals.css — copiar para novos projetos */
@layer base {
  :root {
    --background: 222 47% 11%;
    --foreground: 210 40% 98%;
    --primary: 24 95% 53%;
    --primary-foreground: 0 0% 100%;
    --card: 222 47% 13%;
    --border: 222 47% 20%;
    --ring: 24 95% 53%;
    --radius: 0.75rem;
  }
}

​
Adicionando novos packages

Para adicionar um package ao monorepo, crie um novo diretório em packages/: 
mkdir -p packages/meu-package/src
Crie packages/meu-package/package.json com o nome @easygoal/meu-package, tsconfig.json e tsup.config.ts seguindo o padrão dos packages existentes. O pnpm workspace detecta automaticamente.