@studiometa/js-toolkit/decorators/withScrolledInView/withScrolledInView.d.ts

A set of useful little bits of JavaScript to boost your project! 🚀

import type { BaseInterface, BaseDecorator } from '../../Base/types.js';
import type { Base, BaseProps } from '../../Base/index.js';
import type { RafServiceProps, ScrollServiceProps, ResizeServiceProps } from '../../services/index.js';
export interface WithScrolledInViewProps extends BaseProps {
    $options: {
        dampFactor: number;
        dampPrecision: number;
        offset: string;
    };
}
export type ScrollInViewProps = {
    start: {
        x: number;
        y: number;
    };
    end: {
        x: number;
        y: number;
    };
    current: {
        x: number;
        y: number;
    };
    dampedCurrent: {
        x: number;
        y: number;
    };
    progress: {
        x: number;
        y: number;
    };
    dampedProgress: {
        x: number;
        y: number;
    };
};
export type WithScrolledInViewOptions = IntersectionObserverInit & {
    useOffsetSizes?: boolean;
};
export interface WithScrolledInViewInterface extends BaseInterface {
    /**
     * @type {ScrollInViewProps}
     */
    readonly props: ScrollInViewProps;
    dampFactor?: number;
    dampPrecision?: number;
    mounted(): void;
    resized(props: ResizeServiceProps): void;
    scrolled(props: ScrollServiceProps): void;
    ticked(props: RafServiceProps): void;
    destroyed(): void;
}
/**
 * Add scrolled in view capabilities to a component.
 */
export declare function withScrolledInView<S extends Base = Base>(BaseClass: typeof Base, options?: WithScrolledInViewOptions): BaseDecorator<WithScrolledInViewInterface, S, WithScrolledInViewProps>;