react-dvd-screensaver/dist/index.d.ts

DVD-era nostalgia in React

import React$1 from 'react';

/**
 * Props for the DvdScreensaver component.
 * @typedef Props
 */
type Props = {
    /** @property {React.ReactElement} children - The child element to which the screensaver effect will be applied. */
    children: React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>>;
    /** @property {string} [className] - Optional CSS class name for the container div. */
    className?: string;
    /** @property {boolean} [freezeOnHover] - If true, the animation will pause when the mouse hovers over the element. */
    freezeOnHover?: boolean;
    /** @property {string} [height] - Optional height for the container, defaults to 100% if not specified. */
    height?: string;
    /** @property {() => void} [hoverCallback] - Optional callback function that is called when the element is hovered. */
    hoverCallback?: () => void;
    /** @property {(count: number) => void} [impactCallback] - Optional callback function that is called when the animated element hits a boundary. Receives the total number of impacts as an argument. */
    impactCallback?: (count: number) => void;
    /** @property {number} [speed] - Optional speed of the animation. Higher values increase the speed. */
    speed?: number;
    /** @property {React.CSSProperties} [style] - Optional inline styles for the container. */
    style?: React$1.CSSProperties;
    /** @property {string} [width] - Optional width for the container, defaults to 100% if not specified. */
    width?: string;
};
declare function DvdScreensaver(props: Props): React$1.JSX.Element;

/**
 * Configuration options for the DVD screensaver behavior.
 */
type Options = {
    /** Whether the animation should pause when the element is hovered. */
    freezeOnHover?: boolean;
    /** Callback function to execute when the element is hovered. */
    hoverCallback?: () => void;
    /** Speed of the animation. */
    speed?: number;
};
/**
 * The return type of the useDvdScreensaver hook, providing refs and state for external use.
 */
type UseDvdScreensaver<T> = {
    /** Ref for the container element. */
    containerRef: React.Ref<T>;
    /** Ref for the animated element. */
    elementRef: React.Ref<T>;
    /** State indicating if the element is currently hovered. */
    hovered: boolean;
    /** The total number of boundary impacts made by the animated element. */
    impactCount: number;
};
/**
 * Hook to handle DVD screensaver animation
 * @param options Configuration options for the screensaver animation.
 * @returns An object containing refs to the container and element, as well as state.
 */
declare function useDvdScreensaver<T extends HTMLDivElement>(options?: Partial<Options>): UseDvdScreensaver<T>;

export { DvdScreensaver, type Options, type Props, type UseDvdScreensaver, useDvdScreensaver };