Trunk

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 2.0.3
+
+-remove react props naming...etc
+
 ## 2.0.2
 
 - Remove node.js Example

README.md

@@ -197,7 +197,7 @@ class _EmbeddedPaymentScreenState extends State<EmbeddedPaymentScreen> {
 
 ## Custom Payment Method UI
 
-Pass `renderMethod` to draw each payment method row with your own widgets. Call `props.onSelect()` from your custom row so Moosyl can track the selected method.
+Pass `renderMethod` to draw each payment method row with your own widgets. Call `data.onSelect()` from your custom row so Moosyl can track the selected method.
 
 ```dart
 MoosylPaymentMethods(
@@ -215,19 +215,19 @@ MoosylPaymentMethods(
     print('Payment finished. isSuccess=$isSuccess');
   },
   primaryColor: const Color(0xFFF55E1E),
-  renderMethod: (context, props) {
+  renderMethod: (context, data) {
     return ListTile(
-      onTap: props.onSelect,
-      leading: props.type.icon.apply(size: 36),
-      title: Text(props.title),
-      subtitle: Text(props.method.type),
-      trailing: props.isSelected ? const Icon(Icons.check_circle) : null,
+      onTap: data.onSelect,
+      leading: data.type.icon.apply(size: 36),
+      title: Text(data.title),
+      subtitle: Text(data.method.type),
+      trailing: data.isSelected ? const Icon(Icons.check_circle) : null,
     );
   },
 )
 ```
 
-`MoosylPaymentMethodRenderProps` gives your row everything it needs:
+`MoosylPaymentMethodRenderData` gives your row everything it needs:
 
 | Property | Description |
 | --- | --- |
@@ -259,7 +259,7 @@ MoosylPaymentMethods(
 | `primaryColor` | `Color?` | Accent color for default rows and dialogs. Defaults to the theme primary color. |
 | `renderMethod` | `MoosylPaymentMethodBuilder?` | Custom builder for each payment method row. |
 | `loadingComponent` | `Widget?` | Custom widget shown while payment methods are loading. |
-| `loadingBuilder` | `MoosylPaymentMethodsLoadingBuilder?` | Builder for custom loading content with locale, color, and RTL props. |
+| `loadingBuilder` | `MoosylPaymentMethodsLoadingBuilder?` | Builder for custom loading content with locale, color, and RTL data. |
 | `showDefaultTitle` | `bool` | Whether the default UI includes its section title. Defaults to `true`. |
 | `isMasriviInBottomSheet` | `bool` | Whether Masrivi opens in a bottom sheet from custom platform UIs. Defaults to `true`. |
 | `masriviPresentation` | `MasriviWebViewPresentation` | Presentation used when `isMasriviInBottomSheet` is `false`. Defaults to `MasriviWebViewPresentation.fullPage`. |

example/lib/main.dart

@@ -7,7 +7,7 @@ import 'payment_success_dialog.dart';
 
 const _apiKey = 'your_api_key';
 const _transactionId = 'transaction_id';
-const _primaryColor = Color(0xFFF55E1E);
+const _primaryColor = Color(0xFF000000);
 
 void main() {
   runApp(const MyApp());
@@ -79,8 +79,8 @@ class _DemoHomePageState extends State<DemoHomePage> {
         transactionId: _transactionId,
         isFullPage: true,
         items: [
-          const MoosylPaymentSummaryItem(amount: 5, label: 'amount'),
-          const MoosylPaymentSummaryItem(amount: 0, label: 'tax')
+          const MoosylPaymentSummaryItem(amount: 2000, label: 'Subtotal'),
+          const MoosylPaymentSummaryItem(amount: 150, label: 'Tax')
         ]);
     if (!mounted) return;
     if (isSuccess != null) {
@@ -350,7 +350,7 @@ class _CustomPlatformsScreen extends StatelessWidget {
             onContinueLoadingChange: onContinueLoadingChange,
             onPaymentSuccess: onPaymentSuccess,
             primaryColor: _primaryColor,
-            renderMethod: (context, props) => _CustomMethodRow(props: props),
+            renderMethod: (context, data) => _CustomMethodRow(data: data),
           ),
         ],
       ),
@@ -391,17 +391,17 @@ class _CustomPlatformsScreen extends StatelessWidget {
 }
 
 class _CustomMethodRow extends StatelessWidget {
-  const _CustomMethodRow({required this.props});
+  const _CustomMethodRow({required this.data});
 
-  final MoosylPaymentMethodRenderProps props;
+  final MoosylPaymentMethodRenderData data;
 
   @override
   Widget build(BuildContext context) {
     return Padding(
       padding: const EdgeInsets.only(bottom: 12),
       child: InkWell(
         borderRadius: BorderRadius.circular(24),
-        onTap: props.onSelect,
+        onTap: data.onSelect,
         child: AnimatedContainer(
           duration: const Duration(milliseconds: 160),
           constraints: const BoxConstraints(minHeight: 78),
@@ -410,10 +410,10 @@ class _CustomMethodRow extends StatelessWidget {
             color: Colors.white,
             borderRadius: BorderRadius.circular(24),
             border: Border.all(
-              color: props.isSelected
+              color: data.isSelected
                   ? const Color(0xFF171713)
                   : const Color(0xFFEEE9E2),
-              width: props.isSelected ? 2 : 1,
+              width: data.isSelected ? 2 : 1,
             ),
             boxShadow: const [
               BoxShadow(
@@ -430,11 +430,11 @@ class _CustomMethodRow extends StatelessWidget {
                 height: 34,
                 decoration: BoxDecoration(
                   color:
-                      props.isSelected ? const Color(0xFF171713) : Colors.white,
+                      data.isSelected ? const Color(0xFF171713) : Colors.white,
                   border: Border.all(color: const Color(0xFFD1D1CD)),
                   shape: BoxShape.circle,
                 ),
-                child: props.isSelected
+                child: data.isSelected
                     ? const Icon(Icons.check, color: Colors.white, size: 20)
                     : null,
               ),
@@ -445,17 +445,17 @@ class _CustomMethodRow extends StatelessWidget {
                   mainAxisSize: MainAxisSize.min,
                   children: [
                     Text(
-                      props.title,
+                      data.title,
                       textAlign: TextAlign.right,
                       style: Theme.of(context).textTheme.titleMedium?.copyWith(
                             fontWeight: FontWeight.w800,
                           ),
                     ),
                     const SizedBox(height: 4),
                     Text(
-                      props.type == PaymentMethodTypes.bankily
+                      data.type == PaymentMethodTypes.bankily
                           ? 'Confirm with passcode'
-                          : props.type == PaymentMethodTypes.masrivi
+                          : data.type == PaymentMethodTypes.masrivi
                               ? 'Mauritel Money'
                               : 'Payment wallet',
                       textAlign: TextAlign.right,
@@ -472,7 +472,7 @@ class _CustomMethodRow extends StatelessWidget {
                   color: const Color(0xFFF4F4F1),
                   borderRadius: BorderRadius.circular(16),
                 ),
-                child: Center(child: props.type.icon.apply(size: 46)),
+                child: Center(child: data.type.icon.apply(size: 46)),
               ),
             ],
           ),

lib/moosyl.dart

@@ -9,9 +9,9 @@ export 'src/pages/masrivi_view.dart'
 export 'src/pages/payment_methods_view.dart'
     show
         MoosylPaymentMethodBuilder,
-        MoosylPaymentMethodRenderProps,
+        MoosylPaymentMethodRenderData,
         MoosylPaymentMethodsLoadingBuilder,
-        MoosylPaymentMethodsLoadingProps,
+        MoosylPaymentMethodsLoadingData,
         MoosylPaymentMethods,
         MoosylPaymentMethodsController;
 export 'src/models/payment_method_model.dart';

lib/src/pages/payment_methods.dart

@@ -1,9 +1,9 @@
 part of 'payment_methods_view.dart';
 
 /// Data passed to [MoosylPaymentMethodBuilder] for each payment method row.
-class MoosylPaymentMethodRenderProps {
-  /// Creates render props for a payment method row.
-  const MoosylPaymentMethodRenderProps({
+class MoosylPaymentMethodRenderData {
+  /// Creates render data for a payment method row.
+  const MoosylPaymentMethodRenderData({
     required this.method,
     required this.type,
     required this.title,
@@ -38,13 +38,13 @@ class MoosylPaymentMethodRenderProps {
 /// Builds a custom payment method row.
 typedef MoosylPaymentMethodBuilder = Widget Function(
   BuildContext context,
-  MoosylPaymentMethodRenderProps props,
+  MoosylPaymentMethodRenderData data,
 );
 
 /// Data passed to [MoosylPaymentMethodsLoadingBuilder].
-class MoosylPaymentMethodsLoadingProps {
-  /// Creates render props for the payment methods loading state.
-  const MoosylPaymentMethodsLoadingProps({
+class MoosylPaymentMethodsLoadingData {
+  /// Creates render data for the payment methods loading state.
+  const MoosylPaymentMethodsLoadingData({
     required this.primaryColor,
     required this.locale,
     required this.isRTL,
@@ -63,7 +63,7 @@ class MoosylPaymentMethodsLoadingProps {
 /// Builds custom loading content for [MoosylPaymentMethods].
 typedef MoosylPaymentMethodsLoadingBuilder = Widget Function(
   BuildContext context,
-  MoosylPaymentMethodsLoadingProps props,
+  MoosylPaymentMethodsLoadingData data,
 );
 
 /// Controller for [MoosylPaymentMethods].
@@ -159,7 +159,7 @@ class MoosylPaymentMethods extends StatelessWidget {
   /// Accent color for the default rows and dialogs.
   final Color? primaryColor;
 
-  /// Custom row builder. Call `props.onSelect()` inside the returned widget.
+  /// Custom row builder. Call `data.onSelect()` inside the returned widget.
   final MoosylPaymentMethodBuilder? renderMethod;
 
   /// Custom loading widget shown while payment methods are loading.
@@ -407,14 +407,14 @@ class _MoosylPaymentMethodsContentState
     final isRTL = Directionality.of(context) == TextDirection.rtl;
 
     if (provider.isLoading) {
-      final loadingProps = MoosylPaymentMethodsLoadingProps(
+      final loadingData = MoosylPaymentMethodsLoadingData(
         primaryColor: primaryColor,
         locale: Localizations.localeOf(context),
         isRTL: isRTL,
       );
       final loadingContent = widget.loadingBuilder?.call(
             context,
-            loadingProps,
+            loadingData,
           ) ??
           widget.loadingComponent ??
           _PaymentMethodsLoadingSkeleton(
@@ -475,7 +475,7 @@ class _MoosylPaymentMethodsContentState
         ...provider.methods.map((method) {
           final type = PaymentMethodTypes.fromString(method.type);
           final isSelected = selectedId == method.id;
-          final props = MoosylPaymentMethodRenderProps(
+          final methodData = MoosylPaymentMethodRenderData(
             method: method,
             type: type,
             title: type.title(context),
@@ -492,13 +492,13 @@ class _MoosylPaymentMethodsContentState
           );
 
           if (widget.renderMethod != null) {
-            return widget.renderMethod!(context, props);
+            return widget.renderMethod!(context, methodData);
           }
 
           return _MethodRow(
             method: method,
             isSelected: isSelected,
-            onTap: props.onSelect,
+            onTap: methodData.onSelect,
             primaryColor: primaryColor,
           );
         }),

pubspec.yaml

@@ -2,7 +2,7 @@ name: moosyl_flutter
 description: "The Moosyl Flutter SDK is a powerful tool for integrating payment solutions with Mauritania's popular banking apps, such as Bankily, Sedad, and Masrivi"
 
 homepage: https://github.com/SoftwareSavants/moosyl_flutter
-version: 2.0.2
+version: 2.0.3
 
 license: MIT