@momo-kits/foundation 0.92.21-beta.11 → 0.92.21-beta.13

package/Application/Components.tsx

@@ -535,12 +535,22 @@ const HeaderExtendHeader: React.FC<{
   if (inputSearchProps) {
     if (headerType === 'surface') {
       return (
-        <View
-          style={{
-            backgroundColor: theme.colors.background.surface,
-            borderBottomWidth: 1,
-            borderColor: theme.colors.border.default,
-          }}>
+        <>
+          <Animated.View
+            style={[
+              styles.headerBox,
+              {
+                backgroundColor: theme.colors.background.surface,
+                borderBottomWidth: 1,
+                borderColor: theme.colors.border.default,
+                height: heightAnimated.current.interpolate({
+                  inputRange: [0, 100],
+                  outputRange: [heightHeader + 52, heightHeader],
+                  extrapolate: 'clamp',
+                }),
+              },
+            ]}
+          />
           <Animated.View
             style={{
               justifyContent: 'flex-end',
@@ -557,7 +567,7 @@ const HeaderExtendHeader: React.FC<{
               hasColorBG={true}
             />
           </Animated.View>
-        </View>
+        </>
       );
     }
 

package/Application/Navigation.ts

@@ -4,7 +4,7 @@ import {getOptions} from './utils';
 
 class Navigation {
   instance: NavigationProp<any>;
-  rightHeaderWidth?: number;
+  onHeaderRightChange?: (width: number) => void;
 
   constructor(instance: any) {
     this.instance = instance;

package/Application/utils.tsx

@@ -149,9 +149,7 @@ const getOptions = (params: NavigationOptions, navigation?: Navigation) => {
           {...props}
           {...params.headerRight}
           onLayout={(e: LayoutChangeEvent) => {
-            if (navigation) {
-              navigation.rightHeaderWidth = e.nativeEvent.layout.width;
-            }
+            navigation?.onHeaderRightChange?.(e.nativeEvent.layout.width);
           }}
         />
       );
@@ -162,9 +160,7 @@ const getOptions = (params: NavigationOptions, navigation?: Navigation) => {
           <HeaderRight
             {...props}
             onLayout={(e: LayoutChangeEvent) => {
-              if (navigation) {
-                navigation.rightHeaderWidth = e.nativeEvent.layout.width;
-              }
+              navigation?.onHeaderRightChange?.(e.nativeEvent.layout.width);
             }}>
             {params.headerRight(props)}
           </HeaderRight>

package/Assets/icon.json

@@ -4027,17 +4027,5 @@
   },
   "travel_suitcase": {
     "uri": "https://static.momocdn.net/app/img/kits/travel_suitcase.png"
-  },
-  "security_abnormal_activity": {
-    "uri": "https://static.momocdn.net/app/img/kits/security_abnormal_activity.png"
-  },
-  "security_bug": {
-    "uri": "https://static.momocdn.net/app/img/kits/security_bug.png"
-  },
-  "security_hacker": {
-    "uri": "https://static.momocdn.net/app/img/kits/security_hacker.png"
-  },
-  "security_phishing": {
-    "uri": "https://static.momocdn.net/app/img/kits/security_phishing.png"
   }
 }

package/Layout/AnimatedInputSearch.tsx

@@ -20,16 +20,9 @@ const AnimatedInputSearch: FC<AnimatedInputSearchProps> = ({
 }) => {
   const {width: screenWidth} = Dimensions.get('window');
   const widthAnimated = useRef(new Animated.Value(0));
-  const [rightSpace, setRightSpace] = useState(
-    navigation?.rightHeaderWidth ?? 0
-  );
+  const [rightSpace, setRightSpace] = useState(0);
 
   useEffect(() => {
-    setTimeout(() => {
-      if (rightSpace != navigation?.rightHeaderWidth) {
-        setRightSpace(navigation?.rightHeaderWidth ?? 0);
-      }
-    }, 500);
     const listener = animatedValue.addListener(({value}) => {
       widthAnimated.current.setValue(value);
     });
@@ -38,6 +31,9 @@ const AnimatedInputSearch: FC<AnimatedInputSearchProps> = ({
     };
   }, []);
 
+  navigation!.onHeaderRightChange = (width: number) => {
+    setRightSpace(width);
+  };
   const translateX = widthAnimated.current.interpolate({
     inputRange: [0, 100],
     outputRange: [SCREEN_PADDING, BACK_WIDTH + SCREEN_PADDING * 2],

package/package.json

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