react-native-keyboard-controller 1.13.4 → 1.14.0

package/lib/typescript/types.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import type { PropsWithChildren } from "react";
 import type { EmitterSubscription, NativeSyntheticEvent, ViewProps } from "react-native";
 export type NativeEvent = {
     progress: number;
@@ -74,6 +74,9 @@ export type KeyboardGestureAreaProps = {
      */
     offset?: number;
 } & ViewProps;
+export type OverKeyboardViewProps = PropsWithChildren<{
+    visible: boolean;
+}>;
 export type Direction = "next" | "prev" | "current";
 export type KeyboardControllerModule = {
     setDefaultMode: () => void;

package/lib/typescript/views/OverKeyboardView/index.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import type { OverKeyboardViewProps } from "../../types";
+import type { PropsWithChildren } from "react";
+declare const OverKeyboardView: ({ children, visible, }: PropsWithChildren<OverKeyboardViewProps>) => React.JSX.Element;
+export default OverKeyboardView;

package/lib/typescript/views/index.d.ts

@@ -0,0 +1 @@
+export { default as OverKeyboardView } from "./OverKeyboardView";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-keyboard-controller",
-  "version": "1.13.4",
+  "version": "1.14.0",
   "description": "Keyboard manager which works in identical way on both iOS and Android",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -21,8 +21,12 @@
     "!android/gradle",
     "!android/gradlew",
     "!android/gradlew.bat",
+    "!android/.editorconfig",
     "!ios/build",
     "!ios/KeyboardControllerNative",
+    "!ios/.swiftlint.yml",
+    "!ios/.swiftformat",
+    "!ios/.clang-format",
     "!**/__tests__",
     "!**/__fixtures__",
     "!**/__mocks__"
@@ -51,6 +55,7 @@
     "avoiding view",
     "avoid keyboard",
     "sticky view",
+    "over keyboard view",
     "keyboard aware scroll view",
     "keyboard toolbar",
     "keyboard done button",
@@ -71,7 +76,7 @@
   },
   "devDependencies": {
     "@commitlint/config-conventional": "^11.0.0",
-    "@react-native/eslint-config": "^0.75.2",
+    "@react-native/eslint-config": "^0.75.3",
     "@release-it/conventional-changelog": "^2.0.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@types/jest": "^29.2.1",
@@ -94,7 +99,7 @@
     "pod-install": "^0.1.0",
     "prettier": "^2.8.8",
     "react": "18.3.1",
-    "react-native": "0.75.2",
+    "react-native": "0.75.3",
     "react-native-builder-bob": "^0.18.0",
     "react-native-reanimated": "3.15.0",
     "react-test-renderer": "18.2.0",

package/src/bindings.native.ts

@@ -6,6 +6,7 @@ import type {
   KeyboardControllerProps,
   KeyboardEventsModule,
   KeyboardGestureAreaProps,
+  OverKeyboardViewProps,
   WindowDimensionsEventsModule,
 } from "./types";
 
@@ -56,3 +57,5 @@ export const KeyboardGestureArea: React.FC<KeyboardGestureAreaProps> =
   Platform.OS === "android" && Platform.Version >= 30
     ? require("./specs/KeyboardGestureAreaNativeComponent").default
     : ({ children }: KeyboardGestureAreaProps) => children;
+export const RCTOverKeyboardView: React.FC<OverKeyboardViewProps> =
+  require("./specs/OverKeyboardViewNativeComponent").default;

package/src/bindings.ts

@@ -6,6 +6,7 @@ import type {
   KeyboardControllerProps,
   KeyboardEventsModule,
   KeyboardGestureAreaProps,
+  OverKeyboardViewProps,
   WindowDimensionsEventsModule,
 } from "./types";
 import type { EmitterSubscription } from "react-native";
@@ -37,3 +38,5 @@ export const KeyboardControllerView =
   View as unknown as React.FC<KeyboardControllerProps>;
 export const KeyboardGestureArea =
   View as unknown as React.FC<KeyboardGestureAreaProps>;
+export const RCTOverKeyboardView =
+  View as unknown as React.FC<OverKeyboardViewProps>;

package/src/components/KeyboardAwareScrollView/index.tsx

@@ -38,6 +38,8 @@ export type KeyboardAwareScrollViewProps = {
   enabled?: boolean;
   /** Adjusting the bottom spacing of KeyboardAwareScrollView. Default is `0` */
   extraKeyboardSpace?: number;
+  /** Custom component for `ScrollView`. Default is `ScrollView` */
+  ScrollViewComponent?: React.ComponentType<ScrollViewProps>;
 } & ScrollViewProps;
 
 /*
@@ -90,6 +92,7 @@ const KeyboardAwareScrollView = forwardRef<
       disableScrollOnKeyboardHide = false,
       enabled = true,
       extraKeyboardSpace = 0,
+      ScrollViewComponent = Reanimated.ScrollView,
       snapToOffsets,
       ...rest
     },
@@ -362,7 +365,7 @@ const KeyboardAwareScrollView = forwardRef<
     );
 
     return (
-      <Reanimated.ScrollView
+      <ScrollViewComponent
         ref={onRef}
         {...rest}
         scrollEventThrottle={16}
@@ -370,7 +373,7 @@ const KeyboardAwareScrollView = forwardRef<
       >
         {children}
         <Reanimated.View style={view} />
-      </Reanimated.ScrollView>
+      </ScrollViewComponent>
     );
   },
 );

package/src/components/KeyboardToolbar/index.tsx

@@ -11,9 +11,12 @@ import { colors } from "./colors";
 
 import type { HEX, KeyboardToolbarTheme } from "./types";
 import type { ReactNode } from "react";
-import type { GestureResponderEvent } from "react-native";
+import type { GestureResponderEvent, ViewProps } from "react-native";
 
-export type KeyboardToolbarProps = {
+export type KeyboardToolbarProps = Omit<
+  ViewProps,
+  "style" | "testID" | "children"
+> & {
   /** An element that is shown in the middle of the toolbar. */
   content?: JSX.Element | null;
   /** A set of dark/light colors consumed by toolbar component. */
@@ -81,6 +84,7 @@ const KeyboardToolbar: React.FC<KeyboardToolbarProps> = ({
   onDoneCallback,
   blur = null,
   opacity = DEFAULT_OPACITY,
+  ...rest
 }) => {
   const colorScheme = useColorScheme();
   const [inputs, setInputs] = useState({
@@ -146,7 +150,7 @@ const KeyboardToolbar: React.FC<KeyboardToolbarProps> = ({
 
   return (
     <KeyboardStickyView offset={offset}>
-      <View style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>
+      <View {...rest} style={toolbarStyle} testID={TEST_ID_KEYBOARD_TOOLBAR}>
         {blur}
         {showArrows && (
           <>

package/src/index.ts

@@ -19,3 +19,4 @@ export type {
   KeyboardAwareScrollViewProps,
   KeyboardToolbarProps,
 } from "./components";
+export { OverKeyboardView } from "./views";

package/src/specs/OverKeyboardViewNativeComponent.ts

@@ -0,0 +1,12 @@
+import codegenNativeComponent from "react-native/Libraries/Utilities/codegenNativeComponent";
+
+import type { HostComponent } from "react-native";
+import type { ViewProps } from "react-native/Libraries/Components/View/ViewPropTypes";
+
+export interface NativeProps extends ViewProps {
+  visible?: boolean;
+}
+
+export default codegenNativeComponent<NativeProps>(
+  "OverKeyboardView",
+) as HostComponent<NativeProps>;

package/src/types.ts

@@ -1,3 +1,4 @@
+import type { PropsWithChildren } from "react";
 import type {
   EmitterSubscription,
   NativeSyntheticEvent,
@@ -108,6 +109,9 @@ export type KeyboardGestureAreaProps = {
    */
   offset?: number;
 } & ViewProps;
+export type OverKeyboardViewProps = PropsWithChildren<{
+  visible: boolean;
+}>;
 
 export type Direction = "next" | "prev" | "current";
 export type KeyboardControllerModule = {

package/src/views/OverKeyboardView/index.tsx

@@ -0,0 +1,43 @@
+import React, { useMemo } from "react";
+import { Platform, StyleSheet, View } from "react-native";
+
+import { RCTOverKeyboardView } from "../../bindings";
+import { useWindowDimensions } from "../../hooks";
+
+import type { OverKeyboardViewProps } from "../../types";
+import type { PropsWithChildren } from "react";
+
+const OverKeyboardView = ({
+  children,
+  visible,
+}: PropsWithChildren<OverKeyboardViewProps>) => {
+  const { height, width } = useWindowDimensions();
+  const inner = useMemo(() => ({ height, width }), [height, width]);
+  const style = useMemo(
+    () => [
+      styles.absolute,
+      // On iOS - stretch view to full window dimensions to make yoga work
+      // On Android Fabric we temporarily use the same approach
+      // @ts-expect-error `_IS_FABRIC` is injected by REA
+      Platform.OS === "ios" || global._IS_FABRIC ? inner : undefined,
+    ],
+    [inner],
+  );
+
+  return (
+    <RCTOverKeyboardView visible={visible}>
+      {/* `OverKeyboardView` should always have a single child */}
+      <View collapsable={false} style={style}>
+        {children}
+      </View>
+    </RCTOverKeyboardView>
+  );
+};
+
+const styles = StyleSheet.create({
+  absolute: {
+    position: "absolute",
+  },
+});
+
+export default OverKeyboardView;

package/src/views/index.ts

@@ -0,0 +1 @@
+export { default as OverKeyboardView } from "./OverKeyboardView";

package/ios/.clang-format

@@ -1,90 +0,0 @@
----
-AccessModifierOffset: -1
-AlignAfterOpenBracket: AlwaysBreak
-AlignConsecutiveAssignments: false
-AlignConsecutiveDeclarations: false
-AlignEscapedNewlinesLeft: true
-AlignOperands: false
-AlignTrailingComments: false
-AllowAllParametersOfDeclarationOnNextLine: false
-AllowShortBlocksOnASingleLine: false
-AllowShortCaseLabelsOnASingleLine: false
-AllowShortFunctionsOnASingleLine: Empty
-AllowShortIfStatementsOnASingleLine: false
-AllowShortLoopsOnASingleLine: false
-AlwaysBreakAfterReturnType: None
-AlwaysBreakBeforeMultilineStrings: true
-AlwaysBreakTemplateDeclarations: true
-BinPackArguments: false
-BinPackParameters: false
-BraceWrapping:
-  AfterClass: false
-  AfterControlStatement: false
-  AfterEnum: false
-  AfterFunction: false
-  AfterNamespace: false
-  AfterObjCDeclaration: false
-  AfterStruct: false
-  AfterUnion: false
-  BeforeCatch: false
-  BeforeElse: false
-  IndentBraces: false
-BreakBeforeBinaryOperators: None
-BreakBeforeBraces: Attach
-BreakBeforeTernaryOperators: true
-BreakConstructorInitializersBeforeComma: false
-BreakAfterJavaFieldAnnotations: false
-BreakStringLiterals: false
-ColumnLimit: 80
-CommentPragmas: "^ IWYU pragma:"
-ConstructorInitializerAllOnOneLineOrOnePerLine: true
-ConstructorInitializerIndentWidth: 4
-ContinuationIndentWidth: 4
-Cpp11BracedListStyle: true
-DerivePointerAlignment: false
-DisableFormat: false
-ForEachMacros: [FOR_EACH_RANGE, FOR_EACH]
-IncludeCategories:
-  - Regex: '^<.*\.h(pp)?>'
-    Priority: 1
-  - Regex: "^<.*"
-    Priority: 2
-  - Regex: ".*"
-    Priority: 3
-IndentCaseLabels: true
-IndentWidth: 2
-IndentWrappedFunctionNames: false
-KeepEmptyLinesAtTheStartOfBlocks: false
-MacroBlockBegin: ""
-MacroBlockEnd: ""
-MaxEmptyLinesToKeep: 1
-NamespaceIndentation: None
-ObjCBlockIndentWidth: 2
-ObjCSpaceAfterProperty: true
-ObjCSpaceBeforeProtocolList: true
-PenaltyBreakBeforeFirstCallParameter: 1
-PenaltyBreakComment: 300
-PenaltyBreakFirstLessLess: 120
-PenaltyBreakString: 1000
-PenaltyExcessCharacter: 1000000
-PenaltyReturnTypeOnItsOwnLine: 200
-PointerAlignment: Right
-ReflowComments: true
-SortIncludes: true
-SpaceAfterCStyleCast: false
-SpaceBeforeAssignmentOperators: true
-SpaceBeforeParens: ControlStatements
-SpaceInEmptyParentheses: false
-SpacesBeforeTrailingComments: 1
-SpacesInAngles: false
-SpacesInContainerLiterals: true
-SpacesInCStyleCastParentheses: false
-SpacesInParentheses: false
-SpacesInSquareBrackets: false
-Standard: Cpp11
-TabWidth: 8
-UseTab: Never
----
-Language: ObjC
-ColumnLimit: 100
-BreakBeforeBraces: WebKit

package/ios/.swiftformat

@@ -1,5 +0,0 @@
---indent 2
-
---disable redundantReturn
-
---exclude Pods,Generated

package/ios/.swiftlint.yml

@@ -1,14 +0,0 @@
-disabled_rules:
-  - trailing_comma
-  - for_where
-
-line_length:
-  warning: 120
-  ignores_urls: true
-
-identifier_name:
-  excluded:
-    - i # allow `i` variable in cycles
-
-excluded:
-  - Pods