/**
 * @fileoverview Page transition wrapper with Motion AnimatePresence.
 * @author Saasflare™
 * Wraps page content with enter/exit animations for route transitions.
 * Uses the pathname as the animation key in Next.js App Router.
 * @module packages/ui/components/ui/page-transition
 * @package ui
 *
 * @component
 * @example
 * import { PageTransition } from '@saasflare/ui';
 * // In your layout.tsx — the current pathname is used as the animation key.
 * export default function Layout({ children }: { children: React.ReactNode }) {
 *   return <PageTransition>{children}</PageTransition>;
 * }
 *
 * @example
 * // Custom animation variant
 * <PageTransition variant="slideUp" duration={0.4}>
 *   {children}
 * </PageTransition>
 */
import * as React from "react";
import { type ReactNode } from "react";
import { type SaasflareComponentProps } from "../../providers";
/** Motion props that conflict with native DOM event handlers on the root element. */
type MotionConflicts = "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd";
/** Animation variant presets for page transitions. */
declare const VARIANTS: {
    readonly fade: {
        readonly initial: {
            readonly opacity: 0;
        };
        readonly animate: {
            readonly opacity: 1;
        };
        readonly exit: {
            readonly opacity: 0;
        };
    };
    readonly slideUp: {
        readonly initial: {
            readonly opacity: 0;
            readonly y: 16;
        };
        readonly animate: {
            readonly opacity: 1;
            readonly y: 0;
        };
        readonly exit: {
            readonly opacity: 0;
            readonly y: -16;
        };
    };
    readonly slideDown: {
        readonly initial: {
            readonly opacity: 0;
            readonly y: -16;
        };
        readonly animate: {
            readonly opacity: 1;
            readonly y: 0;
        };
        readonly exit: {
            readonly opacity: 0;
            readonly y: 16;
        };
    };
    readonly scale: {
        readonly initial: {
            readonly opacity: 0;
            readonly scale: 0.96;
        };
        readonly animate: {
            readonly opacity: 1;
            readonly scale: 1;
        };
        readonly exit: {
            readonly opacity: 0;
            readonly scale: 0.96;
        };
    };
};
/** Props for the PageTransition component. */
export interface PageTransitionProps extends Omit<React.ComponentProps<"div">, MotionConflicts | "children" | keyof SaasflareComponentProps>, SaasflareComponentProps {
    /** Child content to animate. */
    children: ReactNode;
    /** Animation preset. Default: `"fade"` */
    variant?: keyof typeof VARIANTS;
    /** Transition duration in seconds. Default: `0.3` */
    duration?: number;
    /**
     * Unique key for AnimatePresence to trigger re-animation on route changes.
     * Default: the current pathname (Next.js App Router).
     */
    transitionKey?: string;
}
/**
 * Page transition wrapper with configurable enter/exit animations.
 *
 * - Provides `fade`, `slideUp`, `slideDown`, and `scale` presets
 * - Renders children directly (no animation) when `animated` is `false` or
 *   reduced motion is preferred
 * - Defaults the AnimatePresence key to the current pathname, so route changes
 *   trigger the exit/enter sequence with zero configuration; override via
 *   `transitionKey` when needed
 *
 * @component
 * @package ui
 */
export declare function PageTransition({ children, variant, duration, transitionKey, className, surface, radius, animated, iconWeight, ...props }: PageTransitionProps): import("react/jsx-runtime").JSX.Element;
export {};