motion-v 0.5.2-beta.1 → 0.6.0

package/dist/src/components/{type.d.ts → animate-presence/types.d.ts}

@@ -3,4 +3,6 @@ export interface AnimatePresenceProps {
     initial?: boolean;
     multiple?: boolean;
     as?: string;
+    custom?: any;
+    onExitComplete?: VoidFunction;
 }

package/dist/src/components/{use-pop-layout.d.ts → animate-presence/use-pop-layout.d.ts}

@@ -1,5 +1,5 @@
-import { AnimatePresenceProps } from './type';
-import { MotionState } from '../state';
+import { AnimatePresenceProps } from './types';
+import { MotionState } from '../../state';
 export declare function usePopLayout(props: AnimatePresenceProps): {
     addPopStyle: (state: MotionState) => void;
     removePopStyle: (state: MotionState) => void;

package/dist/src/components/animate-presence/use-presence.d.ts

@@ -0,0 +1,2 @@
+export declare const presenceMeasure: Map<HTMLElement, boolean>;
+export declare function usePresence(): void;

package/dist/src/components/context.d.ts

@@ -6,6 +6,7 @@ export interface NodeGroup {
     add: (node: IProjectionNode) => void;
     remove: (node: IProjectionNode) => void;
     dirty: VoidFunction;
+    didUpdate: VoidFunction;
 }
 export interface LayoutGroupState {
     id?: string;

package/dist/src/components/group.d.ts

@@ -3,5 +3,6 @@ export interface NodeGroup {
     add: (node: IProjectionNode) => void;
     remove: (node: IProjectionNode) => void;
     dirty: VoidFunction;
+    didUpdate: VoidFunction;
 }
 export declare function nodeGroup(): NodeGroup;

package/dist/src/components/hooks/use-motion-elm.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Get the actual motion element, skipping text and comment nodes
+ * @param el - The HTML element to check
+ * @returns The first non-text/comment element
+ */
+export declare function getMotionElement(el: HTMLElement): HTMLElement;
+/**
+ * Hook to get the motion element of current component instance
+ * @returns Function that returns the motion element
+ */
+export declare function useMotionElm(): {
+    value: HTMLElement | null;
+};

package/dist/src/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './animate-presence';
+export * from './motion-config';

package/dist/src/components/presence.d.ts

@@ -1,9 +1,7 @@
-import { Ref } from 'vue';
-export declare const doneCallbacks: WeakMap<Element, VoidFunction>;
-export declare const unPresenceDom: Ref<WeakMap<Element, boolean> & Omit<WeakMap<Element, boolean>, keyof WeakMap<any, any>>>;
+export declare const doneCallbacks: WeakMap<Element, (v?: any, safeUnmount?: boolean) => void>;
 export declare function removeDoneCallback(element: Element): void;
 export interface PresenceContext {
-    initial: Ref<boolean>;
-    safeUnmount: (el: Element) => boolean;
+    initial?: boolean;
+    custom?: any;
 }
 export declare const injectAnimatePresence: <T extends PresenceContext = PresenceContext>(fallback?: T) => T extends null ? PresenceContext : PresenceContext, provideAnimatePresence: (contextValue: PresenceContext) => PresenceContext;

package/dist/src/components/utils.d.ts

@@ -1 +1,8 @@
+import { ComponentPublicInstance } from 'vue';
 export declare function getMotionElement(el: HTMLElement): HTMLElement;
+/**
+ * 检查是否是隐藏的 motion 元素
+ * @param instance
+ * @returns
+ */
+export declare function checkMotionIsHidden(instance: ComponentPublicInstance): boolean;

package/dist/src/index.d.ts

@@ -1,12 +1,10 @@
 export * from 'framer-motion/dom';
 export { motionValue as useMotionValue } from 'framer-motion/dom';
 export { default as Motion, type MotionProps } from './components/Motion';
-export { default as AnimatePresence } from './components/AnimatePresence';
-export type { AnimatePresenceProps } from './components/type';
+export * from './components';
 export { default as LayoutGroup } from './components/LayoutGroup';
 export { useLayoutGroup } from './components/use-layout-group';
 export type { LayoutGroupProps } from './components/use-layout-group';
-export * from './components/motion-config';
 export * from './components/context';
 export * from './value';
 export * from './constants';

package/dist/src/state/animate-variants-children.d.ts

@@ -6,7 +6,7 @@ export type ActiveVariant = {
         transition: AnimateOptions;
     };
 };
-export declare function animateVariantsChildren(state: MotionState, activeState: ActiveVariant): {
+export declare function animateVariantsChildren(state: MotionState, activeState: ActiveVariant, isFirstAnimate?: boolean): {
     animations: any[];
     getAnimations: () => Promise<void>;
 } | {

package/dist/src/state/event.d.ts

@@ -1,5 +1,5 @@
 import { Variant } from '../types';
-export type MotionEventNames = 'motionstart' | 'motioncomplete' | 'hoverstart' | 'hoverend' | 'pressstart' | 'pressend' | 'viewenter' | 'viewleave';
+export type MotionEventNames = 'motionstart' | 'motioncomplete';
 export declare function motionEvent(name: MotionEventNames, target: Variant, isExit?: boolean): CustomEvent<{
     target: Variant;
     isExit: boolean;

package/dist/src/state/motion-state.d.ts

@@ -2,13 +2,15 @@ import { MotionStateContext, Options } from '../types';
 import { DOMKeyframesDefinition, VisualElement } from 'framer-motion';
 declare const STATE_TYPES: readonly ["initial", "animate", "inView", "hover", "press", "whileDrag", "exit"];
 type StateType = typeof STATE_TYPES[number];
-export declare const mountedStates: WeakMap<Element, MotionState>;
+export declare const mountedStates: Map<string | Element, MotionState>;
 export declare class MotionState {
     readonly id: string;
     element: HTMLElement | null;
     private parent?;
     options: Options;
-    private isFirstAnimate;
+    isSafeToRemove: boolean;
+    isFirstAnimate: boolean;
+    private children?;
     activeStates: Partial<Record<StateType, boolean>>;
     depth: number;
     baseTarget: DOMKeyframesDefinition;
@@ -22,14 +24,15 @@ export declare class MotionState {
     get initial(): string | boolean | import('../types').Variant;
     updateOptions(): void;
     beforeMount(): void;
-    mount(element: HTMLElement, options: Options): void;
+    mount(element: HTMLElement, options: Options, notAnimate?: boolean): void;
     beforeUnmount(): void;
-    unmount(): void;
+    unmount(unMountChildren?: boolean): void;
     beforeUpdate(): void;
-    update(options: Options): void;
-    setActive(name: StateType, isActive: boolean): void;
-    animateUpdates(): Generator<any, void, unknown>;
+    update(options: Options, notAnimate?: boolean): void;
+    setActive(name: StateType, isActive: boolean, isAnimate?: boolean): void;
+    animateUpdates(isInitial?: boolean): void;
     isMounted(): boolean;
     getOptions(): Options<any>;
+    willUpdate(label: string): void;
 }
 export {};

package/dist/src/types/state.d.ts

@@ -1,4 +1,4 @@
-import { DOMKeyframesDefinition, DynamicAnimationOptions, Target, TargetAndTransition } from 'framer-motion';
+import { DOMKeyframesDefinition, DynamicAnimationOptions, ResolvedValues, Target, TargetAndTransition } from 'framer-motion';
 import { MotionValue, animate } from 'framer-motion/dom';
 import { IntrinsicElementAttributes } from 'vue';
 import { TransformProperties } from './transform';
@@ -50,9 +50,13 @@ export interface Options<T = any> extends LayoutOptions, PressProps, HoverProps,
     };
     style?: MotionStyle;
     transformTemplate?: (transform: TransformProperties, generatedTransform: string) => string;
-    transition?: AnimateOptions;
+    transition?: AnimateOptions & {
+        layout?: DynamicAnimationOptions;
+    };
     layoutGroup?: LayoutGroupState;
     motionConfig?: MotionConfigState;
+    onAnimationComplete?: (definition: AnimateOptions) => void;
+    onUpdate?: (latest: ResolvedValues) => void;
 }
 export interface MotionStateContext {
     initial?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "motion-v",
-  "version": "0.5.2-beta.1",
+  "version": "0.6.0",
   "description": "",
   "author": "",
   "license": "MIT",
@@ -63,6 +63,7 @@
     "@vitest/coverage-v8": "^1.4.0",
     "@vue/test-utils": "^2.4.5",
     "framer-motion": "^11.15.0",
+    "happy-dom": "^16.0.1",
     "jsdom": "^24.0.0",
     "vite": "^5.4.8",
     "vite-plugin-dts": "^4.2.4",
@@ -71,7 +72,7 @@
   "scripts": {
     "dev": "vite build --watch",
     "build": "rm -rf dist && vite build",
-    "test": "vitest",
+    "test": "vitest --dom",
     "coverage": "vitest run --coverage",
     "pub:release": "pnpm publish --access public"
   }