@momo-kits/foundation 0.92.26-beta.21 → 0.92.26-beta.23

package/Application/Components.tsx

@@ -1,4 +1,5 @@
 import React, {
+  Ref,
   useCallback,
   useContext,
   useEffect,
@@ -32,7 +33,7 @@ import {PopupNotify} from '../Popup';
 import {Badge, BadgeDot} from '../Badge';
 import {HeaderType} from '../Layout/types';
 import Navigation from './Navigation';
-import {InputSearch, InputSearchProps} from '../Input';
+import {InputRef, InputSearch, InputSearchProps} from '../Input';
 
 const SCREEN_PADDING = 12;
 const BACK_WIDTH = 28;
@@ -515,12 +516,14 @@ const HeaderExtendHeader: React.FC<{
   animatedValue: Animated.Value;
   heightHeader: number;
   inputSearchProps?: InputSearchProps;
+  inputSearchRef?: Ref<InputRef>;
   navigation?: Navigation;
 }> = ({
   headerType = 'default',
   animatedValue,
   heightHeader,
   inputSearchProps,
+  inputSearchRef,
   navigation,
 }) => {
   const {theme} = useContext(ApplicationContext);
@@ -548,9 +551,11 @@ const HeaderExtendHeader: React.FC<{
     extrapolate: 'clamp',
   });
 
-  navigation!.onHeaderRightChange = (width: number) => {
-    setRightSpace(width);
-  };
+  if (navigation) {
+    navigation.onHeaderRightChange = (width: number) => {
+      setRightSpace(width);
+    };
+  }
 
   const renderInputView = (hasColorBG: boolean = false) => {
     return (
@@ -574,6 +579,7 @@ const HeaderExtendHeader: React.FC<{
           }}>
           <InputSearch
             {...inputSearchProps}
+            ref={inputSearchRef}
             hasColorBG={hasColorBG}
             showButtonText={false}
           />

package/Input/InputOTP.tsx

@@ -74,6 +74,7 @@ const InputOTP = forwardRef(
       placeholder,
       onChangeText,
       onBlur,
+      onFocus,
       dataType = 'number',
       params,
       style,
@@ -215,7 +216,7 @@ const InputOTP = forwardRef(
               value={value}
               onChangeText={_onChangeText}
               keyboardType={dataType === 'number' ? 'number-pad' : 'default'}
-              onFocus={onFocusInput}
+              onFocus={onFocus}
               onBlur={onBlurInput}
               style={{opacity: 0}}
               selectionColor={theme.colors.primary}

package/Layout/Screen.tsx

@@ -3,6 +3,7 @@ import React, {
   forwardRef,
   Fragment,
   ReactNode,
+  Ref,
   useContext,
   useEffect,
   useRef,
@@ -30,7 +31,7 @@ import {FloatingButton, FloatingButtonProps} from './FloatingButton';
 import {Card, Section, validateChildren} from './index';
 import styles from './styles';
 import {HeaderType} from './types';
-import {InputSearchProps} from '../Input';
+import {InputRef, InputSearchProps} from '../Input';
 import {HeaderExtendHeader} from '../Application/Components';
 
 export interface ScreenProps extends ViewProps {
@@ -107,6 +108,8 @@ export interface ScreenProps extends ViewProps {
    * Optional. specs for input search.
    */
   inputSearchProps?: InputSearchProps;
+
+  inputSearchRef?: Ref<InputRef>;
 }
 
 const Screen = forwardRef(
@@ -127,6 +130,7 @@ const Screen = forwardRef(
       useGridLayout = true,
       keyboardVerticalOffset,
       inputSearchProps,
+      inputSearchRef,
     }: ScreenProps,
     ref
   ) => {
@@ -289,7 +293,7 @@ const Screen = forwardRef(
       }
 
       navigation?.setOptions(options);
-    }, [headerType, animatedHeader]);
+    }, [headerType, animatedHeader, inputSearchProps]);
 
     /**
      * animated when use scroll && animated value
@@ -414,6 +418,7 @@ const Screen = forwardRef(
           animatedValue={animatedValue.current}
           inputSearchProps={inputSearchProps}
           navigation={navigation}
+          inputSearchRef={inputSearchRef}
         />
 
         <KeyboardAvoidingView

package/package.json

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