react-native-keyboard-controller 1.19.6 → 1.20.0
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/android/src/fabric/java/com/reactnativekeyboardcontroller/KeyboardControllerViewManager.kt +18 -0
- package/android/src/main/java/com/reactnativekeyboardcontroller/listeners/KeyboardAnimationCallback.kt +1 -1
- package/android/src/main/java/com/reactnativekeyboardcontroller/managers/KeyboardControllerViewManagerImpl.kt +7 -0
- package/android/src/main/java/com/reactnativekeyboardcontroller/views/EdgeToEdgeReactViewGroup.kt +2 -2
- package/android/src/paper/java/com/reactnativekeyboardcontroller/KeyboardControllerViewManager.kt +16 -0
- package/ios/KeyboardControllerModule.mm +1 -0
- package/ios/observers/FocusedInputObserver.swift +1 -1
- package/ios/views/KeyboardControllerView.mm +11 -0
- package/ios/views/KeyboardControllerViewManager.mm +3 -0
- package/ios/views/KeyboardControllerViewManager.swift +13 -1
- package/lib/commonjs/animated.js +14 -5
- package/lib/commonjs/animated.js.map +1 -1
- package/lib/commonjs/bindings.js +4 -1
- package/lib/commonjs/bindings.js.map +1 -1
- package/lib/commonjs/bindings.native.js +4 -2
- package/lib/commonjs/bindings.native.js.map +1 -1
- package/lib/commonjs/compat.js +65 -0
- package/lib/commonjs/compat.js.map +1 -0
- package/lib/commonjs/components/KeyboardAwareScrollView/index.js +25 -7
- package/lib/commonjs/components/KeyboardAwareScrollView/index.js.map +1 -1
- package/lib/commonjs/components/index.js.map +1 -1
- package/lib/commonjs/context.js +1 -0
- package/lib/commonjs/context.js.map +1 -1
- package/lib/commonjs/hooks/index.js +43 -3
- package/lib/commonjs/hooks/index.js.map +1 -1
- package/lib/commonjs/hooks/useKeyboardState/index.js.map +1 -1
- package/lib/commonjs/index.js +12 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/internal.js +16 -16
- package/lib/commonjs/internal.js.map +1 -1
- package/lib/commonjs/specs/KeyboardControllerViewNativeComponent.js +5 -1
- package/lib/commonjs/specs/KeyboardControllerViewNativeComponent.js.map +1 -1
- package/lib/commonjs/types/internal.js.map +1 -1
- package/lib/commonjs/types/module.js.map +1 -1
- package/lib/module/animated.js +16 -7
- package/lib/module/animated.js.map +1 -1
- package/lib/module/bindings.js +3 -0
- package/lib/module/bindings.js.map +1 -1
- package/lib/module/bindings.native.js +3 -1
- package/lib/module/bindings.native.js.map +1 -1
- package/lib/module/compat.js +58 -0
- package/lib/module/compat.js.map +1 -0
- package/lib/module/components/KeyboardAwareScrollView/index.js +26 -8
- package/lib/module/components/KeyboardAwareScrollView/index.js.map +1 -1
- package/lib/module/components/index.js.map +1 -1
- package/lib/module/context.js +1 -0
- package/lib/module/context.js.map +1 -1
- package/lib/module/hooks/index.js +43 -3
- package/lib/module/hooks/index.js.map +1 -1
- package/lib/module/hooks/useKeyboardState/index.js.map +1 -1
- package/lib/module/index.js +1 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/internal.js +16 -16
- package/lib/module/internal.js.map +1 -1
- package/lib/module/specs/KeyboardControllerViewNativeComponent.js +4 -0
- package/lib/module/specs/KeyboardControllerViewNativeComponent.js.map +1 -1
- package/lib/module/types/internal.js.map +1 -1
- package/lib/module/types/module.js.map +1 -1
- package/lib/typescript/bindings.d.ts +3 -0
- package/lib/typescript/bindings.native.d.ts +1 -0
- package/lib/typescript/compat.d.ts +27 -0
- package/lib/typescript/components/KeyboardAwareScrollView/index.d.ts +4 -1
- package/lib/typescript/components/index.d.ts +1 -1
- package/lib/typescript/context.d.ts +6 -4
- package/lib/typescript/hooks/index.d.ts +4 -4
- package/lib/typescript/hooks/useKeyboardState/index.d.ts +3 -3
- package/lib/typescript/index.d.ts +2 -1
- package/lib/typescript/internal.d.ts +2 -3
- package/lib/typescript/specs/KeyboardControllerViewNativeComponent.d.ts +4 -0
- package/lib/typescript/types/internal.d.ts +1 -1
- package/lib/typescript/types/module.d.ts +3 -2
- package/package.json +1 -1
- package/src/animated.tsx +32 -15
- package/src/bindings.native.ts +4 -1
- package/src/bindings.ts +5 -0
- package/src/compat.ts +61 -0
- package/src/components/KeyboardAwareScrollView/index.tsx +43 -11
- package/src/components/index.ts +4 -1
- package/src/context.ts +14 -8
- package/src/hooks/index.ts +68 -11
- package/src/hooks/useKeyboardState/index.ts +4 -4
- package/src/index.ts +2 -0
- package/src/internal.ts +33 -30
- package/src/specs/KeyboardControllerViewNativeComponent.ts +11 -0
- package/src/types/internal.ts +3 -1
- package/src/types/module.ts +3 -2
- package/lib/commonjs/event-handler.d.js +0 -6
- package/lib/commonjs/event-handler.d.js.map +0 -1
- package/lib/commonjs/event-handler.js +0 -19
- package/lib/commonjs/event-handler.js.map +0 -1
- package/lib/commonjs/event-handler.web.js +0 -10
- package/lib/commonjs/event-handler.web.js.map +0 -1
- package/lib/commonjs/event-mappings.js +0 -9
- package/lib/commonjs/event-mappings.js.map +0 -1
- package/lib/module/event-handler.d.js +0 -2
- package/lib/module/event-handler.d.js.map +0 -1
- package/lib/module/event-handler.js +0 -14
- package/lib/module/event-handler.js.map +0 -1
- package/lib/module/event-handler.web.js +0 -5
- package/lib/module/event-handler.web.js.map +0 -1
- package/lib/module/event-mappings.js +0 -3
- package/lib/module/event-mappings.js.map +0 -1
- package/lib/typescript/event-mappings.d.ts +0 -2
- package/src/event-handler.d.ts +0 -8
- package/src/event-handler.js +0 -15
- package/src/event-handler.web.js +0 -5
- package/src/event-mappings.ts +0 -14
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { useEffect, useLayoutEffect } from "react";
|
|
2
|
+
import { useEvent, useHandler } from "react-native-reanimated";
|
|
2
3
|
import { AndroidSoftInputModes } from "../constants";
|
|
3
4
|
import { useKeyboardContext } from "../context";
|
|
4
5
|
import { KeyboardController } from "../module";
|
|
@@ -96,8 +97,31 @@ export const useReanimatedKeyboardAnimation = () => {
|
|
|
96
97
|
*/
|
|
97
98
|
export function useGenericKeyboardHandler(handler, deps) {
|
|
98
99
|
const context = useKeyboardContext();
|
|
100
|
+
const {
|
|
101
|
+
doDependenciesDiffer
|
|
102
|
+
} = useHandler(handler, deps);
|
|
103
|
+
const eventHandler = useEvent(event => {
|
|
104
|
+
"worklet";
|
|
105
|
+
|
|
106
|
+
if (event.eventName.endsWith("onKeyboardMoveStart")) {
|
|
107
|
+
var _handler$onStart;
|
|
108
|
+
(_handler$onStart = handler.onStart) === null || _handler$onStart === void 0 || _handler$onStart.call(handler, event);
|
|
109
|
+
}
|
|
110
|
+
if (event.eventName.endsWith("onKeyboardMove")) {
|
|
111
|
+
var _handler$onMove;
|
|
112
|
+
(_handler$onMove = handler.onMove) === null || _handler$onMove === void 0 || _handler$onMove.call(handler, event);
|
|
113
|
+
}
|
|
114
|
+
if (event.eventName.endsWith("onKeyboardMoveEnd")) {
|
|
115
|
+
var _handler$onEnd;
|
|
116
|
+
(_handler$onEnd = handler.onEnd) === null || _handler$onEnd === void 0 || _handler$onEnd.call(handler, event);
|
|
117
|
+
}
|
|
118
|
+
if (event.eventName.endsWith("onKeyboardMoveInteractive")) {
|
|
119
|
+
var _handler$onInteractiv;
|
|
120
|
+
(_handler$onInteractiv = handler.onInteractive) === null || _handler$onInteractiv === void 0 || _handler$onInteractiv.call(handler, event);
|
|
121
|
+
}
|
|
122
|
+
}, ["onKeyboardMoveStart", "onKeyboardMove", "onKeyboardMoveEnd", "onKeyboardMoveInteractive"], doDependenciesDiffer);
|
|
99
123
|
useLayoutEffect(() => {
|
|
100
|
-
const cleanup = context.setKeyboardHandlers(
|
|
124
|
+
const cleanup = context.setKeyboardHandlers(eventHandler);
|
|
101
125
|
return () => cleanup();
|
|
102
126
|
}, deps);
|
|
103
127
|
}
|
|
@@ -185,7 +209,8 @@ export function useKeyboardController() {
|
|
|
185
209
|
export function useReanimatedFocusedInput() {
|
|
186
210
|
const context = useKeyboardContext();
|
|
187
211
|
return {
|
|
188
|
-
input: context.layout
|
|
212
|
+
input: context.layout,
|
|
213
|
+
update: context.update
|
|
189
214
|
};
|
|
190
215
|
}
|
|
191
216
|
|
|
@@ -208,8 +233,23 @@ export function useReanimatedFocusedInput() {
|
|
|
208
233
|
*/
|
|
209
234
|
export function useFocusedInputHandler(handler, deps) {
|
|
210
235
|
const context = useKeyboardContext();
|
|
236
|
+
const {
|
|
237
|
+
doDependenciesDiffer
|
|
238
|
+
} = useHandler(handler, deps);
|
|
239
|
+
const eventHandler = useEvent(event => {
|
|
240
|
+
"worklet";
|
|
241
|
+
|
|
242
|
+
if (event.eventName.endsWith("onFocusedInputTextChanged")) {
|
|
243
|
+
var _handler$onChangeText;
|
|
244
|
+
(_handler$onChangeText = handler.onChangeText) === null || _handler$onChangeText === void 0 || _handler$onChangeText.call(handler, event);
|
|
245
|
+
}
|
|
246
|
+
if (event.eventName.endsWith("onFocusedInputSelectionChanged")) {
|
|
247
|
+
var _handler$onSelectionC;
|
|
248
|
+
(_handler$onSelectionC = handler.onSelectionChange) === null || _handler$onSelectionC === void 0 || _handler$onSelectionC.call(handler, event);
|
|
249
|
+
}
|
|
250
|
+
}, ["onFocusedInputTextChanged", "onFocusedInputSelectionChanged"], doDependenciesDiffer);
|
|
211
251
|
useLayoutEffect(() => {
|
|
212
|
-
const cleanup = context.setInputHandlers(
|
|
252
|
+
const cleanup = context.setInputHandlers(eventHandler);
|
|
213
253
|
return () => cleanup();
|
|
214
254
|
}, deps);
|
|
215
255
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useLayoutEffect","AndroidSoftInputModes","useKeyboardContext","KeyboardController","useResizeMode","setInputMode","SOFT_INPUT_ADJUST_RESIZE","setDefaultMode","useKeyboardAnimation","context","animated","useReanimatedKeyboardAnimation","reanimated","useGenericKeyboardHandler","handler","deps","cleanup","setKeyboardHandlers","useKeyboardHandler","useKeyboardController","setEnabled","enabled","useReanimatedFocusedInput","input","layout","useFocusedInputHandler","setInputHandlers"],"sources":["index.ts"],"sourcesContent":["import { useEffect, useLayoutEffect } from \"react\";\n\nimport { AndroidSoftInputModes } from \"../constants\";\nimport { useKeyboardContext } from \"../context\";\nimport { KeyboardController } from \"../module\";\n\nimport type { AnimatedContext, ReanimatedContext } from \"../context\";\nimport type { FocusedInputHandler, KeyboardHandler } from \"../types\";\nimport type { DependencyList } from \"react\";\n\n/**\n * Hook that sets the Android soft input mode to adjust resize on mount and\n * restores default mode on unmount. This ensures the keyboard behavior is consistent\n * on all Android versions.\n *\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#setinputmode-|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * useResizeMode();\n * return <View />;\n * }\n * ```\n */\nexport const useResizeMode = () => {\n useEffect(() => {\n KeyboardController.setInputMode(\n AndroidSoftInputModes.SOFT_INPUT_ADJUST_RESIZE,\n );\n\n return () => KeyboardController.setDefaultMode();\n }, []);\n};\n\n/**\n * Hook that provides animated (`height`/`progress`) values for tracking keyboard movement.\n * Automatically sets the resize mode for Android.\n *\n * @returns Object {@link AnimatedContext|containing} animated values for keyboard movement.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-animation|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { height, progress } = useKeyboardAnimation();\n * return <Animated.View style={{ transform: [{ translateY: height }] }} />;\n * }\n * ```\n */\nexport const useKeyboardAnimation = (): AnimatedContext => {\n useResizeMode();\n const context = useKeyboardContext();\n\n return context.animated;\n};\n\n/**\n * Hook that provides reanimated (`height`/`progress`) values for tracking keyboard movement.\n * Automatically sets the resize mode for Android.\n *\n * @returns Object {@link ReanimatedContext|containing} reanimated values for keyboard movement.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-reanimated-keyboard-animation|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { height, progress } = useReanimatedKeyboardAnimation();\n * return <Reanimated.View style={{ transform: [{ translateY: height }] }} />;\n * }\n * ```\n */\nexport const useReanimatedKeyboardAnimation = (): ReanimatedContext => {\n useResizeMode();\n const context = useKeyboardContext();\n\n return context.reanimated;\n};\n\n/**\n * An alternative to {@link useKeyboardHandler} that doesn't set resize mode on mount. If your\n * app already uses `adjustResize`, then you can use this hook instead of `useKeyboardHandler`.\n *\n * @param handler - Object containing keyboard event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @example\n * ```tsx\n * function MyComponent() {\n * const height = useSharedValue(0);\n * const progress = useSharedValue(0);\n *\n * useGenericKeyboardHandler({\n * onMove: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * onEnd: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * }, []);\n *\n * return <Reanimated.View style={{ height: height }] }} />;\n * }\n * ```\n */\nexport function useGenericKeyboardHandler(\n handler: KeyboardHandler,\n deps?: DependencyList,\n) {\n const context = useKeyboardContext();\n\n useLayoutEffect(() => {\n const cleanup = context.setKeyboardHandlers(handler);\n\n return () => cleanup();\n }, deps);\n}\n\n/**\n * Hook that gives an access to each aspect of keyboard movement with workletized `onStart`/`onMove`/`onInteractive`/`onEnd` handlers.\n *\n * @param handler - Object containing keyboard event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-handler|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const height = useSharedValue(0);\n * const progress = useSharedValue(0);\n *\n * useKeyboardHandler({\n * onMove: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * onEnd: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * }, []);\n *\n * return <Reanimated.View style={{ height: height }] }} />;\n * }\n * ```\n */\nexport function useKeyboardHandler(\n handler: KeyboardHandler,\n deps?: DependencyList,\n) {\n useResizeMode();\n useGenericKeyboardHandler(handler, deps);\n}\n\n/**\n * Hook for controlling keyboard controller module.\n * Allows to disable/enable it and check the actual state (whether it's enabled or not).\n * When disabled it fallbacks to default android keyboard handling and stops tracking all\n * the events that are exposed from this library.\n *\n * @property {Function} setEnabled - Function to enable/disable keyboard handling.\n * @property {boolean} enabled - Current enabled state.\n * @returns Object containing keyboard control functions and state.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/module/use-keyboard-controller|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { setEnabled, enabled } = useKeyboardController();\n * return (\n * <Button\n * title={enabled ? 'Disable' : 'Enable'}\n * onPress={() => setEnabled(!enabled)}\n * />\n * );\n * }\n * ```\n */\nexport function useKeyboardController() {\n const context = useKeyboardContext();\n\n return { setEnabled: context.setEnabled, enabled: context.enabled };\n}\n\n/**\n * Hook that provides access to the layout of the currently focused input.\n *\n * @returns Object containing reanimated values for focused input.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/input/use-reanimated-focused-input|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { input } = useReanimatedFocusedInput();\n * return <Reanimated.View style={{ height: input.value?.layout.height }} />;\n * }\n * ```\n */\nexport function useReanimatedFocusedInput() {\n const context = useKeyboardContext();\n\n return { input: context.layout };\n}\n\n/**\n * Hook for handling focused input events, such as changes of selection, text etc.\n *\n * @param handler - Object containing focused input event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/input/use-focused-input-handler|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * useFocusedInputHandler({\n * onChangeText: (e) => console.log('Text changed:', e.text),\n * onSelectionChange: (e) => console.log('Selection changed:', e.selection)\n * });\n * return <View />;\n * }\n * ```\n */\nexport function useFocusedInputHandler(\n handler: FocusedInputHandler,\n deps?: DependencyList,\n) {\n const context = useKeyboardContext();\n\n useLayoutEffect(() => {\n const cleanup = context.setInputHandlers(handler);\n\n return () => cleanup();\n }, deps);\n}\n\nexport * from \"./useWindowDimensions\";\nexport * from \"./useKeyboardState\";\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,eAAe,QAAQ,OAAO;AAElD,SAASC,qBAAqB,QAAQ,cAAc;AACpD,SAASC,kBAAkB,QAAQ,YAAY;AAC/C,SAASC,kBAAkB,QAAQ,WAAW;AAM9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAM;EACjCL,SAAS,CAAC,MAAM;IACdI,kBAAkB,CAACE,YAAY,CAC7BJ,qBAAqB,CAACK,wBACxB,CAAC;IAED,OAAO,MAAMH,kBAAkB,CAACI,cAAc,CAAC,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;AACR,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,oBAAoB,GAAGA,CAAA,KAAuB;EACzDJ,aAAa,CAAC,CAAC;EACf,MAAMK,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAOO,OAAO,CAACC,QAAQ;AACzB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,8BAA8B,GAAGA,CAAA,KAAyB;EACrEP,aAAa,CAAC,CAAC;EACf,MAAMK,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAOO,OAAO,CAACG,UAAU;AAC3B,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,yBAAyBA,CACvCC,OAAwB,EACxBC,IAAqB,EACrB;EACA,MAAMN,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpCF,eAAe,CAAC,MAAM;IACpB,MAAMgB,OAAO,GAAGP,OAAO,CAACQ,mBAAmB,CAACH,OAAO,CAAC;IAEpD,OAAO,MAAME,OAAO,CAAC,CAAC;EACxB,CAAC,EAAED,IAAI,CAAC;AACV;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASG,kBAAkBA,CAChCJ,OAAwB,EACxBC,IAAqB,EACrB;EACAX,aAAa,CAAC,CAAC;EACfS,yBAAyB,CAACC,OAAO,EAAEC,IAAI,CAAC;AAC1C;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASI,qBAAqBA,CAAA,EAAG;EACtC,MAAMV,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAO;IAAEkB,UAAU,EAAEX,OAAO,CAACW,UAAU;IAAEC,OAAO,EAAEZ,OAAO,CAACY;EAAQ,CAAC;AACrE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,yBAAyBA,CAAA,EAAG;EAC1C,MAAMb,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAO;IAAEqB,KAAK,EAAEd,OAAO,CAACe;EAAO,CAAC;AAClC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,sBAAsBA,CACpCX,OAA4B,EAC5BC,IAAqB,EACrB;EACA,MAAMN,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpCF,eAAe,CAAC,MAAM;IACpB,MAAMgB,OAAO,GAAGP,OAAO,CAACiB,gBAAgB,CAACZ,OAAO,CAAC;IAEjD,OAAO,MAAME,OAAO,CAAC,CAAC;EACxB,CAAC,EAAED,IAAI,CAAC;AACV;AAEA,cAAc,uBAAuB;AACrC,cAAc,oBAAoB","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["useEffect","useLayoutEffect","useEvent","useHandler","AndroidSoftInputModes","useKeyboardContext","KeyboardController","useResizeMode","setInputMode","SOFT_INPUT_ADJUST_RESIZE","setDefaultMode","useKeyboardAnimation","context","animated","useReanimatedKeyboardAnimation","reanimated","useGenericKeyboardHandler","handler","deps","doDependenciesDiffer","eventHandler","event","eventName","endsWith","_handler$onStart","onStart","call","_handler$onMove","onMove","_handler$onEnd","onEnd","_handler$onInteractiv","onInteractive","cleanup","setKeyboardHandlers","useKeyboardHandler","useKeyboardController","setEnabled","enabled","useReanimatedFocusedInput","input","layout","update","useFocusedInputHandler","_handler$onChangeText","onChangeText","_handler$onSelectionC","onSelectionChange","setInputHandlers"],"sources":["index.ts"],"sourcesContent":["import { useEffect, useLayoutEffect } from \"react\";\nimport { useEvent, useHandler } from \"react-native-reanimated\";\n\nimport { AndroidSoftInputModes } from \"../constants\";\nimport { useKeyboardContext } from \"../context\";\nimport { KeyboardController } from \"../module\";\n\nimport type { AnimatedContext, ReanimatedContext } from \"../context\";\nimport type {\n FocusedInputHandler,\n FocusedInputSelectionChangedEvent,\n FocusedInputTextChangedEvent,\n KeyboardHandler,\n NativeEvent,\n} from \"../types\";\n\n/**\n * Hook that sets the Android soft input mode to adjust resize on mount and\n * restores default mode on unmount. This ensures the keyboard behavior is consistent\n * on all Android versions.\n *\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#setinputmode-|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * useResizeMode();\n * return <View />;\n * }\n * ```\n */\nexport const useResizeMode = () => {\n useEffect(() => {\n KeyboardController.setInputMode(\n AndroidSoftInputModes.SOFT_INPUT_ADJUST_RESIZE,\n );\n\n return () => KeyboardController.setDefaultMode();\n }, []);\n};\n\n/**\n * Hook that provides animated (`height`/`progress`) values for tracking keyboard movement.\n * Automatically sets the resize mode for Android.\n *\n * @returns Object {@link AnimatedContext|containing} animated values for keyboard movement.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-animation|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { height, progress } = useKeyboardAnimation();\n * return <Animated.View style={{ transform: [{ translateY: height }] }} />;\n * }\n * ```\n */\nexport const useKeyboardAnimation = (): AnimatedContext => {\n useResizeMode();\n const context = useKeyboardContext();\n\n return context.animated;\n};\n\n/**\n * Hook that provides reanimated (`height`/`progress`) values for tracking keyboard movement.\n * Automatically sets the resize mode for Android.\n *\n * @returns Object {@link ReanimatedContext|containing} reanimated values for keyboard movement.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-reanimated-keyboard-animation|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { height, progress } = useReanimatedKeyboardAnimation();\n * return <Reanimated.View style={{ transform: [{ translateY: height }] }} />;\n * }\n * ```\n */\nexport const useReanimatedKeyboardAnimation = (): ReanimatedContext => {\n useResizeMode();\n const context = useKeyboardContext();\n\n return context.reanimated;\n};\n\n/**\n * An alternative to {@link useKeyboardHandler} that doesn't set resize mode on mount. If your\n * app already uses `adjustResize`, then you can use this hook instead of `useKeyboardHandler`.\n *\n * @param handler - Object containing keyboard event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @example\n * ```tsx\n * function MyComponent() {\n * const height = useSharedValue(0);\n * const progress = useSharedValue(0);\n *\n * useGenericKeyboardHandler({\n * onMove: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * onEnd: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * }, []);\n *\n * return <Reanimated.View style={{ height: height }] }} />;\n * }\n * ```\n */\nexport function useGenericKeyboardHandler(\n handler: KeyboardHandler,\n deps?: unknown[],\n) {\n const context = useKeyboardContext();\n\n const { doDependenciesDiffer } = useHandler(handler, deps);\n\n const eventHandler = useEvent<NativeEvent>(\n (event) => {\n \"worklet\";\n\n if (event.eventName.endsWith(\"onKeyboardMoveStart\")) {\n handler.onStart?.(event);\n }\n\n if (event.eventName.endsWith(\"onKeyboardMove\")) {\n handler.onMove?.(event);\n }\n\n if (event.eventName.endsWith(\"onKeyboardMoveEnd\")) {\n handler.onEnd?.(event);\n }\n\n if (event.eventName.endsWith(\"onKeyboardMoveInteractive\")) {\n handler.onInteractive?.(event);\n }\n },\n [\n \"onKeyboardMoveStart\",\n \"onKeyboardMove\",\n \"onKeyboardMoveEnd\",\n \"onKeyboardMoveInteractive\",\n ],\n doDependenciesDiffer,\n );\n\n useLayoutEffect(() => {\n const cleanup = context.setKeyboardHandlers(eventHandler);\n\n return () => cleanup();\n }, deps);\n}\n\n/**\n * Hook that gives an access to each aspect of keyboard movement with workletized `onStart`/`onMove`/`onInteractive`/`onEnd` handlers.\n *\n * @param handler - Object containing keyboard event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-handler|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const height = useSharedValue(0);\n * const progress = useSharedValue(0);\n *\n * useKeyboardHandler({\n * onMove: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * onEnd: (e) => {\n * \"worklet\";\n *\n * height.value = e.height;\n * progress.value = e.progress;\n * },\n * }, []);\n *\n * return <Reanimated.View style={{ height: height }] }} />;\n * }\n * ```\n */\nexport function useKeyboardHandler(handler: KeyboardHandler, deps?: unknown[]) {\n useResizeMode();\n useGenericKeyboardHandler(handler, deps);\n}\n\n/**\n * Hook for controlling keyboard controller module.\n * Allows to disable/enable it and check the actual state (whether it's enabled or not).\n * When disabled it fallbacks to default android keyboard handling and stops tracking all\n * the events that are exposed from this library.\n *\n * @property {Function} setEnabled - Function to enable/disable keyboard handling.\n * @property {boolean} enabled - Current enabled state.\n * @returns Object containing keyboard control functions and state.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/module/use-keyboard-controller|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { setEnabled, enabled } = useKeyboardController();\n * return (\n * <Button\n * title={enabled ? 'Disable' : 'Enable'}\n * onPress={() => setEnabled(!enabled)}\n * />\n * );\n * }\n * ```\n */\nexport function useKeyboardController() {\n const context = useKeyboardContext();\n\n return { setEnabled: context.setEnabled, enabled: context.enabled };\n}\n\n/**\n * Hook that provides access to the layout of the currently focused input.\n *\n * @returns Object containing reanimated values for focused input.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/input/use-reanimated-focused-input|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const { input } = useReanimatedFocusedInput();\n * return <Reanimated.View style={{ height: input.value?.layout.height }} />;\n * }\n * ```\n */\nexport function useReanimatedFocusedInput() {\n const context = useKeyboardContext();\n\n return {\n input: context.layout,\n update: context.update,\n };\n}\n\n/**\n * Hook for handling focused input events, such as changes of selection, text etc.\n *\n * @param handler - Object containing focused input event handlers.\n * @param [deps] - Dependencies array for the effect.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/input/use-focused-input-handler|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * useFocusedInputHandler({\n * onChangeText: (e) => console.log('Text changed:', e.text),\n * onSelectionChange: (e) => console.log('Selection changed:', e.selection)\n * });\n * return <View />;\n * }\n * ```\n */\nexport function useFocusedInputHandler(\n handler: FocusedInputHandler,\n deps?: unknown[],\n) {\n const context = useKeyboardContext();\n\n const { doDependenciesDiffer } = useHandler<never, never>(handler, deps);\n\n const eventHandler = useEvent<\n FocusedInputSelectionChangedEvent | FocusedInputTextChangedEvent\n >(\n (event) => {\n \"worklet\";\n\n if (event.eventName.endsWith(\"onFocusedInputTextChanged\")) {\n handler.onChangeText?.(event as FocusedInputTextChangedEvent);\n }\n\n if (event.eventName.endsWith(\"onFocusedInputSelectionChanged\")) {\n handler.onSelectionChange?.(event as FocusedInputSelectionChangedEvent);\n }\n },\n [\"onFocusedInputTextChanged\", \"onFocusedInputSelectionChanged\"],\n doDependenciesDiffer,\n );\n\n useLayoutEffect(() => {\n const cleanup = context.setInputHandlers(eventHandler);\n\n return () => cleanup();\n }, deps);\n}\n\nexport * from \"./useWindowDimensions\";\nexport * from \"./useKeyboardState\";\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useState","KeyboardEvents","KeyboardController","EVENTS","getLatestState","state","isVisible","defaultSelector","useKeyboardState","selector","setState","subscriptions","map","event","addListener","willShowSubscription","e","appearance","forEach","subscription","remove"],"sources":["index.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\nimport { KeyboardEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\n\nimport type {
|
|
1
|
+
{"version":3,"names":["useEffect","useState","KeyboardEvents","KeyboardController","EVENTS","getLatestState","state","isVisible","defaultSelector","useKeyboardState","selector","setState","subscriptions","map","event","addListener","willShowSubscription","e","appearance","forEach","subscription","remove"],"sources":["index.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\nimport { KeyboardEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\n\nimport type { IKeyboardState } from \"../../types\";\n\nconst EVENTS = [\"keyboardDidShow\", \"keyboardDidHide\"] as const;\n\nconst getLatestState = () => ({\n ...KeyboardController.state(),\n isVisible: KeyboardController.isVisible(),\n});\n\ntype KeyboardStateSelector<T> = (state: IKeyboardState) => T;\n\nconst defaultSelector: KeyboardStateSelector<IKeyboardState> = (state) => state;\n\n/**\n * React Hook that represents the current keyboard state on iOS and Android.\n * It tracks keyboard visibility, height, appearance, type and other properties.\n * This hook subscribes to keyboard events and updates the state reactively.\n *\n * @template T - A type of the returned object from the `selector`.\n * @param selector - A function that receives the current keyboard state and picks only necessary properties to avoid frequent re-renders.\n * @returns Object {@link KeyboardState|containing} keyboard state information.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-state|Documentation} page for more details.\n * @example\n * ```tsx\n * function MyComponent() {\n * const isVisible = useKeyboardState((state) => state.isVisible);\n * const height = useKeyboardState((state) => state.height);\n *\n * return (\n * <View>\n * <Text>Keyboard is {isVisible ? 'visible' : 'hidden'}</Text>\n * <Text>Keyboard height: {height}</Text>\n * </View>\n * );\n * }\n * ```\n */\nfunction useKeyboardState<T = IKeyboardState>(\n selector: KeyboardStateSelector<T> = defaultSelector as KeyboardStateSelector<T>,\n): T {\n const [state, setState] = useState<T>(() => selector(getLatestState()));\n\n useEffect(() => {\n const subscriptions = EVENTS.map((event) =>\n KeyboardEvents.addListener(event, () =>\n // state will be updated by global listener first,\n // so we simply read it and don't derive data from the event\n setState(selector(getLatestState())),\n ),\n );\n // update `appearance` prematurely\n const willShowSubscription = KeyboardEvents.addListener(\n \"keyboardWillShow\",\n (e) =>\n setState(selector({ ...getLatestState(), appearance: e.appearance })),\n );\n\n // we might have missed an update between reading a value in render and\n // `addListener` in this handler, so we set it here. If there was\n // no change, React will filter out this update as a no-op.\n setState(selector(getLatestState()));\n\n return () => {\n subscriptions.forEach((subscription) => subscription.remove());\n willShowSubscription.remove();\n };\n }, []);\n\n return state;\n}\n\nexport { useKeyboardState };\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE3C,SAASC,cAAc,QAAQ,gBAAgB;AAC/C,SAASC,kBAAkB,QAAQ,cAAc;AAIjD,MAAMC,MAAM,GAAG,CAAC,iBAAiB,EAAE,iBAAiB,CAAU;AAE9D,MAAMC,cAAc,GAAGA,CAAA,MAAO;EAC5B,GAAGF,kBAAkB,CAACG,KAAK,CAAC,CAAC;EAC7BC,SAAS,EAAEJ,kBAAkB,CAACI,SAAS,CAAC;AAC1C,CAAC,CAAC;AAIF,MAAMC,eAAsD,GAAIF,KAAK,IAAKA,KAAK;;AAE/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASG,gBAAgBA,CACvBC,QAAkC,GAAGF,eAA2C,EAC7E;EACH,MAAM,CAACF,KAAK,EAAEK,QAAQ,CAAC,GAAGV,QAAQ,CAAI,MAAMS,QAAQ,CAACL,cAAc,CAAC,CAAC,CAAC,CAAC;EAEvEL,SAAS,CAAC,MAAM;IACd,MAAMY,aAAa,GAAGR,MAAM,CAACS,GAAG,CAAEC,KAAK,IACrCZ,cAAc,CAACa,WAAW,CAACD,KAAK,EAAE;IAChC;IACA;IACAH,QAAQ,CAACD,QAAQ,CAACL,cAAc,CAAC,CAAC,CAAC,CACrC,CACF,CAAC;IACD;IACA,MAAMW,oBAAoB,GAAGd,cAAc,CAACa,WAAW,CACrD,kBAAkB,EACjBE,CAAC,IACAN,QAAQ,CAACD,QAAQ,CAAC;MAAE,GAAGL,cAAc,CAAC,CAAC;MAAEa,UAAU,EAAED,CAAC,CAACC;IAAW,CAAC,CAAC,CACxE,CAAC;;IAED;IACA;IACA;IACAP,QAAQ,CAACD,QAAQ,CAACL,cAAc,CAAC,CAAC,CAAC,CAAC;IAEpC,OAAO,MAAM;MACXO,aAAa,CAACO,OAAO,CAAEC,YAAY,IAAKA,YAAY,CAACC,MAAM,CAAC,CAAC,CAAC;MAC9DL,oBAAoB,CAACK,MAAM,CAAC,CAAC;IAC/B,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOf,KAAK;AACd;AAEA,SAASG,gBAAgB","ignoreList":[]}
|
package/lib/module/index.js
CHANGED
|
@@ -5,6 +5,7 @@ export * from "./hooks";
|
|
|
5
5
|
export * from "./constants";
|
|
6
6
|
export * from "./module";
|
|
7
7
|
export * from "./types";
|
|
8
|
+
export * from "./compat";
|
|
8
9
|
export { KeyboardAvoidingView, KeyboardStickyView, KeyboardAwareScrollView,
|
|
9
10
|
// keyboard toolbar
|
|
10
11
|
KeyboardToolbar, DefaultKeyboardToolbarTheme } from "./components";
|
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["KeyboardAvoidingView","KeyboardStickyView","KeyboardAwareScrollView","KeyboardToolbar","DefaultKeyboardToolbarTheme","OverKeyboardView","KeyboardExtender"],"sources":["index.ts"],"sourcesContent":["export * from \"./bindings\";\nexport * from \"./animated\";\nexport * from \"./context\";\nexport * from \"./hooks\";\nexport * from \"./constants\";\nexport * from \"./module\";\nexport * from \"./types\";\n\nexport {\n KeyboardAvoidingView,\n KeyboardStickyView,\n KeyboardAwareScrollView,\n // keyboard toolbar\n KeyboardToolbar,\n DefaultKeyboardToolbarTheme,\n} from \"./components\";\nexport type {\n KeyboardAvoidingViewProps,\n KeyboardStickyViewProps,\n KeyboardAwareScrollViewProps,\n KeyboardToolbarProps,\n} from \"./components\";\nexport { OverKeyboardView, KeyboardExtender } from \"./views\";\n"],"mappings":"AAAA,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,SAAS;
|
|
1
|
+
{"version":3,"names":["KeyboardAvoidingView","KeyboardStickyView","KeyboardAwareScrollView","KeyboardToolbar","DefaultKeyboardToolbarTheme","OverKeyboardView","KeyboardExtender"],"sources":["index.ts"],"sourcesContent":["export * from \"./bindings\";\nexport * from \"./animated\";\nexport * from \"./context\";\nexport * from \"./hooks\";\nexport * from \"./constants\";\nexport * from \"./module\";\nexport * from \"./types\";\nexport * from \"./compat\";\n\nexport {\n KeyboardAvoidingView,\n KeyboardStickyView,\n KeyboardAwareScrollView,\n // keyboard toolbar\n KeyboardToolbar,\n DefaultKeyboardToolbarTheme,\n} from \"./components\";\nexport type {\n KeyboardAvoidingViewProps,\n KeyboardStickyViewProps,\n KeyboardAwareScrollViewProps,\n KeyboardAwareScrollViewRef,\n KeyboardToolbarProps,\n} from \"./components\";\nexport { OverKeyboardView, KeyboardExtender } from \"./views\";\n"],"mappings":"AAAA,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,UAAU;AAExB,SACEA,oBAAoB,EACpBC,kBAAkB,EAClBC,uBAAuB;AACvB;AACAC,eAAe,EACfC,2BAA2B,QACtB,cAAc;AAQrB,SAASC,gBAAgB,EAAEC,gBAAgB,QAAQ,SAAS","ignoreList":[]}
|
package/lib/module/internal.js
CHANGED
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import { useRef } from "react";
|
|
2
2
|
import { Animated } from "react-native";
|
|
3
|
-
import { registerEventHandler, unregisterEventHandler } from "./event-handler";
|
|
4
3
|
import { findNodeHandle } from "./utils/findNodeHandle";
|
|
5
4
|
/**
|
|
6
5
|
* An internal hook that helps to register workletized event handlers.
|
|
7
6
|
*
|
|
8
|
-
* @param map - Map of event handlers and their names.
|
|
9
7
|
* @param viewTagRef - Ref to the view that produces events.
|
|
10
8
|
* @returns A function that registers supplied event handlers.
|
|
11
9
|
* @example
|
|
@@ -16,26 +14,21 @@ import { findNodeHandle } from "./utils/findNodeHandle";
|
|
|
16
14
|
* );
|
|
17
15
|
* ```
|
|
18
16
|
*/
|
|
19
|
-
export function useEventHandlerRegistration(
|
|
17
|
+
export function useEventHandlerRegistration(viewTagRef) {
|
|
20
18
|
const onRegisterHandler = handler => {
|
|
21
|
-
const
|
|
19
|
+
const currentHandler = handler;
|
|
22
20
|
const attachWorkletHandlers = () => {
|
|
23
21
|
const viewTag = findNodeHandle(viewTagRef.current);
|
|
24
22
|
if (__DEV__ && !viewTag) {
|
|
25
23
|
console.warn("Can not attach worklet handlers for `react-native-keyboard-controller` because view tag can not be resolved. Be sure that `KeyboardProvider` is fully mounted before registering handlers. If you think it is a bug in library, please open an issue.");
|
|
26
24
|
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
"worklet";
|
|
33
|
-
|
|
34
|
-
functionToCall === null || functionToCall === void 0 || functionToCall(event);
|
|
35
|
-
}, eventName, viewTag);
|
|
25
|
+
if (viewTag) {
|
|
26
|
+
if ("workletEventHandler" in currentHandler) {
|
|
27
|
+
currentHandler.workletEventHandler.registerForEvents(viewTag);
|
|
28
|
+
} else {
|
|
29
|
+
currentHandler.registerForEvents(viewTag);
|
|
36
30
|
}
|
|
37
|
-
|
|
38
|
-
}));
|
|
31
|
+
}
|
|
39
32
|
};
|
|
40
33
|
if (viewTagRef.current) {
|
|
41
34
|
attachWorkletHandlers();
|
|
@@ -44,7 +37,14 @@ export function useEventHandlerRegistration(map, viewTagRef) {
|
|
|
44
37
|
queueMicrotask(attachWorkletHandlers);
|
|
45
38
|
}
|
|
46
39
|
return () => {
|
|
47
|
-
|
|
40
|
+
const viewTag = findNodeHandle(viewTagRef.current);
|
|
41
|
+
if (viewTag) {
|
|
42
|
+
if ("workletEventHandler" in currentHandler) {
|
|
43
|
+
currentHandler.workletEventHandler.unregisterFromEvents(viewTag);
|
|
44
|
+
} else {
|
|
45
|
+
currentHandler.unregisterFromEvents(viewTag);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
48
|
};
|
|
49
49
|
};
|
|
50
50
|
return onRegisterHandler;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useRef","Animated","
|
|
1
|
+
{"version":3,"names":["useRef","Animated","findNodeHandle","useEventHandlerRegistration","viewTagRef","onRegisterHandler","handler","currentHandler","attachWorkletHandlers","viewTag","current","__DEV__","console","warn","workletEventHandler","registerForEvents","queueMicrotask","unregisterFromEvents","useAnimatedValue","initialValue","config","ref","Value"],"sources":["internal.ts"],"sourcesContent":["import { useRef } from \"react\";\nimport { Animated } from \"react-native\";\n\nimport { findNodeHandle } from \"./utils/findNodeHandle\";\n\nimport type { EventHandlerProcessed } from \"react-native-reanimated\";\n\ntype ComponentOrHandle = Parameters<typeof findNodeHandle>[0];\n\ntype WorkletHandler = {\n registerForEvents: (viewTag: number) => void;\n unregisterFromEvents: (viewTag: number) => void;\n};\n\ntype WorkletHandlerOrWorkletHandlerObject =\n | WorkletHandler\n | {\n workletEventHandler: WorkletHandler;\n };\n\n/**\n * An internal hook that helps to register workletized event handlers.\n *\n * @param viewTagRef - Ref to the view that produces events.\n * @returns A function that registers supplied event handlers.\n * @example\n * ```ts\n * const setKeyboardHandlers = useEventHandlerRegistration<KeyboardHandler>(\n * keyboardEventsMap,\n * viewTagRef,\n * );\n * ```\n */\nexport function useEventHandlerRegistration(\n viewTagRef: React.MutableRefObject<ComponentOrHandle>,\n) {\n const onRegisterHandler = (handler: EventHandlerProcessed<never, never>) => {\n const currentHandler =\n handler as unknown as WorkletHandlerOrWorkletHandlerObject;\n const attachWorkletHandlers = () => {\n const viewTag = findNodeHandle(viewTagRef.current);\n\n if (__DEV__ && !viewTag) {\n console.warn(\n \"Can not attach worklet handlers for `react-native-keyboard-controller` because view tag can not be resolved. Be sure that `KeyboardProvider` is fully mounted before registering handlers. If you think it is a bug in library, please open an issue.\",\n );\n }\n\n if (viewTag) {\n if (\"workletEventHandler\" in currentHandler) {\n currentHandler.workletEventHandler.registerForEvents(viewTag);\n } else {\n currentHandler.registerForEvents(viewTag);\n }\n }\n };\n\n if (viewTagRef.current) {\n attachWorkletHandlers();\n } else {\n // view may not be mounted yet - defer registration until call-stack becomes empty\n queueMicrotask(attachWorkletHandlers);\n }\n\n return () => {\n const viewTag = findNodeHandle(viewTagRef.current);\n\n if (viewTag) {\n if (\"workletEventHandler\" in currentHandler) {\n currentHandler.workletEventHandler.unregisterFromEvents(viewTag);\n } else {\n currentHandler.unregisterFromEvents(viewTag);\n }\n }\n };\n };\n\n return onRegisterHandler;\n}\n\n/**\n * TS variant of `useAnimatedValue` hook which is added in RN 0.71\n * A better alternative of storing animated values in refs, since\n * it doesn't recreate a new `Animated.Value` object on every re-render\n * and therefore consumes less memory. We can not use a variant from\n * RN, since this library supports earlier versions of RN.\n *\n * @param initialValue - Initial value of the animated value (numeric).\n * @param config - Additional {@link Animated.AnimatedConfig|configuration} for the animated value.\n * @returns Properly memoized {@link Animated.Value|Animated} value.\n * @see https://github.com/facebook/react-native/commit/e22217fe8b9455e32695f88ca835e11442b0a937\n * @example\n * ```ts\n * const progress = useAnimatedValue(0);\n * ```\n */\nexport function useAnimatedValue(\n initialValue: number,\n config?: Animated.AnimatedConfig,\n): Animated.Value {\n const ref = useRef<Animated.Value | null>(null);\n\n if (ref.current === null) {\n ref.current = new Animated.Value(initialValue, config);\n }\n\n return ref.current;\n}\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,OAAO;AAC9B,SAASC,QAAQ,QAAQ,cAAc;AAEvC,SAASC,cAAc,QAAQ,wBAAwB;AAiBvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,2BAA2BA,CACzCC,UAAqD,EACrD;EACA,MAAMC,iBAAiB,GAAIC,OAA4C,IAAK;IAC1E,MAAMC,cAAc,GAClBD,OAA0D;IAC5D,MAAME,qBAAqB,GAAGA,CAAA,KAAM;MAClC,MAAMC,OAAO,GAAGP,cAAc,CAACE,UAAU,CAACM,OAAO,CAAC;MAElD,IAAIC,OAAO,IAAI,CAACF,OAAO,EAAE;QACvBG,OAAO,CAACC,IAAI,CACV,uPACF,CAAC;MACH;MAEA,IAAIJ,OAAO,EAAE;QACX,IAAI,qBAAqB,IAAIF,cAAc,EAAE;UAC3CA,cAAc,CAACO,mBAAmB,CAACC,iBAAiB,CAACN,OAAO,CAAC;QAC/D,CAAC,MAAM;UACLF,cAAc,CAACQ,iBAAiB,CAACN,OAAO,CAAC;QAC3C;MACF;IACF,CAAC;IAED,IAAIL,UAAU,CAACM,OAAO,EAAE;MACtBF,qBAAqB,CAAC,CAAC;IACzB,CAAC,MAAM;MACL;MACAQ,cAAc,CAACR,qBAAqB,CAAC;IACvC;IAEA,OAAO,MAAM;MACX,MAAMC,OAAO,GAAGP,cAAc,CAACE,UAAU,CAACM,OAAO,CAAC;MAElD,IAAID,OAAO,EAAE;QACX,IAAI,qBAAqB,IAAIF,cAAc,EAAE;UAC3CA,cAAc,CAACO,mBAAmB,CAACG,oBAAoB,CAACR,OAAO,CAAC;QAClE,CAAC,MAAM;UACLF,cAAc,CAACU,oBAAoB,CAACR,OAAO,CAAC;QAC9C;MACF;IACF,CAAC;EACH,CAAC;EAED,OAAOJ,iBAAiB;AAC1B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASa,gBAAgBA,CAC9BC,YAAoB,EACpBC,MAAgC,EAChB;EAChB,MAAMC,GAAG,GAAGrB,MAAM,CAAwB,IAAI,CAAC;EAE/C,IAAIqB,GAAG,CAACX,OAAO,KAAK,IAAI,EAAE;IACxBW,GAAG,CAACX,OAAO,GAAG,IAAIT,QAAQ,CAACqB,KAAK,CAACH,YAAY,EAAEC,MAAM,CAAC;EACxD;EAEA,OAAOC,GAAG,CAACX,OAAO;AACpB","ignoreList":[]}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
+
import codegenNativeCommands from "react-native/Libraries/Utilities/codegenNativeCommands";
|
|
1
2
|
import codegenNativeComponent from "react-native/Libraries/Utilities/codegenNativeComponent";
|
|
3
|
+
export const Commands = codegenNativeCommands({
|
|
4
|
+
supportedCommands: ["synchronizeFocusedInputLayout"]
|
|
5
|
+
});
|
|
2
6
|
export default codegenNativeComponent("KeyboardControllerView", {
|
|
3
7
|
interfaceOnly: true
|
|
4
8
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["codegenNativeComponent","interfaceOnly"],"sources":["KeyboardControllerViewNativeComponent.ts"],"sourcesContent":["import codegenNativeComponent from \"react-native/Libraries/Utilities/codegenNativeComponent\";\n\nimport type { HostComponent } from \"react-native\";\nimport type { ViewProps } from \"react-native/Libraries/Components/View/ViewPropTypes\";\nimport type {\n DirectEventHandler,\n Double,\n Int32,\n} from \"react-native/Libraries/Types/CodegenTypes\";\n\ntype KeyboardMoveEvent = Readonly<{\n height: Double;\n progress: Double;\n duration: Int32;\n target: Int32;\n}>;\n\ntype FocusedInputLayoutChangedEvent = Readonly<{\n target: Int32;\n parentScrollViewTarget: Int32;\n layout: {\n x: Double;\n y: Double;\n width: Double;\n height: Double;\n absoluteX: Double;\n absoluteY: Double;\n };\n}>;\n\ntype FocusedInputTextChangedEvent = Readonly<{\n text: string;\n}>;\n\ntype FocusedInputSelectionChangedEvent = Readonly<{\n target: Int32;\n selection: {\n start: {\n x: Double;\n y: Double;\n position: Int32;\n };\n end: {\n x: Double;\n y: Double;\n position: Int32;\n };\n };\n}>;\n\nexport interface NativeProps extends ViewProps {\n // props\n enabled?: boolean;\n statusBarTranslucent?: boolean;\n navigationBarTranslucent?: boolean;\n preserveEdgeToEdge?: boolean;\n // callbacks\n /// keyboard\n onKeyboardMoveStart?: DirectEventHandler<KeyboardMoveEvent>;\n onKeyboardMove?: DirectEventHandler<KeyboardMoveEvent>;\n onKeyboardMoveEnd?: DirectEventHandler<KeyboardMoveEvent>;\n onKeyboardMoveInteractive?: DirectEventHandler<KeyboardMoveEvent>;\n /// focused input\n onFocusedInputLayoutChanged?: DirectEventHandler<FocusedInputLayoutChangedEvent>;\n onFocusedInputTextChanged?: DirectEventHandler<FocusedInputTextChangedEvent>;\n onFocusedInputSelectionChanged?: DirectEventHandler<FocusedInputSelectionChangedEvent>;\n}\n\nexport default codegenNativeComponent<NativeProps>(\"KeyboardControllerView\", {\n interfaceOnly: true,\n}) as HostComponent<NativeProps>;\n"],"mappings":"AAAA,OAAOA,sBAAsB,MAAM,yDAAyD;
|
|
1
|
+
{"version":3,"names":["codegenNativeCommands","codegenNativeComponent","Commands","supportedCommands","interfaceOnly"],"sources":["KeyboardControllerViewNativeComponent.ts"],"sourcesContent":["import codegenNativeCommands from \"react-native/Libraries/Utilities/codegenNativeCommands\";\nimport codegenNativeComponent from \"react-native/Libraries/Utilities/codegenNativeComponent\";\n\nimport type { HostComponent } from \"react-native\";\nimport type { ViewProps } from \"react-native/Libraries/Components/View/ViewPropTypes\";\nimport type {\n DirectEventHandler,\n Double,\n Int32,\n} from \"react-native/Libraries/Types/CodegenTypes\";\n\ntype KeyboardMoveEvent = Readonly<{\n height: Double;\n progress: Double;\n duration: Int32;\n target: Int32;\n}>;\n\ntype FocusedInputLayoutChangedEvent = Readonly<{\n target: Int32;\n parentScrollViewTarget: Int32;\n layout: {\n x: Double;\n y: Double;\n width: Double;\n height: Double;\n absoluteX: Double;\n absoluteY: Double;\n };\n}>;\n\ntype FocusedInputTextChangedEvent = Readonly<{\n text: string;\n}>;\n\ntype FocusedInputSelectionChangedEvent = Readonly<{\n target: Int32;\n selection: {\n start: {\n x: Double;\n y: Double;\n position: Int32;\n };\n end: {\n x: Double;\n y: Double;\n position: Int32;\n };\n };\n}>;\n\nexport interface NativeProps extends ViewProps {\n // props\n enabled?: boolean;\n statusBarTranslucent?: boolean;\n navigationBarTranslucent?: boolean;\n preserveEdgeToEdge?: boolean;\n // callbacks\n /// keyboard\n onKeyboardMoveStart?: DirectEventHandler<KeyboardMoveEvent>;\n onKeyboardMove?: DirectEventHandler<KeyboardMoveEvent>;\n onKeyboardMoveEnd?: DirectEventHandler<KeyboardMoveEvent>;\n onKeyboardMoveInteractive?: DirectEventHandler<KeyboardMoveEvent>;\n /// focused input\n onFocusedInputLayoutChanged?: DirectEventHandler<FocusedInputLayoutChangedEvent>;\n onFocusedInputTextChanged?: DirectEventHandler<FocusedInputTextChangedEvent>;\n onFocusedInputSelectionChanged?: DirectEventHandler<FocusedInputSelectionChangedEvent>;\n}\n\ninterface NativeCommands {\n synchronizeFocusedInputLayout: (\n viewRef: React.ElementRef<HostComponent<NativeProps>>,\n ) => void;\n}\n\nexport const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({\n supportedCommands: [\"synchronizeFocusedInputLayout\"],\n});\n\nexport default codegenNativeComponent<NativeProps>(\"KeyboardControllerView\", {\n interfaceOnly: true,\n}) as HostComponent<NativeProps>;\n"],"mappings":"AAAA,OAAOA,qBAAqB,MAAM,wDAAwD;AAC1F,OAAOC,sBAAsB,MAAM,yDAAyD;AA0E5F,OAAO,MAAMC,QAAwB,GAAGF,qBAAqB,CAAiB;EAC5EG,iBAAiB,EAAE,CAAC,+BAA+B;AACrD,CAAC,CAAC;AAEF,eAAeF,sBAAsB,CAAc,wBAAwB,EAAE;EAC3EG,aAAa,EAAE;AACjB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["internal.ts"],"sourcesContent":["import type { EmitterSubscription } from \"react-native\";\n\nexport type FocusedInputAvailableEvents
|
|
1
|
+
{"version":3,"names":[],"sources":["internal.ts"],"sourcesContent":["import type { EmitterSubscription } from \"react-native\";\n\nexport type FocusedInputAvailableEvents =\n | \"focusDidSet\"\n | \"layoutDidSynchronize\";\nexport type FocusedInputEventData = {\n current: number;\n count: number;\n};\nexport type FocusedInputEventsModule = {\n addListener: (\n name: FocusedInputAvailableEvents,\n cb: (e: FocusedInputEventData) => void,\n ) => EmitterSubscription;\n};\nexport type WindowDimensionsAvailableEvents = \"windowDidResize\";\nexport type WindowDimensionsEventData = {\n width: number;\n height: number;\n};\nexport type WindowDimensionsEventsModule = {\n addListener: (\n name: WindowDimensionsAvailableEvents,\n cb: (e: WindowDimensionsEventData) => void,\n ) => EmitterSubscription;\n};\n"],"mappings":"","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["module.ts"],"sourcesContent":["import type { EmitterSubscription, TextInputProps } from \"react-native\";\n\n// Event module declarations\nexport type KeyboardControllerEvents =\n | \"keyboardWillShow\"\n | \"keyboardDidShow\"\n | \"keyboardWillHide\"\n | \"keyboardDidHide\";\nexport type KeyboardEventData = {\n /** Height of the keyboard. */\n height: number;\n /** Duration of the keyboard animation. */\n duration: number;\n /** Timestamp of the last keyboard event. */\n timestamp: number;\n /** Tag of the focused `TextInput`. */\n target: number;\n /** `keyboardType` property from focused `TextInput`. */\n type: NonNullable<TextInputProps[\"keyboardType\"]>;\n /** Keyboard appearance. Can be one of `dark` or `light`. */\n appearance: \"dark\" | \"light\";\n};\n/**\n * An object that represent current keyboard state.\n */\nexport type
|
|
1
|
+
{"version":3,"names":[],"sources":["module.ts"],"sourcesContent":["import type { EmitterSubscription, TextInputProps } from \"react-native\";\n\n// Event module declarations\nexport type KeyboardControllerEvents =\n | \"keyboardWillShow\"\n | \"keyboardDidShow\"\n | \"keyboardWillHide\"\n | \"keyboardDidHide\";\nexport type KeyboardEventData = {\n /** Height of the keyboard. */\n height: number;\n /** Duration of the keyboard animation. */\n duration: number;\n /** Timestamp of the last keyboard event. */\n timestamp: number;\n /** Tag of the focused `TextInput`. */\n target: number;\n /** `keyboardType` property from focused `TextInput`. */\n type: NonNullable<TextInputProps[\"keyboardType\"]>;\n /** Keyboard appearance. Can be one of `dark` or `light`. */\n appearance: \"dark\" | \"light\";\n};\n/**\n * An object that represent current keyboard state.\n */\nexport type IKeyboardState = {\n /** Whether the keyboard is currently visible. */\n isVisible: boolean;\n} & KeyboardEventData;\nexport type KeyboardEventsModule = {\n /**\n * The `addListener` function connects a JavaScript function to an identified native\n * keyboard notification event.\n *\n * This function then returns the reference to the listener.\n *\n * `name` is the string that identifies the event you're listening for. This\n * can be any of the following:\n *\n * - `keyboardWillShow`;\n * - `keyboardDidShow`;\n * - `keyboardWillHide`;\n * - `keyboardDidHide`.\n */\n addListener: (\n name: KeyboardControllerEvents,\n cb: (e: KeyboardEventData) => void,\n ) => EmitterSubscription;\n};\nexport type Direction = \"next\" | \"prev\" | \"current\";\nexport type DismissOptions = {\n /**\n * A boolean property indicating whether focus should be kept on the input after dismissing the keyboard. Default is `false`.\n */\n keepFocus: boolean;\n /**\n * A boolean property controlling whether dismissal should be animated. Default is `true`.\n */\n animated: boolean;\n};\nexport type KeyboardControllerModule = {\n // android only\n /**\n * Sets default `windowSoftInputMode` (the one that declared in `AndroidManifest.xml`).\n *\n * @platform android\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#setdefaultmode-|docs} page for more details.\n */\n setDefaultMode: () => void;\n /**\n * Changes `windowSoftInputMode` on Android.\n *\n * @platform android\n * @see AndroidSoftInputModes for all possible values and {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#setinputmode-|docs} page for more details.\n */\n setInputMode: (mode: number) => void;\n // ios only\n /**\n * A method that preloads the keyboard. It's useful when you want to avoid a delay when the user focuses the first input.\n *\n * @platform ios\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#preload-|docs} page for more details.\n */\n preload: () => void;\n // all platforms\n /**\n * Dismisses the active keyboard. Removes a focus by default, but allows to pass `{keepFocus: true}` to keep focus.\n * If you want to close keyboard immediately pass `{animated: false}`.\n *\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#dismiss|docs} page for more details.\n */\n dismiss: (options?: Partial<DismissOptions>) => Promise<void>;\n /**\n * Moves focus to the specified direction (`next`, `prev` or `current` to restore a focus).\n *\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#setfocusto|docs} page for more details.\n */\n setFocusTo: (direction: Direction) => void;\n /**\n * Whether the keyboard is fully visible.\n *\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#isvisible|docs} page for more details.\n */\n isVisible: () => boolean;\n /**\n * Method that returns current keyboard state.\n *\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#state|docs} page for more details.\n */\n state: () => KeyboardEventData;\n};\nexport type KeyboardControllerNativeModule = {\n // android only\n setDefaultMode: () => void;\n setInputMode: (mode: number) => void;\n // ios only\n preload: () => void;\n // all platforms\n dismiss: (keepFocus: boolean, animated: boolean) => void;\n setFocusTo: (direction: Direction) => void;\n // native event module stuff\n addListener: (eventName: string) => void;\n removeListeners: (count: number) => void;\n};\n"],"mappings":"","ignoreList":[]}
|
|
@@ -22,6 +22,9 @@ export declare const WindowDimensionsEvents: WindowDimensionsEventsModule;
|
|
|
22
22
|
* @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller-view|Documentation} page for more details.
|
|
23
23
|
*/
|
|
24
24
|
export declare const KeyboardControllerView: React.FC<KeyboardControllerProps>;
|
|
25
|
+
export declare const KeyboardControllerViewCommands: {
|
|
26
|
+
synchronizeFocusedInputLayout: (_ref: React.Component<KeyboardControllerProps> | null) => void;
|
|
27
|
+
};
|
|
25
28
|
/**
|
|
26
29
|
* A view that defines a region on the screen, where gestures will control the keyboard position.
|
|
27
30
|
*
|
|
@@ -8,6 +8,7 @@ export declare const KeyboardEvents: KeyboardEventsModule;
|
|
|
8
8
|
export declare const FocusedInputEvents: FocusedInputEventsModule;
|
|
9
9
|
export declare const WindowDimensionsEvents: WindowDimensionsEventsModule;
|
|
10
10
|
export declare const KeyboardControllerView: React.FC<KeyboardControllerProps>;
|
|
11
|
+
export declare const KeyboardControllerViewCommands: any;
|
|
11
12
|
export declare const KeyboardGestureArea: React.FC<KeyboardGestureAreaProps>;
|
|
12
13
|
export declare const RCTOverKeyboardView: React.FC<OverKeyboardViewProps>;
|
|
13
14
|
export declare const KeyboardBackgroundView: React.FC<KeyboardBackgroundViewProps>;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export declare const KeyboardState: {
|
|
2
|
+
UNKNOWN: number;
|
|
3
|
+
OPENING: number;
|
|
4
|
+
OPEN: number;
|
|
5
|
+
CLOSING: number;
|
|
6
|
+
CLOSED: number;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* A compatibility layer for migration from https://docs.swmansion.com/react-native-reanimated/docs/device/useAnimatedKeyboard.
|
|
10
|
+
*
|
|
11
|
+
* @returns An object containing `height` and `state` properties represented as `SharedValue<number>`.
|
|
12
|
+
* @example
|
|
13
|
+
* ```ts
|
|
14
|
+
* import { useAnimatedKeyboard, useAnimatedStyle } from 'react-native-keyboard-controller';
|
|
15
|
+
*
|
|
16
|
+
* export default function App() {
|
|
17
|
+
* const keyboard = useAnimatedKeyboard();
|
|
18
|
+
*
|
|
19
|
+
* const animatedStyles = useAnimatedStyle(() => ({
|
|
20
|
+
* transform: [{ translateY: -keyboard.height.value }],
|
|
21
|
+
* }));
|
|
22
|
+
* }
|
|
23
|
+
*/
|
|
24
|
+
export declare const useAnimatedKeyboard: () => {
|
|
25
|
+
height: import("react-native-reanimated").SharedValue<number>;
|
|
26
|
+
state: import("react-native-reanimated").SharedValue<number>;
|
|
27
|
+
};
|
|
@@ -12,6 +12,9 @@ export type KeyboardAwareScrollViewProps = {
|
|
|
12
12
|
/** Custom component for `ScrollView`. Default is `ScrollView`. */
|
|
13
13
|
ScrollViewComponent?: React.ComponentType<ScrollViewProps>;
|
|
14
14
|
} & ScrollViewProps;
|
|
15
|
+
export type KeyboardAwareScrollViewRef = {
|
|
16
|
+
assureFocusedInputVisible: () => void;
|
|
17
|
+
} & ScrollView;
|
|
15
18
|
/**
|
|
16
19
|
* A ScrollView component that automatically handles keyboard appearance and disappearance
|
|
17
20
|
* by adjusting its content position to ensure the focused input remains visible.
|
|
@@ -42,5 +45,5 @@ declare const KeyboardAwareScrollView: React.ForwardRefExoticComponent<{
|
|
|
42
45
|
ScrollViewComponent?: React.ComponentType<ScrollViewProps>;
|
|
43
46
|
} & ScrollViewProps & {
|
|
44
47
|
children?: React.ReactNode | undefined;
|
|
45
|
-
} & React.RefAttributes<
|
|
48
|
+
} & React.RefAttributes<KeyboardAwareScrollViewRef>>;
|
|
46
49
|
export default KeyboardAwareScrollView;
|
|
@@ -4,5 +4,5 @@ export { default as KeyboardAwareScrollView } from "./KeyboardAwareScrollView";
|
|
|
4
4
|
export { default as KeyboardToolbar, DefaultKeyboardToolbarTheme, } from "./KeyboardToolbar";
|
|
5
5
|
export type { KeyboardAvoidingViewProps } from "./KeyboardAvoidingView";
|
|
6
6
|
export type { KeyboardStickyViewProps } from "./KeyboardStickyView";
|
|
7
|
-
export type { KeyboardAwareScrollViewProps } from "./KeyboardAwareScrollView";
|
|
7
|
+
export type { KeyboardAwareScrollViewProps, KeyboardAwareScrollViewRef, } from "./KeyboardAwareScrollView";
|
|
8
8
|
export type { KeyboardToolbarProps } from "./KeyboardToolbar";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Animated } from "react-native";
|
|
2
|
-
import type {
|
|
2
|
+
import type { FocusedInputLayoutChangedEvent } from "./types";
|
|
3
3
|
import type React from "react";
|
|
4
|
-
import type { SharedValue } from "react-native-reanimated";
|
|
4
|
+
import type { EventHandlerProcessed, SharedValue } from "react-native-reanimated";
|
|
5
5
|
export type AnimatedContext = {
|
|
6
6
|
/**
|
|
7
7
|
* A value between `0` and `1` indicating keyboard position, where `0` means keyboard is closed and `1` means keyboard is fully visible.
|
|
@@ -29,10 +29,12 @@ export type KeyboardAnimationContext = {
|
|
|
29
29
|
reanimated: ReanimatedContext;
|
|
30
30
|
/** Layout of the focused `TextInput` represented as `SharedValue`. */
|
|
31
31
|
layout: SharedValue<FocusedInputLayoutChangedEvent | null>;
|
|
32
|
+
/** Method for updating info about focused input layout. */
|
|
33
|
+
update: () => Promise<void>;
|
|
32
34
|
/** Method for setting workletized keyboard handlers. */
|
|
33
|
-
setKeyboardHandlers: (handlers:
|
|
35
|
+
setKeyboardHandlers: (handlers: EventHandlerProcessed<never, never>) => () => void;
|
|
34
36
|
/** Method for setting workletized handlers for tracking focused input events. */
|
|
35
|
-
setInputHandlers: (handlers:
|
|
37
|
+
setInputHandlers: (handlers: EventHandlerProcessed<never, never>) => () => void;
|
|
36
38
|
/** Method to enable/disable KeyboardController library. */
|
|
37
39
|
setEnabled: React.Dispatch<React.SetStateAction<boolean>>;
|
|
38
40
|
};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import type { AnimatedContext, ReanimatedContext } from "../context";
|
|
2
2
|
import type { FocusedInputHandler, KeyboardHandler } from "../types";
|
|
3
|
-
import type { DependencyList } from "react";
|
|
4
3
|
/**
|
|
5
4
|
* Hook that sets the Android soft input mode to adjust resize on mount and
|
|
6
5
|
* restores default mode on unmount. This ensures the keyboard behavior is consistent
|
|
@@ -77,7 +76,7 @@ export declare const useReanimatedKeyboardAnimation: () => ReanimatedContext;
|
|
|
77
76
|
* }
|
|
78
77
|
* ```
|
|
79
78
|
*/
|
|
80
|
-
export declare function useGenericKeyboardHandler(handler: KeyboardHandler, deps?:
|
|
79
|
+
export declare function useGenericKeyboardHandler(handler: KeyboardHandler, deps?: unknown[]): void;
|
|
81
80
|
/**
|
|
82
81
|
* Hook that gives an access to each aspect of keyboard movement with workletized `onStart`/`onMove`/`onInteractive`/`onEnd` handlers.
|
|
83
82
|
*
|
|
@@ -109,7 +108,7 @@ export declare function useGenericKeyboardHandler(handler: KeyboardHandler, deps
|
|
|
109
108
|
* }
|
|
110
109
|
* ```
|
|
111
110
|
*/
|
|
112
|
-
export declare function useKeyboardHandler(handler: KeyboardHandler, deps?:
|
|
111
|
+
export declare function useKeyboardHandler(handler: KeyboardHandler, deps?: unknown[]): void;
|
|
113
112
|
/**
|
|
114
113
|
* Hook for controlling keyboard controller module.
|
|
115
114
|
* Allows to disable/enable it and check the actual state (whether it's enabled or not).
|
|
@@ -152,6 +151,7 @@ export declare function useKeyboardController(): {
|
|
|
152
151
|
*/
|
|
153
152
|
export declare function useReanimatedFocusedInput(): {
|
|
154
153
|
input: import("react-native-reanimated").SharedValue<import("../types").FocusedInputLayoutChangedEvent | null>;
|
|
154
|
+
update: () => Promise<void>;
|
|
155
155
|
};
|
|
156
156
|
/**
|
|
157
157
|
* Hook for handling focused input events, such as changes of selection, text etc.
|
|
@@ -170,6 +170,6 @@ export declare function useReanimatedFocusedInput(): {
|
|
|
170
170
|
* }
|
|
171
171
|
* ```
|
|
172
172
|
*/
|
|
173
|
-
export declare function useFocusedInputHandler(handler: FocusedInputHandler, deps?:
|
|
173
|
+
export declare function useFocusedInputHandler(handler: FocusedInputHandler, deps?: unknown[]): void;
|
|
174
174
|
export * from "./useWindowDimensions";
|
|
175
175
|
export * from "./useKeyboardState";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
type KeyboardStateSelector<T> = (state:
|
|
1
|
+
import type { IKeyboardState } from "../../types";
|
|
2
|
+
type KeyboardStateSelector<T> = (state: IKeyboardState) => T;
|
|
3
3
|
/**
|
|
4
4
|
* React Hook that represents the current keyboard state on iOS and Android.
|
|
5
5
|
* It tracks keyboard visibility, height, appearance, type and other properties.
|
|
@@ -24,5 +24,5 @@ type KeyboardStateSelector<T> = (state: KeyboardState) => T;
|
|
|
24
24
|
* }
|
|
25
25
|
* ```
|
|
26
26
|
*/
|
|
27
|
-
declare function useKeyboardState<T =
|
|
27
|
+
declare function useKeyboardState<T = IKeyboardState>(selector?: KeyboardStateSelector<T>): T;
|
|
28
28
|
export { useKeyboardState };
|
|
@@ -5,6 +5,7 @@ export * from "./hooks";
|
|
|
5
5
|
export * from "./constants";
|
|
6
6
|
export * from "./module";
|
|
7
7
|
export * from "./types";
|
|
8
|
+
export * from "./compat";
|
|
8
9
|
export { KeyboardAvoidingView, KeyboardStickyView, KeyboardAwareScrollView, KeyboardToolbar, DefaultKeyboardToolbarTheme, } from "./components";
|
|
9
|
-
export type { KeyboardAvoidingViewProps, KeyboardStickyViewProps, KeyboardAwareScrollViewProps, KeyboardToolbarProps, } from "./components";
|
|
10
|
+
export type { KeyboardAvoidingViewProps, KeyboardStickyViewProps, KeyboardAwareScrollViewProps, KeyboardAwareScrollViewRef, KeyboardToolbarProps, } from "./components";
|
|
10
11
|
export { OverKeyboardView, KeyboardExtender } from "./views";
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { Animated } from "react-native";
|
|
2
2
|
import { findNodeHandle } from "./utils/findNodeHandle";
|
|
3
|
-
type
|
|
3
|
+
import type { EventHandlerProcessed } from "react-native-reanimated";
|
|
4
4
|
type ComponentOrHandle = Parameters<typeof findNodeHandle>[0];
|
|
5
5
|
/**
|
|
6
6
|
* An internal hook that helps to register workletized event handlers.
|
|
7
7
|
*
|
|
8
|
-
* @param map - Map of event handlers and their names.
|
|
9
8
|
* @param viewTagRef - Ref to the view that produces events.
|
|
10
9
|
* @returns A function that registers supplied event handlers.
|
|
11
10
|
* @example
|
|
@@ -16,7 +15,7 @@ type ComponentOrHandle = Parameters<typeof findNodeHandle>[0];
|
|
|
16
15
|
* );
|
|
17
16
|
* ```
|
|
18
17
|
*/
|
|
19
|
-
export declare function useEventHandlerRegistration
|
|
18
|
+
export declare function useEventHandlerRegistration(viewTagRef: React.MutableRefObject<ComponentOrHandle>): (handler: EventHandlerProcessed<never, never>) => () => void;
|
|
20
19
|
/**
|
|
21
20
|
* TS variant of `useAnimatedValue` hook which is added in RN 0.71
|
|
22
21
|
* A better alternative of storing animated values in refs, since
|
|
@@ -50,5 +50,9 @@ export interface NativeProps extends ViewProps {
|
|
|
50
50
|
onFocusedInputTextChanged?: DirectEventHandler<FocusedInputTextChangedEvent>;
|
|
51
51
|
onFocusedInputSelectionChanged?: DirectEventHandler<FocusedInputSelectionChangedEvent>;
|
|
52
52
|
}
|
|
53
|
+
interface NativeCommands {
|
|
54
|
+
synchronizeFocusedInputLayout: (viewRef: React.ElementRef<HostComponent<NativeProps>>) => void;
|
|
55
|
+
}
|
|
56
|
+
export declare const Commands: NativeCommands;
|
|
53
57
|
declare const _default: HostComponent<NativeProps>;
|
|
54
58
|
export default _default;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { EmitterSubscription } from "react-native";
|
|
2
|
-
export type FocusedInputAvailableEvents = "focusDidSet";
|
|
2
|
+
export type FocusedInputAvailableEvents = "focusDidSet" | "layoutDidSynchronize";
|
|
3
3
|
export type FocusedInputEventData = {
|
|
4
4
|
current: number;
|
|
5
5
|
count: number;
|
|
@@ -17,7 +17,7 @@ export type KeyboardEventData = {
|
|
|
17
17
|
/**
|
|
18
18
|
* An object that represent current keyboard state.
|
|
19
19
|
*/
|
|
20
|
-
export type
|
|
20
|
+
export type IKeyboardState = {
|
|
21
21
|
/** Whether the keyboard is currently visible. */
|
|
22
22
|
isVisible: boolean;
|
|
23
23
|
} & KeyboardEventData;
|
|
@@ -73,10 +73,11 @@ export type KeyboardControllerModule = {
|
|
|
73
73
|
preload: () => void;
|
|
74
74
|
/**
|
|
75
75
|
* Dismisses the active keyboard. Removes a focus by default, but allows to pass `{keepFocus: true}` to keep focus.
|
|
76
|
+
* If you want to close keyboard immediately pass `{animated: false}`.
|
|
76
77
|
*
|
|
77
78
|
* @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#dismiss|docs} page for more details.
|
|
78
79
|
*/
|
|
79
|
-
dismiss: (options?: DismissOptions) => Promise<void>;
|
|
80
|
+
dismiss: (options?: Partial<DismissOptions>) => Promise<void>;
|
|
80
81
|
/**
|
|
81
82
|
* Moves focus to the specified direction (`next`, `prev` or `current` to restore a focus).
|
|
82
83
|
*
|
package/package.json
CHANGED