react-native-external-keyboard 0.8.5 → 0.9.1

package/src/nativeSpec/TextInputFocusWrapperNativeComponent.ts

@@ -1,6 +1,7 @@
 import type { ViewProps, ColorValue } from 'react-native';
 import type {
   DirectEventHandler,
+  Float,
   Int32,
 } from 'react-native/Libraries/Types/CodegenTypes';
 // eslint-disable-next-line @react-native/no-deep-imports
@@ -21,10 +22,25 @@ export interface TextInputFocusWrapperNativeComponent extends ViewProps {
   blurType?: Int32;
   canBeFocused?: boolean;
   haloEffect?: boolean;
+  haloCornerRadius?: Float;
+  haloExpendX?: Float;
+  haloExpendY?: Float;
   tintColor?: ColorValue;
   blurOnSubmit?: boolean;
   multiline?: boolean;
   groupIdentifier?: string;
+  lockFocus?: Int32;
+  orderGroup?: string;
+  orderIndex?: Int32;
+  orderId?: string;
+  orderLeft?: string;
+  orderRight?: string;
+  orderUp?: string;
+  orderDown?: string;
+  orderForward?: string;
+  orderBackward?: string;
+  orderFirst?: string;
+  orderLast?: string;
 }
 
 export default codegenNativeComponent<TextInputFocusWrapperNativeComponent>(

package/src/types/BaseKeyboardView.ts

@@ -67,6 +67,8 @@ export type BaseFocusViewProps = {
   orderBackward?: string;
   orderFirst?: string | null;
   orderLast?: string | null;
+  orderPrefix?: string;
+  defaultFocusHighlightEnabled?: boolean;
 };
 
 export type BaseKeyboardViewProps = ViewProps & BaseFocusViewProps;

package/src/types/KeyboardFocusLock.types.ts

@@ -3,4 +3,5 @@ import type { ViewProps } from 'react-native';
 export type KeyboardFocusLockProps = ViewProps & {
   componentType?: number;
   lockDisabled?: boolean;
+  forceLock?: boolean;
 };

package/src/types/WithKeyboardFocus.ts

@@ -36,7 +36,18 @@ export type KeyboardPressType<ComponentProps extends object> = {
   onComponentBlur?: PickProp<ComponentProps, 'onBlur'>;
 };
 
-export type WithKeyboardProps<ViewType = View, ViewStyleType = unknown> = {
+/** Extracts the state argument from a component's children render prop, or `never`. */
+type ExtractRenderPropState<T> = T extends (state: infer S) => any ? S : never;
+
+export type ChildrenRenderState<CP extends object> = 'children' extends keyof CP
+  ? ExtractRenderPropState<NonNullable<CP['children']>>
+  : never;
+
+export type WithKeyboardProps<
+  ViewType = View,
+  ViewStyleType = unknown,
+  ComponentProps extends object = {}
+> = {
   withPressedStyle?: boolean;
   containerStyle?: ViewStyleType | ViewProps['style'];
   containerFocusStyle?: FocusStyle;
@@ -46,6 +57,12 @@ export type WithKeyboardProps<ViewType = View, ViewStyleType = unknown> = {
   style?: PressableProps['style'];
   onBlur?: (() => void) | ((e: any) => void) | null;
   onFocus?: (() => void) | ((e: any) => void) | null;
+  renderContent?: ChildrenRenderState<ComponentProps> extends never
+    ? never
+    : (
+        state: ChildrenRenderState<ComponentProps> & { focused: boolean }
+      ) => React.ReactNode;
+  renderFocusable?: (state: { focused: boolean }) => React.ReactNode;
 };
 
 type KeyboardFocusBaseProps = Omit<
@@ -65,7 +82,7 @@ type KeyboardFocusOverrideProps<
   ViewType = View
 > = KeyboardPressType<ComponentProps> &
   KeyboardFocusBaseProps &
-  WithKeyboardProps<ViewType, ViewStyleType>;
+  WithKeyboardProps<ViewType, ViewStyleType, ComponentProps>;
 
 export type WithKeyboardFocus<
   ComponentProps extends object,

package/src/utils/useFocusStyle.tsx

@@ -1,22 +1,11 @@
 import { useState, useMemo, useCallback } from 'react';
-import {
-  Platform,
-  type ColorValue,
-  type PressableProps,
-  Pressable,
-} from 'react-native';
+import { type ColorValue, type PressableProps, Pressable } from 'react-native';
 import type { FocusStyle } from '../types';
 import type { TintType } from '../types/WithKeyboardFocus';
 
-const backgroundTintMap = Platform.select<Partial<Record<TintType, boolean>>>({
-  ios: {
-    background: true,
-  },
-  default: {
-    background: true,
-    default: true,
-  },
-});
+const backgroundTintMap: Partial<Record<TintType, boolean>> = {
+  background: true,
+};
 
 const DEFAULT_BACKGROUND_TINT = '#dce3f9';
 
@@ -29,6 +18,7 @@ type UseFocusStyleProps<C> = {
   style?: PressableProps['style'];
   Component?: React.ComponentType<C>;
   withPressedStyle?: boolean;
+  defaultFocusHighlightEnabled?: boolean;
 };
 
 export const useFocusStyle = <C extends {}>({

package/src/utils/withKeyboardFocus.tsx

@@ -73,6 +73,9 @@ export const withKeyboardFocus = <
         lockFocus,
         onComponentFocus,
         onComponentBlur,
+        renderContent,
+        renderFocusable,
+        defaultFocusHighlightEnabled,
         ...props
       } = allProps as WithKeyboardFocus<ComponentProps, ViewStyleType>;
 
@@ -107,15 +110,46 @@ export const withKeyboardFocus = <
           disabled: (props as { disabled?: boolean })?.disabled,
         });
 
-      const HoverComponent = useMemo(() => {
+      const contentChildrenProp = useMemo(
+        () =>
+          renderContent
+            ? (state: Record<string, unknown>) =>
+                (
+                  renderContent as unknown as (
+                    s: Record<string, unknown>
+                  ) => React.ReactNode
+                )({ ...state, focused })
+            : undefined,
+        [renderContent, focused]
+      );
+
+      const focusableChildrenProp = useMemo(
+        () => (renderFocusable ? renderFocusable({ focused }) : undefined),
+        [renderFocusable, focused]
+      );
+
+      const hoverContent = useMemo(() => {
         if (FocusHoverComponent) return FocusHoverComponent;
         if (tintType === 'hover') {
           return <View style={[hoverColor, styles.absolute, styles.opacity]} />;
         }
-
         return undefined;
       }, [FocusHoverComponent, hoverColor, tintType]);
 
+      const focusOrderProps = {
+        orderIndex,
+        orderGroup,
+        orderId,
+        orderLeft,
+        orderRight,
+        orderUp,
+        orderDown,
+        orderForward,
+        orderBackward,
+        orderFirst,
+        orderLast,
+      };
+
       const onContextMenuHandler = useCallback(() => {
         (onLongPress as (e?: OnKeyPress) => void)?.();
       }, [onLongPress]);
@@ -127,6 +161,7 @@ export const withKeyboardFocus = <
               containerStyle as ViewProps['style'],
               containerFocusedStyle,
             ]}
+            defaultFocusHighlightEnabled={defaultFocusHighlightEnabled}
             ref={ref as RefObject<KeyboardFocus>}
             viewRef={viewRef}
             onKeyUpPress={onKeyUpPressHandler}
@@ -150,18 +185,8 @@ export const withKeyboardFocus = <
             enableA11yFocus={enableA11yFocus}
             screenAutoA11yFocus={screenAutoA11yFocus}
             screenAutoA11yFocusDelay={screenAutoA11yFocusDelay}
-            orderIndex={orderIndex}
-            orderGroup={orderGroup}
             lockFocus={lockFocus}
-            orderId={orderId}
-            orderLeft={orderLeft}
-            orderRight={orderRight}
-            orderUp={orderUp}
-            orderDown={orderDown}
-            orderForward={orderForward}
-            orderBackward={orderBackward}
-            orderFirst={orderFirst}
-            orderLast={orderLast}
+            {...focusOrderProps}
           >
             <Component
               ref={componentRef}
@@ -181,9 +206,13 @@ export const withKeyboardFocus = <
               onFocus={onComponentFocus}
               onBlur={onComponentBlur}
               {...(props as unknown as ComponentProps)}
+              {...((contentChildrenProp || focusableChildrenProp) &&
+                ({
+                  children: contentChildrenProp ?? focusableChildrenProp,
+                } as unknown as Partial<ComponentProps>))}
             />
-            {focused && HoverComponent && (
-              <RenderPropComponent render={HoverComponent} />
+            {focused && hoverContent && (
+              <RenderPropComponent render={hoverContent} />
             )}
           </BaseKeyboardView>
         </IsViewFocusedContext.Provider>

package/src/utils/wrapOrderPrefix.ts

@@ -0,0 +1,16 @@
+type Wrap = (id: string | undefined) => string | undefined;
+
+const withPrefix =
+  (prefix: string): Wrap =>
+  (id) =>
+    id ? `${prefix}_${id}` : undefined;
+
+const identity: Wrap = (id) => id;
+
+/**
+ * Returns a function that prepends `prefix` to an order ID.
+ * When `prefix` is empty the identity function is returned — no
+ * per-call branch needed.
+ */
+export const wrapOrderPrefix = (prefix: string): Wrap =>
+  prefix ? withPrefix(prefix) : identity;

package/ios/Delegates/RNCEKVFocusOrderDelegate/RNCEKVFocusGuideDelegate/RNCEKVFocusGuideDelegate.h

@@ -1,36 +0,0 @@
-//
-//  RNCEKVFocusGuideDelegate.h
-//  Pods
-//
-//  Created by Artur Kalach on 16/07/2025.
-//
-
-#ifndef RNCEKVFocusGuideDelegate_h
-#define RNCEKVFocusGuideDelegate_h
-
-#import <Foundation/Foundation.h>
-#import "RNCEKVFocusOrderProtocol.h"
-#import "RNCEKVFocusGuideHelper.h"
-
-@interface RNCEKVFocusGuideDelegate : NSObject
-
-- (instancetype _Nonnull)initWithView:(UIView<RNCEKVFocusOrderProtocol> *_Nonnull)view;
-
-//- (void)setLeftGuide:(UIView *_Nullable)view;
-//- (void)setRightGuide:(UIView *_Nullable)view;
-//- (void)setUpGuide:(UIView *_Nullable)view;
-//- (void)setDownGuide:(UIView *_Nullable)view;
-//
-//- (void)removeLeftGuide;
-//- (void)removeRightGuide;
-//- (void)removeUpGuide;
-//- (void)removeDownGuide;
-
-- (void)setIsFocused:(BOOL)value;
-
-- (void)setGuideFor:(RNCEKVFocusGuideDirection)direction withView: (UIView *_Nonnull)view;
-- (void)removeGuideFor:(RNCEKVFocusGuideDirection)direction;
-
-@end
-
-#endif /* RNCEKVFocusGuideDelegate_h */

package/ios/Delegates/RNCEKVFocusOrderDelegate/RNCEKVFocusGuideDelegate/RNCEKVFocusGuideDelegate.mm

@@ -1,150 +0,0 @@
-//
-//  RNCEKVFocusGuideDelegate.m
-//  react-native-external-keyboard
-//
-//  Created by Artur Kalach on 16/07/2025.
-//
-
-#import <Foundation/Foundation.h>
-#import "RNCEKVFocusGuideDelegate.h"
-
-@implementation RNCEKVFocusGuideDelegate{
-  BOOL _isFocused;
-  UIView<RNCEKVFocusOrderProtocol>* _delegate;
-//  UIFocusGuide *_leftFocusGuide;
-//  UIFocusGuide *_rightFocusGuide;
-//  UIFocusGuide *_upFocusGuide;
-//  UIFocusGuide *_downFocusGuide;
-  NSMutableDictionary<NSNumber *, UIFocusGuide*> *_sides;
-}
-
-- (instancetype _Nonnull )initWithView:(UIView<RNCEKVFocusOrderProtocol> *_Nonnull)delegate{
-  self = [super init];
-  if (self) {
-    _delegate = delegate;
-    _isFocused = false;
-    _sides = [NSMutableDictionary dictionary];
-  }
-  return self;
-}
-
-
-- (void)setGuideFor:(RNCEKVFocusGuideDirection)direction withView: (UIView *)view {
-  if (!view) return;
-  
-  [self removeGuideFor: direction];
-  _sides[@(direction)] = [RNCEKVFocusGuideHelper setGuideForDirection: direction
-                                        inView:_delegate
-                                     focusView: view
-                                       enabled: _isFocused];
-}
-
--(void)removeGuideFor:(RNCEKVFocusGuideDirection)direction {
-  if (_sides[@(direction)]) {
-    [_delegate removeLayoutGuide: _sides[@(direction)]];
-    _sides[@(direction)] = nil;
-  }
-}
-
-//
-//
-//- (void)setLeftGuide:(UIView *)view {
-//  if (!view) {
-//    return;
-//  }
-//  
-//  [self removeLeftGuide];
-//  _leftFocusGuide = [RNCEKVFocusGuideHelper setGuideForDirection: RNCEKVFocusGuideDirectionLeft
-//                                        inView:_delegate
-//                                     focusView:view
-//                                       enabled: _isFocused];
-//}
-//
-//
-//
-//- (void)setRightGuide:(UIView *)view {
-//  if (!view) return;
-//  
-//  [self removeRightGuide];
-//  _rightFocusGuide = [RNCEKVFocusGuideHelper setGuideForDirection: RNCEKVFocusGuideDirectionRight
-//                                        inView:_delegate
-//                                     focusView:view
-//                                       enabled: _isFocused];
-//}
-//
-//- (void)setUpGuide:(UIView *)view {
-//  if (!view) return;
-//  
-//  [self removeUpGuide];
-//  _upFocusGuide = [RNCEKVFocusGuideHelper setGuideForDirection: RNCEKVFocusGuideDirectionUp
-//                                        inView:_delegate
-//                                     focusView:view
-//                                       enabled: _isFocused];
-//}
-//
-//- (void)setDownGuide:(UIView *)view {
-//  if (!view) return;
-//  
-//  [self removeDownGuide];
-//  _downFocusGuide = [RNCEKVFocusGuideHelper setGuideForDirection: RNCEKVFocusGuideDirectionDown
-//                                        inView:_delegate
-//                                     focusView:view
-//                                       enabled: _isFocused];
-//}
-
-- (void)setIsFocused:(BOOL)value {
-  _isFocused = value;
-  
-  for (NSNumber *key in _sides) {
-      UIFocusGuide* side = _sides[key];
-      if(side) {
-        side.enabled = value;
-      }
-  }
-//  
-//  if(_leftFocusGuide != nil) {
-//    _leftFocusGuide.enabled = value;
-//  }
-//  
-//  if(_rightFocusGuide != nil) {
-//    _rightFocusGuide.enabled = value;
-//  }
-//  
-//  if(_upFocusGuide != nil) {
-//    _upFocusGuide.enabled = value;
-//  }
-//  
-//  if(_downFocusGuide != nil) {
-//    _downFocusGuide.enabled = value;
-//  }
-}
-//
-//- (void)removeLeftGuide {
-//  if (_leftFocusGuide) {
-//    [_delegate removeLayoutGuide: _leftFocusGuide];
-//    _leftFocusGuide = nil;
-//  }
-//}
-//
-//- (void)removeRightGuide {
-//  if (_rightFocusGuide) {
-//    [_delegate removeLayoutGuide: _rightFocusGuide];
-//    _rightFocusGuide = nil;
-//  }
-//}
-//
-//- (void)removeUpGuide {
-//  if (_upFocusGuide) {
-//    [_delegate removeLayoutGuide:_upFocusGuide];
-//    _upFocusGuide = nil;
-//  }
-//}
-//
-//- (void)removeDownGuide {
-//  if (_downFocusGuide) {
-//    [_delegate removeLayoutGuide:_downFocusGuide];
-//    _downFocusGuide = nil;
-//  }
-//}
-
-@end

package/ios/Delegates/RNCEKVFocusOrderDelegate/RNCEKVFocusOrderDelegate.h

@@ -1,47 +0,0 @@
-//
-//  RNCEKVFocusOrderDelegate.h
-//  Pods
-//
-//  Created by Artur Kalach on 25/06/2025.
-//
-
-#ifndef RNCEKVFocusOrderDelegate_h
-#define RNCEKVFocusOrderDelegate_h
-
-#import <Foundation/Foundation.h>
-#import "RNCEKVFocusOrderProtocol.h"
-#import "RNCEKVFocusGuideDelegate.h"
-#import "RNCEKVOrderSubscriber.h"
-
-typedef NS_ENUM(NSUInteger, RNCEKVLinkDirection) {
-    RNCEKVLinkDirectionLeft,
-    RNCEKVLinkDirectionRight,
-    RNCEKVLinkDirectionUp,
-    RNCEKVLinkDirectionDown
-};
-
-
-
-
-@interface RNCEKVFocusOrderDelegate : NSObject
-
-- (instancetype _Nonnull)initWithView:(UIView<RNCEKVFocusOrderProtocol> *_Nonnull)view;
-
-- (NSNumber*_Nullable)shouldUpdateFocusInContext:(UIFocusUpdateContext *_Nonnull)context;
-
-@property (nonatomic, strong) NSMutableDictionary<NSNumber *, RNCEKVOrderSubscriber*> * _Nonnull subscribers;
-
-- (void)linkId;
-- (void)refreshId:(NSString*_Nullable)prev next:(NSString*_Nullable)next;
-- (void)setIsFocused:(BOOL)value;
-
-- (void)refreshLeft:(NSString*_Nullable)prev next:(NSString*_Nullable)next;
-- (void)refreshRight:(NSString*_Nullable)prev next:(NSString*_Nullable)next;
-- (void)refreshUp:(NSString*_Nullable)prev next:(NSString*_Nullable)next;
-- (void)refreshDown:(NSString*_Nullable)prev next:(NSString*_Nullable)next;
-- (void)clear;
-
-@end
-
-
-#endif /* RNCEKVFocusOrderDelegate_h */