@cee.bio/runtime

Componentes, widgets e hooks usados pelos scaffolds do @cee.bio/cli pra montar um profile.tsx. No cee dev esse pacote renderiza localmente (com mocks); em produção o servidor cee.bio externaliza ele e injeta as implementações reais com acesso aos dados da conta.

npm i @cee.bio/runtime

import { CeeProvider, Card, Avatar, Name, Bio, DiscordWidget } from '@cee.bio/runtime';

export default function Profile() {
  return (
    <CeeProvider>
      <Card>
        <Avatar />
        <Name />
        <Bio />
        <DiscordWidget />
      </Card>
    </CeeProvider>
  );
}

Componentes base

Tudo que o profile.tsx clássico precisa:

• Card — wrapper principal do bloco de perfil.
• Avatar — foto + frame (decorations).
• Name — display name + handle.
• Bio — texto livre formatado.
• Tags — chips de interesse/persona.
• SocialLinks — ícones com link pras redes vinculadas.
• Badges — emblemas conquistados.
• Links — lista de links autorais (estilo linktree).
• Music — embed de player (Spotify/Apple/YouTube Music).

Widgets

Blocos plugáveis com dados em tempo real (todos com mock no cee dev):

• DiscordWidget — presence ao vivo (status, jogo, Spotify, voz).
• YoutubeWidget — último vídeo / live atual.
• GithubWidget — heatmap + repos pinados.
• RobloxWidget — status online + jogo atual.
• SteamWidget — playing now + biblioteca recente.
• ValorantWidget — rank, último match, skin pinada.
• StackWidget — stack de tech agrupada.
• CustomWidget — bloco livre com imagens + CTAs.

Hooks

Pra quem quer montar UIs próprias sem usar os widgets prontos:

• useCee() — acessa o CeeUser atual e helpers do provider.
• useDiscordPresence() — singleton WS, ref-counted entre componentes.
• useWidgetData() — fetch com cache + dedup + fallback mock no dev.
• useCeeApi() — abstrai chamadas pro backend cee.bio passando pelo proxy /__cee quando em cee dev.

Mocks

• mockUser — CeeUser completo pra renderizar tudo sem login.
• mockPresence(overrides?) — gera um DiscordPresence falso pros hooks/widgets quando você quer testar sem WS real.

Docs

Lista completa de props, tipos e exemplos: https://cee.bio/devs