@react-motion-router/core/build/ScreenBase.d.ts

Declarative routing library for ReactJS ⚛ with animations baked in ⏮

import { Component, ElementType } from "react";
import { AnimationConfig, AnimationConfigFactory, AnimationConfigSet, AnimationKeyframeEffectConfig, LazyExoticComponent, PlainObject, ReducedAnimationConfigSet, RouteProp, SwipeDirection } from "./common/types";
import { RouterDataContext } from "./RouterData";
import { SharedElementScene } from "./SharedElement";
import { NavigationBase } from ".";
export interface ScreenBaseProps {
    out?: boolean;
    in?: boolean;
    component: React.JSXElementConstructor<any> | LazyExoticComponent<any>;
    fallback?: React.ReactNode;
    path?: string;
    resolvedPathname?: string;
    defaultParams?: PlainObject;
    name?: string;
    config?: {
        header?: {
            fallback?: React.ReactNode;
            component: React.JSXElementConstructor<any> | LazyExoticComponent<any>;
        };
        footer?: {
            fallback?: React.ReactNode;
            component: React.JSXElementConstructor<any> | LazyExoticComponent<any>;
        };
        animation?: ReducedAnimationConfigSet | AnimationConfig | AnimationKeyframeEffectConfig | AnimationConfigFactory;
        pseudoElement?: {
            selector: string;
            animation?: ReducedAnimationConfigSet | AnimationConfig | AnimationKeyframeEffectConfig | AnimationConfigFactory;
        };
        keepAlive?: boolean;
        swipeDirection?: SwipeDirection;
        swipeAreaWidth?: number;
        minFlingVelocity?: number;
        hysteresis?: number;
        disableDiscovery?: boolean;
    };
}
export interface ScreenBaseState {
    shouldKeepAlive: boolean;
}
export default abstract class ScreenBase<P extends ScreenBaseProps = ScreenBaseProps, S extends ScreenBaseState = ScreenBaseState> extends Component<P, S> {
    protected name: string;
    protected sharedElementScene: SharedElementScene;
    protected ref: HTMLElement | null;
    private onRef;
    private animation;
    private pseudoElementAnimation;
    protected elementType: ElementType | string;
    protected animationProviderRef: HTMLElement | null;
    protected _routeData: RouteProp<P, PlainObject>;
    static contextType: import("react").Context<import("./RouterData").default<NavigationBase> | null>;
    context: React.ContextType<typeof RouterDataContext>;
    state: S;
    componentDidMount(): void;
    shouldComponentUpdate(nextProps: P): boolean;
    protected setParams(params: PlainObject): void;
    protected setConfig(config: P['config']): void;
    protected get routeData(): RouteProp<P, PlainObject<any>>;
    setupAnimation(animation?: ReducedAnimationConfigSet | AnimationConfig | AnimationKeyframeEffectConfig | AnimationConfigFactory): (() => AnimationConfigSet) | {
        in: (AnimationConfig | AnimationKeyframeEffectConfig | undefined) & (AnimationConfig | AnimationKeyframeEffectConfig);
        out: (AnimationConfig | AnimationKeyframeEffectConfig | undefined) & (AnimationConfig | AnimationKeyframeEffectConfig);
    } | null;
    animationFactory(animation?: AnimationKeyframeEffectConfig | AnimationConfig | ReducedAnimationConfigSet | AnimationConfigFactory): AnimationConfigSet;
    onExited(): void;
    onExit(): void;
    onEnter(): void;
    onEntered(): void;
    private setRef;
    get resolvedPathname(): P["resolvedPathname"] | undefined;
    render(): JSX.Element;
}