From b2b856c976f4c828a23099f7a0551b34f165d8c3 Mon Sep 17 00:00:00 2001 From: Omar Date: Fri, 17 Jan 2025 21:08:58 +0200 Subject: [PATCH 1/7] Update index.js Platform was undefined because it wasn't imported from react-native dependency. This causes issues for LTR apps. --- src/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/index.js b/src/index.js index ad23272..dea1708 100755 --- a/src/index.js +++ b/src/index.js @@ -5,7 +5,8 @@ import { I18nManager, StatusBar, SafeAreaView, - View, + SafeAreaView, + Platform, } from 'react-native'; import PropTypes from 'prop-types'; From 2d29398d60e4f43d0bb4f4cf11e337768f55b2f4 Mon Sep 17 00:00:00 2001 From: Omar <39835734+omur00@users.noreply.github.com> Date: Fri, 17 Jan 2025 21:23:15 +0200 Subject: [PATCH 2/7] Update README.md --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 2d6cb95..0d38484 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ There are many ways to onboard people to your mobile app. But for React-Native, there is solely _one_ component that is a) **easy to setup** and b) **highly customizable**: -`react-native-onboarding-swiper`. +`react-native-onboarding-swiper-rtl`. Your new users shouldn't jump in at the deep end. First give them a pleasurable, delightful introduction and only then let them explore your awesome app. @@ -14,7 +14,7 @@ Getting everything running merely takes a minute. Try out the example [running i ## Install ```bash -npm i react-native-onboarding-swiper +npm i react-native-onboarding-swiper-rtl ``` ```bash @@ -24,7 +24,7 @@ yarn add react-native-onboarding-swiper ## Usage ```js -import Onboarding from 'react-native-onboarding-swiper'; +import Onboarding from 'react-native-onboarding-swiper-rtl'; Date: Fri, 17 Jan 2025 21:23:49 +0200 Subject: [PATCH 3/7] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 0d38484..bd15aea 100644 --- a/README.md +++ b/README.md @@ -18,7 +18,7 @@ npm i react-native-onboarding-swiper-rtl ``` ```bash -yarn add react-native-onboarding-swiper +yarn add react-native-onboarding-swiper-rtl ``` ## Usage From 3cd9c8a497bb55106d7534781a29ef9914082aeb Mon Sep 17 00:00:00 2001 From: Omar <39835734+omur00@users.noreply.github.com> Date: Fri, 17 Jan 2025 21:31:26 +0200 Subject: [PATCH 4/7] Update README.md --- README.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index bd15aea..2d6cb95 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ There are many ways to onboard people to your mobile app. But for React-Native, there is solely _one_ component that is a) **easy to setup** and b) **highly customizable**: -`react-native-onboarding-swiper-rtl`. +`react-native-onboarding-swiper`. Your new users shouldn't jump in at the deep end. First give them a pleasurable, delightful introduction and only then let them explore your awesome app. @@ -14,17 +14,17 @@ Getting everything running merely takes a minute. Try out the example [running i ## Install ```bash -npm i react-native-onboarding-swiper-rtl +npm i react-native-onboarding-swiper ``` ```bash -yarn add react-native-onboarding-swiper-rtl +yarn add react-native-onboarding-swiper ``` ## Usage ```js -import Onboarding from 'react-native-onboarding-swiper-rtl'; +import Onboarding from 'react-native-onboarding-swiper'; Date: Fri, 17 Jan 2025 21:34:46 +0200 Subject: [PATCH 5/7] update --- src/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/index.js b/src/index.js index dea1708..bf82b10 100755 --- a/src/index.js +++ b/src/index.js @@ -5,7 +5,6 @@ import { I18nManager, StatusBar, SafeAreaView, - SafeAreaView, Platform, } from 'react-native'; From 1e7d5c25a9dfd82d0b2298cab12ba7b232d9ed70 Mon Sep 17 00:00:00 2001 From: Omar Date: Fri, 17 Jan 2025 23:17:45 +0200 Subject: [PATCH 6/7] Add fontFamily prop Providing a prop to add custom font to the title and subtitle texts. --- src/Page.js | 12 +++++++++--- src/index.js | 6 ++++++ 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/src/Page.js b/src/Page.js index 4c5bb29..f72e16c 100644 --- a/src/Page.js +++ b/src/Page.js @@ -1,4 +1,4 @@ -import { Dimensions, Text, View } from 'react-native'; +import { Dimensions, Platform, Text, View } from 'react-native'; import PropTypes from 'prop-types'; import React from 'react'; @@ -14,12 +14,15 @@ const Page = ({ allowFontScaling = true, titleStyles = null, subTitleStyles = null, + fontFamily = null, }) => { let titleElement = title; if (typeof title === 'string' || title instanceof String) { titleElement = ( - + {title} @@ -30,7 +33,9 @@ const Page = ({ if (typeof subtitle === 'string' || subtitle instanceof String) { subtitleElement = ( - + {subtitle} @@ -67,6 +72,7 @@ Page.propTypes = { }), width: PropTypes.number.isRequired, height: PropTypes.number.isRequired, + fontFamily:PropTypes.string }; const { width, height } = Dimensions.get('window'); diff --git a/src/index.js b/src/index.js index bf82b10..fe77c2d 100755 --- a/src/index.js +++ b/src/index.js @@ -90,6 +90,7 @@ class Onboarding extends Component { imageContainerStyles, allowFontScalingText, titleStyles, + fontFamily, subTitleStyles, } = this.props; @@ -104,6 +105,7 @@ class Onboarding extends Component { containerStyles={containerStyles} imageContainerStyles={imageContainerStyles} allowFontScaling={allowFontScalingText} + fontFamily={fontFamily} titleStyles={Object.assign( {}, titleStyles || {}, @@ -274,6 +276,9 @@ Onboarding.propTypes = { titleStyles: PropTypes.shape({ style: PropTypes.any, }), + fontFamily:PropTypes.shape({ + style:PropTypes.string + }), subTitleStyles: PropTypes.shape({ style: PropTypes.any, }), @@ -304,6 +309,7 @@ Onboarding.defaultProps = { allowFontScalingText: true, allowFontScalingButtons: true, titleStyles: null, + fontFamily:null, subTitleStyles: null, transitionAnimationDuration: 500, skipToPage: null, From af8a1e96a2de6a7aa57cc667c0ef2021a84ce475 Mon Sep 17 00:00:00 2001 From: Omar Date: Fri, 17 Jan 2025 23:54:12 +0200 Subject: [PATCH 7/7] Better code --- src/Page.js | 8 +++++--- src/index.js | 2 +- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/Page.js b/src/Page.js index f72e16c..2c52434 100644 --- a/src/Page.js +++ b/src/Page.js @@ -21,7 +21,7 @@ const Page = ({ titleElement = ( {title} @@ -34,7 +34,7 @@ const Page = ({ subtitleElement = ( {subtitle} @@ -72,7 +72,9 @@ Page.propTypes = { }), width: PropTypes.number.isRequired, height: PropTypes.number.isRequired, - fontFamily:PropTypes.string + fontFamily: PropTypes.shape({ + style: PropTypes.any, + }), }; const { width, height } = Dimensions.get('window'); diff --git a/src/index.js b/src/index.js index fe77c2d..62f86bc 100755 --- a/src/index.js +++ b/src/index.js @@ -273,7 +273,7 @@ Onboarding.propTypes = { }), allowFontScalingText: PropTypes.bool, allowFontScalingButtons: PropTypes.bool, - titleStyles: PropTypes.shape({ + fontFamily: PropTypes.shape({ style: PropTypes.any, }), fontFamily:PropTypes.shape({