@graphcommerce/framer-scroller 1.1.24 → 1.2.2

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.2.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/framer-scroller@1.1.25...@graphcommerce/framer-scroller@1.2.0) (2022-01-03)
+
+
+### Bug Fixes
+
+* make sure the useVelocitySnapTo resolves completely ([9d13fcb](https://github.com/ho-nl/m2-pwa/commit/9d13fcbf63ef8c0a964b9bd81accb6259a693c5c))
+
+
+### Features
+
+* **framer-next-pages:** reduce rerenders when navigating to a new page ([5cf3301](https://github.com/ho-nl/m2-pwa/commit/5cf330130bb3527057da015e3c4a6fa295d7262e))
+
+
+
+
+
 ## [1.1.24](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/framer-scroller@1.1.23...@graphcommerce/framer-scroller@1.1.24) (2021-12-23)
 
 

package/components/MotionImageAspect.tsx

@@ -72,4 +72,6 @@ const MotionImageAspect = m(
   }),
 )
 
+MotionImageAspect.displayName = 'MotionImageAspect'
+
 export default MotionImageAspect

package/components/ScrollerProvider.tsx

@@ -1,3 +1,4 @@
+import { useConstant } from '@graphcommerce/framer-utils'
 import { MotionValue, motionValue, Point, useMotionValue } from 'framer-motion'
 import { PlaybackControls } from 'popmotion'
 import React, { useEffect, useRef, useMemo, useCallback } from 'react'
@@ -312,7 +313,7 @@ export default function ScrollerProvider(props: ScrollerProviderProps) {
     return { x: 0, y: 0, [axis]: position }
   }
 
-  const value: ScrollerContext = {
+  const value = useConstant<ScrollerContext>(() => ({
     scrollerRef,
     scrollSnap,
     stop,
@@ -324,7 +325,7 @@ export default function ScrollerProvider(props: ScrollerProviderProps) {
     getSnapPosition,
     getScrollSnapPositions,
     registerChildren,
-  }
+  }))
 
   return <scrollerContext.Provider value={value} {...providerProps} />
 }

package/hooks/useVelocitySnapTo.ts

@@ -45,7 +45,7 @@ export const useVelocitySnapTo = (
       const closestX =
         direction !== 'block' ? closest(getScrollSnapPositions().x, targetX) : undefined
 
-      if (closestX !== scrollLeft) {
+      if ((closestX ?? 0) !== scrollLeft) {
         disableSnap()
         register(
           inertia({
@@ -69,7 +69,7 @@ export const useVelocitySnapTo = (
       const closestY =
         direction !== 'inline' ? closest(getScrollSnapPositions().y, targetY) : undefined
 
-      if (closestY !== scrollTop) {
+      if ((closestY ?? 0) !== scrollTop) {
         disableSnap()
         register(
           inertia({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphcommerce/framer-scroller",
-  "version": "1.1.24",
+  "version": "1.2.2",
   "sideEffects": false,
   "scripts": {
     "dev": "tsc -W"
@@ -16,15 +16,15 @@
     }
   },
   "dependencies": {
-    "@graphcommerce/framer-utils": "^2.103.20",
-    "@graphcommerce/image": "^2.105.11",
-    "@graphcommerce/next-ui": "^3.21.14",
+    "@graphcommerce/framer-utils": "^2.103.21",
+    "@graphcommerce/image": "^2.105.13",
+    "@graphcommerce/next-ui": "^3.22.2",
     "@material-ui/core": "^4.12.3",
     "popmotion": "11.0.3"
   },
   "devDependencies": {
     "@graphcommerce/browserslist-config-pwa": "^3.0.3",
-    "@graphcommerce/eslint-config-pwa": "^3.1.9",
+    "@graphcommerce/eslint-config-pwa": "^3.1.10",
     "@graphcommerce/prettier-config-pwa": "^3.0.5",
     "@graphcommerce/typescript-config-pwa": "^3.1.2",
     "@playwright/test": "^1.17.1"
@@ -36,5 +36,5 @@
     "react-dom": "^17.0.2",
     "type-fest": "^2.8.0"
   },
-  "gitHead": "ce4499b06791f3b2e54a7e88bfca40abbcd1401c"
+  "gitHead": "0553535bc06348d46a64c90e5330f8ff108c0cbc"
 }