react-native-keyboard-controller 1.21.12 → 1.21.14
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/main/java/com/reactnativekeyboardcontroller/interactive/KeyboardAnimationController.kt +6 -0
- package/android/src/main/java/com/reactnativekeyboardcontroller/listeners/FocusedInputObserver.kt +1 -1
- package/android/src/main/java/com/reactnativekeyboardcontroller/views/ClippingScrollViewDecoratorView.kt +12 -7
- package/ios/core/KeyboardControllerConfiguration.swift +16 -0
- package/ios/delegates/KCTextInputCompositeDelegate.swift +37 -18
- package/ios/extensions/UIWindow.swift +5 -1
- package/ios/objc/{UITextView+DelegateManager.h → TextInput+DelegateManager.h} +7 -1
- package/ios/objc/TextInput+DelegateManager.m +55 -0
- package/ios/observers/FocusedInputObserver.swift +3 -5
- package/ios/observers/movement/KeyboardTrackingView.swift +6 -4
- package/lib/commonjs/components/KeyboardChatScrollView/index.js +6 -0
- package/lib/commonjs/components/KeyboardChatScrollView/index.js.map +1 -1
- package/lib/commonjs/components/KeyboardChatScrollView/useFrozenPadding/index.js +62 -0
- package/lib/commonjs/components/KeyboardChatScrollView/useFrozenPadding/index.js.map +1 -0
- package/lib/module/components/KeyboardChatScrollView/index.js +6 -0
- package/lib/module/components/KeyboardChatScrollView/index.js.map +1 -1
- package/lib/module/components/KeyboardChatScrollView/useFrozenPadding/index.js +57 -0
- package/lib/module/components/KeyboardChatScrollView/useFrozenPadding/index.js.map +1 -0
- package/lib/typescript/components/KeyboardChatScrollView/useFrozenPadding/index.d.ts +30 -0
- package/package.json +1 -1
- package/src/components/KeyboardChatScrollView/index.tsx +7 -0
- package/src/components/KeyboardChatScrollView/useFrozenPadding/index.ts +83 -0
- package/ios/objc/UITextView+DelegateManager.m +0 -26
|
@@ -337,6 +337,12 @@ internal class KeyboardAnimationController {
|
|
|
337
337
|
currentSpringAnimation = null
|
|
338
338
|
|
|
339
339
|
pendingRequestOnReady = null
|
|
340
|
+
|
|
341
|
+
// `animateToFinish` clears this flag before finishing the controller, but gestures that
|
|
342
|
+
// end via `cancel()`/`onFinished`/`onCancelled` never pass through it. A stranded `true`
|
|
343
|
+
// makes `KeyboardAnimationCallback` treat the keyboard as moving forever, which disables
|
|
344
|
+
// its desynchronized-state recovery for the rest of the process lifetime.
|
|
345
|
+
InteractiveKeyboardProvider.isInteractive = false
|
|
340
346
|
}
|
|
341
347
|
|
|
342
348
|
/**
|
package/android/src/main/java/com/reactnativekeyboardcontroller/listeners/FocusedInputObserver.kt
CHANGED
|
@@ -106,7 +106,7 @@ class FocusedInputObserver(
|
|
|
106
106
|
// remove it asynchronously to avoid crash in stripe input
|
|
107
107
|
// see https://github.com/stripe/stripe-android/issues/10178
|
|
108
108
|
input.post {
|
|
109
|
-
input.removeTextChangedListener(
|
|
109
|
+
watcher?.let { input.removeTextChangedListener(it) }
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
112
|
selectionSubscription?.invoke()
|
|
@@ -5,6 +5,7 @@ import android.view.MotionEvent
|
|
|
5
5
|
import android.view.View
|
|
6
6
|
import android.view.ViewGroup
|
|
7
7
|
import android.widget.ScrollView
|
|
8
|
+
import androidx.core.widget.NestedScrollView
|
|
8
9
|
import com.facebook.react.uimanager.ThemedReactContext
|
|
9
10
|
import com.facebook.react.views.view.ReactViewGroup
|
|
10
11
|
import com.reactnativekeyboardcontroller.extensions.px
|
|
@@ -100,7 +101,7 @@ class ClippingScrollViewDecoratorView(
|
|
|
100
101
|
}
|
|
101
102
|
|
|
102
103
|
private fun shouldUsePaddingScrollWorkaround(
|
|
103
|
-
scrollView:
|
|
104
|
+
scrollView: ViewGroup,
|
|
104
105
|
event: MotionEvent,
|
|
105
106
|
): Boolean {
|
|
106
107
|
val contentView = scrollView.getChildAt(0) ?: return false
|
|
@@ -115,7 +116,7 @@ class ClippingScrollViewDecoratorView(
|
|
|
115
116
|
}
|
|
116
117
|
|
|
117
118
|
private fun dispatchWithExpandedContentRange(
|
|
118
|
-
scrollView:
|
|
119
|
+
scrollView: ViewGroup,
|
|
119
120
|
event: MotionEvent,
|
|
120
121
|
): Boolean {
|
|
121
122
|
val contentView = scrollView.getChildAt(0)
|
|
@@ -136,7 +137,7 @@ class ClippingScrollViewDecoratorView(
|
|
|
136
137
|
}
|
|
137
138
|
|
|
138
139
|
private fun isTouchInScrollContent(
|
|
139
|
-
scrollView:
|
|
140
|
+
scrollView: ViewGroup,
|
|
140
141
|
event: MotionEvent,
|
|
141
142
|
): Boolean {
|
|
142
143
|
val contentView = scrollView.getChildAt(0) ?: return false
|
|
@@ -158,11 +159,15 @@ class ClippingScrollViewDecoratorView(
|
|
|
158
159
|
)
|
|
159
160
|
}
|
|
160
161
|
|
|
161
|
-
private fun findScrollView(view: View?):
|
|
162
|
-
var result:
|
|
162
|
+
private fun findScrollView(view: View?): ViewGroup? {
|
|
163
|
+
var result: ViewGroup? = null
|
|
163
164
|
|
|
164
|
-
|
|
165
|
-
|
|
165
|
+
// Match NestedScrollView too: with React Native's `useNestedScrollViewAndroid`
|
|
166
|
+
// feature flag (RN 0.85+), ScrollView renders as a NestedScrollView subclass
|
|
167
|
+
// (a FrameLayout, not an android.widget.ScrollView). Both extend the scroll
|
|
168
|
+
// range via bottom padding + clipToPadding=false the same way.
|
|
169
|
+
if (view is ScrollView || view is NestedScrollView) {
|
|
170
|
+
result = view as ViewGroup
|
|
166
171
|
} else if (view is ViewGroup) {
|
|
167
172
|
var i = 0
|
|
168
173
|
while (i < view.childCount && result == null) {
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
//
|
|
2
|
+
// KeyboardControllerConfiguration.swift
|
|
3
|
+
// Pods
|
|
4
|
+
//
|
|
5
|
+
// Created by Kiryl Ziusko on 25/06/2026.
|
|
6
|
+
//
|
|
7
|
+
|
|
8
|
+
enum KeyboardControllerConfiguration {
|
|
9
|
+
static var usesKeyboardLayoutGuideTracking: Bool {
|
|
10
|
+
if #available(iOS 26.0, *) {
|
|
11
|
+
return true
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
return false
|
|
15
|
+
}
|
|
16
|
+
}
|
|
@@ -65,7 +65,7 @@ class KCTextInputCompositeDelegate: NSObject, UITextViewDelegate, UITextFieldDel
|
|
|
65
65
|
// MARK: setters/getters
|
|
66
66
|
|
|
67
67
|
func setTextViewDelegate(delegate: UITextViewDelegate?) {
|
|
68
|
-
// remove KVO from any old
|
|
68
|
+
// remove KVO from any old textField
|
|
69
69
|
if let oldTextField = observedTextFieldForSelection {
|
|
70
70
|
removeSelectionRangeObserver(from: oldTextField)
|
|
71
71
|
}
|
|
@@ -96,21 +96,6 @@ class KCTextInputCompositeDelegate: NSObject, UITextViewDelegate, UITextFieldDel
|
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
98
|
|
|
99
|
-
func canSubstituteTextFieldDelegate(delegate: UITextFieldDelegate?) -> Bool {
|
|
100
|
-
let type = String(describing: delegate)
|
|
101
|
-
if type.range(of: "SQIPTextFieldInputModifier") != nil {
|
|
102
|
-
// SQIPTextFieldInputModifier is a private class used internally by Square.
|
|
103
|
-
// It forwards input events to the keyboard-controller delegate.
|
|
104
|
-
// To prevent an infinite loop, we avoid setting our delegate in this case.
|
|
105
|
-
// Since Square's SDK is used imperatively and doesn't allow adding custom components,
|
|
106
|
-
// keyboard-controller components cannot be used in this context,
|
|
107
|
-
// so it's safe to skip replacing the delegate.
|
|
108
|
-
return false
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
return true
|
|
112
|
-
}
|
|
113
|
-
|
|
114
99
|
/// Getter for the active delegate
|
|
115
100
|
var activeDelegate: AnyObject? {
|
|
116
101
|
return textViewDelegate ?? textFieldDelegate
|
|
@@ -208,15 +193,49 @@ class KCTextInputCompositeDelegate: NSObject, UITextViewDelegate, UITextFieldDel
|
|
|
208
193
|
|
|
209
194
|
// MARK: call forwarding
|
|
210
195
|
|
|
196
|
+
/// Decides whether `aSelector` should be forwarded to `delegate`.
|
|
197
|
+
///
|
|
198
|
+
/// Usually we stay fully transparent and forward every selector the
|
|
199
|
+
/// underlying delegate responds to. The exception is a field that acts as its
|
|
200
|
+
/// own UIKit delegate and relays callbacks to an inner delegate through
|
|
201
|
+
/// `forwardInvocation:` (e.g. `BKForwardingTextField`). For such a field
|
|
202
|
+
/// `activeDelegate` is the text input *itself*, so it also "responds" to the
|
|
203
|
+
/// many `UITextField` / `UITextView` methods that UIKit relays to its delegate
|
|
204
|
+
/// (e.g. `keyboardInputChangedSelection:`). Forwarding one of those back to the
|
|
205
|
+
/// field makes the field relay it to us again — an infinite recursion.
|
|
206
|
+
///
|
|
207
|
+
/// To stay transparent without looping, when the delegate is the text input
|
|
208
|
+
/// itself we forward only the selectors it handles *dynamically* (i.e. the
|
|
209
|
+
/// ones it routes to its inner delegate via its own message forwarding), and
|
|
210
|
+
/// never the ones it implements as a UIKit object. `instancesRespond(to:)`
|
|
211
|
+
/// inspects the real method table only, so it is `false` exactly for the
|
|
212
|
+
/// selectors resolved through the field's own `forwardInvocation:`.
|
|
213
|
+
private func shouldForward(_ aSelector: Selector!, to delegate: AnyObject) -> Bool {
|
|
214
|
+
guard delegate.responds(to: aSelector) else {
|
|
215
|
+
return false
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
if delegate is UITextField || delegate is UITextView,
|
|
219
|
+
let delegateClass = type(of: delegate) as? NSObject.Type
|
|
220
|
+
{
|
|
221
|
+
return !delegateClass.instancesRespond(to: aSelector)
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
return true
|
|
225
|
+
}
|
|
226
|
+
|
|
211
227
|
override func responds(to aSelector: Selector!) -> Bool {
|
|
212
228
|
if super.responds(to: aSelector) {
|
|
213
229
|
return true
|
|
214
230
|
}
|
|
215
|
-
|
|
231
|
+
guard let activeDelegate = activeDelegate else {
|
|
232
|
+
return false
|
|
233
|
+
}
|
|
234
|
+
return shouldForward(aSelector, to: activeDelegate)
|
|
216
235
|
}
|
|
217
236
|
|
|
218
237
|
override func forwardingTarget(for aSelector: Selector!) -> Any? {
|
|
219
|
-
if activeDelegate
|
|
238
|
+
if let activeDelegate = activeDelegate, shouldForward(aSelector, to: activeDelegate) {
|
|
220
239
|
return activeDelegate
|
|
221
240
|
}
|
|
222
241
|
return super.forwardingTarget(for: aSelector)
|
|
@@ -14,7 +14,7 @@ public extension UIWindow {
|
|
|
14
14
|
static let sharedKeyboardWindowObserver = KeyboardWindowObserver()
|
|
15
15
|
|
|
16
16
|
class KeyboardWindowObserver: NSObject {
|
|
17
|
-
|
|
17
|
+
weak var keyboardWindow: UIWindow?
|
|
18
18
|
|
|
19
19
|
override init() {
|
|
20
20
|
super.init()
|
|
@@ -45,6 +45,10 @@ public extension UIWindow {
|
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
+
static var keyboardWindow: UIWindow? {
|
|
49
|
+
return sharedKeyboardWindowObserver.keyboardWindow
|
|
50
|
+
}
|
|
51
|
+
|
|
48
52
|
static var topWindow: UIWindow? {
|
|
49
53
|
return sharedKeyboardWindowObserver.getTopWindow()
|
|
50
54
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
//
|
|
2
|
-
//
|
|
2
|
+
// TextInput+DelegateManager.h
|
|
3
3
|
// react-native-keyboard-controller
|
|
4
4
|
//
|
|
5
5
|
// Created by Kiryl Ziusko on 24/04/2024.
|
|
@@ -10,3 +10,9 @@
|
|
|
10
10
|
- (void)setForceDelegate:(id<UITextViewDelegate>)delegate;
|
|
11
11
|
|
|
12
12
|
@end
|
|
13
|
+
|
|
14
|
+
@interface UITextField (DelegateManager)
|
|
15
|
+
|
|
16
|
+
- (void)setForceDelegate:(id<UITextFieldDelegate>)delegate;
|
|
17
|
+
|
|
18
|
+
@end
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
//
|
|
2
|
+
// TextInput+DelegateManager.m
|
|
3
|
+
// react-native-keyboard-controller
|
|
4
|
+
//
|
|
5
|
+
// Created by Kiryl Ziusko on 24/04/2024.
|
|
6
|
+
//
|
|
7
|
+
|
|
8
|
+
#import <objc/runtime.h>
|
|
9
|
+
#import "TextInput+DelegateManager.h"
|
|
10
|
+
|
|
11
|
+
@implementation UITextView (DelegateManager)
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* We are aware that delegate is set by RN on mount and we can not re-define it
|
|
15
|
+
* but we are using composite delegate to forward all calls to original delegate
|
|
16
|
+
* so we use this method to force set our delegate
|
|
17
|
+
*/
|
|
18
|
+
- (void)setForceDelegate:(id<UITextViewDelegate>)delegate
|
|
19
|
+
{
|
|
20
|
+
Ivar ivar = class_getInstanceVariable([UITextView class], "_delegate");
|
|
21
|
+
if (ivar) {
|
|
22
|
+
object_setIvar(self, ivar, delegate);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
@end
|
|
27
|
+
|
|
28
|
+
@implementation UITextField (DelegateManager)
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* Some `UITextField` subclasses (e.g. card-input fields from third-party SDKs, aka Square)
|
|
32
|
+
* make themselves their own UIKit delegate via `[super setDelegate:self]` and
|
|
33
|
+
* override `setDelegate:` so that the public setter only stores an *inner*
|
|
34
|
+
* delegate, forwarding UIKit callbacks to it via `forwardInvocation:`.
|
|
35
|
+
*
|
|
36
|
+
* For such fields the regular `textField.delegate = composite` does NOT replace
|
|
37
|
+
* the real UIKit delegate slot — it only points the field's inner delegate at us
|
|
38
|
+
* while the field itself stays the real delegate. Combined with the composite
|
|
39
|
+
* forwarding unhandled calls back to that same field, this creates an infinite
|
|
40
|
+
* recursion (it blows the stack already inside `respondsToSelector:`).
|
|
41
|
+
*
|
|
42
|
+
* Writing the `_delegate` ivar directly installs the composite as the genuine
|
|
43
|
+
* UIKit delegate without touching the field's inner delegate slot, so no
|
|
44
|
+
* back-pointer to the composite is ever created and the chain stays acyclic:
|
|
45
|
+
* `UIKit -> composite -> field -> field's original inner delegate`.
|
|
46
|
+
*/
|
|
47
|
+
- (void)setForceDelegate:(id<UITextFieldDelegate>)delegate
|
|
48
|
+
{
|
|
49
|
+
Ivar ivar = class_getInstanceVariable([UITextField class], "_delegate");
|
|
50
|
+
if (ivar) {
|
|
51
|
+
object_setIvar(self, ivar, delegate);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
@end
|
|
@@ -251,11 +251,9 @@ public class FocusedInputObserver: NSObject {
|
|
|
251
251
|
|
|
252
252
|
private func substituteDelegate(_ input: UIResponder?) {
|
|
253
253
|
if let textField = input as? UITextField {
|
|
254
|
-
if !(textField.delegate is KCTextInputCompositeDelegate)
|
|
255
|
-
delegate.canSubstituteTextFieldDelegate(delegate: textField.delegate)
|
|
256
|
-
{
|
|
254
|
+
if !(textField.delegate is KCTextInputCompositeDelegate) {
|
|
257
255
|
delegate.setTextFieldDelegate(delegate: textField.delegate, textField: textField)
|
|
258
|
-
textField.delegate
|
|
256
|
+
textField.setForceDelegate(delegate)
|
|
259
257
|
}
|
|
260
258
|
} else if let textView = input as? UITextView {
|
|
261
259
|
if !(textView.delegate is KCTextInputCompositeDelegate) {
|
|
@@ -267,7 +265,7 @@ public class FocusedInputObserver: NSObject {
|
|
|
267
265
|
|
|
268
266
|
private func substituteDelegateBack(_ input: UIResponder?) {
|
|
269
267
|
if let textField = input as? UITextField, let oldDelegate = delegate.activeDelegate as? UITextFieldDelegate {
|
|
270
|
-
textField.
|
|
268
|
+
textField.setForceDelegate(oldDelegate)
|
|
271
269
|
} else if let textView = input as? UITextView, let oldDelegate = delegate.activeDelegate as? UITextViewDelegate {
|
|
272
270
|
textView.setForceDelegate(oldDelegate)
|
|
273
271
|
}
|
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
import UIKit
|
|
9
9
|
|
|
10
10
|
/**
|
|
11
|
-
* A compatibility view that resolves to `KeyboardView`
|
|
12
|
-
* and uses `keyboardLayoutGuide`
|
|
11
|
+
* A compatibility view that resolves to `KeyboardView` for the legacy path
|
|
12
|
+
* and uses `keyboardLayoutGuide` for configured iOS 26+ behavior.
|
|
13
13
|
*/
|
|
14
14
|
public final class KeyboardTrackingView: UIView {
|
|
15
15
|
private var keyboardView: UIView? {
|
|
@@ -69,6 +69,8 @@ public final class KeyboardTrackingView: UIView {
|
|
|
69
69
|
}
|
|
70
70
|
|
|
71
71
|
@objc public func attachToTopmostView(toWindow window: UIWindow? = nil) {
|
|
72
|
+
guard KeyboardControllerConfiguration.usesKeyboardLayoutGuideTracking else { return }
|
|
73
|
+
|
|
72
74
|
var topViewController = window?.rootViewController
|
|
73
75
|
if let rootVC = topViewController, let topView = rootVC.view, topView.window != nil {
|
|
74
76
|
// ok, attach
|
|
@@ -120,7 +122,7 @@ public final class KeyboardTrackingView: UIView {
|
|
|
120
122
|
}
|
|
121
123
|
|
|
122
124
|
@objc var view: UIView? {
|
|
123
|
-
if
|
|
125
|
+
if KeyboardControllerConfiguration.usesKeyboardLayoutGuideTracking {
|
|
124
126
|
return self
|
|
125
127
|
} else {
|
|
126
128
|
return keyboardView
|
|
@@ -135,7 +137,7 @@ public final class KeyboardTrackingView: UIView {
|
|
|
135
137
|
let keyboardPosition = keyboardWindowH - keyboardFrameY
|
|
136
138
|
|
|
137
139
|
// for `keyboardLayoutGuide` case we can just read keyboard position directly - no interpolation needed
|
|
138
|
-
if
|
|
140
|
+
if KeyboardControllerConfiguration.usesKeyboardLayoutGuideTracking {
|
|
139
141
|
if keyboardPosition > keyboardHeight {
|
|
140
142
|
return Self.invalidPosition
|
|
141
143
|
}
|
|
@@ -12,6 +12,7 @@ var _ScrollViewWithBottomPadding = _interopRequireDefault(require("../ScrollView
|
|
|
12
12
|
var _useChatKeyboard = require("./useChatKeyboard");
|
|
13
13
|
var _useEndVisible = require("./useEndVisible");
|
|
14
14
|
var _useExtraContentPadding = require("./useExtraContentPadding");
|
|
15
|
+
var _useFrozenPadding = require("./useFrozenPadding");
|
|
15
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
17
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
17
18
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
@@ -65,6 +66,11 @@ const KeyboardChatScrollView = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
65
66
|
keyboardLiftBehavior,
|
|
66
67
|
freeze: freezeSV
|
|
67
68
|
});
|
|
69
|
+
(0, _useFrozenPadding.useFrozenPadding)({
|
|
70
|
+
freeze: freezeSV,
|
|
71
|
+
offset,
|
|
72
|
+
padding
|
|
73
|
+
});
|
|
68
74
|
(0, _useEndVisible.useEndVisible)({
|
|
69
75
|
scroll,
|
|
70
76
|
layout,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_useCombinedRef","_interopRequireDefault","_ScrollViewWithBottomPadding","_useChatKeyboard","_useEndVisible","_useExtraContentPadding","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","ZERO_CONTENT_PADDING","makeMutable","ZERO_BLANK_SPACE","KeyboardChatScrollView","forwardRef","children","ScrollViewComponent","Reanimated","ScrollView","inverted","keyboardLiftBehavior","freeze","offset","extraContentPadding","blankSpace","applyWorkaroundForContentInsetHitTestBug","onLayout","onLayoutProp","onContentSizeChange","onContentSizeChangeProp","onEndVisible","rest","ref","scrollViewRef","useAnimatedRef","onRef","useCombinedRef","freezeSV","useDerivedValue","value","padding","currentHeight","contentOffsetY","scroll","layout","size","onLayoutInternal","onContentSizeChangeInternal","useChatKeyboard","useExtraContentPadding","keyboardPadding","useEndVisible","totalPadding","Math","min","height","max","indicatorPadding","useCallback","w","h","commitStyle","useAnimatedStyle","transform","translateY","commit","useMemo","styles","commitView","createElement","Fragment","bottomPadding","scrollIndicatorPadding","View","style","StyleSheet","create","display","position","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\nimport {\n makeMutable,\n useAnimatedRef,\n useAnimatedStyle,\n useDerivedValue,\n} from \"react-native-reanimated\";\nimport Reanimated from \"react-native-reanimated\";\n\nimport useCombinedRef from \"../hooks/useCombinedRef\";\nimport ScrollViewWithBottomPadding from \"../ScrollViewWithBottomPadding\";\n\nimport { useChatKeyboard } from \"./useChatKeyboard\";\nimport { useEndVisible } from \"./useEndVisible\";\nimport { useExtraContentPadding } from \"./useExtraContentPadding\";\n\nimport type { KeyboardChatScrollViewProps } from \"./types\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nconst ZERO_CONTENT_PADDING = makeMutable(0);\nconst ZERO_BLANK_SPACE = makeMutable(0);\n\nconst KeyboardChatScrollView = forwardRef<\n Reanimated.ScrollView,\n React.PropsWithChildren<KeyboardChatScrollViewProps>\n>(\n (\n {\n children,\n ScrollViewComponent = Reanimated.ScrollView,\n inverted = false,\n keyboardLiftBehavior = \"always\",\n freeze = false,\n offset = 0,\n extraContentPadding = ZERO_CONTENT_PADDING,\n blankSpace = ZERO_BLANK_SPACE,\n applyWorkaroundForContentInsetHitTestBug = false,\n onLayout: onLayoutProp,\n onContentSizeChange: onContentSizeChangeProp,\n onEndVisible,\n ...rest\n },\n ref,\n ) => {\n const scrollViewRef = useAnimatedRef<Reanimated.ScrollView>();\n const onRef = useCombinedRef(ref, scrollViewRef);\n const freezeSV = useDerivedValue(() =>\n typeof freeze === \"boolean\" ? freeze : freeze.value,\n );\n const {\n padding,\n currentHeight,\n contentOffsetY,\n scroll,\n layout,\n size,\n onLayout: onLayoutInternal,\n onContentSizeChange: onContentSizeChangeInternal,\n } = useChatKeyboard(scrollViewRef, {\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n offset,\n blankSpace,\n extraContentPadding,\n });\n\n useExtraContentPadding({\n scrollViewRef,\n extraContentPadding,\n keyboardPadding: padding,\n blankSpace,\n scroll,\n layout,\n size,\n contentOffsetY,\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n });\n\n useEndVisible({\n scroll,\n layout,\n size,\n inverted,\n onEndVisible,\n });\n\n // intentionally clamp `blankSpace` at one ScrollView viewport. The Android\n // `ClippingScrollView` workaround temporarily substitutes padding/range\n // during touch handling, and oversized blank ranges can de-sync during fast\n // momentum gestures. One viewport is enough for the short-content case;\n // larger values only allow scrolling to a fully blank screen which is not\n // the use case for this library. If you found this comment and it causes\n // a bug for you, please open an issue.\n const totalPadding = useDerivedValue(() =>\n Math.min(\n layout.value.height,\n Math.max(blankSpace.value, padding.value + extraContentPadding.value),\n ),\n );\n\n // Scroll indicator inset = keyboard + extraContentPadding (excludes blankSpace).\n // Apps that render into the unsafe area can supply a negative\n // scrollIndicatorInsets adjustment at the application layer.\n const indicatorPadding = useDerivedValue(\n () => padding.value + extraContentPadding.value,\n );\n\n const onLayout = useCallback(\n (e: LayoutChangeEvent) => {\n onLayoutInternal(e);\n onLayoutProp?.(e);\n },\n [onLayoutInternal, onLayoutProp],\n );\n\n const onContentSizeChange = useCallback(\n (w: number, h: number) => {\n onContentSizeChangeInternal(w, h);\n onContentSizeChangeProp?.(w, h);\n },\n [onContentSizeChangeInternal, onContentSizeChangeProp],\n );\n\n // Invisible view whose animated style changes every frame during keyboard\n // animation. On Fabric, this forces Reanimated to schedule a commit,\n // which flushes the scrollTo call in the same frame (fixing de-synchronization).\n // see https://github.com/software-mansion/react-native-reanimated/issues/9000\n const commitStyle = useAnimatedStyle(\n () => ({\n transform: [{ translateY: -currentHeight.value }],\n }),\n [],\n );\n const commit = useMemo(\n () => [styles.commitView, commitStyle],\n [commitStyle],\n );\n\n return (\n <>\n <ScrollViewWithBottomPadding\n ref={onRef}\n {...rest}\n applyWorkaroundForContentInsetHitTestBug={\n applyWorkaroundForContentInsetHitTestBug\n }\n bottomPadding={totalPadding}\n contentOffsetY={contentOffsetY}\n inverted={inverted}\n scrollIndicatorPadding={indicatorPadding}\n ScrollViewComponent={ScrollViewComponent}\n onContentSizeChange={onContentSizeChange}\n onLayout={onLayout}\n >\n {children}\n </ScrollViewWithBottomPadding>\n <Reanimated.View style={commit} />\n </>\n );\n },\n);\n\nconst styles = StyleSheet.create({\n commitView: {\n display: \"none\",\n position: \"absolute\",\n },\n});\n\nexport default KeyboardChatScrollView;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_useCombinedRef","_interopRequireDefault","_ScrollViewWithBottomPadding","_useChatKeyboard","_useEndVisible","_useExtraContentPadding","_useFrozenPadding","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","ZERO_CONTENT_PADDING","makeMutable","ZERO_BLANK_SPACE","KeyboardChatScrollView","forwardRef","children","ScrollViewComponent","Reanimated","ScrollView","inverted","keyboardLiftBehavior","freeze","offset","extraContentPadding","blankSpace","applyWorkaroundForContentInsetHitTestBug","onLayout","onLayoutProp","onContentSizeChange","onContentSizeChangeProp","onEndVisible","rest","ref","scrollViewRef","useAnimatedRef","onRef","useCombinedRef","freezeSV","useDerivedValue","value","padding","currentHeight","contentOffsetY","scroll","layout","size","onLayoutInternal","onContentSizeChangeInternal","useChatKeyboard","useExtraContentPadding","keyboardPadding","useFrozenPadding","useEndVisible","totalPadding","Math","min","height","max","indicatorPadding","useCallback","w","h","commitStyle","useAnimatedStyle","transform","translateY","commit","useMemo","styles","commitView","createElement","Fragment","bottomPadding","scrollIndicatorPadding","View","style","StyleSheet","create","display","position","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\nimport {\n makeMutable,\n useAnimatedRef,\n useAnimatedStyle,\n useDerivedValue,\n} from \"react-native-reanimated\";\nimport Reanimated from \"react-native-reanimated\";\n\nimport useCombinedRef from \"../hooks/useCombinedRef\";\nimport ScrollViewWithBottomPadding from \"../ScrollViewWithBottomPadding\";\n\nimport { useChatKeyboard } from \"./useChatKeyboard\";\nimport { useEndVisible } from \"./useEndVisible\";\nimport { useExtraContentPadding } from \"./useExtraContentPadding\";\nimport { useFrozenPadding } from \"./useFrozenPadding\";\n\nimport type { KeyboardChatScrollViewProps } from \"./types\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nconst ZERO_CONTENT_PADDING = makeMutable(0);\nconst ZERO_BLANK_SPACE = makeMutable(0);\n\nconst KeyboardChatScrollView = forwardRef<\n Reanimated.ScrollView,\n React.PropsWithChildren<KeyboardChatScrollViewProps>\n>(\n (\n {\n children,\n ScrollViewComponent = Reanimated.ScrollView,\n inverted = false,\n keyboardLiftBehavior = \"always\",\n freeze = false,\n offset = 0,\n extraContentPadding = ZERO_CONTENT_PADDING,\n blankSpace = ZERO_BLANK_SPACE,\n applyWorkaroundForContentInsetHitTestBug = false,\n onLayout: onLayoutProp,\n onContentSizeChange: onContentSizeChangeProp,\n onEndVisible,\n ...rest\n },\n ref,\n ) => {\n const scrollViewRef = useAnimatedRef<Reanimated.ScrollView>();\n const onRef = useCombinedRef(ref, scrollViewRef);\n const freezeSV = useDerivedValue(() =>\n typeof freeze === \"boolean\" ? freeze : freeze.value,\n );\n const {\n padding,\n currentHeight,\n contentOffsetY,\n scroll,\n layout,\n size,\n onLayout: onLayoutInternal,\n onContentSizeChange: onContentSizeChangeInternal,\n } = useChatKeyboard(scrollViewRef, {\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n offset,\n blankSpace,\n extraContentPadding,\n });\n\n useExtraContentPadding({\n scrollViewRef,\n extraContentPadding,\n keyboardPadding: padding,\n blankSpace,\n scroll,\n layout,\n size,\n contentOffsetY,\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n });\n\n useFrozenPadding({\n freeze: freezeSV,\n offset,\n padding,\n });\n\n useEndVisible({\n scroll,\n layout,\n size,\n inverted,\n onEndVisible,\n });\n\n // intentionally clamp `blankSpace` at one ScrollView viewport. The Android\n // `ClippingScrollView` workaround temporarily substitutes padding/range\n // during touch handling, and oversized blank ranges can de-sync during fast\n // momentum gestures. One viewport is enough for the short-content case;\n // larger values only allow scrolling to a fully blank screen which is not\n // the use case for this library. If you found this comment and it causes\n // a bug for you, please open an issue.\n const totalPadding = useDerivedValue(() =>\n Math.min(\n layout.value.height,\n Math.max(blankSpace.value, padding.value + extraContentPadding.value),\n ),\n );\n\n // Scroll indicator inset = keyboard + extraContentPadding (excludes blankSpace).\n // Apps that render into the unsafe area can supply a negative\n // scrollIndicatorInsets adjustment at the application layer.\n const indicatorPadding = useDerivedValue(\n () => padding.value + extraContentPadding.value,\n );\n\n const onLayout = useCallback(\n (e: LayoutChangeEvent) => {\n onLayoutInternal(e);\n onLayoutProp?.(e);\n },\n [onLayoutInternal, onLayoutProp],\n );\n\n const onContentSizeChange = useCallback(\n (w: number, h: number) => {\n onContentSizeChangeInternal(w, h);\n onContentSizeChangeProp?.(w, h);\n },\n [onContentSizeChangeInternal, onContentSizeChangeProp],\n );\n\n // Invisible view whose animated style changes every frame during keyboard\n // animation. On Fabric, this forces Reanimated to schedule a commit,\n // which flushes the scrollTo call in the same frame (fixing de-synchronization).\n // see https://github.com/software-mansion/react-native-reanimated/issues/9000\n const commitStyle = useAnimatedStyle(\n () => ({\n transform: [{ translateY: -currentHeight.value }],\n }),\n [],\n );\n const commit = useMemo(\n () => [styles.commitView, commitStyle],\n [commitStyle],\n );\n\n return (\n <>\n <ScrollViewWithBottomPadding\n ref={onRef}\n {...rest}\n applyWorkaroundForContentInsetHitTestBug={\n applyWorkaroundForContentInsetHitTestBug\n }\n bottomPadding={totalPadding}\n contentOffsetY={contentOffsetY}\n inverted={inverted}\n scrollIndicatorPadding={indicatorPadding}\n ScrollViewComponent={ScrollViewComponent}\n onContentSizeChange={onContentSizeChange}\n onLayout={onLayout}\n >\n {children}\n </ScrollViewWithBottomPadding>\n <Reanimated.View style={commit} />\n </>\n );\n },\n);\n\nconst styles = StyleSheet.create({\n commitView: {\n display: \"none\",\n position: \"absolute\",\n },\n});\n\nexport default KeyboardChatScrollView;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAH,uBAAA,CAAAC,OAAA;AAQA,IAAAG,eAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,4BAAA,GAAAD,sBAAA,CAAAJ,OAAA;AAEA,IAAAM,gBAAA,GAAAN,OAAA;AACA,IAAAO,cAAA,GAAAP,OAAA;AACA,IAAAQ,uBAAA,GAAAR,OAAA;AACA,IAAAS,iBAAA,GAAAT,OAAA;AAAsD,SAAAI,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAX,wBAAAW,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAf,uBAAA,YAAAA,CAAAW,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,gBAAAN,CAAA,IAAAH,CAAA,gBAAAG,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAG,CAAA,OAAAK,CAAA,IAAAD,CAAA,GAAAS,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAG,CAAA,OAAAK,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAN,CAAA,EAAAK,CAAA,IAAAC,CAAA,CAAAN,CAAA,IAAAH,CAAA,CAAAG,CAAA,WAAAM,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAAA,SAAAgB,SAAA,WAAAA,QAAA,GAAAH,MAAA,CAAAI,MAAA,GAAAJ,MAAA,CAAAI,MAAA,CAAAC,IAAA,eAAAf,CAAA,aAAAN,CAAA,MAAAA,CAAA,GAAAsB,SAAA,CAAAC,MAAA,EAAAvB,CAAA,UAAAG,CAAA,GAAAmB,SAAA,CAAAtB,CAAA,YAAAK,CAAA,IAAAF,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAZ,CAAA,EAAAE,CAAA,MAAAC,CAAA,CAAAD,CAAA,IAAAF,CAAA,CAAAE,CAAA,aAAAC,CAAA,KAAAa,QAAA,CAAAK,KAAA,OAAAF,SAAA;AAKtD,MAAMG,oBAAoB,GAAG,IAAAC,kCAAW,EAAC,CAAC,CAAC;AAC3C,MAAMC,gBAAgB,GAAG,IAAAD,kCAAW,EAAC,CAAC,CAAC;AAEvC,MAAME,sBAAsB,gBAAG,IAAAC,iBAAU,EAIvC,CACE;EACEC,QAAQ;EACRC,mBAAmB,GAAGC,8BAAU,CAACC,UAAU;EAC3CC,QAAQ,GAAG,KAAK;EAChBC,oBAAoB,GAAG,QAAQ;EAC/BC,MAAM,GAAG,KAAK;EACdC,MAAM,GAAG,CAAC;EACVC,mBAAmB,GAAGb,oBAAoB;EAC1Cc,UAAU,GAAGZ,gBAAgB;EAC7Ba,wCAAwC,GAAG,KAAK;EAChDC,QAAQ,EAAEC,YAAY;EACtBC,mBAAmB,EAAEC,uBAAuB;EAC5CC,YAAY;EACZ,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAMC,aAAa,GAAG,IAAAC,qCAAc,EAAwB,CAAC;EAC7D,MAAMC,KAAK,GAAG,IAAAC,uBAAc,EAACJ,GAAG,EAAEC,aAAa,CAAC;EAChD,MAAMI,QAAQ,GAAG,IAAAC,sCAAe,EAAC,MAC/B,OAAOjB,MAAM,KAAK,SAAS,GAAGA,MAAM,GAAGA,MAAM,CAACkB,KAChD,CAAC;EACD,MAAM;IACJC,OAAO;IACPC,aAAa;IACbC,cAAc;IACdC,MAAM;IACNC,MAAM;IACNC,IAAI;IACJnB,QAAQ,EAAEoB,gBAAgB;IAC1BlB,mBAAmB,EAAEmB;EACvB,CAAC,GAAG,IAAAC,gCAAe,EAACf,aAAa,EAAE;IACjCd,QAAQ;IACRC,oBAAoB;IACpBC,MAAM,EAAEgB,QAAQ;IAChBf,MAAM;IACNE,UAAU;IACVD;EACF,CAAC,CAAC;EAEF,IAAA0B,8CAAsB,EAAC;IACrBhB,aAAa;IACbV,mBAAmB;IACnB2B,eAAe,EAAEV,OAAO;IACxBhB,UAAU;IACVmB,MAAM;IACNC,MAAM;IACNC,IAAI;IACJH,cAAc;IACdvB,QAAQ;IACRC,oBAAoB;IACpBC,MAAM,EAAEgB;EACV,CAAC,CAAC;EAEF,IAAAc,kCAAgB,EAAC;IACf9B,MAAM,EAAEgB,QAAQ;IAChBf,MAAM;IACNkB;EACF,CAAC,CAAC;EAEF,IAAAY,4BAAa,EAAC;IACZT,MAAM;IACNC,MAAM;IACNC,IAAI;IACJ1B,QAAQ;IACRW;EACF,CAAC,CAAC;;EAEF;EACA;EACA;EACA;EACA;EACA;EACA;EACA,MAAMuB,YAAY,GAAG,IAAAf,sCAAe,EAAC,MACnCgB,IAAI,CAACC,GAAG,CACNX,MAAM,CAACL,KAAK,CAACiB,MAAM,EACnBF,IAAI,CAACG,GAAG,CAACjC,UAAU,CAACe,KAAK,EAAEC,OAAO,CAACD,KAAK,GAAGhB,mBAAmB,CAACgB,KAAK,CACtE,CACF,CAAC;;EAED;EACA;EACA;EACA,MAAMmB,gBAAgB,GAAG,IAAApB,sCAAe,EACtC,MAAME,OAAO,CAACD,KAAK,GAAGhB,mBAAmB,CAACgB,KAC5C,CAAC;EAED,MAAMb,QAAQ,GAAG,IAAAiC,kBAAW,EACzB1E,CAAoB,IAAK;IACxB6D,gBAAgB,CAAC7D,CAAC,CAAC;IACnB0C,YAAY,aAAZA,YAAY,eAAZA,YAAY,CAAG1C,CAAC,CAAC;EACnB,CAAC,EACD,CAAC6D,gBAAgB,EAAEnB,YAAY,CACjC,CAAC;EAED,MAAMC,mBAAmB,GAAG,IAAA+B,kBAAW,EACrC,CAACC,CAAS,EAAEC,CAAS,KAAK;IACxBd,2BAA2B,CAACa,CAAC,EAAEC,CAAC,CAAC;IACjChC,uBAAuB,aAAvBA,uBAAuB,eAAvBA,uBAAuB,CAAG+B,CAAC,EAAEC,CAAC,CAAC;EACjC,CAAC,EACD,CAACd,2BAA2B,EAAElB,uBAAuB,CACvD,CAAC;;EAED;EACA;EACA;EACA;EACA,MAAMiC,WAAW,GAAG,IAAAC,uCAAgB,EAClC,OAAO;IACLC,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAE,CAACxB,aAAa,CAACF;IAAM,CAAC;EAClD,CAAC,CAAC,EACF,EACF,CAAC;EACD,MAAM2B,MAAM,GAAG,IAAAC,cAAO,EACpB,MAAM,CAACC,MAAM,CAACC,UAAU,EAAEP,WAAW,CAAC,EACtC,CAACA,WAAW,CACd,CAAC;EAED,oBACEzF,MAAA,CAAAc,OAAA,CAAAmF,aAAA,CAAAjG,MAAA,CAAAc,OAAA,CAAAoF,QAAA,qBACElG,MAAA,CAAAc,OAAA,CAAAmF,aAAA,CAAC1F,4BAAA,CAAAO,OAA2B,EAAAiB,QAAA;IAC1B4B,GAAG,EAAEG;EAAM,GACPJ,IAAI;IACRN,wCAAwC,EACtCA,wCACD;IACD+C,aAAa,EAAEnB,YAAa;IAC5BX,cAAc,EAAEA,cAAe;IAC/BvB,QAAQ,EAAEA,QAAS;IACnBsD,sBAAsB,EAAEf,gBAAiB;IACzC1C,mBAAmB,EAAEA,mBAAoB;IACzCY,mBAAmB,EAAEA,mBAAoB;IACzCF,QAAQ,EAAEA;EAAS,IAElBX,QAC0B,CAAC,eAC9B1C,MAAA,CAAAc,OAAA,CAAAmF,aAAA,CAAC7F,sBAAA,CAAAU,OAAU,CAACuF,IAAI;IAACC,KAAK,EAAET;EAAO,CAAE,CACjC,CAAC;AAEP,CACF,CAAC;AAED,MAAME,MAAM,GAAGQ,uBAAU,CAACC,MAAM,CAAC;EAC/BR,UAAU,EAAE;IACVS,OAAO,EAAE,MAAM;IACfC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA9F,OAAA,GAEY0B,sBAAsB","ignoreList":[]}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useFrozenPadding = useFrozenPadding;
|
|
7
|
+
var _reactNativeReanimated = require("react-native-reanimated");
|
|
8
|
+
var _hooks = require("../../../hooks");
|
|
9
|
+
var _helpers = require("../useChatKeyboard/helpers");
|
|
10
|
+
/**
|
|
11
|
+
* Hook that reconciles keyboard padding after a frozen interval.
|
|
12
|
+
*
|
|
13
|
+
* `useChatKeyboard` handlers skip all writes while `freeze` is enabled, so if
|
|
14
|
+
* the keyboard opens or closes during the frozen interval `padding` keeps a
|
|
15
|
+
* stale value (e.g. the open-keyboard height after a frozen dismissal). This
|
|
16
|
+
* hook observes keyboard events independently of `freeze` and recomputes the
|
|
17
|
+
* padding from the latest observed keyboard height as soon as `freeze`
|
|
18
|
+
* transitions back to `false`.
|
|
19
|
+
*
|
|
20
|
+
* @param options - Keyboard padding shared values plus the scroll view `offset`.
|
|
21
|
+
* @param options.freeze - When `true`, keyboard-driven layout writes are skipped.
|
|
22
|
+
* @param options.offset - The distance between the bottom of the screen and the `ScrollView`.
|
|
23
|
+
* @param options.padding - Keyboard-driven padding managed by `useChatKeyboard`.
|
|
24
|
+
* @example
|
|
25
|
+
* ```ts
|
|
26
|
+
* useFrozenPadding({ freeze, offset, padding });
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
function useFrozenPadding({
|
|
30
|
+
freeze,
|
|
31
|
+
offset,
|
|
32
|
+
padding
|
|
33
|
+
}) {
|
|
34
|
+
const lastHeight = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
35
|
+
const targetKeyboardHeight = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
36
|
+
(0, _hooks.useKeyboardHandler)({
|
|
37
|
+
onStart: e => {
|
|
38
|
+
"worklet";
|
|
39
|
+
|
|
40
|
+
if (e.height > 0) {
|
|
41
|
+
// eslint-disable-next-line react-compiler/react-compiler
|
|
42
|
+
targetKeyboardHeight.value = e.height;
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
onMove: e => {
|
|
46
|
+
"worklet";
|
|
47
|
+
|
|
48
|
+
lastHeight.value = e.height;
|
|
49
|
+
},
|
|
50
|
+
onEnd: e => {
|
|
51
|
+
"worklet";
|
|
52
|
+
|
|
53
|
+
lastHeight.value = e.height;
|
|
54
|
+
}
|
|
55
|
+
}, []);
|
|
56
|
+
(0, _reactNativeReanimated.useAnimatedReaction)(() => freeze.value, (isFrozen, wasFrozen) => {
|
|
57
|
+
if (!isFrozen && wasFrozen === true) {
|
|
58
|
+
padding.value = (0, _helpers.getEffectiveHeight)(lastHeight.value, targetKeyboardHeight.value, offset);
|
|
59
|
+
}
|
|
60
|
+
}, [offset]);
|
|
61
|
+
}
|
|
62
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNativeReanimated","require","_hooks","_helpers","useFrozenPadding","freeze","offset","padding","lastHeight","useSharedValue","targetKeyboardHeight","useKeyboardHandler","onStart","e","height","value","onMove","onEnd","useAnimatedReaction","isFrozen","wasFrozen","getEffectiveHeight"],"sources":["index.ts"],"sourcesContent":["import { useAnimatedReaction, useSharedValue } from \"react-native-reanimated\";\n\nimport { useKeyboardHandler } from \"../../../hooks\";\nimport { getEffectiveHeight } from \"../useChatKeyboard/helpers\";\n\nimport type { SharedValue } from \"react-native-reanimated\";\n\ntype UseFrozenPaddingOptions = {\n /** When `true`, keyboard-driven layout writes are skipped. */\n freeze: SharedValue<boolean>;\n /** The distance between the bottom of the screen and the `ScrollView`. */\n offset: number;\n /** Keyboard-driven padding managed by `useChatKeyboard`. */\n padding: SharedValue<number>;\n};\n\n/**\n * Hook that reconciles keyboard padding after a frozen interval.\n *\n * `useChatKeyboard` handlers skip all writes while `freeze` is enabled, so if\n * the keyboard opens or closes during the frozen interval `padding` keeps a\n * stale value (e.g. the open-keyboard height after a frozen dismissal). This\n * hook observes keyboard events independently of `freeze` and recomputes the\n * padding from the latest observed keyboard height as soon as `freeze`\n * transitions back to `false`.\n *\n * @param options - Keyboard padding shared values plus the scroll view `offset`.\n * @param options.freeze - When `true`, keyboard-driven layout writes are skipped.\n * @param options.offset - The distance between the bottom of the screen and the `ScrollView`.\n * @param options.padding - Keyboard-driven padding managed by `useChatKeyboard`.\n * @example\n * ```ts\n * useFrozenPadding({ freeze, offset, padding });\n * ```\n */\nfunction useFrozenPadding({\n freeze,\n offset,\n padding,\n}: UseFrozenPaddingOptions): void {\n const lastHeight = useSharedValue(0);\n const targetKeyboardHeight = useSharedValue(0);\n\n useKeyboardHandler(\n {\n onStart: (e) => {\n \"worklet\";\n\n if (e.height > 0) {\n // eslint-disable-next-line react-compiler/react-compiler\n targetKeyboardHeight.value = e.height;\n }\n },\n onMove: (e) => {\n \"worklet\";\n\n lastHeight.value = e.height;\n },\n onEnd: (e) => {\n \"worklet\";\n\n lastHeight.value = e.height;\n },\n },\n [],\n );\n\n useAnimatedReaction(\n () => freeze.value,\n (isFrozen, wasFrozen) => {\n if (!isFrozen && wasFrozen === true) {\n padding.value = getEffectiveHeight(\n lastHeight.value,\n targetKeyboardHeight.value,\n offset,\n );\n }\n },\n [offset],\n );\n}\n\nexport { useFrozenPadding };\n"],"mappings":";;;;;;AAAA,IAAAA,sBAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAaA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASG,gBAAgBA,CAAC;EACxBC,MAAM;EACNC,MAAM;EACNC;AACuB,CAAC,EAAQ;EAChC,MAAMC,UAAU,GAAG,IAAAC,qCAAc,EAAC,CAAC,CAAC;EACpC,MAAMC,oBAAoB,GAAG,IAAAD,qCAAc,EAAC,CAAC,CAAC;EAE9C,IAAAE,yBAAkB,EAChB;IACEC,OAAO,EAAGC,CAAC,IAAK;MACd,SAAS;;MAET,IAAIA,CAAC,CAACC,MAAM,GAAG,CAAC,EAAE;QAChB;QACAJ,oBAAoB,CAACK,KAAK,GAAGF,CAAC,CAACC,MAAM;MACvC;IACF,CAAC;IACDE,MAAM,EAAGH,CAAC,IAAK;MACb,SAAS;;MAETL,UAAU,CAACO,KAAK,GAAGF,CAAC,CAACC,MAAM;IAC7B,CAAC;IACDG,KAAK,EAAGJ,CAAC,IAAK;MACZ,SAAS;;MAETL,UAAU,CAACO,KAAK,GAAGF,CAAC,CAACC,MAAM;IAC7B;EACF,CAAC,EACD,EACF,CAAC;EAED,IAAAI,0CAAmB,EACjB,MAAMb,MAAM,CAACU,KAAK,EAClB,CAACI,QAAQ,EAAEC,SAAS,KAAK;IACvB,IAAI,CAACD,QAAQ,IAAIC,SAAS,KAAK,IAAI,EAAE;MACnCb,OAAO,CAACQ,KAAK,GAAG,IAAAM,2BAAkB,EAChCb,UAAU,CAACO,KAAK,EAChBL,oBAAoB,CAACK,KAAK,EAC1BT,MACF,CAAC;IACH;EACF,CAAC,EACD,CAACA,MAAM,CACT,CAAC;AACH","ignoreList":[]}
|
|
@@ -8,6 +8,7 @@ import ScrollViewWithBottomPadding from "../ScrollViewWithBottomPadding";
|
|
|
8
8
|
import { useChatKeyboard } from "./useChatKeyboard";
|
|
9
9
|
import { useEndVisible } from "./useEndVisible";
|
|
10
10
|
import { useExtraContentPadding } from "./useExtraContentPadding";
|
|
11
|
+
import { useFrozenPadding } from "./useFrozenPadding";
|
|
11
12
|
const ZERO_CONTENT_PADDING = makeMutable(0);
|
|
12
13
|
const ZERO_BLANK_SPACE = makeMutable(0);
|
|
13
14
|
const KeyboardChatScrollView = /*#__PURE__*/forwardRef(({
|
|
@@ -58,6 +59,11 @@ const KeyboardChatScrollView = /*#__PURE__*/forwardRef(({
|
|
|
58
59
|
keyboardLiftBehavior,
|
|
59
60
|
freeze: freezeSV
|
|
60
61
|
});
|
|
62
|
+
useFrozenPadding({
|
|
63
|
+
freeze: freezeSV,
|
|
64
|
+
offset,
|
|
65
|
+
padding
|
|
66
|
+
});
|
|
61
67
|
useEndVisible({
|
|
62
68
|
scroll,
|
|
63
69
|
layout,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","forwardRef","useCallback","useMemo","StyleSheet","makeMutable","useAnimatedRef","useAnimatedStyle","useDerivedValue","Reanimated","useCombinedRef","ScrollViewWithBottomPadding","useChatKeyboard","useEndVisible","useExtraContentPadding","ZERO_CONTENT_PADDING","ZERO_BLANK_SPACE","KeyboardChatScrollView","children","ScrollViewComponent","ScrollView","inverted","keyboardLiftBehavior","freeze","offset","extraContentPadding","blankSpace","applyWorkaroundForContentInsetHitTestBug","onLayout","onLayoutProp","onContentSizeChange","onContentSizeChangeProp","onEndVisible","rest","ref","scrollViewRef","onRef","freezeSV","value","padding","currentHeight","contentOffsetY","scroll","layout","size","onLayoutInternal","onContentSizeChangeInternal","keyboardPadding","totalPadding","Math","min","height","max","indicatorPadding","e","w","h","commitStyle","transform","translateY","commit","styles","commitView","createElement","Fragment","_extends","bottomPadding","scrollIndicatorPadding","View","style","create","display","position"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\nimport {\n makeMutable,\n useAnimatedRef,\n useAnimatedStyle,\n useDerivedValue,\n} from \"react-native-reanimated\";\nimport Reanimated from \"react-native-reanimated\";\n\nimport useCombinedRef from \"../hooks/useCombinedRef\";\nimport ScrollViewWithBottomPadding from \"../ScrollViewWithBottomPadding\";\n\nimport { useChatKeyboard } from \"./useChatKeyboard\";\nimport { useEndVisible } from \"./useEndVisible\";\nimport { useExtraContentPadding } from \"./useExtraContentPadding\";\n\nimport type { KeyboardChatScrollViewProps } from \"./types\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nconst ZERO_CONTENT_PADDING = makeMutable(0);\nconst ZERO_BLANK_SPACE = makeMutable(0);\n\nconst KeyboardChatScrollView = forwardRef<\n Reanimated.ScrollView,\n React.PropsWithChildren<KeyboardChatScrollViewProps>\n>(\n (\n {\n children,\n ScrollViewComponent = Reanimated.ScrollView,\n inverted = false,\n keyboardLiftBehavior = \"always\",\n freeze = false,\n offset = 0,\n extraContentPadding = ZERO_CONTENT_PADDING,\n blankSpace = ZERO_BLANK_SPACE,\n applyWorkaroundForContentInsetHitTestBug = false,\n onLayout: onLayoutProp,\n onContentSizeChange: onContentSizeChangeProp,\n onEndVisible,\n ...rest\n },\n ref,\n ) => {\n const scrollViewRef = useAnimatedRef<Reanimated.ScrollView>();\n const onRef = useCombinedRef(ref, scrollViewRef);\n const freezeSV = useDerivedValue(() =>\n typeof freeze === \"boolean\" ? freeze : freeze.value,\n );\n const {\n padding,\n currentHeight,\n contentOffsetY,\n scroll,\n layout,\n size,\n onLayout: onLayoutInternal,\n onContentSizeChange: onContentSizeChangeInternal,\n } = useChatKeyboard(scrollViewRef, {\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n offset,\n blankSpace,\n extraContentPadding,\n });\n\n useExtraContentPadding({\n scrollViewRef,\n extraContentPadding,\n keyboardPadding: padding,\n blankSpace,\n scroll,\n layout,\n size,\n contentOffsetY,\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n });\n\n useEndVisible({\n scroll,\n layout,\n size,\n inverted,\n onEndVisible,\n });\n\n // intentionally clamp `blankSpace` at one ScrollView viewport. The Android\n // `ClippingScrollView` workaround temporarily substitutes padding/range\n // during touch handling, and oversized blank ranges can de-sync during fast\n // momentum gestures. One viewport is enough for the short-content case;\n // larger values only allow scrolling to a fully blank screen which is not\n // the use case for this library. If you found this comment and it causes\n // a bug for you, please open an issue.\n const totalPadding = useDerivedValue(() =>\n Math.min(\n layout.value.height,\n Math.max(blankSpace.value, padding.value + extraContentPadding.value),\n ),\n );\n\n // Scroll indicator inset = keyboard + extraContentPadding (excludes blankSpace).\n // Apps that render into the unsafe area can supply a negative\n // scrollIndicatorInsets adjustment at the application layer.\n const indicatorPadding = useDerivedValue(\n () => padding.value + extraContentPadding.value,\n );\n\n const onLayout = useCallback(\n (e: LayoutChangeEvent) => {\n onLayoutInternal(e);\n onLayoutProp?.(e);\n },\n [onLayoutInternal, onLayoutProp],\n );\n\n const onContentSizeChange = useCallback(\n (w: number, h: number) => {\n onContentSizeChangeInternal(w, h);\n onContentSizeChangeProp?.(w, h);\n },\n [onContentSizeChangeInternal, onContentSizeChangeProp],\n );\n\n // Invisible view whose animated style changes every frame during keyboard\n // animation. On Fabric, this forces Reanimated to schedule a commit,\n // which flushes the scrollTo call in the same frame (fixing de-synchronization).\n // see https://github.com/software-mansion/react-native-reanimated/issues/9000\n const commitStyle = useAnimatedStyle(\n () => ({\n transform: [{ translateY: -currentHeight.value }],\n }),\n [],\n );\n const commit = useMemo(\n () => [styles.commitView, commitStyle],\n [commitStyle],\n );\n\n return (\n <>\n <ScrollViewWithBottomPadding\n ref={onRef}\n {...rest}\n applyWorkaroundForContentInsetHitTestBug={\n applyWorkaroundForContentInsetHitTestBug\n }\n bottomPadding={totalPadding}\n contentOffsetY={contentOffsetY}\n inverted={inverted}\n scrollIndicatorPadding={indicatorPadding}\n ScrollViewComponent={ScrollViewComponent}\n onContentSizeChange={onContentSizeChange}\n onLayout={onLayout}\n >\n {children}\n </ScrollViewWithBottomPadding>\n <Reanimated.View style={commit} />\n </>\n );\n },\n);\n\nconst styles = StyleSheet.create({\n commitView: {\n display: \"none\",\n position: \"absolute\",\n },\n});\n\nexport default KeyboardChatScrollView;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAC/D,SAASC,UAAU,QAAQ,cAAc;AACzC,SACEC,WAAW,EACXC,cAAc,EACdC,gBAAgB,EAChBC,eAAe,QACV,yBAAyB;AAChC,OAAOC,UAAU,MAAM,yBAAyB;AAEhD,OAAOC,cAAc,MAAM,yBAAyB;AACpD,OAAOC,2BAA2B,MAAM,gCAAgC;AAExE,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,sBAAsB,QAAQ,0BAA0B;
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useCallback","useMemo","StyleSheet","makeMutable","useAnimatedRef","useAnimatedStyle","useDerivedValue","Reanimated","useCombinedRef","ScrollViewWithBottomPadding","useChatKeyboard","useEndVisible","useExtraContentPadding","useFrozenPadding","ZERO_CONTENT_PADDING","ZERO_BLANK_SPACE","KeyboardChatScrollView","children","ScrollViewComponent","ScrollView","inverted","keyboardLiftBehavior","freeze","offset","extraContentPadding","blankSpace","applyWorkaroundForContentInsetHitTestBug","onLayout","onLayoutProp","onContentSizeChange","onContentSizeChangeProp","onEndVisible","rest","ref","scrollViewRef","onRef","freezeSV","value","padding","currentHeight","contentOffsetY","scroll","layout","size","onLayoutInternal","onContentSizeChangeInternal","keyboardPadding","totalPadding","Math","min","height","max","indicatorPadding","e","w","h","commitStyle","transform","translateY","commit","styles","commitView","createElement","Fragment","_extends","bottomPadding","scrollIndicatorPadding","View","style","create","display","position"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\nimport {\n makeMutable,\n useAnimatedRef,\n useAnimatedStyle,\n useDerivedValue,\n} from \"react-native-reanimated\";\nimport Reanimated from \"react-native-reanimated\";\n\nimport useCombinedRef from \"../hooks/useCombinedRef\";\nimport ScrollViewWithBottomPadding from \"../ScrollViewWithBottomPadding\";\n\nimport { useChatKeyboard } from \"./useChatKeyboard\";\nimport { useEndVisible } from \"./useEndVisible\";\nimport { useExtraContentPadding } from \"./useExtraContentPadding\";\nimport { useFrozenPadding } from \"./useFrozenPadding\";\n\nimport type { KeyboardChatScrollViewProps } from \"./types\";\nimport type { LayoutChangeEvent } from \"react-native\";\n\nconst ZERO_CONTENT_PADDING = makeMutable(0);\nconst ZERO_BLANK_SPACE = makeMutable(0);\n\nconst KeyboardChatScrollView = forwardRef<\n Reanimated.ScrollView,\n React.PropsWithChildren<KeyboardChatScrollViewProps>\n>(\n (\n {\n children,\n ScrollViewComponent = Reanimated.ScrollView,\n inverted = false,\n keyboardLiftBehavior = \"always\",\n freeze = false,\n offset = 0,\n extraContentPadding = ZERO_CONTENT_PADDING,\n blankSpace = ZERO_BLANK_SPACE,\n applyWorkaroundForContentInsetHitTestBug = false,\n onLayout: onLayoutProp,\n onContentSizeChange: onContentSizeChangeProp,\n onEndVisible,\n ...rest\n },\n ref,\n ) => {\n const scrollViewRef = useAnimatedRef<Reanimated.ScrollView>();\n const onRef = useCombinedRef(ref, scrollViewRef);\n const freezeSV = useDerivedValue(() =>\n typeof freeze === \"boolean\" ? freeze : freeze.value,\n );\n const {\n padding,\n currentHeight,\n contentOffsetY,\n scroll,\n layout,\n size,\n onLayout: onLayoutInternal,\n onContentSizeChange: onContentSizeChangeInternal,\n } = useChatKeyboard(scrollViewRef, {\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n offset,\n blankSpace,\n extraContentPadding,\n });\n\n useExtraContentPadding({\n scrollViewRef,\n extraContentPadding,\n keyboardPadding: padding,\n blankSpace,\n scroll,\n layout,\n size,\n contentOffsetY,\n inverted,\n keyboardLiftBehavior,\n freeze: freezeSV,\n });\n\n useFrozenPadding({\n freeze: freezeSV,\n offset,\n padding,\n });\n\n useEndVisible({\n scroll,\n layout,\n size,\n inverted,\n onEndVisible,\n });\n\n // intentionally clamp `blankSpace` at one ScrollView viewport. The Android\n // `ClippingScrollView` workaround temporarily substitutes padding/range\n // during touch handling, and oversized blank ranges can de-sync during fast\n // momentum gestures. One viewport is enough for the short-content case;\n // larger values only allow scrolling to a fully blank screen which is not\n // the use case for this library. If you found this comment and it causes\n // a bug for you, please open an issue.\n const totalPadding = useDerivedValue(() =>\n Math.min(\n layout.value.height,\n Math.max(blankSpace.value, padding.value + extraContentPadding.value),\n ),\n );\n\n // Scroll indicator inset = keyboard + extraContentPadding (excludes blankSpace).\n // Apps that render into the unsafe area can supply a negative\n // scrollIndicatorInsets adjustment at the application layer.\n const indicatorPadding = useDerivedValue(\n () => padding.value + extraContentPadding.value,\n );\n\n const onLayout = useCallback(\n (e: LayoutChangeEvent) => {\n onLayoutInternal(e);\n onLayoutProp?.(e);\n },\n [onLayoutInternal, onLayoutProp],\n );\n\n const onContentSizeChange = useCallback(\n (w: number, h: number) => {\n onContentSizeChangeInternal(w, h);\n onContentSizeChangeProp?.(w, h);\n },\n [onContentSizeChangeInternal, onContentSizeChangeProp],\n );\n\n // Invisible view whose animated style changes every frame during keyboard\n // animation. On Fabric, this forces Reanimated to schedule a commit,\n // which flushes the scrollTo call in the same frame (fixing de-synchronization).\n // see https://github.com/software-mansion/react-native-reanimated/issues/9000\n const commitStyle = useAnimatedStyle(\n () => ({\n transform: [{ translateY: -currentHeight.value }],\n }),\n [],\n );\n const commit = useMemo(\n () => [styles.commitView, commitStyle],\n [commitStyle],\n );\n\n return (\n <>\n <ScrollViewWithBottomPadding\n ref={onRef}\n {...rest}\n applyWorkaroundForContentInsetHitTestBug={\n applyWorkaroundForContentInsetHitTestBug\n }\n bottomPadding={totalPadding}\n contentOffsetY={contentOffsetY}\n inverted={inverted}\n scrollIndicatorPadding={indicatorPadding}\n ScrollViewComponent={ScrollViewComponent}\n onContentSizeChange={onContentSizeChange}\n onLayout={onLayout}\n >\n {children}\n </ScrollViewWithBottomPadding>\n <Reanimated.View style={commit} />\n </>\n );\n },\n);\n\nconst styles = StyleSheet.create({\n commitView: {\n display: \"none\",\n position: \"absolute\",\n },\n});\n\nexport default KeyboardChatScrollView;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAC/D,SAASC,UAAU,QAAQ,cAAc;AACzC,SACEC,WAAW,EACXC,cAAc,EACdC,gBAAgB,EAChBC,eAAe,QACV,yBAAyB;AAChC,OAAOC,UAAU,MAAM,yBAAyB;AAEhD,OAAOC,cAAc,MAAM,yBAAyB;AACpD,OAAOC,2BAA2B,MAAM,gCAAgC;AAExE,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,sBAAsB,QAAQ,0BAA0B;AACjE,SAASC,gBAAgB,QAAQ,oBAAoB;AAKrD,MAAMC,oBAAoB,GAAGX,WAAW,CAAC,CAAC,CAAC;AAC3C,MAAMY,gBAAgB,GAAGZ,WAAW,CAAC,CAAC,CAAC;AAEvC,MAAMa,sBAAsB,gBAAGjB,UAAU,CAIvC,CACE;EACEkB,QAAQ;EACRC,mBAAmB,GAAGX,UAAU,CAACY,UAAU;EAC3CC,QAAQ,GAAG,KAAK;EAChBC,oBAAoB,GAAG,QAAQ;EAC/BC,MAAM,GAAG,KAAK;EACdC,MAAM,GAAG,CAAC;EACVC,mBAAmB,GAAGV,oBAAoB;EAC1CW,UAAU,GAAGV,gBAAgB;EAC7BW,wCAAwC,GAAG,KAAK;EAChDC,QAAQ,EAAEC,YAAY;EACtBC,mBAAmB,EAAEC,uBAAuB;EAC5CC,YAAY;EACZ,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAMC,aAAa,GAAG9B,cAAc,CAAwB,CAAC;EAC7D,MAAM+B,KAAK,GAAG3B,cAAc,CAACyB,GAAG,EAAEC,aAAa,CAAC;EAChD,MAAME,QAAQ,GAAG9B,eAAe,CAAC,MAC/B,OAAOgB,MAAM,KAAK,SAAS,GAAGA,MAAM,GAAGA,MAAM,CAACe,KAChD,CAAC;EACD,MAAM;IACJC,OAAO;IACPC,aAAa;IACbC,cAAc;IACdC,MAAM;IACNC,MAAM;IACNC,IAAI;IACJhB,QAAQ,EAAEiB,gBAAgB;IAC1Bf,mBAAmB,EAAEgB;EACvB,CAAC,GAAGnC,eAAe,CAACwB,aAAa,EAAE;IACjCd,QAAQ;IACRC,oBAAoB;IACpBC,MAAM,EAAEc,QAAQ;IAChBb,MAAM;IACNE,UAAU;IACVD;EACF,CAAC,CAAC;EAEFZ,sBAAsB,CAAC;IACrBsB,aAAa;IACbV,mBAAmB;IACnBsB,eAAe,EAAER,OAAO;IACxBb,UAAU;IACVgB,MAAM;IACNC,MAAM;IACNC,IAAI;IACJH,cAAc;IACdpB,QAAQ;IACRC,oBAAoB;IACpBC,MAAM,EAAEc;EACV,CAAC,CAAC;EAEFvB,gBAAgB,CAAC;IACfS,MAAM,EAAEc,QAAQ;IAChBb,MAAM;IACNe;EACF,CAAC,CAAC;EAEF3B,aAAa,CAAC;IACZ8B,MAAM;IACNC,MAAM;IACNC,IAAI;IACJvB,QAAQ;IACRW;EACF,CAAC,CAAC;;EAEF;EACA;EACA;EACA;EACA;EACA;EACA;EACA,MAAMgB,YAAY,GAAGzC,eAAe,CAAC,MACnC0C,IAAI,CAACC,GAAG,CACNP,MAAM,CAACL,KAAK,CAACa,MAAM,EACnBF,IAAI,CAACG,GAAG,CAAC1B,UAAU,CAACY,KAAK,EAAEC,OAAO,CAACD,KAAK,GAAGb,mBAAmB,CAACa,KAAK,CACtE,CACF,CAAC;;EAED;EACA;EACA;EACA,MAAMe,gBAAgB,GAAG9C,eAAe,CACtC,MAAMgC,OAAO,CAACD,KAAK,GAAGb,mBAAmB,CAACa,KAC5C,CAAC;EAED,MAAMV,QAAQ,GAAG3B,WAAW,CACzBqD,CAAoB,IAAK;IACxBT,gBAAgB,CAACS,CAAC,CAAC;IACnBzB,YAAY,aAAZA,YAAY,eAAZA,YAAY,CAAGyB,CAAC,CAAC;EACnB,CAAC,EACD,CAACT,gBAAgB,EAAEhB,YAAY,CACjC,CAAC;EAED,MAAMC,mBAAmB,GAAG7B,WAAW,CACrC,CAACsD,CAAS,EAAEC,CAAS,KAAK;IACxBV,2BAA2B,CAACS,CAAC,EAAEC,CAAC,CAAC;IACjCzB,uBAAuB,aAAvBA,uBAAuB,eAAvBA,uBAAuB,CAAGwB,CAAC,EAAEC,CAAC,CAAC;EACjC,CAAC,EACD,CAACV,2BAA2B,EAAEf,uBAAuB,CACvD,CAAC;;EAED;EACA;EACA;EACA;EACA,MAAM0B,WAAW,GAAGnD,gBAAgB,CAClC,OAAO;IACLoD,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAE,CAACnB,aAAa,CAACF;IAAM,CAAC;EAClD,CAAC,CAAC,EACF,EACF,CAAC;EACD,MAAMsB,MAAM,GAAG1D,OAAO,CACpB,MAAM,CAAC2D,MAAM,CAACC,UAAU,EAAEL,WAAW,CAAC,EACtC,CAACA,WAAW,CACd,CAAC;EAED,oBACE1D,KAAA,CAAAgE,aAAA,CAAAhE,KAAA,CAAAiE,QAAA,qBACEjE,KAAA,CAAAgE,aAAA,CAACrD,2BAA2B,EAAAuD,QAAA;IAC1B/B,GAAG,EAAEE;EAAM,GACPH,IAAI;IACRN,wCAAwC,EACtCA,wCACD;IACDuC,aAAa,EAAElB,YAAa;IAC5BP,cAAc,EAAEA,cAAe;IAC/BpB,QAAQ,EAAEA,QAAS;IACnB8C,sBAAsB,EAAEd,gBAAiB;IACzClC,mBAAmB,EAAEA,mBAAoB;IACzCW,mBAAmB,EAAEA,mBAAoB;IACzCF,QAAQ,EAAEA;EAAS,IAElBV,QAC0B,CAAC,eAC9BnB,KAAA,CAAAgE,aAAA,CAACvD,UAAU,CAAC4D,IAAI;IAACC,KAAK,EAAET;EAAO,CAAE,CACjC,CAAC;AAEP,CACF,CAAC;AAED,MAAMC,MAAM,GAAG1D,UAAU,CAACmE,MAAM,CAAC;EAC/BR,UAAU,EAAE;IACVS,OAAO,EAAE,MAAM;IACfC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAevD,sBAAsB","ignoreList":[]}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { useAnimatedReaction, useSharedValue } from "react-native-reanimated";
|
|
2
|
+
import { useKeyboardHandler } from "../../../hooks";
|
|
3
|
+
import { getEffectiveHeight } from "../useChatKeyboard/helpers";
|
|
4
|
+
/**
|
|
5
|
+
* Hook that reconciles keyboard padding after a frozen interval.
|
|
6
|
+
*
|
|
7
|
+
* `useChatKeyboard` handlers skip all writes while `freeze` is enabled, so if
|
|
8
|
+
* the keyboard opens or closes during the frozen interval `padding` keeps a
|
|
9
|
+
* stale value (e.g. the open-keyboard height after a frozen dismissal). This
|
|
10
|
+
* hook observes keyboard events independently of `freeze` and recomputes the
|
|
11
|
+
* padding from the latest observed keyboard height as soon as `freeze`
|
|
12
|
+
* transitions back to `false`.
|
|
13
|
+
*
|
|
14
|
+
* @param options - Keyboard padding shared values plus the scroll view `offset`.
|
|
15
|
+
* @param options.freeze - When `true`, keyboard-driven layout writes are skipped.
|
|
16
|
+
* @param options.offset - The distance between the bottom of the screen and the `ScrollView`.
|
|
17
|
+
* @param options.padding - Keyboard-driven padding managed by `useChatKeyboard`.
|
|
18
|
+
* @example
|
|
19
|
+
* ```ts
|
|
20
|
+
* useFrozenPadding({ freeze, offset, padding });
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
function useFrozenPadding({
|
|
24
|
+
freeze,
|
|
25
|
+
offset,
|
|
26
|
+
padding
|
|
27
|
+
}) {
|
|
28
|
+
const lastHeight = useSharedValue(0);
|
|
29
|
+
const targetKeyboardHeight = useSharedValue(0);
|
|
30
|
+
useKeyboardHandler({
|
|
31
|
+
onStart: e => {
|
|
32
|
+
"worklet";
|
|
33
|
+
|
|
34
|
+
if (e.height > 0) {
|
|
35
|
+
// eslint-disable-next-line react-compiler/react-compiler
|
|
36
|
+
targetKeyboardHeight.value = e.height;
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
onMove: e => {
|
|
40
|
+
"worklet";
|
|
41
|
+
|
|
42
|
+
lastHeight.value = e.height;
|
|
43
|
+
},
|
|
44
|
+
onEnd: e => {
|
|
45
|
+
"worklet";
|
|
46
|
+
|
|
47
|
+
lastHeight.value = e.height;
|
|
48
|
+
}
|
|
49
|
+
}, []);
|
|
50
|
+
useAnimatedReaction(() => freeze.value, (isFrozen, wasFrozen) => {
|
|
51
|
+
if (!isFrozen && wasFrozen === true) {
|
|
52
|
+
padding.value = getEffectiveHeight(lastHeight.value, targetKeyboardHeight.value, offset);
|
|
53
|
+
}
|
|
54
|
+
}, [offset]);
|
|
55
|
+
}
|
|
56
|
+
export { useFrozenPadding };
|
|
57
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useAnimatedReaction","useSharedValue","useKeyboardHandler","getEffectiveHeight","useFrozenPadding","freeze","offset","padding","lastHeight","targetKeyboardHeight","onStart","e","height","value","onMove","onEnd","isFrozen","wasFrozen"],"sources":["index.ts"],"sourcesContent":["import { useAnimatedReaction, useSharedValue } from \"react-native-reanimated\";\n\nimport { useKeyboardHandler } from \"../../../hooks\";\nimport { getEffectiveHeight } from \"../useChatKeyboard/helpers\";\n\nimport type { SharedValue } from \"react-native-reanimated\";\n\ntype UseFrozenPaddingOptions = {\n /** When `true`, keyboard-driven layout writes are skipped. */\n freeze: SharedValue<boolean>;\n /** The distance between the bottom of the screen and the `ScrollView`. */\n offset: number;\n /** Keyboard-driven padding managed by `useChatKeyboard`. */\n padding: SharedValue<number>;\n};\n\n/**\n * Hook that reconciles keyboard padding after a frozen interval.\n *\n * `useChatKeyboard` handlers skip all writes while `freeze` is enabled, so if\n * the keyboard opens or closes during the frozen interval `padding` keeps a\n * stale value (e.g. the open-keyboard height after a frozen dismissal). This\n * hook observes keyboard events independently of `freeze` and recomputes the\n * padding from the latest observed keyboard height as soon as `freeze`\n * transitions back to `false`.\n *\n * @param options - Keyboard padding shared values plus the scroll view `offset`.\n * @param options.freeze - When `true`, keyboard-driven layout writes are skipped.\n * @param options.offset - The distance between the bottom of the screen and the `ScrollView`.\n * @param options.padding - Keyboard-driven padding managed by `useChatKeyboard`.\n * @example\n * ```ts\n * useFrozenPadding({ freeze, offset, padding });\n * ```\n */\nfunction useFrozenPadding({\n freeze,\n offset,\n padding,\n}: UseFrozenPaddingOptions): void {\n const lastHeight = useSharedValue(0);\n const targetKeyboardHeight = useSharedValue(0);\n\n useKeyboardHandler(\n {\n onStart: (e) => {\n \"worklet\";\n\n if (e.height > 0) {\n // eslint-disable-next-line react-compiler/react-compiler\n targetKeyboardHeight.value = e.height;\n }\n },\n onMove: (e) => {\n \"worklet\";\n\n lastHeight.value = e.height;\n },\n onEnd: (e) => {\n \"worklet\";\n\n lastHeight.value = e.height;\n },\n },\n [],\n );\n\n useAnimatedReaction(\n () => freeze.value,\n (isFrozen, wasFrozen) => {\n if (!isFrozen && wasFrozen === true) {\n padding.value = getEffectiveHeight(\n lastHeight.value,\n targetKeyboardHeight.value,\n offset,\n );\n }\n },\n [offset],\n );\n}\n\nexport { useFrozenPadding };\n"],"mappings":"AAAA,SAASA,mBAAmB,EAAEC,cAAc,QAAQ,yBAAyB;AAE7E,SAASC,kBAAkB,QAAQ,gBAAgB;AACnD,SAASC,kBAAkB,QAAQ,4BAA4B;AAa/D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,gBAAgBA,CAAC;EACxBC,MAAM;EACNC,MAAM;EACNC;AACuB,CAAC,EAAQ;EAChC,MAAMC,UAAU,GAAGP,cAAc,CAAC,CAAC,CAAC;EACpC,MAAMQ,oBAAoB,GAAGR,cAAc,CAAC,CAAC,CAAC;EAE9CC,kBAAkB,CAChB;IACEQ,OAAO,EAAGC,CAAC,IAAK;MACd,SAAS;;MAET,IAAIA,CAAC,CAACC,MAAM,GAAG,CAAC,EAAE;QAChB;QACAH,oBAAoB,CAACI,KAAK,GAAGF,CAAC,CAACC,MAAM;MACvC;IACF,CAAC;IACDE,MAAM,EAAGH,CAAC,IAAK;MACb,SAAS;;MAETH,UAAU,CAACK,KAAK,GAAGF,CAAC,CAACC,MAAM;IAC7B,CAAC;IACDG,KAAK,EAAGJ,CAAC,IAAK;MACZ,SAAS;;MAETH,UAAU,CAACK,KAAK,GAAGF,CAAC,CAACC,MAAM;IAC7B;EACF,CAAC,EACD,EACF,CAAC;EAEDZ,mBAAmB,CACjB,MAAMK,MAAM,CAACQ,KAAK,EAClB,CAACG,QAAQ,EAAEC,SAAS,KAAK;IACvB,IAAI,CAACD,QAAQ,IAAIC,SAAS,KAAK,IAAI,EAAE;MACnCV,OAAO,CAACM,KAAK,GAAGV,kBAAkB,CAChCK,UAAU,CAACK,KAAK,EAChBJ,oBAAoB,CAACI,KAAK,EAC1BP,MACF,CAAC;IACH;EACF,CAAC,EACD,CAACA,MAAM,CACT,CAAC;AACH;AAEA,SAASF,gBAAgB","ignoreList":[]}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { SharedValue } from "react-native-reanimated";
|
|
2
|
+
type UseFrozenPaddingOptions = {
|
|
3
|
+
/** When `true`, keyboard-driven layout writes are skipped. */
|
|
4
|
+
freeze: SharedValue<boolean>;
|
|
5
|
+
/** The distance between the bottom of the screen and the `ScrollView`. */
|
|
6
|
+
offset: number;
|
|
7
|
+
/** Keyboard-driven padding managed by `useChatKeyboard`. */
|
|
8
|
+
padding: SharedValue<number>;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* Hook that reconciles keyboard padding after a frozen interval.
|
|
12
|
+
*
|
|
13
|
+
* `useChatKeyboard` handlers skip all writes while `freeze` is enabled, so if
|
|
14
|
+
* the keyboard opens or closes during the frozen interval `padding` keeps a
|
|
15
|
+
* stale value (e.g. the open-keyboard height after a frozen dismissal). This
|
|
16
|
+
* hook observes keyboard events independently of `freeze` and recomputes the
|
|
17
|
+
* padding from the latest observed keyboard height as soon as `freeze`
|
|
18
|
+
* transitions back to `false`.
|
|
19
|
+
*
|
|
20
|
+
* @param options - Keyboard padding shared values plus the scroll view `offset`.
|
|
21
|
+
* @param options.freeze - When `true`, keyboard-driven layout writes are skipped.
|
|
22
|
+
* @param options.offset - The distance between the bottom of the screen and the `ScrollView`.
|
|
23
|
+
* @param options.padding - Keyboard-driven padding managed by `useChatKeyboard`.
|
|
24
|
+
* @example
|
|
25
|
+
* ```ts
|
|
26
|
+
* useFrozenPadding({ freeze, offset, padding });
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
declare function useFrozenPadding({ freeze, offset, padding, }: UseFrozenPaddingOptions): void;
|
|
30
|
+
export { useFrozenPadding };
|
package/package.json
CHANGED
|
@@ -14,6 +14,7 @@ import ScrollViewWithBottomPadding from "../ScrollViewWithBottomPadding";
|
|
|
14
14
|
import { useChatKeyboard } from "./useChatKeyboard";
|
|
15
15
|
import { useEndVisible } from "./useEndVisible";
|
|
16
16
|
import { useExtraContentPadding } from "./useExtraContentPadding";
|
|
17
|
+
import { useFrozenPadding } from "./useFrozenPadding";
|
|
17
18
|
|
|
18
19
|
import type { KeyboardChatScrollViewProps } from "./types";
|
|
19
20
|
import type { LayoutChangeEvent } from "react-native";
|
|
@@ -80,6 +81,12 @@ const KeyboardChatScrollView = forwardRef<
|
|
|
80
81
|
freeze: freezeSV,
|
|
81
82
|
});
|
|
82
83
|
|
|
84
|
+
useFrozenPadding({
|
|
85
|
+
freeze: freezeSV,
|
|
86
|
+
offset,
|
|
87
|
+
padding,
|
|
88
|
+
});
|
|
89
|
+
|
|
83
90
|
useEndVisible({
|
|
84
91
|
scroll,
|
|
85
92
|
layout,
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { useAnimatedReaction, useSharedValue } from "react-native-reanimated";
|
|
2
|
+
|
|
3
|
+
import { useKeyboardHandler } from "../../../hooks";
|
|
4
|
+
import { getEffectiveHeight } from "../useChatKeyboard/helpers";
|
|
5
|
+
|
|
6
|
+
import type { SharedValue } from "react-native-reanimated";
|
|
7
|
+
|
|
8
|
+
type UseFrozenPaddingOptions = {
|
|
9
|
+
/** When `true`, keyboard-driven layout writes are skipped. */
|
|
10
|
+
freeze: SharedValue<boolean>;
|
|
11
|
+
/** The distance between the bottom of the screen and the `ScrollView`. */
|
|
12
|
+
offset: number;
|
|
13
|
+
/** Keyboard-driven padding managed by `useChatKeyboard`. */
|
|
14
|
+
padding: SharedValue<number>;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Hook that reconciles keyboard padding after a frozen interval.
|
|
19
|
+
*
|
|
20
|
+
* `useChatKeyboard` handlers skip all writes while `freeze` is enabled, so if
|
|
21
|
+
* the keyboard opens or closes during the frozen interval `padding` keeps a
|
|
22
|
+
* stale value (e.g. the open-keyboard height after a frozen dismissal). This
|
|
23
|
+
* hook observes keyboard events independently of `freeze` and recomputes the
|
|
24
|
+
* padding from the latest observed keyboard height as soon as `freeze`
|
|
25
|
+
* transitions back to `false`.
|
|
26
|
+
*
|
|
27
|
+
* @param options - Keyboard padding shared values plus the scroll view `offset`.
|
|
28
|
+
* @param options.freeze - When `true`, keyboard-driven layout writes are skipped.
|
|
29
|
+
* @param options.offset - The distance between the bottom of the screen and the `ScrollView`.
|
|
30
|
+
* @param options.padding - Keyboard-driven padding managed by `useChatKeyboard`.
|
|
31
|
+
* @example
|
|
32
|
+
* ```ts
|
|
33
|
+
* useFrozenPadding({ freeze, offset, padding });
|
|
34
|
+
* ```
|
|
35
|
+
*/
|
|
36
|
+
function useFrozenPadding({
|
|
37
|
+
freeze,
|
|
38
|
+
offset,
|
|
39
|
+
padding,
|
|
40
|
+
}: UseFrozenPaddingOptions): void {
|
|
41
|
+
const lastHeight = useSharedValue(0);
|
|
42
|
+
const targetKeyboardHeight = useSharedValue(0);
|
|
43
|
+
|
|
44
|
+
useKeyboardHandler(
|
|
45
|
+
{
|
|
46
|
+
onStart: (e) => {
|
|
47
|
+
"worklet";
|
|
48
|
+
|
|
49
|
+
if (e.height > 0) {
|
|
50
|
+
// eslint-disable-next-line react-compiler/react-compiler
|
|
51
|
+
targetKeyboardHeight.value = e.height;
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
onMove: (e) => {
|
|
55
|
+
"worklet";
|
|
56
|
+
|
|
57
|
+
lastHeight.value = e.height;
|
|
58
|
+
},
|
|
59
|
+
onEnd: (e) => {
|
|
60
|
+
"worklet";
|
|
61
|
+
|
|
62
|
+
lastHeight.value = e.height;
|
|
63
|
+
},
|
|
64
|
+
},
|
|
65
|
+
[],
|
|
66
|
+
);
|
|
67
|
+
|
|
68
|
+
useAnimatedReaction(
|
|
69
|
+
() => freeze.value,
|
|
70
|
+
(isFrozen, wasFrozen) => {
|
|
71
|
+
if (!isFrozen && wasFrozen === true) {
|
|
72
|
+
padding.value = getEffectiveHeight(
|
|
73
|
+
lastHeight.value,
|
|
74
|
+
targetKeyboardHeight.value,
|
|
75
|
+
offset,
|
|
76
|
+
);
|
|
77
|
+
}
|
|
78
|
+
},
|
|
79
|
+
[offset],
|
|
80
|
+
);
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
export { useFrozenPadding };
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
//
|
|
2
|
-
// UITextView+DelegateManager.m
|
|
3
|
-
// react-native-keyboard-controller
|
|
4
|
-
//
|
|
5
|
-
// Created by Kiryl Ziusko on 24/04/2024.
|
|
6
|
-
//
|
|
7
|
-
|
|
8
|
-
#import <objc/runtime.h>
|
|
9
|
-
#import "UITextView+DelegateManager.h"
|
|
10
|
-
|
|
11
|
-
@implementation UITextView (DelegateManager)
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* We are aware that delegate is set by RN on mount and we can not re-define it
|
|
15
|
-
* but we are using composite delegate to forward all calls to original delegate
|
|
16
|
-
* so we use this method to force set our delegate
|
|
17
|
-
*/
|
|
18
|
-
- (void)setForceDelegate:(id<UITextViewDelegate>)delegate
|
|
19
|
-
{
|
|
20
|
-
Ivar ivar = class_getInstanceVariable([UITextView class], "_delegate");
|
|
21
|
-
if (ivar) {
|
|
22
|
-
object_setIvar(self, ivar, delegate);
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
@end
|