Skip to content
Vendidit Auth

How to use the playground

Browse remotely

  1. Visit auth-demo.vendidit.com.
  2. Use the catalog navigation to find the atom / form / flow you need.
  3. Each catalog page exercises one component with realistic props and shows the source inline.
  4. To see a complete end-to-end integration (auth provider, route wiring, side-effects), open the corresponding page under src/pages/ in the repo.

Log in to see admin features

The demo points at the production auth-server. Log in with a @vendidit.com email and the admin catalog pages (AdminUserEditPanel, OrgRoleEditor, MembersList, AuditLogTable, etc.) become functional.

  1. Find the equivalent demo page. Building a login screen? Open CompleteLoginFlow’s catalog page. Building a “members of my org” panel? Open MembersList.
  2. Copy the integration pattern. The catalog page shows the import, the prop shape, and the surrounding AuthProvider setup.
  3. Drop down a layer when needed. If CompleteLoginFlow is too opinionated, look at LoginForm (a form-only). If LoginForm is too opinionated, look at the atoms (EmailField, PasswordField, SsoButton).
  4. Wire it in your own app using the imports the catalog shows. Pin @vendidit/auth-client and your framework adapter (/preact, /react, etc.).

Run the demo locally

Terminal window
git clone https://github.com/Vendidit/auth-client-demo
cd auth-client-demo
npm install
npm run dev   # → http://localhost:5173

By default the local demo talks to localhost:8080 (the auth-server’s Docker dev port). Override via .env.local:

VITE_AUTH_SERVER_URL=https://new-auth.vendidit.com/api/v1
VITE_APP_CODE=auth-demo