@basmilius/sparkle 2.0.0 → 2.2.0

package/src/confetti/shapes.ts

@@ -0,0 +1,104 @@
+import type { Shape } from './types';
+
+const TWO_PI = Math.PI * 2;
+
+export const SHAPE_PATHS: Record<Shape, Path2D> = {
+    bowtie: (() => {
+        const path = new Path2D();
+        path.moveTo(-1, -0.7);
+        path.lineTo(0, 0);
+        path.lineTo(-1, 0.7);
+        path.closePath();
+        path.moveTo(1, -0.7);
+        path.lineTo(0, 0);
+        path.lineTo(1, 0.7);
+        path.closePath();
+        return path;
+    })(),
+    circle: (() => {
+        const path = new Path2D();
+        path.ellipse(0, 0, 0.6, 1, 0, 0, TWO_PI);
+        return path;
+    })(),
+    crescent: (() => {
+        const path = new Path2D();
+        path.arc(0, 0, 1, 0, TWO_PI, false);
+        path.arc(0.45, 0, 0.9, 0, TWO_PI, true);
+        return path;
+    })(),
+    diamond: (() => {
+        const path = new Path2D();
+        path.moveTo(0, -1);
+        path.lineTo(0.6, 0);
+        path.lineTo(0, 1);
+        path.lineTo(-0.6, 0);
+        path.closePath();
+        return path;
+    })(),
+    heart: (() => {
+        const path = new Path2D();
+        path.moveTo(0, 1);
+        path.bezierCurveTo(-0.4, 0.55, -1, 0.1, -1, -0.35);
+        path.bezierCurveTo(-1, -0.8, -0.5, -1, 0, -0.6);
+        path.bezierCurveTo(0.5, -1, 1, -0.8, 1, -0.35);
+        path.bezierCurveTo(1, 0.1, 0.4, 0.55, 0, 1);
+        path.closePath();
+        return path;
+    })(),
+    hexagon: (() => {
+        const path = new Path2D();
+        for (let i = 0; i < 6; i++) {
+            const angle = (i * Math.PI / 3) - Math.PI / 2;
+            if (i === 0) {
+                path.moveTo(Math.cos(angle), Math.sin(angle));
+            } else {
+                path.lineTo(Math.cos(angle), Math.sin(angle));
+            }
+        }
+        path.closePath();
+        return path;
+    })(),
+    ribbon: (() => {
+        const path = new Path2D();
+        path.rect(-0.2, -1, 0.4, 2);
+        return path;
+    })(),
+    ring: (() => {
+        const path = new Path2D();
+        path.arc(0, 0, 1, 0, TWO_PI, false);
+        path.arc(0, 0, 0.55, 0, TWO_PI, true);
+        return path;
+    })(),
+    square: (() => {
+        const path = new Path2D();
+        path.rect(-0.7, -0.7, 1.4, 1.4);
+        return path;
+    })(),
+    star: (() => {
+        const path = new Path2D();
+        for (let i = 0; i < 10; i++) {
+            const r = i % 2 === 0 ? 1 : 0.42;
+            const angle = (i * Math.PI / 5) - Math.PI / 2;
+            if (i === 0) {
+                path.moveTo(r * Math.cos(angle), r * Math.sin(angle));
+            } else {
+                path.lineTo(r * Math.cos(angle), r * Math.sin(angle));
+            }
+        }
+        path.closePath();
+        return path;
+    })(),
+    triangle: (() => {
+        const path = new Path2D();
+        for (let i = 0; i < 3; i++) {
+            const angle = (i * 2 * Math.PI / 3) - Math.PI / 2;
+            if (i === 0) {
+                path.moveTo(Math.cos(angle), Math.sin(angle));
+            } else {
+                path.lineTo(Math.cos(angle), Math.sin(angle));
+            }
+        }
+        path.closePath();
+        return path;
+    })()
+};

package/src/confetti/types.ts

