import { CommonTickerProps, CanvasBaseInterface } from '@drincs/pixi-vn/canvas'; import { AnimationOptions as AnimationOptions$1, ObjectTarget, At, SequenceOptions as SequenceOptions$1, AnimationPlaybackControlsWithThen, ObjectSegment as ObjectSegment$1 } from 'motion'; export { At } from 'motion'; import { UPDATE_PRIORITY, Ticker } from '@drincs/pixi-vn/pixi.js'; interface MotionComponentExtension { pivot?: number; pivotX?: number; pivotY?: number; scale?: number; scaleX?: number; scaleY?: number; } type AnimationOptionsCommon = Omit; type AnimationOptions = AnimationOptionsCommon & Omit; type KeyframesType = ObjectTarget & MotionComponentExtension; type AnimationSequenceOptions = Omit; type SequenceOptions = SequenceOptions$1 & Omit; type ObjectSegment> = [ ObjectTarget & MotionComponentExtension ]; type ObjectSegmentWithTransition$1> = [ ObjectTarget & MotionComponentExtension, AnimationOptions & At ]; declare namespace motion { /** * Animate a canvas element. * @param components The canvas element(s) or their alias(es) to animate. * @param keyframes The keyframes to animate to. * @param options The animation options. * @param priority The update priority of the ticker. * @returns The id of the ticker, or `undefined` if the ticker was not added. * @throws {PixiError} when `keyframes` or `options` contain functions or class instances that cannot be serialized to JSON. */ function animate>(components: T | string | (string | T)[], keyframes: KeyframesType, options?: AnimationOptions, priority?: UPDATE_PRIORITY): string | undefined; /** * Animate a canvas element using a sequence. * @param components The canvas element(s) or their alias(es) to animate. * @param sequence The sequence of animation segments. * @param options The sequence options. * @param priority The update priority of the ticker. * @returns The id of the ticker, or `undefined` if the ticker was not added. * @throws {PixiError} when `sequence` or `options` contain functions or class instances that cannot be serialized to JSON. */ function animate>(components: T | string, sequence: (ObjectSegment | ObjectSegmentWithTransition$1)[], options?: SequenceOptions, priority?: UPDATE_PRIORITY): string | undefined; } type SegmentOptions = AnimationOptions$1 & At; type ObjectSegmentWithTransition = [O, ObjectTarget, SegmentOptions]; /** * Create a motion driver that integrates with the PixiJS ticker. This driver will allow you to use motion's animation capabilities while ensuring that animations are synchronized with the PixiJS rendering loop. * @param ticker - The PixiJS ticker to integrate with. If not provided, a new ticker will be created. * @returns An object that implements the motion driver interface, allowing you to start, stop, and control animations using the PixiJS ticker. * @example * const ticker = new PIXI.Ticker(); * const driver = motionDriver(ticker); * const animation = animate(mySprite, { x: 100 }, { duration: 1, driver }); * animation.start(); */ declare const motionDriver: (ticker: Ticker) => AnimationOptions$1["driver"]; /** * Animate a PixiJS component or components using [motion's animate](https://motion.dev/docs/animate) function. * This function integrates with the PixiJS ticker to ensure smooth animations. * * Pixi’VN will **not** keep track of the animation state of this function (This feature is intended for animating PixiJS components used for UI.). * @param components - The PixiJS component(s) to animate. * @param keyframes - The keyframes to animate the component(s) with. * @param options - Additional options for the animation, including duration, easing, and ticker. * @returns An animation playback control object that can be used to start, stop, or control the animation. * @template T - The type of PixiJS component(s) being animated. */ declare function animate(components: T | T[], keyframes: ObjectTarget, options?: AnimationOptions$1 & { ticker?: Ticker; }): AnimationPlaybackControlsWithThen; /** * Animate a sequence of PixiJS components with transitions using [motion's animate](https://motion.dev/docs/animate) function. * This function allows for complex animations involving multiple components and transitions. * It integrates with the PixiJS ticker to ensure smooth animations. * This function is intended for animating PixiJS components used for UI. * * Pixi’VN will **not** keep track of the animation state of this function (This feature is intended for animating PixiJS components used for UI.). * * @param sequence An array of segments to animate, where each segment is an array containing: * - The PixiJS component to animate. * - The keyframes to animate the component with. * - An options object that can include animation options and a ticker. * @param options Additional options for the sequence, such as duration and repeat count. * @returns An animation playback control object that can be used to start, stop, or control the animation. * @template T - The type of PixiJS component(s) being animated. */ declare function animate(sequence: (ObjectSegment$1 | ObjectSegmentWithTransition)[], options?: SequenceOptions$1 & { ticker?: Ticker; driver?: any; }): AnimationPlaybackControlsWithThen; /** * Create a timeline for running a sequence of functions with transitions. Each function will be called with the provided arguments and will run for the specified duration. * * `onPlay`/`onComplete` are driven by a PixiJS-ticker-based scheduler rather than motion's own * per-segment callbacks: motion's array/sequence syntax doesn't reliably call `onPlay`/`onComplete` * once per segment when the timeline repeats (https://github.com/motiondivision/motion/issues/3563), * since the previous workaround (a throwaway `MotionValue` per segment, "change"-debounced into the * callback) got reset and replayed by motion's own `repeat` handling, firing extra times per loop. * This scheduler only supports segments placed sequentially (via `duration`/`delay`); the `at` label * positioning of motion's `At` type is passed through to the underlying visual tween but is not * accounted for when timing these callbacks. * @example * timeline([ * { duration: 10, onComplete: () => console.log("First step completed") }, * { duration: 5, onComplete: () => console.log("Second step completed") }, * ]); * @param times * @param options * @returns */ declare function timeline(times: SegmentOptions[], options?: SequenceOptions$1 & { ticker?: Ticker; driver?: any; }): AnimationPlaybackControlsWithThen; export { type AnimationOptions, type AnimationOptionsCommon, type AnimationSequenceOptions, type KeyframesType, type ObjectSegment, type ObjectSegmentWithTransition$1 as ObjectSegmentWithTransition, type SegmentOptions, type SequenceOptions, animate, motion, motionDriver, timeline };