@fxshelf/starfield/dist/index.d.cts

Canvas 2D starfield tunnel for React and Vue — perspective fly-through, glitter flashes, additive trails. Zero animation-lib deps. Copy-as-source friendly.

import * as react from 'react';
import { ReactNode, CSSProperties } from 'react';

type StarfieldOptions = {
    /** Number of stars. Default `263`. */
    particleCount?: number;
    /** Palette slot 1. Default `#ffffff`. */
    color1?: string;
    /** Palette slot 2. Default `#ffffff`. */
    color2?: string;
    /** Palette slot 3. Default `#ffffff`. */
    color3?: string;
    /** Fly-toward speed multiplier. Default `1`. */
    speed?: number;
    /** Radial spread (higher = wider field). Default `48`. */
    density?: number;
    /** Base star size. Default `8`. */
    starSize?: number;
    /** Perspective near clip (0–100 scale). Default `13`. */
    focalDepth?: number;
    /** Lateral wobble. Default `0`. */
    turbulence?: number;
    /** Overall brightness (0–100). Default `73`. */
    brightness?: number;
    /** Twinkle intensity (0–10). Default `4`. */
    glitterIntensity?: number;
    /** Trail persistence (0–100). Default `26`. */
    trailAmount?: number;
    /** Fly away from camera instead of toward. Default `false`. */
    reverse?: boolean;
};
type StarfieldInstance = {
    setOptions(partial: StarfieldOptions): void;
    resize(): void;
    destroy(): void;
};
declare const DEFAULTS: {
    readonly particleCount: 263;
    readonly color1: "#ffffff";
    readonly color2: "#ffffff";
    readonly color3: "#ffffff";
    readonly speed: 1;
    readonly density: 48;
    readonly starSize: 8;
    readonly focalDepth: 13;
    readonly turbulence: 0;
    readonly brightness: 73;
    readonly glitterIntensity: 4;
    readonly trailAmount: 26;
    readonly reverse: false;
};

/**
 * Canvas 2D starfield tunnel: stars fly toward (or away from) the camera
 * with perspective projection, optional glitter flashes, and additive trails.
 */
declare function createStarfield(canvas: HTMLCanvasElement, options?: StarfieldOptions): StarfieldInstance;

type StarfieldProps = StarfieldOptions & {
    children?: ReactNode;
    className?: string;
    style?: CSSProperties;
    /** Accessible label for the canvas. */
    ariaLabel?: string;
};
declare function Starfield({ children, className, style, ariaLabel, ...options }: StarfieldProps): react.JSX.Element;

export { DEFAULTS, Starfield, type StarfieldInstance, type StarfieldOptions, type StarfieldProps, createStarfield };