Ir para o conteúdo

@xid-kit/solid

Provider de contexto SolidJS, primitivas de autenticação baseadas emsignals e componentes headless sobre @xid-kit/core.

Ver como Markdown

Estado

O status do pacote é Pacote atual. Provider de contextoSolidJS, primitivas baseadas em signals e componentes headless estãoimplementados. Uma ida e volta real com o IdP em infraestrutura deprodução ainda está pendente de verificação manual.

Configuração do provedor

Envolva seu aplicativo com XidProvider. Ele cria umXidClient, chama client.load() na montagem para buscara sessão atual e desmonta via onCleanup.

import { XidProvider } from '@xid-kit/solid'

export function App() {
  return (
    <XidProvider publishableKey="pk_live_...">
      <Routes />
    </XidProvider>
  )
}

Primitivas de autenticação

Cada primitiva retorna Accessor<T> reativo (funções getter).Chame-as no JSX ou em createEffect para rastrear mudanças.

import { createAuth, createUser, createOrganization, createSession } from '@xid-kit/solid'
import { Show } from 'solid-js'

function Profile() {
  const auth = createAuth()
  // auth.isLoaded()  -- Accessor<boolean>
  // auth.isSignedIn() -- Accessor<boolean>
  // auth.userId()    -- Accessor<string | null>
  // auth.getToken()  -- () => Promise<Result<string, XidError>>
  // auth.signOut()   -- (options?) => Promise<Result<null, XidError>>

  return (
    <Show when={auth.isLoaded()} fallback={<p>Loading...</p>}>
      <Show when={auth.isSignedIn()} fallback={<p>Not signed in</p>}>
        <p>Signed in as {auth.userId()}</p>
        <button onClick={() => void auth.signOut()}>Sign out</button>
      </Show>
    </Show>
  )
}

createOrganization e createSession

const org = createOrganization()
// org() is CreateOrganizationReturn
if (org().isSignedIn) {
  console.log(org().organization?.name, org().membership?.role)
  await org().setActive('org_new_id')
}

const session = createSession()
if (session().isSignedIn) {
  const { value: token } = await session().getToken()
  // use token for backend requests
}

Componentes headless

import { SignInButton, SignOutButton, Protect } from '@xid-kit/solid'

// Navigates to /sign-in by default
<SignInButton signInUrl="/auth/sign-in" redirectUrl="/dashboard">
  Log in
</SignInButton>

// Signs out all sessions; pass sessionId to target one
<SignOutButton redirectUrl="/home">Log out</SignOutButton>

// Role and permission gate
<Protect role="org:admin" fallback={<p>Admins only</p>}>
  <Settings />
</Protect>

<Protect permission="org:member:write" fallback={null}>
  <InviteForm />
</Protect>

API exportada

Exportar Tipo Finalidade
XidProvider componente Cria XidClient, chama load() na montagem e desmonta via onCleanup
createAuth primitiva isLoaded, isSignedIn, userId, sessionId, session, getToken, signOutcomo Accessors
createUser primitiva Accessor que encapsula união discriminada em isLoaded / isSignedIn /user
createOrganization primitiva Accessor que retorna organização, membership e setActive para a orgativa
createSession primitiva Accessor que retorna sessão e getToken para a sessão ativa
SignInButton componente Botão headless que navega para a URL de login ao clicar
SignOutButton componente Botão headless que chama signOut ao clicar
Protect componente Gate de papel e permissão com prop de fallback

Armazenamento de tokens

  • Os tokens de sessão são cookies HttpOnly definidos pelo XIDWorker. O SDK nunca armazena tokens no localStorage.
  • getToken() retorna um JWT de curta duração (60 s) em cachepelo TokenManager em @xid-kit/core.
Navegação

Digite para pesquisar...

Use as teclas de seta para navegarPressione Enter para selecionarPressione Escape para fechar