From 735fe90a1053d489ebd3abc0447511cd79453fcd Mon Sep 17 00:00:00 2001 From: Innei Date: Fri, 18 Apr 2025 00:12:20 +0800 Subject: [PATCH] chore: migrate from framer-motion to motion library Signed-off-by: Innei --- apps/desktop/src/renderer/package.json | 2 +- .../renderer/src/components/common/Motion.tsx | 4 +- .../ui/auto-completion/AutoCompletion.tsx | 2 +- .../src/components/ui/button/base.tsx | 4 +- .../src/components/ui/collapse/Collapse.tsx | 4 +- .../src/components/ui/constants/spring.ts | 2 +- .../src/components/ui/fab/FABContainer.tsx | 4 +- .../components/ui/markdown/components/Toc.tsx | 2 +- .../src/renderer/src/components/ui/media.tsx | 2 +- .../src/components/ui/media/VideoPlayer.tsx | 2 +- .../ui/modal/helper/async-loading.tsx | 2 +- .../components/ui/modal/stacked/constants.ts | 2 +- .../ui/modal/stacked/custom-modal.tsx | 2 +- .../ui/modal/stacked/declarative-modal.tsx | 2 +- .../src/components/ui/modal/stacked/hooks.tsx | 2 +- .../ui/modal/stacked/internal/use-animate.ts | 2 +- .../ui/modal/stacked/internal/use-drag.ts | 2 +- .../ui/modal/stacked/modal-stack.electron.tsx | 2 +- .../ui/modal/stacked/modal-stack.mobile.tsx | 2 +- .../src/components/ui/modal/stacked/modal.tsx | 2 +- .../components/ui/modal/stacked/overlay.tsx | 2 +- .../src/components/ux/transition/icon.tsx | 4 +- .../renderer/src/hooks/biz/useReduceMotion.ts | 2 +- .../activation/ActivationModalContent.tsx | 2 +- .../src/modules/ai/ai-daily/daily.tsx | 4 +- .../entry-content/EntryContentPlaceholder.tsx | 2 +- .../app-layout/entry-content/desktop.tsx | 2 +- .../feed-column/float-bar.mobile.tsx | 2 +- .../app-layout/subview/index.mobile.tsx | 2 +- .../src/modules/auth/LoginModalContent.tsx | 2 +- .../src/renderer/src/modules/boost/modal.tsx | 2 +- .../src/modules/boost/radio-cards.tsx | 2 +- .../renderer/src/modules/discover/form.tsx | 2 +- .../entry-column/components/DateItem.tsx | 2 +- .../src/modules/entry-column/list.tsx | 2 +- .../components/EntryReadHistory.shared.tsx | 2 +- .../components/EntryTimelineSidebar.tsx | 4 +- .../components/SourceContentView.tsx | 2 +- .../modules/entry-content/header.electron.tsx | 2 +- .../modules/entry-content/header.mobile.tsx | 2 +- .../renderer/src/modules/feed/feed-icon.tsx | 2 +- .../renderer/src/modules/modal/shortcuts.tsx | 2 +- .../new-user-guide/guide-modal-content.tsx | 2 +- .../src/renderer/src/modules/panel/cmdf.tsx | 2 +- .../src/modules/player/corner-player.tsx | 2 +- .../src/modules/profile/email-management.tsx | 2 +- .../src/modules/profile/two-factor.tsx | 2 +- .../profile/user-profile-modal.electron.tsx | 2 +- .../profile/user-profile-modal.shared.tsx | 2 +- .../src/modules/settings/modal/layout.tsx | 2 +- .../src/modules/settings/tabs/apperance.tsx | 2 +- .../modules/timeline-column/FeedCategory.tsx | 2 +- .../timeline-column/FeedList.shared.tsx | 2 +- .../timeline-column/TimelineColumnHeader.tsx | 2 +- .../src/modules/timeline-column/index.tsx | 2 +- .../update-notice/UpdateNotice.mobile.tsx | 2 +- .../modules/update-notice/UpdateNotice.tsx | 2 +- apps/desktop/vite.config.ts | 2 +- .../entry-list/templates/EntryNormalItem.tsx | 2 +- apps/ssr/client/components/items/picture.tsx | 2 +- .../client/components/layout/header/index.tsx | 4 +- apps/ssr/package.json | 4 +- packages/components/package.json | 2 +- .../components/src/common/MotionProvider.tsx | 2 +- .../components/src/framer-lazy-feature.ts | 2 +- .../src/ui/auto-resize-height/index.tsx | 4 +- packages/components/src/ui/button/index.tsx | 4 +- .../components/src/ui/feed-icon/index.tsx | 2 +- packages/components/src/ui/input/TextArea.tsx | 2 +- packages/components/src/ui/loading/index.tsx | 2 +- packages/components/src/ui/masonry/index.tsx | 2 +- packages/components/src/ui/segment/index.tsx | 2 +- packages/components/src/ui/tooltip/index.tsx | 2 +- packages/utils/package.json | 2 +- packages/utils/src/scroller.ts | 4 +- pnpm-lock.yaml | 84 ++++++++++++------- 76 files changed, 140 insertions(+), 118 deletions(-) diff --git a/apps/desktop/src/renderer/package.json b/apps/desktop/src/renderer/package.json index 7f78cdcd8..bdb9d7dae 100644 --- a/apps/desktop/src/renderer/package.json +++ b/apps/desktop/src/renderer/package.json @@ -56,7 +56,6 @@ "es-toolkit": "1.34.1", "firebase": "11.6.0", "foxact": "0.2.45", - "framer-motion": "12.6.5", "franc-min": "6.2.0", "fuse.js": "7.1.0", "hast-util-to-jsx-runtime": "2.3.6", @@ -70,6 +69,7 @@ "masonic": "4.0.1", "mdast-util-gfm-table": "2.0.0", "mdast-util-to-markdown": "2.1.2", + "motion": "12.7.4", "nanoid": "5.1.5", "ofetch": "1.4.1", "plain-shiki": "0.2.0", diff --git a/apps/desktop/src/renderer/src/components/common/Motion.tsx b/apps/desktop/src/renderer/src/components/common/Motion.tsx index f6d092d48..dcec6083c 100644 --- a/apps/desktop/src/renderer/src/components/common/Motion.tsx +++ b/apps/desktop/src/renderer/src/components/common/Motion.tsx @@ -1,5 +1,5 @@ -import type { MotionProps, TargetAndTransition } from "framer-motion" -import { m as M } from "framer-motion" +import type { MotionProps, TargetAndTransition } from "motion/react" +import { m as M } from "motion/react" import { createElement, forwardRef } from "react" import { useReduceMotion } from "~/hooks/biz/useReduceMotion" diff --git a/apps/desktop/src/renderer/src/components/ui/auto-completion/AutoCompletion.tsx b/apps/desktop/src/renderer/src/components/ui/auto-completion/AutoCompletion.tsx index 653b5eafe..6d751dcea 100644 --- a/apps/desktop/src/renderer/src/components/ui/auto-completion/AutoCompletion.tsx +++ b/apps/desktop/src/renderer/src/components/ui/auto-completion/AutoCompletion.tsx @@ -3,8 +3,8 @@ import { useCorrectZIndex } from "@follow/components/ui/z-index/ctx.js" import { stopPropagation } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" import { Combobox, ComboboxInput, ComboboxOption, ComboboxOptions } from "@headlessui/react" -import { AnimatePresence, m } from "framer-motion" import Fuse from "fuse.js" +import { AnimatePresence, m } from "motion/react" import { forwardRef, Fragment, useCallback, useEffect, useState } from "react" export type Suggestion = { diff --git a/apps/desktop/src/renderer/src/components/ui/button/base.tsx b/apps/desktop/src/renderer/src/components/ui/button/base.tsx index d2a5b9ed4..9b080cc22 100644 --- a/apps/desktop/src/renderer/src/components/ui/button/base.tsx +++ b/apps/desktop/src/renderer/src/components/ui/button/base.tsx @@ -1,8 +1,8 @@ import { MotionButtonBase } from "@follow/components/ui/button/index.js" import { useTypeScriptHappyCallback } from "@follow/hooks" import { cn } from "@follow/utils/utils" -import type { HTMLMotionProps, Variants } from "framer-motion" -import { AnimatePresence, m } from "framer-motion" +import type { HTMLMotionProps, Variants } from "motion/react" +import { AnimatePresence, m } from "motion/react" import type { FC } from "react" import * as React from "react" import { cloneElement, useRef, useState } from "react" diff --git a/apps/desktop/src/renderer/src/components/ui/collapse/Collapse.tsx b/apps/desktop/src/renderer/src/components/ui/collapse/Collapse.tsx index dc243fb90..4efb11a26 100644 --- a/apps/desktop/src/renderer/src/components/ui/collapse/Collapse.tsx +++ b/apps/desktop/src/renderer/src/components/ui/collapse/Collapse.tsx @@ -1,8 +1,8 @@ import { jotaiStore } from "@follow/utils/jotai" import { cn } from "@follow/utils/utils" -import type { Variants } from "framer-motion" -import { AnimatePresence, m } from "framer-motion" import { atom, useAtom, useStore } from "jotai" +import type { Variants } from "motion/react" +import { AnimatePresence, m } from "motion/react" import * as React from "react" import { useEffect } from "react" diff --git a/apps/desktop/src/renderer/src/components/ui/constants/spring.ts b/apps/desktop/src/renderer/src/components/ui/constants/spring.ts index f224a44b2..7f921c604 100644 --- a/apps/desktop/src/renderer/src/components/ui/constants/spring.ts +++ b/apps/desktop/src/renderer/src/components/ui/constants/spring.ts @@ -1,4 +1,4 @@ -import type { Spring } from "framer-motion" +import type { Spring } from "motion/react" export const reboundPreset: Spring = { type: "spring", diff --git a/apps/desktop/src/renderer/src/components/ui/fab/FABContainer.tsx b/apps/desktop/src/renderer/src/components/ui/fab/FABContainer.tsx index a936f40bc..93cdf3ddc 100644 --- a/apps/desktop/src/renderer/src/components/ui/fab/FABContainer.tsx +++ b/apps/desktop/src/renderer/src/components/ui/fab/FABContainer.tsx @@ -2,9 +2,9 @@ import { RootPortal } from "@follow/components/ui/portal/index.jsx" import { useTypeScriptHappyCallback } from "@follow/hooks" import { clsx, cn } from "@follow/utils/utils" import { typescriptHappyForwardRef } from "foxact/typescript-happy-forward-ref" -import type { HTMLMotionProps } from "framer-motion" -import { AnimatePresence } from "framer-motion" import { atom, useAtomValue } from "jotai" +import type { HTMLMotionProps } from "motion/react" +import { AnimatePresence } from "motion/react" import type * as React from "react" import type { JSX, PropsWithChildren, ReactNode } from "react" import { useId } from "react" diff --git a/apps/desktop/src/renderer/src/components/ui/markdown/components/Toc.tsx b/apps/desktop/src/renderer/src/components/ui/markdown/components/Toc.tsx index 61ff3ed5a..183d8cf66 100644 --- a/apps/desktop/src/renderer/src/components/ui/markdown/components/Toc.tsx +++ b/apps/desktop/src/renderer/src/components/ui/markdown/components/Toc.tsx @@ -1,7 +1,7 @@ import { useViewport } from "@follow/components/hooks/useViewport.js" import { cn } from "@follow/utils/utils" import * as HoverCard from "@radix-ui/react-hover-card" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import { memo, useContext, useEffect, useRef, useState } from "react" import { useRealInWideMode } from "~/atoms/settings/ui" diff --git a/apps/desktop/src/renderer/src/components/ui/media.tsx b/apps/desktop/src/renderer/src/components/ui/media.tsx index f8a1b45b9..ee0e44258 100644 --- a/apps/desktop/src/renderer/src/components/ui/media.tsx +++ b/apps/desktop/src/renderer/src/components/ui/media.tsx @@ -2,7 +2,7 @@ import { nextFrame } from "@follow/utils/dom" import { getImageProxyUrl } from "@follow/utils/img-proxy" import { cn } from "@follow/utils/utils" import { omit } from "es-toolkit/compat" -import { useForceUpdate } from "framer-motion" +import { useForceUpdate } from "motion/react" import type { FC, ImgHTMLAttributes, VideoHTMLAttributes } from "react" import { createContext, memo, useContext, useMemo, useState } from "react" import { Blurhash, BlurhashCanvas } from "react-blurhash" diff --git a/apps/desktop/src/renderer/src/components/ui/media/VideoPlayer.tsx b/apps/desktop/src/renderer/src/components/ui/media/VideoPlayer.tsx index 2c3a7cc44..37a8b1b62 100644 --- a/apps/desktop/src/renderer/src/components/ui/media/VideoPlayer.tsx +++ b/apps/desktop/src/renderer/src/components/ui/media/VideoPlayer.tsx @@ -5,7 +5,7 @@ import { useRefValue, useVideo } from "@follow/hooks" import { nextFrame, stopPropagation } from "@follow/utils/dom" import { clsx, cn } from "@follow/utils/utils" import * as Slider from "@radix-ui/react-slider" -import { m, useDragControls, useSpring } from "framer-motion" +import { m, useDragControls, useSpring } from "motion/react" import type { PropsWithChildren } from "react" import { forwardRef, diff --git a/apps/desktop/src/renderer/src/components/ui/modal/helper/async-loading.tsx b/apps/desktop/src/renderer/src/components/ui/modal/helper/async-loading.tsx index 38497947a..2ad058981 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/helper/async-loading.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/helper/async-loading.tsx @@ -2,7 +2,7 @@ import { Button } from "@follow/components/ui/button/index.js" import { LoadingCircle } from "@follow/components/ui/loading/index.jsx" import { Tooltip, TooltipContent, TooltipTrigger } from "@follow/components/ui/tooltip/index.jsx" import { stopPropagation } from "@follow/utils/dom" -import { m } from "framer-motion" +import { m } from "motion/react" import * as React from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/constants.ts b/apps/desktop/src/renderer/src/components/ui/modal/stacked/constants.ts index 2d4c8ef4f..1d5b90099 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/constants.ts +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/constants.ts @@ -1,4 +1,4 @@ -import type { MotionProps, Target } from "framer-motion" +import type { MotionProps, Target } from "motion/react" import { microReboundPreset } from "../../constants/spring" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/custom-modal.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/custom-modal.tsx index c923bd404..a403365bc 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/custom-modal.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/custom-modal.tsx @@ -1,6 +1,6 @@ import { nextFrame, stopPropagation } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" -import { m, useAnimationControls } from "framer-motion" +import { m, useAnimationControls } from "motion/react" import type { FC, PropsWithChildren } from "react" import { useEffect, useState } from "react" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/declarative-modal.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/declarative-modal.tsx index 838f2ec46..47209c442 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/declarative-modal.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/declarative-modal.tsx @@ -1,5 +1,5 @@ import { cn } from "@follow/utils/utils" -import { AnimatePresence } from "framer-motion" +import { AnimatePresence } from "motion/react" import type { FC, ReactNode } from "react" import { useId, useMemo } from "react" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/hooks.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/hooks.tsx index 56e707814..efb199485 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/hooks.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/hooks.tsx @@ -1,7 +1,7 @@ import { Button } from "@follow/components/ui/button/index.js" import { nextFrame } from "@follow/utils/dom" -import type { DragControls } from "framer-motion" import { atom, useAtomValue } from "jotai" +import type { DragControls } from "motion/react" import type { ResizeCallback, ResizeStartCallback } from "re-resizable" import { useContext, useId, useRef, useState } from "react" import { flushSync } from "react-dom" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-animate.ts b/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-animate.ts index 68f77f64c..8f990f015 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-animate.ts +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-animate.ts @@ -1,5 +1,5 @@ import { nextFrame } from "@follow/utils/dom" -import { useAnimationControls } from "framer-motion" +import { useAnimationControls } from "motion/react" import { useCallback, useEffect, useLayoutEffect } from "react" import { useEventCallback } from "usehooks-ts" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-drag.ts b/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-drag.ts index e34b87752..db89c4a9d 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-drag.ts +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/internal/use-drag.ts @@ -1,4 +1,4 @@ -import { useDragControls } from "framer-motion" +import { useDragControls } from "motion/react" import type { PointerEventHandler, RefObject } from "react" import { useCallback } from "react" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.electron.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.electron.tsx index 3ccc950c7..5a13b83b6 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.electron.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.electron.tsx @@ -1,5 +1,5 @@ -import { AnimatePresence } from "framer-motion" import { useAtomValue } from "jotai" +import { AnimatePresence } from "motion/react" import { modalStackAtom } from "./atom" import { useModalStack } from "./hooks" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.mobile.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.mobile.tsx index 4045af289..f5edc948c 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.mobile.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal-stack.mobile.tsx @@ -2,9 +2,9 @@ import { sheetStackAtom } from "@follow/components/ui/sheet/context.js" import type { SheetRef } from "@follow/components/ui/sheet/Sheet.js" import { PresentSheet } from "@follow/components/ui/sheet/Sheet.js" import { jotaiStore } from "@follow/utils/jotai" -import { AnimatePresence } from "framer-motion" import { produce } from "immer" import { useAtomValue, useSetAtom } from "jotai" +import { AnimatePresence } from "motion/react" import { createElement, useMemo, useRef } from "react" import { useEventCallback } from "usehooks-ts" diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal.tsx index 5e465db72..14a003360 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/modal.tsx @@ -7,10 +7,10 @@ import { ELECTRON_BUILD } from "@follow/shared/constants" import { nextFrame, preventDefault, stopPropagation } from "@follow/utils/dom" import { cn, getOS } from "@follow/utils/utils" import * as Dialog from "@radix-ui/react-dialog" -import type { BoundingBox } from "framer-motion" import { produce } from "immer" import { useAtomValue, useSetAtom } from "jotai" import { selectAtom } from "jotai/utils" +import type { BoundingBox } from "motion/react" import { Resizable } from "re-resizable" import type { FC, PropsWithChildren, SyntheticEvent } from "react" import { diff --git a/apps/desktop/src/renderer/src/components/ui/modal/stacked/overlay.tsx b/apps/desktop/src/renderer/src/components/ui/modal/stacked/overlay.tsx index 7914d75cc..83ca2898f 100644 --- a/apps/desktop/src/renderer/src/components/ui/modal/stacked/overlay.tsx +++ b/apps/desktop/src/renderer/src/components/ui/modal/stacked/overlay.tsx @@ -1,6 +1,6 @@ import { cn } from "@follow/utils/utils" import * as Dialog from "@radix-ui/react-dialog" -import { AnimatePresence } from "framer-motion" +import { AnimatePresence } from "motion/react" import type { ForwardedRef } from "react" import { forwardRef } from "react" diff --git a/apps/desktop/src/renderer/src/components/ux/transition/icon.tsx b/apps/desktop/src/renderer/src/components/ux/transition/icon.tsx index 882aef604..573736f44 100644 --- a/apps/desktop/src/renderer/src/components/ux/transition/icon.tsx +++ b/apps/desktop/src/renderer/src/components/ux/transition/icon.tsx @@ -1,6 +1,6 @@ import { cn } from "@follow/utils/utils" -import type { Spring, Target } from "framer-motion" -import { AnimatePresence, m } from "framer-motion" +import type { Spring, Target } from "motion/react" +import { AnimatePresence, m } from "motion/react" import * as React from "react" import { cloneElement, useEffect, useState } from "react" diff --git a/apps/desktop/src/renderer/src/hooks/biz/useReduceMotion.ts b/apps/desktop/src/renderer/src/hooks/biz/useReduceMotion.ts index 36d023f3b..1edb4d191 100644 --- a/apps/desktop/src/renderer/src/hooks/biz/useReduceMotion.ts +++ b/apps/desktop/src/renderer/src/hooks/biz/useReduceMotion.ts @@ -1,4 +1,4 @@ -import { useReducedMotion } from "framer-motion" +import { useReducedMotion } from "motion/react" import { useUISettingKey } from "~/atoms/settings/ui" diff --git a/apps/desktop/src/renderer/src/modules/activation/ActivationModalContent.tsx b/apps/desktop/src/renderer/src/modules/activation/ActivationModalContent.tsx index 035ae66c7..6a793959a 100644 --- a/apps/desktop/src/renderer/src/modules/activation/ActivationModalContent.tsx +++ b/apps/desktop/src/renderer/src/modules/activation/ActivationModalContent.tsx @@ -10,7 +10,7 @@ import { import { Input } from "@follow/components/ui/input/index.js" import { cn } from "@follow/utils/utils" import { zodResolver } from "@hookform/resolvers/zod" -import { m } from "framer-motion" +import { m } from "motion/react" import { useEffect, useState } from "react" import { useForm } from "react-hook-form" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/ai/ai-daily/daily.tsx b/apps/desktop/src/renderer/src/modules/ai/ai-daily/daily.tsx index 63b2a4b41..bc17efaed 100644 --- a/apps/desktop/src/renderer/src/modules/ai/ai-daily/daily.tsx +++ b/apps/desktop/src/renderer/src/modules/ai/ai-daily/daily.tsx @@ -12,9 +12,9 @@ import { } from "@follow/components/ui/tooltip/index.jsx" import { nextFrame, stopPropagation } from "@follow/utils/dom" import { cn, isBizId } from "@follow/utils/utils" -import type { Variant } from "framer-motion" -import { m, useAnimationControls } from "framer-motion" import type { Components } from "hast-util-to-jsx-runtime" +import type { Variant } from "motion/react" +import { m, useAnimationControls } from "motion/react" import type { FC } from "react" import { useEffect, useMemo, useState } from "react" import { Trans, useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/app-layout/entry-content/EntryContentPlaceholder.tsx b/apps/desktop/src/renderer/src/modules/app-layout/entry-content/EntryContentPlaceholder.tsx index 8ef6cbe31..2479e90d8 100644 --- a/apps/desktop/src/renderer/src/modules/app-layout/entry-content/EntryContentPlaceholder.tsx +++ b/apps/desktop/src/renderer/src/modules/app-layout/entry-content/EntryContentPlaceholder.tsx @@ -1,7 +1,7 @@ import { FeedViewType } from "@follow/constants" import { cn } from "@follow/utils/utils" -import { AnimatePresence, LayoutGroup, m } from "framer-motion" import { atom, useAtomValue, useSetAtom } from "jotai" +import { AnimatePresence, LayoutGroup, m } from "motion/react" import * as React from "react" import { CollapseGroup } from "~/components/ui/collapse" diff --git a/apps/desktop/src/renderer/src/modules/app-layout/entry-content/desktop.tsx b/apps/desktop/src/renderer/src/modules/app-layout/entry-content/desktop.tsx index 081fc415c..757520080 100644 --- a/apps/desktop/src/renderer/src/modules/app-layout/entry-content/desktop.tsx +++ b/apps/desktop/src/renderer/src/modules/app-layout/entry-content/desktop.tsx @@ -1,7 +1,7 @@ import { views } from "@follow/constants" import { cn } from "@follow/utils/utils" import { useWheel } from "@use-gesture/react" -import { easeOut } from "framer-motion" +import { easeOut } from "motion/react" import type { FC, PropsWithChildren } from "react" import { useState } from "react" import { useHotkeys } from "react-hotkeys-hook" diff --git a/apps/desktop/src/renderer/src/modules/app-layout/feed-column/float-bar.mobile.tsx b/apps/desktop/src/renderer/src/modules/app-layout/feed-column/float-bar.mobile.tsx index 6e22dd1c3..b5030e4b1 100644 --- a/apps/desktop/src/renderer/src/modules/app-layout/feed-column/float-bar.mobile.tsx +++ b/apps/desktop/src/renderer/src/modules/app-layout/feed-column/float-bar.mobile.tsx @@ -4,7 +4,7 @@ import { DividerVertical } from "@follow/components/ui/divider/Divider.js" import { views } from "@follow/constants" import { stopPropagation } from "@follow/utils/dom" import { clsx } from "@follow/utils/utils" -import { m, useAnimationControls } from "framer-motion" +import { m, useAnimationControls } from "motion/react" import { useCallback, useEffect, useRef, useState } from "react" import { useAudioPlayerAtomSelector } from "~/atoms/player" diff --git a/apps/desktop/src/renderer/src/modules/app-layout/subview/index.mobile.tsx b/apps/desktop/src/renderer/src/modules/app-layout/subview/index.mobile.tsx index 36fe36aa6..c73ab8e5a 100644 --- a/apps/desktop/src/renderer/src/modules/app-layout/subview/index.mobile.tsx +++ b/apps/desktop/src/renderer/src/modules/app-layout/subview/index.mobile.tsx @@ -1,5 +1,5 @@ import { cn } from "@follow/utils/utils" -import { easeOut, m, useScroll, useTransform } from "framer-motion" +import { easeOut, m, useScroll, useTransform } from "motion/react" import { Outlet } from "react-router" import { HeaderTopReturnBackButton } from "~/components/mobile/button" diff --git a/apps/desktop/src/renderer/src/modules/auth/LoginModalContent.tsx b/apps/desktop/src/renderer/src/modules/auth/LoginModalContent.tsx index 02ab64fb9..25a075f25 100644 --- a/apps/desktop/src/renderer/src/modules/auth/LoginModalContent.tsx +++ b/apps/desktop/src/renderer/src/modules/auth/LoginModalContent.tsx @@ -10,7 +10,7 @@ import { } from "@follow/components/ui/tooltip/index.js" import type { LoginRuntime } from "@follow/shared/auth" import { clsx } from "@follow/utils/utils" -import { m } from "framer-motion" +import { m } from "motion/react" import { useTranslation } from "react-i18next" import { useCurrentModal } from "~/components/ui/modal/stacked/hooks" diff --git a/apps/desktop/src/renderer/src/modules/boost/modal.tsx b/apps/desktop/src/renderer/src/modules/boost/modal.tsx index a4a328940..df99f5d8a 100644 --- a/apps/desktop/src/renderer/src/modules/boost/modal.tsx +++ b/apps/desktop/src/renderer/src/modules/boost/modal.tsx @@ -1,7 +1,7 @@ import { Button } from "@follow/components/ui/button/index.js" import { LoadingWithIcon } from "@follow/components/ui/loading/index.jsx" import { from } from "dnum" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import { useCallback, useState } from "react" import { softSpringPreset } from "~/components/ui/constants/spring" diff --git a/apps/desktop/src/renderer/src/modules/boost/radio-cards.tsx b/apps/desktop/src/renderer/src/modules/boost/radio-cards.tsx index d7fed3050..8c435cbf6 100644 --- a/apps/desktop/src/renderer/src/modules/boost/radio-cards.tsx +++ b/apps/desktop/src/renderer/src/modules/boost/radio-cards.tsx @@ -1,7 +1,7 @@ import { RadioCard } from "@follow/components/ui/radio-group/RadioCard.js" import { RadioGroup } from "@follow/components/ui/radio-group/RadioGroup.js" import dayjs from "dayjs" -import { m } from "framer-motion" +import { m } from "motion/react" import { softSpringPreset } from "~/components/ui/constants/spring" diff --git a/apps/desktop/src/renderer/src/modules/discover/form.tsx b/apps/desktop/src/renderer/src/modules/discover/form.tsx index 159e82465..1cb82bf51 100644 --- a/apps/desktop/src/renderer/src/modules/discover/form.tsx +++ b/apps/desktop/src/renderer/src/modules/discover/form.tsx @@ -16,9 +16,9 @@ import { getBackgroundGradient } from "@follow/utils/color" import { zodResolver } from "@hookform/resolvers/zod" import { repository } from "@pkg" import { useMutation } from "@tanstack/react-query" -import { m } from "framer-motion" import { produce } from "immer" import { atom, useAtomValue, useStore } from "jotai" +import { m } from "motion/react" import type { ChangeEvent, FC } from "react" import { memo, useCallback, useState } from "react" import { useForm } from "react-hook-form" diff --git a/apps/desktop/src/renderer/src/modules/entry-column/components/DateItem.tsx b/apps/desktop/src/renderer/src/modules/entry-column/components/DateItem.tsx index 26d631528..867fcec73 100644 --- a/apps/desktop/src/renderer/src/modules/entry-column/components/DateItem.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-column/components/DateItem.tsx @@ -2,7 +2,7 @@ import { ActionButton } from "@follow/components/ui/button/index.js" import { FeedViewType } from "@follow/constants" import { stopPropagation } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" -import { m } from "framer-motion" +import { m } from "motion/react" import type { FC, PropsWithChildren } from "react" import { cloneElement, memo, useCallback, useId, useMemo, useRef, useState } from "react" import { Trans } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/entry-column/list.tsx b/apps/desktop/src/renderer/src/modules/entry-column/list.tsx index 9ac32524e..46e172e20 100644 --- a/apps/desktop/src/renderer/src/modules/entry-column/list.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-column/list.tsx @@ -6,7 +6,7 @@ import { LRUCache } from "@follow/utils/lru-cache" import { clsx } from "@follow/utils/utils" import type { Range, VirtualItem, Virtualizer } from "@tanstack/react-virtual" import { defaultRangeExtractor, useVirtualizer } from "@tanstack/react-virtual" -import type { HTMLMotionProps } from "framer-motion" +import type { HTMLMotionProps } from "motion/react" import type { FC, MutableRefObject, ReactNode } from "react" import { forwardRef, diff --git a/apps/desktop/src/renderer/src/modules/entry-content/components/EntryReadHistory.shared.tsx b/apps/desktop/src/renderer/src/modules/entry-content/components/EntryReadHistory.shared.tsx index 700ef2ab1..96115acb1 100644 --- a/apps/desktop/src/renderer/src/modules/entry-content/components/EntryReadHistory.shared.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-content/components/EntryReadHistory.shared.tsx @@ -8,7 +8,7 @@ import { import { EllipsisHorizontalTextWithTooltip } from "@follow/components/ui/typography/index.js" import { FeedViewType } from "@follow/constants" import { getNameInitials } from "@follow/utils/cjk" -import { m } from "framer-motion" +import { m } from "motion/react" import { memo } from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/entry-content/components/EntryTimelineSidebar.tsx b/apps/desktop/src/renderer/src/modules/entry-content/components/EntryTimelineSidebar.tsx index 9595f3ccb..cc3c923fd 100644 --- a/apps/desktop/src/renderer/src/modules/entry-content/components/EntryTimelineSidebar.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-content/components/EntryTimelineSidebar.tsx @@ -1,7 +1,7 @@ import { EllipsisHorizontalTextWithTooltip } from "@follow/components/ui/typography/EllipsisWithTooltip.js" import { cn } from "@follow/utils/utils" -import type { Target, TargetAndTransition } from "framer-motion" -import { m } from "framer-motion" +import type { Target, TargetAndTransition } from "motion/react" +import { m } from "motion/react" import { useIsZenMode } from "~/atoms/settings/ui" import { useAsRead } from "~/hooks/biz/useAsRead" diff --git a/apps/desktop/src/renderer/src/modules/entry-content/components/SourceContentView.tsx b/apps/desktop/src/renderer/src/modules/entry-content/components/SourceContentView.tsx index c2041b8f9..73338759e 100644 --- a/apps/desktop/src/renderer/src/modules/entry-content/components/SourceContentView.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-content/components/SourceContentView.tsx @@ -1,5 +1,5 @@ import { IN_ELECTRON } from "@follow/shared/constants" -import { AnimatePresence } from "framer-motion" +import { AnimatePresence } from "motion/react" import { useEffect, useRef, useState } from "react" import { useShowSourceContent } from "~/atoms/source-content" diff --git a/apps/desktop/src/renderer/src/modules/entry-content/header.electron.tsx b/apps/desktop/src/renderer/src/modules/entry-content/header.electron.tsx index 85b11427f..0f9f8a732 100644 --- a/apps/desktop/src/renderer/src/modules/entry-content/header.electron.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-content/header.electron.tsx @@ -1,6 +1,6 @@ import { views } from "@follow/constants" import { cn } from "@follow/utils/utils" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import { memo } from "react" import { useUISettingKey } from "~/atoms/settings/ui" diff --git a/apps/desktop/src/renderer/src/modules/entry-content/header.mobile.tsx b/apps/desktop/src/renderer/src/modules/entry-content/header.mobile.tsx index 74b99f41f..8553f61ec 100644 --- a/apps/desktop/src/renderer/src/modules/entry-content/header.mobile.tsx +++ b/apps/desktop/src/renderer/src/modules/entry-content/header.mobile.tsx @@ -3,7 +3,7 @@ import { RootPortal } from "@follow/components/ui/portal/index.js" import { findElementInShadowDOM } from "@follow/utils/dom" import { clsx, cn } from "@follow/utils/utils" import { DismissableLayer } from "@radix-ui/react-dismissable-layer" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import { memo, useEffect, useState } from "react" import { RemoveScroll } from "react-remove-scroll" import { useEventCallback } from "usehooks-ts" diff --git a/apps/desktop/src/renderer/src/modules/feed/feed-icon.tsx b/apps/desktop/src/renderer/src/modules/feed/feed-icon.tsx index d0cee7d53..6b7974009 100644 --- a/apps/desktop/src/renderer/src/modules/feed/feed-icon.tsx +++ b/apps/desktop/src/renderer/src/modules/feed/feed-icon.tsx @@ -4,7 +4,7 @@ import { getBackgroundGradient } from "@follow/utils/color" import { getImageProxyUrl } from "@follow/utils/img-proxy" import { cn, getUrlIcon } from "@follow/utils/utils" import { Avatar, AvatarFallback, AvatarImage } from "@radix-ui/react-avatar" -import { m } from "framer-motion" +import { m } from "motion/react" import type { ReactNode } from "react" import { forwardRef, useMemo } from "react" diff --git a/apps/desktop/src/renderer/src/modules/modal/shortcuts.tsx b/apps/desktop/src/renderer/src/modules/modal/shortcuts.tsx index f5717b13c..d04a6f49d 100644 --- a/apps/desktop/src/renderer/src/modules/modal/shortcuts.tsx +++ b/apps/desktop/src/renderer/src/modules/modal/shortcuts.tsx @@ -2,7 +2,7 @@ import { MotionButtonBase } from "@follow/components/ui/button/index.js" import { KbdCombined } from "@follow/components/ui/kbd/Kbd.js" import { ScrollArea } from "@follow/components/ui/scroll-area/index.js" import { clsx, cn } from "@follow/utils/utils" -import { m, useDragControls } from "framer-motion" +import { m, useDragControls } from "motion/react" import { useCallback, useEffect } from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/new-user-guide/guide-modal-content.tsx b/apps/desktop/src/renderer/src/modules/new-user-guide/guide-modal-content.tsx index 56b65de1e..551d3da79 100644 --- a/apps/desktop/src/renderer/src/modules/new-user-guide/guide-modal-content.tsx +++ b/apps/desktop/src/renderer/src/modules/new-user-guide/guide-modal-content.tsx @@ -3,7 +3,7 @@ import { Button } from "@follow/components/ui/button/index.js" import { Kbd } from "@follow/components/ui/kbd/Kbd.js" import { tracker } from "@follow/tracker" import { cn } from "@follow/utils/utils" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import type { ComponentProps, FunctionComponentElement } from "react" import { createElement, useCallback, useEffect, useMemo, useState } from "react" import { Trans, useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/panel/cmdf.tsx b/apps/desktop/src/renderer/src/modules/panel/cmdf.tsx index d03d5812c..1fe8f4745 100644 --- a/apps/desktop/src/renderer/src/modules/panel/cmdf.tsx +++ b/apps/desktop/src/renderer/src/modules/panel/cmdf.tsx @@ -6,7 +6,7 @@ import { RootPortal } from "@follow/components/ui/portal/index.jsx" import { useInputComposition, useRefValue } from "@follow/hooks" import { useSubscribeElectronEvent } from "@follow/shared/event" import { nextFrame } from "@follow/utils/dom" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import type { FC } from "react" import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react" import { useDebounceCallback, useEventCallback } from "usehooks-ts" diff --git a/apps/desktop/src/renderer/src/modules/player/corner-player.tsx b/apps/desktop/src/renderer/src/modules/player/corner-player.tsx index 60709bd80..c2addc84a 100644 --- a/apps/desktop/src/renderer/src/modules/player/corner-player.tsx +++ b/apps/desktop/src/renderer/src/modules/player/corner-player.tsx @@ -6,7 +6,7 @@ import { tracker } from "@follow/tracker" import { cn } from "@follow/utils/utils" import * as Slider from "@radix-ui/react-slider" import dayjs from "dayjs" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import { useEffect, useMemo, useState } from "react" import Marquee from "react-fast-marquee" import { useHotkeys } from "react-hotkeys-hook" diff --git a/apps/desktop/src/renderer/src/modules/profile/email-management.tsx b/apps/desktop/src/renderer/src/modules/profile/email-management.tsx index 8e87e1758..3658010df 100644 --- a/apps/desktop/src/renderer/src/modules/profile/email-management.tsx +++ b/apps/desktop/src/renderer/src/modules/profile/email-management.tsx @@ -12,7 +12,7 @@ import { Label } from "@follow/components/ui/label/index.js" import { cn } from "@follow/utils/utils" import { zodResolver } from "@hookform/resolvers/zod" import { useMutation } from "@tanstack/react-query" -import { m } from "framer-motion" +import { m } from "motion/react" import { useForm } from "react-hook-form" import { useTranslation } from "react-i18next" import { toast } from "sonner" diff --git a/apps/desktop/src/renderer/src/modules/profile/two-factor.tsx b/apps/desktop/src/renderer/src/modules/profile/two-factor.tsx index 0447b3ce3..5ac0eb152 100644 --- a/apps/desktop/src/renderer/src/modules/profile/two-factor.tsx +++ b/apps/desktop/src/renderer/src/modules/profile/two-factor.tsx @@ -11,7 +11,7 @@ import { Input, InputOTP, InputOTPGroup, InputOTPSlot } from "@follow/components import { Label } from "@follow/components/ui/label/index.js" import { zodResolver } from "@hookform/resolvers/zod" import { useMutation } from "@tanstack/react-query" -import { m, useAnimation } from "framer-motion" +import { m, useAnimation } from "motion/react" import { useState } from "react" import { useForm } from "react-hook-form" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.electron.tsx b/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.electron.tsx index 0bb3bd9f4..8ec04140d 100644 --- a/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.electron.tsx +++ b/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.electron.tsx @@ -7,9 +7,9 @@ import { nextFrame, stopPropagation } from "@follow/utils/dom" import { getStorageNS } from "@follow/utils/ns" import { clsx, cn } from "@follow/utils/utils" import { throttle } from "es-toolkit/compat" -import { useAnimationControls } from "framer-motion" import { useAtom } from "jotai" import { atomWithStorage } from "jotai/utils" +import { useAnimationControls } from "motion/react" import type { FC } from "react" import { Fragment, useEffect, useMemo, useRef, useState } from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.shared.tsx b/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.shared.tsx index fba486dc4..d43519df2 100644 --- a/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.shared.tsx +++ b/apps/desktop/src/renderer/src/modules/profile/user-profile-modal.shared.tsx @@ -7,7 +7,7 @@ import { LoadingWithIcon } from "@follow/components/ui/loading/index.jsx" import { EllipsisHorizontalTextWithTooltip } from "@follow/components/ui/typography/index.js" import type { SubscriptionModel } from "@follow/models/types" import { cn } from "@follow/utils/utils" -import { AnimatePresence } from "framer-motion" +import { AnimatePresence } from "motion/react" import type { FC } from "react" import { Fragment, memo, useState } from "react" import { useEventCallback } from "usehooks-ts" diff --git a/apps/desktop/src/renderer/src/modules/settings/modal/layout.tsx b/apps/desktop/src/renderer/src/modules/settings/modal/layout.tsx index 6051c6780..063422943 100644 --- a/apps/desktop/src/renderer/src/modules/settings/modal/layout.tsx +++ b/apps/desktop/src/renderer/src/modules/settings/modal/layout.tsx @@ -3,7 +3,7 @@ import { LetsIconsResizeDownRightLight } from "@follow/components/icons/resize.j import { IN_ELECTRON } from "@follow/shared/constants" import { preventDefault } from "@follow/utils/dom" import { cn, getOS } from "@follow/utils/utils" -import type { BoundingBox } from "framer-motion" +import type { BoundingBox } from "motion/react" import { Resizable } from "re-resizable" import type { PropsWithChildren } from "react" import { memo, Suspense, useCallback, useEffect, useRef } from "react" diff --git a/apps/desktop/src/renderer/src/modules/settings/tabs/apperance.tsx b/apps/desktop/src/renderer/src/modules/settings/tabs/apperance.tsx index c6d267c54..bc823e4ab 100644 --- a/apps/desktop/src/renderer/src/modules/settings/tabs/apperance.tsx +++ b/apps/desktop/src/renderer/src/modules/settings/tabs/apperance.tsx @@ -13,7 +13,7 @@ import { useIsDark, useThemeAtomValue } from "@follow/hooks" import { ELECTRON_BUILD, IN_ELECTRON } from "@follow/shared/constants" import { capitalizeFirstLetter, getOS } from "@follow/utils/utils" import dayjs from "dayjs" -import { useForceUpdate } from "framer-motion" +import { useForceUpdate } from "motion/react" import { lazy, Suspense, useEffect, useRef, useState } from "react" import { useTranslation } from "react-i18next" import { bundledThemesInfo } from "shiki/themes" diff --git a/apps/desktop/src/renderer/src/modules/timeline-column/FeedCategory.tsx b/apps/desktop/src/renderer/src/modules/timeline-column/FeedCategory.tsx index 79442cc13..880c031d6 100644 --- a/apps/desktop/src/renderer/src/modules/timeline-column/FeedCategory.tsx +++ b/apps/desktop/src/renderer/src/modules/timeline-column/FeedCategory.tsx @@ -9,7 +9,7 @@ import { useInputComposition, useRefValue } from "@follow/hooks" import { stopPropagation } from "@follow/utils/dom" import { cn, sortByAlphabet } from "@follow/utils/utils" import { useMutation } from "@tanstack/react-query" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import type { FC } from "react" import { Fragment, memo, useCallback, useEffect, useMemo, useRef, useState } from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/timeline-column/FeedList.shared.tsx b/apps/desktop/src/renderer/src/modules/timeline-column/FeedList.shared.tsx index 6313fed2b..0adaac6ca 100644 --- a/apps/desktop/src/renderer/src/modules/timeline-column/FeedList.shared.tsx +++ b/apps/desktop/src/renderer/src/modules/timeline-column/FeedList.shared.tsx @@ -5,7 +5,7 @@ import { stopPropagation } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" import * as HoverCard from "@radix-ui/react-hover-card" import { useQuery } from "@tanstack/react-query" -import { AnimatePresence, m } from "framer-motion" +import { AnimatePresence, m } from "motion/react" import { memo, useRef, useState } from "react" import { useTranslation } from "react-i18next" import { Link } from "react-router" diff --git a/apps/desktop/src/renderer/src/modules/timeline-column/TimelineColumnHeader.tsx b/apps/desktop/src/renderer/src/modules/timeline-column/TimelineColumnHeader.tsx index 9c934095a..afece99e5 100644 --- a/apps/desktop/src/renderer/src/modules/timeline-column/TimelineColumnHeader.tsx +++ b/apps/desktop/src/renderer/src/modules/timeline-column/TimelineColumnHeader.tsx @@ -4,7 +4,7 @@ import { ActionButton } from "@follow/components/ui/button/index.js" import { Popover, PopoverContent, PopoverTrigger } from "@follow/components/ui/popover/index.jsx" import { stopPropagation } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" -import { m } from "framer-motion" +import { m } from "motion/react" import type { FC, PropsWithChildren } from "react" import { memo, useCallback, useEffect, useRef, useState } from "react" import { useHotkeys } from "react-hotkeys-hook" diff --git a/apps/desktop/src/renderer/src/modules/timeline-column/index.tsx b/apps/desktop/src/renderer/src/modules/timeline-column/index.tsx index afa43e065..429103084 100644 --- a/apps/desktop/src/renderer/src/modules/timeline-column/index.tsx +++ b/apps/desktop/src/renderer/src/modules/timeline-column/index.tsx @@ -6,8 +6,8 @@ import { useRegisterGlobalContext } from "@follow/shared/bridge" import { ELECTRON_BUILD } from "@follow/shared/constants" import { clamp, cn } from "@follow/utils/utils" import { useWheel } from "@use-gesture/react" -import { AnimatePresence, m } from "framer-motion" import { Lethargy } from "lethargy" +import { AnimatePresence, m } from "motion/react" import type { FC, PropsWithChildren } from "react" import { memo, useCallback, useEffect, useLayoutEffect, useRef, useState } from "react" import { isHotkeyPressed, useHotkeys } from "react-hotkeys-hook" diff --git a/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.mobile.tsx b/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.mobile.tsx index 03ece9048..29ff1f755 100644 --- a/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.mobile.tsx +++ b/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.mobile.tsx @@ -1,4 +1,4 @@ -import { m } from "framer-motion" +import { m } from "motion/react" import { useCallback } from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.tsx b/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.tsx index f23af93eb..d8a63643e 100644 --- a/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.tsx +++ b/apps/desktop/src/renderer/src/modules/update-notice/UpdateNotice.tsx @@ -1,6 +1,6 @@ import { tracker } from "@follow/tracker" import { cn } from "@follow/utils/utils" -import { m, useMotionTemplate, useMotionValue } from "framer-motion" +import { m, useMotionTemplate, useMotionValue } from "motion/react" import { useCallback, useEffect } from "react" import { useTranslation } from "react-i18next" diff --git a/apps/desktop/vite.config.ts b/apps/desktop/vite.config.ts index 823022695..16c3df42d 100644 --- a/apps/desktop/vite.config.ts +++ b/apps/desktop/vite.config.ts @@ -241,7 +241,7 @@ export default ({ mode }) => { ], ["vfile", "unified"], ["es-toolkit/compat"], - ["framer-motion"], + ["motion/react"], ["clsx", "tailwind-merge", "class-variance-authority"], [ diff --git a/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx b/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx index 8e7f3f134..42b434bce 100644 --- a/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx +++ b/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx @@ -133,7 +133,7 @@ export const EntryNormalItem = memo( )} {view !== FeedViewType.Notifications && ( - + {image && (thumbnailRatio === "square" ? ( diff --git a/apps/ssr/client/components/items/picture.tsx b/apps/ssr/client/components/items/picture.tsx index e8098b2b0..d9b9c2c73 100644 --- a/apps/ssr/client/components/items/picture.tsx +++ b/apps/ssr/client/components/items/picture.tsx @@ -19,8 +19,8 @@ import { nextFrame } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" import dayjs from "dayjs" import { throttle } from "es-toolkit/compat" -import { AnimatePresence, m } from "framer-motion" import type { RenderComponentProps } from "masonic" +import { AnimatePresence, m } from "motion/react" import type { FC, PropsWithChildren } from "react" import { memo, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react" import { PhotoProvider, PhotoView } from "react-photo-view" diff --git a/apps/ssr/client/components/layout/header/index.tsx b/apps/ssr/client/components/layout/header/index.tsx index 41e0565d5..5f00b837b 100644 --- a/apps/ssr/client/components/layout/header/index.tsx +++ b/apps/ssr/client/components/layout/header/index.tsx @@ -4,8 +4,8 @@ import { Logo } from "@follow/components/icons/logo.jsx" import { Button } from "@follow/components/ui/button/index.jsx" import { Kbd } from "@follow/components/ui/kbd/Kbd.jsx" import { cn } from "@follow/utils/utils" -import type { MotionValue } from "framer-motion" -import { useMotionValueEvent, useScroll } from "framer-motion" +import type { MotionValue } from "motion/react" +import { useMotionValueEvent, useScroll } from "motion/react" import * as React from "react" import { useState } from "react" import { useHotkeys } from "react-hotkeys-hook" diff --git a/apps/ssr/package.json b/apps/ssr/package.json index 08d6c0272..31aa9ec2a 100644 --- a/apps/ssr/package.json +++ b/apps/ssr/package.json @@ -21,13 +21,13 @@ "click-to-react-component": "1.1.2", "dayjs": "1.11.13", "fastify": "5.3.0", - "framer-motion": "12.6.5", "i18next": "24.2.3", "jotai": "2.12.2", "kose-font": "1.0.0", "linkedom": "0.18.9", + "motion": "12.7.4", "ofetch": "1.4.1", - "rc-modal-sheet": "0.3.2", + "rc-modal-sheet": "1.0.0", "react-blurhash": "0.3.0", "react-google-recaptcha": "3.1.0", "react-hook-form": "7.55.0", diff --git a/packages/components/package.json b/packages/components/package.json index 098afb714..d126c51c5 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -52,13 +52,13 @@ "class-variance-authority": "0.7.1", "dayjs": "1.11.13", "foxact": "0.2.45", - "framer-motion": "12.6.5", "hast-util-to-jsx-runtime": "2.3.6", "hast-util-to-text": "4.0.2", "input-otp": "1.4.2", "jotai": "2.12.2", "katex": "0.16.22", "masonic": "4.0.1", + "motion": "12.7.4", "react-blurhash": "0.3.0", "react-fast-marquee": "1.6.5", "react-hook-form": "7.55.0", diff --git a/packages/components/src/common/MotionProvider.tsx b/packages/components/src/common/MotionProvider.tsx index 7eca3d296..898c9a31a 100644 --- a/packages/components/src/common/MotionProvider.tsx +++ b/packages/components/src/common/MotionProvider.tsx @@ -1,4 +1,4 @@ -import { LazyMotion, MotionConfig } from "framer-motion" +import { LazyMotion, MotionConfig } from "motion/react" const loadFeatures = () => import("../framer-lazy-feature").then((res) => res.default) export const MotionProvider = ({ children }: { children: React.ReactNode }) => { diff --git a/packages/components/src/framer-lazy-feature.ts b/packages/components/src/framer-lazy-feature.ts index b61a58f03..1c2a9c1d8 100644 --- a/packages/components/src/framer-lazy-feature.ts +++ b/packages/components/src/framer-lazy-feature.ts @@ -1 +1 @@ -export { domMax as default } from "framer-motion" +export { domMax as default } from "motion/react" diff --git a/packages/components/src/ui/auto-resize-height/index.tsx b/packages/components/src/ui/auto-resize-height/index.tsx index cd56382dd..bd8112009 100644 --- a/packages/components/src/ui/auto-resize-height/index.tsx +++ b/packages/components/src/ui/auto-resize-height/index.tsx @@ -1,6 +1,6 @@ import { cn } from "@follow/utils/utils" -import type { Spring } from "framer-motion" -import { m } from "framer-motion" +import type { Spring } from "motion/react" +import { m } from "motion/react" import { useEffect, useRef, useState } from "react" const softSpringPreset: Spring = { diff --git a/packages/components/src/ui/button/index.tsx b/packages/components/src/ui/button/index.tsx index d0f47c716..743ae287c 100644 --- a/packages/components/src/ui/button/index.tsx +++ b/packages/components/src/ui/button/index.tsx @@ -2,8 +2,8 @@ import { useMobile } from "@follow/components/hooks/useMobile.js" import { LoadingCircle } from "@follow/components/ui/loading/index.jsx" import { cn } from "@follow/utils/utils" import type { VariantProps } from "class-variance-authority" -import type { HTMLMotionProps } from "framer-motion" -import { m } from "framer-motion" +import type { HTMLMotionProps } from "motion/react" +import { m } from "motion/react" import * as React from "react" import { styledButtonVariant } from "./variants" diff --git a/packages/components/src/ui/feed-icon/index.tsx b/packages/components/src/ui/feed-icon/index.tsx index bc8d2c79d..ec2195cbb 100644 --- a/packages/components/src/ui/feed-icon/index.tsx +++ b/packages/components/src/ui/feed-icon/index.tsx @@ -3,7 +3,7 @@ import { getColorScheme, stringToHue } from "@follow/utils/color" import { getImageProxyUrl } from "@follow/utils/img-proxy" import { cn } from "@follow/utils/utils" import { Avatar, AvatarFallback, AvatarImage } from "@radix-ui/react-avatar" -import { m } from "framer-motion" +import { m } from "motion/react" import type { ReactNode } from "react" import { forwardRef, useMemo } from "react" diff --git a/packages/components/src/ui/input/TextArea.tsx b/packages/components/src/ui/input/TextArea.tsx index 85a383e10..e15c33dd4 100644 --- a/packages/components/src/ui/input/TextArea.tsx +++ b/packages/components/src/ui/input/TextArea.tsx @@ -2,7 +2,7 @@ import { useInputComposition } from "@follow/hooks" import { stopPropagation } from "@follow/utils/dom" import { cn } from "@follow/utils/utils" import clsx from "clsx" -import { useMotionValue } from "framer-motion" +import { useMotionValue } from "motion/react" import type { DetailedHTMLProps, PropsWithChildren, TextareaHTMLAttributes } from "react" import { forwardRef, useCallback, useState } from "react" diff --git a/packages/components/src/ui/loading/index.tsx b/packages/components/src/ui/loading/index.tsx index b13b0cd17..4cff455a6 100644 --- a/packages/components/src/ui/loading/index.tsx +++ b/packages/components/src/ui/loading/index.tsx @@ -1,5 +1,5 @@ import { cn } from "@follow/utils/utils" -import { m, useAnimation } from "framer-motion" +import { m, useAnimation } from "motion/react" import * as React from "react" import { cloneElement, useEffect } from "react" diff --git a/packages/components/src/ui/masonry/index.tsx b/packages/components/src/ui/masonry/index.tsx index e9d1e161d..91bf5ad56 100644 --- a/packages/components/src/ui/masonry/index.tsx +++ b/packages/components/src/ui/masonry/index.tsx @@ -2,9 +2,9 @@ import { clearRequestTimeout, requestTimeout } from "@essentials/request-timeout" import { useWindowSize } from "@react-hook/window-size" import { isEqual, throttle } from "es-toolkit/compat" -import { useForceUpdate } from "framer-motion" import type { ContainerPosition, MasonryProps, MasonryScrollerProps, Positioner } from "masonic" import { createResizeObserver, useMasonry, usePositioner, useScrollToIndex } from "masonic" +import { useForceUpdate } from "motion/react" import * as React from "react" import { useScrollViewElement } from "../scroll-area/hooks.js" diff --git a/packages/components/src/ui/segment/index.tsx b/packages/components/src/ui/segment/index.tsx index 309e11e0e..6e4eee232 100644 --- a/packages/components/src/ui/segment/index.tsx +++ b/packages/components/src/ui/segment/index.tsx @@ -1,5 +1,5 @@ import { cn } from "@follow/utils/utils" -import { m } from "framer-motion" +import { m } from "motion/react" import type { ReactNode } from "react" import { useId, useMemo, useState } from "react" import { useContextSelector } from "use-context-selector" diff --git a/packages/components/src/ui/tooltip/index.tsx b/packages/components/src/ui/tooltip/index.tsx index 92d3f5fb7..edb13733f 100644 --- a/packages/components/src/ui/tooltip/index.tsx +++ b/packages/components/src/ui/tooltip/index.tsx @@ -1,6 +1,6 @@ import { cn } from "@follow/utils/utils" import * as TooltipPrimitive from "@radix-ui/react-tooltip" -import { m } from "framer-motion" +import { m } from "motion/react" import * as React from "react" import { tooltipStyle } from "./styles" diff --git a/packages/utils/package.json b/packages/utils/package.json index 3f3e47b9b..cba704388 100644 --- a/packages/utils/package.json +++ b/packages/utils/package.json @@ -37,8 +37,8 @@ "chardet": "2.1.0", "clsx": "2.1.1", "dompurify": "3.2.5", - "framer-motion": "12.6.5", "linkedom": "0.18.9", + "motion": "12.7.4", "nanoid": "5.1.5", "path-to-regexp": "8.2.0", "tailwind-merge": "3.2.0", diff --git a/packages/utils/src/scroller.ts b/packages/utils/src/scroller.ts index 56735a946..3504b48f6 100644 --- a/packages/utils/src/scroller.ts +++ b/packages/utils/src/scroller.ts @@ -1,7 +1,7 @@ // @see https://github.com/Innei/sprightly/blob/2444dcdb789ca585337a4d241095640a524231db/src/lib/scroller.ts -import type { Spring } from "framer-motion" -import { animateValue } from "framer-motion" +import type { Spring } from "motion/react" +import { animateValue } from "motion/react" const spring: Spring = { type: "spring", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b90f634a5..96c37938f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -597,9 +597,6 @@ importers: foxact: specifier: 0.2.45 version: 0.2.45(react@18.3.1) - framer-motion: - specifier: 12.6.5 - version: 12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) franc-min: specifier: 6.2.0 version: 6.2.0 @@ -639,6 +636,9 @@ importers: mdast-util-to-markdown: specifier: 2.1.2 version: 2.1.2 + motion: + specifier: 12.7.4 + version: 12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) nanoid: specifier: 5.1.5 version: 5.1.5 @@ -1156,9 +1156,6 @@ importers: fastify: specifier: 5.3.0 version: 5.3.0 - framer-motion: - specifier: 12.6.5 - version: 12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) i18next: specifier: 24.2.3 version: 24.2.3(typescript@5.8.3) @@ -1171,12 +1168,15 @@ importers: linkedom: specifier: 0.18.9 version: 0.18.9 + motion: + specifier: 12.7.4 + version: 12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) ofetch: specifier: 1.4.1 version: 1.4.1 rc-modal-sheet: - specifier: 0.3.2 - version: 0.3.2(@radix-ui/react-dialog@1.1.7(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(clsx@2.1.1)(framer-motion@12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(tailwind-merge@3.2.0)(vaul@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) + specifier: 1.0.0 + version: 1.0.0(@radix-ui/react-dialog@1.1.7(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(clsx@2.1.1)(motion@12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(tailwind-merge@3.2.0)(vaul@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) react-blurhash: specifier: 0.3.0 version: 0.3.0(blurhash@2.0.5)(react@18.3.1) @@ -1400,9 +1400,6 @@ importers: foxact: specifier: 0.2.45 version: 0.2.45(react@18.3.1) - framer-motion: - specifier: 12.6.5 - version: 12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) hast-util-to-jsx-runtime: specifier: 2.3.6 version: 2.3.6 @@ -1421,6 +1418,9 @@ importers: masonic: specifier: 4.0.1 version: 4.0.1(react@18.3.1) + motion: + specifier: 12.7.4 + version: 12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-blurhash: specifier: 0.3.0 version: 0.3.0(blurhash@2.0.5)(react@18.3.1) @@ -1595,12 +1595,12 @@ importers: dompurify: specifier: 3.2.5 version: 3.2.5 - framer-motion: - specifier: 12.6.5 - version: 12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) linkedom: specifier: 0.18.9 version: 0.18.9 + motion: + specifier: 12.7.4 + version: 12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) nanoid: specifier: 5.1.5 version: 5.1.5 @@ -9816,8 +9816,8 @@ packages: fraction.js@4.3.7: resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==} - framer-motion@12.6.5: - resolution: {integrity: sha512-MKvnWov0paNjvRJuIy6x418w23tFqRfS6CXHhZrCiSEpXVlo/F+usr8v4/3G6O0u7CpsaO1qop+v4Ip7PRCBqQ==} + framer-motion@12.7.4: + resolution: {integrity: sha512-jX0bPsTmU0oPZTYz/dVyD0dmOyEOEJvdn0TaZBE5I8g2GvVnnQnW9f65cJnoVfUkY3WZWNXGXnPbVA9YnaIfVA==} peerDependencies: '@emotion/is-prop-valid': '*' react: 18.3.1 @@ -11882,11 +11882,25 @@ packages: moment@2.30.1: resolution: {integrity: sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==} - motion-dom@12.6.5: - resolution: {integrity: sha512-jpM9TQLXzYMWMJ7Ec7sAj0iis8oIuu6WvjI3yNKJLdrZyrsI/b2cRInDVL8dCl683zQQq19DpL9cSMP+k8T1NA==} + motion-dom@12.7.4: + resolution: {integrity: sha512-1ZUHAoSUMMxP6jPqyxlk9XUfb6NxMsnWPnH2YGhrOhTURLcXWbETi6eemoKb60Pe32NVJYduL4B62VQSO5Jq8Q==} - motion-utils@12.6.5: - resolution: {integrity: sha512-IsOeKsOF+FWBhxQEDFBO6ZYC8/jlidmVbbLpe9/lXSA9j9kzGIMUuIBx2SZY+0reAS0DjZZ1i7dJp4NHrjocPw==} + motion-utils@12.7.2: + resolution: {integrity: sha512-XhZwqctxyJs89oX00zn3OGCuIIpVevbTa+u82usWBC6pSHUd2AoNWiYa7Du8tJxJy9TFbZ82pcn5t7NOm1PHAw==} + + motion@12.7.4: + resolution: {integrity: sha512-MBGrMbYageHw4iZJn+pGTr7abq5n53jCxYkhFC1It3vYukQPRWg5zij46MnwYGpLR8KG465MLHSASXot9edYOw==} + peerDependencies: + '@emotion/is-prop-valid': '*' + react: 18.3.1 + react-dom: 18.3.1 + peerDependenciesMeta: + '@emotion/is-prop-valid': + optional: true + react: + optional: true + react-dom: + optional: true mri@1.2.0: resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==} @@ -13103,12 +13117,12 @@ packages: resolution: {integrity: sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g==} engines: {node: '>= 0.8'} - rc-modal-sheet@0.3.2: - resolution: {integrity: sha512-V6q4+xpeIj9VRL/44zCaXCkRLjVZ1iSYUuyiqveD24gQFy41s9GwjTrMoZ0T6Xg54I2wzuXRUITRH1hrHIjF+A==} + rc-modal-sheet@1.0.0: + resolution: {integrity: sha512-bhKDxa67CyQUvjoJQ+IBms6eyTR1XV0COE/Vbuy33RznO66EkeFGh0dtwM2pbMcVhvJscAR7G9+n2msU4EWI1A==} peerDependencies: '@radix-ui/react-dialog': ^1 clsx: '*' - framer-motion: ^11 + motion: ^12 tailwind-merge: ^2 vaul: ^0.9.0 @@ -26077,10 +26091,10 @@ snapshots: fraction.js@4.3.7: {} - framer-motion@12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + framer-motion@12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: - motion-dom: 12.6.5 - motion-utils: 12.6.5 + motion-dom: 12.7.4 + motion-utils: 12.7.2 tslib: 2.8.1 optionalDependencies: react: 18.3.1 @@ -28709,11 +28723,19 @@ snapshots: moment@2.30.1: optional: true - motion-dom@12.6.5: + motion-dom@12.7.4: dependencies: - motion-utils: 12.6.5 + motion-utils: 12.7.2 - motion-utils@12.6.5: {} + motion-utils@12.7.2: {} + + motion@12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + dependencies: + framer-motion: 12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + tslib: 2.8.1 + optionalDependencies: + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) mri@1.2.0: {} @@ -29839,11 +29861,11 @@ snapshots: iconv-lite: 0.6.3 unpipe: 1.0.0 - rc-modal-sheet@0.3.2(@radix-ui/react-dialog@1.1.7(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(clsx@2.1.1)(framer-motion@12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(tailwind-merge@3.2.0)(vaul@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)): + rc-modal-sheet@1.0.0(@radix-ui/react-dialog@1.1.7(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(clsx@2.1.1)(motion@12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(tailwind-merge@3.2.0)(vaul@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)): dependencies: '@radix-ui/react-dialog': 1.1.7(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) clsx: 2.1.1 - framer-motion: 12.6.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + motion: 12.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) tailwind-merge: 3.2.0 vaul: 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)