react-native-drawer-layout 4.2.2 → 5.0.0-alpha.1
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/lib/module/utils/getDrawerWidth.js +8 -9
- package/lib/module/utils/getDrawerWidth.js.map +1 -1
- package/lib/module/views/Drawer.js +26 -6
- package/lib/module/views/Drawer.js.map +1 -1
- package/lib/module/views/Drawer.native.js +100 -50
- package/lib/module/views/Drawer.native.js.map +1 -1
- package/lib/module/views/Overlay.native.js +3 -2
- package/lib/module/views/Overlay.native.js.map +1 -1
- package/lib/typescript/src/types.d.ts +1 -13
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/utils/getDrawerWidth.d.ts +5 -8
- package/lib/typescript/src/utils/getDrawerWidth.d.ts.map +1 -1
- package/lib/typescript/src/views/Drawer.d.ts.map +1 -1
- package/lib/typescript/src/views/Drawer.native.d.ts +1 -1
- package/lib/typescript/src/views/Drawer.native.d.ts.map +1 -1
- package/lib/typescript/src/views/Overlay.native.d.ts.map +1 -1
- package/package.json +9 -12
- package/src/types.tsx +1 -9
- package/src/utils/getDrawerWidth.tsx +13 -11
- package/src/views/Drawer.native.tsx +147 -72
- package/src/views/Drawer.tsx +31 -9
- package/src/views/Overlay.native.tsx +3 -1
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { StyleSheet } from 'react-native';
|
|
4
3
|
const APPROX_APP_BAR_HEIGHT = 56;
|
|
5
4
|
const DEFAULT_DRAWER_WIDTH = 360;
|
|
6
5
|
|
|
@@ -11,18 +10,18 @@ const DEFAULT_DRAWER_WIDTH = 360;
|
|
|
11
10
|
*/
|
|
12
11
|
const DRAWER_DEFAULT_WIDTH_WEB = `min(calc(100% - ${APPROX_APP_BAR_HEIGHT}px), ${DEFAULT_DRAWER_WIDTH}px)`;
|
|
13
12
|
export function getDrawerWidthNative({
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
containerWidth,
|
|
14
|
+
customWidth
|
|
16
15
|
}) {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
16
|
+
'worklet';
|
|
17
|
+
|
|
18
|
+
const defaultWidth = containerWidth - APPROX_APP_BAR_HEIGHT <= 360 ? containerWidth - APPROX_APP_BAR_HEIGHT : DEFAULT_DRAWER_WIDTH;
|
|
19
|
+
const width = customWidth ?? defaultWidth;
|
|
21
20
|
if (typeof width === 'string' && width.endsWith('%')) {
|
|
22
21
|
// Try to calculate width if a percentage is given
|
|
23
22
|
const percentage = Number(width.replace(/%$/, ''));
|
|
24
23
|
if (Number.isFinite(percentage)) {
|
|
25
|
-
return
|
|
24
|
+
return containerWidth * (percentage / 100);
|
|
26
25
|
}
|
|
27
26
|
}
|
|
28
27
|
return typeof width === 'number' ? width : defaultWidth;
|
|
@@ -32,7 +31,7 @@ export function getDrawerWidthWeb({
|
|
|
32
31
|
}) {
|
|
33
32
|
const {
|
|
34
33
|
width
|
|
35
|
-
} =
|
|
34
|
+
} = drawerStyle;
|
|
36
35
|
if (typeof width === 'number') {
|
|
37
36
|
return `${width}px`;
|
|
38
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["APPROX_APP_BAR_HEIGHT","DEFAULT_DRAWER_WIDTH","DRAWER_DEFAULT_WIDTH_WEB","getDrawerWidthNative","containerWidth","customWidth","defaultWidth","width","endsWith","percentage","Number","replace","isFinite","getDrawerWidthWeb","drawerStyle"],"sourceRoot":"../../../src","sources":["utils/getDrawerWidth.tsx"],"mappings":";;AAEA,MAAMA,qBAAqB,GAAG,EAAE;AAChC,MAAMC,oBAAoB,GAAG,GAAG;;AAEhC;AACA;AACA;AACA;AACA;AACA,MAAMC,wBAAwB,GAAG,mBAAmBF,qBAAqB,QAAQC,oBAAoB,KAAK;AAE1G,OAAO,SAASE,oBAAoBA,CAAC;EACnCC,cAAc;EACdC;AAIF,CAAC,EAAE;EACD,SAAS;;EAET,MAAMC,YAAY,GAChBF,cAAc,GAAGJ,qBAAqB,IAAI,GAAG,GACzCI,cAAc,GAAGJ,qBAAqB,GACtCC,oBAAoB;EAE1B,MAAMM,KAAK,GAAGF,WAAW,IAAIC,YAAY;EAEzC,IAAI,OAAOC,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACC,QAAQ,CAAC,GAAG,CAAC,EAAE;IACpD;IACA,MAAMC,UAAU,GAAGC,MAAM,CAACH,KAAK,CAACI,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;IAElD,IAAID,MAAM,CAACE,QAAQ,CAACH,UAAU,CAAC,EAAE;MAC/B,OAAOL,cAAc,IAAIK,UAAU,GAAG,GAAG,CAAC;IAC5C;EACF;EAEA,OAAO,OAAOF,KAAK,KAAK,QAAQ,GAAGA,KAAK,GAAGD,YAAY;AACzD;AAEA,OAAO,SAASO,iBAAiBA,CAAC;EAChCC;AAGF,CAAC,EAAU;EACT,MAAM;IAAEP;EAAM,CAAC,GAAGO,WAAW;EAE7B,IAAI,OAAOP,KAAK,KAAK,QAAQ,EAAE;IAC7B,OAAO,GAAGA,KAAK,IAAI;EACrB;EAEA,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IAC7B,OAAOA,KAAK;EACd;EAEA,OAAOL,wBAAwB;AACjC","ignoreList":[]}
|
|
@@ -23,12 +23,13 @@ export function Drawer({
|
|
|
23
23
|
children,
|
|
24
24
|
style
|
|
25
25
|
}) {
|
|
26
|
+
const flattenedDrawerStyle = StyleSheet.flatten(drawerStyle) || {};
|
|
26
27
|
const drawerWidth = getDrawerWidthWeb({
|
|
27
|
-
drawerStyle
|
|
28
|
+
drawerStyle: flattenedDrawerStyle
|
|
28
29
|
});
|
|
29
30
|
const progress = useFakeSharedValue(open ? 1 : 0);
|
|
30
31
|
React.useEffect(() => {
|
|
31
|
-
progress.
|
|
32
|
+
progress.set(open ? 1 : 0);
|
|
32
33
|
}, [open, progress]);
|
|
33
34
|
const drawerRef = React.useRef(null);
|
|
34
35
|
const onTransitionStartLatest = useLatestCallback(() => {
|
|
@@ -82,13 +83,15 @@ export function Drawer({
|
|
|
82
83
|
} : {
|
|
83
84
|
left: `calc(${drawerWidth} * -1)`
|
|
84
85
|
} : null, drawerAnimatedStyle, drawerStyle],
|
|
85
|
-
children:
|
|
86
|
+
children: /*#__PURE__*/_jsx(Inert, {
|
|
87
|
+
enabled: drawerType !== 'permanent' && !isOpen,
|
|
88
|
+
children: renderDrawerContent()
|
|
89
|
+
})
|
|
86
90
|
}, "drawer");
|
|
87
91
|
const mainContent = /*#__PURE__*/_jsxs(View, {
|
|
88
92
|
style: [styles.content, contentAnimatedStyle],
|
|
89
|
-
children: [/*#__PURE__*/_jsx(
|
|
90
|
-
|
|
91
|
-
style: styles.content,
|
|
93
|
+
children: [/*#__PURE__*/_jsx(Inert, {
|
|
94
|
+
enabled: drawerType !== 'permanent' && isOpen,
|
|
92
95
|
children: children
|
|
93
96
|
}), drawerType !== 'permanent' ? /*#__PURE__*/_jsx(Overlay, {
|
|
94
97
|
open: open,
|
|
@@ -106,6 +109,23 @@ export function Drawer({
|
|
|
106
109
|
})
|
|
107
110
|
});
|
|
108
111
|
}
|
|
112
|
+
function Inert({
|
|
113
|
+
enabled,
|
|
114
|
+
children
|
|
115
|
+
}) {
|
|
116
|
+
return /*#__PURE__*/_jsx("div", {
|
|
117
|
+
inert: enabled,
|
|
118
|
+
"aria-hidden": enabled,
|
|
119
|
+
style: {
|
|
120
|
+
display: 'flex',
|
|
121
|
+
flexDirection: 'column',
|
|
122
|
+
flexGrow: 1,
|
|
123
|
+
flexShrink: 1,
|
|
124
|
+
flexBasis: 'auto'
|
|
125
|
+
},
|
|
126
|
+
children: children
|
|
127
|
+
});
|
|
128
|
+
}
|
|
109
129
|
const styles = StyleSheet.create({
|
|
110
130
|
container: {
|
|
111
131
|
flex: 1,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","StyleSheet","View","useLatestCallback","DrawerProgressContext","getDrawerWidthWeb","useFakeSharedValue","Overlay","jsx","_jsx","jsxs","_jsxs","Drawer","direction","drawerPosition","drawerStyle","drawerType","onClose","onTransitionStart","onTransitionEnd","open","overlayStyle","overlayAccessibilityLabel","renderDrawerContent","children","style","drawerWidth","progress","useEffect","
|
|
1
|
+
{"version":3,"names":["React","StyleSheet","View","useLatestCallback","DrawerProgressContext","getDrawerWidthWeb","useFakeSharedValue","Overlay","jsx","_jsx","jsxs","_jsxs","Drawer","direction","drawerPosition","drawerStyle","drawerType","onClose","onTransitionStart","onTransitionEnd","open","overlayStyle","overlayAccessibilityLabel","renderDrawerContent","children","style","flattenedDrawerStyle","flatten","drawerWidth","progress","useEffect","set","drawerRef","useRef","onTransitionStartLatest","onTransitionEndLatest","element","current","addEventListener","removeEventListener","isOpen","isRight","drawerTranslateX","drawerAnimatedStyle","transition","transform","contentTranslateX","contentAnimatedStyle","drawerElement","ref","styles","drawer","position","zIndex","width","right","left","Inert","enabled","mainContent","content","onPress","accessibilityLabel","Provider","value","container","inert","display","flexDirection","flexGrow","flexShrink","flexBasis","create","flex","top","bottom","maxWidth","backgroundColor"],"sourceRoot":"../../../src","sources":["views/Drawer.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as React from 'react';
|
|
4
|
-
import {
|
|
4
|
+
import { Dimensions, I18nManager, Keyboard, Platform, StatusBar, StyleSheet, View } from 'react-native';
|
|
5
5
|
import Animated, { interpolate, ReduceMotion, runOnJS, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring } from 'react-native-reanimated';
|
|
6
6
|
import useLatestCallback from 'use-latest-callback';
|
|
7
7
|
import { DrawerGestureContext } from "../utils/DrawerGestureContext.js";
|
|
@@ -20,7 +20,6 @@ const minmax = (value, start, end) => {
|
|
|
20
20
|
return Math.min(Math.max(value, start), end);
|
|
21
21
|
};
|
|
22
22
|
export function Drawer({
|
|
23
|
-
layout: customLayout,
|
|
24
23
|
direction = I18nManager.getConstants().isRTL ? 'rtl' : 'ltr',
|
|
25
24
|
drawerPosition = direction === 'rtl' ? 'right' : 'left',
|
|
26
25
|
drawerStyle,
|
|
@@ -47,22 +46,23 @@ export function Drawer({
|
|
|
47
46
|
children,
|
|
48
47
|
style
|
|
49
48
|
}) {
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
layout,
|
|
54
|
-
drawerStyle
|
|
55
|
-
});
|
|
49
|
+
const {
|
|
50
|
+
width: customWidth
|
|
51
|
+
} = StyleSheet.flatten(drawerStyle) || {};
|
|
56
52
|
const isOpen = drawerType === 'permanent' ? true : open;
|
|
57
53
|
const isRight = drawerPosition === 'right';
|
|
58
|
-
const getDrawerTranslationX = React.useCallback(open => {
|
|
54
|
+
const getDrawerTranslationX = React.useCallback((open, containerWidth) => {
|
|
59
55
|
'worklet';
|
|
60
56
|
|
|
57
|
+
const drawerWidth = getDrawerWidthNative({
|
|
58
|
+
containerWidth,
|
|
59
|
+
customWidth
|
|
60
|
+
});
|
|
61
61
|
if (drawerPosition === 'left') {
|
|
62
62
|
return open ? 0 : -drawerWidth;
|
|
63
63
|
}
|
|
64
64
|
return open ? 0 : drawerWidth;
|
|
65
|
-
}, [
|
|
65
|
+
}, [customWidth, drawerPosition]);
|
|
66
66
|
const hideStatusBar = React.useCallback(hide => {
|
|
67
67
|
if (hideStatusBarOnOpen) {
|
|
68
68
|
StatusBar.setHidden(hide, statusBarAnimation);
|
|
@@ -72,16 +72,6 @@ export function Drawer({
|
|
|
72
72
|
hideStatusBar(isOpen);
|
|
73
73
|
return () => hideStatusBar(false);
|
|
74
74
|
}, [isOpen, hideStatusBarOnOpen, statusBarAnimation, hideStatusBar]);
|
|
75
|
-
const interactionHandleRef = React.useRef(null);
|
|
76
|
-
const startInteraction = useLatestCallback(() => {
|
|
77
|
-
interactionHandleRef.current = InteractionManager.createInteractionHandle();
|
|
78
|
-
});
|
|
79
|
-
const endInteraction = useLatestCallback(() => {
|
|
80
|
-
if (interactionHandleRef.current != null) {
|
|
81
|
-
InteractionManager.clearInteractionHandle(interactionHandleRef.current);
|
|
82
|
-
interactionHandleRef.current = null;
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
75
|
const hideKeyboard = useLatestCallback(() => {
|
|
86
76
|
if (keyboardDismissMode === 'on-drag') {
|
|
87
77
|
Keyboard.dismiss();
|
|
@@ -89,17 +79,14 @@ export function Drawer({
|
|
|
89
79
|
});
|
|
90
80
|
const onGestureBegin = useLatestCallback(() => {
|
|
91
81
|
onGestureStart?.();
|
|
92
|
-
startInteraction();
|
|
93
82
|
hideKeyboard();
|
|
94
83
|
hideStatusBar(true);
|
|
95
84
|
});
|
|
96
85
|
const onGestureFinish = useLatestCallback(() => {
|
|
97
86
|
onGestureEnd?.();
|
|
98
|
-
endInteraction();
|
|
99
87
|
});
|
|
100
88
|
const onGestureAbort = useLatestCallback(() => {
|
|
101
89
|
onGestureCancel?.();
|
|
102
|
-
endInteraction();
|
|
103
90
|
});
|
|
104
91
|
const hitSlop = React.useMemo(() => isRight ?
|
|
105
92
|
// Extend hitSlop to the side of the screen when drawer is closed
|
|
@@ -111,9 +98,44 @@ export function Drawer({
|
|
|
111
98
|
left: 0,
|
|
112
99
|
width: isOpen ? undefined : swipeEdgeWidth
|
|
113
100
|
}, [isRight, isOpen, swipeEdgeWidth]);
|
|
101
|
+
const [initialWidth] = React.useState(() => Dimensions.get('window').width);
|
|
102
|
+
const layoutWidth = useSharedValue(initialWidth);
|
|
103
|
+
const translationX = useSharedValue(getDrawerTranslationX(open, initialWidth));
|
|
104
|
+
const contentRef = React.useRef(null);
|
|
105
|
+
React.useLayoutEffect(() => {
|
|
106
|
+
const measureLayout = () => {
|
|
107
|
+
contentRef.current?.measure((_x, _y, width) => {
|
|
108
|
+
layoutWidth.set(width);
|
|
109
|
+
translationX.set(getDrawerTranslationX(open, width));
|
|
110
|
+
});
|
|
111
|
+
};
|
|
112
|
+
measureLayout();
|
|
113
|
+
|
|
114
|
+
// FIXME: the layout is off after screen rotation
|
|
115
|
+
// Measure the layout again on screen rotation
|
|
116
|
+
let handle;
|
|
117
|
+
const subscription = Dimensions.addEventListener('change', () => {
|
|
118
|
+
// The measurement is not accurate without the delay
|
|
119
|
+
handle = requestAnimationFrame(() => {
|
|
120
|
+
measureLayout();
|
|
121
|
+
});
|
|
122
|
+
});
|
|
123
|
+
return () => {
|
|
124
|
+
if (handle != null) {
|
|
125
|
+
cancelAnimationFrame(handle);
|
|
126
|
+
}
|
|
127
|
+
subscription.remove();
|
|
128
|
+
};
|
|
129
|
+
|
|
130
|
+
// only measure on initial render
|
|
131
|
+
// subsequent updates will be handled by onLayout
|
|
132
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
133
|
+
}, []);
|
|
134
|
+
const onLayout = event => {
|
|
135
|
+
layoutWidth.set(event.nativeEvent.layout.width);
|
|
136
|
+
};
|
|
114
137
|
const touchStartX = useSharedValue(0);
|
|
115
138
|
const touchX = useSharedValue(0);
|
|
116
|
-
const translationX = useSharedValue(getDrawerTranslationX(open));
|
|
117
139
|
const gestureState = useSharedValue(GestureState.UNDETERMINED);
|
|
118
140
|
const onAnimationStart = useLatestCallback(open => {
|
|
119
141
|
onTransitionStart?.(!open);
|
|
@@ -124,40 +146,52 @@ export function Drawer({
|
|
|
124
146
|
}
|
|
125
147
|
onTransitionEnd?.(!open);
|
|
126
148
|
});
|
|
149
|
+
const animatingTo = useSharedValue(null);
|
|
127
150
|
const toggleDrawer = React.useCallback((open, velocity) => {
|
|
128
151
|
'worklet';
|
|
129
152
|
|
|
130
|
-
|
|
153
|
+
touchStartX.set(0);
|
|
154
|
+
touchX.set(0);
|
|
155
|
+
const containerWidth = layoutWidth.get();
|
|
156
|
+
const toValue = getDrawerTranslationX(open, containerWidth);
|
|
157
|
+
if (translationX.get() === toValue) {
|
|
158
|
+
return;
|
|
159
|
+
}
|
|
160
|
+
if (animatingTo.get() === (open ? 'open' : 'close')) {
|
|
161
|
+
return;
|
|
162
|
+
}
|
|
131
163
|
if (velocity === undefined) {
|
|
132
164
|
runOnJS(onAnimationStart)(open);
|
|
133
165
|
}
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
translationX.value = withSpring(translateX, {
|
|
166
|
+
animatingTo.set(open ? 'open' : 'close');
|
|
167
|
+
translationX.set(withSpring(toValue, {
|
|
137
168
|
velocity,
|
|
138
169
|
stiffness: 1000,
|
|
139
170
|
damping: 500,
|
|
140
171
|
mass: 3,
|
|
141
172
|
overshootClamping: true,
|
|
142
|
-
restDisplacementThreshold: 0.01,
|
|
143
|
-
restSpeedThreshold: 0.01,
|
|
144
173
|
reduceMotion: ReduceMotion.Never
|
|
145
|
-
}, finished =>
|
|
174
|
+
}, finished => {
|
|
175
|
+
animatingTo.set(null);
|
|
176
|
+
runOnJS(onAnimationEnd)(open, finished);
|
|
177
|
+
}));
|
|
146
178
|
if (open) {
|
|
147
179
|
runOnJS(onOpen)();
|
|
148
180
|
} else {
|
|
149
181
|
runOnJS(onClose)();
|
|
150
182
|
}
|
|
151
|
-
}, [
|
|
152
|
-
React.useEffect(() =>
|
|
183
|
+
}, [touchStartX, touchX, layoutWidth, getDrawerTranslationX, translationX, animatingTo, onAnimationStart, onAnimationEnd, onOpen, onClose]);
|
|
184
|
+
React.useEffect(() => {
|
|
185
|
+
toggleDrawer(open);
|
|
186
|
+
}, [animatingTo, open, toggleDrawer]);
|
|
153
187
|
const startX = useSharedValue(0);
|
|
154
188
|
const pan = React.useMemo(() => {
|
|
155
189
|
let panGesture = Gesture?.Pan().onBegin(event => {
|
|
156
190
|
'worklet';
|
|
157
191
|
|
|
158
|
-
startX.
|
|
159
|
-
gestureState.
|
|
160
|
-
touchStartX.
|
|
192
|
+
startX.set(translationX.get());
|
|
193
|
+
gestureState.set(event.state);
|
|
194
|
+
touchStartX.set(event.x);
|
|
161
195
|
}).onStart(() => {
|
|
162
196
|
'worklet';
|
|
163
197
|
|
|
@@ -165,13 +199,13 @@ export function Drawer({
|
|
|
165
199
|
}).onChange(event => {
|
|
166
200
|
'worklet';
|
|
167
201
|
|
|
168
|
-
touchX.
|
|
169
|
-
translationX.
|
|
170
|
-
gestureState.
|
|
202
|
+
touchX.set(event.x);
|
|
203
|
+
translationX.set(startX.get() + event.translationX);
|
|
204
|
+
gestureState.set(event.state);
|
|
171
205
|
}).onEnd((event, success) => {
|
|
172
206
|
'worklet';
|
|
173
207
|
|
|
174
|
-
gestureState.
|
|
208
|
+
gestureState.set(event.state);
|
|
175
209
|
if (!success) {
|
|
176
210
|
runOnJS(onGestureAbort)();
|
|
177
211
|
}
|
|
@@ -189,6 +223,11 @@ export function Drawer({
|
|
|
189
223
|
return panGesture;
|
|
190
224
|
}, [configureGestureHandler, drawerPosition, drawerType, gestureState, hitSlop, onGestureBegin, onGestureAbort, onGestureFinish, open, startX, swipeEnabled, swipeMinDistance, swipeMinVelocity, toggleDrawer, touchStartX, touchX, translationX]);
|
|
191
225
|
const translateX = useDerivedValue(() => {
|
|
226
|
+
const drawerWidth = getDrawerWidthNative({
|
|
227
|
+
containerWidth: layoutWidth.get(),
|
|
228
|
+
customWidth
|
|
229
|
+
});
|
|
230
|
+
|
|
192
231
|
// Comment stolen from react-native-gesture-handler/DrawerLayout
|
|
193
232
|
//
|
|
194
233
|
// While closing the drawer when user starts gesture outside of its area (in greyed
|
|
@@ -214,13 +253,18 @@ export function Drawer({
|
|
|
214
253
|
// drawer be pulled back as soon as you start the pan.
|
|
215
254
|
//
|
|
216
255
|
// This is used only when drawerType is "front"
|
|
217
|
-
const touchDistance = drawerType === 'front' && gestureState.
|
|
218
|
-
const translateX = drawerPosition === 'left' ? minmax(translationX.
|
|
256
|
+
const touchDistance = drawerType === 'front' && gestureState.get() === GestureState.ACTIVE ? minmax(drawerPosition === 'left' ? touchStartX.get() - drawerWidth : layoutWidth.get() - drawerWidth - touchStartX.get(), 0, layoutWidth.get()) : 0;
|
|
257
|
+
const translateX = drawerPosition === 'left' ? minmax(translationX.get() + touchDistance, -drawerWidth, 0) : minmax(translationX.get() - touchDistance, 0, drawerWidth);
|
|
219
258
|
return translateX;
|
|
220
259
|
});
|
|
221
260
|
const drawerAnimatedStyle = useAnimatedStyle(() => {
|
|
222
|
-
const
|
|
261
|
+
const drawerWidth = getDrawerWidthNative({
|
|
262
|
+
containerWidth: layoutWidth.get(),
|
|
263
|
+
customWidth
|
|
264
|
+
});
|
|
265
|
+
const distanceFromEdge = layoutWidth.get() - drawerWidth;
|
|
223
266
|
return {
|
|
267
|
+
width: drawerWidth,
|
|
224
268
|
// FIXME: Reanimated skips committing to the shadow tree if no layout props are animated
|
|
225
269
|
// This results in pressables not getting their correct position and can't be pressed
|
|
226
270
|
// So we animate the zIndex to force the commit
|
|
@@ -233,26 +277,31 @@ export function Drawer({
|
|
|
233
277
|
[] : [{
|
|
234
278
|
translateX:
|
|
235
279
|
// The drawer stays in place when `drawerType` is `back`
|
|
236
|
-
(drawerType === 'back' ? 0 : translateX.
|
|
280
|
+
(drawerType === 'back' ? 0 : translateX.get()) + (direction === 'rtl' ? drawerPosition === 'left' ? -distanceFromEdge : 0 : drawerPosition === 'left' ? 0 : distanceFromEdge)
|
|
237
281
|
}]
|
|
238
282
|
};
|
|
239
|
-
}, [direction, drawerPosition, drawerType,
|
|
283
|
+
}, [customWidth, direction, drawerPosition, drawerType, layoutWidth, translateX]);
|
|
240
284
|
const contentAnimatedStyle = useAnimatedStyle(() => {
|
|
285
|
+
const drawerWidth = getDrawerWidthNative({
|
|
286
|
+
containerWidth: layoutWidth.get(),
|
|
287
|
+
customWidth
|
|
288
|
+
});
|
|
241
289
|
return {
|
|
242
290
|
// FIXME: Force Reanimated to commit to the shadow tree
|
|
243
|
-
zIndex: translateX.
|
|
291
|
+
zIndex: translateX.get() === 0 ? 0 : drawerType === 'back' ? 2 : 1,
|
|
244
292
|
transform: drawerType === 'permanent' ?
|
|
245
293
|
// Reanimated needs the property to be present, but it results in Browser bug
|
|
246
294
|
// https://bugs.chromium.org/p/chromium/issues/detail?id=20574
|
|
247
295
|
[] : [{
|
|
248
296
|
translateX:
|
|
249
297
|
// The screen content stays in place when `drawerType` is `front`
|
|
250
|
-
drawerType === 'front' ? 0 : translateX.
|
|
298
|
+
drawerType === 'front' ? 0 : translateX.get() + drawerWidth * (drawerPosition === 'left' ? 1 : -1)
|
|
251
299
|
}]
|
|
252
300
|
};
|
|
253
|
-
}, [drawerPosition, drawerType,
|
|
301
|
+
}, [customWidth, drawerPosition, drawerType, layoutWidth, translateX]);
|
|
254
302
|
const progress = useDerivedValue(() => {
|
|
255
|
-
|
|
303
|
+
const containerWidth = layoutWidth.get();
|
|
304
|
+
return drawerType === 'permanent' ? 1 : interpolate(translateX.get(), [getDrawerTranslationX(false, containerWidth), getDrawerTranslationX(true, containerWidth)], [0, 1]);
|
|
256
305
|
});
|
|
257
306
|
return /*#__PURE__*/_jsx(GestureHandlerRootView, {
|
|
258
307
|
style: [styles.container, style],
|
|
@@ -267,6 +316,8 @@ export function Drawer({
|
|
|
267
316
|
flexDirection: drawerType === 'permanent' ? isRight && direction === 'ltr' || !isRight && direction === 'rtl' ? 'row' : 'row-reverse' : 'row'
|
|
268
317
|
}],
|
|
269
318
|
children: [/*#__PURE__*/_jsxs(Animated.View, {
|
|
319
|
+
ref: contentRef,
|
|
320
|
+
onLayout: onLayout,
|
|
270
321
|
style: [styles.content, contentAnimatedStyle],
|
|
271
322
|
children: [/*#__PURE__*/_jsx(View, {
|
|
272
323
|
"aria-hidden": isOpen && drawerType !== 'permanent',
|
|
@@ -282,7 +333,6 @@ export function Drawer({
|
|
|
282
333
|
}), /*#__PURE__*/_jsx(Animated.View, {
|
|
283
334
|
removeClippedSubviews: Platform.OS !== 'ios',
|
|
284
335
|
style: [styles.drawer, {
|
|
285
|
-
width: drawerWidth,
|
|
286
336
|
position: drawerType === 'permanent' ? 'relative' : 'absolute'
|
|
287
337
|
}, drawerAnimatedStyle, drawerStyle],
|
|
288
338
|
children: renderDrawerContent()
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","I18nManager","InteractionManager","Keyboard","Platform","StatusBar","StyleSheet","useWindowDimensions","View","Animated","interpolate","ReduceMotion","runOnJS","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","useLatestCallback","DrawerGestureContext","DrawerProgressContext","getDrawerWidthNative","Gesture","GestureDetector","GestureHandlerRootView","GestureState","Overlay","jsx","_jsx","jsxs","_jsxs","SWIPE_EDGE_WIDTH","SWIPE_MIN_OFFSET","SWIPE_MIN_DISTANCE","SWIPE_MIN_VELOCITY","minmax","value","start","end","Math","min","max","Drawer","layout","customLayout","direction","getConstants","isRTL","drawerPosition","drawerStyle","drawerType","configureGestureHandler","hideStatusBarOnOpen","keyboardDismissMode","onClose","onOpen","onGestureStart","onGestureCancel","onGestureEnd","onTransitionStart","onTransitionEnd","open","overlayStyle","overlayAccessibilityLabel","statusBarAnimation","swipeEnabled","OS","swipeEdgeWidth","swipeMinDistance","swipeMinVelocity","renderDrawerContent","children","style","windowDimensions","drawerWidth","isOpen","isRight","getDrawerTranslationX","useCallback","hideStatusBar","hide","setHidden","useEffect","interactionHandleRef","useRef","startInteraction","current","createInteractionHandle","endInteraction","clearInteractionHandle","hideKeyboard","dismiss","onGestureBegin","onGestureFinish","onGestureAbort","hitSlop","useMemo","right","width","undefined","left","touchStartX","touchX","translationX","gestureState","UNDETERMINED","onAnimationStart","onAnimationEnd","finished","toggleDrawer","velocity","translateX","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","reduceMotion","Never","startX","pan","panGesture","Pan","onBegin","event","state","x","onStart","onChange","onEnd","success","nextOpen","abs","velocityX","activeOffsetX","failOffsetY","enabled","touchDistance","ACTIVE","drawerAnimatedStyle","distanceFromEdge","zIndex","get","transform","contentAnimatedStyle","progress","styles","container","Provider","gesture","main","flexDirection","content","onPress","accessibilityLabel","removeClippedSubviews","drawer","position","create","flex","top","bottom","maxWidth","backgroundColor","select","web","default","overflow"],"sourceRoot":"../../../src","sources":["views/Drawer.native.tsx"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["React","Dimensions","I18nManager","Keyboard","Platform","StatusBar","StyleSheet","View","Animated","interpolate","ReduceMotion","runOnJS","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","useLatestCallback","DrawerGestureContext","DrawerProgressContext","getDrawerWidthNative","Gesture","GestureDetector","GestureHandlerRootView","GestureState","Overlay","jsx","_jsx","jsxs","_jsxs","SWIPE_EDGE_WIDTH","SWIPE_MIN_OFFSET","SWIPE_MIN_DISTANCE","SWIPE_MIN_VELOCITY","minmax","value","start","end","Math","min","max","Drawer","direction","getConstants","isRTL","drawerPosition","drawerStyle","drawerType","configureGestureHandler","hideStatusBarOnOpen","keyboardDismissMode","onClose","onOpen","onGestureStart","onGestureCancel","onGestureEnd","onTransitionStart","onTransitionEnd","open","overlayStyle","overlayAccessibilityLabel","statusBarAnimation","swipeEnabled","OS","swipeEdgeWidth","swipeMinDistance","swipeMinVelocity","renderDrawerContent","children","style","width","customWidth","flatten","isOpen","isRight","getDrawerTranslationX","useCallback","containerWidth","drawerWidth","hideStatusBar","hide","setHidden","useEffect","hideKeyboard","dismiss","onGestureBegin","onGestureFinish","onGestureAbort","hitSlop","useMemo","right","undefined","left","initialWidth","useState","get","layoutWidth","translationX","contentRef","useRef","useLayoutEffect","measureLayout","current","measure","_x","_y","set","handle","subscription","addEventListener","requestAnimationFrame","cancelAnimationFrame","remove","onLayout","event","nativeEvent","layout","touchStartX","touchX","gestureState","UNDETERMINED","onAnimationStart","onAnimationEnd","finished","animatingTo","toggleDrawer","velocity","toValue","stiffness","damping","mass","overshootClamping","reduceMotion","Never","startX","pan","panGesture","Pan","onBegin","state","x","onStart","onChange","onEnd","success","nextOpen","abs","velocityX","activeOffsetX","failOffsetY","enabled","translateX","touchDistance","ACTIVE","drawerAnimatedStyle","distanceFromEdge","zIndex","transform","contentAnimatedStyle","progress","styles","container","Provider","gesture","main","flexDirection","ref","content","onPress","accessibilityLabel","removeClippedSubviews","drawer","position","create","flex","top","bottom","maxWidth","backgroundColor","select","web","default","overflow"],"sourceRoot":"../../../src","sources":["views/Drawer.native.tsx"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SACEC,UAAU,EACVC,WAAW,EACXC,QAAQ,EAERC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,IAAI,QACC,cAAc;AACrB,OAAOC,QAAQ,IACbC,WAAW,EACXC,YAAY,EACZC,OAAO,EACPC,gBAAgB,EAChBC,eAAe,EACfC,cAAc,EACdC,UAAU,QACL,yBAAyB;AAChC,OAAOC,iBAAiB,MAAM,qBAAqB;AAGnD,SAASC,oBAAoB,QAAQ,kCAA+B;AACpE,SAASC,qBAAqB,QAAQ,mCAAgC;AACtE,SAASC,oBAAoB,QAAQ,4BAAyB;AAC9D,SACEC,OAAO,EACPC,eAAe,EACfC,sBAAsB,EACtBC,YAAY,QACP,kBAAkB;AACzB,SAASC,OAAO,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEpC,MAAMC,gBAAgB,GAAG,EAAE;AAC3B,MAAMC,gBAAgB,GAAG,CAAC;AAC1B,MAAMC,kBAAkB,GAAG,EAAE;AAC7B,MAAMC,kBAAkB,GAAG,GAAG;AAE9B,MAAMC,MAAM,GAAGA,CAACC,KAAa,EAAEC,KAAa,EAAEC,GAAW,KAAK;EAC5D,SAAS;;EAET,OAAOC,IAAI,CAACC,GAAG,CAACD,IAAI,CAACE,GAAG,CAACL,KAAK,EAAEC,KAAK,CAAC,EAAEC,GAAG,CAAC;AAC9C,CAAC;AAED,OAAO,SAASI,MAAMA,CAAC;EACrBC,SAAS,GAAGvC,WAAW,CAACwC,YAAY,CAAC,CAAC,CAACC,KAAK,GAAG,KAAK,GAAG,KAAK;EAC5DC,cAAc,GAAGH,SAAS,KAAK,KAAK,GAAG,OAAO,GAAG,MAAM;EACvDI,WAAW;EACXC,UAAU,GAAG,OAAO;EACpBC,uBAAuB;EACvBC,mBAAmB,GAAG,KAAK;EAC3BC,mBAAmB,GAAG,SAAS;EAC/BC,OAAO;EACPC,MAAM;EACNC,cAAc;EACdC,eAAe;EACfC,YAAY;EACZC,iBAAiB;EACjBC,eAAe;EACfC,IAAI;EACJC,YAAY;EACZC,yBAAyB;EACzBC,kBAAkB,GAAG,OAAO;EAC5BC,YAAY,GAAGzD,QAAQ,CAAC0D,EAAE,KAAK,KAAK,IAClC1D,QAAQ,CAAC0D,EAAE,KAAK,SAAS,IACzB1D,QAAQ,CAAC0D,EAAE,KAAK,OAAO;EACzBC,cAAc,GAAGlC,gBAAgB;EACjCmC,gBAAgB,GAAGjC,kBAAkB;EACrCkC,gBAAgB,GAAGjC,kBAAkB;EACrCkC,mBAAmB;EACnBC,QAAQ;EACRC;AACW,CAAC,EAAE;EACd,MAAM;IAAEC,KAAK,EAAEC;EAAY,CAAC,GAAGhE,UAAU,CAACiE,OAAO,CAAC1B,WAAW,CAAC,IAAI,CAAC,CAAC;EAEpE,MAAM2B,MAAM,GAAG1B,UAAU,KAAK,WAAW,GAAG,IAAI,GAAGW,IAAI;EACvD,MAAMgB,OAAO,GAAG7B,cAAc,KAAK,OAAO;EAE1C,MAAM8B,qBAAqB,GAAG1E,KAAK,CAAC2E,WAAW,CAC7C,CAAClB,IAAa,EAAEmB,cAAsB,KAAK;IACzC,SAAS;;IAET,MAAMC,WAAW,GAAG1D,oBAAoB,CAAC;MACvCyD,cAAc;MACdN;IACF,CAAC,CAAC;IAEF,IAAI1B,cAAc,KAAK,MAAM,EAAE;MAC7B,OAAOa,IAAI,GAAG,CAAC,GAAG,CAACoB,WAAW;IAChC;IAEA,OAAOpB,IAAI,GAAG,CAAC,GAAGoB,WAAW;EAC/B,CAAC,EACD,CAACP,WAAW,EAAE1B,cAAc,CAC9B,CAAC;EAED,MAAMkC,aAAa,GAAG9E,KAAK,CAAC2E,WAAW,CACpCI,IAAa,IAAK;IACjB,IAAI/B,mBAAmB,EAAE;MACvB3C,SAAS,CAAC2E,SAAS,CAACD,IAAI,EAAEnB,kBAAkB,CAAC;IAC/C;EACF,CAAC,EACD,CAACZ,mBAAmB,EAAEY,kBAAkB,CAC1C,CAAC;EAED5D,KAAK,CAACiF,SAAS,CAAC,MAAM;IACpBH,aAAa,CAACN,MAAM,CAAC;IAErB,OAAO,MAAMM,aAAa,CAAC,KAAK,CAAC;EACnC,CAAC,EAAE,CAACN,MAAM,EAAExB,mBAAmB,EAAEY,kBAAkB,EAAEkB,aAAa,CAAC,CAAC;EAEpE,MAAMI,YAAY,GAAGlE,iBAAiB,CAAC,MAAM;IAC3C,IAAIiC,mBAAmB,KAAK,SAAS,EAAE;MACrC9C,QAAQ,CAACgF,OAAO,CAAC,CAAC;IACpB;EACF,CAAC,CAAC;EAEF,MAAMC,cAAc,GAAGpE,iBAAiB,CAAC,MAAM;IAC7CoC,cAAc,GAAG,CAAC;IAClB8B,YAAY,CAAC,CAAC;IACdJ,aAAa,CAAC,IAAI,CAAC;EACrB,CAAC,CAAC;EAEF,MAAMO,eAAe,GAAGrE,iBAAiB,CAAC,MAAM;IAC9CsC,YAAY,GAAG,CAAC;EAClB,CAAC,CAAC;EAEF,MAAMgC,cAAc,GAAGtE,iBAAiB,CAAC,MAAM;IAC7CqC,eAAe,GAAG,CAAC;EACrB,CAAC,CAAC;EAEF,MAAMkC,OAAO,GAAGvF,KAAK,CAACwF,OAAO,CAC3B,MACEf,OAAO;EACH;EACA;EACA;IAAEgB,KAAK,EAAE,CAAC;IAAEpB,KAAK,EAAEG,MAAM,GAAGkB,SAAS,GAAG3B;EAAe,CAAC,GACxD;IAAE4B,IAAI,EAAE,CAAC;IAAEtB,KAAK,EAAEG,MAAM,GAAGkB,SAAS,GAAG3B;EAAe,CAAC,EAC7D,CAACU,OAAO,EAAED,MAAM,EAAET,cAAc,CAClC,CAAC;EAED,MAAM,CAAC6B,YAAY,CAAC,GAAG5F,KAAK,CAAC6F,QAAQ,CAAC,MAAM5F,UAAU,CAAC6F,GAAG,CAAC,QAAQ,CAAC,CAACzB,KAAK,CAAC;EAE3E,MAAM0B,WAAW,GAAGjF,cAAc,CAAC8E,YAAY,CAAC;EAChD,MAAMI,YAAY,GAAGlF,cAAc,CACjC4D,qBAAqB,CAACjB,IAAI,EAAEmC,YAAY,CAC1C,CAAC;EAED,MAAMK,UAAU,GAAGjG,KAAK,CAACkG,MAAM,CAAO,IAAI,CAAC;EAE3ClG,KAAK,CAACmG,eAAe,CAAC,MAAM;IAC1B,MAAMC,aAAa,GAAGA,CAAA,KAAM;MAC1BH,UAAU,CAACI,OAAO,EAAEC,OAAO,CAAC,CAACC,EAAE,EAAEC,EAAE,EAAEnC,KAAK,KAAK;QAC7C0B,WAAW,CAACU,GAAG,CAACpC,KAAK,CAAC;QACtB2B,YAAY,CAACS,GAAG,CAAC/B,qBAAqB,CAACjB,IAAI,EAAEY,KAAK,CAAC,CAAC;MACtD,CAAC,CAAC;IACJ,CAAC;IAED+B,aAAa,CAAC,CAAC;;IAEf;IACA;IACA,IAAIM,MAA0B;IAE9B,MAAMC,YAAY,GAAG1G,UAAU,CAAC2G,gBAAgB,CAAC,QAAQ,EAAE,MAAM;MAC/D;MACAF,MAAM,GAAGG,qBAAqB,CAAC,MAAM;QACnCT,aAAa,CAAC,CAAC;MACjB,CAAC,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,MAAM;MACX,IAAIM,MAAM,IAAI,IAAI,EAAE;QAClBI,oBAAoB,CAACJ,MAAM,CAAC;MAC9B;MAEAC,YAAY,CAACI,MAAM,CAAC,CAAC;IACvB,CAAC;;IAED;IACA;IACA;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,QAAQ,GAAIC,KAAwB,IAAK;IAC7ClB,WAAW,CAACU,GAAG,CAACQ,KAAK,CAACC,WAAW,CAACC,MAAM,CAAC9C,KAAK,CAAC;EACjD,CAAC;EAED,MAAM+C,WAAW,GAAGtG,cAAc,CAAC,CAAC,CAAC;EACrC,MAAMuG,MAAM,GAAGvG,cAAc,CAAC,CAAC,CAAC;EAChC,MAAMwG,YAAY,GAAGxG,cAAc,CAAeS,YAAY,CAACgG,YAAY,CAAC;EAE5E,MAAMC,gBAAgB,GAAGxG,iBAAiB,CAAEyC,IAAa,IAAK;IAC5DF,iBAAiB,GAAG,CAACE,IAAI,CAAC;EAC5B,CAAC,CAAC;EAEF,MAAMgE,cAAc,GAAGzG,iBAAiB,CACtC,CAACyC,IAAa,EAAEiE,QAAkB,KAAK;IACrC,IAAI,CAACA,QAAQ,EAAE;MACb;IACF;IAEAlE,eAAe,GAAG,CAACC,IAAI,CAAC;EAC1B,CACF,CAAC;EAED,MAAMkE,WAAW,GAAG7G,cAAc,CAA0B,IAAI,CAAC;EAEjE,MAAM8G,YAAY,GAAG5H,KAAK,CAAC2E,WAAW,CACpC,CAAClB,IAAa,EAAEoE,QAAiB,KAAK;IACpC,SAAS;;IAETT,WAAW,CAACX,GAAG,CAAC,CAAC,CAAC;IAClBY,MAAM,CAACZ,GAAG,CAAC,CAAC,CAAC;IAEb,MAAM7B,cAAc,GAAGmB,WAAW,CAACD,GAAG,CAAC,CAAC;IACxC,MAAMgC,OAAO,GAAGpD,qBAAqB,CAACjB,IAAI,EAAEmB,cAAc,CAAC;IAE3D,IAAIoB,YAAY,CAACF,GAAG,CAAC,CAAC,KAAKgC,OAAO,EAAE;MAClC;IACF;IAEA,IAAIH,WAAW,CAAC7B,GAAG,CAAC,CAAC,MAAMrC,IAAI,GAAG,MAAM,GAAG,OAAO,CAAC,EAAE;MACnD;IACF;IAEA,IAAIoE,QAAQ,KAAKnC,SAAS,EAAE;MAC1B/E,OAAO,CAAC6G,gBAAgB,CAAC,CAAC/D,IAAI,CAAC;IACjC;IAEAkE,WAAW,CAAClB,GAAG,CAAChD,IAAI,GAAG,MAAM,GAAG,OAAO,CAAC;IACxCuC,YAAY,CAACS,GAAG,CACd1F,UAAU,CACR+G,OAAO,EACP;MACED,QAAQ;MACRE,SAAS,EAAE,IAAI;MACfC,OAAO,EAAE,GAAG;MACZC,IAAI,EAAE,CAAC;MACPC,iBAAiB,EAAE,IAAI;MACvBC,YAAY,EAAEzH,YAAY,CAAC0H;IAC7B,CAAC,EACAV,QAAQ,IAAK;MACZC,WAAW,CAAClB,GAAG,CAAC,IAAI,CAAC;MACrB9F,OAAO,CAAC8G,cAAc,CAAC,CAAChE,IAAI,EAAEiE,QAAQ,CAAC;IACzC,CACF,CACF,CAAC;IAED,IAAIjE,IAAI,EAAE;MACR9C,OAAO,CAACwC,MAAM,CAAC,CAAC,CAAC;IACnB,CAAC,MAAM;MACLxC,OAAO,CAACuC,OAAO,CAAC,CAAC,CAAC;IACpB;EACF,CAAC,EACD,CACEkE,WAAW,EACXC,MAAM,EACNtB,WAAW,EACXrB,qBAAqB,EACrBsB,YAAY,EACZ2B,WAAW,EACXH,gBAAgB,EAChBC,cAAc,EACdtE,MAAM,EACND,OAAO,CAEX,CAAC;EAEDlD,KAAK,CAACiF,SAAS,CAAC,MAAM;IACpB2C,YAAY,CAACnE,IAAI,CAAC;EACpB,CAAC,EAAE,CAACkE,WAAW,EAAElE,IAAI,EAAEmE,YAAY,CAAC,CAAC;EAErC,MAAMS,MAAM,GAAGvH,cAAc,CAAC,CAAC,CAAC;EAEhC,MAAMwH,GAAG,GAAGtI,KAAK,CAACwF,OAAO,CAAC,MAAM;IAC9B,IAAI+C,UAAU,GAAGnH,OAAO,EAAEoH,GAAG,CAAC,CAAC,CAC5BC,OAAO,CAAExB,KAAK,IAAK;MAClB,SAAS;;MAEToB,MAAM,CAAC5B,GAAG,CAACT,YAAY,CAACF,GAAG,CAAC,CAAC,CAAC;MAC9BwB,YAAY,CAACb,GAAG,CAACQ,KAAK,CAACyB,KAAK,CAAC;MAC7BtB,WAAW,CAACX,GAAG,CAACQ,KAAK,CAAC0B,CAAC,CAAC;IAC1B,CAAC,CAAC,CACDC,OAAO,CAAC,MAAM;MACb,SAAS;;MAETjI,OAAO,CAACyE,cAAc,CAAC,CAAC,CAAC;IAC3B,CAAC,CAAC,CACDyD,QAAQ,CAAE5B,KAAK,IAAK;MACnB,SAAS;;MAETI,MAAM,CAACZ,GAAG,CAACQ,KAAK,CAAC0B,CAAC,CAAC;MACnB3C,YAAY,CAACS,GAAG,CAAC4B,MAAM,CAACvC,GAAG,CAAC,CAAC,GAAGmB,KAAK,CAACjB,YAAY,CAAC;MACnDsB,YAAY,CAACb,GAAG,CAACQ,KAAK,CAACyB,KAAK,CAAC;IAC/B,CAAC,CAAC,CACDI,KAAK,CAAC,CAAC7B,KAAK,EAAE8B,OAAO,KAAK;MACzB,SAAS;;MAETzB,YAAY,CAACb,GAAG,CAACQ,KAAK,CAACyB,KAAK,CAAC;MAE7B,IAAI,CAACK,OAAO,EAAE;QACZpI,OAAO,CAAC2E,cAAc,CAAC,CAAC,CAAC;MAC3B;MAEA,MAAM0D,QAAQ,GACX3G,IAAI,CAAC4G,GAAG,CAAChC,KAAK,CAACjB,YAAY,CAAC,GAAGlE,gBAAgB,IAC9CO,IAAI,CAAC4G,GAAG,CAAChC,KAAK,CAACjB,YAAY,CAAC,GAAG/B,gBAAgB,IACjD5B,IAAI,CAAC4G,GAAG,CAAChC,KAAK,CAACjB,YAAY,CAAC,GAAGhC,gBAAgB,GAC3CpB,cAAc,KAAK,MAAM;MACvB;MACA,CAACqE,KAAK,CAACiC,SAAS,KAAK,CAAC,GAAGjC,KAAK,CAACjB,YAAY,GAAGiB,KAAK,CAACiC,SAAS,IAC7D,CAAC;MACD;MACA,CAACjC,KAAK,CAACiC,SAAS,KAAK,CAAC,GAAGjC,KAAK,CAACjB,YAAY,GAAGiB,KAAK,CAACiC,SAAS,IAC7D,CAAC,GACHzF,IAAI;MAEVmE,YAAY,CAACoB,QAAQ,EAAE/B,KAAK,CAACiC,SAAS,CAAC;MACvCvI,OAAO,CAAC0E,eAAe,CAAC,CAAC,CAAC;IAC5B,CAAC,CAAC,CACD8D,aAAa,CAAC,CAAC,CAACrH,gBAAgB,EAAEA,gBAAgB,CAAC,CAAC,CACpDsH,WAAW,CAAC,CAAC,CAACtH,gBAAgB,EAAEA,gBAAgB,CAAC,CAAC,CAClDyD,OAAO,CAACA,OAAO,CAAC,CAChB8D,OAAO,CAACvG,UAAU,KAAK,WAAW,IAAIe,YAAY,CAAC;IAEtD,IAAI0E,UAAU,IAAIxF,uBAAuB,EAAE;MACzCwF,UAAU,GAAGxF,uBAAuB,CAACwF,UAAU,CAAC;IAClD;IAEA,OAAOA,UAAU;EACnB,CAAC,EAAE,CACDxF,uBAAuB,EACvBH,cAAc,EACdE,UAAU,EACVwE,YAAY,EACZ/B,OAAO,EACPH,cAAc,EACdE,cAAc,EACdD,eAAe,EACf5B,IAAI,EACJ4E,MAAM,EACNxE,YAAY,EACZG,gBAAgB,EAChBC,gBAAgB,EAChB2D,YAAY,EACZR,WAAW,EACXC,MAAM,EACNrB,YAAY,CACb,CAAC;EAEF,MAAMsD,UAAU,GAAGzI,eAAe,CAAC,MAAM;IACvC,MAAMgE,WAAW,GAAG1D,oBAAoB,CAAC;MACvCyD,cAAc,EAAEmB,WAAW,CAACD,GAAG,CAAC,CAAC;MACjCxB;IACF,CAAC,CAAC;;IAEF;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,MAAMiF,aAAa,GACjBzG,UAAU,KAAK,OAAO,IAAIwE,YAAY,CAACxB,GAAG,CAAC,CAAC,KAAKvE,YAAY,CAACiI,MAAM,GAChEvH,MAAM,CACJW,cAAc,KAAK,MAAM,GACrBwE,WAAW,CAACtB,GAAG,CAAC,CAAC,GAAGjB,WAAW,GAC/BkB,WAAW,CAACD,GAAG,CAAC,CAAC,GAAGjB,WAAW,GAAGuC,WAAW,CAACtB,GAAG,CAAC,CAAC,EACvD,CAAC,EACDC,WAAW,CAACD,GAAG,CAAC,CAClB,CAAC,GACD,CAAC;IAEP,MAAMwD,UAAU,GACd1G,cAAc,KAAK,MAAM,GACrBX,MAAM,CAAC+D,YAAY,CAACF,GAAG,CAAC,CAAC,GAAGyD,aAAa,EAAE,CAAC1E,WAAW,EAAE,CAAC,CAAC,GAC3D5C,MAAM,CAAC+D,YAAY,CAACF,GAAG,CAAC,CAAC,GAAGyD,aAAa,EAAE,CAAC,EAAE1E,WAAW,CAAC;IAEhE,OAAOyE,UAAU;EACnB,CAAC,CAAC;EAEF,MAAMG,mBAAmB,GAAG7I,gBAAgB,CAAC,MAAM;IACjD,MAAMiE,WAAW,GAAG1D,oBAAoB,CAAC;MACvCyD,cAAc,EAAEmB,WAAW,CAACD,GAAG,CAAC,CAAC;MACjCxB;IACF,CAAC,CAAC;IAEF,MAAMoF,gBAAgB,GAAG3D,WAAW,CAACD,GAAG,CAAC,CAAC,GAAGjB,WAAW;IAExD,OAAO;MACLR,KAAK,EAAEQ,WAAW;MAClB;MACA;MACA;MACA;MACA;MACA8E,MAAM,EACJ7G,UAAU,KAAK,MAAM,GACjBwG,UAAU,CAACxD,GAAG,CAAC,CAAC,KAAK,CAAC,GACpB,CAAC,CAAC,GACF,CAAC,GACHwD,UAAU,CAACxD,GAAG,CAAC,CAAC,KAAK,CAAC,GACpB,CAAC,GACD,CAAC;MACT8D,SAAS,EACP9G,UAAU,KAAK,WAAW;MACtB;MACA;MACA,EAAE,GACF,CACE;QACEwG,UAAU;QACR;QACA,CAACxG,UAAU,KAAK,MAAM,GAAG,CAAC,GAAGwG,UAAU,CAACxD,GAAG,CAAC,CAAC,KAC5CrD,SAAS,KAAK,KAAK,GAChBG,cAAc,KAAK,MAAM,GACvB,CAAC8G,gBAAgB,GACjB,CAAC,GACH9G,cAAc,KAAK,MAAM,GACvB,CAAC,GACD8G,gBAAgB;MAC1B,CAAC;IAEX,CAAC;EACH,CAAC,EAAE,CACDpF,WAAW,EACX7B,SAAS,EACTG,cAAc,EACdE,UAAU,EACViD,WAAW,EACXuD,UAAU,CACX,CAAC;EAEF,MAAMO,oBAAoB,GAAGjJ,gBAAgB,CAAC,MAAM;IAClD,MAAMiE,WAAW,GAAG1D,oBAAoB,CAAC;MACvCyD,cAAc,EAAEmB,WAAW,CAACD,GAAG,CAAC,CAAC;MACjCxB;IACF,CAAC,CAAC;IAEF,OAAO;MACL;MACAqF,MAAM,EAAEL,UAAU,CAACxD,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,GAAGhD,UAAU,KAAK,MAAM,GAAG,CAAC,GAAG,CAAC;MAClE8G,SAAS,EACP9G,UAAU,KAAK,WAAW;MACtB;MACA;MACA,EAAE,GACF,CACE;QACEwG,UAAU;QACR;QACAxG,UAAU,KAAK,OAAO,GAClB,CAAC,GACDwG,UAAU,CAACxD,GAAG,CAAC,CAAC,GAChBjB,WAAW,IAAIjC,cAAc,KAAK,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC;MACzD,CAAC;IAEX,CAAC;EACH,CAAC,EAAE,CAAC0B,WAAW,EAAE1B,cAAc,EAAEE,UAAU,EAAEiD,WAAW,EAAEuD,UAAU,CAAC,CAAC;EAEtE,MAAMQ,QAAQ,GAAGjJ,eAAe,CAAC,MAAM;IACrC,MAAM+D,cAAc,GAAGmB,WAAW,CAACD,GAAG,CAAC,CAAC;IAExC,OAAOhD,UAAU,KAAK,WAAW,GAC7B,CAAC,GACDrC,WAAW,CACT6I,UAAU,CAACxD,GAAG,CAAC,CAAC,EAChB,CACEpB,qBAAqB,CAAC,KAAK,EAAEE,cAAc,CAAC,EAC5CF,qBAAqB,CAAC,IAAI,EAAEE,cAAc,CAAC,CAC5C,EACD,CAAC,CAAC,EAAE,CAAC,CACP,CAAC;EACP,CAAC,CAAC;EAEF,oBACElD,IAAA,CAACJ,sBAAsB;IAAC8C,KAAK,EAAE,CAAC2F,MAAM,CAACC,SAAS,EAAE5F,KAAK,CAAE;IAAAD,QAAA,eACvDzC,IAAA,CAACR,qBAAqB,CAAC+I,QAAQ;MAAC/H,KAAK,EAAE4H,QAAS;MAAA3F,QAAA,eAC9CzC,IAAA,CAACT,oBAAoB,CAACgJ,QAAQ;QAAC/H,KAAK,EAAEoG,GAAI;QAAAnE,QAAA,eACxCzC,IAAA,CAACL,eAAe;UAAC6I,OAAO,EAAE5B,GAAI;UAAAnE,QAAA,eAE5BvC,KAAA,CAACpB,QAAQ,CAACD,IAAI;YACZ6D,KAAK,EAAE,CACL2F,MAAM,CAACI,IAAI,EACX;cACEC,aAAa,EACXtH,UAAU,KAAK,WAAW,GACrB2B,OAAO,IAAIhC,SAAS,KAAK,KAAK,IAC9B,CAACgC,OAAO,IAAIhC,SAAS,KAAK,KAAM,GAC/B,KAAK,GACL,aAAa,GACf;YACR,CAAC,CACD;YAAA0B,QAAA,gBAEFvC,KAAA,CAACpB,QAAQ,CAACD,IAAI;cACZ8J,GAAG,EAAEpE,UAAW;cAChBe,QAAQ,EAAEA,QAAS;cACnB5C,KAAK,EAAE,CAAC2F,MAAM,CAACO,OAAO,EAAET,oBAAoB,CAAE;cAAA1F,QAAA,gBAE9CzC,IAAA,CAACnB,IAAI;gBACH,eAAaiE,MAAM,IAAI1B,UAAU,KAAK,WAAY;gBAClDsB,KAAK,EAAE2F,MAAM,CAACO,OAAQ;gBAAAnG,QAAA,EAErBA;cAAQ,CACL,CAAC,EACNrB,UAAU,KAAK,WAAW,gBACzBpB,IAAA,CAACF,OAAO;gBACNiC,IAAI,EAAEA,IAAK;gBACXqG,QAAQ,EAAEA,QAAS;gBACnBS,OAAO,EAAEA,CAAA,KAAM3C,YAAY,CAAC,KAAK,CAAE;gBACnCxD,KAAK,EAAEV,YAAa;gBACpB8G,kBAAkB,EAAE7G;cAA0B,CAC/C,CAAC,GACA,IAAI;YAAA,CACK,CAAC,eAChBjC,IAAA,CAAClB,QAAQ,CAACD,IAAI;cACZkK,qBAAqB,EAAErK,QAAQ,CAAC0D,EAAE,KAAK,KAAM;cAC7CM,KAAK,EAAE,CACL2F,MAAM,CAACW,MAAM,EACb;gBACEC,QAAQ,EACN7H,UAAU,KAAK,WAAW,GAAG,UAAU,GAAG;cAC9C,CAAC,EACD2G,mBAAmB,EACnB5G,WAAW,CACX;cAAAsB,QAAA,EAEDD,mBAAmB,CAAC;YAAC,CACT,CAAC;UAAA,CACH;QAAC,CACD;MAAC,CACW;IAAC,CACF;EAAC,CACX,CAAC;AAE7B;AAEA,MAAM6F,MAAM,GAAGzJ,UAAU,CAACsK,MAAM,CAAC;EAC/BZ,SAAS,EAAE;IACTa,IAAI,EAAE;EACR,CAAC;EACDH,MAAM,EAAE;IACNI,GAAG,EAAE,CAAC;IACNC,MAAM,EAAE,CAAC;IACTC,QAAQ,EAAE,MAAM;IAChBC,eAAe,EAAE;EACnB,CAAC;EACDX,OAAO,EAAE;IACPO,IAAI,EAAE;EACR,CAAC;EACDV,IAAI,EAAE;IACJU,IAAI,EAAE,CAAC;IACP,GAAGzK,QAAQ,CAAC8K,MAAM,CAAC;MACjB;MACA;MACAC,GAAG,EAAE,IAAI;MACTC,OAAO,EAAE;QAAEC,QAAQ,EAAE;MAAS;IAChC,CAAC;EACH;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -12,14 +12,15 @@ export function Overlay({
|
|
|
12
12
|
...rest
|
|
13
13
|
}) {
|
|
14
14
|
const animatedStyle = useAnimatedStyle(() => {
|
|
15
|
+
const active = progress.value > PROGRESS_EPSILON;
|
|
15
16
|
return {
|
|
16
|
-
opacity: progress.value
|
|
17
|
+
opacity: progress.value,
|
|
18
|
+
pointerEvents: active ? 'auto' : 'none'
|
|
17
19
|
};
|
|
18
20
|
}, [progress]);
|
|
19
21
|
const animatedProps = useAnimatedProps(() => {
|
|
20
22
|
const active = progress.value > PROGRESS_EPSILON;
|
|
21
23
|
return {
|
|
22
|
-
'pointerEvents': active ? 'auto' : 'none',
|
|
23
24
|
'aria-hidden': !active
|
|
24
25
|
};
|
|
25
26
|
}, [progress]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Pressable","StyleSheet","Animated","useAnimatedProps","useAnimatedStyle","jsx","_jsx","PROGRESS_EPSILON","Overlay","progress","onPress","style","accessibilityLabel","rest","animatedStyle","
|
|
1
|
+
{"version":3,"names":["Pressable","StyleSheet","Animated","useAnimatedProps","useAnimatedStyle","jsx","_jsx","PROGRESS_EPSILON","Overlay","progress","onPress","style","accessibilityLabel","rest","animatedStyle","active","value","opacity","pointerEvents","animatedProps","View","absoluteFill","styles","overlay","children","pressable","role","accessible","create","backgroundColor","flex"],"sourceRoot":"../../../src","sources":["views/Overlay.native.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,UAAU,QAAQ,cAAc;AACpD,OAAOC,QAAQ,IACbC,gBAAgB,EAChBC,gBAAgB,QACX,yBAAyB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIjC,MAAMC,gBAAgB,GAAG,IAAI;AAE7B,OAAO,SAASC,OAAOA,CAAC;EACtBC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,kBAAkB,GAAG,cAAc;EACnC,GAAGC;AACS,CAAC,EAAE;EACf,MAAMC,aAAa,GAAGV,gBAAgB,CAAC,MAAM;IAC3C,MAAMW,MAAM,GAAGN,QAAQ,CAACO,KAAK,GAAGT,gBAAgB;IAEhD,OAAO;MACLU,OAAO,EAAER,QAAQ,CAACO,KAAK;MACvBE,aAAa,EAAEH,MAAM,GAAG,MAAM,GAAG;IACnC,CAAC;EACH,CAAC,EAAE,CAACN,QAAQ,CAAC,CAAC;EAEd,MAAMU,aAAa,GAAGhB,gBAAgB,CAAC,MAAM;IAC3C,MAAMY,MAAM,GAAGN,QAAQ,CAACO,KAAK,GAAGT,gBAAgB;IAEhD,OAAO;MACL,aAAa,EAAE,CAACQ;IAClB,CAAC;EACH,CAAC,EAAE,CAACN,QAAQ,CAAC,CAAC;EAEd,oBACEH,IAAA,CAACJ,QAAQ,CAACkB,IAAI;IAAA,GACRP,IAAI;IACRF,KAAK,EAAE,CAACV,UAAU,CAACoB,YAAY,EAAEC,MAAM,CAACC,OAAO,EAAET,aAAa,EAAEH,KAAK,CAAE;IACvEQ,aAAa,EAAEA,aAAc;IAAAK,QAAA,eAE7BlB,IAAA,CAACN,SAAS;MACRU,OAAO,EAAEA,OAAQ;MACjBC,KAAK,EAAEW,MAAM,CAACG,SAAU;MACxBC,IAAI,EAAC,QAAQ;MACb,cAAYd,kBAAmB;MAC/Be,UAAU;IAAA,CACX;EAAC,CACW,CAAC;AAEpB;AAEA,MAAML,MAAM,GAAGrB,UAAU,CAAC2B,MAAM,CAAC;EAC/BL,OAAO,EAAE;IACPM,eAAe,EAAE;EACnB,CAAC;EACDJ,SAAS,EAAE;IACTK,IAAI,EAAE,CAAC;IACPZ,aAAa,EAAE;EACjB;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -2,10 +2,6 @@ import * as React from 'react';
|
|
|
2
2
|
import type { StyleProp, View, ViewStyle } from 'react-native';
|
|
3
3
|
import type { PanGesture } from 'react-native-gesture-handler';
|
|
4
4
|
import type { SharedValue } from 'react-native-reanimated';
|
|
5
|
-
export type Layout = {
|
|
6
|
-
width: number;
|
|
7
|
-
height: number;
|
|
8
|
-
};
|
|
9
5
|
export type DrawerProps = {
|
|
10
6
|
/**
|
|
11
7
|
* Whether the drawer is open or not.
|
|
@@ -43,17 +39,9 @@ export type DrawerProps = {
|
|
|
43
39
|
* Callback which returns a react element to render as the content of the drawer.
|
|
44
40
|
*/
|
|
45
41
|
renderDrawerContent: () => React.ReactNode;
|
|
46
|
-
/**
|
|
47
|
-
* Object containing the layout of the container.
|
|
48
|
-
* Defaults to the dimensions of the application's window.
|
|
49
|
-
*/
|
|
50
|
-
layout?: {
|
|
51
|
-
width: number;
|
|
52
|
-
height: number;
|
|
53
|
-
};
|
|
54
42
|
/**
|
|
55
43
|
* Locale direction of the drawer.
|
|
56
|
-
* Defaults to `rtl` when `I18nManager.isRTL` is `true` on Android & iOS, otherwise `ltr`.
|
|
44
|
+
* Defaults to `rtl` when `I18nManager.getConstants().isRTL` is `true` on Android & iOS, otherwise `ltr`.
|
|
57
45
|
*/
|
|
58
46
|
direction?: 'ltr' | 'rtl';
|
|
59
47
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,IAAI,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,MAAM,EAAE,MAAM,IAAI,CAAC;IAEnB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAE7B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAE1B;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAE/C;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAE7C;;OAEG;IACH,mBAAmB,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IAE3C;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAE1B;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAElC;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,WAAW,CAAC;IAEtD;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAEnC;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAEpC;;;OAGG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAEzC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAE/C;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;OAEG;IACH,uBAAuB,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,KAAK,UAAU,CAAC;IAE9D;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG;IAC7D,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC"}
|
|
@@ -1,12 +1,9 @@
|
|
|
1
|
-
import { type
|
|
2
|
-
export declare function getDrawerWidthNative({
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
height: number;
|
|
6
|
-
};
|
|
7
|
-
drawerStyle?: StyleProp<ViewStyle>;
|
|
1
|
+
import { type DimensionValue, type ViewStyle } from 'react-native';
|
|
2
|
+
export declare function getDrawerWidthNative({ containerWidth, customWidth, }: {
|
|
3
|
+
containerWidth: number;
|
|
4
|
+
customWidth: DimensionValue | undefined | null;
|
|
8
5
|
}): number;
|
|
9
6
|
export declare function getDrawerWidthWeb({ drawerStyle, }: {
|
|
10
|
-
drawerStyle
|
|
7
|
+
drawerStyle: ViewStyle;
|
|
11
8
|
}): string;
|
|
12
9
|
//# sourceMappingURL=getDrawerWidth.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getDrawerWidth.d.ts","sourceRoot":"","sources":["../../../../src/utils/getDrawerWidth.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,
|
|
1
|
+
{"version":3,"file":"getDrawerWidth.d.ts","sourceRoot":"","sources":["../../../../src/utils/getDrawerWidth.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAYnE,wBAAgB,oBAAoB,CAAC,EACnC,cAAc,EACd,WAAW,GACZ,EAAE;IACD,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,cAAc,GAAG,SAAS,GAAG,IAAI,CAAC;CAChD,UAoBA;AAED,wBAAgB,iBAAiB,CAAC,EAChC,WAAW,GACZ,EAAE;IACD,WAAW,EAAE,SAAS,CAAC;CACxB,GAAG,MAAM,CAYT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../../src/views/Drawer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAM5C,wBAAgB,MAAM,CAAC,EACrB,SAAiB,EACjB,cAAuD,EACvD,WAAW,EACX,UAAoB,EACpB,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,IAAI,EACJ,YAAY,EACZ,yBAAyB,EACzB,mBAAmB,EACnB,QAAQ,EACR,KAAK,GACN,EAAE,WAAW,
|
|
1
|
+
{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../../src/views/Drawer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAM5C,wBAAgB,MAAM,CAAC,EACrB,SAAiB,EACjB,cAAuD,EACvD,WAAW,EACX,UAAoB,EACpB,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,IAAI,EACJ,YAAY,EACZ,yBAAyB,EACzB,mBAAmB,EACnB,QAAQ,EACR,KAAK,GACN,EAAE,WAAW,2CA2Hb"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { DrawerProps } from '../types';
|
|
2
|
-
export declare function Drawer({
|
|
2
|
+
export declare function Drawer({ direction, drawerPosition, drawerStyle, drawerType, configureGestureHandler, hideStatusBarOnOpen, keyboardDismissMode, onClose, onOpen, onGestureStart, onGestureCancel, onGestureEnd, onTransitionStart, onTransitionEnd, open, overlayStyle, overlayAccessibilityLabel, statusBarAnimation, swipeEnabled, swipeEdgeWidth, swipeMinDistance, swipeMinVelocity, renderDrawerContent, children, style, }: DrawerProps): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
//# sourceMappingURL=Drawer.native.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.native.d.ts","sourceRoot":"","sources":["../../../../src/views/Drawer.native.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAuB5C,wBAAgB,MAAM,CAAC,EACrB,
|
|
1
|
+
{"version":3,"file":"Drawer.native.d.ts","sourceRoot":"","sources":["../../../../src/views/Drawer.native.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAuB5C,wBAAgB,MAAM,CAAC,EACrB,SAA4D,EAC5D,cAAuD,EACvD,WAAW,EACX,UAAoB,EACpB,uBAAuB,EACvB,mBAA2B,EAC3B,mBAA+B,EAC/B,OAAO,EACP,MAAM,EACN,cAAc,EACd,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,IAAI,EACJ,YAAY,EACZ,yBAAyB,EACzB,kBAA4B,EAC5B,YAEyB,EACzB,cAAiC,EACjC,gBAAqC,EACrC,gBAAqC,EACrC,mBAAmB,EACnB,QAAQ,EACR,KAAK,GACN,EAAE,WAAW,2CAoeb"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Overlay.native.d.ts","sourceRoot":"","sources":["../../../../src/views/Overlay.native.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,OAAO,EACP,KAAK,EACL,kBAAmC,EACnC,GAAG,IAAI,EACR,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"Overlay.native.d.ts","sourceRoot":"","sources":["../../../../src/views/Overlay.native.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,OAAO,EACP,KAAK,EACL,kBAAmC,EACnC,GAAG,IAAI,EACR,EAAE,YAAY,2CAiCd"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-drawer-layout",
|
|
3
3
|
"description": "Drawer component for React Native",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "5.0.0-alpha.1",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native-component",
|
|
7
7
|
"react-component",
|
|
@@ -43,25 +43,22 @@
|
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
45
|
"color": "^4.2.3",
|
|
46
|
-
"use-latest-callback": "^0.2
|
|
46
|
+
"use-latest-callback": "^0.3.2"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@jest/globals": "^30.0.0",
|
|
50
|
-
"@testing-library/react-native": "^13.2.1",
|
|
51
|
-
"@types/color": "^4.2.0",
|
|
52
|
-
"@types/react": "~19.0.10",
|
|
53
49
|
"del-cli": "^6.0.0",
|
|
54
50
|
"react": "19.1.0",
|
|
55
|
-
"react-native": "0.81.
|
|
56
|
-
"react-native-builder-bob": "^0.40.
|
|
57
|
-
"react-native-reanimated": "
|
|
51
|
+
"react-native": "0.81.4",
|
|
52
|
+
"react-native-builder-bob": "^0.40.12",
|
|
53
|
+
"react-native-reanimated": "4.1.3",
|
|
54
|
+
"react-native-worklets": "0.6.1",
|
|
58
55
|
"typescript": "^5.9.2"
|
|
59
56
|
},
|
|
60
57
|
"peerDependencies": {
|
|
61
|
-
"react": ">=
|
|
58
|
+
"react": ">= 19.0.0",
|
|
62
59
|
"react-native": "*",
|
|
63
60
|
"react-native-gesture-handler": ">= 2.0.0",
|
|
64
|
-
"react-native-reanimated": ">=
|
|
61
|
+
"react-native-reanimated": ">= 4.0.0"
|
|
65
62
|
},
|
|
66
63
|
"react-native-builder-bob": {
|
|
67
64
|
"source": "src",
|
|
@@ -81,5 +78,5 @@
|
|
|
81
78
|
]
|
|
82
79
|
]
|
|
83
80
|
},
|
|
84
|
-
"gitHead": "
|
|
81
|
+
"gitHead": "7e4ba3f0b8dc69e00989cb6005052c9502581cf3"
|
|
85
82
|
}
|
package/src/types.tsx
CHANGED
|
@@ -3,8 +3,6 @@ import type { StyleProp, View, ViewStyle } from 'react-native';
|
|
|
3
3
|
import type { PanGesture } from 'react-native-gesture-handler';
|
|
4
4
|
import type { SharedValue } from 'react-native-reanimated';
|
|
5
5
|
|
|
6
|
-
export type Layout = { width: number; height: number };
|
|
7
|
-
|
|
8
6
|
export type DrawerProps = {
|
|
9
7
|
/**
|
|
10
8
|
* Whether the drawer is open or not.
|
|
@@ -51,15 +49,9 @@ export type DrawerProps = {
|
|
|
51
49
|
*/
|
|
52
50
|
renderDrawerContent: () => React.ReactNode;
|
|
53
51
|
|
|
54
|
-
/**
|
|
55
|
-
* Object containing the layout of the container.
|
|
56
|
-
* Defaults to the dimensions of the application's window.
|
|
57
|
-
*/
|
|
58
|
-
layout?: { width: number; height: number };
|
|
59
|
-
|
|
60
52
|
/**
|
|
61
53
|
* Locale direction of the drawer.
|
|
62
|
-
* Defaults to `rtl` when `I18nManager.isRTL` is `true` on Android & iOS, otherwise `ltr`.
|
|
54
|
+
* Defaults to `rtl` when `I18nManager.getConstants().isRTL` is `true` on Android & iOS, otherwise `ltr`.
|
|
63
55
|
*/
|
|
64
56
|
direction?: 'ltr' | 'rtl';
|
|
65
57
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type
|
|
1
|
+
import { type DimensionValue, type ViewStyle } from 'react-native';
|
|
2
2
|
|
|
3
3
|
const APPROX_APP_BAR_HEIGHT = 56;
|
|
4
4
|
const DEFAULT_DRAWER_WIDTH = 360;
|
|
@@ -11,25 +11,27 @@ const DEFAULT_DRAWER_WIDTH = 360;
|
|
|
11
11
|
const DRAWER_DEFAULT_WIDTH_WEB = `min(calc(100% - ${APPROX_APP_BAR_HEIGHT}px), ${DEFAULT_DRAWER_WIDTH}px)`;
|
|
12
12
|
|
|
13
13
|
export function getDrawerWidthNative({
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
containerWidth,
|
|
15
|
+
customWidth,
|
|
16
16
|
}: {
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
containerWidth: number;
|
|
18
|
+
customWidth: DimensionValue | undefined | null;
|
|
19
19
|
}) {
|
|
20
|
+
'worklet';
|
|
21
|
+
|
|
20
22
|
const defaultWidth =
|
|
21
|
-
|
|
22
|
-
?
|
|
23
|
+
containerWidth - APPROX_APP_BAR_HEIGHT <= 360
|
|
24
|
+
? containerWidth - APPROX_APP_BAR_HEIGHT
|
|
23
25
|
: DEFAULT_DRAWER_WIDTH;
|
|
24
26
|
|
|
25
|
-
const
|
|
27
|
+
const width = customWidth ?? defaultWidth;
|
|
26
28
|
|
|
27
29
|
if (typeof width === 'string' && width.endsWith('%')) {
|
|
28
30
|
// Try to calculate width if a percentage is given
|
|
29
31
|
const percentage = Number(width.replace(/%$/, ''));
|
|
30
32
|
|
|
31
33
|
if (Number.isFinite(percentage)) {
|
|
32
|
-
return
|
|
34
|
+
return containerWidth * (percentage / 100);
|
|
33
35
|
}
|
|
34
36
|
}
|
|
35
37
|
|
|
@@ -39,9 +41,9 @@ export function getDrawerWidthNative({
|
|
|
39
41
|
export function getDrawerWidthWeb({
|
|
40
42
|
drawerStyle,
|
|
41
43
|
}: {
|
|
42
|
-
drawerStyle
|
|
44
|
+
drawerStyle: ViewStyle;
|
|
43
45
|
}): string {
|
|
44
|
-
const { width } =
|
|
46
|
+
const { width } = drawerStyle;
|
|
45
47
|
|
|
46
48
|
if (typeof width === 'number') {
|
|
47
49
|
return `${width}px`;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import {
|
|
3
|
+
Dimensions,
|
|
3
4
|
I18nManager,
|
|
4
|
-
InteractionManager,
|
|
5
5
|
Keyboard,
|
|
6
|
+
type LayoutChangeEvent,
|
|
6
7
|
Platform,
|
|
7
8
|
StatusBar,
|
|
8
9
|
StyleSheet,
|
|
9
|
-
useWindowDimensions,
|
|
10
10
|
View,
|
|
11
11
|
} from 'react-native';
|
|
12
12
|
import Animated, {
|
|
@@ -44,7 +44,6 @@ const minmax = (value: number, start: number, end: number) => {
|
|
|
44
44
|
};
|
|
45
45
|
|
|
46
46
|
export function Drawer({
|
|
47
|
-
layout: customLayout,
|
|
48
47
|
direction = I18nManager.getConstants().isRTL ? 'rtl' : 'ltr',
|
|
49
48
|
drawerPosition = direction === 'rtl' ? 'right' : 'left',
|
|
50
49
|
drawerStyle,
|
|
@@ -73,25 +72,27 @@ export function Drawer({
|
|
|
73
72
|
children,
|
|
74
73
|
style,
|
|
75
74
|
}: DrawerProps) {
|
|
76
|
-
const
|
|
77
|
-
|
|
78
|
-
const layout = customLayout ?? windowDimensions;
|
|
79
|
-
const drawerWidth = getDrawerWidthNative({ layout, drawerStyle });
|
|
75
|
+
const { width: customWidth } = StyleSheet.flatten(drawerStyle) || {};
|
|
80
76
|
|
|
81
77
|
const isOpen = drawerType === 'permanent' ? true : open;
|
|
82
78
|
const isRight = drawerPosition === 'right';
|
|
83
79
|
|
|
84
80
|
const getDrawerTranslationX = React.useCallback(
|
|
85
|
-
(open: boolean) => {
|
|
81
|
+
(open: boolean, containerWidth: number) => {
|
|
86
82
|
'worklet';
|
|
87
83
|
|
|
84
|
+
const drawerWidth = getDrawerWidthNative({
|
|
85
|
+
containerWidth,
|
|
86
|
+
customWidth,
|
|
87
|
+
});
|
|
88
|
+
|
|
88
89
|
if (drawerPosition === 'left') {
|
|
89
90
|
return open ? 0 : -drawerWidth;
|
|
90
91
|
}
|
|
91
92
|
|
|
92
93
|
return open ? 0 : drawerWidth;
|
|
93
94
|
},
|
|
94
|
-
[
|
|
95
|
+
[customWidth, drawerPosition]
|
|
95
96
|
);
|
|
96
97
|
|
|
97
98
|
const hideStatusBar = React.useCallback(
|
|
@@ -109,19 +110,6 @@ export function Drawer({
|
|
|
109
110
|
return () => hideStatusBar(false);
|
|
110
111
|
}, [isOpen, hideStatusBarOnOpen, statusBarAnimation, hideStatusBar]);
|
|
111
112
|
|
|
112
|
-
const interactionHandleRef = React.useRef<number | null>(null);
|
|
113
|
-
|
|
114
|
-
const startInteraction = useLatestCallback(() => {
|
|
115
|
-
interactionHandleRef.current = InteractionManager.createInteractionHandle();
|
|
116
|
-
});
|
|
117
|
-
|
|
118
|
-
const endInteraction = useLatestCallback(() => {
|
|
119
|
-
if (interactionHandleRef.current != null) {
|
|
120
|
-
InteractionManager.clearInteractionHandle(interactionHandleRef.current);
|
|
121
|
-
interactionHandleRef.current = null;
|
|
122
|
-
}
|
|
123
|
-
});
|
|
124
|
-
|
|
125
113
|
const hideKeyboard = useLatestCallback(() => {
|
|
126
114
|
if (keyboardDismissMode === 'on-drag') {
|
|
127
115
|
Keyboard.dismiss();
|
|
@@ -130,19 +118,16 @@ export function Drawer({
|
|
|
130
118
|
|
|
131
119
|
const onGestureBegin = useLatestCallback(() => {
|
|
132
120
|
onGestureStart?.();
|
|
133
|
-
startInteraction();
|
|
134
121
|
hideKeyboard();
|
|
135
122
|
hideStatusBar(true);
|
|
136
123
|
});
|
|
137
124
|
|
|
138
125
|
const onGestureFinish = useLatestCallback(() => {
|
|
139
126
|
onGestureEnd?.();
|
|
140
|
-
endInteraction();
|
|
141
127
|
});
|
|
142
128
|
|
|
143
129
|
const onGestureAbort = useLatestCallback(() => {
|
|
144
130
|
onGestureCancel?.();
|
|
145
|
-
endInteraction();
|
|
146
131
|
});
|
|
147
132
|
|
|
148
133
|
const hitSlop = React.useMemo(
|
|
@@ -155,9 +140,55 @@ export function Drawer({
|
|
|
155
140
|
[isRight, isOpen, swipeEdgeWidth]
|
|
156
141
|
);
|
|
157
142
|
|
|
143
|
+
const [initialWidth] = React.useState(() => Dimensions.get('window').width);
|
|
144
|
+
|
|
145
|
+
const layoutWidth = useSharedValue(initialWidth);
|
|
146
|
+
const translationX = useSharedValue(
|
|
147
|
+
getDrawerTranslationX(open, initialWidth)
|
|
148
|
+
);
|
|
149
|
+
|
|
150
|
+
const contentRef = React.useRef<View>(null);
|
|
151
|
+
|
|
152
|
+
React.useLayoutEffect(() => {
|
|
153
|
+
const measureLayout = () => {
|
|
154
|
+
contentRef.current?.measure((_x, _y, width) => {
|
|
155
|
+
layoutWidth.set(width);
|
|
156
|
+
translationX.set(getDrawerTranslationX(open, width));
|
|
157
|
+
});
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
measureLayout();
|
|
161
|
+
|
|
162
|
+
// FIXME: the layout is off after screen rotation
|
|
163
|
+
// Measure the layout again on screen rotation
|
|
164
|
+
let handle: number | undefined;
|
|
165
|
+
|
|
166
|
+
const subscription = Dimensions.addEventListener('change', () => {
|
|
167
|
+
// The measurement is not accurate without the delay
|
|
168
|
+
handle = requestAnimationFrame(() => {
|
|
169
|
+
measureLayout();
|
|
170
|
+
});
|
|
171
|
+
});
|
|
172
|
+
|
|
173
|
+
return () => {
|
|
174
|
+
if (handle != null) {
|
|
175
|
+
cancelAnimationFrame(handle);
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
subscription.remove();
|
|
179
|
+
};
|
|
180
|
+
|
|
181
|
+
// only measure on initial render
|
|
182
|
+
// subsequent updates will be handled by onLayout
|
|
183
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
184
|
+
}, []);
|
|
185
|
+
|
|
186
|
+
const onLayout = (event: LayoutChangeEvent) => {
|
|
187
|
+
layoutWidth.set(event.nativeEvent.layout.width);
|
|
188
|
+
};
|
|
189
|
+
|
|
158
190
|
const touchStartX = useSharedValue(0);
|
|
159
191
|
const touchX = useSharedValue(0);
|
|
160
|
-
const translationX = useSharedValue(getDrawerTranslationX(open));
|
|
161
192
|
const gestureState = useSharedValue<GestureState>(GestureState.UNDETERMINED);
|
|
162
193
|
|
|
163
194
|
const onAnimationStart = useLatestCallback((open: boolean) => {
|
|
@@ -174,31 +205,47 @@ export function Drawer({
|
|
|
174
205
|
}
|
|
175
206
|
);
|
|
176
207
|
|
|
208
|
+
const animatingTo = useSharedValue<'open' | 'close' | null>(null);
|
|
209
|
+
|
|
177
210
|
const toggleDrawer = React.useCallback(
|
|
178
211
|
(open: boolean, velocity?: number) => {
|
|
179
212
|
'worklet';
|
|
180
213
|
|
|
181
|
-
|
|
214
|
+
touchStartX.set(0);
|
|
215
|
+
touchX.set(0);
|
|
216
|
+
|
|
217
|
+
const containerWidth = layoutWidth.get();
|
|
218
|
+
const toValue = getDrawerTranslationX(open, containerWidth);
|
|
219
|
+
|
|
220
|
+
if (translationX.get() === toValue) {
|
|
221
|
+
return;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
if (animatingTo.get() === (open ? 'open' : 'close')) {
|
|
225
|
+
return;
|
|
226
|
+
}
|
|
182
227
|
|
|
183
228
|
if (velocity === undefined) {
|
|
184
229
|
runOnJS(onAnimationStart)(open);
|
|
185
230
|
}
|
|
186
231
|
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
232
|
+
animatingTo.set(open ? 'open' : 'close');
|
|
233
|
+
translationX.set(
|
|
234
|
+
withSpring(
|
|
235
|
+
toValue,
|
|
236
|
+
{
|
|
237
|
+
velocity,
|
|
238
|
+
stiffness: 1000,
|
|
239
|
+
damping: 500,
|
|
240
|
+
mass: 3,
|
|
241
|
+
overshootClamping: true,
|
|
242
|
+
reduceMotion: ReduceMotion.Never,
|
|
243
|
+
},
|
|
244
|
+
(finished) => {
|
|
245
|
+
animatingTo.set(null);
|
|
246
|
+
runOnJS(onAnimationEnd)(open, finished);
|
|
247
|
+
}
|
|
248
|
+
)
|
|
202
249
|
);
|
|
203
250
|
|
|
204
251
|
if (open) {
|
|
@@ -208,18 +255,22 @@ export function Drawer({
|
|
|
208
255
|
}
|
|
209
256
|
},
|
|
210
257
|
[
|
|
211
|
-
getDrawerTranslationX,
|
|
212
|
-
onAnimationEnd,
|
|
213
|
-
onAnimationStart,
|
|
214
|
-
onClose,
|
|
215
|
-
onOpen,
|
|
216
258
|
touchStartX,
|
|
217
259
|
touchX,
|
|
260
|
+
layoutWidth,
|
|
261
|
+
getDrawerTranslationX,
|
|
218
262
|
translationX,
|
|
263
|
+
animatingTo,
|
|
264
|
+
onAnimationStart,
|
|
265
|
+
onAnimationEnd,
|
|
266
|
+
onOpen,
|
|
267
|
+
onClose,
|
|
219
268
|
]
|
|
220
269
|
);
|
|
221
270
|
|
|
222
|
-
React.useEffect(() =>
|
|
271
|
+
React.useEffect(() => {
|
|
272
|
+
toggleDrawer(open);
|
|
273
|
+
}, [animatingTo, open, toggleDrawer]);
|
|
223
274
|
|
|
224
275
|
const startX = useSharedValue(0);
|
|
225
276
|
|
|
@@ -228,9 +279,9 @@ export function Drawer({
|
|
|
228
279
|
.onBegin((event) => {
|
|
229
280
|
'worklet';
|
|
230
281
|
|
|
231
|
-
startX.
|
|
232
|
-
gestureState.
|
|
233
|
-
touchStartX.
|
|
282
|
+
startX.set(translationX.get());
|
|
283
|
+
gestureState.set(event.state);
|
|
284
|
+
touchStartX.set(event.x);
|
|
234
285
|
})
|
|
235
286
|
.onStart(() => {
|
|
236
287
|
'worklet';
|
|
@@ -240,14 +291,14 @@ export function Drawer({
|
|
|
240
291
|
.onChange((event) => {
|
|
241
292
|
'worklet';
|
|
242
293
|
|
|
243
|
-
touchX.
|
|
244
|
-
translationX.
|
|
245
|
-
gestureState.
|
|
294
|
+
touchX.set(event.x);
|
|
295
|
+
translationX.set(startX.get() + event.translationX);
|
|
296
|
+
gestureState.set(event.state);
|
|
246
297
|
})
|
|
247
298
|
.onEnd((event, success) => {
|
|
248
299
|
'worklet';
|
|
249
300
|
|
|
250
|
-
gestureState.
|
|
301
|
+
gestureState.set(event.state);
|
|
251
302
|
|
|
252
303
|
if (!success) {
|
|
253
304
|
runOnJS(onGestureAbort)();
|
|
@@ -300,6 +351,11 @@ export function Drawer({
|
|
|
300
351
|
]);
|
|
301
352
|
|
|
302
353
|
const translateX = useDerivedValue(() => {
|
|
354
|
+
const drawerWidth = getDrawerWidthNative({
|
|
355
|
+
containerWidth: layoutWidth.get(),
|
|
356
|
+
customWidth,
|
|
357
|
+
});
|
|
358
|
+
|
|
303
359
|
// Comment stolen from react-native-gesture-handler/DrawerLayout
|
|
304
360
|
//
|
|
305
361
|
// While closing the drawer when user starts gesture outside of its area (in greyed
|
|
@@ -326,28 +382,34 @@ export function Drawer({
|
|
|
326
382
|
//
|
|
327
383
|
// This is used only when drawerType is "front"
|
|
328
384
|
const touchDistance =
|
|
329
|
-
drawerType === 'front' && gestureState.
|
|
385
|
+
drawerType === 'front' && gestureState.get() === GestureState.ACTIVE
|
|
330
386
|
? minmax(
|
|
331
387
|
drawerPosition === 'left'
|
|
332
|
-
? touchStartX.
|
|
333
|
-
:
|
|
388
|
+
? touchStartX.get() - drawerWidth
|
|
389
|
+
: layoutWidth.get() - drawerWidth - touchStartX.get(),
|
|
334
390
|
0,
|
|
335
|
-
|
|
391
|
+
layoutWidth.get()
|
|
336
392
|
)
|
|
337
393
|
: 0;
|
|
338
394
|
|
|
339
395
|
const translateX =
|
|
340
396
|
drawerPosition === 'left'
|
|
341
|
-
? minmax(translationX.
|
|
342
|
-
: minmax(translationX.
|
|
397
|
+
? minmax(translationX.get() + touchDistance, -drawerWidth, 0)
|
|
398
|
+
: minmax(translationX.get() - touchDistance, 0, drawerWidth);
|
|
343
399
|
|
|
344
400
|
return translateX;
|
|
345
401
|
});
|
|
346
402
|
|
|
347
403
|
const drawerAnimatedStyle = useAnimatedStyle(() => {
|
|
348
|
-
const
|
|
404
|
+
const drawerWidth = getDrawerWidthNative({
|
|
405
|
+
containerWidth: layoutWidth.get(),
|
|
406
|
+
customWidth,
|
|
407
|
+
});
|
|
408
|
+
|
|
409
|
+
const distanceFromEdge = layoutWidth.get() - drawerWidth;
|
|
349
410
|
|
|
350
411
|
return {
|
|
412
|
+
width: drawerWidth,
|
|
351
413
|
// FIXME: Reanimated skips committing to the shadow tree if no layout props are animated
|
|
352
414
|
// This results in pressables not getting their correct position and can't be pressed
|
|
353
415
|
// So we animate the zIndex to force the commit
|
|
@@ -370,7 +432,7 @@ export function Drawer({
|
|
|
370
432
|
{
|
|
371
433
|
translateX:
|
|
372
434
|
// The drawer stays in place when `drawerType` is `back`
|
|
373
|
-
(drawerType === 'back' ? 0 : translateX.
|
|
435
|
+
(drawerType === 'back' ? 0 : translateX.get()) +
|
|
374
436
|
(direction === 'rtl'
|
|
375
437
|
? drawerPosition === 'left'
|
|
376
438
|
? -distanceFromEdge
|
|
@@ -382,18 +444,23 @@ export function Drawer({
|
|
|
382
444
|
],
|
|
383
445
|
};
|
|
384
446
|
}, [
|
|
447
|
+
customWidth,
|
|
385
448
|
direction,
|
|
386
449
|
drawerPosition,
|
|
387
450
|
drawerType,
|
|
388
|
-
|
|
389
|
-
layout.width,
|
|
451
|
+
layoutWidth,
|
|
390
452
|
translateX,
|
|
391
453
|
]);
|
|
392
454
|
|
|
393
455
|
const contentAnimatedStyle = useAnimatedStyle(() => {
|
|
456
|
+
const drawerWidth = getDrawerWidthNative({
|
|
457
|
+
containerWidth: layoutWidth.get(),
|
|
458
|
+
customWidth,
|
|
459
|
+
});
|
|
460
|
+
|
|
394
461
|
return {
|
|
395
462
|
// FIXME: Force Reanimated to commit to the shadow tree
|
|
396
|
-
zIndex: translateX.
|
|
463
|
+
zIndex: translateX.get() === 0 ? 0 : drawerType === 'back' ? 2 : 1,
|
|
397
464
|
transform:
|
|
398
465
|
drawerType === 'permanent'
|
|
399
466
|
? // Reanimated needs the property to be present, but it results in Browser bug
|
|
@@ -405,19 +472,24 @@ export function Drawer({
|
|
|
405
472
|
// The screen content stays in place when `drawerType` is `front`
|
|
406
473
|
drawerType === 'front'
|
|
407
474
|
? 0
|
|
408
|
-
: translateX.
|
|
475
|
+
: translateX.get() +
|
|
409
476
|
drawerWidth * (drawerPosition === 'left' ? 1 : -1),
|
|
410
477
|
},
|
|
411
478
|
],
|
|
412
479
|
};
|
|
413
|
-
}, [drawerPosition, drawerType,
|
|
480
|
+
}, [customWidth, drawerPosition, drawerType, layoutWidth, translateX]);
|
|
414
481
|
|
|
415
482
|
const progress = useDerivedValue(() => {
|
|
483
|
+
const containerWidth = layoutWidth.get();
|
|
484
|
+
|
|
416
485
|
return drawerType === 'permanent'
|
|
417
486
|
? 1
|
|
418
487
|
: interpolate(
|
|
419
|
-
translateX.
|
|
420
|
-
[
|
|
488
|
+
translateX.get(),
|
|
489
|
+
[
|
|
490
|
+
getDrawerTranslationX(false, containerWidth),
|
|
491
|
+
getDrawerTranslationX(true, containerWidth),
|
|
492
|
+
],
|
|
421
493
|
[0, 1]
|
|
422
494
|
);
|
|
423
495
|
});
|
|
@@ -442,7 +514,11 @@ export function Drawer({
|
|
|
442
514
|
},
|
|
443
515
|
]}
|
|
444
516
|
>
|
|
445
|
-
<Animated.View
|
|
517
|
+
<Animated.View
|
|
518
|
+
ref={contentRef}
|
|
519
|
+
onLayout={onLayout}
|
|
520
|
+
style={[styles.content, contentAnimatedStyle]}
|
|
521
|
+
>
|
|
446
522
|
<View
|
|
447
523
|
aria-hidden={isOpen && drawerType !== 'permanent'}
|
|
448
524
|
style={styles.content}
|
|
@@ -464,7 +540,6 @@ export function Drawer({
|
|
|
464
540
|
style={[
|
|
465
541
|
styles.drawer,
|
|
466
542
|
{
|
|
467
|
-
width: drawerWidth,
|
|
468
543
|
position:
|
|
469
544
|
drawerType === 'permanent' ? 'relative' : 'absolute',
|
|
470
545
|
},
|
package/src/views/Drawer.tsx
CHANGED
|
@@ -23,14 +23,15 @@ export function Drawer({
|
|
|
23
23
|
children,
|
|
24
24
|
style,
|
|
25
25
|
}: DrawerProps) {
|
|
26
|
+
const flattenedDrawerStyle = StyleSheet.flatten(drawerStyle) || {};
|
|
26
27
|
const drawerWidth = getDrawerWidthWeb({
|
|
27
|
-
drawerStyle,
|
|
28
|
+
drawerStyle: flattenedDrawerStyle,
|
|
28
29
|
});
|
|
29
30
|
|
|
30
31
|
const progress = useFakeSharedValue(open ? 1 : 0);
|
|
31
32
|
|
|
32
33
|
React.useEffect(() => {
|
|
33
|
-
progress.
|
|
34
|
+
progress.set(open ? 1 : 0);
|
|
34
35
|
}, [open, progress]);
|
|
35
36
|
|
|
36
37
|
const drawerRef = React.useRef<View>(null);
|
|
@@ -114,18 +115,15 @@ export function Drawer({
|
|
|
114
115
|
drawerStyle,
|
|
115
116
|
]}
|
|
116
117
|
>
|
|
117
|
-
{
|
|
118
|
+
<Inert enabled={drawerType !== 'permanent' && !isOpen}>
|
|
119
|
+
{renderDrawerContent()}
|
|
120
|
+
</Inert>
|
|
118
121
|
</View>
|
|
119
122
|
);
|
|
120
123
|
|
|
121
124
|
const mainContent = (
|
|
122
125
|
<View key="content" style={[styles.content, contentAnimatedStyle]}>
|
|
123
|
-
<
|
|
124
|
-
aria-hidden={isOpen && drawerType !== 'permanent'}
|
|
125
|
-
style={styles.content}
|
|
126
|
-
>
|
|
127
|
-
{children}
|
|
128
|
-
</View>
|
|
126
|
+
<Inert enabled={drawerType !== 'permanent' && isOpen}>{children}</Inert>
|
|
129
127
|
{drawerType !== 'permanent' ? (
|
|
130
128
|
<Overlay
|
|
131
129
|
open={open}
|
|
@@ -149,6 +147,30 @@ export function Drawer({
|
|
|
149
147
|
);
|
|
150
148
|
}
|
|
151
149
|
|
|
150
|
+
function Inert({
|
|
151
|
+
enabled,
|
|
152
|
+
children,
|
|
153
|
+
}: {
|
|
154
|
+
enabled: boolean;
|
|
155
|
+
children: React.ReactNode;
|
|
156
|
+
}) {
|
|
157
|
+
return (
|
|
158
|
+
<div
|
|
159
|
+
inert={enabled}
|
|
160
|
+
aria-hidden={enabled}
|
|
161
|
+
style={{
|
|
162
|
+
display: 'flex',
|
|
163
|
+
flexDirection: 'column',
|
|
164
|
+
flexGrow: 1,
|
|
165
|
+
flexShrink: 1,
|
|
166
|
+
flexBasis: 'auto',
|
|
167
|
+
}}
|
|
168
|
+
>
|
|
169
|
+
{children}
|
|
170
|
+
</div>
|
|
171
|
+
);
|
|
172
|
+
}
|
|
173
|
+
|
|
152
174
|
const styles = StyleSheet.create({
|
|
153
175
|
container: {
|
|
154
176
|
flex: 1,
|
|
@@ -16,8 +16,11 @@ export function Overlay({
|
|
|
16
16
|
...rest
|
|
17
17
|
}: OverlayProps) {
|
|
18
18
|
const animatedStyle = useAnimatedStyle(() => {
|
|
19
|
+
const active = progress.value > PROGRESS_EPSILON;
|
|
20
|
+
|
|
19
21
|
return {
|
|
20
22
|
opacity: progress.value,
|
|
23
|
+
pointerEvents: active ? 'auto' : 'none',
|
|
21
24
|
};
|
|
22
25
|
}, [progress]);
|
|
23
26
|
|
|
@@ -25,7 +28,6 @@ export function Overlay({
|
|
|
25
28
|
const active = progress.value > PROGRESS_EPSILON;
|
|
26
29
|
|
|
27
30
|
return {
|
|
28
|
-
'pointerEvents': active ? 'auto' : 'none',
|
|
29
31
|
'aria-hidden': !active,
|
|
30
32
|
} as const;
|
|
31
33
|
}, [progress]);
|