From 7ddae651ef3cb81a87f9f511c698d4cae84a9aef Mon Sep 17 00:00:00 2001 From: Tim Date: Thu, 5 Mar 2020 12:41:07 +0100 Subject: [PATCH 1/8] feature: add RippleOverflow prop --- index.js | 4 ++++ package.json | 2 +- readme.md | 1 + 3 files changed, 6 insertions(+), 1 deletion(-) diff --git a/index.js b/index.js index 004e4c9..3c91a66 100644 --- a/index.js +++ b/index.js @@ -23,6 +23,7 @@ export default class Ripple extends PureComponent { rippleCentered: false, rippleSequential: false, rippleFades: true, + rippleOverflow: false, disabled: false, onRippleAnimation: (animation, callback) => animation.start(callback), @@ -40,6 +41,7 @@ export default class Ripple extends PureComponent { rippleCentered: PropTypes.bool, rippleSequential: PropTypes.bool, rippleFades: PropTypes.bool, + rippleOverflow: PropTypes.bool, disabled: PropTypes.bool, onRippleAnimation: PropTypes.func, @@ -232,6 +234,7 @@ export default class Ripple extends PureComponent { rippleCentered, rippleSequential, rippleFades, + rippleOverflow, ...props } = this.props; @@ -260,6 +263,7 @@ export default class Ripple extends PureComponent { let containerStyle = { borderRadius: rippleContainerBorderRadius, + overflow: rippleOverflow ? 'visible' : 'hidden' }; return ( diff --git a/package.json b/package.json index 5d6bf65..6cc0851 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-material-ripple", - "version": "0.9.1", + "version": "0.9.2", "license": "BSD-3-Clause", "author": "Alexander Nazarov ", diff --git a/readme.md b/readme.md index 8087c8e..eff53c9 100644 --- a/readme.md +++ b/readme.md @@ -62,6 +62,7 @@ class Example extends Component { rippleCentered | Ripple always starts from center | Boolean | false rippleSequential | Ripple should start in sequence | Boolean | false rippleFades | Ripple fades out | Boolean | true + rippleOverflow | Ripple can overflow its container | Boolean | false disabled | Ripple should ignore touches | Boolean | false onPressIn | Touch moved in or started callback | Function | - onPressOut | Touch moved out or terminated callback | Function | - From 8308d4af37218ca00a4a8b6b7282bff8494f55fc Mon Sep 17 00:00:00 2001 From: Tim Date: Thu, 5 Mar 2020 15:28:04 +0100 Subject: [PATCH 2/8] feat: add typescript definition --- index.d.ts | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 index.d.ts diff --git a/index.d.ts b/index.d.ts new file mode 100644 index 0000000..06776dd --- /dev/null +++ b/index.d.ts @@ -0,0 +1,30 @@ +declare module "react-native-material-ripple" { + import { PureComponent } from "react"; + import { + TouchableWithoutFeedbackProps, + Animated, + ViewProps + } from "react-native"; + + export interface RippleProps + extends TouchableWithoutFeedbackProps, + ViewProps { + rippleColor?: string; + rippleOpacity?: number; + rippleDuration?: number; + rippleSize?: number; + rippleContainerBorderRadius?: number; + rippleCentered?: boolean; + rippleSequential?: boolean; + rippleFades?: boolean; + rippleOverflow?: boolean; + disabled?: boolean; + + onRippleAnimation?: ( + animation: Animated.TimingAnimationConfig, + callback: () => void + ) => void; + } + + export default class Ripple extends PureComponent {} +} From 435f5a05f707a497c2b46015da7bc920538d52b0 Mon Sep 17 00:00:00 2001 From: Tim Date: Thu, 5 Mar 2020 15:37:56 +0100 Subject: [PATCH 3/8] update typscript definition --- index.js => index | 0 index.d.ts | 21 +++++++++++---------- 2 files changed, 11 insertions(+), 10 deletions(-) rename index.js => index (100%) diff --git a/index.js b/index similarity index 100% rename from index.js rename to index diff --git a/index.d.ts b/index.d.ts index 06776dd..4016a84 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,14 +1,12 @@ declare module "react-native-material-ripple" { - import { PureComponent } from "react"; + import React from "react"; import { - TouchableWithoutFeedbackProps, Animated, - ViewProps + ViewProps, + TouchableWithoutFeedbackProps } from "react-native"; - export interface RippleProps - extends TouchableWithoutFeedbackProps, - ViewProps { + export type RippleProps = { rippleColor?: string; rippleOpacity?: number; rippleDuration?: number; @@ -19,12 +17,15 @@ declare module "react-native-material-ripple" { rippleFades?: boolean; rippleOverflow?: boolean; disabled?: boolean; - onRippleAnimation?: ( - animation: Animated.TimingAnimationConfig, + animation: Animated.CompositeAnimation, callback: () => void ) => void; - } + }; + + const Ripple: React.ComponentType & + TouchableWithoutFeedbackProps>; - export default class Ripple extends PureComponent {} + export default Ripple; } From 2bc42693919ba174a117f27ccd6fb21373596fd6 Mon Sep 17 00:00:00 2001 From: Tim Date: Thu, 5 Mar 2020 15:49:37 +0100 Subject: [PATCH 4/8] revert to previous types --- index.d.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/index.d.ts b/index.d.ts index 4016a84..b5dcb7d 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,10 +1,10 @@ -declare module "react-native-material-ripple" { - import React from "react"; +declare module 'react-native-material-ripple' { + import React from 'react'; import { Animated, ViewProps, - TouchableWithoutFeedbackProps - } from "react-native"; + TouchableWithoutFeedbackProps, + } from 'react-native'; export type RippleProps = { rippleColor?: string; @@ -19,7 +19,7 @@ declare module "react-native-material-ripple" { disabled?: boolean; onRippleAnimation?: ( animation: Animated.CompositeAnimation, - callback: () => void + callback: () => void, ) => void; }; @@ -28,4 +28,4 @@ declare module "react-native-material-ripple" { TouchableWithoutFeedbackProps>; export default Ripple; -} +} \ No newline at end of file From c5d2536e9f2f5c7f3180139c38abd8da0c5977c6 Mon Sep 17 00:00:00 2001 From: Tim Date: Thu, 5 Mar 2020 15:53:48 +0100 Subject: [PATCH 5/8] update viewprop --- index.d.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.d.ts b/index.d.ts index b5dcb7d..aab44a3 100644 --- a/index.d.ts +++ b/index.d.ts @@ -24,8 +24,8 @@ declare module 'react-native-material-ripple' { }; const Ripple: React.ComponentType & - TouchableWithoutFeedbackProps>; + (Animated.AnimatedProps | ViewStyle) & + TouchableWithoutFeedbackProps>; export default Ripple; } \ No newline at end of file From d34472f43fac4ebf62fc2a9ae4494728090ac2e8 Mon Sep 17 00:00:00 2001 From: Tim Date: Thu, 5 Mar 2020 15:58:12 +0100 Subject: [PATCH 6/8] import ViewStyle --- index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/index.d.ts b/index.d.ts index aab44a3..426d5ae 100644 --- a/index.d.ts +++ b/index.d.ts @@ -4,6 +4,7 @@ declare module 'react-native-material-ripple' { Animated, ViewProps, TouchableWithoutFeedbackProps, + ViewStyle, } from 'react-native'; export type RippleProps = { From f48188547d3b70b067c97acc52d59ff1e701a00b Mon Sep 17 00:00:00 2001 From: Suraj Kiran S Date: Mon, 30 Nov 2020 23:25:21 +0530 Subject: [PATCH 7/8] Type definition added --- index.d.ts | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) create mode 100644 index.d.ts diff --git a/index.d.ts b/index.d.ts new file mode 100644 index 0000000..9c1a39f --- /dev/null +++ b/index.d.ts @@ -0,0 +1,17 @@ +declare module "react-native-material-ripple" { + import { TouchableWithoutFeedbackProps } from "react-native"; + interface IProps extends TouchableWithoutFeedbackProps { + rippleColor?: string; + rippleOpacity?: number; + rippleDuration?: number; + rippleSize?: number; + rippleContainerBorderRadius?: number; + rippleCentered?: boolean; + rippleSequential?: boolean; + rippleFades?: boolean; + disabled?: boolean; + onRippleAnimation?: Function; + } + declare const Ripple: React.ComponentType; + export default Ripple; +} From dfbfdde746d4e0ab4099fe6aa6dd655d2d094f74 Mon Sep 17 00:00:00 2001 From: Suraj Kiran S Date: Mon, 30 Nov 2020 23:29:54 +0530 Subject: [PATCH 8/8] deleted type definition --- index.d.ts | 17 ----------------- 1 file changed, 17 deletions(-) delete mode 100644 index.d.ts diff --git a/index.d.ts b/index.d.ts deleted file mode 100644 index 9c1a39f..0000000 --- a/index.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare module "react-native-material-ripple" { - import { TouchableWithoutFeedbackProps } from "react-native"; - interface IProps extends TouchableWithoutFeedbackProps { - rippleColor?: string; - rippleOpacity?: number; - rippleDuration?: number; - rippleSize?: number; - rippleContainerBorderRadius?: number; - rippleCentered?: boolean; - rippleSequential?: boolean; - rippleFades?: boolean; - disabled?: boolean; - onRippleAnimation?: Function; - } - declare const Ripple: React.ComponentType; - export default Ripple; -}