/**
* @fileoverview Mouse-following gradient blob ambient effect.
* @author Saasflare™
* Renders a large blurred radial gradient that tracks the mouse position
* with smooth spring physics. Ideal for hero sections and landing pages.
* @module packages/ui/components/ui/mouse-gradient-blob
* @package ui
*
* @component
* @example
* import { MouseGradientBlob } from '@saasflare/ui';
*
*
*
Your content here
*
*
* @example
* // Custom colors and size
*
*
* @example
* // Freeze the effect via the provider kill-switch or per-instance
*
*/
import * as React from "react";
import { type SaasflareComponentProps } from "../../providers";
/** Props for the MouseGradientBlob component. */
export interface MouseGradientBlobProps extends Omit, keyof SaasflareComponentProps>, SaasflareComponentProps {
/** Diameter of the blob in pixels. Default: `500` */
size?: number;
/** Gradient color stops. Default: primary + chart-2 tokens */
colors?: [string, string];
/** Opacity of the blob (0–1). Default: `0.15` */
opacity?: number;
/** Blur radius in pixels. Default: `80` */
blur?: number;
/** Additional class names for the container */
className?: string;
}
/**
* Ambient gradient blob that follows the mouse.
*
* - Uses spring physics for smooth, organic motion
* - Fades out when the mouse leaves the container
* - Renders nothing when motion is disabled (reduced-motion preference or
* `animated={false}` from prop/provider)
* - Uses `pointer-events: none` so it never blocks interaction
*
* @component
* @package ui
*/
export declare function MouseGradientBlob({ size, colors, opacity, blur, className, surface, radius, animated, iconWeight, ...rest }: MouseGradientBlobProps): import("react/jsx-runtime").JSX.Element | null;