Compare commits

..

9 Commits

Author SHA1 Message Date
Satyajit Sahoo
f271e299ac chore: publish
- @react-navigation/core@5.0.0-alpha.25
 - @react-navigation/stack@5.0.0-alpha.38
2019-11-29 18:10:20 +01:00
Michał Osadnik
5a0dfa1a15 fix: wrap reset and resetRoot inside transaction (#189)
fixes #185
2019-11-29 17:40:28 +01:00
Satyajit Sahoo
2750cad272 fix: respect custom safearea insets when calculating header height
fixes #190
2019-11-29 17:25:34 +01:00
Satyajit Sahoo
2e715ef48e chore: publish
- @react-navigation/drawer@5.0.0-alpha.24
2019-11-27 13:07:20 +01:00
Satyajit Sahoo
7080517c91 fix: enable gestures by default in drawer. closes #188 2019-11-27 13:04:31 +01:00
osdnk
d733066476 chore: publish
- @react-navigation/core@5.0.0-alpha.24
 - @react-navigation/example@5.0.0-alpha.23
 - @react-navigation/material-top-tabs@5.0.0-alpha.19
 - @react-navigation/native-stack@5.0.0-alpha.14
2019-11-20 16:01:25 +01:00
osdnk
d0099f0968 chore: bump rntv 2019-11-20 16:00:30 +01:00
Thibault Malbranche
c3e9e4578e fix: allow passing partial params to setParams (#177)
Since params get merged, no need to send them all I think :)
2019-11-19 22:58:44 +01:00
Satyajit Sahoo
cb426d06de docs: add large title example 2019-11-18 01:16:33 +01:00
20 changed files with 273 additions and 118 deletions

View File

@@ -3,6 +3,28 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
# [5.0.0-alpha.25](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/core@5.0.0-alpha.24...@react-navigation/core@5.0.0-alpha.25) (2019-11-29)
### Bug Fixes
* wrap reset and resetRoot inside transaction ([#189](https://github.com/react-navigation/navigation-ex/issues/189)) ([5a0dfa1](https://github.com/react-navigation/navigation-ex/commit/5a0dfa1a155715714c8483fafc5a94dbc5120754)), closes [#185](https://github.com/react-navigation/navigation-ex/issues/185)
# [5.0.0-alpha.24](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/core@5.0.0-alpha.23...@react-navigation/core@5.0.0-alpha.24) (2019-11-20)
### Bug Fixes
* allow passing partial params to `setParams` ([#177](https://github.com/react-navigation/navigation-ex/issues/177)) ([c3e9e45](https://github.com/react-navigation/navigation-ex/commit/c3e9e4578e98aa5b0635949a288e19eaeec12c85))
# [5.0.0-alpha.23](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/core@5.0.0-alpha.22...@react-navigation/core@5.0.0-alpha.23) (2019-11-17)

View File

@@ -6,7 +6,7 @@
"react-native",
"react-navigation"
],
"version": "5.0.0-alpha.23",
"version": "5.0.0-alpha.25",
"license": "MIT",
"repository": {
"type": "git",

View File

@@ -112,79 +112,6 @@ const Container = React.forwardRef(function NavigationContainer(
const isFirstMountRef = React.useRef<boolean>(true);
const skipTrackingRef = React.useRef<boolean>(false);
const reset = React.useCallback((state: NavigationState) => {
skipTrackingRef.current = true;
setNavigationState(state);
}, []);
const { trackState, trackAction } = useDevTools({
name: '@react-navigation',
reset,
state,
});
const { listeners, addListener: addFocusedListener } = useFocusedListeners();
const { getStateForRoute, addStateGetter } = useStateGetters();
const dispatch = (
action: NavigationAction | ((state: NavigationState) => NavigationAction)
) => {
listeners[0](navigation => navigation.dispatch(action));
};
const canGoBack = () => {
const { result, handled } = listeners[0](navigation =>
navigation.canGoBack()
);
if (handled) {
return result;
} else {
return false;
}
};
const resetRoot = React.useCallback(
(state?: PartialState<NavigationState> | NavigationState) => {
trackAction('@@RESET_ROOT');
setNavigationState(state);
},
[trackAction]
);
const getRootState = React.useCallback(() => {
return getStateForRoute('root');
}, [getStateForRoute]);
React.useImperativeHandle(ref, () => ({
...(Object.keys(CommonActions) as Array<keyof typeof CommonActions>).reduce<
any
>((acc, name) => {
acc[name] = (...args: any[]) =>
dispatch(
CommonActions[name](
// @ts-ignore
...args
)
);
return acc;
}, {}),
resetRoot,
dispatch,
canGoBack,
getRootState,
}));
const builderContext = React.useMemo(
() => ({
addFocusedListener,
addStateGetter,
trackAction,
}),
[addFocusedListener, trackAction, addStateGetter]
);
const performTransaction = React.useCallback((callback: () => void) => {
if (isTransactionActiveRef.current) {
throw new Error(
@@ -222,6 +149,86 @@ const Container = React.forwardRef(function NavigationContainer(
transactionStateRef.current = navigationState;
}, []);
const reset = React.useCallback(
(state: NavigationState) => {
performTransaction(() => {
skipTrackingRef.current = true;
setState(state);
});
},
[performTransaction, setState]
);
const { trackState, trackAction } = useDevTools({
name: '@react-navigation',
reset,
state,
});
const { listeners, addListener: addFocusedListener } = useFocusedListeners();
const { getStateForRoute, addStateGetter } = useStateGetters();
const dispatch = (
action: NavigationAction | ((state: NavigationState) => NavigationAction)
) => {
listeners[0](navigation => navigation.dispatch(action));
};
const canGoBack = () => {
const { result, handled } = listeners[0](navigation =>
navigation.canGoBack()
);
if (handled) {
return result;
} else {
return false;
}
};
const resetRoot = React.useCallback(
(state?: PartialState<NavigationState> | NavigationState) => {
performTransaction(() => {
trackAction('@@RESET_ROOT');
setState(state);
});
},
[performTransaction, setState, trackAction]
);
const getRootState = React.useCallback(() => {
return getStateForRoute('root');
}, [getStateForRoute]);
React.useImperativeHandle(ref, () => ({
...(Object.keys(CommonActions) as Array<keyof typeof CommonActions>).reduce<
any
>((acc, name) => {
acc[name] = (...args: any[]) =>
dispatch(
CommonActions[name](
// @ts-ignore
...args
)
);
return acc;
}, {}),
resetRoot,
dispatch,
canGoBack,
getRootState,
}));
const builderContext = React.useMemo(
() => ({
addFocusedListener,
addStateGetter,
trackAction,
}),
[addFocusedListener, trackAction, addStateGetter]
);
const context = React.useMemo(
() => ({
state,

View File

@@ -371,7 +371,7 @@ export type NavigationHelpers<
* @param params Params object for the current route.
*/
setParams<RouteName extends keyof ParamList>(
params: ParamList[RouteName]
params: Partial<ParamList[RouteName]>
): void;
};
@@ -409,7 +409,7 @@ export type NavigationProp<
*
* @param params Params object for the current route.
*/
setParams(params: ParamList[RouteName]): void;
setParams(params: Partial<ParamList[RouteName]>): void;
/**
* Update the options for the route.

View File

@@ -3,6 +3,17 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
# [5.0.0-alpha.24](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/drawer@5.0.0-alpha.23...@react-navigation/drawer@5.0.0-alpha.24) (2019-11-27)
### Bug Fixes
* enable gestures by default in drawer. closes [#188](https://github.com/react-navigation/navigation-ex/issues/188) ([7080517](https://github.com/react-navigation/navigation-ex/commit/7080517c914b4821e07a6320de94660e50d02950))
# [5.0.0-alpha.23](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/drawer@5.0.0-alpha.22...@react-navigation/drawer@5.0.0-alpha.23) (2019-11-17)

View File

@@ -11,7 +11,7 @@
"material",
"drawer"
],
"version": "5.0.0-alpha.23",
"version": "5.0.0-alpha.24",
"license": "MIT",
"repository": {
"type": "git",

View File

@@ -97,9 +97,9 @@ type Props = {
export default class DrawerView extends React.PureComponent<Props> {
static defaultProps = {
locked: false,
drawerPostion: I18nManager.isRTL ? 'left' : 'right',
drawerType: 'front',
gestureEnabled: true,
swipeEdgeWidth: 32,
swipeVelocityThreshold: 500,
keyboardDismissMode: 'on-drag',
@@ -447,10 +447,7 @@ export default class DrawerView extends React.PureComponent<Props> {
{
nativeEvent: {
oldState: (s: Animated.Value<number>) =>
cond(
and(eq(s, State.ACTIVE), this.isGestureEnabled),
set(this.manuallyTriggerSpring, TRUE)
),
cond(eq(s, State.ACTIVE), set(this.manuallyTriggerSpring, TRUE)),
},
},
]);

View File

@@ -217,7 +217,7 @@ export default class DrawerView extends React.PureComponent<Props, State> {
<DrawerGestureContext.Provider value={this.drawerGestureRef}>
<Drawer
open={state.isDrawerOpen}
gestureEnabled={gestureEnabled === true}
gestureEnabled={gestureEnabled !== false}
onOpen={this.handleDrawerOpen}
onClose={this.handleDrawerClose}
onGestureRef={this.setDrawerGestureRef}

View File

@@ -3,6 +3,14 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
# [5.0.0-alpha.23](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/example@5.0.0-alpha.22...@react-navigation/example@5.0.0-alpha.23) (2019-11-20)
**Note:** Version bump only for package @react-navigation/example
# [5.0.0-alpha.22](https://github.com/satya164/navigation-ex/compare/@react-navigation/example@5.0.0-alpha.21...@react-navigation/example@5.0.0-alpha.22) (2019-11-17)
**Note:** Version bump only for package @react-navigation/example

View File

@@ -1,7 +1,7 @@
{
"name": "@react-navigation/example",
"description": "Demo app to showcase various functionality of React Navigation",
"version": "5.0.0-alpha.22",
"version": "5.0.0-alpha.23",
"private": true,
"workspaces": {
"nohoist": [
@@ -32,7 +32,7 @@
"react-native-reanimated-web": "npm:react-native-reanimated@^1.3.2",
"react-native-safe-area-context": "~0.6.0",
"react-native-screens": "^2.0.0-alpha.11",
"react-native-tab-view": "2.10.2",
"react-native-tab-view": "2.11.0",
"react-native-unimodules": "^0.7.0-rc.1",
"react-native-web": "^0.11.7",
"scheduler": "^0.18.0",

View File

@@ -1,5 +1,5 @@
import * as React from 'react';
import { View, StyleSheet } from 'react-native';
import { View, Text, ScrollView, StyleSheet } from 'react-native';
import { Button } from 'react-native-paper';
// eslint-disable-next-line import/no-unresolved
import { enableScreens } from 'react-native-screens';
@@ -14,7 +14,6 @@ import {
createNativeStackNavigator,
NativeStackNavigationProp,
} from '@react-navigation/native-stack';
import Article from '../Shared/Article';
import Albums from '../Shared/Albums';
type NativeStackParams = {
@@ -26,12 +25,11 @@ type NativeStackNavigation = NativeStackNavigationProp<NativeStackParams>;
const ArticleScreen = ({
navigation,
route,
}: {
navigation: NativeStackNavigation;
route: RouteProp<NativeStackParams, 'article'>;
}) => (
<React.Fragment>
<ScrollView style={styles.container} contentContainerStyle={styles.content}>
<View style={styles.buttons}>
<Button
mode="contained"
@@ -48,8 +46,66 @@ const ArticleScreen = ({
Go back
</Button>
</View>
<Article author={{ name: route.params.author }} />
</React.Fragment>
<Text style={styles.title}>What is Lorem Ipsum?</Text>
<Text style={styles.paragraph}>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry&apos;s standard dummy text ever since
the 1500s, when an unknown printer took a galley of type and scrambled it
to make a type specimen book. It has survived not only five centuries, but
also the leap into electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s with the release of Letraset
sheets containing Lorem Ipsum passages, and more recently with desktop
publishing software like Aldus PageMaker including versions of Lorem
Ipsum.
</Text>
<Text style={styles.title}>Where does it come from?</Text>
<Text style={styles.paragraph}>
Contrary to popular belief, Lorem Ipsum is not simply random text. It has
roots in a piece of classical Latin literature from 45 BC, making it over
2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney
College in Virginia, looked up one of the more obscure Latin words,
consectetur, from a Lorem Ipsum passage, and going through the cites of
the word in classical literature, discovered the undoubtable source. Lorem
Ipsum comes from sections 1.10.32 and 1.10.33 of &quot;de Finibus Bonorum
et Malorum&quot; (The Extremes of Good and Evil) by Cicero, written in 45
BC. This book is a treatise on the theory of ethics, very popular during
the Renaissance. The first line of Lorem Ipsum, &quot;Lorem ipsum dolor
sit amet..&quot;, comes from a line in section 1.10.32.
</Text>
<Text style={styles.paragraph}>
The standard chunk of Lorem Ipsum used since the 1500s is reproduced below
for those interested. Sections 1.10.32 and 1.10.33 from &quot;de Finibus
Bonorum et Malorum&quot; by Cicero are also reproduced in their exact
original form, accompanied by English versions from the 1914 translation
by H. Rackham.
</Text>
<Text style={styles.title}>Why do we use it?</Text>
<Text style={styles.paragraph}>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout. The point of using
Lorem Ipsum is that it has a more-or-less normal distribution of letters,
as opposed to using &quot;Content here, content here&quot;, making it look
like readable English. Many desktop publishing packages and web page
editors now use Lorem Ipsum as their default model text, and a search for
&quot;lorem ipsum&quot; will uncover many web sites still in their
infancy. Various versions have evolved over the years, sometimes by
accident, sometimes on purpose (injected humour and the like).
</Text>
<Text style={styles.title}>Where can I get some?</Text>
<Text style={styles.paragraph}>
There are many variations of passages of Lorem Ipsum available, but the
majority have suffered alteration in some form, by injected humour, or
randomised words which don&apos;t look even slightly believable. If you
are going to use a passage of Lorem Ipsum, you need to be sure there
isn&apos;t anything embarrassing hidden in the middle of text. All the
Lorem Ipsum generators on the Internet tend to repeat predefined chunks as
necessary, making this the first true generator on the Internet. It uses a
dictionary of over 200 Latin words, combined with a handful of model
sentence structures, to generate Lorem Ipsum which looks reasonable. The
generated Lorem Ipsum is therefore always free from repetition, injected
humour, or non-characteristic words etc.
</Text>
</ScrollView>
);
const AlbumsScreen = ({
@@ -110,10 +166,11 @@ export default function NativeStackScreen({ navigation }: Props) {
<NativeStack.Screen
name="article"
component={ArticleScreen}
options={({ route }) => ({
title: `Article by ${route.params.author}`,
})}
initialParams={{ author: 'Gandalf' }}
options={{
title: 'Lorem Ipsum',
headerLargeTitle: true,
headerHideShadow: true,
}}
/>
<NativeStack.Screen
name="album"
@@ -134,4 +191,24 @@ const styles = StyleSheet.create({
button: {
margin: 8,
},
container: {
backgroundColor: 'white',
},
content: {
paddingVertical: 16,
},
title: {
color: '#000',
fontWeight: 'bold',
fontSize: 24,
marginVertical: 8,
marginHorizontal: 16,
},
paragraph: {
color: '#000',
fontSize: 16,
lineHeight: 24,
marginVertical: 8,
marginHorizontal: 16,
},
});

View File

@@ -3,6 +3,14 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
# [5.0.0-alpha.19](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/material-top-tabs@5.0.0-alpha.18...@react-navigation/material-top-tabs@5.0.0-alpha.19) (2019-11-20)
**Note:** Version bump only for package @react-navigation/material-top-tabs
# [5.0.0-alpha.18](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/material-top-tabs@5.0.0-alpha.17...@react-navigation/material-top-tabs@5.0.0-alpha.18) (2019-11-17)
**Note:** Version bump only for package @react-navigation/material-top-tabs

View File

@@ -11,7 +11,7 @@
"material",
"tab"
],
"version": "5.0.0-alpha.18",
"version": "5.0.0-alpha.19",
"license": "MIT",
"repository": {
"type": "git",
@@ -45,7 +45,7 @@
"react-native": "~0.59.10",
"react-native-gesture-handler": "^1.5.0",
"react-native-reanimated": "^1.4.0",
"react-native-tab-view": "^2.10.1",
"react-native-tab-view": "^2.11.0",
"typescript": "^3.7.2"
},
"peerDependencies": {
@@ -54,7 +54,7 @@
"react-native": "*",
"react-native-gesture-handler": "^1.0.0",
"react-native-reanimated": "^1.0.0",
"react-native-tab-view": "^2.10.0"
"react-native-tab-view": "^2.11.0"
},
"@react-native-community/bob": {
"source": "src",

View File

@@ -3,6 +3,14 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
# [5.0.0-alpha.14](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/native-stack@5.0.0-alpha.13...@react-navigation/native-stack@5.0.0-alpha.14) (2019-11-20)
**Note:** Version bump only for package @react-navigation/native-stack
# [5.0.0-alpha.13](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/native-stack@5.0.0-alpha.12...@react-navigation/native-stack@5.0.0-alpha.13) (2019-11-17)
**Note:** Version bump only for package @react-navigation/native-stack

View File

@@ -6,7 +6,7 @@
"react-native",
"react-navigation"
],
"version": "5.0.0-alpha.13",
"version": "5.0.0-alpha.14",
"license": "MIT",
"repository": {
"type": "git",

View File

@@ -85,6 +85,8 @@ export type NativeStackNavigationOptions = {
headerTranslucent?: boolean;
/**
* Boolean to set native property to prefer large title header (like in iOS setting).
* For large title to collapse on scroll, the content of the screen should be wrapped in a scrollable view such as `ScrollView` or `FlatList`.
* If the scrollable area doesn't fill the screen, the large title won't collapse on scroll.
* Only supported on iOS.
*
* @platform ios

View File

@@ -3,6 +3,17 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
# [5.0.0-alpha.38](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/stack@5.0.0-alpha.37...@react-navigation/stack@5.0.0-alpha.38) (2019-11-29)
### Bug Fixes
* respect custom safearea insets when calculating header height ([2750cad](https://github.com/react-navigation/navigation-ex/commit/2750cad272def2e701ba2823a6e5693cee61eff0)), closes [#190](https://github.com/react-navigation/navigation-ex/issues/190)
# [5.0.0-alpha.37](https://github.com/react-navigation/navigation-ex/compare/@react-navigation/stack@5.0.0-alpha.36...@react-navigation/stack@5.0.0-alpha.37) (2019-11-17)

View File

@@ -10,7 +10,7 @@
"android",
"stack"
],
"version": "5.0.0-alpha.37",
"version": "5.0.0-alpha.38",
"license": "MIT",
"repository": {
"type": "git",

View File

@@ -121,15 +121,19 @@ const getFloatingHeaderHeights = (
layout: Layout,
previous: Record<string, number>
) => {
const defaultHeaderHeight = getDefaultHeaderHeight(layout, insets);
return routes.reduce<Record<string, number>>((acc, curr) => {
const { options = {} } = descriptors[curr.key] || {};
const { height = previous[curr.key] } = StyleSheet.flatten(
options.headerStyle || {}
);
acc[curr.key] = typeof height === 'number' ? height : defaultHeaderHeight;
acc[curr.key] =
typeof height === 'number'
? height
: getDefaultHeaderHeight(layout, {
...insets,
...options.safeAreaInsets,
});
return acc;
}, {});
@@ -263,12 +267,17 @@ export default class Stack extends React.Component<Props, State> {
return;
}
this.setState(state => ({
floatingHeaderHeights: {
...state.floatingHeaderHeights,
[route.key]: height,
},
}));
// Update in next frame to make sure it's applied after screen's onLayout
requestAnimationFrame(() =>
requestAnimationFrame(() => {
this.setState(state => ({
floatingHeaderHeights: {
...state.floatingHeaderHeights,
[route.key]: height,
},
}));
})
);
};
private handleTransitionStart = (

View File

@@ -13220,15 +13220,10 @@ react-native-screens@^2.0.0-alpha.11:
dependencies:
debounce "^1.2.0"
react-native-tab-view@2.10.2:
version "2.10.2"
resolved "https://registry.yarnpkg.com/react-native-tab-view/-/react-native-tab-view-2.10.2.tgz#35ae92f574f2220312138f479a99ad3cbf981b6f"
integrity sha512-DJMz7WDlQiykgvojaEPM5MKFNMlGC89SMhX++wkD6iJ4TK04NyUgvUKsZYuY7u6k0o0HtG7sNeexFsbxfwhrVg==
react-native-tab-view@^2.10.1:
version "2.10.1"
resolved "https://registry.yarnpkg.com/react-native-tab-view/-/react-native-tab-view-2.10.1.tgz#3ddff9858a1f7da7477dc9f52a69a6bf17f31541"
integrity sha512-U4swsor8h1A1mkBFUX+k1FXvijVsh7ZhD01O0cxKjR5Q7hBXCCygP3rs9jCjnoRMhyMJHsbmeZypUs5l+mVdGQ==
react-native-tab-view@2.11.0, react-native-tab-view@^2.11.0:
version "2.11.0"
resolved "https://registry.yarnpkg.com/react-native-tab-view/-/react-native-tab-view-2.11.0.tgz#2e57d1f617ccc88c7f452708804f3409f880b700"
integrity sha512-vqetlxGO7A8bnqvXcB50MWpRZAImXFrDGz1WCQKdCqe03Ey3ZzENe7yLuWrtBJYlepGfOLAsmCXv+wW82Yfm1w==
react-native-testing-library@^1.9.1:
version "1.11.1"