Blame view

天文台pc/tianwentai-ui/node_modules/framer-motion/dist/es/animation/hooks/use-animated-state.mjs 1.94 KB
bc518174   王天杨   提交两个项目文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
  "use client";
  import { animateVisualElement, VisualElement, createBox } from 'motion-dom';
  import { useState, useLayoutEffect } from 'react';
  import { makeUseVisualState } from '../../motion/utils/use-visual-state.mjs';
  import { useConstant } from '../../utils/use-constant.mjs';
  
  const createObject = () => ({});
  class StateVisualElement extends VisualElement {
      constructor() {
          super(...arguments);
          this.measureInstanceViewportBox = createBox;
      }
      build() { }
      resetTransform() { }
      restoreTransform() { }
      removeValueFromRenderState() { }
      renderInstance() { }
      scrapeMotionValuesFromProps() {
          return createObject();
      }
      getBaseTargetFromProps() {
          return undefined;
      }
      readValueFromInstance(_state, key, options) {
          return options.initialState[key] || 0;
      }
      sortInstanceNodePosition() {
          return 0;
      }
  }
  const useVisualState = makeUseVisualState({
      scrapeMotionValuesFromProps: createObject,
      createRenderState: createObject,
  });
  /**
   * This is not an officially supported API and may be removed
   * on any version.
   */
  function useAnimatedState(initialState) {
      const [animationState, setAnimationState] = useState(initialState);
      const visualState = useVisualState({}, false);
      const element = useConstant(() => {
          return new StateVisualElement({
              props: {
                  onUpdate: (v) => {
                      setAnimationState({ ...v });
                  },
              },
              visualState,
              presenceContext: null,
          }, { initialState });
      });
      useLayoutEffect(() => {
          element.mount({});
          return () => element.unmount();
      }, [element]);
      const startAnimation = useConstant(() => (animationDefinition) => {
          return animateVisualElement(element, animationDefinition);
      });
      return [animationState, startAnimation];
  }
  
  export { useAnimatedState };
  //# sourceMappingURL=use-animated-state.mjs.map