@@ -3,6 +3,7 @@ export type Config = {
     readonly colors: string[];
     readonly decay: number;
     readonly gravity: number;
+    readonly palette: Palette;
     readonly particles: number;
     readonly shapes: Shape[];
     readonly spread: number;
@@ -48,6 +49,8 @@ export type ParticleConfig = {
     readonly y: number;
 };
 
+export type Palette = 'classic' | 'pastel' | 'vibrant' | 'warm';
+
 export type RGB = [r: number, g: number, b: number];
 
-export type Shape = 'circle' | 'diamond' | 'ribbon' | 'square' | 'star' | 'triangle';
+export type Shape = 'bowtie' | 'circle' | 'crescent' | 'diamond' | 'heart' | 'hexagon' | 'ribbon' | 'ring' | 'square' | 'star' | 'triangle';

package/src/distance.ts

@@ -4,5 +4,5 @@ export function distance(a: Point, b: Point): number {
     let x = a.x - b.x;
     let y = a.y - b.y;
 
-    return Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
+    return Math.sqrt(x * x + y * y);
 }

package/src/donuts/consts.ts

@@ -0,0 +1,19 @@
+import { type Mulberry32, mulberry32 } from '@basmilius/utils';
+import type { DonutsConfig } from './layer';
+
+export const MULBERRY: Mulberry32 = mulberry32(13);
+
+export const DEFAULT_CONFIG: DonutsConfig = {
+    background: '#a51955',
+    collisionPadding: 20,
+    colors: ['#bd1961', '#da287c'],
+    count: 12,
+    mouseAvoidance: false,
+    mouseAvoidanceRadius: 150,
+    mouseAvoidanceStrength: 0.03,
+    radiusRange: [60, 90],
+    repulsionStrength: 0.02,
+    rotationSpeedRange: [0.0005, 0.002],
+    speedRange: [0.15, 0.6],
+    thickness: 0.39
+};

package/src/donuts/donut.ts

@@ -0,0 +1,12 @@
+export type Donut = {
+    outerRadius: number;
+    innerRadius: number;
+    x: number;
+    y: number;
+    angle: number;
+    speed: number;
+    rotationSpeed: number;
+    color: string;
+    vx: number;
+    vy: number;
+};

package/src/donuts/index.ts

@@ -0,0 +1,9 @@
+import { Donuts } from './layer';
+import type { DonutsConfig } from './layer';
+import type { Effect } from '../effect';
+
+export function createDonuts(config?: DonutsConfig): Effect<DonutsConfig> {
+    return new Donuts(config);
+}
+
+export type { DonutsConfig };

package/src/donuts/layer.ts

@@ -0,0 +1,301 @@
+import { Effect } from '../effect';
+import { DEFAULT_CONFIG, MULBERRY } from './consts';
+import type { Donut } from './donut';
+
+export interface DonutsConfig {
+    readonly background?: string;
+    readonly collisionPadding?: number;
+    readonly colors?: string[];
+    readonly count?: number;
+    readonly mouseAvoidance?: boolean;
+    readonly mouseAvoidanceRadius?: number;
+    readonly mouseAvoidanceStrength?: number;
+    readonly radiusRange?: [number, number];
+    readonly repulsionStrength?: number;
+    readonly rotationSpeedRange?: [number, number];
+    readonly scale?: number;
+    readonly speedRange?: [number, number];
+    readonly thickness?: number;
+}
+
+export class Donuts extends Effect<DonutsConfig> {
+    readonly #background: string;
+    readonly #collisionPadding: number;
+    readonly #colors: string[];
+    readonly #count: number;
+    #mouseAvoidance: boolean;
+    #mouseAvoidanceRadius: number;
+    #mouseAvoidanceStrength: number;
+    readonly #radiusRange: [number, number];
+    #repulsionStrength: number;
+    readonly #rotationSpeedRange: [number, number];
+    readonly #scale: number;
+    readonly #speedRange: [number, number];
+    readonly #thickness: number;
+    readonly #onMouseMoveBound: (event: MouseEvent) => void;
+    readonly #onMouseLeaveBound: () => void;
+    #donuts: Donut[] = [];
+    #mouseX: number = -1;
+    #mouseY: number = -1;
+    #mouseOnCanvas: boolean = false;
+    #width: number = 960;
+    #height: number = 540;
+    #initialized: boolean = false;
+
+    constructor(config: DonutsConfig = {}) {
+        super();
+
+        const scale = config.scale ?? 1;
+
+        this.#background = config.background ?? DEFAULT_CONFIG.background!;
+        this.#collisionPadding = (config.collisionPadding ?? DEFAULT_CONFIG.collisionPadding!) * scale;
+        this.#colors = config.colors ?? DEFAULT_CONFIG.colors!;
+        this.#count = config.count ?? DEFAULT_CONFIG.count!;
+        this.#mouseAvoidance = config.mouseAvoidance ?? DEFAULT_CONFIG.mouseAvoidance!;
+        this.#mouseAvoidanceRadius = (config.mouseAvoidanceRadius ?? DEFAULT_CONFIG.mouseAvoidanceRadius!) * scale;
+        this.#mouseAvoidanceStrength = config.mouseAvoidanceStrength ?? DEFAULT_CONFIG.mouseAvoidanceStrength!;
+        this.#radiusRange = [
+            (config.radiusRange ?? DEFAULT_CONFIG.radiusRange!)[0] * scale,
+            (config.radiusRange ?? DEFAULT_CONFIG.radiusRange!)[1] * scale
+        ];
+        this.#repulsionStrength = config.repulsionStrength ?? DEFAULT_CONFIG.repulsionStrength!;
+        this.#rotationSpeedRange = config.rotationSpeedRange ?? DEFAULT_CONFIG.rotationSpeedRange!;
+        this.#scale = scale;
+        this.#speedRange = [
+            (config.speedRange ?? DEFAULT_CONFIG.speedRange!)[0] * scale,
+            (config.speedRange ?? DEFAULT_CONFIG.speedRange!)[1] * scale
+        ];
+        this.#thickness = config.thickness ?? DEFAULT_CONFIG.thickness!;
+
+        this.#onMouseMoveBound = (event: MouseEvent) => this.#onMouseMove(event);
+        this.#onMouseLeaveBound = () => this.#onMouseLeave();
+    }
+
+    onResize(width: number, height: number): void {
+        this.#width = width;
+        this.#height = height;
+
+        if (!this.#initialized) {
+            this.#initialized = true;
+            this.#donuts = [];
+
+            for (let i = 0; i < this.#count; i++) {
+                this.#donuts.push(this.#createNonOverlapping());
+            }
+        }
+    }
+
+    onMount(canvas: HTMLCanvasElement): void {
+        if (this.#mouseAvoidance) {
+            canvas.addEventListener('mousemove', this.#onMouseMoveBound, {passive: true});
+            canvas.addEventListener('mouseleave', this.#onMouseLeaveBound, {passive: true});
+        }
+    }
+
+    onUnmount(canvas: HTMLCanvasElement): void {
+        canvas.removeEventListener('mousemove', this.#onMouseMoveBound);
+        canvas.removeEventListener('mouseleave', this.#onMouseLeaveBound);
+    }
+
+    configure(config: Partial<DonutsConfig>): void {
+        if (config.mouseAvoidance !== undefined) {
+            this.#mouseAvoidance = config.mouseAvoidance;
+        }
+        if (config.mouseAvoidanceRadius !== undefined) {
+            this.#mouseAvoidanceRadius = config.mouseAvoidanceRadius;
+        }
+        if (config.mouseAvoidanceStrength !== undefined) {
+            this.#mouseAvoidanceStrength = config.mouseAvoidanceStrength;
+        }
+        if (config.repulsionStrength !== undefined) {
+            this.#repulsionStrength = config.repulsionStrength;
+        }
+    }
+
+    tick(dt: number, width: number, height: number): void {
+        this.#width = width;
+        this.#height = height;
+
+        this.#resolveCollisions(dt);
+
+        if (this.#mouseAvoidance && this.#mouseOnCanvas) {
+            this.#resolveMouseAvoidance(dt);
+        }
+
+        for (const donut of this.#donuts) {
+            this.#updateDonut(donut, dt);
+        }
+    }
+
+    draw(ctx: CanvasRenderingContext2D, width: number, height: number): void {
+        ctx.globalAlpha = 1;
+        ctx.fillStyle = this.#background;
+        ctx.fillRect(0, 0, width, height);
+
+        for (const donut of this.#donuts) {
+            const cos = Math.cos(donut.angle);
+            const sin = Math.sin(donut.angle);
+            ctx.setTransform(cos, sin, -sin, cos, donut.x, donut.y);
+
+            ctx.beginPath();
+            ctx.arc(0, 0, donut.outerRadius, 0, Math.PI * 2);
+            ctx.arc(0, 0, donut.innerRadius, 0, Math.PI * 2, true);
+            ctx.closePath();
+
+            ctx.fillStyle = donut.color;
+            ctx.fill();
+        }
+
+        ctx.resetTransform();
+    }
+
+    #updateDonut(donut: Donut, dt: number): void {
+        const currentSpeed = Math.sqrt(donut.vx * donut.vx + donut.vy * donut.vy);
+
+        if (currentSpeed > donut.speed) {
+            const damping = Math.pow(0.995, dt);
+            donut.vx *= damping;
+            donut.vy *= damping;
+        }
+
+        donut.x += donut.vx * dt;
+        donut.y += donut.vy * dt;
+        donut.angle += donut.rotationSpeed * dt;
+
+        const limit = donut.outerRadius * 0.5;
+        const width = this.#width;
+        const height = this.#height;
+
+        if (donut.x < -limit) {
+            donut.x = -limit;
+            donut.vx = Math.abs(donut.vx);
+        }
+
+        if (donut.x > width + limit) {
+            donut.x = width + limit;
+            donut.vx = -Math.abs(donut.vx);
+        }
+
+        if (donut.y < -limit) {
+            donut.y = -limit;
+            donut.vy = Math.abs(donut.vy);
+        }
+
+        if (donut.y > height + limit) {
+            donut.y = height + limit;
+            donut.vy = -Math.abs(donut.vy);
+        }
+    }
+
+    #onMouseMove(event: MouseEvent): void {
+        const target = event.currentTarget as HTMLCanvasElement;
+        const rect = target.getBoundingClientRect();
+        this.#mouseX = event.clientX - rect.left;
+        this.#mouseY = event.clientY - rect.top;
+        this.#mouseOnCanvas = true;
+    }
+
+    #onMouseLeave(): void {
+        this.#mouseOnCanvas = false;
+    }
+
+    #resolveMouseAvoidance(dt: number): void {
+        const radius = this.#mouseAvoidanceRadius;
+        const strength = this.#mouseAvoidanceStrength;
+        const mx = this.#mouseX;
+        const my = this.#mouseY;
+
+        for (const donut of this.#donuts) {
+            const dx = donut.x - mx;
+            const dy = donut.y - my;
+            const dist = Math.sqrt(dx * dx + dy * dy);
+            const minDist = donut.outerRadius + radius;
+
+            if (dist < minDist && dist > 0) {
+                const overlap = minDist - dist;
+                const nx = dx / dist;
+                const ny = dy / dist;
+                const force = overlap * strength * dt;
+
+                donut.vx += nx * force;
+                donut.vy += ny * force;
+            }
+        }
+    }
+
+    #resolveCollisions(dt: number): void {
+        const padding = this.#collisionPadding;
+        const strength = this.#repulsionStrength;
+
+        for (let i = 0; i < this.#donuts.length; i++) {
+            for (let j = i + 1; j < this.#donuts.length; j++) {
+                const a = this.#donuts[i];
+                const b = this.#donuts[j];
+                const dx = b.x - a.x;
+                const dy = b.y - a.y;
+                const dist = Math.sqrt(dx * dx + dy * dy);
+                const minDist = a.outerRadius + b.outerRadius + padding;
+
+                if (dist < minDist && dist > 0) {
+                    const overlap = minDist - dist;
+                    const nx = dx / dist;
+                    const ny = dy / dist;
+                    const force = overlap * strength * dt;
+
+                    a.vx -= nx * force;
+                    a.vy -= ny * force;
+                    b.vx += nx * force;
+                    b.vy += ny * force;
+                }
+            }
+        }
+    }
+
+    #createDonut(): Donut {
+        const outerRadius = this.#rand(this.#radiusRange[0], this.#radiusRange[1]);
+        const innerRadius = outerRadius * (1 - this.#thickness);
+        const speed = this.#rand(this.#speedRange[0], this.#speedRange[1]);
+        const direction = MULBERRY.next() * Math.PI * 2;
+
+        return {
+            outerRadius,
+            innerRadius,
+            x: this.#rand(-outerRadius, this.#width + outerRadius),
+            y: this.#rand(-outerRadius, this.#height + outerRadius),
+            angle: MULBERRY.next() * Math.PI * 2,
+            speed,
+            rotationSpeed: this.#rand(this.#rotationSpeedRange[0], this.#rotationSpeedRange[1]) * (MULBERRY.next() > 0.5 ? 1 : -1),
+            color: this.#colors[Math.floor(MULBERRY.next() * this.#colors.length)],
+            vx: Math.cos(direction) * speed,
+            vy: Math.sin(direction) * speed
+        };
+    }
+
+    #createNonOverlapping(maxAttempts: number = 200): Donut {
+        for (let attempt = 0; attempt < maxAttempts; attempt++) {
+            const donut = this.#createDonut();
+
+            if (!this.#overlapsAny(donut)) {
+                return donut;
+            }
+        }
+
+        return this.#createDonut();
+    }
+
+    #overlapsAny(donut: Donut): boolean {
+        const minDist = this.#collisionPadding;
+
+        return this.#donuts.some((other) => {
+            const dx = donut.x - other.x;
+            const dy = donut.y - other.y;
+            const dist = Math.sqrt(dx * dx + dy * dy);
+
+            return dist < donut.outerRadius + other.outerRadius + minDist;
+        });
+    }
+
+    #rand(min: number, max: number): number {
+        return MULBERRY.next() * (max - min) + min;
+    }
+}

