@momo-kits/foundation 0.160.1-beta.8 → 0.160.1-beta.9

package/Layout/FloatingButton.tsx

@@ -1,4 +1,4 @@
-import React, { useContext, useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
 import {
   LayoutChangeEvent,
   StyleSheet,
@@ -43,12 +43,12 @@ export const FloatingButton: React.FC<FloatingButtonProps> = ({
   const { theme } = useContext(ApplicationContext);
   const scaledFontSize = useScaleSize(16);
   const scaledLineHeight = useScaleSize(22);
-  const maxWidth = useRef(0);
+  const maxWidth = useSharedValue(0);
   const minWidth = size === 'small' ? 36 : 48;
   const opacityAnimated = useSharedValue(0);
   const widthAnimated = useSharedValue<number | null>(null);
-  const lastOffset = useRef(0);
-  const lastDirection = useRef<string | null>(null);
+  const lastOffset = useSharedValue(0);
+  const lastDirection = useSharedValue<string | null>(null);
   const [showText, setShowText] = useState(true);
 
   useEffect(() => {
@@ -61,11 +61,11 @@ export const FloatingButton: React.FC<FloatingButtonProps> = ({
     (value) => {
       'worklet';
       if (!label || !animatedValue) return;
-      if (value !== lastOffset.current && value > 0) {
-        const direction = value > lastOffset.current ? 'down' : 'up';
-        lastOffset.current = value;
-        if (lastDirection.current !== direction) {
-          lastDirection.current = direction;
+      if (value !== lastOffset.value && value > 0) {
+        const direction = value > lastOffset.value ? 'down' : 'up';
+        lastOffset.value = value;
+        if (lastDirection.value !== direction) {
+          lastDirection.value = direction;
           if (direction === 'down') {
             opacityAnimated.value = withTiming(0, { duration: 100 });
             widthAnimated.value = withTiming(
@@ -78,7 +78,7 @@ export const FloatingButton: React.FC<FloatingButtonProps> = ({
           } else {
             opacityAnimated.value = withTiming(1, { duration: 100 });
             widthAnimated.value = withTiming(
-              maxWidth.current,
+              maxWidth.value,
               { duration: 100 },
               (finished) => {
                 if (finished) runOnJS(setShowText)(true);
@@ -102,7 +102,7 @@ export const FloatingButton: React.FC<FloatingButtonProps> = ({
   const handleLayout = (event: LayoutChangeEvent) => {
     const layout = event.nativeEvent.layout;
     if (widthAnimated.value != null) return;
-    maxWidth.current = layout.width;
+    maxWidth.value = layout.width;
     widthAnimated.value = layout.width;
   };
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/foundation",
-    "version": "0.160.1-beta.8",
+    "version": "0.160.1-beta.9",
     "description": "React Native Component Kits",
     "main": "index.ts",
     "scripts": {},