@xid-kit/solid

@xid-kit/core 기반의 SolidJS 컨텍스트 provider, 신호 기반 인증 프리미티브, 헤드리스 컴포넌트.

상태

패키지 상태: 현재 패키지. SolidJS 컨텍스트 provider, 신호 기반 프리미티브, 헤드리스 컴포넌트가 구현되었습니다. 프로덕션 인프라에서의 실제 IdP 왕복 테스트는 아직 수동 검증 대기 중입니다.

공급자 설정

XidProvider로 앱을 감싸세요. XidClient를 생성하고, 마운트 시 client.load()를 호출하여 현재 세션을 가져오며, onCleanup을 통해 정리합니다.

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

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

인증 프리미티브

각 프리미티브는 반응형 Accessor<T>(게터 함수)를 반환합니다. 변경 사항을 추적하려면 JSX 또는 createEffect에서 호출하세요.

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 및 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
}

헤드리스 컴포넌트

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

내보내기	종류	목적
`XidProvider`	컴포넌트	XidClient를 생성하고, 마운트 시 load()를 호출하며, onCleanup을 통해 정리합니다
`createAuth`	프리미티브	Accessor로서의 isLoaded, isSignedIn, userId, sessionId, session, getToken, signOut
`createUser`	프리미티브	isLoaded / isSignedIn / user에 대한 판별 유니온을 감싸는 Accessor
`createOrganization`	프리미티브	활성 조직의 organization, membership, setActive를 반환하는 Accessor
`createSession`	프리미티브	활성 세션의 session과 getToken을 반환하는 Accessor
`SignInButton`	컴포넌트	클릭 시 로그인 URL로 이동하는 헤드리스 버튼
`SignOutButton`	컴포넌트	클릭 시 signOut을 호출하는 헤드리스 버튼
`Protect`	컴포넌트	폴백 prop이 있는 역할 및 권한 게이트

토큰 저장소

세션 토큰은 XID Worker가 설정하는 HttpOnly cookie입니다. SDK는 토큰을 localStorage에 저장하지 않습니다.
getToken()은 @xid-kit/core의 TokenManager가 캐시하는 단기 JWT(60초)를 반환합니다.