Skip to content
Circuit

Components

Admonitions — Starlight’s own

Section titled “Admonitions — Starlight’s own”

Starlight ships note / tip / caution / danger asides natively. Circuit doesn’t reimplement them — it remaps their colors (see Color) so they use the same fixed semantic palette as everything else in the family.

import { Aside } from '@astrojs/starlight/components';


<Aside type="tip">Always success-green, everywhere.</Aside>

Code groups — Starlight’s own <Tabs>

Section titled “Code groups — Starlight’s own <Tabs>”
Terminal window
npm install @erisera/circuit

Syntax highlighting above is a custom Shiki theme built from Circuit’s fixed --sx-* palette (see astro.config.mjs) — not a stock Shiki theme.

API parameter list — Circuit’s own

Section titled “API parameter list — Circuit’s own”

Starlight has no built-in pattern for API reference tables, so this one is Circuit’s: a denser layout than a markdown table, built for scanning a long options list.

providersProvider[]required

Backends to route through, in priority order — becomes the fallback chain.

fallback“cascade” | “race” | “none”= “cascade”optional

Try providers in order, race them concurrently, or fail on the first error.

<div class="c-paramlist">
  <div class="c-paramrow">
    <span class="pname">providers</span><span class="ptype">Provider[]</span>
    <span class="preq required">required</span>
    <p class="pdesc">Backends to route through, in priority order.</p>
  </div>
</div>

Buttons, inputs, badges — Circuit’s own

Section titled “Buttons, inputs, badges — Circuit’s own”

accent deployed degraded failed

All from @erisera/circuit/components.css — see the full showcase for every state (hover/active/focus/disabled) side by side.