Moving dependencies

Author: mattgperry

packages/framer-motion/src/animation/animators/MainThreadAnimation.ts

@@ -1,4 +1,5 @@
 import {
+    activeAnimations,
     calcGeneratorDuration,
     isGenerator,
     ValueAnimationOptions,
@@ -8,7 +9,6 @@ import {
     millisecondsToSeconds,
     secondsToMilliseconds,
 } from "motion-utils"
-import { activeAnimations } from "../../../../motion-dom/src/stats/animation-count"
 import {
     KeyframeResolver as DefaultKeyframeResolver,
     ResolvedKeyframes,

packages/framer-motion/src/animation/animators/__tests__/utils.ts

@@ -1,5 +1,4 @@
-import { frameData } from "../../../frameloop"
-import { time } from "../../../frameloop/sync-time"
+import { frameData, time } from "motion-dom"
 import { KeyframeGenerator } from "../../generators/types"
 
 export const syncDriver = (interval = 10) => {

packages/framer-motion/src/animation/animators/waapi/index.ts

@@ -1,6 +1,8 @@
-import { mapEasingToNativeEasing } from "motion-dom"
-import { activeAnimations } from "../../../../../motion-dom/src/stats/animation-count"
-import { statsBuffer } from "../../../../../motion-dom/src/stats/buffer"
+import {
+    activeAnimations,
+    mapEasingToNativeEasing,
+    statsBuffer,
+} from "motion-dom"
 import { NativeAnimationOptions } from "./types"
 
 export function startWaapiAnimation(

packages/framer-motion/src/animation/interfaces/visual-element-target.ts

@@ -1,5 +1,8 @@
-import { AnimationPlaybackControls, getValueTransition } from "motion-dom"
-import { frame } from "../../frameloop"
+import {
+    AnimationPlaybackControls,
+    frame,
+    getValueTransition,
+} from "motion-dom"
 import { positionalKeys } from "../../render/html/utils/keys-position"
 import type { AnimationTypeState } from "../../render/utils/animation-state"
 import { setTarget } from "../../render/utils/setters"

packages/framer-motion/src/animation/optimized-appear/handoff.ts

@@ -1,4 +1,4 @@
-import type { Batcher } from "../../frameloop/types"
+import type { Batcher } from "motion-dom"
 import { appearAnimationStore } from "./store"
 import { appearStoreId } from "./store-id"
 

packages/framer-motion/src/gestures/__tests__/utils.ts

@@ -1,5 +1,4 @@
-import { frame } from "../../frameloop"
-import { microtask } from "../../frameloop/microtask"
+import { frame, microtask } from "motion-dom"
 
 export async function nextFrame() {
     return new Promise<void>((resolve) => {

packages/framer-motion/src/gestures/drag/VisualElementDragControls.ts

@@ -1,10 +1,9 @@
-import { setDragLock } from "motion-dom"
+import { frame, setDragLock } from "motion-dom"
 import { invariant } from "motion-utils"
 import { animateMotionValue } from "../../animation/interfaces/motion-value"
 import { addDomEvent } from "../../events/add-dom-event"
 import { addPointerEvent } from "../../events/add-pointer-event"
 import { extractEventInfo } from "../../events/event-info"
-import { frame } from "../../frameloop"
 import { MotionProps } from "../../motion/types"
 import {
     convertBoundingBoxToBox,

packages/framer-motion/src/gestures/drag/__tests__/utils.tsx

@@ -1,7 +1,7 @@
+import { frame } from "motion-dom"
 import * as React from "react"
 import { pointerDown, pointerMove, pointerUp } from "../../../../jest.setup"
 import { MotionConfig } from "../../../components/MotionConfig"
-import { frame } from "../../../frameloop"
 
 export type Point = {
     x: number

packages/framer-motion/src/gestures/hover.ts

@@ -1,6 +1,5 @@
-import { hover } from "motion-dom"
+import { frame, hover } from "motion-dom"
 import { extractEventInfo } from "../events/event-info"
-import { frame } from "../frameloop"
 import { Feature } from "../motion/features/Feature"
 import type { VisualElement } from "../render/VisualElement"
 

packages/framer-motion/src/gestures/pan/PanSession.ts

@@ -1,9 +1,8 @@
-import { isPrimaryPointer } from "motion-dom"
+import { cancelFrame, frame, frameData, isPrimaryPointer } from "motion-dom"
 import { millisecondsToSeconds, secondsToMilliseconds } from "motion-utils"
 import { addPointerEvent } from "../../events/add-pointer-event"
 import { extractEventInfo } from "../../events/event-info"
 import { EventInfo } from "../../events/types"
-import { cancelFrame, frame, frameData } from "../../frameloop"
 import { Point, TransformPoint } from "../../projection/geometry/types"
 import { distance2D } from "../../utils/distance"
 import { pipe } from "../../utils/pipe"

packages/framer-motion/src/gestures/pan/index.ts

@@ -1,6 +1,6 @@
+import { frame } from "motion-dom"
 import { noop } from "motion-utils"
 import { addPointerEvent } from "../../events/add-pointer-event"
-import { frame } from "../../frameloop"
 import { Feature } from "../../motion/features/Feature"
 import { getContextWindow } from "../../utils/get-context-window"
 import { PanInfo, PanSession } from "./PanSession"

packages/framer-motion/src/gestures/press.ts

@@ -1,6 +1,5 @@
-import { press } from "motion-dom"
+import { frame, press } from "motion-dom"
 import { extractEventInfo } from "../events/event-info"
-import { frame } from "../frameloop"
 import { Feature } from "../motion/features/Feature"
 import { VisualElement } from "../render/VisualElement"
 

packages/framer-motion/src/motion/__tests__/child-motion-value.test.tsx

@@ -1,7 +1,6 @@
+import { frame, motionValue } from "motion-dom"
 import { render } from "../../../jest.setup"
 import { motion } from "../../render/components/motion"
-import { motionValue } from "../../value"
-import { frame } from "../../frameloop"
 
 describe("child as motion value", () => {
     test("accepts motion values as children", async () => {
@@ -19,7 +18,11 @@ describe("child as motion value", () => {
     test("accepts motion values as children for motion.text inside an svg", async () => {
         const promise = new Promise<SVGTextElement>((resolve) => {
             const child = motionValue(3)
-            const Component = () => <svg><motion.text>{child}</motion.text></svg>
+            const Component = () => (
+                <svg>
+                    <motion.text>{child}</motion.text>
+                </svg>
+            )
             const { container, rerender } = render(<Component />)
             rerender(<Component />)
             resolve(container.firstChild?.firstChild as SVGTextElement)
@@ -50,7 +53,11 @@ describe("child as motion value", () => {
     test("updates svg text when motion value changes", async () => {
         const promise = new Promise<SVGTextElement>((resolve) => {
             const child = motionValue(3)
-            const Component = () => <svg><motion.text>{child}</motion.text></svg>
+            const Component = () => (
+                <svg>
+                    <motion.text>{child}</motion.text>
+                </svg>
+            )
             const { container, rerender } = render(<Component />)
             rerender(<Component />)
 

packages/framer-motion/src/motion/__tests__/transformTemplate.test.tsx

@@ -1,6 +1,6 @@
-import { render } from "../../../jest.setup"
+import { frame } from "motion-dom"
 import { motion } from "../../"
-import { frame } from "../../frameloop"
+import { render } from "../../../jest.setup"
 import { nextMicrotask } from "../../gestures/__tests__/utils"
 
 describe("transformTemplate", () => {

packages/framer-motion/src/motion/features/layout/MeasureLayout.tsx

@@ -1,14 +1,13 @@
 "use client"
 
+import { frame, microtask } from "motion-dom"
 import { Component, useContext } from "react"
 import { usePresence } from "../../../components/AnimatePresence/use-presence"
 import {
     LayoutGroupContext,
     LayoutGroupContextProps,
 } from "../../../context/LayoutGroupContext"
 import { SwitchLayoutGroupContext } from "../../../context/SwitchLayoutGroupContext"
-import { frame } from "../../../frameloop"
-import { microtask } from "../../../frameloop/microtask"
 import { globalProjectionState } from "../../../projection/node/state"
 import { correctBorderRadius } from "../../../projection/styles/scale-border-radius"
 import { correctBoxShadow } from "../../../projection/styles/scale-box-shadow"

packages/framer-motion/src/motion/utils/use-visual-element.ts

@@ -1,22 +1,22 @@
+import { microtask } from "motion-dom"
 import * as React from "react"
-import { useContext, useRef, useEffect, useInsertionEffect } from "react"
-import { PresenceContext } from "../../context/PresenceContext"
-import { MotionProps } from "../../motion/types"
-import { MotionContext } from "../../context/MotionContext"
-import { CreateVisualElement } from "../../render/types"
-import { useIsomorphicLayoutEffect } from "../../utils/use-isomorphic-effect"
-import { VisualState } from "./use-visual-state"
+import { useContext, useEffect, useInsertionEffect, useRef } from "react"
+import { optimizedAppearDataAttribute } from "../../animation/optimized-appear/data-id"
 import { LazyContext } from "../../context/LazyContext"
 import { MotionConfigContext } from "../../context/MotionConfigContext"
-import type { VisualElement } from "../../render/VisualElement"
-import { optimizedAppearDataAttribute } from "../../animation/optimized-appear/data-id"
-import { microtask } from "../../frameloop/microtask"
-import { IProjectionNode } from "../../projection/node/types"
-import { isRefObject } from "../../utils/is-ref-object"
+import { MotionContext } from "../../context/MotionContext"
+import { PresenceContext } from "../../context/PresenceContext"
 import {
     InitialPromotionConfig,
     SwitchLayoutGroupContext,
 } from "../../context/SwitchLayoutGroupContext"
+import { MotionProps } from "../../motion/types"
+import { IProjectionNode } from "../../projection/node/types"
+import { CreateVisualElement } from "../../render/types"
+import type { VisualElement } from "../../render/VisualElement"
+import { isRefObject } from "../../utils/is-ref-object"
+import { useIsomorphicLayoutEffect } from "../../utils/use-isomorphic-effect"
+import { VisualState } from "./use-visual-state"
 
 export function useVisualElement<Instance, RenderState>(
     Component: string | React.ComponentType<React.PropsWithChildren<unknown>>,

packages/framer-motion/src/projection/node/create-projection-node.ts

@@ -1,19 +1,18 @@
 import {
+    activeAnimations,
     AnimationPlaybackControls,
     cancelFrame,
     frame,
     frameData,
     frameSteps,
     getValueTransition,
     microtask,
+    statsBuffer,
     time,
     ValueAnimationOptions,
     type Process,
 } from "motion-dom"
-import { noop } from "motion-utils"
-import { activeAnimations } from "../../../../motion-dom/src/stats/animation-count"
-import { statsBuffer } from "../../../../motion-dom/src/stats/buffer"
-import { SubscriptionManager } from "../../../../motion-utils/src/subscription-manager"
+import { noop, SubscriptionManager } from "motion-utils"
 import { animateSingleValue } from "../../animation/animate/single-value"
 import { getOptimisedAppearId } from "../../animation/optimized-appear/get-appear-id"
 import { MotionStyle } from "../../motion/types"

packages/framer-motion/src/render/dom/scroll/__tests__/index.test.ts

@@ -1,7 +1,7 @@
-import { frame } from "../../../../frameloop"
-import { scrollInfo } from "../track"
+import { frame } from "motion-dom"
 import { scroll } from "../"
 import { ScrollOffset } from "../offsets/presets"
+import { scrollInfo } from "../track"
 import { ScrollInfo } from "../types"
 
 type Measurements = {

packages/framer-motion/src/render/dom/scroll/observe.ts

@@ -1,5 +1,4 @@
-import { ProgressTimeline } from "motion-dom"
-import { cancelFrame, frame } from "../../../frameloop"
+import { cancelFrame, frame, ProgressTimeline } from "motion-dom"
 
 type Update = (progress: number) => void
 

packages/framer-motion/src/render/dom/scroll/track.ts

@@ -1,8 +1,8 @@
-import { frame, cancelFrame, frameData } from "../../../frameloop"
+import { cancelFrame, frame, frameData } from "motion-dom"
 import { resize } from "../resize"
 import { createScrollInfo } from "./info"
 import { createOnScrollHandler } from "./on-scroll-handler"
-import { OnScrollInfo, OnScrollHandler, ScrollInfoOptions } from "./types"
+import { OnScrollHandler, OnScrollInfo, ScrollInfoOptions } from "./types"
 
 const scrollListeners = new WeakMap<Element, VoidFunction>()
 const resizeListeners = new WeakMap<Element, VoidFunction>()

packages/framer-motion/src/render/svg/config-motion.ts

@@ -1,4 +1,4 @@
-import { frame } from "../../frameloop/frame"
+import { frame } from "motion-dom"
 import { MotionComponentConfig } from "../../motion"
 import { makeUseVisualState } from "../../motion/utils/use-visual-state"
 import { transformProps } from "../html/utils/keys-transform"

packages/framer-motion/src/utils/delay.ts

@@ -1,7 +1,5 @@
+import { cancelFrame, frame, FrameData, time } from "motion-dom"
 import { secondsToMilliseconds } from "motion-utils"
-import { cancelFrame, frame } from "../frameloop"
-import { time } from "../frameloop/sync-time"
-import { FrameData } from "../frameloop/types"
 
 export type DelayedFunction = (overshoot: number) => void
 

packages/framer-motion/src/utils/use-animation-frame.ts

@@ -1,7 +1,6 @@
-import { frame, cancelFrame } from "../frameloop"
+import { cancelFrame, frame, FrameData } from "motion-dom"
 import { useContext, useEffect, useRef } from "react"
 import { MotionConfigContext } from "../context/MotionConfigContext"
-import { FrameData } from "../frameloop/types"
 
 export type FrameCallback = (timestamp: number, delta: number) => void
 

packages/framer-motion/src/utils/use-force-update.ts

@@ -1,5 +1,5 @@
-import { frame } from "../frameloop"
-import { useState, useCallback } from "react"
+import { frame } from "motion-dom"
+import { useCallback, useState } from "react"
 import { useIsMounted } from "./use-is-mounted"
 
 export function useForceUpdate(): [VoidFunction, number] {

packages/framer-motion/src/utils/use-instant-transition.ts

@@ -1,4 +1,4 @@
-import { frame } from "../frameloop"
+import { frame } from "motion-dom"
 import { useEffect, useRef } from "react"
 import { useInstantLayoutTransition } from "../projection/use-instant-layout-transition"
 import { useForceUpdate } from "./use-force-update"

packages/framer-motion/src/value/use-spring.ts

@@ -1,12 +1,11 @@
-import { MotionValue, SpringOptions } from "motion-dom"
+import { MotionValue, SpringOptions, frame } from "motion-dom"
 import { noop } from "motion-utils"
 import { useContext, useInsertionEffect, useRef } from "react"
 import {
     MainThreadAnimation,
     animateValue,
 } from "../animation/animators/MainThreadAnimation"
 import { MotionConfigContext } from "../context/MotionConfigContext"
-import { frame } from "../frameloop"
 import { useConstant } from "../utils/use-constant"
 import { useIsomorphicLayoutEffect } from "../utils/use-isomorphic-effect"
 import { useMotionValue } from "./use-motion-value"

packages/motion-dom/src/index.ts

@@ -29,6 +29,11 @@ export * from "./gestures/utils/is-primary-pointer"
 
 export * from "./render/svg/types"
 
+export * from "./stats"
+export * from "./stats/animation-count"
+export * from "./stats/buffer"
+export * from "./stats/types"
+
 export * from "./utils/is-bezier-definition"
 export * from "./utils/resolve-elements"
 export * from "./utils/supports/flags"