kasy-cli 1.2.1

package/templates/firebase/lib/features/subscription/ui/component/paywall_minimal.dart

@@ -0,0 +1,146 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:kasy_kit/components/components.dart';
+import 'package:kasy_kit/core/data/models/subscription.dart';
+import 'package:kasy_kit/core/theme/theme.dart';
+import 'package:kasy_kit/features/subscription/ui/component/premium_page_factory.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/paywall_empty_state.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_background_gradient.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_bottom_menu.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_close_button.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_feature.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/selectable_row.dart';
+import 'package:kasy_kit/i18n/translations.g.dart';
+
+/// Minimal paywall: benefits list + single CTA.
+/// Best for apps with one plan or when you want a clean, focused layout.
+class PaywallMinimal extends StatelessWidget {
+  final List<SubscriptionProduct> offers;
+  final SubscriptionProduct? selectedOffer;
+  final OnSelectItem<SubscriptionProduct> onSelectItem;
+  final OnTapSubscription? onTap;
+  final OnTap? onTapRestore;
+  final OnTap? onSkip;
+
+  const PaywallMinimal({
+    super.key,
+    required this.offers,
+    required this.onSelectItem,
+    required this.onTap,
+    required this.onTapRestore,
+    required this.selectedOffer,
+    required this.onSkip,
+  });
+
+  // Safe because offers.isEmpty is already guarded above.
+  SubscriptionProduct get _effectiveOffer => selectedOffer ?? offers.first;
+
+  @override
+  Widget build(BuildContext context) {
+    if (offers.isEmpty) {
+      return PaywallEmptyState(onTapRestore: onTapRestore, onSkip: onSkip);
+    }
+
+    final translations = Translations.of(context).premium;
+    final features = [
+      translations.feature_1,
+      translations.feature_2,
+      translations.feature_3,
+    ];
+
+    return Scaffold(
+      backgroundColor: context.colors.primary,
+      body: PremiumBackgroundGradient(
+        child: SafeArea(
+          child: Padding(
+            padding: const EdgeInsets.symmetric(
+              horizontal: KasySpacing.pageHorizontalGutter,
+            ),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.stretch,
+              children: [
+                Align(
+                  alignment: Alignment.topRight,
+                  child: AppCloseButton(onTap: () => onSkip?.call()),
+                ),
+                const SizedBox(height: KasySpacing.lg),
+                Animate(
+                  effects: const [
+                    FadeEffect(
+                      delay: Duration(milliseconds: 100),
+                      duration: Duration(milliseconds: 300),
+                    ),
+                  ],
+                  child: Text(
+                    translations.title_1,
+                    textAlign: TextAlign.center,
+                    style: GoogleFonts.albertSans(
+                      fontSize: 28,
+                      fontWeight: FontWeight.w700,
+                      color: context.colors.onPrimary,
+                      letterSpacing: -0.8,
+                    ),
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.lg),
+                ...AnimateList(
+                  interval: 120.ms,
+                  delay: 300.ms,
+                  effects: [FadeEffect(duration: 300.ms)],
+                  children: features
+                      .map((text) => PremiumFeature(text: text))
+                      .toList(),
+                ),
+                const Spacer(),
+                Animate(
+                  effects: const [
+                    FadeEffect(
+                      delay: Duration(milliseconds: 400),
+                      duration: Duration(milliseconds: 300),
+                    ),
+                    ScaleEffect(
+                      delay: Duration(milliseconds: 400),
+                      duration: Duration(milliseconds: 500),
+                      curve: Curves.easeOut,
+                    ),
+                  ],
+                  child: Text(
+                    _effectiveOffer.formattedPrice(context),
+                    textAlign: TextAlign.center,
+                    style: context.textTheme.titleLarge?.copyWith(
+                      fontWeight: FontWeight.w600,
+                      color: context.colors.onPrimary,
+                    ),
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.smd),
+                Animate(
+                  effects: const [
+                    FadeEffect(
+                      delay: Duration(milliseconds: 500),
+                      duration: Duration(milliseconds: 300),
+                    ),
+                  ],
+                  child: KasyButton(
+                    label: translations.action_button,
+                    variant: KasyButtonVariant.inverse,
+                    isLoading: onTap == null,
+                    expand: true,
+                    onPressed: onTap,
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.md),
+                BottomPremiumMenu(
+                  textColor: context.colors.onPrimary,
+                  onTapRestore: onTapRestore,
+                ),
+                const SizedBox(height: KasySpacing.lg),
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

package/templates/firebase/lib/features/subscription/ui/component/paywall_row.dart

@@ -0,0 +1,332 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:kasy_kit/components/components.dart';
+import 'package:kasy_kit/core/animations/movefade_anim.dart';
+import 'package:kasy_kit/core/data/models/subscription.dart';
+import 'package:kasy_kit/core/theme/theme.dart';
+import 'package:kasy_kit/features/subscription/ui/component/premium_page_factory.dart';
+import 'package:kasy_kit/features/subscription/ui/premium_page.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/comparison_table.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/feature_line.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_bottom_menu.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_close_button.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/selectable_col.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/selectable_row.dart';
+import 'package:kasy_kit/i18n/translations.g.dart';
+
+
+class PaywallRow extends ConsumerStatefulWidget {
+  final List<SubscriptionProduct> offers;
+  final SubscriptionProduct? selectedOffer;
+  final OnSelectItem<SubscriptionProduct> onSelectItem;
+  final OnTapSubscription? onTap;
+  final OnTap? onTapRestore;
+  final OnTap? onSkip;
+  final PremiumPageArgs? args;
+  final bool showCoupon;
+  
+
+  const PaywallRow({
+    super.key,
+    required this.offers,
+    required this.onSelectItem,
+    required this.onTap,
+    required this.onTapRestore,
+    required this.selectedOffer,
+    required this.onSkip,
+    required this.args,
+    this.showCoupon = false,
+  });
+
+  @override
+  ConsumerState<ConsumerStatefulWidget> createState() => _BasicPaywallRowState();
+}
+
+class _BasicPaywallRowState extends ConsumerState<PaywallRow> {
+  final ValueNotifier<bool> showCloseBtnNotifier = ValueNotifier(false);
+
+  @override
+  void initState() {
+    super.initState();
+    if (widget.args?.delayCloseMs != null) {
+      Future.delayed(Duration(milliseconds: widget.args!.delayCloseMs!), () {
+        if (mounted) {
+          showCloseBtnNotifier.value = true;
+        }
+      });
+    } else {
+      showCloseBtnNotifier.value = true;
+    }
+  }
+
+  EdgeInsets get hPadding => const EdgeInsets.symmetric(horizontal: KasySpacing.pageHorizontalGutter);
+
+  @override
+  Widget build(BuildContext context) {
+    final translations = Translations.of(context).premium;
+    final features = [
+      translations.feature_1,
+      translations.feature_2,
+      translations.feature_3,
+    ];
+
+    return Scaffold(
+      backgroundColor: context.colors.background,
+      extendBodyBehindAppBar: true,
+      body: SafeArea(
+        bottom: false,
+        top: false,
+        child: Stack(
+          children: [
+            Positioned.fill(
+              child: Opacity(
+                opacity: 0.3,
+                child: Image.asset(
+                  'assets/images/premium-bg.jpg',
+                  fit: BoxFit.cover,
+                ),
+              ),
+            ),
+            Positioned.fill(
+              child: CustomScrollView(
+                slivers: [
+                  SliverAppBar(
+                    backgroundColor: context.colors.background,
+                    elevation: 0,
+                    expandedHeight: 130,
+                    flexibleSpace: FlexibleSpaceBar(
+                      background: Image.asset(
+                        'assets/images/premium-switch-header.png',
+                        fit: BoxFit.fitWidth,
+                        alignment: Alignment.bottomCenter,
+                      ),
+                    ),
+                  ),
+                  const SliverToBoxAdapter(child: SizedBox(height: KasySpacing.smd)),
+                  SliverToBoxAdapter(
+                    child: MoveFadeAnim(
+                      child: Text(
+                        translations.title_1,
+                        textAlign: TextAlign.center,
+                        style: context.textTheme.headlineLarge?.copyWith(
+                          fontWeight: FontWeight.w700,
+                          color: context.colors.onBackground,
+                          letterSpacing: -0.8,
+                        ),
+                      ),
+                    ),
+                  ),
+                  const SliverToBoxAdapter(child: SizedBox(height: KasySpacing.smd)),
+                  for (var i = 0; i < features.length; i++)
+                    SliverToBoxAdapter(
+                      child: Padding(
+                        padding: hPadding,
+                        child: FeatureLine(
+                          title: features[i],
+                          topPadding: i > 0 ? 4 : 0,
+                        ),
+                      ),
+                    ),
+                  const SliverToBoxAdapter(child: SizedBox(height: KasySpacing.xl)),
+                  SliverToBoxAdapter(
+                    child: Padding(
+                      padding: const EdgeInsets.symmetric(horizontal: KasySpacing.md),
+                      child: SelectableColGroup<SubscriptionProduct>(
+                        brightness: Brightness.light,
+                        items: widget.offers
+                            .map(
+                              (el) => SelectableOption(
+                                sublabel: switch (el.durationType) {
+                                  DurationType.week => Translations.of(context).premium.duration_weekly,
+                                  DurationType.year => Translations.of(context).premium.duration_annual,
+                                  DurationType.month => Translations.of(context).premium.duration_monthly,
+                                  DurationType.lifetime => Translations.of(context).premium.duration_lifetime,
+                                  _ => '--',
+                                },
+                                label: switch(defaultTargetPlatform) {
+                                  TargetPlatform.iOS => el.title ?? '',
+                                  TargetPlatform.android when el.durationType == DurationType.lifetime => 
+                                    Translations.of(context).premium.duration_lifetime.toUpperCase(),
+                                  TargetPlatform.android when el.durationType == DurationType.year => 
+                                    Translations.of(context).premium.duration_recuring_label_annual.toUpperCase(),
+                                  TargetPlatform.android when el.durationType == DurationType.month => 
+                                    Translations.of(context).premium.duration_recuring_label_monthly.toUpperCase(),
+                                  TargetPlatform.android when el.durationType == DurationType.week => 
+                                    Translations.of(context).premium.duration_recuring_label_weekly.toUpperCase(),
+                                  _ => el.title ?? '',
+                                },
+                                price: el.priceString,
+                                icon: switch (el.durationType) {
+                                  DurationType.lifetime => KasyIcons.book,
+                                  _ => null,
+                                },
+                                trial: switch(el.trialDays) {
+                                  null => null,
+                                  _ => Translations.of(context).paywallWithSwitch.withTrial.trial_switch_title(days: el.trialDays!),
+                                },
+                                promotion: switch (el.durationType) {
+                                  DurationType.year => "best deal",
+                                  _ => null,
+                                },
+                                data: el,
+                              ),
+                            )
+                            .toList(),
+                        onSelectItem: widget.onSelectItem,
+                        initialSelectedIndex: widget.selectedOffer != null
+                            ? widget.offers.indexOf(widget.selectedOffer!)
+                            : 0,
+                      ),
+                    ),
+                  ),
+                  if (widget.showCoupon)
+                    SliverToBoxAdapter(
+                      child: Align(
+                        child: Padding(
+                          padding: const EdgeInsets.fromLTRB(KasySpacing.md, KasySpacing.md, KasySpacing.lg, 0),
+                          child: KasyButton(
+                            variant: KasyButtonVariant.link,
+                            label: translations.coupon_title,
+                            size: KasyButtonSize.small,
+                            foregroundColor: context.colors.background,
+                            fontWeight: FontWeight.w400,
+                            onPressed: () => debugPrint("coupon"),
+                            // onPressed: () => askForCoupon(ref),
+                          ),
+                        ),
+                      ),
+                    ),
+                  const SliverToBoxAdapter(child: SizedBox(height: KasySpacing.lg)),
+                  SliverToBoxAdapter(
+                    child: Text(Translations.of(context).premium.comparison.title,
+                      textAlign: TextAlign.center,
+                      style: context.textTheme.headlineSmall?.copyWith(
+                        fontWeight: FontWeight.w600,
+                        color: context.colors.onBackground,
+                      ),
+                    ),
+                  ),
+                  const SliverToBoxAdapter(child: SizedBox(height: KasySpacing.smd)),
+                  SliverToBoxAdapter(
+                    child: Padding(
+                      padding: hPadding,
+                      child: const ComparisonTableComponent(),
+                    ),
+                  ),
+                  const SliverToBoxAdapter(child: SizedBox(height: 300)),
+                ],
+              ),
+            ),
+            Positioned(
+              top: defaultTargetPlatform == TargetPlatform.android ? KasySpacing.sm : 0,
+              right: KasySpacing.lg,
+              child: SafeArea(
+                child: AppCloseButtonComponent(
+                  showCloseBtn: showCloseBtnNotifier,
+                  onTap: () => widget.onSkip?.call(),
+                ),
+              ),
+            ),
+            Positioned(
+              bottom: 0,
+              left: 0,
+              right: 0,
+              child: ColoredBox(
+                color: context.colors.onBackground.withValues(alpha: .9),
+                child: Column(
+                  mainAxisAlignment: MainAxisAlignment.end,
+                  crossAxisAlignment: CrossAxisAlignment.stretch,
+                  children: [
+                    const SizedBox(height: KasySpacing.smd),
+                    switch((widget.selectedOffer?.trialDays, widget.selectedOffer?.durationType)) {
+                      (_, DurationType.lifetime) => Padding(
+                        padding: hPadding,
+                        child: const SizedBox.shrink(),
+                      ),
+                      (null, _) => Padding(
+                        padding: hPadding,
+                        child: Text(
+                          translations.payment_cancel_reassurance,
+                          textAlign: TextAlign.center,
+                          style: context.textTheme.bodyMedium?.copyWith(
+                            fontWeight: FontWeight.w400,
+                            color: context.colors.background.withValues(alpha: .9),
+                          ),
+                        ),
+                      ),
+                      (_, _) => Padding(
+                        padding: hPadding,
+                        child: Row(
+                          mainAxisAlignment: MainAxisAlignment.center,
+                          children: [
+                            Icon(
+                              KasyIcons.security,
+                              size: 14,
+                              color: context.colors.primary,
+                            ),
+                            const SizedBox(width: KasySpacing.xs),
+                            Text(
+                              translations.payment_cancel_reassurance_free_trial,
+                              style: context.textTheme.bodyMedium?.copyWith(
+                                fontWeight: FontWeight.w400,
+                                color: context.colors.background.withValues(alpha: .9),
+                              ),
+                            ),
+                          ],
+                        ),
+                      ),
+                    },
+                    const SizedBox(height: KasySpacing.smd),
+                    _buildButton(context, ref),
+                    Padding(
+                      padding: const EdgeInsets.symmetric(horizontal: KasySpacing.sm),
+                      child: BottomPremiumMenu(
+                        textColor: context.colors.onPrimary,
+                        onTapRestore: widget.onTapRestore,
+                      ),
+                    ),
+                    const SizedBox(height: KasySpacing.md),
+                  ],
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _buildButton(BuildContext context, WidgetRef ref) {
+    final translations = Translations.of(context).premium;
+    return Animate(
+      effects: const [
+        FadeEffect(
+          delay: Duration(milliseconds: 300),
+          duration: Duration(milliseconds: 300),
+        ),
+        ScaleEffect(
+          delay: Duration(milliseconds: 300),
+          duration: Duration(milliseconds: 1000),
+          curve: Curves.elasticInOut,
+        ),
+      ],
+      child: Padding(
+        padding: hPadding,
+        child: KasyButton(
+          key: const ValueKey('premium_subscribe_button'),
+          label: widget.selectedOffer?.trialDays != null
+              ? translations.try_free_btn_action(days: widget.selectedOffer!.trialDays!)
+              : translations.action_button,
+          isLoading: widget.onTap == null,
+          expand: true,
+          onPressed: widget.onTap,
+        ),
+      ),
+    );
+  }
+  
+}
+
+  

package/templates/firebase/lib/features/subscription/ui/component/paywall_with_switch.dart

@@ -0,0 +1,207 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:kasy_kit/components/components.dart';
+import 'package:kasy_kit/core/data/models/subscription.dart';
+import 'package:kasy_kit/core/theme/theme.dart';
+import 'package:kasy_kit/features/subscription/ui/component/premium_page_factory.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_background_gradient.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_bottom_menu.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_close_button.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/premium_feature.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/selectable_row.dart';
+import 'package:kasy_kit/features/subscription/ui/widgets/trial_switcher.dart';
+import 'package:kasy_kit/i18n/translations.g.dart';
+
+
+/// The paywall with switch is a paywall with a switch to toggle the trial offer
+/// (You have to have 1 offer with a trial period and 1 offer without a trial period)
+/// Once the user toggles the switch, the selected offer is updated
+/// - Offer with trial period is most of the time more expensive 
+/// - try different pricing strategies to see which one converts the best
+class PaywallWithSwitch extends StatelessWidget {
+  final List<SubscriptionProduct> offers;
+  final SubscriptionProduct? selectedOffer;
+  final OnSelectItem<SubscriptionProduct> onSelectItem;
+  final OnTapSubscription? onTap;
+  final VoidCallback? onTapCoupon;
+  final VoidCallback? onTapPrivacy;
+  final VoidCallback? onTapTerms;
+  final OnTap? onTapRestore;
+  final OnTap? onSkip;
+
+  const PaywallWithSwitch({
+    super.key,
+    required this.offers,
+    required this.onSelectItem,
+    required this.onTap,
+    required this.onTapRestore,
+    required this.selectedOffer,
+    this.onTapCoupon,
+    this.onSkip,
+    this.onTapPrivacy,
+    this.onTapTerms,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    var detailedPrice = "";
+    var btnActionText = "";
+    var title = "";
+
+    final translations = Translations.of(context).paywallWithSwitch;
+    final selectedOfferTrialDays = selectedOffer?.trialDays ?? 0;
+    final maxTrialDays = offers
+        .map((o) => o.trialDays ?? 0)
+        .fold(0, (max, days) => days > max ? days : max);
+
+    title = translations.noTrial.title;
+    if (selectedOfferTrialDays > 0) {
+      detailedPrice = translations.withTrial.details(
+        price: selectedOffer?.formattedPrice(context) ?? "",
+        days: selectedOfferTrialDays,
+      );
+      btnActionText = translations.withTrial.btnAction;
+      title = translations.withTrial.title(
+        days: selectedOfferTrialDays,
+      );
+    } else {
+      detailedPrice = selectedOffer?.formattedPrice(context) ?? "";
+      title = translations.noTrial.title;
+      btnActionText = translations.noTrial.btnAction;
+    }
+
+    return Scaffold(
+      backgroundColor: context.colors.primary,
+      body: PremiumBackgroundGradient(
+        child: SafeArea(
+          child: Padding(
+            padding: const EdgeInsets.symmetric(horizontal: KasySpacing.pageHorizontalGutter),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.stretch,
+              children: [
+                Expanded(
+                  flex: 2,
+                  child: Stack(
+                    children: [
+                      Positioned.fill(
+                        child: Image.asset(
+                          "assets/images/premium-switch-header.png",
+                          fit: BoxFit.contain,
+                        ),
+                      ),
+                      Positioned(
+                        top: 8,
+                        left: 0,
+                        child: AppCloseButton(
+                          onTap: () {
+                            onSkip?.call();
+                          },
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.smd),
+                Animate(
+                  effects: const [
+                    FadeEffect(
+                      delay: Duration(milliseconds: 100),
+                      duration: Duration(milliseconds: 300),
+                    ),
+                  ],
+                  child: Text(
+                    title,
+                    textAlign: TextAlign.left,
+                    style: GoogleFonts.albertSans(
+                      fontSize: 24,
+                      fontWeight: FontWeight.w700,
+                      color: context.colors.background,
+                      letterSpacing: -0.8,
+                    ),
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.smd),
+                Column(
+                  crossAxisAlignment: CrossAxisAlignment.stretch,
+                  children: AnimateList(
+                    interval: 150.ms,
+                    delay: 500.ms,
+                    effects: [FadeEffect(duration: 300.ms)],
+                    children: translations.features
+                        .map((el) => PremiumFeature(text: el))
+                        .toList(),
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.lg),
+                if (offers.length > 1)
+                  TrialSwitcher(
+                    onUpdate: (withTrial) {
+                      final offer = selectedOffer;
+                      final otherOffer = offers.firstWhere(
+                        (element) => element != offer,
+                      );
+                      onSelectItem(otherOffer);
+                    },
+                    trialDays: maxTrialDays,
+                  ),
+                const SizedBox(height: KasySpacing.md),
+                Animate(
+                  effects: const [
+                    FadeEffect(
+                      delay: Duration(milliseconds: 100),
+                      duration: Duration(milliseconds: 300),
+                    ),
+                  ],
+                  child: AnimatedSwitcher(
+                    duration: const Duration(milliseconds: 300),
+                    transitionBuilder: (child, animation) => FadeTransition(
+                      opacity: animation,
+                      child: child,
+                    ),
+                    child: Text(
+                      key: ValueKey(detailedPrice),
+                      detailedPrice,
+                      textAlign: TextAlign.center,
+                      style: context.textTheme.titleLarge?.copyWith(
+                        fontWeight: FontWeight.w500,
+                        color: context.colors.background,
+                      ),
+                    ),
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.md),
+                Animate(
+                  effects: const [
+                    FadeEffect(
+                      delay: Duration(milliseconds: 300),
+                      duration: Duration(milliseconds: 300),
+                    ),
+                    ScaleEffect(
+                      delay: Duration(milliseconds: 300),
+                      duration: Duration(milliseconds: 1000),
+                      curve: Curves.elasticInOut,
+                    ),
+                  ],
+                  child: KasyButton(
+                    label: btnActionText,
+                    variant: KasyButtonVariant.inverse,
+                    isLoading: onTap == null,
+                    expand: true,
+                    onPressed: onTap,
+                  ),
+                ),
+                const SizedBox(height: KasySpacing.lg),
+                BottomPremiumMenu(
+                  textColor: context.colors.onPrimary,
+                  onTapRestore: onTapRestore,
+                ),
+                const SizedBox(height: KasySpacing.sm),
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}