react-native-keyboard-controller 1.17.4 → 1.17.5

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.
Files changed (26) hide show
  1. package/android/src/base/java/com/reactnativekeyboardcontroller/KeyboardControllerPackage.kt +3 -3
  2. package/android/src/fabric/java/com/reactnativekeyboardcontroller/KeyboardControllerViewManager.kt +3 -5
  3. package/android/src/fabric/java/com/reactnativekeyboardcontroller/KeyboardGestureAreaViewManager.kt +3 -5
  4. package/android/src/fabric/java/com/reactnativekeyboardcontroller/OverKeyboardViewManager.kt +3 -5
  5. package/android/src/main/java/com/reactnativekeyboardcontroller/managers/KeyboardControllerViewManagerImpl.kt +1 -5
  6. package/android/src/main/java/com/reactnativekeyboardcontroller/managers/KeyboardGestureAreaViewManagerImpl.kt +1 -5
  7. package/android/src/main/java/com/reactnativekeyboardcontroller/managers/OverKeyboardViewManagerImpl.kt +1 -5
  8. package/android/src/paper/java/com/reactnativekeyboardcontroller/KeyboardControllerViewManager.kt +2 -5
  9. package/android/src/paper/java/com/reactnativekeyboardcontroller/KeyboardGestureAreaViewManager.kt +2 -5
  10. package/android/src/paper/java/com/reactnativekeyboardcontroller/OverKeyboardViewManager.kt +2 -5
  11. package/android/src/turbo/java/com/reactnativekeyboardcontroller/KeyboardControllerPackage.kt +3 -3
  12. package/ios/extensions/String.swift +12 -0
  13. package/ios/observers/KeyboardMovementObserver.swift +17 -8
  14. package/ios/traversal/KeyboardView.swift +6 -3
  15. package/lib/commonjs/components/KeyboardToolbar/constants.js +17 -0
  16. package/lib/commonjs/components/KeyboardToolbar/constants.js.map +1 -0
  17. package/lib/commonjs/components/KeyboardToolbar/index.js +23 -20
  18. package/lib/commonjs/components/KeyboardToolbar/index.js.map +1 -1
  19. package/lib/module/components/KeyboardToolbar/constants.js +11 -0
  20. package/lib/module/components/KeyboardToolbar/constants.js.map +1 -0
  21. package/lib/module/components/KeyboardToolbar/index.js +15 -12
  22. package/lib/module/components/KeyboardToolbar/index.js.map +1 -1
  23. package/lib/typescript/components/KeyboardToolbar/constants.d.ts +10 -0
  24. package/package.json +1 -1
  25. package/src/components/KeyboardToolbar/constants.ts +15 -0
  26. package/src/components/KeyboardToolbar/index.tsx +43 -15
@@ -54,8 +54,8 @@ class KeyboardControllerPackage : BaseReactPackage() {
54
54
 
55
55
  override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> =
56
56
  listOf(
57
- KeyboardControllerViewManager(reactContext),
58
- KeyboardGestureAreaViewManager(reactContext),
59
- OverKeyboardViewManager(reactContext),
57
+ KeyboardControllerViewManager(),
58
+ KeyboardGestureAreaViewManager(),
59
+ OverKeyboardViewManager(),
60
60
  )
61
61
  }
@@ -1,6 +1,5 @@
1
1
  package com.reactnativekeyboardcontroller
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.ThemedReactContext
5
4
  import com.facebook.react.uimanager.ViewManagerDelegate
6
5
  import com.facebook.react.uimanager.annotations.ReactProp
@@ -11,11 +10,10 @@ import com.facebook.react.views.view.ReactViewManager
11
10
  import com.reactnativekeyboardcontroller.managers.KeyboardControllerViewManagerImpl
12
11
  import com.reactnativekeyboardcontroller.views.EdgeToEdgeReactViewGroup
13
12
 
