motion-v
Version:
<h1 align="center"> <img width="35" height="35" alt="Motion logo" src="https://github.com/user-attachments/assets/00d6d1c3-72c4-4c2f-a664-69da13182ffc" /><br />Motion for Vue</h1>
27 lines (26 loc) • 942 B
TypeScript
import { VariantType } from '../../../types';
import { VariantLabels } from 'motion-dom';
type MarginValue = `${number}${'px' | '%'}`;
type MarginType = MarginValue | `${MarginValue} ${MarginValue}` | `${MarginValue} ${MarginValue} ${MarginValue}` | `${MarginValue} ${MarginValue} ${MarginValue} ${MarginValue}`;
export interface InViewOptions {
root?: Element | Document;
margin?: MarginType;
amount?: 'some' | 'all' | number;
}
type ViewportEventHandler = (entry: IntersectionObserverEntry | null) => void;
export interface InViewProps {
inViewOptions?: InViewOptions & {
once?: boolean;
};
/**
* @deprecated Use `whileInView` instead.
*/
inView?: VariantLabels | VariantType;
/**
* Variant to apply when the element is in view.
*/
whileInView?: VariantLabels | VariantType;
onViewportEnter?: ViewportEventHandler;
onViewportLeave?: ViewportEventHandler;
}
export {};