// Create some circles (invisible)
const circles = [0, 1, 2, 3, 4, 5].map(i => $circle(
0,
$stageWidth / 2,
$stageHeight / 2,
{ fill: `hsl(${60 * i} 100% 50%)`, shadowBlur: 2 }
));
// Animate them up
circles.forEach((circ, i) => {
$animate({ item: circ, radius: $stageWidth/10 + 10, duration: 0.2, shadowBlur: 15 });
$animate({ item: circ, x: i * $stageWidth/5, y: 0, duration: 0.3 });
});
// Drop them back down
$animate(...circles.map((circ, i) => ({
item: circ,
y: $stageHeight / 2,
duration: (i + 1) * 0.2,
shadowBlur: 2
})));