Astro

Install

Styles and fonts

Load once at the application root. White is the default; set data-theme="dark" for dark mode. Typography comes from the shared tokens.

Contract

• Import styles once in the application layout. Each Astro component registers its own elements; no client:* directive is needed.
• Spread a native child’s slot attribute when it must reach the custom element, as in the list above. Use normal Astro slots for the facade’s named slots.
• Set complex properties and attach native event listeners in a browser script. Server-rendered slotted content is available before upgrade; internal controls still need JavaScript.

Example

Scope

Import components individually. Charts and motion remain optional. See validation and limitations for the tested combinations.