/**
* @fileoverview Card with a mouse-following spotlight gradient highlight.
* @author Saasflare™
* Renders a card with a radial gradient that tracks the cursor position,
* creating a spotlight effect. Built on top of the Saasflare Card primitive.
* @module packages/ui/components/ui/spotlight-card
* @package ui
*
* @component
* @example
* import { SpotlightCard } from '@saasflare/ui';
*
* Feature Title
* Feature description text
*
*
* @example
* // Custom spotlight color
*
* Highlighted content
*
*/
import { type ReactNode } from "react";
import { type SaasflareComponentProps } from "../../providers";
/** Motion-reserved DOM handlers that collide with Motion's own props. */
type MotionConflicts = "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd";
/** Props for the SpotlightCard component. */
export interface SpotlightCardProps extends Omit, MotionConflicts | keyof SaasflareComponentProps>, SaasflareComponentProps {
/** Card content. */
children: ReactNode;
/** Spotlight gradient color. Default: `"var(--primary)"` */
spotlightColor?: string;
/** Spotlight diameter in pixels. Default: `250` */
spotlightSize?: number;
/** Spotlight opacity (0–1). Default: `0.08` */
spotlightOpacity?: number;
/** Additional class names. */
className?: string;
}
/**
* Card with a radial gradient that follows the mouse cursor.
*
* - Gradient overlay tracks the mouse within the card boundaries
* - Fades out when the mouse leaves
* - Uses CSS for the gradient (no canvas, no heavy re-renders)
* - Falls back to a plain card when motion is disabled (`animated={false}` or reduced motion)
*
* @component
* @package ui
*/
export declare function SpotlightCard({ children, spotlightColor, spotlightSize, spotlightOpacity, className, surface, radius, animated, iconWeight, ...props }: SpotlightCardProps): import("react/jsx-runtime").JSX.Element;
export {};