@applicaster/quick-brick-core 15.1.13-alpha.1034774223 → 15.1.13
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.
- package/App/ModalProvider/ModalBottomSheet/ModalBottomSheetFrame.tsx +2 -9
- package/App/ModalProvider/ModalBottomSheet/index.tsx +2 -5
- package/package.json +8 -8
- package/App/ModalProvider/ModalBottomSheet/hooks/__tests__/useKeyboardHeight.android.test.ts +0 -105
- package/App/ModalProvider/ModalBottomSheet/hooks/__tests__/useKeyboardHeight.test.ts +0 -102
- package/App/ModalProvider/ModalBottomSheet/hooks/index.ts +0 -1
- package/App/ModalProvider/ModalBottomSheet/hooks/useKeyboardHeight.ts +0 -30
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import { LayoutChangeEvent, StyleSheet, View } from "react-native";
|
|
2
|
+
import { LayoutChangeEvent, Platform, StyleSheet, View } from "react-native";
|
|
3
3
|
|
|
4
4
|
import { Handle, HandleProps } from "./Handle";
|
|
5
5
|
import { DraggableBottomSheet } from "./DraggableBottomSheet";
|
|
@@ -11,12 +11,9 @@ import {
|
|
|
11
11
|
import {
|
|
12
12
|
isAndroidPlatform,
|
|
13
13
|
isAndroidVersionAtLeast,
|
|
14
|
-
isApplePlatform,
|
|
15
14
|
platformSelect,
|
|
16
15
|
} from "@applicaster/zapp-react-native-utils/reactUtils";
|
|
17
16
|
|
|
18
|
-
import { useKeyboardHeight } from "./hooks";
|
|
19
|
-
|
|
20
17
|
type Props = {
|
|
21
18
|
children: React.ReactChild;
|
|
22
19
|
backgroundColor: string;
|
|
@@ -107,8 +104,6 @@ export function ModalBottomSheetFrame(props: Props) {
|
|
|
107
104
|
|
|
108
105
|
const sheetHeight = useGetSheetHeight(height, maxHeight);
|
|
109
106
|
|
|
110
|
-
const keyboardHeight = useKeyboardHeight();
|
|
111
|
-
|
|
112
107
|
return (
|
|
113
108
|
<DraggableBottomSheet
|
|
114
109
|
sheetHeight={sheetHeight}
|
|
@@ -118,9 +113,7 @@ export function ModalBottomSheetFrame(props: Props) {
|
|
|
118
113
|
header={(dragging) => <Handle {...handleProps} focused={dragging} />}
|
|
119
114
|
maxWidth={maxWidth}
|
|
120
115
|
{...dimensions}
|
|
121
|
-
height={
|
|
122
|
-
safeAreaDims.height - (isApplePlatform() ? bottom : 0) - keyboardHeight
|
|
123
|
-
}
|
|
116
|
+
height={safeAreaDims.height - (Platform.OS === "ios" ? bottom : 0)}
|
|
124
117
|
>
|
|
125
118
|
<SafeAreaView
|
|
126
119
|
edges={["left", "right", "bottom"]}
|
|
@@ -47,11 +47,9 @@ export function ModalBottomSheet(props: Props) {
|
|
|
47
47
|
|
|
48
48
|
const {
|
|
49
49
|
ModalBottomSheetContent = ModalComponent,
|
|
50
|
-
modalBottomSheetContentProps
|
|
50
|
+
modalBottomSheetContentProps,
|
|
51
51
|
} = props;
|
|
52
52
|
|
|
53
|
-
const { key, ...restContentProps } = modalBottomSheetContentProps;
|
|
54
|
-
|
|
55
53
|
useEffect(() => {
|
|
56
54
|
Keyboard.dismiss();
|
|
57
55
|
}, []);
|
|
@@ -84,12 +82,11 @@ export function ModalBottomSheet(props: Props) {
|
|
|
84
82
|
}}
|
|
85
83
|
>
|
|
86
84
|
<ModalBottomSheetContent
|
|
87
|
-
key={key as any}
|
|
88
85
|
width={
|
|
89
86
|
Math.min(sheetTabletMaxWidth, dimensions.width) || dimensions.width
|
|
90
87
|
}
|
|
91
88
|
maxHeight={sheetMaxHeight}
|
|
92
|
-
{...
|
|
89
|
+
{...modalBottomSheetContentProps}
|
|
93
90
|
dismiss={dismiss}
|
|
94
91
|
currentRoute={navigator.currentRoute}
|
|
95
92
|
/>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@applicaster/quick-brick-core",
|
|
3
|
-
"version": "15.1.13
|
|
3
|
+
"version": "15.1.13",
|
|
4
4
|
"description": "Core package for Applicaster's Quick Brick App",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"types": "index.d.ts",
|
|
@@ -28,13 +28,13 @@
|
|
|
28
28
|
},
|
|
29
29
|
"homepage": "https://github.com/applicaster/quickbrick#readme",
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@applicaster/applicaster-types": "15.1.13
|
|
32
|
-
"@applicaster/quick-brick-core-plugins": "15.1.13
|
|
33
|
-
"@applicaster/zapp-pipes-v2-client": "15.1.13
|
|
34
|
-
"@applicaster/zapp-react-native-bridge": "15.1.13
|
|
35
|
-
"@applicaster/zapp-react-native-redux": "15.1.13
|
|
36
|
-
"@applicaster/zapp-react-native-ui-components": "15.1.13
|
|
37
|
-
"@applicaster/zapp-react-native-utils": "15.1.13
|
|
31
|
+
"@applicaster/applicaster-types": "15.1.13",
|
|
32
|
+
"@applicaster/quick-brick-core-plugins": "15.1.13",
|
|
33
|
+
"@applicaster/zapp-pipes-v2-client": "15.1.13",
|
|
34
|
+
"@applicaster/zapp-react-native-bridge": "15.1.13",
|
|
35
|
+
"@applicaster/zapp-react-native-redux": "15.1.13",
|
|
36
|
+
"@applicaster/zapp-react-native-ui-components": "15.1.13",
|
|
37
|
+
"@applicaster/zapp-react-native-utils": "15.1.13",
|
|
38
38
|
"atob": "^2.1.2",
|
|
39
39
|
"axios": "^0.28.0",
|
|
40
40
|
"btoa": "^1.2.1",
|
package/App/ModalProvider/ModalBottomSheet/hooks/__tests__/useKeyboardHeight.android.test.ts
DELETED
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import { act, renderHook } from "@testing-library/react-native";
|
|
2
|
-
import { Keyboard } from "react-native";
|
|
3
|
-
|
|
4
|
-
jest.mock("@applicaster/zapp-react-native-utils/reactUtils", () => ({
|
|
5
|
-
isApplePlatform: () => false,
|
|
6
|
-
}));
|
|
7
|
-
|
|
8
|
-
// Import after mocks so module-level isApple resolves to false.
|
|
9
|
-
// eslint-disable-next-line import/first
|
|
10
|
-
import { useKeyboardHeight } from "../useKeyboardHeight";
|
|
11
|
-
|
|
12
|
-
type KeyboardListener = (event?: {
|
|
13
|
-
endCoordinates: { height: number };
|
|
14
|
-
}) => void;
|
|
15
|
-
|
|
16
|
-
function setupKeyboardListenerMock() {
|
|
17
|
-
const listeners: Record<string, KeyboardListener> = {};
|
|
18
|
-
const removeMocks: Record<string, jest.Mock> = {};
|
|
19
|
-
|
|
20
|
-
const addListenerSpy = jest
|
|
21
|
-
.spyOn(Keyboard, "addListener")
|
|
22
|
-
.mockImplementation((event: string, callback: KeyboardListener) => {
|
|
23
|
-
listeners[event] = callback;
|
|
24
|
-
|
|
25
|
-
const remove = jest.fn();
|
|
26
|
-
removeMocks[event] = remove;
|
|
27
|
-
|
|
28
|
-
return { remove };
|
|
29
|
-
});
|
|
30
|
-
|
|
31
|
-
return { listeners, removeMocks, addListenerSpy };
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
describe("useKeyboardHeight (non-Apple platforms)", () => {
|
|
35
|
-
let listeners: Record<string, KeyboardListener>;
|
|
36
|
-
let removeMocks: Record<string, jest.Mock>;
|
|
37
|
-
let addListenerSpy: jest.SpyInstance;
|
|
38
|
-
|
|
39
|
-
beforeEach(() => {
|
|
40
|
-
const mock = setupKeyboardListenerMock();
|
|
41
|
-
listeners = mock.listeners;
|
|
42
|
-
removeMocks = mock.removeMocks;
|
|
43
|
-
addListenerSpy = mock.addListenerSpy;
|
|
44
|
-
});
|
|
45
|
-
|
|
46
|
-
afterEach(() => {
|
|
47
|
-
addListenerSpy.mockRestore();
|
|
48
|
-
});
|
|
49
|
-
|
|
50
|
-
it("returns 0 initially and subscribes to didShow / didHide events", () => {
|
|
51
|
-
const { result } = renderHook(() => useKeyboardHeight());
|
|
52
|
-
|
|
53
|
-
expect(result.current).toBe(0);
|
|
54
|
-
expect(addListenerSpy).toHaveBeenCalledTimes(2);
|
|
55
|
-
|
|
56
|
-
expect(addListenerSpy).toHaveBeenCalledWith(
|
|
57
|
-
"keyboardDidShow",
|
|
58
|
-
expect.any(Function)
|
|
59
|
-
);
|
|
60
|
-
|
|
61
|
-
expect(addListenerSpy).toHaveBeenCalledWith(
|
|
62
|
-
"keyboardDidHide",
|
|
63
|
-
expect.any(Function)
|
|
64
|
-
);
|
|
65
|
-
});
|
|
66
|
-
|
|
67
|
-
it("updates height when keyboardDidShow fires", () => {
|
|
68
|
-
const { result } = renderHook(() => useKeyboardHeight());
|
|
69
|
-
|
|
70
|
-
act(() => {
|
|
71
|
-
listeners.keyboardDidShow?.({
|
|
72
|
-
endCoordinates: { height: 412 },
|
|
73
|
-
});
|
|
74
|
-
});
|
|
75
|
-
|
|
76
|
-
expect(result.current).toBe(412);
|
|
77
|
-
});
|
|
78
|
-
|
|
79
|
-
it("resets height to 0 when keyboardDidHide fires", () => {
|
|
80
|
-
const { result } = renderHook(() => useKeyboardHeight());
|
|
81
|
-
|
|
82
|
-
act(() => {
|
|
83
|
-
listeners.keyboardDidShow?.({
|
|
84
|
-
endCoordinates: { height: 412 },
|
|
85
|
-
});
|
|
86
|
-
});
|
|
87
|
-
|
|
88
|
-
expect(result.current).toBe(412);
|
|
89
|
-
|
|
90
|
-
act(() => {
|
|
91
|
-
listeners.keyboardDidHide?.();
|
|
92
|
-
});
|
|
93
|
-
|
|
94
|
-
expect(result.current).toBe(0);
|
|
95
|
-
});
|
|
96
|
-
|
|
97
|
-
it("removes listeners on unmount", () => {
|
|
98
|
-
const { unmount } = renderHook(() => useKeyboardHeight());
|
|
99
|
-
|
|
100
|
-
unmount();
|
|
101
|
-
|
|
102
|
-
expect(removeMocks.keyboardDidShow).toHaveBeenCalledTimes(1);
|
|
103
|
-
expect(removeMocks.keyboardDidHide).toHaveBeenCalledTimes(1);
|
|
104
|
-
});
|
|
105
|
-
});
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import { act, renderHook } from "@testing-library/react-native";
|
|
2
|
-
import { Keyboard } from "react-native";
|
|
3
|
-
import { useKeyboardHeight } from "../useKeyboardHeight";
|
|
4
|
-
|
|
5
|
-
jest.mock("@applicaster/zapp-react-native-utils/reactUtils", () => ({
|
|
6
|
-
isApplePlatform: () => true,
|
|
7
|
-
}));
|
|
8
|
-
|
|
9
|
-
type KeyboardListener = (event?: {
|
|
10
|
-
endCoordinates: { height: number };
|
|
11
|
-
}) => void;
|
|
12
|
-
|
|
13
|
-
function setupKeyboardListenerMock() {
|
|
14
|
-
const listeners: Record<string, KeyboardListener> = {};
|
|
15
|
-
const removeMocks: Record<string, jest.Mock> = {};
|
|
16
|
-
|
|
17
|
-
const addListenerSpy = jest
|
|
18
|
-
.spyOn(Keyboard, "addListener")
|
|
19
|
-
.mockImplementation((event: string, callback: KeyboardListener) => {
|
|
20
|
-
listeners[event] = callback;
|
|
21
|
-
|
|
22
|
-
const remove = jest.fn();
|
|
23
|
-
removeMocks[event] = remove;
|
|
24
|
-
|
|
25
|
-
return { remove };
|
|
26
|
-
});
|
|
27
|
-
|
|
28
|
-
return { listeners, removeMocks, addListenerSpy };
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
describe("useKeyboardHeight (Apple platforms)", () => {
|
|
32
|
-
let listeners: Record<string, KeyboardListener>;
|
|
33
|
-
let removeMocks: Record<string, jest.Mock>;
|
|
34
|
-
let addListenerSpy: jest.SpyInstance;
|
|
35
|
-
|
|
36
|
-
beforeEach(() => {
|
|
37
|
-
const mock = setupKeyboardListenerMock();
|
|
38
|
-
listeners = mock.listeners;
|
|
39
|
-
removeMocks = mock.removeMocks;
|
|
40
|
-
addListenerSpy = mock.addListenerSpy;
|
|
41
|
-
});
|
|
42
|
-
|
|
43
|
-
afterEach(() => {
|
|
44
|
-
addListenerSpy.mockRestore();
|
|
45
|
-
});
|
|
46
|
-
|
|
47
|
-
it("returns 0 initially and subscribes to willShow / willHide events", () => {
|
|
48
|
-
const { result } = renderHook(() => useKeyboardHeight());
|
|
49
|
-
|
|
50
|
-
expect(result.current).toBe(0);
|
|
51
|
-
expect(addListenerSpy).toHaveBeenCalledTimes(2);
|
|
52
|
-
|
|
53
|
-
expect(addListenerSpy).toHaveBeenCalledWith(
|
|
54
|
-
"keyboardWillShow",
|
|
55
|
-
expect.any(Function)
|
|
56
|
-
);
|
|
57
|
-
|
|
58
|
-
expect(addListenerSpy).toHaveBeenCalledWith(
|
|
59
|
-
"keyboardWillHide",
|
|
60
|
-
expect.any(Function)
|
|
61
|
-
);
|
|
62
|
-
});
|
|
63
|
-
|
|
64
|
-
it("updates height when keyboardWillShow fires", () => {
|
|
65
|
-
const { result } = renderHook(() => useKeyboardHeight());
|
|
66
|
-
|
|
67
|
-
act(() => {
|
|
68
|
-
listeners.keyboardWillShow?.({
|
|
69
|
-
endCoordinates: { height: 336 },
|
|
70
|
-
});
|
|
71
|
-
});
|
|
72
|
-
|
|
73
|
-
expect(result.current).toBe(336);
|
|
74
|
-
});
|
|
75
|
-
|
|
76
|
-
it("resets height to 0 when keyboardWillHide fires", () => {
|
|
77
|
-
const { result } = renderHook(() => useKeyboardHeight());
|
|
78
|
-
|
|
79
|
-
act(() => {
|
|
80
|
-
listeners.keyboardWillShow?.({
|
|
81
|
-
endCoordinates: { height: 280 },
|
|
82
|
-
});
|
|
83
|
-
});
|
|
84
|
-
|
|
85
|
-
expect(result.current).toBe(280);
|
|
86
|
-
|
|
87
|
-
act(() => {
|
|
88
|
-
listeners.keyboardWillHide?.();
|
|
89
|
-
});
|
|
90
|
-
|
|
91
|
-
expect(result.current).toBe(0);
|
|
92
|
-
});
|
|
93
|
-
|
|
94
|
-
it("removes listeners on unmount", () => {
|
|
95
|
-
const { unmount } = renderHook(() => useKeyboardHeight());
|
|
96
|
-
|
|
97
|
-
unmount();
|
|
98
|
-
|
|
99
|
-
expect(removeMocks.keyboardWillShow).toHaveBeenCalledTimes(1);
|
|
100
|
-
expect(removeMocks.keyboardWillHide).toHaveBeenCalledTimes(1);
|
|
101
|
-
});
|
|
102
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { useKeyboardHeight } from "./useKeyboardHeight";
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Keyboard, KeyboardEvent } from "react-native";
|
|
3
|
-
import { isApplePlatform } from "@applicaster/zapp-react-native-utils/reactUtils";
|
|
4
|
-
|
|
5
|
-
const isApple = isApplePlatform();
|
|
6
|
-
|
|
7
|
-
export function useKeyboardHeight() {
|
|
8
|
-
const [keyboardHeight, setKeyboardHeight] = React.useState(0);
|
|
9
|
-
|
|
10
|
-
React.useEffect(() => {
|
|
11
|
-
// iOS supports smooth 'willShow' / 'willHide' events
|
|
12
|
-
const showEvent = isApple ? "keyboardWillShow" : "keyboardDidShow";
|
|
13
|
-
const hideEvent = isApple ? "keyboardWillHide" : "keyboardDidHide";
|
|
14
|
-
|
|
15
|
-
const showListener = Keyboard.addListener(showEvent, (e: KeyboardEvent) => {
|
|
16
|
-
setKeyboardHeight(e.endCoordinates.height);
|
|
17
|
-
});
|
|
18
|
-
|
|
19
|
-
const hideListener = Keyboard.addListener(hideEvent, () => {
|
|
20
|
-
setKeyboardHeight(0);
|
|
21
|
-
});
|
|
22
|
-
|
|
23
|
-
return () => {
|
|
24
|
-
showListener.remove();
|
|
25
|
-
hideListener.remove();
|
|
26
|
-
};
|
|
27
|
-
}, []);
|
|
28
|
-
|
|
29
|
-
return keyboardHeight;
|
|
30
|
-
}
|