@codeleap/mobile 3.23.6 → 3.24.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codeleap/mobile",
-  "version": "3.23.6",
+  "version": "3.24.2",
   "main": "src/index.ts",
   "license": "UNLICENSED",
   "repository": {
@@ -10,7 +10,7 @@
   },
   "devDependencies": {
     "@codeleap/config": "*",
-    "@types/react-native": "link:../../apps/mobile/node_modules/@types/react-native"
+    "@codeleap/common": "*"
   },
   "scripts": {
     "build": "tsc --build",
@@ -26,7 +26,7 @@
     "@react-navigation/native-stack": "6.9.8",
     "@react-navigation/stack": "6.3.11",
     "react": "18.1.0",
-    "react-native": "0.70.6",
+    "react-native": "0.73.8",
     "react-native-calendars": "1.1293.0",
     "react-native-date-picker": "^4.2.13",
     "react-native-device-info": "10.3.0",
@@ -37,7 +37,7 @@
     "react-native-image-viewing": "0.2.2",
     "react-native-keyboard-aware-scroll-view": "0.9.5",
     "typescript": "5.0.4",
-    "react-native-avoid-softinput": "3.1.5"
+    "react-native-avoid-softinput": "^3.1.5"
   },
   "dependencies": {
     "@gorhom/portal": "1.0.14",

package/src/components/AvatarGroup/index.tsx

@@ -4,7 +4,7 @@ import {
   useNestedStylesByKey,
 } from '@codeleap/common'
 import React from 'react'
-import { StyleSheet } from 'react-native'
+import { StyleSheet, StyleProp, ViewStyle } from 'react-native'
 import { StylesOf } from '../../types'
 import { AvatarGroupComposition, AvatarGroupPresets } from './styles'
 import { View, ViewProps } from '../View'
@@ -18,11 +18,11 @@ export type AvatarGroupProps = ComponentVariants<typeof AvatarGroupPresets> & {
   avatarVariants?: AvatarProps['variants']
 }
 
-const defaultProps:Partial<AvatarGroupProps> = {
+const defaultProps: Partial<AvatarGroupProps> = {
   displacement: 20.5,
 }
 
-export const AvatarGroup = (props:AvatarGroupProps) => {
+export const AvatarGroup = (props: AvatarGroupProps) => {
   const {
     variants = [],
     avatars = [],
@@ -66,7 +66,7 @@ export const AvatarGroup = (props:AvatarGroupProps) => {
 
 AvatarGroup.defaultProps = defaultProps
 
-const getAvatarStyle = (index: number, displacementPixels: number) => {
+const getAvatarStyle = (index: number, displacementPixels: number): StyleProp<ViewStyle> => {
   const displacement = index * 20.5
   return { right: `${displacement}%` }
 }

package/src/components/View/index.tsx

@@ -10,7 +10,6 @@ import {
   TypeGuards,
 } from '@codeleap/common'
 import { View as NativeView, ViewProps as RNViewProps } from 'react-native'
-import { GetKeyboardAwarePropsOptions } from '../../utils'
 import { TransitionConfig } from '../../types'
 import Animated from 'react-native-reanimated'
 export * from './styles'
@@ -19,7 +18,7 @@ type NativeViewProps = RNViewProps
 
 export type ViewRefType = NativeView
 
-export type ViewProps ={
+export type ViewProps = {
   ref?: AnyRef<ViewRefType>
   component?: any
   animated?: boolean

package/src/utils/KeyboardAware/context.tsx

@@ -1,70 +1,27 @@
 import React from 'react'
-import { useCodeleapContext, useEffect, useState, useContext } from '@codeleap/common'
-import {
-  Keyboard,
-  Platform,
-  KeyboardEvent,
-  KeyboardEventName,
-} from 'react-native'
+import { useSoftInputState } from 'react-native-avoid-softinput'
 
-type KeyboardVisibilityEvents = {
-    show: KeyboardEventName
-    hide: KeyboardEventName
-}
 type TKeyboardCtx = {
-  event: KeyboardEvent
   isVisible: boolean
   height: number
 }
-export const KeyboardCtx = React.createContext({} as TKeyboardCtx)
 
+/**
+ *
+ * @deprecated useKeyboard does not need to be wrapped in a provider
+ */
 export const KeyboardProvider = ({ children }) => {
-  const [keyboardEvent, setKeyboardEvent] = useState<KeyboardEvent>(null)
-  const [keyboardVisible, setKeyboardVisible] = useState(false)
-
-  useEffect(() => {
-    const eventNames = Platform.select<KeyboardVisibilityEvents>({
-      ios: {
-        show: 'keyboardWillShow',
-        hide: 'keyboardWillHide',
-      },
-      android: {
-        show: 'keyboardDidShow',
-        hide: 'keyboardDidHide',
-      },
-    })
-    const events = [
-      Keyboard.addListener(eventNames.show, (e) => {
-
-        setKeyboardEvent(e)
-        setKeyboardVisible(true)
-      }),
-      Keyboard.addListener(eventNames.hide, (e) => {
-
-        setKeyboardEvent(e)
-        setKeyboardVisible(false)
-      }),
-    ]
-    return () => {
-      events.forEach(e => e.remove())
-    }
-  }, [])
 
-  const height = keyboardEvent?.endCoordinates?.height ?? 0
-
-  const _return = {
-    event: keyboardEvent,
-    isVisible: keyboardVisible,
-    height: (!!height && keyboardVisible) ? height : 0,
-    ...Keyboard,
-  }
-
-  return <KeyboardCtx.Provider value={_return}>
+  return <>
     {children}
-  </KeyboardCtx.Provider >
+  </>
 
 }
 
-export const useKeyboard = () => {
-  return useContext(KeyboardCtx)
+export const useKeyboard = (): TKeyboardCtx => {
+  const state = useSoftInputState()
+  return {
+    isVisible: state.isSoftInputShown,
+    height: state.softInputHeight,
+  }
 }

package/src/utils/KeyboardAware/keyboardHooks.ts

@@ -43,30 +43,31 @@ export const useKeyboardAwareView = (params?: UseKeyboardAwareViewParams) => {
     },
   }
 
-  if (!_options.enabled ||  (Platform.OS === 'android' && !_options.enableOnAndroid)) return {
-    keyboard,
-    style: params?.styles,
+  if (!_options.enabled || (Platform.OS === 'android' && !_options.enableOnAndroid)) {
+    return {
+      keyboard,
+      style: params?.styles,
+    }
   }
 
-
   const baseStyle = StyleSheet.flatten(params.styles || {})
 
   let baseValue = baseStyle[_options.adapt] as number
 
-  if(TypeGuards.isNil(baseValue)){
+  if (TypeGuards.isNil(baseValue)) {
     baseValue = 0
   }
-  
+
   let valid = true
   const warnOnNotNumber = () => {
     if (!TypeGuards.isNil(baseValue) && !TypeGuards.isNumber(baseValue)) {
       valid = false
       const debugStr = params?.debugName ? 'at ' + params?.debugName + ' ' : ''
-     console.log(debugStr)
+      console.log(debugStr)
     }
   }
 
-  let newStyleProp =  {
+  let newStyleProp = {
     ...baseStyle,
   }
 
@@ -98,14 +99,13 @@ export const useKeyboardAwareView = (params?: UseKeyboardAwareViewParams) => {
       break
   }
 
-  if (!valid){
+  if (!valid) {
     newStyleProp = params.styles
   }
 
-
   return {
     keyboard,
     style: newStyleProp,
-    
+
   }
 }