From 38eb9fd4cd0129843805e5c77412abf3674091b1 Mon Sep 17 00:00:00 2001 From: Tim Roberts Date: Tue, 22 Aug 2023 17:49:46 +0100 Subject: [PATCH 1/4] =?UTF-8?q?=F0=9F=92=84=20minor=20README=20styling=20i?= =?UTF-8?q?mprovements?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f3152a3..41dd81e 100644 --- a/README.md +++ b/README.md @@ -25,9 +25,12 @@ Works with Expo and bare React Native apps. - [TimerPickerModal ⏰](#timerpickermodal-) - [Custom Styles 👕](#custom-styles--1) - [Methods 🔄](#methods-) + - [TimerPicker](#timerpicker) - [TimerPickerModal](#timerpickermodal) - [License 📝](#license-) +
+ ## Demos 📱

@@ -39,6 +42,7 @@ Works with Expo and bare React Native apps.

+
## Peer Dependencies 👶 @@ -49,7 +53,9 @@ If you want the numbers to fade in/out at the top and bottom of the picker, you - [expo-linear-gradient](https://www.npmjs.com/package/expo-linear-gradient) (if using Expo) - [react-native-linear-gradient](https://www.npmjs.com/package/react-native-linear-gradient) (if using in a bare React Native project) -To enable the linear gradient, you need to supply the component as a prop to either TimerPickerModal or TimerPicker. +**To enable the linear gradient, you need to supply the component as a prop to either TimerPickerModal or TimerPicker.** + +
## Installation 🚀 @@ -67,6 +73,8 @@ or yarn add react-native-timer-picker ``` +
+ ## Examples 😎 ### Timer Picker Modal (Dark Mode) 🌚 @@ -295,6 +303,8 @@ return ( ``` +
+ ## Props 💅 ### TimerPicker ⏲️ @@ -374,6 +384,7 @@ The following custom styles can be supplied to re-style the component in any way | confirmButton | Style for the confirm button | TextStyle | | modalTitle | Style for the title of the modal | TextStyle | +
## Methods 🔄 @@ -403,6 +414,8 @@ timerPickerRef.current.setValue({ hours: number, minutes: number, seconds: numbe An identical ref is also exposed for the TimerPickerModal component. +
+ ## License 📝 This project is licensed under the [MIT License](LICENSE). From cadddfa97fada1703be5e4a3c2122018427bc5a1 Mon Sep 17 00:00:00 2001 From: Tim Roberts Date: Wed, 23 Aug 2023 09:49:22 +0100 Subject: [PATCH 2/4] =?UTF-8?q?=F0=9F=90=9B=20fix=20styling=20heirarchy=20?= =?UTF-8?q?for=20buttons?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/index.tsx b/src/components/index.tsx index b4daa22..87ed934 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -202,8 +202,8 @@ const TimerPickerModal = forwardRef( {cancelButtonText} @@ -212,8 +212,8 @@ const TimerPickerModal = forwardRef( {confirmButtonText} From f113aff29098f1245fc1ec4c7aa022050a89cb59 Mon Sep 17 00:00:00 2001 From: Tim Roberts Date: Wed, 23 Aug 2023 10:35:04 +0100 Subject: [PATCH 3/4] =?UTF-8?q?=F0=9F=9A=B8=20make=20it=20possible=20to=20?= =?UTF-8?q?supply=20props=20to=20button=20touchable=20opacity?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 3 ++- src/components/index.tsx | 10 ++++++++-- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 41dd81e..eec6c2c 100644 --- a/README.md +++ b/README.md @@ -366,7 +366,8 @@ The TimerPickerModal component accepts all [TimerPicker props](#timerpicker-️) | modalProps | Props for the main modal component | `React.ComponentProps` | - | false | | containerProps | Props for the main container | `React.ComponentProps` | - | false | | contentContainerProps | Props for the content container | `React.ComponentProps` | - | false | -| buttonContainerProps | Props for the button container | `React.ComponentProps` | - | false | +| buttonContainerProps | Props for the button containers | `React.ComponentProps` | - | false | +| buttonTouchableOpacityProps | Props for the button touchable opacities | `React.ComponentProps` | - | false | | modalTitleProps | Props for the modal title text component | `React.ComponentProps` | - | false | | styles | Custom styles for the timer picker modal | [CustomTimerPickerModalStyles](#custom-styles--1) | - | false | diff --git a/src/components/index.tsx b/src/components/index.tsx index 87ed934..b92c19d 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -49,6 +49,7 @@ export interface TimerPickerModalProps extends TimerPickerProps { containerProps?: React.ComponentProps; contentContainerProps?: React.ComponentProps; buttonContainerProps?: React.ComponentProps; + buttonTouchableOpacityProps: React.ComponentProps; modalTitleProps?: React.ComponentProps; styles?: CustomTimerPickerModalStyles; } @@ -86,6 +87,7 @@ const TimerPickerModal = forwardRef( contentContainerProps, pickerContainerProps, buttonContainerProps, + buttonTouchableOpacityProps, modalTitleProps, pickerGradientOverlayProps, styles: customStyles, @@ -199,7 +201,9 @@ const TimerPickerModal = forwardRef( {...buttonContainerProps} style={styles.buttonContainer}> {!hideCancelButton ? ( - + ( ) : null} - + Date: Wed, 23 Aug 2023 10:35:34 +0100 Subject: [PATCH 4/4] =?UTF-8?q?=F0=9F=94=96=20bump=20npm=20version?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index ca19817..3cc6f92 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "url": "https://github.com/troberts-28" }, "license": "MIT", - "version": "1.2.1", + "version": "1.2.2", "main": "dist/index.js", "types": "dist/index.d.ts", "scripts": {