react-native-keyboard-controller 1.17.1 → 1.17.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -23
- package/lib/commonjs/animated.js +23 -7
- package/lib/commonjs/animated.js.map +1 -1
- package/lib/commonjs/bindings.js +19 -0
- package/lib/commonjs/bindings.js.map +1 -1
- package/lib/commonjs/components/KeyboardAvoidingView/index.js +11 -2
- package/lib/commonjs/components/KeyboardAvoidingView/index.js.map +1 -1
- package/lib/commonjs/components/KeyboardAwareScrollView/index.js +51 -36
- package/lib/commonjs/components/KeyboardAwareScrollView/index.js.map +1 -1
- package/lib/commonjs/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.js +17 -1
- package/lib/commonjs/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.js.map +1 -1
- package/lib/commonjs/components/KeyboardStickyView/index.js +13 -0
- package/lib/commonjs/components/KeyboardStickyView/index.js.map +1 -1
- package/lib/commonjs/components/KeyboardToolbar/index.js +31 -22
- package/lib/commonjs/components/KeyboardToolbar/index.js.map +1 -1
- package/lib/commonjs/context.js +16 -0
- package/lib/commonjs/context.js.map +1 -1
- package/lib/commonjs/hooks/index.js +164 -0
- package/lib/commonjs/hooks/index.js.map +1 -1
- package/lib/commonjs/hooks/useKeyboardState/index.js +21 -0
- package/lib/commonjs/hooks/useKeyboardState/index.js.map +1 -1
- package/lib/commonjs/internal.js +21 -0
- package/lib/commonjs/internal.js.map +1 -1
- package/lib/commonjs/module.js +4 -0
- package/lib/commonjs/module.js.map +1 -1
- package/lib/commonjs/monkey-patch.android.js +0 -5
- package/lib/commonjs/monkey-patch.android.js.map +1 -1
- package/lib/commonjs/{types.js → types/hooks.js} +1 -1
- package/lib/commonjs/types/hooks.js.map +1 -0
- package/lib/commonjs/types/index.js +50 -0
- package/lib/commonjs/types/index.js.map +1 -0
- package/lib/commonjs/types/internal.js +6 -0
- package/lib/commonjs/types/internal.js.map +1 -0
- package/lib/commonjs/types/module.js +6 -0
- package/lib/commonjs/types/module.js.map +1 -0
- package/lib/commonjs/types/views.js +6 -0
- package/lib/commonjs/types/views.js.map +1 -0
- package/lib/commonjs/views/OverKeyboardView/index.js +18 -4
- package/lib/commonjs/views/OverKeyboardView/index.js.map +1 -1
- package/lib/module/animated.js +23 -7
- package/lib/module/animated.js.map +1 -1
- package/lib/module/bindings.js +19 -0
- package/lib/module/bindings.js.map +1 -1
- package/lib/module/components/KeyboardAvoidingView/index.js +11 -2
- package/lib/module/components/KeyboardAvoidingView/index.js.map +1 -1
- package/lib/module/components/KeyboardAwareScrollView/index.js +51 -36
- package/lib/module/components/KeyboardAwareScrollView/index.js.map +1 -1
- package/lib/module/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.js +17 -1
- package/lib/module/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.js.map +1 -1
- package/lib/module/components/KeyboardStickyView/index.js +13 -0
- package/lib/module/components/KeyboardStickyView/index.js.map +1 -1
- package/lib/module/components/KeyboardToolbar/index.js +31 -22
- package/lib/module/components/KeyboardToolbar/index.js.map +1 -1
- package/lib/module/context.js +16 -0
- package/lib/module/context.js.map +1 -1
- package/lib/module/hooks/index.js +164 -0
- package/lib/module/hooks/index.js.map +1 -1
- package/lib/module/hooks/useKeyboardState/index.js +21 -0
- package/lib/module/hooks/useKeyboardState/index.js.map +1 -1
- package/lib/module/internal.js +21 -0
- package/lib/module/internal.js.map +1 -1
- package/lib/module/module.js +4 -0
- package/lib/module/module.js.map +1 -1
- package/lib/module/monkey-patch.android.js +0 -5
- package/lib/module/monkey-patch.android.js.map +1 -1
- package/lib/module/types/hooks.js +2 -0
- package/lib/module/types/hooks.js.map +1 -0
- package/lib/module/types/index.js +5 -0
- package/lib/module/types/index.js.map +1 -0
- package/lib/module/types/internal.js +2 -0
- package/lib/module/types/internal.js.map +1 -0
- package/lib/module/types/module.js +2 -0
- package/lib/module/types/module.js.map +1 -0
- package/lib/module/types/views.js +2 -0
- package/lib/module/types/views.js.map +1 -0
- package/lib/module/views/OverKeyboardView/index.js +18 -4
- package/lib/module/views/OverKeyboardView/index.js.map +1 -1
- package/lib/typescript/animated.d.ts +20 -6
- package/lib/typescript/bindings.d.ts +19 -0
- package/lib/typescript/components/KeyboardAvoidingView/index.d.ts +11 -2
- package/lib/typescript/components/KeyboardAwareScrollView/index.d.ts +23 -6
- package/lib/typescript/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.d.ts +17 -1
- package/lib/typescript/components/KeyboardStickyView/index.d.ts +15 -2
- package/lib/typescript/components/KeyboardToolbar/index.d.ts +13 -2
- package/lib/typescript/context.d.ts +32 -0
- package/lib/typescript/hooks/index.d.ts +157 -0
- package/lib/typescript/hooks/useKeyboardState/index.d.ts +20 -0
- package/lib/typescript/internal.d.ts +21 -0
- package/lib/typescript/module.d.ts +3 -0
- package/lib/typescript/{types.d.ts → types/hooks.d.ts} +72 -78
- package/lib/typescript/types/index.d.ts +4 -0
- package/lib/typescript/types/internal.d.ts +17 -0
- package/lib/typescript/types/module.d.ts +91 -0
- package/lib/typescript/types/views.d.ts +45 -0
- package/lib/typescript/views/OverKeyboardView/index.d.ts +14 -1
- package/package.json +2 -1
- package/src/animated.tsx +27 -12
- package/src/bindings.ts +19 -0
- package/src/components/KeyboardAvoidingView/index.tsx +11 -2
- package/src/components/KeyboardAwareScrollView/index.tsx +54 -39
- package/src/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.ts +17 -1
- package/src/components/KeyboardStickyView/index.tsx +14 -1
- package/src/components/KeyboardToolbar/index.tsx +31 -19
- package/src/context.ts +33 -0
- package/src/hooks/index.ts +157 -0
- package/src/hooks/useKeyboardState/index.ts +20 -0
- package/src/internal.ts +21 -0
- package/src/module.ts +3 -0
- package/src/monkey-patch.android.ts +3 -6
- package/src/{types.ts → types/hooks.ts} +72 -105
- package/src/types/index.ts +4 -0
- package/src/types/internal.ts +24 -0
- package/src/types/module.ts +105 -0
- package/src/types/views.ts +46 -0
- package/src/views/OverKeyboardView/index.tsx +15 -4
- package/lib/commonjs/types.js.map +0 -1
- package/lib/module/types.js +0 -2
- package/lib/module/types.js.map +0 -1
|
@@ -5,43 +5,58 @@ import { useFocusedInputHandler, useReanimatedFocusedInput, useWindowDimensions
|
|
|
5
5
|
import { findNodeHandle } from "../../utils/findNodeHandle";
|
|
6
6
|
import { useSmoothKeyboardHandler } from "./useSmoothKeyboardHandler";
|
|
7
7
|
import { debounce, scrollDistanceWithRespectToSnapPoints } from "./utils";
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
8
|
+
// Everything begins from `onStart` handler. This handler is called every time,
|
|
9
|
+
// when keyboard changes its size or when focused `TextInput` was changed. In
|
|
10
|
+
// this handler we are calculating/memoizing values which later will be used
|
|
11
|
+
// during layout movement. For that we calculate:
|
|
12
|
+
// - layout of focused field (`layout`) - to understand whether there will be overlap
|
|
13
|
+
// - initial keyboard size (`initialKeyboardSize`) - used in scroll interpolation
|
|
14
|
+
// - future keyboard height (`keyboardHeight`) - used in scroll interpolation
|
|
15
|
+
// - current scroll position (`scrollPosition`) - used to scroll from this point
|
|
16
|
+
//
|
|
17
|
+
// Once we've calculated all necessary variables - we can actually start to use them.
|
|
18
|
+
// It happens in `onMove` handler - this function simply calls `maybeScroll` with
|
|
19
|
+
// current keyboard frame height. This functions makes the smooth transition.
|
|
20
|
+
//
|
|
21
|
+
// When the transition has finished we go to `onEnd` handler. In this handler
|
|
22
|
+
// we verify, that the current field is not overlapped within a keyboard frame.
|
|
23
|
+
// For full `onStart`/`onMove`/`onEnd` flow it may look like a redundant thing,
|
|
24
|
+
// however there could be some cases, when `onMove` is not called:
|
|
25
|
+
// - on iOS when TextInput was changed - keyboard transition is instant
|
|
26
|
+
// - on Android when TextInput was changed and keyboard size wasn't changed
|
|
27
|
+
// So `onEnd` handler handle the case, when `onMove` wasn't triggered.
|
|
28
|
+
//
|
|
29
|
+
// ====================================================================================================================+
|
|
30
|
+
// -----------------------------------------------------Flow chart-----------------------------------------------------+
|
|
31
|
+
// ====================================================================================================================+
|
|
32
|
+
//
|
|
33
|
+
// +============================+ +============================+ +==================================+
|
|
34
|
+
// + User Press on TextInput + => + Keyboard starts showing + => + As keyboard moves frame by frame + =>
|
|
35
|
+
// + + + (run `onStart`) + + `onMove` is getting called +
|
|
36
|
+
// +============================+ +============================+ +==================================+
|
|
37
|
+
//
|
|
38
|
+
// +============================+ +============================+ +=====================================+
|
|
39
|
+
// + Keyboard is shown and we + => + User moved focus to + => + Only `onStart`/`onEnd` maybe called +
|
|
40
|
+
// + call `onEnd` handler + + another `TextInput` + + (without involving `onMove`) +
|
|
41
|
+
// +============================+ +============================+ +=====================================+
|
|
42
|
+
//
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* A ScrollView component that automatically handles keyboard appearance and disappearance
|
|
46
|
+
* by adjusting its content position to ensure the focused input remains visible.
|
|
39
47
|
*
|
|
40
|
-
*
|
|
41
|
-
*
|
|
42
|
-
* + call `onEnd` handler + + another `TextInput` + + (without involving `onMove`) +
|
|
43
|
-
* +============================+ +============================+ +=====================================+
|
|
48
|
+
* The component uses a sophisticated animation system to smoothly handle keyboard transitions
|
|
49
|
+
* and maintain proper scroll position during keyboard interactions.
|
|
44
50
|
*
|
|
51
|
+
* @returns A ScrollView component that handles keyboard interactions.
|
|
52
|
+
* @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-aware-scroll-view|Documentation} page for more details.
|
|
53
|
+
* @example
|
|
54
|
+
* ```tsx
|
|
55
|
+
* <KeyboardAwareScrollView bottomOffset={20}>
|
|
56
|
+
* <TextInput placeholder="Enter text" />
|
|
57
|
+
* <TextInput placeholder="Another input" />
|
|
58
|
+
* </KeyboardAwareScrollView>
|
|
59
|
+
* ```
|
|
45
60
|
*/
|
|
46
61
|
const KeyboardAwareScrollView = /*#__PURE__*/forwardRef(({
|
|
47
62
|
children,
|
|
@@ -85,7 +100,7 @@ const KeyboardAwareScrollView = /*#__PURE__*/forwardRef(({
|
|
|
85
100
|
}, [onLayout]);
|
|
86
101
|
|
|
87
102
|
/**
|
|
88
|
-
* Function that will scroll a ScrollView as keyboard gets moving
|
|
103
|
+
* Function that will scroll a ScrollView as keyboard gets moving.
|
|
89
104
|
*/
|
|
90
105
|
const maybeScroll = useCallback((e, animated = false) => {
|
|
91
106
|
"worklet";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","forwardRef","useCallback","useMemo","Reanimated","interpolate","scrollTo","useAnimatedReaction","useAnimatedRef","useAnimatedStyle","useScrollViewOffset","useSharedValue","useFocusedInputHandler","useReanimatedFocusedInput","useWindowDimensions","findNodeHandle","useSmoothKeyboardHandler","debounce","scrollDistanceWithRespectToSnapPoints","KeyboardAwareScrollView","children","onLayout","bottomOffset","disableScrollOnKeyboardHide","enabled","extraKeyboardSpace","ScrollViewComponent","ScrollView","snapToOffsets","rest","ref","scrollViewAnimatedRef","scrollViewTarget","scrollPosition","position","currentKeyboardFrameHeight","keyboardHeight","keyboardWillAppear","tag","initialKeyboardSize","scrollBeforeKeyboardMovement","input","layout","height","onRef","assignedRef","current","onScrollViewLayout","e","value","maybeScroll","animated","_layout$value","_layout$value2","_layout$value3","parentScrollViewTarget","visibleRect","absoluteY","inputHeight","point","relativeScrollTo","interpolatedScrollTo","targetScrollY","Math","max","positionOnScreen","topOfScreen","syncKeyboardFrame","keyboardFrame","scrollFromCurrentPosition","customHeight","_input$value","prevScrollPosition","prevLayout","onChangeText","_layout$value4","_input$value2","onSelectionChange","selection","start","end","y","onChangeTextHandler","onStart","keyboardWillChangeSize","keyboardWillHide","focusWasChanged","target","onMove","onEnd","previous","view","paddingBottom","createElement","_extends","scrollEventThrottle","View","style"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from \"react\";\nimport Reanimated, {\n interpolate,\n scrollTo,\n useAnimatedReaction,\n useAnimatedRef,\n useAnimatedStyle,\n useScrollViewOffset,\n useSharedValue,\n} from \"react-native-reanimated\";\n\nimport {\n useFocusedInputHandler,\n useReanimatedFocusedInput,\n useWindowDimensions,\n} from \"../../hooks\";\nimport { findNodeHandle } from \"../../utils/findNodeHandle\";\n\nimport { useSmoothKeyboardHandler } from \"./useSmoothKeyboardHandler\";\nimport { debounce, scrollDistanceWithRespectToSnapPoints } from \"./utils\";\n\nimport type {\n LayoutChangeEvent,\n ScrollView,\n ScrollViewProps,\n} from \"react-native\";\nimport type {\n FocusedInputLayoutChangedEvent,\n FocusedInputSelectionChangedEvent,\n NativeEvent,\n} from \"react-native-keyboard-controller\";\n\nexport type KeyboardAwareScrollViewProps = {\n /** The distance between keyboard and focused `TextInput` when keyboard is shown. Default is `0`. */\n bottomOffset?: number;\n /** Prevents automatic scrolling of the `ScrollView` when the keyboard gets hidden, maintaining the current screen position. Default is `false`. */\n disableScrollOnKeyboardHide?: boolean;\n /** Controls whether this `KeyboardAwareScrollView` instance should take effect. Default is `true` */\n enabled?: boolean;\n /** Adjusting the bottom spacing of KeyboardAwareScrollView. Default is `0` */\n extraKeyboardSpace?: number;\n /** Custom component for `ScrollView`. Default is `ScrollView` */\n ScrollViewComponent?: React.ComponentType<ScrollViewProps>;\n} & ScrollViewProps;\n\n/*\n * Everything begins from `onStart` handler. This handler is called every time,\n * when keyboard changes its size or when focused `TextInput` was changed. In\n * this handler we are calculating/memoizing values which later will be used\n * during layout movement. For that we calculate:\n * - layout of focused field (`layout`) - to understand whether there will be overlap\n * - initial keyboard size (`initialKeyboardSize`) - used in scroll interpolation\n * - future keyboard height (`keyboardHeight`) - used in scroll interpolation\n * - current scroll position (`scrollPosition`) - used to scroll from this point\n *\n * Once we've calculated all necessary variables - we can actually start to use them.\n * It happens in `onMove` handler - this function simply calls `maybeScroll` with\n * current keyboard frame height. This functions makes the smooth transition.\n *\n * When the transition has finished we go to `onEnd` handler. In this handler\n * we verify, that the current field is not overlapped within a keyboard frame.\n * For full `onStart`/`onMove`/`onEnd` flow it may look like a redundant thing,\n * however there could be some cases, when `onMove` is not called:\n * - on iOS when TextInput was changed - keyboard transition is instant\n * - on Android when TextInput was changed and keyboard size wasn't changed\n * So `onEnd` handler handle the case, when `onMove` wasn't triggered.\n *\n * ====================================================================================================================+\n * -----------------------------------------------------Flow chart-----------------------------------------------------+\n * ====================================================================================================================+\n *\n * +============================+ +============================+ +==================================+\n * + User Press on TextInput + => + Keyboard starts showing + => + As keyboard moves frame by frame + =>\n * + + + (run `onStart`) + + `onMove` is getting called +\n * +============================+ +============================+ +==================================+\n *\n *\n * +============================+ +============================+ +=====================================+\n * + Keyboard is shown and we + => + User moved focus to + => + Only `onStart`/`onEnd` maybe called +\n * + call `onEnd` handler + + another `TextInput` + + (without involving `onMove`) +\n * +============================+ +============================+ +=====================================+\n *\n */\nconst KeyboardAwareScrollView = forwardRef<\n ScrollView,\n React.PropsWithChildren<KeyboardAwareScrollViewProps>\n>(\n (\n {\n children,\n onLayout,\n bottomOffset = 0,\n disableScrollOnKeyboardHide = false,\n enabled = true,\n extraKeyboardSpace = 0,\n ScrollViewComponent = Reanimated.ScrollView,\n snapToOffsets,\n ...rest\n },\n ref,\n ) => {\n const scrollViewAnimatedRef = useAnimatedRef<Reanimated.ScrollView>();\n const scrollViewTarget = useSharedValue<number | null>(null);\n const scrollPosition = useSharedValue(0);\n const position = useScrollViewOffset(scrollViewAnimatedRef);\n const currentKeyboardFrameHeight = useSharedValue(0);\n const keyboardHeight = useSharedValue(0);\n const keyboardWillAppear = useSharedValue(false);\n const tag = useSharedValue(-1);\n const initialKeyboardSize = useSharedValue(0);\n const scrollBeforeKeyboardMovement = useSharedValue(0);\n const { input } = useReanimatedFocusedInput();\n const layout = useSharedValue<FocusedInputLayoutChangedEvent | null>(null);\n\n const { height } = useWindowDimensions();\n\n const onRef = useCallback((assignedRef: Reanimated.ScrollView) => {\n if (typeof ref === \"function\") {\n ref(assignedRef);\n } else if (ref) {\n ref.current = assignedRef;\n }\n\n scrollViewAnimatedRef(assignedRef);\n }, []);\n const onScrollViewLayout = useCallback(\n (e: LayoutChangeEvent) => {\n scrollViewTarget.value = findNodeHandle(scrollViewAnimatedRef.current);\n\n onLayout?.(e);\n },\n [onLayout],\n );\n\n /**\n * Function that will scroll a ScrollView as keyboard gets moving\n */\n const maybeScroll = useCallback(\n (e: number, animated: boolean = false) => {\n \"worklet\";\n\n if (!enabled) {\n return 0;\n }\n\n // input belongs to ScrollView\n if (layout.value?.parentScrollViewTarget !== scrollViewTarget.value) {\n return 0;\n }\n\n const visibleRect = height - keyboardHeight.value;\n const absoluteY = layout.value?.layout.absoluteY || 0;\n const inputHeight = layout.value?.layout.height || 0;\n const point = absoluteY + inputHeight;\n\n if (visibleRect - point <= bottomOffset) {\n const relativeScrollTo =\n keyboardHeight.value - (height - point) + bottomOffset;\n const interpolatedScrollTo = interpolate(\n e,\n [initialKeyboardSize.value, keyboardHeight.value],\n [\n 0,\n scrollDistanceWithRespectToSnapPoints(\n relativeScrollTo + scrollPosition.value,\n snapToOffsets,\n ) - scrollPosition.value,\n ],\n );\n const targetScrollY =\n Math.max(interpolatedScrollTo, 0) + scrollPosition.value;\n\n scrollTo(scrollViewAnimatedRef, 0, targetScrollY, animated);\n\n return interpolatedScrollTo;\n }\n\n if (absoluteY < 0) {\n const positionOnScreen = visibleRect - inputHeight - bottomOffset;\n const topOfScreen = scrollPosition.value + absoluteY;\n\n scrollTo(\n scrollViewAnimatedRef,\n 0,\n topOfScreen - positionOnScreen,\n animated,\n );\n }\n\n return 0;\n },\n [bottomOffset, enabled, height, snapToOffsets],\n );\n const syncKeyboardFrame = useCallback(\n (e: NativeEvent) => {\n \"worklet\";\n\n const keyboardFrame = interpolate(\n e.height,\n [0, keyboardHeight.value],\n [0, keyboardHeight.value + extraKeyboardSpace],\n );\n\n currentKeyboardFrameHeight.value = keyboardFrame;\n },\n [extraKeyboardSpace],\n );\n\n const scrollFromCurrentPosition = useCallback(\n (customHeight?: number) => {\n \"worklet\";\n\n const prevScrollPosition = scrollPosition.value;\n const prevLayout = layout.value;\n\n if (!input.value?.layout) {\n return;\n }\n\n // eslint-disable-next-line react-compiler/react-compiler\n layout.value = {\n ...input.value,\n layout: {\n ...input.value.layout,\n height: customHeight ?? input.value.layout.height,\n },\n };\n scrollPosition.value = position.value;\n maybeScroll(keyboardHeight.value, true);\n scrollPosition.value = prevScrollPosition;\n layout.value = prevLayout;\n },\n [maybeScroll],\n );\n const onChangeText = useCallback(() => {\n \"worklet\";\n\n // if typing a text caused layout shift, then we need to ignore this handler\n // because this event will be handled in `useAnimatedReaction` below\n if (layout.value?.layout.height !== input.value?.layout.height) {\n return;\n }\n\n scrollFromCurrentPosition();\n }, [scrollFromCurrentPosition]);\n const onSelectionChange = useCallback(\n (e: FocusedInputSelectionChangedEvent) => {\n \"worklet\";\n\n if (e.selection.start.position !== e.selection.end.position) {\n scrollFromCurrentPosition(e.selection.end.y);\n }\n },\n [scrollFromCurrentPosition],\n );\n\n const onChangeTextHandler = useMemo(\n () => debounce(onChangeText, 200),\n [onChangeText],\n );\n\n useFocusedInputHandler(\n {\n onChangeText: onChangeTextHandler,\n onSelectionChange: onSelectionChange,\n },\n [onChangeTextHandler, onSelectionChange],\n );\n\n useSmoothKeyboardHandler(\n {\n onStart: (e) => {\n \"worklet\";\n\n const keyboardWillChangeSize =\n keyboardHeight.value !== e.height && e.height > 0;\n\n keyboardWillAppear.value = e.height > 0 && keyboardHeight.value === 0;\n\n const keyboardWillHide = e.height === 0;\n const focusWasChanged =\n (tag.value !== e.target && e.target !== -1) ||\n keyboardWillChangeSize;\n\n if (keyboardWillChangeSize) {\n initialKeyboardSize.value = keyboardHeight.value;\n }\n\n if (keyboardWillHide) {\n // on back transition need to interpolate as [0, keyboardHeight]\n initialKeyboardSize.value = 0;\n scrollPosition.value = scrollBeforeKeyboardMovement.value;\n }\n\n if (\n keyboardWillAppear.value ||\n keyboardWillChangeSize ||\n focusWasChanged\n ) {\n // persist scroll value\n scrollPosition.value = position.value;\n // just persist height - later will be used in interpolation\n keyboardHeight.value = e.height;\n }\n\n // focus was changed\n if (focusWasChanged) {\n tag.value = e.target;\n\n // save position of focused text input when keyboard starts to move\n layout.value = input.value;\n // save current scroll position - when keyboard will hide we'll reuse\n // this value to achieve smooth hide effect\n scrollBeforeKeyboardMovement.value = position.value;\n }\n\n if (focusWasChanged && !keyboardWillAppear.value) {\n // update position on scroll value, so `onEnd` handler\n // will pick up correct values\n position.value += maybeScroll(e.height, true);\n }\n },\n onMove: (e) => {\n \"worklet\";\n\n syncKeyboardFrame(e);\n\n // if the user has set disableScrollOnKeyboardHide, only auto-scroll when the keyboard opens\n if (!disableScrollOnKeyboardHide || keyboardWillAppear.value) {\n maybeScroll(e.height);\n }\n },\n onEnd: (e) => {\n \"worklet\";\n\n keyboardHeight.value = e.height;\n scrollPosition.value = position.value;\n\n syncKeyboardFrame(e);\n },\n },\n [maybeScroll, disableScrollOnKeyboardHide, syncKeyboardFrame],\n );\n\n useAnimatedReaction(\n () => input.value,\n (current, previous) => {\n if (\n current?.target === previous?.target &&\n current?.layout.height !== previous?.layout.height\n ) {\n const prevLayout = layout.value;\n\n layout.value = input.value;\n scrollPosition.value += maybeScroll(keyboardHeight.value, true);\n layout.value = prevLayout;\n }\n },\n [],\n );\n\n const view = useAnimatedStyle(\n () =>\n enabled\n ? {\n // animations become choppy when scrolling to the end of the `ScrollView` (when the last input is focused)\n // this happens because the layout recalculates on every frame. To avoid this we slightly increase padding\n // by `+1`. In this way we assure, that `scrollTo` will never scroll to the end, because it uses interpolation\n // from 0 to `keyboardHeight`, and here our padding is `keyboardHeight + 1`. It allows us not to re-run layout\n // re-calculation on every animation frame and it helps to achieve smooth animation.\n // see: https://github.com/kirillzyusko/react-native-keyboard-controller/pull/342\n paddingBottom: currentKeyboardFrameHeight.value + 1,\n }\n : {},\n [enabled],\n );\n\n return (\n <ScrollViewComponent\n ref={onRef}\n {...rest}\n scrollEventThrottle={16}\n onLayout={onScrollViewLayout}\n >\n {children}\n {enabled && <Reanimated.View style={view} />}\n </ScrollViewComponent>\n );\n },\n);\n\nexport default KeyboardAwareScrollView;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useCallback","useMemo","Reanimated","interpolate","scrollTo","useAnimatedReaction","useAnimatedRef","useAnimatedStyle","useScrollViewOffset","useSharedValue","useFocusedInputHandler","useReanimatedFocusedInput","useWindowDimensions","findNodeHandle","useSmoothKeyboardHandler","debounce","scrollDistanceWithRespectToSnapPoints","KeyboardAwareScrollView","children","onLayout","bottomOffset","disableScrollOnKeyboardHide","enabled","extraKeyboardSpace","ScrollViewComponent","ScrollView","snapToOffsets","rest","ref","scrollViewAnimatedRef","scrollViewTarget","scrollPosition","position","currentKeyboardFrameHeight","keyboardHeight","keyboardWillAppear","tag","initialKeyboardSize","scrollBeforeKeyboardMovement","input","layout","height","onRef","assignedRef","current","onScrollViewLayout","e","value","maybeScroll","animated","_layout$value","_layout$value2","_layout$value3","parentScrollViewTarget","visibleRect","absoluteY","inputHeight","point","relativeScrollTo","interpolatedScrollTo","targetScrollY","Math","max","positionOnScreen","topOfScreen","syncKeyboardFrame","keyboardFrame","scrollFromCurrentPosition","customHeight","_input$value","prevScrollPosition","prevLayout","onChangeText","_layout$value4","_input$value2","onSelectionChange","selection","start","end","y","onChangeTextHandler","onStart","keyboardWillChangeSize","keyboardWillHide","focusWasChanged","target","onMove","onEnd","previous","view","paddingBottom","createElement","_extends","scrollEventThrottle","View","style"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from \"react\";\nimport Reanimated, {\n interpolate,\n scrollTo,\n useAnimatedReaction,\n useAnimatedRef,\n useAnimatedStyle,\n useScrollViewOffset,\n useSharedValue,\n} from \"react-native-reanimated\";\n\nimport {\n useFocusedInputHandler,\n useReanimatedFocusedInput,\n useWindowDimensions,\n} from \"../../hooks\";\nimport { findNodeHandle } from \"../../utils/findNodeHandle\";\n\nimport { useSmoothKeyboardHandler } from \"./useSmoothKeyboardHandler\";\nimport { debounce, scrollDistanceWithRespectToSnapPoints } from \"./utils\";\n\nimport type {\n LayoutChangeEvent,\n ScrollView,\n ScrollViewProps,\n} from \"react-native\";\nimport type {\n FocusedInputLayoutChangedEvent,\n FocusedInputSelectionChangedEvent,\n NativeEvent,\n} from \"react-native-keyboard-controller\";\n\nexport type KeyboardAwareScrollViewProps = {\n /** The distance between keyboard and focused `TextInput` when keyboard is shown. Default is `0`. */\n bottomOffset?: number;\n /** Prevents automatic scrolling of the `ScrollView` when the keyboard gets hidden, maintaining the current screen position. Default is `false`. */\n disableScrollOnKeyboardHide?: boolean;\n /** Controls whether this `KeyboardAwareScrollView` instance should take effect. Default is `true`. */\n enabled?: boolean;\n /** Adjusting the bottom spacing of KeyboardAwareScrollView. Default is `0`. */\n extraKeyboardSpace?: number;\n /** Custom component for `ScrollView`. Default is `ScrollView`. */\n ScrollViewComponent?: React.ComponentType<ScrollViewProps>;\n} & ScrollViewProps;\n\n// Everything begins from `onStart` handler. This handler is called every time,\n// when keyboard changes its size or when focused `TextInput` was changed. In\n// this handler we are calculating/memoizing values which later will be used\n// during layout movement. For that we calculate:\n// - layout of focused field (`layout`) - to understand whether there will be overlap\n// - initial keyboard size (`initialKeyboardSize`) - used in scroll interpolation\n// - future keyboard height (`keyboardHeight`) - used in scroll interpolation\n// - current scroll position (`scrollPosition`) - used to scroll from this point\n//\n// Once we've calculated all necessary variables - we can actually start to use them.\n// It happens in `onMove` handler - this function simply calls `maybeScroll` with\n// current keyboard frame height. This functions makes the smooth transition.\n//\n// When the transition has finished we go to `onEnd` handler. In this handler\n// we verify, that the current field is not overlapped within a keyboard frame.\n// For full `onStart`/`onMove`/`onEnd` flow it may look like a redundant thing,\n// however there could be some cases, when `onMove` is not called:\n// - on iOS when TextInput was changed - keyboard transition is instant\n// - on Android when TextInput was changed and keyboard size wasn't changed\n// So `onEnd` handler handle the case, when `onMove` wasn't triggered.\n//\n// ====================================================================================================================+\n// -----------------------------------------------------Flow chart-----------------------------------------------------+\n// ====================================================================================================================+\n//\n// +============================+ +============================+ +==================================+\n// + User Press on TextInput + => + Keyboard starts showing + => + As keyboard moves frame by frame + =>\n// + + + (run `onStart`) + + `onMove` is getting called +\n// +============================+ +============================+ +==================================+\n//\n// +============================+ +============================+ +=====================================+\n// + Keyboard is shown and we + => + User moved focus to + => + Only `onStart`/`onEnd` maybe called +\n// + call `onEnd` handler + + another `TextInput` + + (without involving `onMove`) +\n// +============================+ +============================+ +=====================================+\n//\n\n/**\n * A ScrollView component that automatically handles keyboard appearance and disappearance\n * by adjusting its content position to ensure the focused input remains visible.\n *\n * The component uses a sophisticated animation system to smoothly handle keyboard transitions\n * and maintain proper scroll position during keyboard interactions.\n *\n * @returns A ScrollView component that handles keyboard interactions.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-aware-scroll-view|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardAwareScrollView bottomOffset={20}>\n * <TextInput placeholder=\"Enter text\" />\n * <TextInput placeholder=\"Another input\" />\n * </KeyboardAwareScrollView>\n * ```\n */\nconst KeyboardAwareScrollView = forwardRef<\n ScrollView,\n React.PropsWithChildren<KeyboardAwareScrollViewProps>\n>(\n (\n {\n children,\n onLayout,\n bottomOffset = 0,\n disableScrollOnKeyboardHide = false,\n enabled = true,\n extraKeyboardSpace = 0,\n ScrollViewComponent = Reanimated.ScrollView,\n snapToOffsets,\n ...rest\n },\n ref,\n ) => {\n const scrollViewAnimatedRef = useAnimatedRef<Reanimated.ScrollView>();\n const scrollViewTarget = useSharedValue<number | null>(null);\n const scrollPosition = useSharedValue(0);\n const position = useScrollViewOffset(scrollViewAnimatedRef);\n const currentKeyboardFrameHeight = useSharedValue(0);\n const keyboardHeight = useSharedValue(0);\n const keyboardWillAppear = useSharedValue(false);\n const tag = useSharedValue(-1);\n const initialKeyboardSize = useSharedValue(0);\n const scrollBeforeKeyboardMovement = useSharedValue(0);\n const { input } = useReanimatedFocusedInput();\n const layout = useSharedValue<FocusedInputLayoutChangedEvent | null>(null);\n\n const { height } = useWindowDimensions();\n\n const onRef = useCallback((assignedRef: Reanimated.ScrollView) => {\n if (typeof ref === \"function\") {\n ref(assignedRef);\n } else if (ref) {\n ref.current = assignedRef;\n }\n\n scrollViewAnimatedRef(assignedRef);\n }, []);\n const onScrollViewLayout = useCallback(\n (e: LayoutChangeEvent) => {\n scrollViewTarget.value = findNodeHandle(scrollViewAnimatedRef.current);\n\n onLayout?.(e);\n },\n [onLayout],\n );\n\n /**\n * Function that will scroll a ScrollView as keyboard gets moving.\n */\n const maybeScroll = useCallback(\n (e: number, animated: boolean = false) => {\n \"worklet\";\n\n if (!enabled) {\n return 0;\n }\n\n // input belongs to ScrollView\n if (layout.value?.parentScrollViewTarget !== scrollViewTarget.value) {\n return 0;\n }\n\n const visibleRect = height - keyboardHeight.value;\n const absoluteY = layout.value?.layout.absoluteY || 0;\n const inputHeight = layout.value?.layout.height || 0;\n const point = absoluteY + inputHeight;\n\n if (visibleRect - point <= bottomOffset) {\n const relativeScrollTo =\n keyboardHeight.value - (height - point) + bottomOffset;\n const interpolatedScrollTo = interpolate(\n e,\n [initialKeyboardSize.value, keyboardHeight.value],\n [\n 0,\n scrollDistanceWithRespectToSnapPoints(\n relativeScrollTo + scrollPosition.value,\n snapToOffsets,\n ) - scrollPosition.value,\n ],\n );\n const targetScrollY =\n Math.max(interpolatedScrollTo, 0) + scrollPosition.value;\n\n scrollTo(scrollViewAnimatedRef, 0, targetScrollY, animated);\n\n return interpolatedScrollTo;\n }\n\n if (absoluteY < 0) {\n const positionOnScreen = visibleRect - inputHeight - bottomOffset;\n const topOfScreen = scrollPosition.value + absoluteY;\n\n scrollTo(\n scrollViewAnimatedRef,\n 0,\n topOfScreen - positionOnScreen,\n animated,\n );\n }\n\n return 0;\n },\n [bottomOffset, enabled, height, snapToOffsets],\n );\n const syncKeyboardFrame = useCallback(\n (e: NativeEvent) => {\n \"worklet\";\n\n const keyboardFrame = interpolate(\n e.height,\n [0, keyboardHeight.value],\n [0, keyboardHeight.value + extraKeyboardSpace],\n );\n\n currentKeyboardFrameHeight.value = keyboardFrame;\n },\n [extraKeyboardSpace],\n );\n\n const scrollFromCurrentPosition = useCallback(\n (customHeight?: number) => {\n \"worklet\";\n\n const prevScrollPosition = scrollPosition.value;\n const prevLayout = layout.value;\n\n if (!input.value?.layout) {\n return;\n }\n\n // eslint-disable-next-line react-compiler/react-compiler\n layout.value = {\n ...input.value,\n layout: {\n ...input.value.layout,\n height: customHeight ?? input.value.layout.height,\n },\n };\n scrollPosition.value = position.value;\n maybeScroll(keyboardHeight.value, true);\n scrollPosition.value = prevScrollPosition;\n layout.value = prevLayout;\n },\n [maybeScroll],\n );\n const onChangeText = useCallback(() => {\n \"worklet\";\n\n // if typing a text caused layout shift, then we need to ignore this handler\n // because this event will be handled in `useAnimatedReaction` below\n if (layout.value?.layout.height !== input.value?.layout.height) {\n return;\n }\n\n scrollFromCurrentPosition();\n }, [scrollFromCurrentPosition]);\n const onSelectionChange = useCallback(\n (e: FocusedInputSelectionChangedEvent) => {\n \"worklet\";\n\n if (e.selection.start.position !== e.selection.end.position) {\n scrollFromCurrentPosition(e.selection.end.y);\n }\n },\n [scrollFromCurrentPosition],\n );\n\n const onChangeTextHandler = useMemo(\n () => debounce(onChangeText, 200),\n [onChangeText],\n );\n\n useFocusedInputHandler(\n {\n onChangeText: onChangeTextHandler,\n onSelectionChange: onSelectionChange,\n },\n [onChangeTextHandler, onSelectionChange],\n );\n\n useSmoothKeyboardHandler(\n {\n onStart: (e) => {\n \"worklet\";\n\n const keyboardWillChangeSize =\n keyboardHeight.value !== e.height && e.height > 0;\n\n keyboardWillAppear.value = e.height > 0 && keyboardHeight.value === 0;\n\n const keyboardWillHide = e.height === 0;\n const focusWasChanged =\n (tag.value !== e.target && e.target !== -1) ||\n keyboardWillChangeSize;\n\n if (keyboardWillChangeSize) {\n initialKeyboardSize.value = keyboardHeight.value;\n }\n\n if (keyboardWillHide) {\n // on back transition need to interpolate as [0, keyboardHeight]\n initialKeyboardSize.value = 0;\n scrollPosition.value = scrollBeforeKeyboardMovement.value;\n }\n\n if (\n keyboardWillAppear.value ||\n keyboardWillChangeSize ||\n focusWasChanged\n ) {\n // persist scroll value\n scrollPosition.value = position.value;\n // just persist height - later will be used in interpolation\n keyboardHeight.value = e.height;\n }\n\n // focus was changed\n if (focusWasChanged) {\n tag.value = e.target;\n\n // save position of focused text input when keyboard starts to move\n layout.value = input.value;\n // save current scroll position - when keyboard will hide we'll reuse\n // this value to achieve smooth hide effect\n scrollBeforeKeyboardMovement.value = position.value;\n }\n\n if (focusWasChanged && !keyboardWillAppear.value) {\n // update position on scroll value, so `onEnd` handler\n // will pick up correct values\n position.value += maybeScroll(e.height, true);\n }\n },\n onMove: (e) => {\n \"worklet\";\n\n syncKeyboardFrame(e);\n\n // if the user has set disableScrollOnKeyboardHide, only auto-scroll when the keyboard opens\n if (!disableScrollOnKeyboardHide || keyboardWillAppear.value) {\n maybeScroll(e.height);\n }\n },\n onEnd: (e) => {\n \"worklet\";\n\n keyboardHeight.value = e.height;\n scrollPosition.value = position.value;\n\n syncKeyboardFrame(e);\n },\n },\n [maybeScroll, disableScrollOnKeyboardHide, syncKeyboardFrame],\n );\n\n useAnimatedReaction(\n () => input.value,\n (current, previous) => {\n if (\n current?.target === previous?.target &&\n current?.layout.height !== previous?.layout.height\n ) {\n const prevLayout = layout.value;\n\n layout.value = input.value;\n scrollPosition.value += maybeScroll(keyboardHeight.value, true);\n layout.value = prevLayout;\n }\n },\n [],\n );\n\n const view = useAnimatedStyle(\n () =>\n enabled\n ? {\n // animations become choppy when scrolling to the end of the `ScrollView` (when the last input is focused)\n // this happens because the layout recalculates on every frame. To avoid this we slightly increase padding\n // by `+1`. In this way we assure, that `scrollTo` will never scroll to the end, because it uses interpolation\n // from 0 to `keyboardHeight`, and here our padding is `keyboardHeight + 1`. It allows us not to re-run layout\n // re-calculation on every animation frame and it helps to achieve smooth animation.\n // see: https://github.com/kirillzyusko/react-native-keyboard-controller/pull/342\n paddingBottom: currentKeyboardFrameHeight.value + 1,\n }\n : {},\n [enabled],\n );\n\n return (\n <ScrollViewComponent\n ref={onRef}\n {...rest}\n scrollEventThrottle={16}\n onLayout={onScrollViewLayout}\n >\n {children}\n {enabled && <Reanimated.View style={view} />}\n </ScrollViewComponent>\n );\n },\n);\n\nexport default KeyboardAwareScrollView;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -14,7 +14,23 @@ const TELEGRAM_ANDROID_TIMING_CONFIG = {
|
|
|
14
14
|
|
|
15
15
|
/**
|
|
16
16
|
* Hook that uses default transitions for iOS and Android > 11, and uses
|
|
17
|
-
* custom interpolation on Android < 11 to achieve more smooth animation
|
|
17
|
+
* custom interpolation on Android < 11 to achieve more smooth animation.
|
|
18
|
+
*
|
|
19
|
+
* @param handler - Object containing keyboard event handlers.
|
|
20
|
+
* @param [deps] - Dependencies array for the effect.
|
|
21
|
+
* @example
|
|
22
|
+
* ```ts
|
|
23
|
+
* useSmoothKeyboardHandler(
|
|
24
|
+
* {
|
|
25
|
+
* onStart: (e) => {
|
|
26
|
+
* "worklet";
|
|
27
|
+
*
|
|
28
|
+
* // your handler for keyboard start
|
|
29
|
+
* },
|
|
30
|
+
* },
|
|
31
|
+
* [],
|
|
32
|
+
* );
|
|
33
|
+
* ```
|
|
18
34
|
*/
|
|
19
35
|
export const useSmoothKeyboardHandler = (handler, deps) => {
|
|
20
36
|
const target = useSharedValue(-1);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Platform","Easing","useAnimatedReaction","useSharedValue","withTiming","useKeyboardHandler","IS_ANDROID_ELEVEN_OR_HIGHER","OS","Version","IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS","TELEGRAM_ANDROID_TIMING_CONFIG","duration","easing","bezier","useSmoothKeyboardHandler","handler","deps","target","height","persistedHeight","animatedKeyboardHeight","value","event","progress","evt","_handler$onMove","onMove","call","_handler$onEnd","onEnd","onStart","e","_handler$onStart2","_handler$onStart","_handler$onEnd2","_handler$onMove2","_handler$onEnd3"],"sources":["useSmoothKeyboardHandler.ts"],"sourcesContent":["import { Platform } from \"react-native\";\nimport {\n Easing,\n useAnimatedReaction,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\n\nimport { useKeyboardHandler } from \"../../hooks\";\n\nconst IS_ANDROID_ELEVEN_OR_HIGHER =\n Platform.OS === \"android\" && Platform.Version >= 30;\n// on these platforms keyboard transitions will be smooth\nconst IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS =\n IS_ANDROID_ELEVEN_OR_HIGHER || Platform.OS === \"ios\";\n// on Android Telegram is not using androidx.core values and uses custom interpolation\n// duration is taken from here: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/org/telegram/ui/ActionBar/AdjustPanLayoutHelper.java#L39\n// and bezier is taken from: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/androidx/recyclerview/widget/ChatListItemAnimator.java#L40\nconst TELEGRAM_ANDROID_TIMING_CONFIG = {\n duration: 250,\n easing: Easing.bezier(\n 0.19919472913616398,\n 0.010644531250000006,\n 0.27920937042459737,\n 0.91025390625,\n ),\n};\n\n/**\n * Hook that uses default transitions for iOS and Android > 11, and uses\n * custom interpolation on Android < 11 to achieve more smooth animation\n */\nexport const useSmoothKeyboardHandler: typeof useKeyboardHandler = (\n handler,\n deps,\n) => {\n const target = useSharedValue(-1);\n const height = useSharedValue(0);\n const persistedHeight = useSharedValue(0);\n const animatedKeyboardHeight = useSharedValue(0);\n\n useAnimatedReaction(\n () => {\n if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n return;\n }\n if (persistedHeight.value === 0) {\n return;\n }\n const event = {\n // it'll be always `TELEGRAM_ANDROID_TIMING_CONFIG.duration`, since we're running animation via `withTiming`\n duration: TELEGRAM_ANDROID_TIMING_CONFIG.duration,\n target: target.value,\n height: animatedKeyboardHeight.value,\n progress: animatedKeyboardHeight.value / persistedHeight.value,\n };\n\n return event;\n },\n (evt) => {\n if (!evt) {\n return;\n }\n handler.onMove?.(evt);\n\n // dispatch `onEnd`\n if (evt.height === height.value) {\n handler.onEnd?.(evt);\n // eslint-disable-next-line react-compiler/react-compiler\n persistedHeight.value = height.value;\n }\n },\n // REA uses own version of `DependencyList` and it's not compatible with the same type from React\n deps as unknown[],\n );\n\n useKeyboardHandler(\n {\n onStart: (e) => {\n \"worklet\";\n\n // immediately dispatch onStart/onEnd events if onStart dispatched with the same height\n // and don't wait for animation 250ms\n if (\n !IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS &&\n e.height === persistedHeight.value\n ) {\n handler.onStart?.(e);\n handler.onEnd?.(e);\n\n return;\n }\n\n target.value = e.target;\n height.value = e.height;\n\n if (e.height > 0) {\n persistedHeight.value = e.height;\n }\n // if we are running on Android < 9, then we are using custom interpolation\n // to achieve smoother animation and use `animatedKeyboardHeight` as animation\n // driver\n if (!IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n animatedKeyboardHeight.value = withTiming(\n e.height,\n TELEGRAM_ANDROID_TIMING_CONFIG,\n );\n }\n\n handler.onStart?.({\n ...e,\n duration: IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS\n ? e.duration\n : TELEGRAM_ANDROID_TIMING_CONFIG.duration,\n });\n },\n onMove: (e) => {\n \"worklet\";\n\n if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n handler.onMove?.(e);\n }\n },\n onEnd: (e) => {\n \"worklet\";\n\n if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n handler.onEnd?.(e);\n }\n },\n },\n deps,\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["Platform","Easing","useAnimatedReaction","useSharedValue","withTiming","useKeyboardHandler","IS_ANDROID_ELEVEN_OR_HIGHER","OS","Version","IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS","TELEGRAM_ANDROID_TIMING_CONFIG","duration","easing","bezier","useSmoothKeyboardHandler","handler","deps","target","height","persistedHeight","animatedKeyboardHeight","value","event","progress","evt","_handler$onMove","onMove","call","_handler$onEnd","onEnd","onStart","e","_handler$onStart2","_handler$onStart","_handler$onEnd2","_handler$onMove2","_handler$onEnd3"],"sources":["useSmoothKeyboardHandler.ts"],"sourcesContent":["import { Platform } from \"react-native\";\nimport {\n Easing,\n useAnimatedReaction,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\n\nimport { useKeyboardHandler } from \"../../hooks\";\n\nconst IS_ANDROID_ELEVEN_OR_HIGHER =\n Platform.OS === \"android\" && Platform.Version >= 30;\n// on these platforms keyboard transitions will be smooth\nconst IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS =\n IS_ANDROID_ELEVEN_OR_HIGHER || Platform.OS === \"ios\";\n// on Android Telegram is not using androidx.core values and uses custom interpolation\n// duration is taken from here: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/org/telegram/ui/ActionBar/AdjustPanLayoutHelper.java#L39\n// and bezier is taken from: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/androidx/recyclerview/widget/ChatListItemAnimator.java#L40\nconst TELEGRAM_ANDROID_TIMING_CONFIG = {\n duration: 250,\n easing: Easing.bezier(\n 0.19919472913616398,\n 0.010644531250000006,\n 0.27920937042459737,\n 0.91025390625,\n ),\n};\n\n/**\n * Hook that uses default transitions for iOS and Android > 11, and uses\n * custom interpolation on Android < 11 to achieve more smooth animation.\n *\n * @param handler - Object containing keyboard event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @example\n * ```ts\n * useSmoothKeyboardHandler(\n * {\n * onStart: (e) => {\n * \"worklet\";\n *\n * // your handler for keyboard start\n * },\n * },\n * [],\n * );\n * ```\n */\nexport const useSmoothKeyboardHandler: typeof useKeyboardHandler = (\n handler,\n deps,\n) => {\n const target = useSharedValue(-1);\n const height = useSharedValue(0);\n const persistedHeight = useSharedValue(0);\n const animatedKeyboardHeight = useSharedValue(0);\n\n useAnimatedReaction(\n () => {\n if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n return;\n }\n if (persistedHeight.value === 0) {\n return;\n }\n const event = {\n // it'll be always `TELEGRAM_ANDROID_TIMING_CONFIG.duration`, since we're running animation via `withTiming`\n duration: TELEGRAM_ANDROID_TIMING_CONFIG.duration,\n target: target.value,\n height: animatedKeyboardHeight.value,\n progress: animatedKeyboardHeight.value / persistedHeight.value,\n };\n\n return event;\n },\n (evt) => {\n if (!evt) {\n return;\n }\n handler.onMove?.(evt);\n\n // dispatch `onEnd`\n if (evt.height === height.value) {\n handler.onEnd?.(evt);\n // eslint-disable-next-line react-compiler/react-compiler\n persistedHeight.value = height.value;\n }\n },\n // REA uses own version of `DependencyList` and it's not compatible with the same type from React\n deps as unknown[],\n );\n\n useKeyboardHandler(\n {\n onStart: (e) => {\n \"worklet\";\n\n // immediately dispatch onStart/onEnd events if onStart dispatched with the same height\n // and don't wait for animation 250ms\n if (\n !IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS &&\n e.height === persistedHeight.value\n ) {\n handler.onStart?.(e);\n handler.onEnd?.(e);\n\n return;\n }\n\n target.value = e.target;\n height.value = e.height;\n\n if (e.height > 0) {\n persistedHeight.value = e.height;\n }\n // if we are running on Android < 9, then we are using custom interpolation\n // to achieve smoother animation and use `animatedKeyboardHeight` as animation\n // driver\n if (!IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n animatedKeyboardHeight.value = withTiming(\n e.height,\n TELEGRAM_ANDROID_TIMING_CONFIG,\n );\n }\n\n handler.onStart?.({\n ...e,\n duration: IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS\n ? e.duration\n : TELEGRAM_ANDROID_TIMING_CONFIG.duration,\n });\n },\n onMove: (e) => {\n \"worklet\";\n\n if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n handler.onMove?.(e);\n }\n },\n onEnd: (e) => {\n \"worklet\";\n\n if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n handler.onEnd?.(e);\n }\n },\n },\n deps,\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,6 +2,19 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
|
|
|
2
2
|
import React, { forwardRef, useMemo } from "react";
|
|
3
3
|
import { Animated } from "react-native";
|
|
4
4
|
import { useKeyboardAnimation } from "../../hooks";
|
|
5
|
+
/**
|
|
6
|
+
* A View component that sticks to the keyboard and moves with it when it appears or disappears.
|
|
7
|
+
* The view can be configured with custom offsets for both closed and open keyboard states.
|
|
8
|
+
*
|
|
9
|
+
* @returns An animated View component that sticks to the keyboard.
|
|
10
|
+
* @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-sticky-view|Documentation} page for more details.
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* <KeyboardStickyView offset={{ closed: 0, opened: 20 }}>
|
|
14
|
+
* <Button title="Submit" />
|
|
15
|
+
* </KeyboardStickyView>
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
5
18
|
const KeyboardStickyView = /*#__PURE__*/forwardRef(({
|
|
6
19
|
children,
|
|
7
20
|
offset: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","forwardRef","useMemo","Animated","useKeyboardAnimation","KeyboardStickyView","children","offset","closed","opened","style","enabled","props","ref","height","progress","interpolate","inputRange","outputRange","styles","transform","translateY","add","createElement","View","_extends"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport { Animated } from \"react-native\";\n\nimport { useKeyboardAnimation } from \"../../hooks\";\n\nimport type { View, ViewProps } from \"react-native\";\n\nexport type KeyboardStickyViewProps = {\n /**\n * Specify additional offset to the view for given keyboard state.\n */\n offset?: {\n /**\n * Adds additional `translateY` when keyboard is close. By default `0`.\n */\n closed?: number;\n /**\n * Adds additional `translateY` when keyboard is open. By default `0`.\n */\n opened?: number;\n };\n\n /** Controls whether this `KeyboardStickyView` instance should take effect. Default is `true
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useMemo","Animated","useKeyboardAnimation","KeyboardStickyView","children","offset","closed","opened","style","enabled","props","ref","height","progress","interpolate","inputRange","outputRange","styles","transform","translateY","add","createElement","View","_extends"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport { Animated } from \"react-native\";\n\nimport { useKeyboardAnimation } from \"../../hooks\";\n\nimport type { View, ViewProps } from \"react-native\";\n\nexport type KeyboardStickyViewProps = {\n /**\n * Specify additional offset to the view for given keyboard state.\n */\n offset?: {\n /**\n * Adds additional `translateY` when keyboard is close. By default `0`.\n */\n closed?: number;\n /**\n * Adds additional `translateY` when keyboard is open. By default `0`.\n */\n opened?: number;\n };\n\n /** Controls whether this `KeyboardStickyView` instance should take effect. Default is `true`. */\n enabled?: boolean;\n} & ViewProps;\n\n/**\n * A View component that sticks to the keyboard and moves with it when it appears or disappears.\n * The view can be configured with custom offsets for both closed and open keyboard states.\n *\n * @returns An animated View component that sticks to the keyboard.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-sticky-view|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardStickyView offset={{ closed: 0, opened: 20 }}>\n * <Button title=\"Submit\" />\n * </KeyboardStickyView>\n * ```\n */\nconst KeyboardStickyView = forwardRef<\n View,\n React.PropsWithChildren<KeyboardStickyViewProps>\n>(\n (\n {\n children,\n offset: { closed = 0, opened = 0 } = {},\n style,\n enabled = true,\n ...props\n },\n ref,\n ) => {\n const { height, progress } = useKeyboardAnimation();\n\n const offset = progress.interpolate({\n inputRange: [0, 1],\n outputRange: [closed, opened],\n });\n\n const styles = useMemo(\n () => [\n {\n transform: [\n { translateY: enabled ? Animated.add(height, offset) : closed },\n ],\n },\n style,\n ],\n [closed, enabled, height, offset, style],\n );\n\n return (\n <Animated.View ref={ref} style={styles} {...props}>\n {children}\n </Animated.View>\n );\n },\n);\n\nexport default KeyboardStickyView;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAClD,SAASC,QAAQ,QAAQ,cAAc;AAEvC,SAASC,oBAAoB,QAAQ,aAAa;AAuBlD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,kBAAkB,gBAAGJ,UAAU,CAInC,CACE;EACEK,QAAQ;EACRC,MAAM,EAAE;IAAEC,MAAM,GAAG,CAAC;IAAEC,MAAM,GAAG;EAAE,CAAC,GAAG,CAAC,CAAC;EACvCC,KAAK;EACLC,OAAO,GAAG,IAAI;EACd,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAM;IAAEC,MAAM;IAAEC;EAAS,CAAC,GAAGX,oBAAoB,CAAC,CAAC;EAEnD,MAAMG,MAAM,GAAGQ,QAAQ,CAACC,WAAW,CAAC;IAClCC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IAClBC,WAAW,EAAE,CAACV,MAAM,EAAEC,MAAM;EAC9B,CAAC,CAAC;EAEF,MAAMU,MAAM,GAAGjB,OAAO,CACpB,MAAM,CACJ;IACEkB,SAAS,EAAE,CACT;MAAEC,UAAU,EAAEV,OAAO,GAAGR,QAAQ,CAACmB,GAAG,CAACR,MAAM,EAAEP,MAAM,CAAC,GAAGC;IAAO,CAAC;EAEnE,CAAC,EACDE,KAAK,CACN,EACD,CAACF,MAAM,EAAEG,OAAO,EAAEG,MAAM,EAAEP,MAAM,EAAEG,KAAK,CACzC,CAAC;EAED,oBACEV,KAAA,CAAAuB,aAAA,CAACpB,QAAQ,CAACqB,IAAI,EAAAC,QAAA;IAACZ,GAAG,EAAEA,GAAI;IAACH,KAAK,EAAES;EAAO,GAAKP,KAAK,GAC9CN,QACY,CAAC;AAEpB,CACF,CAAC;AAED,eAAeD,kBAAkB","ignoreList":[]}
|
|
@@ -17,29 +17,38 @@ const KEYBOARD_TOOLBAR_HEIGHT = 42;
|
|
|
17
17
|
const DEFAULT_OPACITY = "FF";
|
|
18
18
|
|
|
19
19
|
/**
|
|
20
|
-
* `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` and
|
|
21
|
-
* `Done`
|
|
20
|
+
* `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and
|
|
21
|
+
* `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.
|
|
22
|
+
*
|
|
23
|
+
* @param props - Component props.
|
|
24
|
+
* @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.
|
|
25
|
+
* @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.
|
|
26
|
+
* @example
|
|
27
|
+
* ```tsx
|
|
28
|
+
* <KeyboardToolbar doneText="Close" />
|
|
29
|
+
* ```
|
|
22
30
|
*/
|
|
23
|
-
const KeyboardToolbar =
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
31
|
+
const KeyboardToolbar = props => {
|
|
32
|
+
const {
|
|
33
|
+
content,
|
|
34
|
+
theme = colors,
|
|
35
|
+
doneText = "Done",
|
|
36
|
+
button,
|
|
37
|
+
icon,
|
|
38
|
+
showArrows = true,
|
|
39
|
+
onNextCallback,
|
|
40
|
+
onPrevCallback,
|
|
41
|
+
onDoneCallback,
|
|
42
|
+
blur = null,
|
|
43
|
+
opacity = DEFAULT_OPACITY,
|
|
44
|
+
offset: {
|
|
45
|
+
closed = 0,
|
|
46
|
+
opened = 0
|
|
47
|
+
} = {},
|
|
48
|
+
enabled = true,
|
|
49
|
+
insets,
|
|
50
|
+
...rest
|
|
51
|
+
} = props;
|
|
43
52
|
const colorScheme = useColorScheme();
|
|
44
53
|
const [inputs, setInputs] = useState({
|
|
45
54
|
current: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","StyleSheet","Text","View","FocusedInputEvents","KeyboardController","useColorScheme","KeyboardStickyView","Arrow","Button","colors","TEST_ID_KEYBOARD_TOOLBAR","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","KEYBOARD_TOOLBAR_HEIGHT","DEFAULT_OPACITY","KeyboardToolbar","content","theme","doneText","button","icon","showArrows","onNextCallback","onPrevCallback","onDoneCallback","blur","opacity","offset","closed","opened","enabled","insets","rest","colorScheme","inputs","setInputs","current","count","isPrevDisabled","isNextDisabled","subscription","addListener","e","remove","doneStyle","styles","doneButton","color","primary","toolbarStyle","toolbar","backgroundColor","background","paddingLeft","left","paddingRight","right","ButtonContainer","IconContainer","onPressNext","event","isDefaultPrevented","setFocusTo","onPressPrev","onPressDone","dismiss","createElement","_extends","style","testID","arrows","accessibilityHint","accessibilityLabel","disabled","onPress","type","flex","rippleRadius","doneButtonContainer","maxFontSizeMultiplier","create","position","bottom","alignItems","width","flexDirection","height","fontWeight","fontSize","marginRight","marginLeft","DefaultKeyboardToolbarTheme"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { StyleSheet, Text, View } from \"react-native\";\n\nimport { FocusedInputEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\nimport useColorScheme from \"../hooks/useColorScheme\";\nimport KeyboardStickyView from \"../KeyboardStickyView\";\n\nimport Arrow from \"./Arrow\";\nimport Button from \"./Button\";\nimport { colors } from \"./colors\";\n\nimport type { HEX, KeyboardToolbarTheme } from \"./types\";\nimport type { KeyboardStickyViewProps } from \"../KeyboardStickyView\";\nimport type { ReactNode } from \"react\";\nimport type { GestureResponderEvent, ViewProps } from \"react-native\";\n\ntype SafeAreaInsets = {\n left: number;\n right: number;\n};\n\nexport type KeyboardToolbarProps = Omit<\n ViewProps,\n \"style\" | \"testID\" | \"children\"\n> & {\n /** An element that is shown in the middle of the toolbar. */\n content?: React.JSX.Element | null;\n /** A set of dark/light colors consumed by toolbar component. */\n theme?: KeyboardToolbarTheme;\n /** Custom text for done button. */\n doneText?: ReactNode;\n /** Custom touchable component for toolbar (used for prev/next/done buttons). */\n button?: typeof Button;\n /** Custom icon component used to display next/prev buttons. */\n icon?: typeof Arrow;\n /**\n * Whether to show next and previous buttons. Can be useful to set it to `false` if you have only one input\n * and want to show only `Done` button. Default to `true`.\n */\n showArrows?: boolean;\n /**\n * A callback that is called when the user presses the next button along with the default action.\n */\n onNextCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the previous button along with the default action.\n */\n onPrevCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the done button along with the default action.\n */\n onDoneCallback?: (event: GestureResponderEvent) => void;\n /**\n * A component that applies blur effect to the toolbar.\n */\n blur?: React.JSX.Element | null;\n /**\n * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.\n */\n opacity?: HEX;\n insets?: SafeAreaInsets;\n} & Pick<KeyboardStickyViewProps, \"offset\" | \"enabled\">;\n\nconst TEST_ID_KEYBOARD_TOOLBAR = \"keyboard.toolbar\";\nconst TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;\nconst TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;\nconst TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;\nconst TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;\n\nconst KEYBOARD_TOOLBAR_HEIGHT = 42;\nconst DEFAULT_OPACITY: HEX = \"FF\";\n\n/**\n * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` and\n * `Done` buttons.\n */\nconst KeyboardToolbar: React.FC<KeyboardToolbarProps> = ({\n content,\n theme = colors,\n doneText = \"Done\",\n button,\n icon,\n showArrows = true,\n onNextCallback,\n onPrevCallback,\n onDoneCallback,\n blur = null,\n opacity = DEFAULT_OPACITY,\n offset: { closed = 0, opened = 0 } = {},\n enabled = true,\n insets,\n ...rest\n}) => {\n const colorScheme = useColorScheme();\n const [inputs, setInputs] = useState({\n current: 0,\n count: 0,\n });\n const isPrevDisabled = inputs.current === 0;\n const isNextDisabled = inputs.current === inputs.count - 1;\n\n useEffect(() => {\n const subscription = FocusedInputEvents.addListener(\"focusDidSet\", (e) => {\n setInputs(e);\n });\n\n return subscription.remove;\n }, []);\n const doneStyle = useMemo(\n () => [styles.doneButton, { color: theme[colorScheme].primary }],\n [colorScheme, theme],\n );\n const toolbarStyle = useMemo(\n () => [\n styles.toolbar,\n {\n backgroundColor: `${theme[colorScheme].background}${opacity}`,\n },\n {\n paddingLeft: insets?.left,\n paddingRight: insets?.right,\n },\n ],\n [colorScheme, opacity, theme, insets],\n );\n const offset = useMemo(\n () => ({ closed: closed + KEYBOARD_TOOLBAR_HEIGHT, opened }),\n [closed, opened],\n );\n const ButtonContainer = button || Button;\n const IconContainer = icon || Arrow;\n\n const onPressNext = useCallback(\n (event: GestureResponderEvent) => {\n onNextCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"next\");\n }\n },\n [onNextCallback],\n );\n const onPressPrev = useCallback(\n (event: GestureResponderEvent) => {\n onPrevCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"prev\");\n }\n },\n [onPrevCallback],\n );\n const onPressDone = useCallback(\n (event: GestureResponderEvent) => {\n onDoneCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.dismiss();\n }\n },\n [onDoneCallback],\n );\n\n return (\n <KeyboardStickyView enabled={enabled} offset={offset}>\n <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>\n {blur}\n {showArrows && (\n <View style={styles.arrows}>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the previous field\"\n accessibilityLabel=\"Previous\"\n disabled={isPrevDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS}\n theme={theme}\n onPress={onPressPrev}\n >\n <IconContainer\n disabled={isPrevDisabled}\n theme={theme}\n type=\"prev\"\n />\n </ButtonContainer>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the next field\"\n accessibilityLabel=\"Next\"\n disabled={isNextDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_NEXT}\n theme={theme}\n onPress={onPressNext}\n >\n <IconContainer\n disabled={isNextDisabled}\n theme={theme}\n type=\"next\"\n />\n </ButtonContainer>\n </View>\n )}\n\n <View style={styles.flex} testID={TEST_ID_KEYBOARD_TOOLBAR_CONTENT}>\n {content}\n </View>\n {doneText && (\n <ButtonContainer\n accessibilityHint=\"Closes the keyboard\"\n accessibilityLabel=\"Done\"\n rippleRadius={28}\n style={styles.doneButtonContainer}\n testID={TEST_ID_KEYBOARD_TOOLBAR_DONE}\n theme={theme}\n onPress={onPressDone}\n >\n <Text maxFontSizeMultiplier={1.3} style={doneStyle}>\n {doneText}\n </Text>\n </ButtonContainer>\n )}\n </View>\n </KeyboardStickyView>\n );\n};\n\nconst styles = StyleSheet.create({\n flex: {\n flex: 1,\n },\n toolbar: {\n position: \"absolute\",\n bottom: 0,\n alignItems: \"center\",\n width: \"100%\",\n flexDirection: \"row\",\n height: KEYBOARD_TOOLBAR_HEIGHT,\n },\n arrows: {\n flexDirection: \"row\",\n paddingLeft: 8,\n },\n doneButton: {\n fontWeight: \"600\",\n fontSize: 15,\n },\n doneButtonContainer: {\n marginRight: 16,\n marginLeft: 8,\n },\n});\n\nexport { colors as DefaultKeyboardToolbarTheme };\nexport default KeyboardToolbar;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","StyleSheet","Text","View","FocusedInputEvents","KeyboardController","useColorScheme","KeyboardStickyView","Arrow","Button","colors","TEST_ID_KEYBOARD_TOOLBAR","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","KEYBOARD_TOOLBAR_HEIGHT","DEFAULT_OPACITY","KeyboardToolbar","props","content","theme","doneText","button","icon","showArrows","onNextCallback","onPrevCallback","onDoneCallback","blur","opacity","offset","closed","opened","enabled","insets","rest","colorScheme","inputs","setInputs","current","count","isPrevDisabled","isNextDisabled","subscription","addListener","e","remove","doneStyle","styles","doneButton","color","primary","toolbarStyle","toolbar","backgroundColor","background","paddingLeft","left","paddingRight","right","ButtonContainer","IconContainer","onPressNext","event","isDefaultPrevented","setFocusTo","onPressPrev","onPressDone","dismiss","createElement","_extends","style","testID","arrows","accessibilityHint","accessibilityLabel","disabled","onPress","type","flex","rippleRadius","doneButtonContainer","maxFontSizeMultiplier","create","position","bottom","alignItems","width","flexDirection","height","fontWeight","fontSize","marginRight","marginLeft","DefaultKeyboardToolbarTheme"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { StyleSheet, Text, View } from \"react-native\";\n\nimport { FocusedInputEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\nimport useColorScheme from \"../hooks/useColorScheme\";\nimport KeyboardStickyView from \"../KeyboardStickyView\";\n\nimport Arrow from \"./Arrow\";\nimport Button from \"./Button\";\nimport { colors } from \"./colors\";\n\nimport type { HEX, KeyboardToolbarTheme } from \"./types\";\nimport type { KeyboardStickyViewProps } from \"../KeyboardStickyView\";\nimport type { ReactNode } from \"react\";\nimport type { GestureResponderEvent, ViewProps } from \"react-native\";\n\ntype SafeAreaInsets = {\n left: number;\n right: number;\n};\n\nexport type KeyboardToolbarProps = Omit<\n ViewProps,\n \"style\" | \"testID\" | \"children\"\n> & {\n /** An element that is shown in the middle of the toolbar. */\n content?: React.JSX.Element | null;\n /** A set of dark/light colors consumed by toolbar component. */\n theme?: KeyboardToolbarTheme;\n /** Custom text for done button. */\n doneText?: ReactNode;\n /** Custom touchable component for toolbar (used for prev/next/done buttons). */\n button?: typeof Button;\n /** Custom icon component used to display next/prev buttons. */\n icon?: typeof Arrow;\n /**\n * Whether to show next and previous buttons. Can be useful to set it to `false` if you have only one input\n * and want to show only `Done` button. Default to `true`.\n */\n showArrows?: boolean;\n /**\n * A callback that is called when the user presses the next button along with the default action.\n */\n onNextCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the previous button along with the default action.\n */\n onPrevCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the done button along with the default action.\n */\n onDoneCallback?: (event: GestureResponderEvent) => void;\n /**\n * A component that applies blur effect to the toolbar.\n */\n blur?: React.JSX.Element | null;\n /**\n * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.\n */\n opacity?: HEX;\n /**\n * A object containing `left`/`right` properties. Used to specify proper container padding in landscape mode.\n */\n insets?: SafeAreaInsets;\n} & Pick<KeyboardStickyViewProps, \"offset\" | \"enabled\">;\n\nconst TEST_ID_KEYBOARD_TOOLBAR = \"keyboard.toolbar\";\nconst TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;\nconst TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;\nconst TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;\nconst TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;\n\nconst KEYBOARD_TOOLBAR_HEIGHT = 42;\nconst DEFAULT_OPACITY: HEX = \"FF\";\n\n/**\n * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and\n * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.\n *\n * @param props - Component props.\n * @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardToolbar doneText=\"Close\" />\n * ```\n */\nconst KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {\n const {\n content,\n theme = colors,\n doneText = \"Done\",\n button,\n icon,\n showArrows = true,\n onNextCallback,\n onPrevCallback,\n onDoneCallback,\n blur = null,\n opacity = DEFAULT_OPACITY,\n offset: { closed = 0, opened = 0 } = {},\n enabled = true,\n insets,\n ...rest\n } = props;\n const colorScheme = useColorScheme();\n const [inputs, setInputs] = useState({\n current: 0,\n count: 0,\n });\n const isPrevDisabled = inputs.current === 0;\n const isNextDisabled = inputs.current === inputs.count - 1;\n\n useEffect(() => {\n const subscription = FocusedInputEvents.addListener(\"focusDidSet\", (e) => {\n setInputs(e);\n });\n\n return subscription.remove;\n }, []);\n const doneStyle = useMemo(\n () => [styles.doneButton, { color: theme[colorScheme].primary }],\n [colorScheme, theme],\n );\n const toolbarStyle = useMemo(\n () => [\n styles.toolbar,\n {\n backgroundColor: `${theme[colorScheme].background}${opacity}`,\n },\n {\n paddingLeft: insets?.left,\n paddingRight: insets?.right,\n },\n ],\n [colorScheme, opacity, theme, insets],\n );\n const offset = useMemo(\n () => ({ closed: closed + KEYBOARD_TOOLBAR_HEIGHT, opened }),\n [closed, opened],\n );\n const ButtonContainer = button || Button;\n const IconContainer = icon || Arrow;\n\n const onPressNext = useCallback(\n (event: GestureResponderEvent) => {\n onNextCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"next\");\n }\n },\n [onNextCallback],\n );\n const onPressPrev = useCallback(\n (event: GestureResponderEvent) => {\n onPrevCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"prev\");\n }\n },\n [onPrevCallback],\n );\n const onPressDone = useCallback(\n (event: GestureResponderEvent) => {\n onDoneCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.dismiss();\n }\n },\n [onDoneCallback],\n );\n\n return (\n <KeyboardStickyView enabled={enabled} offset={offset}>\n <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>\n {blur}\n {showArrows && (\n <View style={styles.arrows}>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the previous field\"\n accessibilityLabel=\"Previous\"\n disabled={isPrevDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS}\n theme={theme}\n onPress={onPressPrev}\n >\n <IconContainer\n disabled={isPrevDisabled}\n theme={theme}\n type=\"prev\"\n />\n </ButtonContainer>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the next field\"\n accessibilityLabel=\"Next\"\n disabled={isNextDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_NEXT}\n theme={theme}\n onPress={onPressNext}\n >\n <IconContainer\n disabled={isNextDisabled}\n theme={theme}\n type=\"next\"\n />\n </ButtonContainer>\n </View>\n )}\n\n <View style={styles.flex} testID={TEST_ID_KEYBOARD_TOOLBAR_CONTENT}>\n {content}\n </View>\n {doneText && (\n <ButtonContainer\n accessibilityHint=\"Closes the keyboard\"\n accessibilityLabel=\"Done\"\n rippleRadius={28}\n style={styles.doneButtonContainer}\n testID={TEST_ID_KEYBOARD_TOOLBAR_DONE}\n theme={theme}\n onPress={onPressDone}\n >\n <Text maxFontSizeMultiplier={1.3} style={doneStyle}>\n {doneText}\n </Text>\n </ButtonContainer>\n )}\n </View>\n </KeyboardStickyView>\n );\n};\n\nconst styles = StyleSheet.create({\n flex: {\n flex: 1,\n },\n toolbar: {\n position: \"absolute\",\n bottom: 0,\n alignItems: \"center\",\n width: \"100%\",\n flexDirection: \"row\",\n height: KEYBOARD_TOOLBAR_HEIGHT,\n },\n arrows: {\n flexDirection: \"row\",\n paddingLeft: 8,\n },\n doneButton: {\n fontWeight: \"600\",\n fontSize: 15,\n },\n doneButtonContainer: {\n marginRight: 16,\n marginLeft: 8,\n },\n});\n\nexport { colors as DefaultKeyboardToolbarTheme };\nexport default KeyboardToolbar;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/module/context.js
CHANGED
|
@@ -28,6 +28,22 @@ const defaultContext = {
|
|
|
28
28
|
setEnabled: NOOP
|
|
29
29
|
};
|
|
30
30
|
export const KeyboardContext = /*#__PURE__*/createContext(defaultContext);
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* A hook that returns a reference to {@link KeyboardAnimationContext} object.
|
|
34
|
+
*
|
|
35
|
+
* @returns Object {@link KeyboardAnimationContext|containing} keyboard-controller context.
|
|
36
|
+
* @example
|
|
37
|
+
* ```ts
|
|
38
|
+
* const context = useKeyboardContext();
|
|
39
|
+
*
|
|
40
|
+
* useLayoutEffect(() => {
|
|
41
|
+
* const cleanup = context.setInputHandlers(handler);
|
|
42
|
+
*
|
|
43
|
+
* return () => cleanup();
|
|
44
|
+
* }, deps);
|
|
45
|
+
* ```
|
|
46
|
+
*/
|
|
31
47
|
export const useKeyboardContext = () => {
|
|
32
48
|
const context = useContext(KeyboardContext);
|
|
33
49
|
if (__DEV__ && context === defaultContext) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createContext","useContext","Animated","NOOP","NESTED_NOOP","withSharedValue","value","addListener","removeListener","modify","get","set","DEFAULT_SHARED_VALUE","DEFAULT_LAYOUT","defaultContext","enabled","animated","progress","Value","height","reanimated","layout","setKeyboardHandlers","setInputHandlers","setEnabled","KeyboardContext","useKeyboardContext","context","__DEV__","console","warn"],"sources":["context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { Animated } from \"react-native\";\n\nimport type {\n FocusedInputHandler,\n FocusedInputLayoutChangedEvent,\n KeyboardHandler,\n} from \"./types\";\nimport type React from \"react\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nexport type AnimatedContext = {\n progress: Animated.Value;\n height: Animated.AnimatedMultiplication<number>;\n};\nexport type ReanimatedContext = {\n progress: SharedValue<number>;\n height: SharedValue<number>;\n};\nexport type KeyboardAnimationContext = {\n enabled: boolean;\n animated: AnimatedContext;\n reanimated: ReanimatedContext;\n layout: SharedValue<FocusedInputLayoutChangedEvent | null>;\n setKeyboardHandlers: (handlers: KeyboardHandler) => () => void;\n setInputHandlers: (handlers: FocusedInputHandler) => () => void;\n setEnabled: React.Dispatch<React.SetStateAction<boolean>>;\n};\nconst NOOP = () => {};\nconst NESTED_NOOP = () => NOOP;\nconst withSharedValue = <T>(value: T): SharedValue<T> => ({\n value,\n addListener: NOOP,\n removeListener: NOOP,\n modify: NOOP,\n get: () => value,\n set: NOOP,\n});\nconst DEFAULT_SHARED_VALUE = withSharedValue(0);\nconst DEFAULT_LAYOUT = withSharedValue<FocusedInputLayoutChangedEvent | null>(\n null,\n);\nconst defaultContext: KeyboardAnimationContext = {\n enabled: true,\n animated: {\n progress: new Animated.Value(0),\n height: new Animated.Value(0),\n },\n reanimated: {\n progress: DEFAULT_SHARED_VALUE,\n height: DEFAULT_SHARED_VALUE,\n },\n layout: DEFAULT_LAYOUT,\n setKeyboardHandlers: NESTED_NOOP,\n setInputHandlers: NESTED_NOOP,\n setEnabled: NOOP,\n};\n\nexport const KeyboardContext = createContext(defaultContext);\nexport const useKeyboardContext = () => {\n const context = useContext(KeyboardContext);\n\n if (__DEV__ && context === defaultContext) {\n console.warn(\n \"Couldn't find real values for `KeyboardContext`. Please make sure you're inside of `KeyboardProvider` - otherwise functionality of `react-native-keyboard-controller` will not work.\",\n );\n }\n\n return context;\n};\n"],"mappings":"AAAA,SAASA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AACjD,SAASC,QAAQ,QAAQ,cAAc;
|
|
1
|
+
{"version":3,"names":["createContext","useContext","Animated","NOOP","NESTED_NOOP","withSharedValue","value","addListener","removeListener","modify","get","set","DEFAULT_SHARED_VALUE","DEFAULT_LAYOUT","defaultContext","enabled","animated","progress","Value","height","reanimated","layout","setKeyboardHandlers","setInputHandlers","setEnabled","KeyboardContext","useKeyboardContext","context","__DEV__","console","warn"],"sources":["context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { Animated } from \"react-native\";\n\nimport type {\n FocusedInputHandler,\n FocusedInputLayoutChangedEvent,\n KeyboardHandler,\n} from \"./types\";\nimport type React from \"react\";\nimport type { SharedValue } from \"react-native-reanimated\";\n\nexport type AnimatedContext = {\n /**\n * A value between `0` and `1` indicating keyboard position, where `0` means keyboard is closed and `1` means keyboard is fully visible.\n * Represented as `Animated.Value`.\n */\n progress: Animated.Value;\n /** Height of the keyboard. Represented as `Animated.Value`. */\n height: Animated.AnimatedMultiplication<number>;\n};\nexport type ReanimatedContext = {\n /**\n * A value between `0` and `1` indicating keyboard position, where `0` means keyboard is closed and `1` means keyboard is fully visible.\n * Represented as `SharedValue`.\n */\n progress: SharedValue<number>;\n /** Height of the keyboard. Represented as `SharedValue`. */\n height: SharedValue<number>;\n};\nexport type KeyboardAnimationContext = {\n /** Whether KeyboardController library is active or not. */\n enabled: boolean;\n /** Object that stores animated values that reflect the keyboard’s current position and movement. */\n animated: AnimatedContext;\n /** Object that stores reanimated values that reflect the keyboard’s current position and movement. */\n reanimated: ReanimatedContext;\n /** Layout of the focused `TextInput` represented as `SharedValue`. */\n layout: SharedValue<FocusedInputLayoutChangedEvent | null>;\n /** Method for setting workletized keyboard handlers. */\n setKeyboardHandlers: (handlers: KeyboardHandler) => () => void;\n /** Method for setting workletized handlers for tracking focused input events. */\n setInputHandlers: (handlers: FocusedInputHandler) => () => void;\n /** Method to enable/disable KeyboardController library. */\n setEnabled: React.Dispatch<React.SetStateAction<boolean>>;\n};\nconst NOOP = () => {};\nconst NESTED_NOOP = () => NOOP;\nconst withSharedValue = <T>(value: T): SharedValue<T> => ({\n value,\n addListener: NOOP,\n removeListener: NOOP,\n modify: NOOP,\n get: () => value,\n set: NOOP,\n});\nconst DEFAULT_SHARED_VALUE = withSharedValue(0);\nconst DEFAULT_LAYOUT = withSharedValue<FocusedInputLayoutChangedEvent | null>(\n null,\n);\nconst defaultContext: KeyboardAnimationContext = {\n enabled: true,\n animated: {\n progress: new Animated.Value(0),\n height: new Animated.Value(0),\n },\n reanimated: {\n progress: DEFAULT_SHARED_VALUE,\n height: DEFAULT_SHARED_VALUE,\n },\n layout: DEFAULT_LAYOUT,\n setKeyboardHandlers: NESTED_NOOP,\n setInputHandlers: NESTED_NOOP,\n setEnabled: NOOP,\n};\n\nexport const KeyboardContext = createContext(defaultContext);\n\n/**\n * A hook that returns a reference to {@link KeyboardAnimationContext} object.\n *\n * @returns Object {@link KeyboardAnimationContext|containing} keyboard-controller context.\n * @example\n * ```ts\n * const context = useKeyboardContext();\n *\n * useLayoutEffect(() => {\n * const cleanup = context.setInputHandlers(handler);\n *\n * return () => cleanup();\n * }, deps);\n * ```\n */\nexport const useKeyboardContext = () => {\n const context = useContext(KeyboardContext);\n\n if (__DEV__ && context === defaultContext) {\n console.warn(\n \"Couldn't find real values for `KeyboardContext`. Please make sure you're inside of `KeyboardProvider` - otherwise functionality of `react-native-keyboard-controller` will not work.\",\n );\n }\n\n return context;\n};\n"],"mappings":"AAAA,SAASA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AACjD,SAASC,QAAQ,QAAQ,cAAc;AA4CvC,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AACrB,MAAMC,WAAW,GAAGA,CAAA,KAAMD,IAAI;AAC9B,MAAME,eAAe,GAAOC,KAAQ,KAAsB;EACxDA,KAAK;EACLC,WAAW,EAAEJ,IAAI;EACjBK,cAAc,EAAEL,IAAI;EACpBM,MAAM,EAAEN,IAAI;EACZO,GAAG,EAAEA,CAAA,KAAMJ,KAAK;EAChBK,GAAG,EAAER;AACP,CAAC,CAAC;AACF,MAAMS,oBAAoB,GAAGP,eAAe,CAAC,CAAC,CAAC;AAC/C,MAAMQ,cAAc,GAAGR,eAAe,CACpC,IACF,CAAC;AACD,MAAMS,cAAwC,GAAG;EAC/CC,OAAO,EAAE,IAAI;EACbC,QAAQ,EAAE;IACRC,QAAQ,EAAE,IAAIf,QAAQ,CAACgB,KAAK,CAAC,CAAC,CAAC;IAC/BC,MAAM,EAAE,IAAIjB,QAAQ,CAACgB,KAAK,CAAC,CAAC;EAC9B,CAAC;EACDE,UAAU,EAAE;IACVH,QAAQ,EAAEL,oBAAoB;IAC9BO,MAAM,EAAEP;EACV,CAAC;EACDS,MAAM,EAAER,cAAc;EACtBS,mBAAmB,EAAElB,WAAW;EAChCmB,gBAAgB,EAAEnB,WAAW;EAC7BoB,UAAU,EAAErB;AACd,CAAC;AAED,OAAO,MAAMsB,eAAe,gBAAGzB,aAAa,CAACc,cAAc,CAAC;;AAE5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMY,kBAAkB,GAAGA,CAAA,KAAM;EACtC,MAAMC,OAAO,GAAG1B,UAAU,CAACwB,eAAe,CAAC;EAE3C,IAAIG,OAAO,IAAID,OAAO,KAAKb,cAAc,EAAE;IACzCe,OAAO,CAACC,IAAI,CACV,sLACF,CAAC;EACH;EAEA,OAAOH,OAAO;AAChB,CAAC","ignoreList":[]}
|