AuroraPlasmaCanvas (ambient)

Stable

Aurore ambiante identité app-wide (US-05c) — canvas WebGL plasma sinusoïdal 3 teintes : cyan dominant nord-ouest, magenta sud-est, trace orbitale. Rotation 360°/240s, respiration 14s, vitesse ×0.16. Opacités token-driven (--aurora-ambient-opacity-*), throttle fpsCap + plafond maxDpr pour l'allégé mobile. L'appelant gère reduced-motion / WebGL indispo (cf. AuroraAmbientBackdrop aethos-web).

import { AuroraPlasmaCanvas } from "@lyra/tokens/components";

Playground

Aperçu borné statique — réel = canvas WebGL plein écran

preset="ambient" : 3 teintes identité (cyan dominant NO, magenta SE, trace orbitale), plasma sinusoïdal, rotation 360°/240s, respiration 14s, vitesse ×0.16. Opacités par thème via --aurora-ambient-opacity-*. fpsCap/maxDpr pour l'allégé mobile.

Démo interactive — réglages du playground (props ajustables en direct) à venir.

// Monté par un backdrop applicatif (une fois, layout), jamais par page.
// L'appelant filtre reduced-motion + WebGL indispo AVANT de monter le canvas.
<AuroraPlasmaCanvas
  preset="ambient"
  isLight={theme === "aurora-light"}
  fpsCap={isMobile ? 30 : undefined}  // allégé mobile (batterie)
  maxDpr={isMobile ? 1 : 2}
/>

Documentation

Aperçu unique — pas de variantes documentées.

isLight, preset ('aurora' | 'ambient'), fpsCap, maxDpr

// Monté par un backdrop applicatif (une fois, layout), jamais par page.
// L'appelant filtre reduced-motion + WebGL indispo AVANT de monter le canvas.
<AuroraPlasmaCanvas
  preset="ambient"
  isLight={theme === "aurora-light"}
  fpsCap={isMobile ? 30 : undefined}  // allégé mobile (batterie)
  maxDpr={isMobile ? 1 : 2}
/>