@umituz/react-native-subscription 2.2.14 → 2.2.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/src/presentation/components/paywall/PaywallLegalFooter.tsx +51 -30
  3. package/src/presentation/components/paywall/SubscriptionModal.tsx +7 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@umituz/react-native-subscription",
3
- "version": "2.2.14",
3
+ "version": "2.2.16",
4
4
  "description": "Complete subscription management with RevenueCat, paywall UI, and credits system for React Native apps",
5
5
  "main": "./src/index.ts",
6
6
  "types": "./src/index.ts",
package/src/presentation/components/paywall/PaywallLegalFooter.tsx CHANGED
@@ -7,7 +7,6 @@ import React from "react";
7
7
  import { View, StyleSheet, TouchableOpacity, Linking } from "react-native";
8
8
  import { AtomicText } from "@umituz/react-native-design-system-atoms";
9
9
  import { useAppDesignTokens } from "@umituz/react-native-design-system-theme";
10
- // import { LegalLinks } from "@umituz/react-native-legal";
11
10
 
12
11
  interface PaywallLegalFooterProps {
13
12
  termsText?: string;
@@ -25,11 +24,25 @@ export const PaywallLegalFooter: React.FC<PaywallLegalFooterProps> = React.memo(
25
24
  termsText = DEFAULT_TERMS,
26
25
  privacyUrl,
27
26
  termsUrl,
28
- privacyText,
29
- termsOfServiceText
27
+ privacyText = "Privacy Policy",
28
+ termsOfServiceText = "Terms of Service",
30
29
  }) => {
31
30
  const tokens = useAppDesignTokens();
32
31
 
32
+ const handlePrivacyPress = () => {
33
+ if (privacyUrl) {
34
+ Linking.openURL(privacyUrl).catch(console.error);
35
+ }
36
+ };
37
+
38
+ const handleTermsPress = () => {
39
+ if (termsUrl) {
40
+ Linking.openURL(termsUrl).catch(console.error);
41
+ }
42
+ };
43
+
44
+ const hasLinks = privacyUrl || termsUrl;
45
+
33
46
  return (
34
47
  <View style={styles.container}>
35
48
  <AtomicText
@@ -38,33 +51,36 @@ export const PaywallLegalFooter: React.FC<PaywallLegalFooterProps> = React.memo(
38
51
  >
39
52
  {termsText}
40
53
  </AtomicText>
41
- <View style={styles.legalLinksContainer}>
42
- {privacyUrl && (
43
- <TouchableOpacity onPress={() => Linking.openURL(privacyUrl).catch(console.error)}>
44
- <AtomicText
45
- type="labelSmall"
46
- style={[styles.linkText, { color: tokens.colors.textSecondary }]}
47
- >
48
- {privacyText || "Privacy Policy"}
49
- </AtomicText>
50
- </TouchableOpacity>
51
- )}
52
- {privacyUrl && termsUrl && (
53
- <AtomicText type="labelSmall" style={{ color: tokens.colors.textTertiary }}>
54
- {" • "}
55
- </AtomicText>
56
- )}
57
- {termsUrl && (
58
- <TouchableOpacity onPress={() => Linking.openURL(termsUrl).catch(console.error)}>
59
- <AtomicText
60
- type="labelSmall"
61
- style={[styles.linkText, { color: tokens.colors.textSecondary }]}
62
- >
63
- {termsOfServiceText || "Terms of Service"}
54
+
55
+ {hasLinks && (
56
+ <View style={styles.legalLinksContainer}>
57
+ {privacyUrl && (
58
+ <TouchableOpacity onPress={handlePrivacyPress} activeOpacity={0.7}>
59
+ <AtomicText
60
+ type="labelSmall"
61
+ style={[styles.linkText, { color: tokens.colors.primary }]}
62
+ >
63
+ {privacyText}
64
+ </AtomicText>
65
+ </TouchableOpacity>
66
+ )}
67
+ {privacyUrl && termsUrl && (
68
+ <AtomicText type="labelSmall" style={[styles.separator, { color: tokens.colors.textTertiary }]}>
69
+ {" • "}
64
70
  </AtomicText>
65
- </TouchableOpacity>
66
- )}
67
- </View>
71
+ )}
72
+ {termsUrl && (
73
+ <TouchableOpacity onPress={handleTermsPress} activeOpacity={0.7}>
74
+ <AtomicText
75
+ type="labelSmall"
76
+ style={[styles.linkText, { color: tokens.colors.primary }]}
77
+ >
78
+ {termsOfServiceText}
79
+ </AtomicText>
80
+ </TouchableOpacity>
81
+ )}
82
+ </View>
83
+ )}
68
84
  </View>
69
85
  );
70
86
  }
@@ -76,7 +92,8 @@ const styles = StyleSheet.create({
76
92
  container: {
77
93
  alignItems: "center",
78
94
  paddingHorizontal: 24,
79
- paddingBottom: 16,
95
+ paddingBottom: 20,
96
+ paddingTop: 8,
80
97
  },
81
98
  termsText: {
82
99
  textAlign: "center",
@@ -91,5 +108,9 @@ const styles = StyleSheet.create({
91
108
  },
92
109
  linkText: {
93
110
  textDecorationLine: "underline",
111
+ fontSize: 12,
112
+ },
113
+ separator: {
114
+ marginHorizontal: 4,
94
115
  },
95
116
  });
package/src/presentation/components/paywall/SubscriptionModal.tsx CHANGED
@@ -97,9 +97,12 @@ export const SubscriptionModal: React.FC<SubscriptionModalProps> = React.memo(
97
97
 
98
98
  const isFullScreen = variant === "fullscreen";
99
99
 
100
+ const ContentWrapper = isFullScreen ? SafeAreaView : View;
101
+ const wrapperProps = isFullScreen ? { edges: ["top", "bottom"] as const } : {};
102
+
100
103
  const Content = (
101
- <SafeAreaView
102
- edges={["top", "bottom"]}
104
+ <ContentWrapper
105
+ {...wrapperProps}
103
106
  style={isFullScreen ? styles.safeAreaFullScreen : styles.safeAreaBottomSheet}
104
107
  >
105
108
  <View style={styles.header}>
@@ -159,7 +162,7 @@ export const SubscriptionModal: React.FC<SubscriptionModalProps> = React.memo(
159
162
  onPurchase={handlePurchase}
160
163
  onRestore={handleRestore}
161
164
  />
162
- </SafeAreaView>
165
+ </ContentWrapper>
163
166
  );
164
167
 
165
168
  if (variant === "fullscreen") {
@@ -196,7 +199,7 @@ const styles = StyleSheet.create({
196
199
  bottomSheetContent: { borderTopLeftRadius: 24, borderTopRightRadius: 24, maxHeight: "90%" },
197
200
 
198
201
  safeAreaFullScreen: { flex: 1, paddingTop: 16 },
199
- safeAreaBottomSheet: { paddingTop: 16 },
202
+ safeAreaBottomSheet: { paddingTop: 16, paddingBottom: 24 },
200
203
 
201
204
  header: { alignItems: "center", paddingHorizontal: 24, paddingBottom: 20 },
202
205
  closeButton: { position: "absolute", top: 0, right: 16, padding: 8, zIndex: 1 },