aura-glass
Version:
A comprehensive glassmorphism design system for React applications with 142+ production-ready components
45 lines • 1.6 kB
TypeScript
import React, { CSSProperties } from 'react';
import { GlassButtonProps } from './GlassButton';
export interface MagneticButtonProps extends GlassButtonProps {
/**
* Strength of the magnetic effect. Higher values mean stronger pull.
* @default 0.5
*/
magneticStrength?: number;
/**
* Radius in pixels within which the magnetic effect is active.
* @default 150
*/
magneticRadius?: number;
/**
* Damping factor for the return-to-center movement (0 to 1). Lower values are slower/smoother.
* @default 0.8
*/
magneticDampingFactor?: number;
/**
* Custom styles to apply to the button, merged with magnetic transform.
*/
style?: CSSProperties;
/**
* If true, the component will render its child element and pass relevant props
* (styles, event handlers) down to it, instead of rendering its own button element.
* @default false
*/
asChild?: boolean;
/**
* Whether to announce magnetic interactions to screen readers (for users who navigate with voice control)
* @default false
*/
announceInteractions?: boolean;
/**
* Whether to reduce magnetic effect when user prefers reduced motion
* @default true
*/
respectReducedMotion?: boolean;
}
/**
* A GlassButton with a magnetic effect that attracts the button towards the cursor on hover.
*/
export declare const MagneticButton: React.ForwardRefExoticComponent<MagneticButtonProps & React.RefAttributes<HTMLElement>>;
export default MagneticButton;
//# sourceMappingURL=GlassMagneticButton.d.ts.map