Skip to content

Commit f5dca3c

Browse files
kirillzyuskokirillzyusko
authored
fix: KeyboardAvoidingView types union (#1354)
## 📜 Description Removed union type for `KeyboardAvodiingView`. ## 💡 Motivation and Context Initially I thought that changes in #711 are cool, but in reality it causes more headache to devs because TS not always can understand which behavior passed etc. So after all attempts the easiest option is to remove conditional types. Closes #1340 ## 📢 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 - don't use union types for `KeyboardAvoidingView` as it causes many TS errors where code is valid; ### Example - ported automatic mode to FabricExample project; - moved options to separate file; ## 🤔 How Has This Been Tested? Tested manually on iPhone 17 Pro (iOS 26.2). ## 📝 Checklist - [x] CI successfully passed - [x] I added new mocks and corresponding unit-tests if library API was changed
1 parent adecf61 commit f5dca3c

9 files changed

Lines changed: 426 additions & 215 deletions

File tree

‎FabricExample/src/constants/screenNames.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ export enum ScreenNames {
1515
NATIVE_STACK = "NATIVE_STACK",
1616
NATIVE = "NATIVE",
1717
KEYBOARD_AVOIDING_VIEW = "KEYBOARD_AVOIDING_VIEW",
18+
KEYBOARD_AVOIDING_VIEW_AUTOMATIC = "KEYBOARD_AVOIDING_VIEW_AUTOMATIC",
1819
ENABLED_DISABLED = "ENABLED_DISABLED",
1920
CLOSE = "CLOSE",
2021
FOCUSED_INPUT_HANDLERS = "FOCUSED_INPUT_HANDLERS",

‎FabricExample/src/navigation/ExamplesStack/index.tsx‎

Lines changed: 9 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import InteractiveKeyboard from "../../screens/Examples/InteractiveKeyboard";
1414
import InteractiveKeyboardIOS from "../../screens/Examples/InteractiveKeyboardIOS";
1515
import KeyboardAnimation from "../../screens/Examples/KeyboardAnimation";
1616
import KeyboardAvoidingViewExample from "../../screens/Examples/KeyboardAvoidingView";
17+
import KeyboardAvoidingViewAutomaticExample from "../../screens/Examples/KeyboardAvoidingViewAutomatic";
1718
import KeyboardChatScrollViewPlayground from "../../screens/Examples/KeyboardChatScrollView";
1819
import KeyboardExtender from "../../screens/Examples/KeyboardExtender";
1920
import KeyboardSharedTransitionExample from "../../screens/Examples/KeyboardSharedTransitions";
@@ -30,6 +31,8 @@ import ToolbarExample from "../../screens/Examples/Toolbar";
3031
import BottomTabBar from "../BottomTabBar";
3132
import NativeStack from "../NestedStack";
3233

34+
import { options } from "./options";
35+
3336
export type ExamplesStackParamList = {
3437
[ScreenNames.ANIMATED_EXAMPLE]: undefined;
3538
[ScreenNames.REANIMATED_CHAT]: undefined;
@@ -44,6 +47,7 @@ export type ExamplesStackParamList = {
4447
[ScreenNames.INTERACTIVE_KEYBOARD_IOS]: undefined;
4548
[ScreenNames.NATIVE_STACK]: undefined;
4649
[ScreenNames.KEYBOARD_AVOIDING_VIEW]: undefined;
50+
[ScreenNames.KEYBOARD_AVOIDING_VIEW_AUTOMATIC]: undefined;
4751
[ScreenNames.ENABLED_DISABLED]: undefined;
4852
[ScreenNames.CLOSE]: undefined;
4953
[ScreenNames.FOCUSED_INPUT_HANDLERS]: undefined;
@@ -62,99 +66,6 @@ export type ExamplesStackParamList = {
6266

6367
const Stack = createStackNavigator<ExamplesStackParamList>();
6468

65-
const options = {
66-
[ScreenNames.ANIMATED_EXAMPLE]: {
67-
title: "Keyboard animation ⌨️",
68-
},
69-
[ScreenNames.REANIMATED_CHAT]: {
70-
title: "Chat",
71-
},
72-
[ScreenNames.REANIMATED_CHAT_FLAT_LIST]: {
73-
title: "Chat FlatList",
74-
},
75-
[ScreenNames.EVENTS]: {
76-
title: "Events",
77-
},
78-
[ScreenNames.AWARE_SCROLL_VIEW]: {
79-
title: "Aware scroll view",
80-
},
81-
[ScreenNames.AWARE_SCROLL_VIEW_STICKY_FOOTER]: {
82-
title: "Aware scroll view sticky footer",
83-
},
84-
[ScreenNames.STATUS_BAR]: {
85-
headerShown: false,
86-
title: "Status bar manipulation",
87-
},
88-
[ScreenNames.LOTTIE]: {
89-
title: "Lottie animation",
90-
},
91-
[ScreenNames.NON_UI_PROPS]: {
92-
title: "Non UI Props",
93-
},
94-
[ScreenNames.INTERACTIVE_KEYBOARD]: {
95-
title: "Interactive keyboard",
96-
},
97-
[ScreenNames.INTERACTIVE_KEYBOARD_IOS]: {
98-
title: "Interactive keyboard 🍏",
99-
},
100-
[ScreenNames.NATIVE_STACK]: {
101-
title: "Native stack",
102-
},
103-
[ScreenNames.KEYBOARD_AVOIDING_VIEW]: {
104-
title: "KAV",
105-
},
106-
[ScreenNames.ENABLED_DISABLED]: {
107-
title: "Enabled/disabled",
108-
},
109-
[ScreenNames.CLOSE]: {
110-
title: "Close keyboard",
111-
},
112-
[ScreenNames.FOCUSED_INPUT_HANDLERS]: {
113-
title: "Focused input handlers",
114-
},
115-
[ScreenNames.TOOLBAR]: {
116-
title: "Toolbar",
117-
},
118-
[ScreenNames.MODAL]: {
119-
title: "Modal",
120-
},
121-
[ScreenNames.BOTTOM_TAB_BAR]: {
122-
headerShown: false,
123-
},
124-
[ScreenNames.OVER_KEYBOARD_VIEW]: {
125-
title: "View over keyboard",
126-
},
127-
[ScreenNames.IMAGE_GALLERY]: {
128-
title: "Image gallery",
129-
},
130-
[ScreenNames.USE_KEYBOARD_STATE]: {
131-
title: "useKeyboardState",
132-
},
133-
[ScreenNames.LIQUID_KEYBOARD]: {
134-
title: "Liquid keyboard",
135-
headerShown: false,
136-
},
137-
[ScreenNames.KEYBOARD_SHARED_TRANSITIONS]: {
138-
title: "Keyboard shared transitions",
139-
headerShown: false,
140-
},
141-
[ScreenNames.KEYBOARD_EXTENDER]: {
142-
title: "Keyboard Extender",
143-
headerShown: false,
144-
},
145-
[ScreenNames.CHAT_KIT]: {
146-
title: "Chat Kit",
147-
headerTintColor: "#fff",
148-
headerStyle: {
149-
backgroundColor: "#3A3A3C",
150-
},
151-
headerBackTitle: "Back",
152-
},
153-
[ScreenNames.AI_LEGEND_LIST_CHAT]: {
154-
title: "AI LegendList Chat",
155-
},
156-
};
157-
15869
const ExamplesStack = () => (
15970
<Stack.Navigator>
16071
<Stack.Screen
@@ -222,6 +133,11 @@ const ExamplesStack = () => (
222133
name={ScreenNames.KEYBOARD_AVOIDING_VIEW}
223134
options={options[ScreenNames.KEYBOARD_AVOIDING_VIEW]}
224135
/>
136+
<Stack.Screen
137+
component={KeyboardAvoidingViewAutomaticExample}
138+
name={ScreenNames.KEYBOARD_AVOIDING_VIEW_AUTOMATIC}
139+
options={options[ScreenNames.KEYBOARD_AVOIDING_VIEW_AUTOMATIC]}
140+
/>
225141
<Stack.Screen
226142
component={EnabledDisabled}
227143
name={ScreenNames.ENABLED_DISABLED}

‎FabricExample/src/navigation/ExamplesStack/options.ts‎

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
import { ScreenNames } from "../../constants/screenNames";
2+
3+
export const options = {
4+
[ScreenNames.ANIMATED_EXAMPLE]: {
5+
title: "Keyboard animation ⌨️",
6+
},
7+
[ScreenNames.REANIMATED_CHAT]: {
8+
title: "Chat",
9+
},
10+
[ScreenNames.REANIMATED_CHAT_FLAT_LIST]: {
11+
title: "Chat FlatList",
12+
},
13+
[ScreenNames.EVENTS]: {
14+
title: "Events",
15+
},
16+
[ScreenNames.AWARE_SCROLL_VIEW]: {
17+
title: "Aware scroll view",
18+
},
19+
[ScreenNames.AWARE_SCROLL_VIEW_STICKY_FOOTER]: {
20+
title: "Aware scroll view sticky footer",
21+
},
22+
[ScreenNames.STATUS_BAR]: {
23+
headerShown: false,
24+
title: "Status bar manipulation",
25+
},
26+
[ScreenNames.LOTTIE]: {
27+
title: "Lottie animation",
28+
},
29+
[ScreenNames.NON_UI_PROPS]: {
30+
title: "Non UI Props",
31+
},
32+
[ScreenNames.INTERACTIVE_KEYBOARD]: {
33+
title: "Interactive keyboard",
34+
},
35+
[ScreenNames.INTERACTIVE_KEYBOARD_IOS]: {
36+
title: "Interactive keyboard 🍏",
37+
},
38+
[ScreenNames.NATIVE_STACK]: {
39+
title: "Native stack",
40+
},
41+
[ScreenNames.KEYBOARD_AVOIDING_VIEW]: {
42+
title: "KAV",
43+
},
44+
[ScreenNames.KEYBOARD_AVOIDING_VIEW_AUTOMATIC]: {
45+
title: "KAV Automatic",
46+
},
47+
[ScreenNames.ENABLED_DISABLED]: {
48+
title: "Enabled/disabled",
49+
},
50+
[ScreenNames.CLOSE]: {
51+
title: "Close keyboard",
52+
},
53+
[ScreenNames.FOCUSED_INPUT_HANDLERS]: {
54+
title: "Focused input handlers",
55+
},
56+
[ScreenNames.TOOLBAR]: {
57+
title: "Toolbar",
58+
},
59+
[ScreenNames.MODAL]: {
60+
title: "Modal",
61+
},
62+
[ScreenNames.BOTTOM_TAB_BAR]: {
63+
headerShown: false,
64+
},
65+
[ScreenNames.OVER_KEYBOARD_VIEW]: {
66+
title: "View over keyboard",
67+
},
68+
[ScreenNames.IMAGE_GALLERY]: {
69+
title: "Image gallery",
70+
},
71+
[ScreenNames.USE_KEYBOARD_STATE]: {
72+
title: "useKeyboardState",
73+
},
74+
[ScreenNames.LIQUID_KEYBOARD]: {
75+
title: "Liquid keyboard",
76+
headerShown: false,
77+
},
78+
[ScreenNames.KEYBOARD_SHARED_TRANSITIONS]: {
79+
title: "Keyboard shared transitions",
80+
headerShown: false,
81+
},
82+
[ScreenNames.KEYBOARD_EXTENDER]: {
83+
title: "Keyboard Extender",
84+
headerShown: false,
85+
},
86+
[ScreenNames.CHAT_KIT]: {
87+
title: "Chat Kit",
88+
headerTintColor: "#fff",
89+
headerStyle: {
90+
backgroundColor: "#3A3A3C",
91+
},
92+
headerBackTitle: "Back",
93+
},
94+
[ScreenNames.AI_LEGEND_LIST_CHAT]: {
95+
title: "AI LegendList Chat",
96+
},
97+
};

0 commit comments

Comments
 (0)