import * as _angular_core from '@angular/core'; /** * Cursor-tracked spotlight card. A soft radial highlight follows the * pointer inside the card; fades in on hover, out on leave. * * Project any content as children — the spotlight overlay sits behind * the projected DOM (via a `::before` pseudo with `pointer-events: none`) * so clicks pass through naturally. * * @example * ```html * *

Hover me

*
* ``` * * @see https://www.reactbits.dev/components/spotlight-card */ declare class WrSpotlightCard { /** * Highlight colour (any CSS colour). When unset, the theme decides: * a dark-ish glow on light surfaces, a light glow on dark. */ readonly spotlightColor: _angular_core.InputSignal; /** Where the spotlight fades out, as a percentage of the gradient. @default 80 */ readonly radius: _angular_core.InputSignalWithTransform; private readonly el; protected onMouseMove(event: MouseEvent): void; static ɵfac: _angular_core.ɵɵFactoryDeclaration; static ɵcmp: _angular_core.ɵɵComponentDeclaration; } /** * Cursor-follow radial spotlight. Sets the `--wr-spotlight-x` and * `--wr-spotlight-y` CSS custom properties on the host based on the * pointer position so a `radial-gradient` (or `mask`) in your CSS can * follow the cursor. * * @example * ```html *
* ``` * * ```scss * .card { * background: radial-gradient( * 400px circle at var(--wr-spotlight-x, 50%) var(--wr-spotlight-y, 50%), * rgba(var(--wr-color-primary-rgb), 0.15), * transparent 60% * ); * } * ``` */ declare class WrSpotlight { /** Optional default coordinates when no pointer is over the host. */ readonly resetX: _angular_core.InputSignal; readonly resetY: _angular_core.InputSignal; private readonly el; private readonly zone; private readonly destroyRef; constructor(); /** @internal */ protected onMove(event: PointerEvent): void; /** @internal */ protected onLeave(): void; static ɵfac: _angular_core.ɵɵFactoryDeclaration; static ɵdir: _angular_core.ɵɵDirectiveDeclaration; } export { WrSpotlight, WrSpotlightCard };