package/src/effect.ts

@@ -0,0 +1,107 @@
+import { SimulationCanvas } from './simulation-canvas';
+import type { EdgeFade, EdgeFadeSide, SimulationLayer } from './layer';
+
+export type { EdgeFade, EdgeFadeSide };
+
+/**
+ * Base class for all visual effects. Implements the internal SimulationLayer interface
+ * so that effects can be used both standalone (via mount()) and composed in a Scene.
+ *
+ * @example Standalone usage
+ * const snow = new Snow({ particles: 200 });
+ * snow.mount(canvas).start();
+ *
+ * @example Scene composition
+ * const scene = new Scene()
+ *     .mount(canvas)
+ *     .layer(new Aurora())
+ *     .layer(new Snow())
+ *     .start();
+ */
+export abstract class Effect<TConfig = Record<string, unknown>> implements SimulationLayer {
+    #canvas: SimulationCanvas | null = null;
+    fade: EdgeFade | null = null;
+
+    abstract tick(dt: number, width: number, height: number): void;
+
+    abstract draw(ctx: CanvasRenderingContext2D, width: number, height: number): void;
+
+    configure(_config: Partial<TConfig>): void {
+    }
+
+    onResize(_width: number, _height: number): void {
+    }
+
+    onMount(_canvas: HTMLCanvasElement): void {
+    }
+
+    onUnmount(_canvas: HTMLCanvasElement): void {
+    }
+
+    /**
+     * Apply an edge fade mask when rendering this effect standalone or in a Scene.
+     */
+    withFade(fade: EdgeFade): this {
+        this.fade = fade;
+        return this;
+    }
+
+    /**
+     * Mount this effect to a canvas element or CSS selector, creating the render loop.
+     * Must be called before start().
+     */
+    mount(canvas: HTMLCanvasElement | string, options: CanvasRenderingContext2DSettings = {colorSpace: 'display-p3'}): this {
+        if (typeof canvas === 'string') {
+            const el = document.querySelector<HTMLCanvasElement>(canvas);
+
+            if (!el) {
+                throw new Error(`Effect.mount(): no element found for selector "${canvas}".`);
+            }
+
+            canvas = el;
+        }
+
+        this.#canvas = new SimulationCanvas(canvas, this as unknown as SimulationLayer, 60, options);
+        return this;
+    }
+
+    /**
+     * Remove this effect from its canvas and clean up the render loop.
+     */
+    unmount(): this {
+        this.#canvas?.destroy();
+        this.#canvas = null;
+        return this;
+    }
+
+    /**
+     * Start the render loop. Call mount() first.
+     */
+    start(): this {
+        this.#canvas?.start();
+        return this;
+    }
+
+    /**
+     * Pause rendering without destroying state. Use resume() to continue.
+     */
+    pause(): this {
+        this.#canvas?.pause();
+        return this;
+    }
+
+    /**
+     * Resume rendering after a pause().
+     */
+    resume(): this {
+        this.#canvas?.resume();
+        return this;
+    }
+
+    /**
+     * Stop rendering and call onUnmount(). Safe to call multiple times.
+     */
+    destroy(): void {
+        this.unmount();
+    }
+}

