@umituz/react-native-subscription 2.37.98 → 2.37.100

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-subscription",
-  "version": "2.37.98",
+  "version": "2.37.100",
   "description": "Complete subscription management with RevenueCat, paywall UI, and credits system for React Native apps",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/domains/paywall/components/PaywallModal.styles.ts

@@ -3,7 +3,8 @@ import { StyleSheet } from "react-native";
 
 export const paywallModalStyles = StyleSheet.create({
     modalContent: { padding: 0, borderWidth: 0, overflow: "hidden" },
-    container: { flex: 1 },
+    container: { flex: 1, flexDirection: "column" as const },
+    scrollContainer: { flex: 1, flexShrink: 1 },
     closeBtn: {
         position: "absolute",
         top: 12,
@@ -35,7 +36,7 @@ export const paywallModalStyles = StyleSheet.create({
     loading: { alignItems: "center", paddingVertical: 24 },
     loadingText: { marginTop: 8 },
     plans: { marginBottom: 12 },
-    stickyFooter: { paddingHorizontal: 16, paddingTop: 12, borderTopWidth: StyleSheet.hairlineWidth, borderTopColor: "rgba(128,128,128,0.2)" },
+    stickyFooter: { flexShrink: 0, paddingHorizontal: 16, paddingTop: 12, borderTopWidth: StyleSheet.hairlineWidth, borderTopColor: "rgba(128,128,128,0.2)" },
     cta: { borderRadius: 12, paddingVertical: 14, alignItems: "center", marginBottom: 12 },
     ctaDisabled: { opacity: 0.5 },
     ctaText: { fontWeight: "700" },

package/src/domains/paywall/components/PaywallModal.tsx

@@ -1,10 +1,9 @@
 import React, { useCallback, useEffect } from "react";
-import { View, TouchableOpacity, Linking } from "react-native";
+import { View, ScrollView, TouchableOpacity, Linking } from "react-native";
 import { AtomicText, AtomicIcon, AtomicSpinner } from "@umituz/react-native-design-system/atoms";
 import { BaseModal } from "@umituz/react-native-design-system/molecules";
 import { useSafeAreaInsets } from "@umituz/react-native-design-system/safe-area";
 import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
-import { ScreenLayout } from "../../../shared/presentation";
 import { Image } from "expo-image";
 import { PlanCard } from "./PlanCard";
 import { paywallModalStyles as styles } from "./PaywallModal.styles";
@@ -57,7 +56,7 @@ export const PaywallModal: React.FC<PaywallModalProps> = React.memo((props) => {
         </TouchableOpacity>
 
         {/* Scrollable content — plan cards scroll, CTA is always pinned below */}
-        <ScreenLayout scrollable={true} edges={[]} backgroundColor="transparent" contentContainerStyle={styles.scroll}>
+        <ScrollView style={styles.scrollContainer} contentContainerStyle={styles.scroll} showsVerticalScrollIndicator={false}>
           {heroImage && <View style={styles.heroContainer}><Image source={heroImage} style={styles.heroImage} contentFit="cover" transition={0} /></View>}
           <View style={styles.header}>
             <AtomicText type="headlineMedium" adjustsFontSizeToFit numberOfLines={2} minimumFontScale={0.75} style={[styles.title, { color: tokens.colors.textPrimary }]}>{translations.title}</AtomicText>
@@ -85,7 +84,7 @@ export const PaywallModal: React.FC<PaywallModalProps> = React.memo((props) => {
               })
             )}
           </View>
-        </ScreenLayout>
+        </ScrollView>
 
         {/* Sticky footer — always visible, never hidden behind scroll content */}
         <View style={[styles.stickyFooter, { paddingBottom: Math.max(insets.bottom, 16) }]}>

package/src/domains/paywall/hooks/usePaywallActions.ts

@@ -111,6 +111,7 @@ export function usePaywallActions({
 
       if (success === true) {
         onPurchaseSuccessRef.current?.();
+        onCloseRef.current?.();
       }
     } catch (error) {
       const err = error instanceof Error ? error : new Error(String(error));

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2024 Ümit UZ
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/README.md

@@ -1,323 +0,0 @@
-# @umituz/react-native-subscription
-
-Complete subscription management with RevenueCat, paywall UI, and credits system for React Native apps.
-
-## Package Overview
-
-**Import Path**: `@umituz/react-native-subscription`
-
-**Version**: Latest
-
-**Type**: React Native Package
-
-This package provides comprehensive subscription and credit management with:
-- RevenueCat integration for subscriptions
-- Credits system with transaction tracking
-- Paywall UI components
-- Feature gating (premium, auth, credits)
-- DDD architecture with clean layers
-
-## Strategy
-
-### Architecture Principles
-
-1. **Domain-Driven Design (DDD)**
-   - Separate domains: Wallet, Paywall, Config
-   - Each domain has its own entities, rules, and boundaries
-   - Business logic stays in domain layer
-
-2. **Clean Architecture**
-   - Presentation: React hooks and components
-   - Application: Use cases and orchestration
-   - Domain: Entities and business rules
-   - Infrastructure: External integrations
-
-3. **Separation of Concerns**
-   - UI components are pure and reusable
-   - Business logic is in hooks and services
-   - Data persistence is abstracted behind repositories
-
-### Integration Flow
-
-1. **Initialization**
-   - Configure RevenueCat with API key
-   - Set up Firebase for credits storage
-   - Initialize providers at app root
-
-2. **Subscription Management**
-   - Check user tier and subscription status
-   - Gate premium features
-   - Handle purchase flows
-
-3. **Credits System**
-   - Initialize credits on purchase
-   - Deduct credits for feature usage
-   - Track all transactions
-   - Handle credit exhaustion
-
-4. **Paywall Display**
-   - Show paywall on feature gates
-   - Handle purchase operations
-   - Manage paywall visibility state
-
-### Key Dependencies
-
-- **RevenueCat**: `react-native-purchases` >= 7.0.0
-- **Firebase**: `firebase` >= 10.0.0
-- **State Management**: `@tanstack/react-query` >= 5.0.0
-- **React Native**: `react-native` >= 0.74.0
-
-## RevenueCat Best Practices
-
-This package follows RevenueCat's official best practices:
-
-### 1. Trust RevenueCat Data
-
-- **Expiration dates**: Use RevenueCat's `expirationDate` directly without modification
-- **Premium status**: Check `customerInfo.entitlements.active['premium']`
-- **Server-side validation**: RevenueCat handles receipt validation server-side
-
-### 2. CustomerInfo Listener
-
-```typescript
-// Real-time subscription updates via listener
-Purchases.addCustomerInfoUpdateListener((info) => {
-  const isPremium = !!info.entitlements.active['premium'];
-  const expirationDate = info.entitlements.active['premium']?.expirationDate;
-});
-```
-
-### 3. Entitlements-Based Access
-
-- Use entitlements (not product IDs) to gate features
-- Entitlements abstract away platform differences (iOS/Android)
-- Single source of truth for premium access
-
-### 4. Testing Guidelines
-
-- **Real devices only**: Simulators don't support in-app purchases
-- **TestFlight uses Sandbox**: Short expiration times (5 min for monthly)
-- **App Store Connect delays**: Changes can take hours to propagate
-
-### 5. Anonymous to Identified User Transfer
-
-When user converts from anonymous to identified:
-- `Purchases.logIn(userId)` handles user identity
-- Configure "Transfer if no purchases" in RevenueCat dashboard
-- Use `restorePurchases()` for explicit restore
-
-### Sources
-
-- [RevenueCat React Native SDK](https://github.com/RevenueCat/react-native-purchases)
-- [RevenueCat Documentation](https://www.revenuecat.com/docs/getting-started/installation/reactnative)
-- [Best Practices Guide](https://www.revenuecat.com/blog/engineering/ad-free-subscriptions-in-react-native/)
-
-## Restrictions
-
-### REQUIRED
-
-- **RevenueCat Configuration**: MUST provide valid API key and entitlement ID
-- **Firebase Setup**: MUST initialize Firebase for credits system
-- **Provider Setup**: MUST wrap app with `SubscriptionProvider`
-- **Authentication**: MUST have authenticated user for credits operations
-- **Error Handling**: MUST handle all error states appropriately
-
-### PROHIBITED
-
-- **NEVER** use subscription hooks outside provider
-- **NEVER** deduce credits without checking balance first
-- **NEVER** gate features without proper user feedback
-- **DO NOT** bypass gate hooks for premium features
-- **DO NOT** initialize RevenueCat multiple times
-
-### CRITICAL SAFETY
-
-- **ALWAYS** check loading states before rendering
-- **ALWAYS** handle edge cases (no subscription, expired, etc)
-- **ALWAYS** validate return values from credit operations
-- **NEVER** assume user has premium or credits
-- **MUST** implement proper error boundaries
-
-## Rules
-
-### Provider Setup
-
-```typescript
-// CORRECT - Wrap app with provider
-<SubscriptionProvider config={{ revenueCatApiKey: 'xxx' }}>
-  <App />
-</SubscriptionProvider>
-
-// INCORRECT - No provider
-<App /> // Hooks will fail
-
-// INCORRECT - Multiple providers
-<SubscriptionProvider>
-  <SubscriptionProvider> // Duplicate
-    <App />
-  </SubscriptionProvider>
-</SubscriptionProvider>
-```
-
-### Feature Gating
-
-```typescript
-// CORRECT - Use gate hooks
-const { canAccess, showPaywall } = usePremiumGate();
-if (!canAccess) {
-  showPaywall();
-  return;
-}
-
-// INCORRECT - Manual check
-if (!user.isPremium) { // No feedback, no paywall
-  return;
-}
-```
-
-### Credit Operations
-
-```typescript
-// CORRECT - Check return value
-const success = await deductCredit(5);
-if (success) {
-  executeFeature();
-}
-
-// INCORRECT - Assume success
-await deductCredit(5);
-executeFeature(); // May execute if deduction failed
-```
-
-### Loading States
-
-```typescript
-// CORRECT - Respect loading
-if (isLoading) return <Spinner />;
-if (!isPremium) return <UpgradePrompt />;
-return <Content />;
-
-// INCORRECT - Ignore loading
-{!isPremium && <UpgradePrompt />} // Flickers during load
-```
-
-## AI Agent Guidelines
-
-### When Implementing Features
-
-1. **Always** use appropriate gate hooks for feature access
-2. **Always** handle loading, error, and empty states
-3. **Always** provide user feedback for blocked features
-4. **Always** check return values from operations
-5. **Never** bypass gate system or checks
-6. **Must** test with different user tiers
-7. **Must** handle network errors gracefully
-
-### Implementation Checklist
-
-- [ ] Import from correct path
-- [ ] Wrap with necessary providers
-- [ ] Use gate hooks for features
-- [ ] Handle loading states
-- [ ] Handle error states
-- [ ] Provide user feedback
-- [ ] Test with guest user
-- [ ] Test with free user
-- [ ] Test with premium user
-- [ ] Test with no credits
-- [ ] Test with insufficient credits
-
-### Common Patterns
-
-1. **Premium Feature**: Use `usePremiumGate`
-2. **Credit Feature**: Use `useCreditsGate` or `useDeductCredit`
-3. **Auth Feature**: Use `useAuthGate`
-4. **Combined Gates**: Use `useFeatureGate` for complex scenarios
-5. **Paywall Trigger**: Use `usePaywallVisibility` for global state
-
-### Error Scenarios to Handle
-
-- **No Subscription**: Show upgrade prompt
-- **Expired Subscription**: Show renewal prompt
-- **No Credits**: Show credit purchase prompt
-- **Insufficient Credits**: Show credit cost and purchase option
-- **Network Error**: Show retry option
-- **Purchase Failed**: Show error message and retry
-
-## Documentation Structure
-
-### Domain Documentation
-
-- **[Wallet Domain](./src/domains/wallet/README.md)**: Credits and transactions
-- **[Paywall Domain](./src/domains/paywall/README.md)**: Paywall components
-- **[Config Domain](./src/domains/config/README.md)**: Configuration management
-
-### Layer Documentation
-
-- **[Presentation Layer](./src/presentation/README.md)**: Hooks and components
-- **[Application Layer](./src/application/README.md)**: Use cases and ports
-- **[Domain Layer](./src/domain/README.md)**: Entities and logic
-- **[Infrastructure Layer](./src/infrastructure/README.md)**: Repositories and services
-
-### Feature Documentation
-
-- **[RevenueCat Integration](./src/revenuecat/README.md)**: RevenueCat setup
-- **[Subscription Hooks](./src/presentation/hooks/README.md)**: Available hooks
-- **[Premium Components](./src/presentation/components/README.md)**: UI components
-
-### Quick Reference
-
-#### Subscription Hooks
-
-Location: `src/presentation/hooks/`
-
-- `useSubscription` - Core subscription management
-- `usePremium` - Check premium status
-- `usePremiumGate` - Gate premium features
-- `useUserTier` - Get user tier (guest/free/premium)
-
-#### Credit Hooks
-
-Location: `src/presentation/hooks/`
-
-- `useCredits` - Access credit balance
-- `useDeductCredit` - Deduct credits with optimistic updates
-- `useCreditChecker` - Check credit availability
-- `useCreditsGate` - Gate features by credits
-
-#### Paywall Hooks
-
-Location: `src/presentation/hooks/`
-
-- `usePaywallVisibility` - Manage paywall state
-- `usePaywallOperations` - Handle purchase operations
-
-#### Components
-
-Location: `src/presentation/components/`
-
-- `PremiumDetailsCard` - Display subscription details
-- `PremiumStatusBadge` - Show subscription badge
-- `PaywallModal` - Full paywall modal
-- `CreditRow` - Display credit balance with progress
-
-## Contributing
-
-When contributing to this package:
-
-1. **Follow Documentation Template**: Use `README_TEMPLATE.md`
-2. **Update Strategy Section**: Document architectural decisions
-3. **List Restrictions**: Clearly state what's required/prohibited
-4. **Provide Rules**: Show correct/incorrect usage
-5. **AI Guidelines**: Include agent instructions
-6. **No Code Examples**: Keep documentation code-agnostic
-7. **English Only**: All documentation in English
-
-## Support
-
-- **Issues**: [GitHub Issues](https://github.com/umituz/react-native-subscription/issues)
-- **Author**: Ümit UZ <umit@umituz.com>
-
-## License
-
-MIT License - see LICENSE file for details