From 5ded2a79d4af13db34be2d1c26904ba1d8647854 Mon Sep 17 00:00:00 2001
From: Kirill Zyusko <zyusko.kirik@gmail.com>
Date: Mon, 2 Dec 2024 16:24:40 +0100
Subject: [PATCH] refactor: conditional types for `KeyboardAvoidingView` (#711)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## 📜 Description

`contentContainerStyle` can be used only when `behavior="position"`.

## 💡 Motivation and Context

To eep people aware about that additionally I decided to specify
conditional TS types. Now people will get a warning if they specify this
property and don't specify behavior as `position`.

## 📢 Changelog

<!-- High level overview of important changes -->
<!-- For example: fixed status bar manipulation; added new types
declarations; -->
<!-- If your changes don't affect one of platform/language below - then
remove this platform/language -->

### JS

- add conditional types to `KeyboardAvoidingView`;

## 🤔 How Has This Been Tested?

Tested in example project.

## 📸 Screenshots (if appropriate):

### Forbidden

<img width="994" alt="image"
src="https://github.com/user-attachments/assets/b1cd85ae-c7ab-40b0-9079-847a35fca149">

### Allowed

<img width="785" alt="image"
src="https://github.com/user-attachments/assets/de6572a4-49ce-4462-9447-8649159f32bf">

## 📝 Checklist

- [x] CI successfully passed
- [x] I added new mocks and corresponding unit-tests if library API was
changed
---
 src/components/KeyboardAvoidingView/index.tsx | 38 +++++++++++++------
 1 file changed, 27 insertions(+), 11 deletions(-)

diff --git a/src/components/KeyboardAvoidingView/index.tsx b/src/components/KeyboardAvoidingView/index.tsx
index c8303c072..018f5b7bd 100644
--- a/src/components/KeyboardAvoidingView/index.tsx
+++ b/src/components/KeyboardAvoidingView/index.tsx
@@ -14,17 +14,7 @@ import { useKeyboardAnimation } from "./hooks";
 
 import type { LayoutRectangle, ViewProps } from "react-native";
 
-export type KeyboardAvoidingViewProps = {
-  /**
-   * Specify how to react to the presence of the keyboard.
-   */
-  behavior?: "height" | "position" | "padding";
-
-  /**
-   * Style of the content container when `behavior` is 'position'.
-   */
-  contentContainerStyle?: ViewProps["style"];
-
+export type KeyboardAvoidingViewBaseProps = {
   /**
    * Controls whether this `KeyboardAvoidingView` instance should take effect.
    * This is useful when more than one is on the screen. Defaults to true.
@@ -38,6 +28,32 @@ export type KeyboardAvoidingViewProps = {
   keyboardVerticalOffset?: number;
 } & ViewProps;
 
+export type KeyboardAvoidingViewProps = KeyboardAvoidingViewBaseProps &
+  (
+    | {
+        /**
+         * Specify how to react to the presence of the keyboard.
+         */
+        behavior?: "position";
+
+        /**
+         * Style of the content container when `behavior` is 'position'.
+         */
+        contentContainerStyle?: ViewProps["style"];
+      }
+    | {
+        /**
+         * Specify how to react to the presence of the keyboard.
+         */
+        behavior?: "height" | "padding";
+
+        /**
+         * `contentContainerStyle` is not allowed for these behaviors.
+         */
+        contentContainerStyle?: never;
+      }
+  );
+
 const defaultLayout: LayoutRectangle = {
   x: 0,
   y: 0,