package/src/fade.ts

@@ -0,0 +1,87 @@
+import type { EdgeFade, EdgeFadeSide } from './layer';
+
+function parseSide(side: EdgeFadeSide): [number, number] {
+    return typeof side === 'number' ? [0, side] : side;
+}
+
+export function applyEdgeFade(ctx: CanvasRenderingContext2D, width: number, height: number, fade: EdgeFade): void {
+    ctx.globalCompositeOperation = 'destination-out';
+
+    if (fade.top !== undefined) {
+        const [near, far] = parseSide(fade.top);
+        const nearPx = near * height;
+        const farPx = far * height;
+
+        if (nearPx > 0) {
+            ctx.fillStyle = 'rgba(0,0,0,1)';
+            ctx.fillRect(0, 0, width, nearPx);
+        }
+
+        if (farPx > nearPx) {
+            const gradient = ctx.createLinearGradient(0, nearPx, 0, farPx);
+            gradient.addColorStop(0, 'rgba(0,0,0,1)');
+            gradient.addColorStop(1, 'rgba(0,0,0,0)');
+            ctx.fillStyle = gradient;
+            ctx.fillRect(0, nearPx, width, farPx - nearPx);
+        }
+    }
+
+    if (fade.bottom !== undefined) {
+        const [near, far] = parseSide(fade.bottom);
+        const nearPx = near * height;
+        const farPx = far * height;
+
+        if (nearPx > 0) {
+            ctx.fillStyle = 'rgba(0,0,0,1)';
+            ctx.fillRect(0, height - nearPx, width, nearPx);
+        }
+
+        if (farPx > nearPx) {
+            const gradient = ctx.createLinearGradient(0, height - farPx, 0, height - nearPx);
+            gradient.addColorStop(0, 'rgba(0,0,0,0)');
+            gradient.addColorStop(1, 'rgba(0,0,0,1)');
+            ctx.fillStyle = gradient;
+            ctx.fillRect(0, height - farPx, width, farPx - nearPx);
+        }
+    }
+
+    if (fade.left !== undefined) {
+        const [near, far] = parseSide(fade.left);
+        const nearPx = near * width;
+        const farPx = far * width;
+
+        if (nearPx > 0) {
+            ctx.fillStyle = 'rgba(0,0,0,1)';
+            ctx.fillRect(0, 0, nearPx, height);
+        }
+
+        if (farPx > nearPx) {
+            const gradient = ctx.createLinearGradient(nearPx, 0, farPx, 0);
+            gradient.addColorStop(0, 'rgba(0,0,0,1)');
+            gradient.addColorStop(1, 'rgba(0,0,0,0)');
+            ctx.fillStyle = gradient;
+            ctx.fillRect(nearPx, 0, farPx - nearPx, height);
+        }
+    }
+
+    if (fade.right !== undefined) {
+        const [near, far] = parseSide(fade.right);
+        const nearPx = near * width;
+        const farPx = far * width;
+
+        if (nearPx > 0) {
+            ctx.fillStyle = 'rgba(0,0,0,1)';
+            ctx.fillRect(width - nearPx, 0, nearPx, height);
+        }
+
+        if (farPx > nearPx) {
+            const gradient = ctx.createLinearGradient(width - farPx, 0, width - nearPx, 0);
+            gradient.addColorStop(0, 'rgba(0,0,0,0)');
+            gradient.addColorStop(1, 'rgba(0,0,0,1)');
+            ctx.fillStyle = gradient;
+            ctx.fillRect(width - farPx, 0, farPx - nearPx, height);
+        }
+    }
+
+    ctx.globalCompositeOperation = 'source-over';
+}

package/src/fireflies/consts.ts

@@ -0,0 +1,3 @@
+import { type Mulberry32, mulberry32 } from '@basmilius/utils';
+
+export const MULBERRY: Mulberry32 = mulberry32(13);

package/src/fireflies/index.ts

@@ -0,0 +1,12 @@
+import { Fireflies } from './layer';
+import type { FirefliesConfig } from './layer';
+import type { Effect } from '../effect';
+
+export function createFireflies(config?: FirefliesConfig): Effect<FirefliesConfig> {
+    return new Fireflies(config);
+}
+
+export { FireflyParticle, createFireflySprite } from './particle';
+export type { FirefliesConfig };
+export type { FireflyParticleConfig } from './particle';
+export type { Firefly } from './types';