14
- class KeyboardControllerViewManager(
15
- mReactContext: ReactApplicationContext,
16
- ) : ReactViewManager(),
13
+ class KeyboardControllerViewManager :
14
+ ReactViewManager(),
17
15
  KeyboardControllerViewManagerInterface<ReactViewGroup> {
18
- private val manager = KeyboardControllerViewManagerImpl(mReactContext)
16
+ private val manager = KeyboardControllerViewManagerImpl()
19
17
  private val mDelegate = KeyboardControllerViewManagerDelegate(this)
20
18
 
21
19
  // region Lifecycle
@@ -1,6 +1,5 @@
1
1
  package com.reactnativekeyboardcontroller
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.ThemedReactContext
5
4
  import com.facebook.react.uimanager.ViewManagerDelegate
6
5
  import com.facebook.react.uimanager.annotations.ReactProp
@@ -11,11 +10,10 @@ import com.facebook.react.views.view.ReactViewManager
11
10
  import com.reactnativekeyboardcontroller.managers.KeyboardGestureAreaViewManagerImpl
12
11
  import com.reactnativekeyboardcontroller.views.KeyboardGestureAreaReactViewGroup
13
12
 
14
- class KeyboardGestureAreaViewManager(
15
- mReactContext: ReactApplicationContext,
16
- ) : ReactViewManager(),
13
+ class KeyboardGestureAreaViewManager :
14
+ ReactViewManager(),
17
15
  KeyboardGestureAreaManagerInterface<ReactViewGroup> {
18
- private val manager = KeyboardGestureAreaViewManagerImpl(mReactContext)
16
+ private val manager = KeyboardGestureAreaViewManagerImpl()
19
17
  private val mDelegate = KeyboardGestureAreaManagerDelegate(this)
20
18
 
21
19
  override fun getDelegate(): ViewManagerDelegate<ReactViewGroup> = mDelegate
@@ -1,6 +1,5 @@
1
1
  package com.reactnativekeyboardcontroller
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.LayoutShadowNode
5
4
  import com.facebook.react.uimanager.ReactStylesDiffMap
6
5
  import com.facebook.react.uimanager.StateWrapper
@@ -14,11 +13,10 @@ import com.reactnativekeyboardcontroller.managers.OverKeyboardViewManagerImpl
14
13
  import com.reactnativekeyboardcontroller.views.overlay.OverKeyboardHostShadowNode
15
14
  import com.reactnativekeyboardcontroller.views.overlay.OverKeyboardHostView
16
15
 
17
- class OverKeyboardViewManager(
18
- mReactContext: ReactApplicationContext,
19
- ) : ViewGroupManager<OverKeyboardHostView>(),
16
+ class OverKeyboardViewManager :
17
+ ViewGroupManager<OverKeyboardHostView>(),
20
18
  OverKeyboardViewManagerInterface<OverKeyboardHostView> {
21
- private val manager = OverKeyboardViewManagerImpl(mReactContext)
19
+ private val manager = OverKeyboardViewManagerImpl()
22
20
  private val mDelegate = OverKeyboardViewManagerDelegate(this)
23
21
 
24
22
  override fun getDelegate(): ViewManagerDelegate<OverKeyboardHostView> = mDelegate
@@ -1,6 +1,5 @@
1
1
  package com.reactnativekeyboardcontroller.managers
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.common.MapBuilder
5
4
  import com.facebook.react.uimanager.ThemedReactContext
6
5
  import com.reactnativekeyboardcontroller.events.FocusedInputLayoutChangedEvent
@@ -10,10 +9,7 @@ import com.reactnativekeyboardcontroller.events.KeyboardTransitionEvent
10
9
  import com.reactnativekeyboardcontroller.listeners.WindowDimensionListener
11
10
  import com.reactnativekeyboardcontroller.views.EdgeToEdgeReactViewGroup
12
11
 
13
- @Suppress("detekt:UnusedPrivateProperty")
14
- class KeyboardControllerViewManagerImpl(
15
- mReactContext: ReactApplicationContext,
16
- ) {
12
+ class KeyboardControllerViewManagerImpl {
17
13
  private var listener: WindowDimensionListener? = null
18
14
 
19
15
  fun createViewInstance(reactContext: ThemedReactContext): EdgeToEdgeReactViewGroup {
@@ -1,13 +1,9 @@
1
1
  package com.reactnativekeyboardcontroller.managers
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.ThemedReactContext
5
4
  import com.reactnativekeyboardcontroller.views.KeyboardGestureAreaReactViewGroup
6
5
 
7
- @Suppress("detekt:UnusedPrivateProperty")
8
- class KeyboardGestureAreaViewManagerImpl(
9
- mReactContext: ReactApplicationContext,
10
- ) {
6
+ class KeyboardGestureAreaViewManagerImpl {
11
7
  fun createViewInstance(reactContext: ThemedReactContext): KeyboardGestureAreaReactViewGroup =
12
8
  KeyboardGestureAreaReactViewGroup(reactContext)
13
9
 
@@ -1,13 +1,9 @@
1
1
  package com.reactnativekeyboardcontroller.managers
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.ThemedReactContext
5
4
  import com.reactnativekeyboardcontroller.views.overlay.OverKeyboardHostView
6
5
 
7
- @Suppress("detekt:UnusedPrivateProperty")
8
- class OverKeyboardViewManagerImpl(
9
- mReactContext: ReactApplicationContext,
10
- ) {
6
+ class OverKeyboardViewManagerImpl {
11
7
  fun createViewInstance(reactContext: ThemedReactContext): OverKeyboardHostView = OverKeyboardHostView(reactContext)
12
8
 
13
9
  fun setVisible(
@@ -1,6 +1,5 @@
1
1
  package com.reactnativekeyboardcontroller
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.ThemedReactContext
5
4
  import com.facebook.react.uimanager.annotations.ReactProp
6
5
  import com.facebook.react.views.view.ReactViewGroup
@@ -8,10 +7,8 @@ import com.facebook.react.views.view.ReactViewManager
8
7
  import com.reactnativekeyboardcontroller.managers.KeyboardControllerViewManagerImpl
9
8
  import com.reactnativekeyboardcontroller.views.EdgeToEdgeReactViewGroup
10
9
 
11
- class KeyboardControllerViewManager(
12
- mReactContext: ReactApplicationContext,
13
- ) : ReactViewManager() {
14
- private val manager = KeyboardControllerViewManagerImpl(mReactContext)
10
+ class KeyboardControllerViewManager : ReactViewManager() {
11
+ private val manager = KeyboardControllerViewManagerImpl()
15
12
 
16
13
  // region Lifecycle
17
14
  override fun createViewInstance(context: ThemedReactContext): ReactViewGroup = manager.createViewInstance(context)
@@ -1,16 +1,13 @@
1
1
  package com.reactnativekeyboardcontroller
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.ThemedReactContext
5
4
  import com.facebook.react.uimanager.annotations.ReactProp
6
5
  import com.facebook.react.views.view.ReactViewManager
7
6
  import com.reactnativekeyboardcontroller.managers.KeyboardGestureAreaViewManagerImpl
8
7
  import com.reactnativekeyboardcontroller.views.KeyboardGestureAreaReactViewGroup
9
8
 
10
- class KeyboardGestureAreaViewManager(
11
- mReactContext: ReactApplicationContext,
12
- ) : ReactViewManager() {
13
- private val manager = KeyboardGestureAreaViewManagerImpl(mReactContext)
9
+ class KeyboardGestureAreaViewManager : ReactViewManager() {
10
+ private val manager = KeyboardGestureAreaViewManagerImpl()
14
11
 
15
12
  override fun getName(): String = KeyboardGestureAreaViewManagerImpl.NAME
16
13
 
@@ -1,6 +1,5 @@
1
1
  package com.reactnativekeyboardcontroller
2
2
 
3
- import com.facebook.react.bridge.ReactApplicationContext
4
3
  import com.facebook.react.uimanager.LayoutShadowNode
5
4
  import com.facebook.react.uimanager.ThemedReactContext
6
5
  import com.facebook.react.uimanager.ViewGroupManager
@@ -9,10 +8,8 @@ import com.reactnativekeyboardcontroller.managers.OverKeyboardViewManagerImpl
9
8
  import com.reactnativekeyboardcontroller.views.overlay.OverKeyboardHostShadowNode
10
9
  import com.reactnativekeyboardcontroller.views.overlay.OverKeyboardHostView
11
10
 
12
- class OverKeyboardViewManager(
13
- mReactContext: ReactApplicationContext,
14
- ) : ViewGroupManager<OverKeyboardHostView>() {
15
- private val manager = OverKeyboardViewManagerImpl(mReactContext)
11
+ class OverKeyboardViewManager : ViewGroupManager<OverKeyboardHostView>() {
12
+ private val manager = OverKeyboardViewManagerImpl()
16
13
 
17
14
  override fun getName(): String = OverKeyboardViewManagerImpl.NAME
18
15
 
@@ -56,8 +56,8 @@ class KeyboardControllerPackage : TurboReactPackage() {
56
56
 
57
57
  override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> =
58
58
  listOf(
59
- KeyboardControllerViewManager(reactContext),
60
- KeyboardGestureAreaViewManager(reactContext),
61
- OverKeyboardViewManager(reactContext),
59
+ KeyboardControllerViewManager(),
60
+ KeyboardGestureAreaViewManager(),
61
+ OverKeyboardViewManager(),
62
62
  )
63
63
  }
@@ -0,0 +1,12 @@
1
+ //
2
+ // String.swift
3
+ // Pods
4
+ //
5
+ // Created by Kiryl Ziusko on 10/06/2025.
6
+ //
7
+
8
+ public extension String {
9
+ func hasAnyPrefix(_ prefixes: [String]) -> Bool {
10
+ prefixes.contains { hasPrefix($0) }
11
+ }
12
+ }
@@ -32,7 +32,7 @@ public class KeyboardMovementObserver: NSObject {
32
32
 
33
33
  private var _windowsCount: Int = 0
34
34
  private var prevKeyboardPosition = 0.0
35
- private var displayLink: CADisplayLink?
35
+ private var displayLink: CADisplayLink!
36
36
  private var interactiveKeyboardObserver: NSKeyValueObservation?
37
37
  private var isMounted = false
38
38
  // state variables
@@ -57,6 +57,18 @@ public class KeyboardMovementObserver: NSObject {
57
57
  self.onNotify = onNotify
58
58
  self.onRequestAnimation = onRequestAnimation
59
59
  self.onCancelAnimation = onCancelAnimation
60
+
61
+ super.init()
62
+
63
+ displayLink = CADisplayLink(target: self, selector: #selector(updateKeyboardFrame))
64
+ displayLink.preferredFramesPerSecond = 120 // will fallback to 60 fps for devices without Pro Motion display
65
+ displayLink.add(to: .main, forMode: .common)
66
+ displayLink.isPaused = true
67
+ }
68
+
69
+ deinit {
70
+ displayLink.invalidate()
71
+ displayLink = nil
60
72
  }
61
73
 
62
74
  @objc public func mount() {
@@ -109,7 +121,7 @@ public class KeyboardMovementObserver: NSObject {
109
121
 
110
122
  private func keyboardDidMoveInteractively(changeValue: CGPoint) {
111
123
  // if we are currently animating keyboard -> we need to ignore values from KVO
112
- if displayLink != nil {
124
+ if !displayLink.isPaused {
113
125
  return
114
126
  }
115
127
  // if keyboard height is not equal to its bounds - we can ignore
@@ -232,18 +244,15 @@ public class KeyboardMovementObserver: NSObject {
232
244
  // sometimes `will` events can be called multiple times.
233
245
  // To avoid double re-creation of listener we are adding this condition
234
246
  // (if active link is present, then no need to re-setup a listener)
235
- if displayLink != nil {
247
+ if !displayLink.isPaused {
236
248
  return
237
249
  }
238
250
 
239
- displayLink = CADisplayLink(target: self, selector: #selector(updateKeyboardFrame))
240
- displayLink?.preferredFramesPerSecond = 120 // will fallback to 60 fps for devices without Pro Motion display
241
- displayLink?.add(to: .main, forMode: .common)
251
+ displayLink.isPaused = false
242
252
  }
243
253
 
244
254
  @objc func removeKeyboardWatcher() {
245
- displayLink?.invalidate()
246
- displayLink = nil
255
+ displayLink.isPaused = true
247
256
  }
248
257
 
249
258
  func initializeAnimation(fromValue: Double, toValue: Double) {
@@ -10,15 +10,18 @@ import Foundation
10
10
  import UIKit
11
11
 
12
12
  enum KeyboardView {
13
+ private static let windowPrefix = "<UITextEffectsWindow"
14
+ private static let containerPrefixes = ["<UIInputSetContainerView", "<UITrackingWindowView"]
15
+ private static let hostPrefixes = ["<UIInputSetHostView", "<UIKeyboardItemContainerView"]
13
16
  // inspired by https://stackoverflow.com/questions/32598490/show-uiview-with-buttons-over-keyboard-like-in-skype-viber-messengers-swift-i
14
17
  static func find() -> UIView? {
15
18
  let windows = UIApplication.shared.windows
16
19
  for window in windows {
17
- if window.description.hasPrefix("<UITextEffectsWindow") {
20
+ if window.description.hasPrefix(windowPrefix) {
18
21
  for subview in window.subviews {
19
- if subview.description.hasPrefix("<UIInputSetContainerView") {
22
+ if subview.description.hasAnyPrefix(containerPrefixes) {
20
23
  for hostView in subview.subviews {
21
- if hostView.description.hasPrefix("<UIInputSetHostView"), hostView.frame.height != 0 {
24
+ if hostView.description.hasAnyPrefix(hostPrefixes), hostView.frame.height != 0 {
22
25
  return hostView
23
26
  }
24
27
  }
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = exports.TEST_ID_KEYBOARD_TOOLBAR_NEXT = exports.TEST_ID_KEYBOARD_TOOLBAR_DONE = exports.TEST_ID_KEYBOARD_TOOLBAR_CONTENT = exports.TEST_ID_KEYBOARD_TOOLBAR = exports.OPENED_OFFSET = exports.KEYBOARD_TOOLBAR_HEIGHT = exports.KEYBOARD_HAS_ROUNDED_CORNERS = exports.DEFAULT_OPACITY = void 0;
7
+ var _reactNative = require("react-native");
8
+ const TEST_ID_KEYBOARD_TOOLBAR = exports.TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
9
+ const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = exports.TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;
10
+ const TEST_ID_KEYBOARD_TOOLBAR_NEXT = exports.TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;
11
+ const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = exports.TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;
12
+ const TEST_ID_KEYBOARD_TOOLBAR_DONE = exports.TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;
13
+ const KEYBOARD_TOOLBAR_HEIGHT = exports.KEYBOARD_TOOLBAR_HEIGHT = 42;
14
+ const DEFAULT_OPACITY = exports.DEFAULT_OPACITY = "FF";
15
+ const KEYBOARD_HAS_ROUNDED_CORNERS = exports.KEYBOARD_HAS_ROUNDED_CORNERS = _reactNative.Platform.OS === "ios" && parseInt(_reactNative.Platform.Version, 10) >= 26;
16
+ const OPENED_OFFSET = exports.OPENED_OFFSET = KEYBOARD_HAS_ROUNDED_CORNERS ? -11 : 0;
17
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_reactNative","require","TEST_ID_KEYBOARD_TOOLBAR","exports","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","KEYBOARD_TOOLBAR_HEIGHT","DEFAULT_OPACITY","KEYBOARD_HAS_ROUNDED_CORNERS","Platform","OS","parseInt","Version","OPENED_OFFSET"],"sources":["constants.ts"],"sourcesContent":["import { Platform } from \"react-native\";\n\nimport type { HEX } from \"./types\";\n\nexport const TEST_ID_KEYBOARD_TOOLBAR = \"keyboard.toolbar\";\nexport const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;\nexport const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;\nexport const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;\nexport const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;\n\nexport const KEYBOARD_TOOLBAR_HEIGHT = 42;\nexport const DEFAULT_OPACITY: HEX = \"FF\";\nexport const KEYBOARD_HAS_ROUNDED_CORNERS =\n Platform.OS === \"ios\" && parseInt(Platform.Version, 10) >= 26;\nexport const OPENED_OFFSET = KEYBOARD_HAS_ROUNDED_CORNERS ? -11 : 0;\n"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAIO,MAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,kBAAkB;AACnD,MAAME,iCAAiC,GAAAD,OAAA,CAAAC,iCAAA,GAAG,GAAGF,wBAAwB,WAAW;AAChF,MAAMG,6BAA6B,GAAAF,OAAA,CAAAE,6BAAA,GAAG,GAAGH,wBAAwB,OAAO;AACxE,MAAMI,gCAAgC,GAAAH,OAAA,CAAAG,gCAAA,GAAG,GAAGJ,wBAAwB,UAAU;AAC9E,MAAMK,6BAA6B,GAAAJ,OAAA,CAAAI,6BAAA,GAAG,GAAGL,wBAAwB,OAAO;AAExE,MAAMM,uBAAuB,GAAAL,OAAA,CAAAK,uBAAA,GAAG,EAAE;AAClC,MAAMC,eAAoB,GAAAN,OAAA,CAAAM,eAAA,GAAG,IAAI;AACjC,MAAMC,4BAA4B,GAAAP,OAAA,CAAAO,4BAAA,GACvCC,qBAAQ,CAACC,EAAE,KAAK,KAAK,IAAIC,QAAQ,CAACF,qBAAQ,CAACG,OAAO,EAAE,EAAE,CAAC,IAAI,EAAE;AACxD,MAAMC,aAAa,GAAAZ,OAAA,CAAAY,aAAA,GAAGL,4BAA4B,GAAG,CAAC,EAAE,GAAG,CAAC","ignoreList":[]}
@@ -19,18 +19,11 @@ var _KeyboardStickyView = _interopRequireDefault(require("../KeyboardStickyView"
19
19
  var _Arrow = _interopRequireDefault(require("./Arrow"));
20
20
  var _Button = _interopRequireDefault(require("./Button"));
21
21
  var _colors = require("./colors");
22
+ var _constants = require("./constants");
22
23
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
23
24
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
24
25
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
25
26
  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); }
26
- const TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
27
- const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;
28
- const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;
29
- const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;
30
- const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;
31
- const KEYBOARD_TOOLBAR_HEIGHT = 42;
32
- const DEFAULT_OPACITY = "FF";
33
-
34
27
  /**
35
28
  * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and
36
29
  * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.
@@ -55,7 +48,7 @@ const KeyboardToolbar = props => {
55
48
  onPrevCallback,
56
49
  onDoneCallback,
57
50
  blur = null,
58
- opacity = DEFAULT_OPACITY,
51
+ opacity = _constants.DEFAULT_OPACITY,
59
52
  offset: {
60
53
  closed = 0,
61
54
  opened = 0
@@ -82,13 +75,17 @@ const KeyboardToolbar = props => {
82
75
  }], [colorScheme, theme]);
83
76
  const toolbarStyle = (0, _react.useMemo)(() => [styles.toolbar, {
84
77
  backgroundColor: `${theme[colorScheme].background}${opacity}`
85
- }, {
78
+ }, !_constants.KEYBOARD_HAS_ROUNDED_CORNERS ? {
86
79
  paddingLeft: insets === null || insets === void 0 ? void 0 : insets.left,
87
80
  paddingRight: insets === null || insets === void 0 ? void 0 : insets.right
88
- }], [colorScheme, opacity, theme, insets]);
81
+ } : null, _constants.KEYBOARD_HAS_ROUNDED_CORNERS ? styles.floating : null], [colorScheme, opacity, theme, insets]);
82
+ const containerStyle = (0, _react.useMemo)(() => [_constants.KEYBOARD_HAS_ROUNDED_CORNERS ? {
83
+ marginLeft: ((insets === null || insets === void 0 ? void 0 : insets.left) ?? 0) + 16,
84
+ marginRight: ((insets === null || insets === void 0 ? void 0 : insets.right) ?? 0) + 16
85
+ } : null], [insets]);
89
86
  const offset = (0, _react.useMemo)(() => ({
90
- closed: closed + KEYBOARD_TOOLBAR_HEIGHT,
91
- opened
87
+ closed: closed + _constants.KEYBOARD_TOOLBAR_HEIGHT,
88
+ opened: opened + _constants.OPENED_OFFSET
92
89
  }), [closed, opened]);
93
90
  const ButtonContainer = button || _Button.default;
94
91
  const IconContainer = icon || _Arrow.default;
@@ -112,17 +109,18 @@ const KeyboardToolbar = props => {
112
109
  }, [onDoneCallback]);
113
110
  return /*#__PURE__*/_react.default.createElement(_KeyboardStickyView.default, {
114
111
  enabled: enabled,
115
- offset: offset
112
+ offset: offset,
113
+ style: containerStyle
116
114
  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, rest, {
117
115
  style: toolbarStyle,
118
- testID: TEST_ID_KEYBOARD_TOOLBAR
116
+ testID: _constants.TEST_ID_KEYBOARD_TOOLBAR
119
117
  }), blur, showArrows && /*#__PURE__*/_react.default.createElement(_reactNative.View, {
120
118
  style: styles.arrows
121
119
  }, /*#__PURE__*/_react.default.createElement(ButtonContainer, {
122
120
  accessibilityHint: "Moves focus to the previous field",
123
121
  accessibilityLabel: "Previous",
124
122
  disabled: isPrevDisabled,
125
- testID: TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS,
123
+ testID: _constants.TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS,
126
124
  theme: theme,
127
125
  onPress: onPressPrev
128
126
  }, /*#__PURE__*/_react.default.createElement(IconContainer, {
@@ -133,7 +131,7 @@ const KeyboardToolbar = props => {
133
131
  accessibilityHint: "Moves focus to the next field",
134
132
  accessibilityLabel: "Next",
135
133
  disabled: isNextDisabled,
136
- testID: TEST_ID_KEYBOARD_TOOLBAR_NEXT,
134
+ testID: _constants.TEST_ID_KEYBOARD_TOOLBAR_NEXT,
137
135
  theme: theme,
138
136
  onPress: onPressNext
139
137
  }, /*#__PURE__*/_react.default.createElement(IconContainer, {
@@ -142,13 +140,13 @@ const KeyboardToolbar = props => {
142
140
  type: "next"
143
141
  }))), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
144
142
  style: styles.flex,
145
- testID: TEST_ID_KEYBOARD_TOOLBAR_CONTENT
143
+ testID: _constants.TEST_ID_KEYBOARD_TOOLBAR_CONTENT
146
144
  }, content), doneText && /*#__PURE__*/_react.default.createElement(ButtonContainer, {
147
145
  accessibilityHint: "Closes the keyboard",
148
146
  accessibilityLabel: "Done",
149
147
  rippleRadius: 28,
150
148
  style: styles.doneButtonContainer,
151
- testID: TEST_ID_KEYBOARD_TOOLBAR_DONE,
149
+ testID: _constants.TEST_ID_KEYBOARD_TOOLBAR_DONE,
152
150
  theme: theme,
153
151
  onPress: onPressDone
154
152
  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
@@ -166,7 +164,7 @@ const styles = _reactNative.StyleSheet.create({
166
164
  alignItems: "center",
167
165
  width: "100%",
168
166
  flexDirection: "row",
169
- height: KEYBOARD_TOOLBAR_HEIGHT
167
+ height: _constants.KEYBOARD_TOOLBAR_HEIGHT
170
168
  },
171
169
  arrows: {
172
170
  flexDirection: "row",
@@ -179,6 +177,11 @@ const styles = _reactNative.StyleSheet.create({
179
177
  doneButtonContainer: {
180
178
  marginRight: 16,
181
179
  marginLeft: 8
180
+ },
181
+ floating: {
182
+ alignSelf: "center",
183
+ borderRadius: 20,
184
+ overflow: "hidden"
182
185
  }
183
186
  });
184
187
  var _default = exports.default = KeyboardToolbar;
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_bindings","_module","_useColorScheme","_interopRequireDefault","_KeyboardStickyView","_Arrow","_Button","_colors","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","TEST_ID_KEYBOARD_TOOLBAR","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","KEYBOARD_TOOLBAR_HEIGHT","DEFAULT_OPACITY","KeyboardToolbar","props","content","theme","colors","doneText","button","icon","showArrows","onNextCallback","onPrevCallback","onDoneCallback","blur","opacity","offset","closed","opened","enabled","insets","rest","colorScheme","useColorScheme","inputs","setInputs","useState","current","count","isPrevDisabled","isNextDisabled","useEffect","subscription","FocusedInputEvents","addListener","remove","doneStyle","useMemo","styles","doneButton","color","primary","toolbarStyle","toolbar","backgroundColor","background","paddingLeft","left","paddingRight","right","ButtonContainer","Button","IconContainer","Arrow","onPressNext","useCallback","event","isDefaultPrevented","KeyboardController","setFocusTo","onPressPrev","onPressDone","dismiss","createElement","View","style","testID","arrows","accessibilityHint","accessibilityLabel","disabled","onPress","type","flex","rippleRadius","doneButtonContainer","Text","maxFontSizeMultiplier","StyleSheet","create","position","bottom","alignItems","width","flexDirection","height","fontWeight","fontSize","marginRight","marginLeft","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { StyleSheet, Text, View } from \"react-native\";\n\nimport { FocusedInputEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\nimport useColorScheme from \"../hooks/useColorScheme\";\nimport KeyboardStickyView from \"../KeyboardStickyView\";\n\nimport Arrow from \"./Arrow\";\nimport Button from \"./Button\";\nimport { colors } from \"./colors\";\n\nimport type { HEX, KeyboardToolbarTheme } from \"./types\";\nimport type { KeyboardStickyViewProps } from \"../KeyboardStickyView\";\nimport type { ReactNode } from \"react\";\nimport type { GestureResponderEvent, ViewProps } from \"react-native\";\n\ntype SafeAreaInsets = {\n left: number;\n right: number;\n};\n\nexport type KeyboardToolbarProps = Omit<\n ViewProps,\n \"style\" | \"testID\" | \"children\"\n> & {\n /** An element that is shown in the middle of the toolbar. */\n content?: React.JSX.Element | null;\n /** A set of dark/light colors consumed by toolbar component. */\n theme?: KeyboardToolbarTheme;\n /** Custom text for done button. */\n doneText?: ReactNode;\n /** Custom touchable component for toolbar (used for prev/next/done buttons). */\n button?: typeof Button;\n /** Custom icon component used to display next/prev buttons. */\n icon?: typeof Arrow;\n /**\n * Whether to show next and previous buttons. Can be useful to set it to `false` if you have only one input\n * and want to show only `Done` button. Default to `true`.\n */\n showArrows?: boolean;\n /**\n * A callback that is called when the user presses the next button along with the default action.\n */\n onNextCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the previous button along with the default action.\n */\n onPrevCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the done button along with the default action.\n */\n onDoneCallback?: (event: GestureResponderEvent) => void;\n /**\n * A component that applies blur effect to the toolbar.\n */\n blur?: React.JSX.Element | null;\n /**\n * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.\n */\n opacity?: HEX;\n /**\n * A object containing `left`/`right` properties. Used to specify proper container padding in landscape mode.\n */\n insets?: SafeAreaInsets;\n} & Pick<KeyboardStickyViewProps, \"offset\" | \"enabled\">;\n\nconst TEST_ID_KEYBOARD_TOOLBAR = \"keyboard.toolbar\";\nconst TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;\nconst TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;\nconst TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;\nconst TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;\n\nconst KEYBOARD_TOOLBAR_HEIGHT = 42;\nconst DEFAULT_OPACITY: HEX = \"FF\";\n\n/**\n * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and\n * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.\n *\n * @param props - Component props.\n * @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardToolbar doneText=\"Close\" />\n * ```\n */\nconst KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {\n const {\n content,\n theme = colors,\n doneText = \"Done\",\n button,\n icon,\n showArrows = true,\n onNextCallback,\n onPrevCallback,\n onDoneCallback,\n blur = null,\n opacity = DEFAULT_OPACITY,\n offset: { closed = 0, opened = 0 } = {},\n enabled = true,\n insets,\n ...rest\n } = props;\n const colorScheme = useColorScheme();\n const [inputs, setInputs] = useState({\n current: 0,\n count: 0,\n });\n const isPrevDisabled = inputs.current === 0;\n const isNextDisabled = inputs.current === inputs.count - 1;\n\n useEffect(() => {\n const subscription = FocusedInputEvents.addListener(\"focusDidSet\", (e) => {\n setInputs(e);\n });\n\n return subscription.remove;\n }, []);\n const doneStyle = useMemo(\n () => [styles.doneButton, { color: theme[colorScheme].primary }],\n [colorScheme, theme],\n );\n const toolbarStyle = useMemo(\n () => [\n styles.toolbar,\n {\n backgroundColor: `${theme[colorScheme].background}${opacity}`,\n },\n {\n paddingLeft: insets?.left,\n paddingRight: insets?.right,\n },\n ],\n [colorScheme, opacity, theme, insets],\n );\n const offset = useMemo(\n () => ({ closed: closed + KEYBOARD_TOOLBAR_HEIGHT, opened }),\n [closed, opened],\n );\n const ButtonContainer = button || Button;\n const IconContainer = icon || Arrow;\n\n const onPressNext = useCallback(\n (event: GestureResponderEvent) => {\n onNextCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"next\");\n }\n },\n [onNextCallback],\n );\n const onPressPrev = useCallback(\n (event: GestureResponderEvent) => {\n onPrevCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"prev\");\n }\n },\n [onPrevCallback],\n );\n const onPressDone = useCallback(\n (event: GestureResponderEvent) => {\n onDoneCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.dismiss();\n }\n },\n [onDoneCallback],\n );\n\n return (\n <KeyboardStickyView enabled={enabled} offset={offset}>\n <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>\n {blur}\n {showArrows && (\n <View style={styles.arrows}>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the previous field\"\n accessibilityLabel=\"Previous\"\n disabled={isPrevDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS}\n theme={theme}\n onPress={onPressPrev}\n >\n <IconContainer\n disabled={isPrevDisabled}\n theme={theme}\n type=\"prev\"\n />\n </ButtonContainer>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the next field\"\n accessibilityLabel=\"Next\"\n disabled={isNextDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_NEXT}\n theme={theme}\n onPress={onPressNext}\n >\n <IconContainer\n disabled={isNextDisabled}\n theme={theme}\n type=\"next\"\n />\n </ButtonContainer>\n </View>\n )}\n\n <View style={styles.flex} testID={TEST_ID_KEYBOARD_TOOLBAR_CONTENT}>\n {content}\n </View>\n {doneText && (\n <ButtonContainer\n accessibilityHint=\"Closes the keyboard\"\n accessibilityLabel=\"Done\"\n rippleRadius={28}\n style={styles.doneButtonContainer}\n testID={TEST_ID_KEYBOARD_TOOLBAR_DONE}\n theme={theme}\n onPress={onPressDone}\n >\n <Text maxFontSizeMultiplier={1.3} style={doneStyle}>\n {doneText}\n </Text>\n </ButtonContainer>\n )}\n </View>\n </KeyboardStickyView>\n );\n};\n\nconst styles = StyleSheet.create({\n flex: {\n flex: 1,\n },\n toolbar: {\n position: \"absolute\",\n bottom: 0,\n alignItems: \"center\",\n width: \"100%\",\n flexDirection: \"row\",\n height: KEYBOARD_TOOLBAR_HEIGHT,\n },\n arrows: {\n flexDirection: \"row\",\n paddingLeft: 8,\n },\n doneButton: {\n fontWeight: \"600\",\n fontSize: 15,\n },\n doneButtonContainer: {\n marginRight: 16,\n marginLeft: 8,\n },\n});\n\nexport { colors as DefaultKeyboardToolbarTheme };\nexport default KeyboardToolbar;\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,eAAA,GAAAC,sBAAA,CAAAL,OAAA;AACA,IAAAM,mBAAA,GAAAD,sBAAA,CAAAL,OAAA;AAEA,IAAAO,MAAA,GAAAF,sBAAA,CAAAL,OAAA;AACA,IAAAQ,OAAA,GAAAH,sBAAA,CAAAL,OAAA;AACA,IAAAS,OAAA,GAAAT,OAAA;AAAkC,SAAAK,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,yBAAAH,CAAA,6BAAAI,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAD,wBAAA,YAAAA,CAAAH,CAAA,WAAAA,CAAA,GAAAM,CAAA,GAAAD,CAAA,KAAAL,CAAA;AAAA,SAAAX,wBAAAW,CAAA,EAAAK,CAAA,SAAAA,CAAA,IAAAL,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAE,OAAA,EAAAF,CAAA,QAAAM,CAAA,GAAAH,wBAAA,CAAAE,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAP,CAAA,UAAAM,CAAA,CAAAE,GAAA,CAAAR,CAAA,OAAAS,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAf,CAAA,oBAAAe,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAe,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAd,CAAA,EAAAe,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAf,CAAA,CAAAe,CAAA,YAAAN,CAAA,CAAAP,OAAA,GAAAF,CAAA,EAAAM,CAAA,IAAAA,CAAA,CAAAa,GAAA,CAAAnB,CAAA,EAAAS,CAAA,GAAAA,CAAA;AAAA,SAAAW,SAAA,WAAAA,QAAA,GAAAR,MAAA,CAAAS,MAAA,GAAAT,MAAA,CAAAS,MAAA,CAAAC,IAAA,eAAAb,CAAA,aAAAT,CAAA,MAAAA,CAAA,GAAAuB,SAAA,CAAAC,MAAA,EAAAxB,CAAA,UAAAM,CAAA,GAAAiB,SAAA,CAAAvB,CAAA,YAAAK,CAAA,IAAAC,CAAA,OAAAU,cAAA,CAAAC,IAAA,CAAAX,CAAA,EAAAD,CAAA,MAAAI,CAAA,CAAAJ,CAAA,IAAAC,CAAA,CAAAD,CAAA,aAAAI,CAAA,KAAAW,QAAA,CAAAK,KAAA,OAAAF,SAAA;AAyDlC,MAAMG,wBAAwB,GAAG,kBAAkB;AACnD,MAAMC,iCAAiC,GAAG,GAAGD,wBAAwB,WAAW;AAChF,MAAME,6BAA6B,GAAG,GAAGF,wBAAwB,OAAO;AACxE,MAAMG,gCAAgC,GAAG,GAAGH,wBAAwB,UAAU;AAC9E,MAAMI,6BAA6B,GAAG,GAAGJ,wBAAwB,OAAO;AAExE,MAAMK,uBAAuB,GAAG,EAAE;AAClC,MAAMC,eAAoB,GAAG,IAAI;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,eAA+C,GAAIC,KAAK,IAAK;EACjE,MAAM;IACJC,OAAO;IACPC,KAAK,GAAGC,cAAM;IACdC,QAAQ,GAAG,MAAM;IACjBC,MAAM;IACNC,IAAI;IACJC,UAAU,GAAG,IAAI;IACjBC,cAAc;IACdC,cAAc;IACdC,cAAc;IACdC,IAAI,GAAG,IAAI;IACXC,OAAO,GAAGd,eAAe;IACzBe,MAAM,EAAE;MAAEC,MAAM,GAAG,CAAC;MAAEC,MAAM,GAAG;IAAE,CAAC,GAAG,CAAC,CAAC;IACvCC,OAAO,GAAG,IAAI;IACdC,MAAM;IACN,GAAGC;EACL,CAAC,GAAGlB,KAAK;EACT,MAAMmB,WAAW,GAAG,IAAAC,uBAAc,EAAC,CAAC;EACpC,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAG,IAAAC,eAAQ,EAAC;IACnCC,OAAO,EAAE,CAAC;IACVC,KAAK,EAAE;EACT,CAAC,CAAC;EACF,MAAMC,cAAc,GAAGL,MAAM,CAACG,OAAO,KAAK,CAAC;EAC3C,MAAMG,cAAc,GAAGN,MAAM,CAACG,OAAO,KAAKH,MAAM,CAACI,KAAK,GAAG,CAAC;EAE1D,IAAAG,gBAAS,EAAC,MAAM;IACd,MAAMC,YAAY,GAAGC,4BAAkB,CAACC,WAAW,CAAC,aAAa,EAAGjE,CAAC,IAAK;MACxEwD,SAAS,CAACxD,CAAC,CAAC;IACd,CAAC,CAAC;IAEF,OAAO+D,YAAY,CAACG,MAAM;EAC5B,CAAC,EAAE,EAAE,CAAC;EACN,MAAMC,SAAS,GAAG,IAAAC,cAAO,EACvB,MAAM,CAACC,MAAM,CAACC,UAAU,EAAE;IAAEC,KAAK,EAAEnC,KAAK,CAACiB,WAAW,CAAC,CAACmB;EAAQ,CAAC,CAAC,EAChE,CAACnB,WAAW,EAAEjB,KAAK,CACrB,CAAC;EACD,MAAMqC,YAAY,GAAG,IAAAL,cAAO,EAC1B,MAAM,CACJC,MAAM,CAACK,OAAO,EACd;IACEC,eAAe,EAAE,GAAGvC,KAAK,CAACiB,WAAW,CAAC,CAACuB,UAAU,GAAG9B,OAAO;EAC7D,CAAC,EACD;IACE+B,WAAW,EAAE1B,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAE2B,IAAI;IACzBC,YAAY,EAAE5B,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAE6B;EACxB,CAAC,CACF,EACD,CAAC3B,WAAW,EAAEP,OAAO,EAAEV,KAAK,EAAEe,MAAM,CACtC,CAAC;EACD,MAAMJ,MAAM,GAAG,IAAAqB,cAAO,EACpB,OAAO;IAAEpB,MAAM,EAAEA,MAAM,GAAGjB,uBAAuB;IAAEkB;EAAO,CAAC,CAAC,EAC5D,CAACD,MAAM,EAAEC,MAAM,CACjB,CAAC;EACD,MAAMgC,eAAe,GAAG1C,MAAM,IAAI2C,eAAM;EACxC,MAAMC,aAAa,GAAG3C,IAAI,IAAI4C,cAAK;EAEnC,MAAMC,WAAW,GAAG,IAAAC,kBAAW,EAC5BC,KAA4B,IAAK;IAChC7C,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAG6C,KAAK,CAAC;IAEvB,IAAI,CAACA,KAAK,CAACC,kBAAkB,CAAC,CAAC,EAAE;MAC/BC,0BAAkB,CAACC,UAAU,CAAC,MAAM,CAAC;IACvC;EACF,CAAC,EACD,CAAChD,cAAc,CACjB,CAAC;EACD,MAAMiD,WAAW,GAAG,IAAAL,kBAAW,EAC5BC,KAA4B,IAAK;IAChC5C,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAG4C,KAAK,CAAC;IAEvB,IAAI,CAACA,KAAK,CAACC,kBAAkB,CAAC,CAAC,EAAE;MAC/BC,0BAAkB,CAACC,UAAU,CAAC,MAAM,CAAC;IACvC;EACF,CAAC,EACD,CAAC/C,cAAc,CACjB,CAAC;EACD,MAAMiD,WAAW,GAAG,IAAAN,kBAAW,EAC5BC,KAA4B,IAAK;IAChC3C,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAG2C,KAAK,CAAC;IAEvB,IAAI,CAACA,KAAK,CAACC,kBAAkB,CAAC,CAAC,EAAE;MAC/BC,0BAAkB,CAACI,OAAO,CAAC,CAAC;IAC9B;EACF,CAAC,EACD,CAACjD,cAAc,CACjB,CAAC;EAED,oBACExD,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAAClG,mBAAA,CAAAM,OAAkB;IAACgD,OAAO,EAAEA,OAAQ;IAACH,MAAM,EAAEA;EAAO,gBACnD3D,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACvG,YAAA,CAAAwG,IAAI,EAAA3E,QAAA,KAAKgC,IAAI;IAAE4C,KAAK,EAAEvB,YAAa;IAACwB,MAAM,EAAEvE;EAAyB,IACnEmB,IAAI,EACJJ,UAAU,iBACTrD,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACvG,YAAA,CAAAwG,IAAI;IAACC,KAAK,EAAE3B,MAAM,CAAC6B;EAAO,gBACzB9G,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACb,eAAe;IACdkB,iBAAiB,EAAC,mCAAmC;IACrDC,kBAAkB,EAAC,UAAU;IAC7BC,QAAQ,EAAEzC,cAAe;IACzBqC,MAAM,EAAEtE,iCAAkC;IAC1CS,KAAK,EAAEA,KAAM;IACbkE,OAAO,EAAEX;EAAY,gBAErBvG,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACX,aAAa;IACZkB,QAAQ,EAAEzC,cAAe;IACzBxB,KAAK,EAAEA,KAAM;IACbmE,IAAI,EAAC;EAAM,CACZ,CACc,CAAC,eAClBnH,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACb,eAAe;IACdkB,iBAAiB,EAAC,+BAA+B;IACjDC,kBAAkB,EAAC,MAAM;IACzBC,QAAQ,EAAExC,cAAe;IACzBoC,MAAM,EAAErE,6BAA8B;IACtCQ,KAAK,EAAEA,KAAM;IACbkE,OAAO,EAAEjB;EAAY,gBAErBjG,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACX,aAAa;IACZkB,QAAQ,EAAExC,cAAe;IACzBzB,KAAK,EAAEA,KAAM;IACbmE,IAAI,EAAC;EAAM,CACZ,CACc,CACb,CACP,eAEDnH,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACvG,YAAA,CAAAwG,IAAI;IAACC,KAAK,EAAE3B,MAAM,CAACmC,IAAK;IAACP,MAAM,EAAEpE;EAAiC,GAChEM,OACG,CAAC,EACNG,QAAQ,iBACPlD,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACb,eAAe;IACdkB,iBAAiB,EAAC,qBAAqB;IACvCC,kBAAkB,EAAC,MAAM;IACzBK,YAAY,EAAE,EAAG;IACjBT,KAAK,EAAE3B,MAAM,CAACqC,mBAAoB;IAClCT,MAAM,EAAEnE,6BAA8B;IACtCM,KAAK,EAAEA,KAAM;IACbkE,OAAO,EAAEV;EAAY,gBAErBxG,MAAA,CAAAc,OAAA,CAAA4F,aAAA,CAACvG,YAAA,CAAAoH,IAAI;IAACC,qBAAqB,EAAE,GAAI;IAACZ,KAAK,EAAE7B;EAAU,GAChD7B,QACG,CACS,CAEf,CACY,CAAC;AAEzB,CAAC;AAED,MAAM+B,MAAM,GAAGwC,uBAAU,CAACC,MAAM,CAAC;EAC/BN,IAAI,EAAE;IACJA,IAAI,EAAE;EACR,CAAC;EACD9B,OAAO,EAAE;IACPqC,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC;IACTC,UAAU,EAAE,QAAQ;IACpBC,KAAK,EAAE,MAAM;IACbC,aAAa,EAAE,KAAK;IACpBC,MAAM,EAAErF;EACV,CAAC;EACDmE,MAAM,EAAE;IACNiB,aAAa,EAAE,KAAK;IACpBtC,WAAW,EAAE;EACf,CAAC;EACDP,UAAU,EAAE;IACV+C,UAAU,EAAE,KAAK;IACjBC,QAAQ,EAAE;EACZ,CAAC;EACDZ,mBAAmB,EAAE;IACnBa,WAAW,EAAE,EAAE;IACfC,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAxH,OAAA,GAGY+B,eAAe","ignoreList":[]}
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_bindings","_module","_useColorScheme","_interopRequireDefault","_KeyboardStickyView","_Arrow","_Button","_colors","_constants","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","KeyboardToolbar","props","content","theme","colors","doneText","button","icon","showArrows","onNextCallback","onPrevCallback","onDoneCallback","blur","opacity","DEFAULT_OPACITY","offset","closed","opened","enabled","insets","rest","colorScheme","useColorScheme","inputs","setInputs","useState","current","count","isPrevDisabled","isNextDisabled","useEffect","subscription","FocusedInputEvents","addListener","remove","doneStyle","useMemo","styles","doneButton","color","primary","toolbarStyle","toolbar","backgroundColor","background","KEYBOARD_HAS_ROUNDED_CORNERS","paddingLeft","left","paddingRight","right","floating","containerStyle","marginLeft","marginRight","KEYBOARD_TOOLBAR_HEIGHT","OPENED_OFFSET","ButtonContainer","Button","IconContainer","Arrow","onPressNext","useCallback","event","isDefaultPrevented","KeyboardController","setFocusTo","onPressPrev","onPressDone","dismiss","createElement","style","View","testID","TEST_ID_KEYBOARD_TOOLBAR","arrows","accessibilityHint","accessibilityLabel","disabled","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","onPress","type","TEST_ID_KEYBOARD_TOOLBAR_NEXT","flex","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","rippleRadius","doneButtonContainer","TEST_ID_KEYBOARD_TOOLBAR_DONE","Text","maxFontSizeMultiplier","StyleSheet","create","position","bottom","alignItems","width","flexDirection","height","fontWeight","fontSize","alignSelf","borderRadius","overflow","_default","exports"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { StyleSheet, Text, View } from \"react-native\";\n\nimport { FocusedInputEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\nimport useColorScheme from \"../hooks/useColorScheme\";\nimport KeyboardStickyView from \"../KeyboardStickyView\";\n\nimport Arrow from \"./Arrow\";\nimport Button from \"./Button\";\nimport { colors } from \"./colors\";\nimport {\n DEFAULT_OPACITY,\n KEYBOARD_HAS_ROUNDED_CORNERS,\n KEYBOARD_TOOLBAR_HEIGHT,\n OPENED_OFFSET,\n TEST_ID_KEYBOARD_TOOLBAR,\n TEST_ID_KEYBOARD_TOOLBAR_CONTENT,\n TEST_ID_KEYBOARD_TOOLBAR_DONE,\n TEST_ID_KEYBOARD_TOOLBAR_NEXT,\n TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS,\n} from \"./constants\";\n\nimport type { HEX, KeyboardToolbarTheme } from \"./types\";\nimport type { KeyboardStickyViewProps } from \"../KeyboardStickyView\";\nimport type { ReactNode } from \"react\";\nimport type { GestureResponderEvent, ViewProps } from \"react-native\";\n\ntype SafeAreaInsets = {\n left: number;\n right: number;\n};\n\nexport type KeyboardToolbarProps = Omit<\n ViewProps,\n \"style\" | \"testID\" | \"children\"\n> & {\n /** An element that is shown in the middle of the toolbar. */\n content?: React.JSX.Element | null;\n /** A set of dark/light colors consumed by toolbar component. */\n theme?: KeyboardToolbarTheme;\n /** Custom text for done button. */\n doneText?: ReactNode;\n /** Custom touchable component for toolbar (used for prev/next/done buttons). */\n button?: typeof Button;\n /** Custom icon component used to display next/prev buttons. */\n icon?: typeof Arrow;\n /**\n * Whether to show next and previous buttons. Can be useful to set it to `false` if you have only one input\n * and want to show only `Done` button. Default to `true`.\n */\n showArrows?: boolean;\n /**\n * A callback that is called when the user presses the next button along with the default action.\n */\n onNextCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the previous button along with the default action.\n */\n onPrevCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the done button along with the default action.\n */\n onDoneCallback?: (event: GestureResponderEvent) => void;\n /**\n * A component that applies blur effect to the toolbar.\n */\n blur?: React.JSX.Element | null;\n /**\n * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.\n */\n opacity?: HEX;\n /**\n * A object containing `left`/`right` properties. Used to specify proper container padding in landscape mode.\n */\n insets?: SafeAreaInsets;\n} & Pick<KeyboardStickyViewProps, \"offset\" | \"enabled\">;\n\n/**\n * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and\n * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.\n *\n * @param props - Component props.\n * @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardToolbar doneText=\"Close\" />\n * ```\n */\nconst KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {\n const {\n content,\n theme = colors,\n doneText = \"Done\",\n button,\n icon,\n showArrows = true,\n onNextCallback,\n onPrevCallback,\n onDoneCallback,\n blur = null,\n opacity = DEFAULT_OPACITY,\n offset: { closed = 0, opened = 0 } = {},\n enabled = true,\n insets,\n ...rest\n } = props;\n const colorScheme = useColorScheme();\n const [inputs, setInputs] = useState({\n current: 0,\n count: 0,\n });\n const isPrevDisabled = inputs.current === 0;\n const isNextDisabled = inputs.current === inputs.count - 1;\n\n useEffect(() => {\n const subscription = FocusedInputEvents.addListener(\"focusDidSet\", (e) => {\n setInputs(e);\n });\n\n return subscription.remove;\n }, []);\n const doneStyle = useMemo(\n () => [styles.doneButton, { color: theme[colorScheme].primary }],\n [colorScheme, theme],\n );\n const toolbarStyle = useMemo(\n () => [\n styles.toolbar,\n {\n backgroundColor: `${theme[colorScheme].background}${opacity}`,\n },\n !KEYBOARD_HAS_ROUNDED_CORNERS\n ? {\n paddingLeft: insets?.left,\n paddingRight: insets?.right,\n }\n : null,\n KEYBOARD_HAS_ROUNDED_CORNERS ? styles.floating : null,\n ],\n [colorScheme, opacity, theme, insets],\n );\n const containerStyle = useMemo(\n () => [\n KEYBOARD_HAS_ROUNDED_CORNERS\n ? {\n marginLeft: (insets?.left ?? 0) + 16,\n marginRight: (insets?.right ?? 0) + 16,\n }\n : null,\n ],\n [insets],\n );\n const offset = useMemo(\n () => ({\n closed: closed + KEYBOARD_TOOLBAR_HEIGHT,\n opened: opened + OPENED_OFFSET,\n }),\n [closed, opened],\n );\n const ButtonContainer = button || Button;\n const IconContainer = icon || Arrow;\n\n const onPressNext = useCallback(\n (event: GestureResponderEvent) => {\n onNextCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"next\");\n }\n },\n [onNextCallback],\n );\n const onPressPrev = useCallback(\n (event: GestureResponderEvent) => {\n onPrevCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"prev\");\n }\n },\n [onPrevCallback],\n );\n const onPressDone = useCallback(\n (event: GestureResponderEvent) => {\n onDoneCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.dismiss();\n }\n },\n [onDoneCallback],\n );\n\n return (\n <KeyboardStickyView\n enabled={enabled}\n offset={offset}\n style={containerStyle}\n >\n <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>\n {blur}\n {showArrows && (\n <View style={styles.arrows}>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the previous field\"\n accessibilityLabel=\"Previous\"\n disabled={isPrevDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS}\n theme={theme}\n onPress={onPressPrev}\n >\n <IconContainer\n disabled={isPrevDisabled}\n theme={theme}\n type=\"prev\"\n />\n </ButtonContainer>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the next field\"\n accessibilityLabel=\"Next\"\n disabled={isNextDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_NEXT}\n theme={theme}\n onPress={onPressNext}\n >\n <IconContainer\n disabled={isNextDisabled}\n theme={theme}\n type=\"next\"\n />\n </ButtonContainer>\n </View>\n )}\n\n <View style={styles.flex} testID={TEST_ID_KEYBOARD_TOOLBAR_CONTENT}>\n {content}\n </View>\n {doneText && (\n <ButtonContainer\n accessibilityHint=\"Closes the keyboard\"\n accessibilityLabel=\"Done\"\n rippleRadius={28}\n style={styles.doneButtonContainer}\n testID={TEST_ID_KEYBOARD_TOOLBAR_DONE}\n theme={theme}\n onPress={onPressDone}\n >\n <Text maxFontSizeMultiplier={1.3} style={doneStyle}>\n {doneText}\n </Text>\n </ButtonContainer>\n )}\n </View>\n </KeyboardStickyView>\n );\n};\n\nconst styles = StyleSheet.create({\n flex: {\n flex: 1,\n },\n toolbar: {\n position: \"absolute\",\n bottom: 0,\n alignItems: \"center\",\n width: \"100%\",\n flexDirection: \"row\",\n height: KEYBOARD_TOOLBAR_HEIGHT,\n },\n arrows: {\n flexDirection: \"row\",\n paddingLeft: 8,\n },\n doneButton: {\n fontWeight: \"600\",\n fontSize: 15,\n },\n doneButtonContainer: {\n marginRight: 16,\n marginLeft: 8,\n },\n floating: {\n alignSelf: \"center\",\n borderRadius: 20,\n overflow: \"hidden\",\n },\n});\n\nexport { colors as DefaultKeyboardToolbarTheme };\nexport default KeyboardToolbar;\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,11 @@
1
+ import { Platform } from "react-native";
2
+ export const TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
3
+ export const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;
4
+ export const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;
5
+ export const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;
6
+ export const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;
7
+ export const KEYBOARD_TOOLBAR_HEIGHT = 42;
8
+ export const DEFAULT_OPACITY = "FF";
9
+ export const KEYBOARD_HAS_ROUNDED_CORNERS = Platform.OS === "ios" && parseInt(Platform.Version, 10) >= 26;
10
+ export const OPENED_OFFSET = KEYBOARD_HAS_ROUNDED_CORNERS ? -11 : 0;
11
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["Platform","TEST_ID_KEYBOARD_TOOLBAR","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","KEYBOARD_TOOLBAR_HEIGHT","DEFAULT_OPACITY","KEYBOARD_HAS_ROUNDED_CORNERS","OS","parseInt","Version","OPENED_OFFSET"],"sources":["constants.ts"],"sourcesContent":["import { Platform } from \"react-native\";\n\nimport type { HEX } from \"./types\";\n\nexport const TEST_ID_KEYBOARD_TOOLBAR = \"keyboard.toolbar\";\nexport const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;\nexport const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;\nexport const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;\nexport const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;\n\nexport const KEYBOARD_TOOLBAR_HEIGHT = 42;\nexport const DEFAULT_OPACITY: HEX = \"FF\";\nexport const KEYBOARD_HAS_ROUNDED_CORNERS =\n Platform.OS === \"ios\" && parseInt(Platform.Version, 10) >= 26;\nexport const OPENED_OFFSET = KEYBOARD_HAS_ROUNDED_CORNERS ? -11 : 0;\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,cAAc;AAIvC,OAAO,MAAMC,wBAAwB,GAAG,kBAAkB;AAC1D,OAAO,MAAMC,iCAAiC,GAAG,GAAGD,wBAAwB,WAAW;AACvF,OAAO,MAAME,6BAA6B,GAAG,GAAGF,wBAAwB,OAAO;AAC/E,OAAO,MAAMG,gCAAgC,GAAG,GAAGH,wBAAwB,UAAU;AACrF,OAAO,MAAMI,6BAA6B,GAAG,GAAGJ,wBAAwB,OAAO;AAE/E,OAAO,MAAMK,uBAAuB,GAAG,EAAE;AACzC,OAAO,MAAMC,eAAoB,GAAG,IAAI;AACxC,OAAO,MAAMC,4BAA4B,GACvCR,QAAQ,CAACS,EAAE,KAAK,KAAK,IAAIC,QAAQ,CAACV,QAAQ,CAACW,OAAO,EAAE,EAAE,CAAC,IAAI,EAAE;AAC/D,OAAO,MAAMC,aAAa,GAAGJ,4BAA4B,GAAG,CAAC,EAAE,GAAG,CAAC","ignoreList":[]}
@@ -8,14 +8,7 @@ import KeyboardStickyView from "../KeyboardStickyView";
8
8
  import Arrow from "./Arrow";
9
9
  import Button from "./Button";
10
10
  import { colors } from "./colors";
11
- const TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
12
- const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;
13
- const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;
14
- const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;
15
- const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;
16
- const KEYBOARD_TOOLBAR_HEIGHT = 42;
17
- const DEFAULT_OPACITY = "FF";
18
-
11
+ import { DEFAULT_OPACITY, KEYBOARD_HAS_ROUNDED_CORNERS, KEYBOARD_TOOLBAR_HEIGHT, OPENED_OFFSET, TEST_ID_KEYBOARD_TOOLBAR, TEST_ID_KEYBOARD_TOOLBAR_CONTENT, TEST_ID_KEYBOARD_TOOLBAR_DONE, TEST_ID_KEYBOARD_TOOLBAR_NEXT, TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS } from "./constants";
19
12
  /**
20
13
  * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and
21
14
  * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.
@@ -67,13 +60,17 @@ const KeyboardToolbar = props => {
67
60
  }], [colorScheme, theme]);
68
61
  const toolbarStyle = useMemo(() => [styles.toolbar, {
69
62
  backgroundColor: `${theme[colorScheme].background}${opacity}`
70
- }, {
63
+ }, !KEYBOARD_HAS_ROUNDED_CORNERS ? {
71
64
  paddingLeft: insets === null || insets === void 0 ? void 0 : insets.left,
72
65
  paddingRight: insets === null || insets === void 0 ? void 0 : insets.right
73
- }], [colorScheme, opacity, theme, insets]);
66
+ } : null, KEYBOARD_HAS_ROUNDED_CORNERS ? styles.floating : null], [colorScheme, opacity, theme, insets]);
67
+ const containerStyle = useMemo(() => [KEYBOARD_HAS_ROUNDED_CORNERS ? {
68
+ marginLeft: ((insets === null || insets === void 0 ? void 0 : insets.left) ?? 0) + 16,
69
+ marginRight: ((insets === null || insets === void 0 ? void 0 : insets.right) ?? 0) + 16
70
+ } : null], [insets]);
74
71
  const offset = useMemo(() => ({
75
72
  closed: closed + KEYBOARD_TOOLBAR_HEIGHT,
76
- opened
73
+ opened: opened + OPENED_OFFSET
77
74
  }), [closed, opened]);
78
75
  const ButtonContainer = button || Button;
79
76
  const IconContainer = icon || Arrow;
@@ -97,7 +94,8 @@ const KeyboardToolbar = props => {
97
94
  }, [onDoneCallback]);
98
95
  return /*#__PURE__*/React.createElement(KeyboardStickyView, {
99
96
  enabled: enabled,
100
- offset: offset
97
+ offset: offset,
98
+ style: containerStyle
101
99
  }, /*#__PURE__*/React.createElement(View, _extends({}, rest, {
102
100
  style: toolbarStyle,
103
101
  testID: TEST_ID_KEYBOARD_TOOLBAR
@@ -164,6 +162,11 @@ const styles = StyleSheet.create({
164
162
  doneButtonContainer: {
165
163
  marginRight: 16,
166
164
  marginLeft: 8
165
+ },
166
+ floating: {
167
+ alignSelf: "center",
168
+ borderRadius: 20,
169
+ overflow: "hidden"
167
170
  }
168
171
  });
169
172
  export { colors as DefaultKeyboardToolbarTheme };
@@ -1 +1 @@
1
- {"version":3,"names":["React","useCallback","useEffect","useMemo","useState","StyleSheet","Text","View","FocusedInputEvents","KeyboardController","useColorScheme","KeyboardStickyView","Arrow","Button","colors","TEST_ID_KEYBOARD_TOOLBAR","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","KEYBOARD_TOOLBAR_HEIGHT","DEFAULT_OPACITY","KeyboardToolbar","props","content","theme","doneText","button","icon","showArrows","onNextCallback","onPrevCallback","onDoneCallback","blur","opacity","offset","closed","opened","enabled","insets","rest","colorScheme","inputs","setInputs","current","count","isPrevDisabled","isNextDisabled","subscription","addListener","e","remove","doneStyle","styles","doneButton","color","primary","toolbarStyle","toolbar","backgroundColor","background","paddingLeft","left","paddingRight","right","ButtonContainer","IconContainer","onPressNext","event","isDefaultPrevented","setFocusTo","onPressPrev","onPressDone","dismiss","createElement","_extends","style","testID","arrows","accessibilityHint","accessibilityLabel","disabled","onPress","type","flex","rippleRadius","doneButtonContainer","maxFontSizeMultiplier","create","position","bottom","alignItems","width","flexDirection","height","fontWeight","fontSize","marginRight","marginLeft","DefaultKeyboardToolbarTheme"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { StyleSheet, Text, View } from \"react-native\";\n\nimport { FocusedInputEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\nimport useColorScheme from \"../hooks/useColorScheme\";\nimport KeyboardStickyView from \"../KeyboardStickyView\";\n\nimport Arrow from \"./Arrow\";\nimport Button from \"./Button\";\nimport { colors } from \"./colors\";\n\nimport type { HEX, KeyboardToolbarTheme } from \"./types\";\nimport type { KeyboardStickyViewProps } from \"../KeyboardStickyView\";\nimport type { ReactNode } from \"react\";\nimport type { GestureResponderEvent, ViewProps } from \"react-native\";\n\ntype SafeAreaInsets = {\n left: number;\n right: number;\n};\n\nexport type KeyboardToolbarProps = Omit<\n ViewProps,\n \"style\" | \"testID\" | \"children\"\n> & {\n /** An element that is shown in the middle of the toolbar. */\n content?: React.JSX.Element | null;\n /** A set of dark/light colors consumed by toolbar component. */\n theme?: KeyboardToolbarTheme;\n /** Custom text for done button. */\n doneText?: ReactNode;\n /** Custom touchable component for toolbar (used for prev/next/done buttons). */\n button?: typeof Button;\n /** Custom icon component used to display next/prev buttons. */\n icon?: typeof Arrow;\n /**\n * Whether to show next and previous buttons. Can be useful to set it to `false` if you have only one input\n * and want to show only `Done` button. Default to `true`.\n */\n showArrows?: boolean;\n /**\n * A callback that is called when the user presses the next button along with the default action.\n */\n onNextCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the previous button along with the default action.\n */\n onPrevCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the done button along with the default action.\n */\n onDoneCallback?: (event: GestureResponderEvent) => void;\n /**\n * A component that applies blur effect to the toolbar.\n */\n blur?: React.JSX.Element | null;\n /**\n * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.\n */\n opacity?: HEX;\n /**\n * A object containing `left`/`right` properties. Used to specify proper container padding in landscape mode.\n */\n insets?: SafeAreaInsets;\n} & Pick<KeyboardStickyViewProps, \"offset\" | \"enabled\">;\n\nconst TEST_ID_KEYBOARD_TOOLBAR = \"keyboard.toolbar\";\nconst TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;\nconst TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;\nconst TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;\nconst TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;\n\nconst KEYBOARD_TOOLBAR_HEIGHT = 42;\nconst DEFAULT_OPACITY: HEX = \"FF\";\n\n/**\n * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and\n * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.\n *\n * @param props - Component props.\n * @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardToolbar doneText=\"Close\" />\n * ```\n */\nconst KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {\n const {\n content,\n theme = colors,\n doneText = \"Done\",\n button,\n icon,\n showArrows = true,\n onNextCallback,\n onPrevCallback,\n onDoneCallback,\n blur = null,\n opacity = DEFAULT_OPACITY,\n offset: { closed = 0, opened = 0 } = {},\n enabled = true,\n insets,\n ...rest\n } = props;\n const colorScheme = useColorScheme();\n const [inputs, setInputs] = useState({\n current: 0,\n count: 0,\n });\n const isPrevDisabled = inputs.current === 0;\n const isNextDisabled = inputs.current === inputs.count - 1;\n\n useEffect(() => {\n const subscription = FocusedInputEvents.addListener(\"focusDidSet\", (e) => {\n setInputs(e);\n });\n\n return subscription.remove;\n }, []);\n const doneStyle = useMemo(\n () => [styles.doneButton, { color: theme[colorScheme].primary }],\n [colorScheme, theme],\n );\n const toolbarStyle = useMemo(\n () => [\n styles.toolbar,\n {\n backgroundColor: `${theme[colorScheme].background}${opacity}`,\n },\n {\n paddingLeft: insets?.left,\n paddingRight: insets?.right,\n },\n ],\n [colorScheme, opacity, theme, insets],\n );\n const offset = useMemo(\n () => ({ closed: closed + KEYBOARD_TOOLBAR_HEIGHT, opened }),\n [closed, opened],\n );\n const ButtonContainer = button || Button;\n const IconContainer = icon || Arrow;\n\n const onPressNext = useCallback(\n (event: GestureResponderEvent) => {\n onNextCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"next\");\n }\n },\n [onNextCallback],\n );\n const onPressPrev = useCallback(\n (event: GestureResponderEvent) => {\n onPrevCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"prev\");\n }\n },\n [onPrevCallback],\n );\n const onPressDone = useCallback(\n (event: GestureResponderEvent) => {\n onDoneCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.dismiss();\n }\n },\n [onDoneCallback],\n );\n\n return (\n <KeyboardStickyView enabled={enabled} offset={offset}>\n <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>\n {blur}\n {showArrows && (\n <View style={styles.arrows}>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the previous field\"\n accessibilityLabel=\"Previous\"\n disabled={isPrevDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS}\n theme={theme}\n onPress={onPressPrev}\n >\n <IconContainer\n disabled={isPrevDisabled}\n theme={theme}\n type=\"prev\"\n />\n </ButtonContainer>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the next field\"\n accessibilityLabel=\"Next\"\n disabled={isNextDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_NEXT}\n theme={theme}\n onPress={onPressNext}\n >\n <IconContainer\n disabled={isNextDisabled}\n theme={theme}\n type=\"next\"\n />\n </ButtonContainer>\n </View>\n )}\n\n <View style={styles.flex} testID={TEST_ID_KEYBOARD_TOOLBAR_CONTENT}>\n {content}\n </View>\n {doneText && (\n <ButtonContainer\n accessibilityHint=\"Closes the keyboard\"\n accessibilityLabel=\"Done\"\n rippleRadius={28}\n style={styles.doneButtonContainer}\n testID={TEST_ID_KEYBOARD_TOOLBAR_DONE}\n theme={theme}\n onPress={onPressDone}\n >\n <Text maxFontSizeMultiplier={1.3} style={doneStyle}>\n {doneText}\n </Text>\n </ButtonContainer>\n )}\n </View>\n </KeyboardStickyView>\n );\n};\n\nconst styles = StyleSheet.create({\n flex: {\n flex: 1,\n },\n toolbar: {\n position: \"absolute\",\n bottom: 0,\n alignItems: \"center\",\n width: \"100%\",\n flexDirection: \"row\",\n height: KEYBOARD_TOOLBAR_HEIGHT,\n },\n arrows: {\n flexDirection: \"row\",\n paddingLeft: 8,\n },\n doneButton: {\n fontWeight: \"600\",\n fontSize: 15,\n },\n doneButtonContainer: {\n marginRight: 16,\n marginLeft: 8,\n },\n});\n\nexport { colors as DefaultKeyboardToolbarTheme };\nexport default KeyboardToolbar;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACxE,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AAErD,SAASC,kBAAkB,QAAQ,gBAAgB;AACnD,SAASC,kBAAkB,QAAQ,cAAc;AACjD,OAAOC,cAAc,MAAM,yBAAyB;AACpD,OAAOC,kBAAkB,MAAM,uBAAuB;AAEtD,OAAOC,KAAK,MAAM,SAAS;AAC3B,OAAOC,MAAM,MAAM,UAAU;AAC7B,SAASC,MAAM,QAAQ,UAAU;AAyDjC,MAAMC,wBAAwB,GAAG,kBAAkB;AACnD,MAAMC,iCAAiC,GAAG,GAAGD,wBAAwB,WAAW;AAChF,MAAME,6BAA6B,GAAG,GAAGF,wBAAwB,OAAO;AACxE,MAAMG,gCAAgC,GAAG,GAAGH,wBAAwB,UAAU;AAC9E,MAAMI,6BAA6B,GAAG,GAAGJ,wBAAwB,OAAO;AAExE,MAAMK,uBAAuB,GAAG,EAAE;AAClC,MAAMC,eAAoB,GAAG,IAAI;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,eAA+C,GAAIC,KAAK,IAAK;EACjE,MAAM;IACJC,OAAO;IACPC,KAAK,GAAGX,MAAM;IACdY,QAAQ,GAAG,MAAM;IACjBC,MAAM;IACNC,IAAI;IACJC,UAAU,GAAG,IAAI;IACjBC,cAAc;IACdC,cAAc;IACdC,cAAc;IACdC,IAAI,GAAG,IAAI;IACXC,OAAO,GAAGb,eAAe;IACzBc,MAAM,EAAE;MAAEC,MAAM,GAAG,CAAC;MAAEC,MAAM,GAAG;IAAE,CAAC,GAAG,CAAC,CAAC;IACvCC,OAAO,GAAG,IAAI;IACdC,MAAM;IACN,GAAGC;EACL,CAAC,GAAGjB,KAAK;EACT,MAAMkB,WAAW,GAAG/B,cAAc,CAAC,CAAC;EACpC,MAAM,CAACgC,MAAM,EAAEC,SAAS,CAAC,GAAGvC,QAAQ,CAAC;IACnCwC,OAAO,EAAE,CAAC;IACVC,KAAK,EAAE;EACT,CAAC,CAAC;EACF,MAAMC,cAAc,GAAGJ,MAAM,CAACE,OAAO,KAAK,CAAC;EAC3C,MAAMG,cAAc,GAAGL,MAAM,CAACE,OAAO,KAAKF,MAAM,CAACG,KAAK,GAAG,CAAC;EAE1D3C,SAAS,CAAC,MAAM;IACd,MAAM8C,YAAY,GAAGxC,kBAAkB,CAACyC,WAAW,CAAC,aAAa,EAAGC,CAAC,IAAK;MACxEP,SAAS,CAACO,CAAC,CAAC;IACd,CAAC,CAAC;IAEF,OAAOF,YAAY,CAACG,MAAM;EAC5B,CAAC,EAAE,EAAE,CAAC;EACN,MAAMC,SAAS,GAAGjD,OAAO,CACvB,MAAM,CAACkD,MAAM,CAACC,UAAU,EAAE;IAAEC,KAAK,EAAE9B,KAAK,CAACgB,WAAW,CAAC,CAACe;EAAQ,CAAC,CAAC,EAChE,CAACf,WAAW,EAAEhB,KAAK,CACrB,CAAC;EACD,MAAMgC,YAAY,GAAGtD,OAAO,CAC1B,MAAM,CACJkD,MAAM,CAACK,OAAO,EACd;IACEC,eAAe,EAAE,GAAGlC,KAAK,CAACgB,WAAW,CAAC,CAACmB,UAAU,GAAG1B,OAAO;EAC7D,CAAC,EACD;IACE2B,WAAW,EAAEtB,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEuB,IAAI;IACzBC,YAAY,EAAExB,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEyB;EACxB,CAAC,CACF,EACD,CAACvB,WAAW,EAAEP,OAAO,EAAET,KAAK,EAAEc,MAAM,CACtC,CAAC;EACD,MAAMJ,MAAM,GAAGhC,OAAO,CACpB,OAAO;IAAEiC,MAAM,EAAEA,MAAM,GAAGhB,uBAAuB;IAAEiB;EAAO,CAAC,CAAC,EAC5D,CAACD,MAAM,EAAEC,MAAM,CACjB,CAAC;EACD,MAAM4B,eAAe,GAAGtC,MAAM,IAAId,MAAM;EACxC,MAAMqD,aAAa,GAAGtC,IAAI,IAAIhB,KAAK;EAEnC,MAAMuD,WAAW,GAAGlE,WAAW,CAC5BmE,KAA4B,IAAK;IAChCtC,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAGsC,KAAK,CAAC;IAEvB,IAAI,CAACA,KAAK,CAACC,kBAAkB,CAAC,CAAC,EAAE;MAC/B5D,kBAAkB,CAAC6D,UAAU,CAAC,MAAM,CAAC;IACvC;EACF,CAAC,EACD,CAACxC,cAAc,CACjB,CAAC;EACD,MAAMyC,WAAW,GAAGtE,WAAW,CAC5BmE,KAA4B,IAAK;IAChCrC,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAGqC,KAAK,CAAC;IAEvB,IAAI,CAACA,KAAK,CAACC,kBAAkB,CAAC,CAAC,EAAE;MAC/B5D,kBAAkB,CAAC6D,UAAU,CAAC,MAAM,CAAC;IACvC;EACF,CAAC,EACD,CAACvC,cAAc,CACjB,CAAC;EACD,MAAMyC,WAAW,GAAGvE,WAAW,CAC5BmE,KAA4B,IAAK;IAChCpC,cAAc,aAAdA,cAAc,eAAdA,cAAc,CAAGoC,KAAK,CAAC;IAEvB,IAAI,CAACA,KAAK,CAACC,kBAAkB,CAAC,CAAC,EAAE;MAC/B5D,kBAAkB,CAACgE,OAAO,CAAC,CAAC;IAC9B;EACF,CAAC,EACD,CAACzC,cAAc,CACjB,CAAC;EAED,oBACEhC,KAAA,CAAA0E,aAAA,CAAC/D,kBAAkB;IAAC2B,OAAO,EAAEA,OAAQ;IAACH,MAAM,EAAEA;EAAO,gBACnDnC,KAAA,CAAA0E,aAAA,CAACnE,IAAI,EAAAoE,QAAA,KAAKnC,IAAI;IAAEoC,KAAK,EAAEnB,YAAa;IAACoB,MAAM,EAAE9D;EAAyB,IACnEkB,IAAI,EACJJ,UAAU,iBACT7B,KAAA,CAAA0E,aAAA,CAACnE,IAAI;IAACqE,KAAK,EAAEvB,MAAM,CAACyB;EAAO,gBACzB9E,KAAA,CAAA0E,aAAA,CAACT,eAAe;IACdc,iBAAiB,EAAC,mCAAmC;IACrDC,kBAAkB,EAAC,UAAU;IAC7BC,QAAQ,EAAEnC,cAAe;IACzB+B,MAAM,EAAE7D,iCAAkC;IAC1CS,KAAK,EAAEA,KAAM;IACbyD,OAAO,EAAEX;EAAY,gBAErBvE,KAAA,CAAA0E,aAAA,CAACR,aAAa;IACZe,QAAQ,EAAEnC,cAAe;IACzBrB,KAAK,EAAEA,KAAM;IACb0D,IAAI,EAAC;EAAM,CACZ,CACc,CAAC,eAClBnF,KAAA,CAAA0E,aAAA,CAACT,eAAe;IACdc,iBAAiB,EAAC,+BAA+B;IACjDC,kBAAkB,EAAC,MAAM;IACzBC,QAAQ,EAAElC,cAAe;IACzB8B,MAAM,EAAE5D,6BAA8B;IACtCQ,KAAK,EAAEA,KAAM;IACbyD,OAAO,EAAEf;EAAY,gBAErBnE,KAAA,CAAA0E,aAAA,CAACR,aAAa;IACZe,QAAQ,EAAElC,cAAe;IACzBtB,KAAK,EAAEA,KAAM;IACb0D,IAAI,EAAC;EAAM,CACZ,CACc,CACb,CACP,eAEDnF,KAAA,CAAA0E,aAAA,CAACnE,IAAI;IAACqE,KAAK,EAAEvB,MAAM,CAAC+B,IAAK;IAACP,MAAM,EAAE3D;EAAiC,GAChEM,OACG,CAAC,EACNE,QAAQ,iBACP1B,KAAA,CAAA0E,aAAA,CAACT,eAAe;IACdc,iBAAiB,EAAC,qBAAqB;IACvCC,kBAAkB,EAAC,MAAM;IACzBK,YAAY,EAAE,EAAG;IACjBT,KAAK,EAAEvB,MAAM,CAACiC,mBAAoB;IAClCT,MAAM,EAAE1D,6BAA8B;IACtCM,KAAK,EAAEA,KAAM;IACbyD,OAAO,EAAEV;EAAY,gBAErBxE,KAAA,CAAA0E,aAAA,CAACpE,IAAI;IAACiF,qBAAqB,EAAE,GAAI;IAACX,KAAK,EAAExB;EAAU,GAChD1B,QACG,CACS,CAEf,CACY,CAAC;AAEzB,CAAC;AAED,MAAM2B,MAAM,GAAGhD,UAAU,CAACmF,MAAM,CAAC;EAC/BJ,IAAI,EAAE;IACJA,IAAI,EAAE;EACR,CAAC;EACD1B,OAAO,EAAE;IACP+B,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC;IACTC,UAAU,EAAE,QAAQ;IACpBC,KAAK,EAAE,MAAM;IACbC,aAAa,EAAE,KAAK;IACpBC,MAAM,EAAE1E;EACV,CAAC;EACD0D,MAAM,EAAE;IACNe,aAAa,EAAE,KAAK;IACpBhC,WAAW,EAAE;EACf,CAAC;EACDP,UAAU,EAAE;IACVyC,UAAU,EAAE,KAAK;IACjBC,QAAQ,EAAE;EACZ,CAAC;EACDV,mBAAmB,EAAE;IACnBW,WAAW,EAAE,EAAE;IACfC,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,SAASpF,MAAM,IAAIqF,2BAA2B;AAC9C,eAAe7E,eAAe","ignoreList":[]}
1
+ {"version":3,"names":["React","useCallback","useEffect","useMemo","useState","StyleSheet","Text","View","FocusedInputEvents","KeyboardController","useColorScheme","KeyboardStickyView","Arrow","Button","colors","DEFAULT_OPACITY","KEYBOARD_HAS_ROUNDED_CORNERS","KEYBOARD_TOOLBAR_HEIGHT","OPENED_OFFSET","TEST_ID_KEYBOARD_TOOLBAR","TEST_ID_KEYBOARD_TOOLBAR_CONTENT","TEST_ID_KEYBOARD_TOOLBAR_DONE","TEST_ID_KEYBOARD_TOOLBAR_NEXT","TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS","KeyboardToolbar","props","content","theme","doneText","button","icon","showArrows","onNextCallback","onPrevCallback","onDoneCallback","blur","opacity","offset","closed","opened","enabled","insets","rest","colorScheme","inputs","setInputs","current","count","isPrevDisabled","isNextDisabled","subscription","addListener","e","remove","doneStyle","styles","doneButton","color","primary","toolbarStyle","toolbar","backgroundColor","background","paddingLeft","left","paddingRight","right","floating","containerStyle","marginLeft","marginRight","ButtonContainer","IconContainer","onPressNext","event","isDefaultPrevented","setFocusTo","onPressPrev","onPressDone","dismiss","createElement","style","_extends","testID","arrows","accessibilityHint","accessibilityLabel","disabled","onPress","type","flex","rippleRadius","doneButtonContainer","maxFontSizeMultiplier","create","position","bottom","alignItems","width","flexDirection","height","fontWeight","fontSize","alignSelf","borderRadius","overflow","DefaultKeyboardToolbarTheme"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { StyleSheet, Text, View } from \"react-native\";\n\nimport { FocusedInputEvents } from \"../../bindings\";\nimport { KeyboardController } from \"../../module\";\nimport useColorScheme from \"../hooks/useColorScheme\";\nimport KeyboardStickyView from \"../KeyboardStickyView\";\n\nimport Arrow from \"./Arrow\";\nimport Button from \"./Button\";\nimport { colors } from \"./colors\";\nimport {\n DEFAULT_OPACITY,\n KEYBOARD_HAS_ROUNDED_CORNERS,\n KEYBOARD_TOOLBAR_HEIGHT,\n OPENED_OFFSET,\n TEST_ID_KEYBOARD_TOOLBAR,\n TEST_ID_KEYBOARD_TOOLBAR_CONTENT,\n TEST_ID_KEYBOARD_TOOLBAR_DONE,\n TEST_ID_KEYBOARD_TOOLBAR_NEXT,\n TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS,\n} from \"./constants\";\n\nimport type { HEX, KeyboardToolbarTheme } from \"./types\";\nimport type { KeyboardStickyViewProps } from \"../KeyboardStickyView\";\nimport type { ReactNode } from \"react\";\nimport type { GestureResponderEvent, ViewProps } from \"react-native\";\n\ntype SafeAreaInsets = {\n left: number;\n right: number;\n};\n\nexport type KeyboardToolbarProps = Omit<\n ViewProps,\n \"style\" | \"testID\" | \"children\"\n> & {\n /** An element that is shown in the middle of the toolbar. */\n content?: React.JSX.Element | null;\n /** A set of dark/light colors consumed by toolbar component. */\n theme?: KeyboardToolbarTheme;\n /** Custom text for done button. */\n doneText?: ReactNode;\n /** Custom touchable component for toolbar (used for prev/next/done buttons). */\n button?: typeof Button;\n /** Custom icon component used to display next/prev buttons. */\n icon?: typeof Arrow;\n /**\n * Whether to show next and previous buttons. Can be useful to set it to `false` if you have only one input\n * and want to show only `Done` button. Default to `true`.\n */\n showArrows?: boolean;\n /**\n * A callback that is called when the user presses the next button along with the default action.\n */\n onNextCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the previous button along with the default action.\n */\n onPrevCallback?: (event: GestureResponderEvent) => void;\n /**\n * A callback that is called when the user presses the done button along with the default action.\n */\n onDoneCallback?: (event: GestureResponderEvent) => void;\n /**\n * A component that applies blur effect to the toolbar.\n */\n blur?: React.JSX.Element | null;\n /**\n * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.\n */\n opacity?: HEX;\n /**\n * A object containing `left`/`right` properties. Used to specify proper container padding in landscape mode.\n */\n insets?: SafeAreaInsets;\n} & Pick<KeyboardStickyViewProps, \"offset\" | \"enabled\">;\n\n/**\n * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and\n * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.\n *\n * @param props - Component props.\n * @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.\n * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.\n * @example\n * ```tsx\n * <KeyboardToolbar doneText=\"Close\" />\n * ```\n */\nconst KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {\n const {\n content,\n theme = colors,\n doneText = \"Done\",\n button,\n icon,\n showArrows = true,\n onNextCallback,\n onPrevCallback,\n onDoneCallback,\n blur = null,\n opacity = DEFAULT_OPACITY,\n offset: { closed = 0, opened = 0 } = {},\n enabled = true,\n insets,\n ...rest\n } = props;\n const colorScheme = useColorScheme();\n const [inputs, setInputs] = useState({\n current: 0,\n count: 0,\n });\n const isPrevDisabled = inputs.current === 0;\n const isNextDisabled = inputs.current === inputs.count - 1;\n\n useEffect(() => {\n const subscription = FocusedInputEvents.addListener(\"focusDidSet\", (e) => {\n setInputs(e);\n });\n\n return subscription.remove;\n }, []);\n const doneStyle = useMemo(\n () => [styles.doneButton, { color: theme[colorScheme].primary }],\n [colorScheme, theme],\n );\n const toolbarStyle = useMemo(\n () => [\n styles.toolbar,\n {\n backgroundColor: `${theme[colorScheme].background}${opacity}`,\n },\n !KEYBOARD_HAS_ROUNDED_CORNERS\n ? {\n paddingLeft: insets?.left,\n paddingRight: insets?.right,\n }\n : null,\n KEYBOARD_HAS_ROUNDED_CORNERS ? styles.floating : null,\n ],\n [colorScheme, opacity, theme, insets],\n );\n const containerStyle = useMemo(\n () => [\n KEYBOARD_HAS_ROUNDED_CORNERS\n ? {\n marginLeft: (insets?.left ?? 0) + 16,\n marginRight: (insets?.right ?? 0) + 16,\n }\n : null,\n ],\n [insets],\n );\n const offset = useMemo(\n () => ({\n closed: closed + KEYBOARD_TOOLBAR_HEIGHT,\n opened: opened + OPENED_OFFSET,\n }),\n [closed, opened],\n );\n const ButtonContainer = button || Button;\n const IconContainer = icon || Arrow;\n\n const onPressNext = useCallback(\n (event: GestureResponderEvent) => {\n onNextCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"next\");\n }\n },\n [onNextCallback],\n );\n const onPressPrev = useCallback(\n (event: GestureResponderEvent) => {\n onPrevCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.setFocusTo(\"prev\");\n }\n },\n [onPrevCallback],\n );\n const onPressDone = useCallback(\n (event: GestureResponderEvent) => {\n onDoneCallback?.(event);\n\n if (!event.isDefaultPrevented()) {\n KeyboardController.dismiss();\n }\n },\n [onDoneCallback],\n );\n\n return (\n <KeyboardStickyView\n enabled={enabled}\n offset={offset}\n style={containerStyle}\n >\n <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>\n {blur}\n {showArrows && (\n <View style={styles.arrows}>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the previous field\"\n accessibilityLabel=\"Previous\"\n disabled={isPrevDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS}\n theme={theme}\n onPress={onPressPrev}\n >\n <IconContainer\n disabled={isPrevDisabled}\n theme={theme}\n type=\"prev\"\n />\n </ButtonContainer>\n <ButtonContainer\n accessibilityHint=\"Moves focus to the next field\"\n accessibilityLabel=\"Next\"\n disabled={isNextDisabled}\n testID={TEST_ID_KEYBOARD_TOOLBAR_NEXT}\n theme={theme}\n onPress={onPressNext}\n >\n <IconContainer\n disabled={isNextDisabled}\n theme={theme}\n type=\"next\"\n />\n </ButtonContainer>\n </View>\n )}\n\n <View style={styles.flex} testID={TEST_ID_KEYBOARD_TOOLBAR_CONTENT}>\n {content}\n </View>\n {doneText && (\n <ButtonContainer\n accessibilityHint=\"Closes the keyboard\"\n accessibilityLabel=\"Done\"\n rippleRadius={28}\n style={styles.doneButtonContainer}\n testID={TEST_ID_KEYBOARD_TOOLBAR_DONE}\n theme={theme}\n onPress={onPressDone}\n >\n <Text maxFontSizeMultiplier={1.3} style={doneStyle}>\n {doneText}\n </Text>\n </ButtonContainer>\n )}\n </View>\n </KeyboardStickyView>\n );\n};\n\nconst styles = StyleSheet.create({\n flex: {\n flex: 1,\n },\n toolbar: {\n position: \"absolute\",\n bottom: 0,\n alignItems: \"center\",\n width: \"100%\",\n flexDirection: \"row\",\n height: KEYBOARD_TOOLBAR_HEIGHT,\n },\n arrows: {\n flexDirection: \"row\",\n paddingLeft: 8,\n },\n doneButton: {\n fontWeight: \"600\",\n fontSize: 15,\n },\n doneButtonContainer: {\n marginRight: 16,\n marginLeft: 8,\n },\n floating: {\n alignSelf: \"center\",\n borderRadius: 20,\n overflow: \"hidden\",\n },\n});\n\nexport { colors as DefaultKeyboardToolbarTheme };\nexport default KeyboardToolbar;\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,10 @@
1
+ import type { HEX } from "./types";
2
+ export declare const TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
3
+ export declare const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = "keyboard.toolbar.previous";
4
+ export declare const TEST_ID_KEYBOARD_TOOLBAR_NEXT = "keyboard.toolbar.next";
5
+ export declare const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = "keyboard.toolbar.content";
6
+ export declare const TEST_ID_KEYBOARD_TOOLBAR_DONE = "keyboard.toolbar.done";
7
+ export declare const KEYBOARD_TOOLBAR_HEIGHT = 42;
8
+ export declare const DEFAULT_OPACITY: HEX;
9
+ export declare const KEYBOARD_HAS_ROUNDED_CORNERS: boolean;
10
+ export declare const OPENED_OFFSET: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-keyboard-controller",
3
- "version": "1.17.4",
3
+ "version": "1.17.5",
4
4
  "description": "Keyboard manager which works in identical way on both iOS and Android",
5
5
  "main": "lib/commonjs/index",
6
6
  "module": "lib/module/index",
@@ -0,0 +1,15 @@
1
+ import { Platform } from "react-native";
2
+
3
+ import type { HEX } from "./types";
4
+
5
+ export const TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
6
+ export const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;
7
+ export const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;
8
+ export const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;
9
+ export const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;
10
+
11
+ export const KEYBOARD_TOOLBAR_HEIGHT = 42;
12
+ export const DEFAULT_OPACITY: HEX = "FF";
13
+ export const KEYBOARD_HAS_ROUNDED_CORNERS =
14
+ Platform.OS === "ios" && parseInt(Platform.Version, 10) >= 26;
15
+ export const OPENED_OFFSET = KEYBOARD_HAS_ROUNDED_CORNERS ? -11 : 0;
@@ -9,6 +9,17 @@ import KeyboardStickyView from "../KeyboardStickyView";
9
9
  import Arrow from "./Arrow";
10
10
  import Button from "./Button";
11
11
  import { colors } from "./colors";
12
+ import {
13
+ DEFAULT_OPACITY,
14
+ KEYBOARD_HAS_ROUNDED_CORNERS,
15
+ KEYBOARD_TOOLBAR_HEIGHT,
16
+ OPENED_OFFSET,
17
+ TEST_ID_KEYBOARD_TOOLBAR,
18
+ TEST_ID_KEYBOARD_TOOLBAR_CONTENT,
19
+ TEST_ID_KEYBOARD_TOOLBAR_DONE,
20
+ TEST_ID_KEYBOARD_TOOLBAR_NEXT,
21
+ TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS,
22
+ } from "./constants";
12
23
 
13
24
  import type { HEX, KeyboardToolbarTheme } from "./types";
14
25
  import type { KeyboardStickyViewProps } from "../KeyboardStickyView";
@@ -65,15 +76,6 @@ export type KeyboardToolbarProps = Omit<
65
76
  insets?: SafeAreaInsets;
66
77
  } & Pick<KeyboardStickyViewProps, "offset" | "enabled">;
67
78
 
68
- const TEST_ID_KEYBOARD_TOOLBAR = "keyboard.toolbar";
69
- const TEST_ID_KEYBOARD_TOOLBAR_PREVIOUS = `${TEST_ID_KEYBOARD_TOOLBAR}.previous`;
70
- const TEST_ID_KEYBOARD_TOOLBAR_NEXT = `${TEST_ID_KEYBOARD_TOOLBAR}.next`;
71
- const TEST_ID_KEYBOARD_TOOLBAR_CONTENT = `${TEST_ID_KEYBOARD_TOOLBAR}.content`;
72
- const TEST_ID_KEYBOARD_TOOLBAR_DONE = `${TEST_ID_KEYBOARD_TOOLBAR}.done`;
73
-
74
- const KEYBOARD_TOOLBAR_HEIGHT = 42;
75
- const DEFAULT_OPACITY: HEX = "FF";
76
-
77
79
  /**
78
80
  * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and
79
81
  * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.
@@ -129,15 +131,32 @@ const KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {
129
131
  {
130
132
  backgroundColor: `${theme[colorScheme].background}${opacity}`,
131
133
  },
132
- {
133
- paddingLeft: insets?.left,
134
- paddingRight: insets?.right,
135
- },
134
+ !KEYBOARD_HAS_ROUNDED_CORNERS
135
+ ? {
136
+ paddingLeft: insets?.left,
137
+ paddingRight: insets?.right,
138
+ }
139
+ : null,
140
+ KEYBOARD_HAS_ROUNDED_CORNERS ? styles.floating : null,
136
141
  ],
137
142
  [colorScheme, opacity, theme, insets],
138
143
  );
144
+ const containerStyle = useMemo(
145
+ () => [
146
+ KEYBOARD_HAS_ROUNDED_CORNERS
147
+ ? {
148
+ marginLeft: (insets?.left ?? 0) + 16,
149
+ marginRight: (insets?.right ?? 0) + 16,
150
+ }
151
+ : null,
152
+ ],
153
+ [insets],
154
+ );
139
155
  const offset = useMemo(
140
- () => ({ closed: closed + KEYBOARD_TOOLBAR_HEIGHT, opened }),
156
+ () => ({
157
+ closed: closed + KEYBOARD_TOOLBAR_HEIGHT,
158
+ opened: opened + OPENED_OFFSET,
159
+ }),
141
160
  [closed, opened],
142
161
  );
143
162
  const ButtonContainer = button || Button;
@@ -175,7 +194,11 @@ const KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {
175
194
  );
176
195
 
177
196
  return (
178
- <KeyboardStickyView enabled={enabled} offset={offset}>
197
+ <KeyboardStickyView
198
+ enabled={enabled}
199
+ offset={offset}
200
+ style={containerStyle}
201
+ >
179
202
  <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>
180
203
  {blur}
181
204
  {showArrows && (
@@ -258,6 +281,11 @@ const styles = StyleSheet.create({
258
281
  marginRight: 16,
259
282
  marginLeft: 8,
260
283
  },
284
+ floating: {
285
+ alignSelf: "center",
286
+ borderRadius: 20,
287
+ overflow: "hidden",
288
+ },
261
289
  });
262
290
 
263
291
  export { colors as DefaultKeyboardToolbarTheme };