Merge pull request #22484 from connectdotz/react-native-popup-dialog-textStyle

[react-native-popup-dialog] fixed DialogButton textStyle type
This commit is contained in:
Paul van Brenk
2017-12-28 15:42:41 -08:00
committed by GitHub
2 changed files with 40 additions and 38 deletions
+3 -2
View File
@@ -1,11 +1,12 @@
// Type definitions for react-native-popup-dialog 0.9
// Project: https://github.com/jacklam718/react-native-popup-dialog/blob/master/README.md
// Definitions by: Paito Anderson <https://github.com/PaitoAnderson>
// connectdotz <https://github.com/connectdotz>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 2.3
import * as React from 'react';
import { GestureResponderEvent, StyleProp, ViewStyle } from 'react-native';
import { GestureResponderEvent, StyleProp, ViewStyle, TextStyle } from 'react-native';
export type AlignTypes = 'left' | 'right' | 'center';
export type OverlayPointerEventTypes = 'auto' | 'none';
@@ -16,7 +17,7 @@ export interface DialogButtonProps {
align?: AlignTypes;
onPress?: (event: GestureResponderEvent) => void;
buttonStyle?: StyleProp<ViewStyle>;
textStyle?: StyleProp<ViewStyle>;
textStyle?: StyleProp<TextStyle>;
textContainerStyle?: StyleProp<ViewStyle>;
disabled?: boolean;
activeOpacity?: number;
@@ -6,7 +6,7 @@ import PopupDialog, {
SlideAnimation,
ScaleAnimation,
FadeAnimation,
} from 'react-native-popup-dialog';
} from 'react-native-popup-dialog';
const slideAnimation = new SlideAnimation({ slideFrom: 'bottom' });
const scaleAnimation = new ScaleAnimation();
@@ -15,41 +15,42 @@ const fadeAnimation = new FadeAnimation({ animationDuration: 150 });
class Test extends React.Component<any> {
render() {
return (
<View>
<PopupDialog
dialogTitle={<DialogTitle title="Popup Dialog - Fade Animation" />}
dialogAnimation={fadeAnimation}
/>
<PopupDialog
dialogTitle={<DialogTitle title="Popup Dialog - Scale Animation" />}
dialogAnimation={scaleAnimation}
actions={[
<DialogButton
text="CLOSE"
onPress={(event) => {}}
key="button-1"
/>,
]}
/>
<PopupDialog
dialogTitle={<DialogTitle title="Popup Dialog - Slide Animation" />}
width={300}
height={300}
dialogAnimation={slideAnimation}
containerStyle={styles.testStyle}
dialogStyle={styles.testStyle}
animationDuration={150}
overlayPointerEvents='auto'
overlayBackgroundColor='white'
overlayOpacity={0.5}
dismissOnTouchOutside={false}
dismissOnHardwareBackPress={false}
haveOverlay={true}
show={true}
onShown={() => { console.log('onShown'); }}
onDismissed={() => { console.log('onDismissed'); }}
/>
</View>);
<View>
<PopupDialog
dialogTitle={<DialogTitle title="Popup Dialog - Fade Animation" />}
dialogAnimation={fadeAnimation}
/>
<PopupDialog
dialogTitle={<DialogTitle title="Popup Dialog - Scale Animation" />}
dialogAnimation={scaleAnimation}
actions={[
<DialogButton
text="CLOSE"
onPress={(event) => { }}
textStyle={{ color: "red" }}
key="button-1"
/>,
]}
/>
<PopupDialog
dialogTitle={<DialogTitle title="Popup Dialog - Slide Animation" />}
width={300}
height={300}
dialogAnimation={slideAnimation}
containerStyle={styles.testStyle}
dialogStyle={styles.testStyle}
animationDuration={150}
overlayPointerEvents='auto'
overlayBackgroundColor='white'
overlayOpacity={0.5}
dismissOnTouchOutside={false}
dismissOnHardwareBackPress={false}
haveOverlay={true}
show={true}
onShown={() => { console.log('onShown'); }}
onDismissed={() => { console.log('onDismissed'); }}
/>
</View>);
}
}