Design system

Design system

Every component in the Spica system, live and interactive — poke at them. They’re the real thing.

Button

Create workerCreate workerCreate worker

IconButton

Tabs

OverviewRoutes3Settings

Waveform timing

How dependencies become available

Play

authProvides

AuthClass

userModel

.use(auth)

mainNo dependency

/profileAuth missing

Auth.getProfile()

4s

1/4

main handles /profile and reads Auth from its context. Nothing provides Auth yet.

Decorate. auth.decorate('Auth', Auth) attaches the class to the auth instance, and .model(Auth.models) registers its user model.

Dependency. main.use(auth) declares the dependency. main now has auth in its tree.

Dependency. That's all it takes: Auth is in main's context and its user model is registered on main, so /profile can call Auth.getProfile(). Without .use(auth), it stays missing.

Checkbox

Email me updatesSelect all

Select

SelectMenu

StatusHealthy

Dropdown

Actions

InputGroup

Search

Tooltip

Hover me

Callout

Tip

Hooks you add before a route only apply to the routes below it.

Card

Essential

Routing

Map a method and a path to a handler, and Elysia does the rest.

NumberedCards

1. Install

   Run bun create elysia and you have a server in one command.

2. Add a route

   Chain .get, .post, and friends — types follow you all the way to the client.

FileTree

• src
• index.ts
• routesNew
• types.ts1 kB
• test
• readme.md2 kB
• package.json

Table

Deployments7 rows

	Name▲	Status	Region	p95 ms

	api-gateway	Healthy	iad1	42
	auth-worker	Healthy	sin1	68
	billing	Degraded	fra1	214
	docs-site	Healthy	cdg1	19

1–4 of 712