dart analyzer

CHANGELOG.md

@@ -1,3 +1,33 @@
+## 0.0.10
+
+- One little 'Y' I missed
+- Fixed out of range error with `_adjustSelection`
+
+## 0.0.9
+
+- Drastically improved usability and performance with flutter web and canvaskit renderer, especially on mobile
+- Using streams to more accurately call `widget.onValidCardDetails` when the card details are valid and completed
+- Added `cursorColor` customization
+- Reworked widget life cycle so that hot reloads work as expected (resizing, focus, etc.).
+
+## 0.0.8
+
+- Updated dart sdk constraints again... oops (>=3.0.0)
+
+## 0.0.7
+
+- Changed pubspec versioning to allow lower SDK constraints (>=2.12.0)
+
+## 0.0.6
+
+- Improved assertion and error messaging when missing stripe implements
+- Added better doc comments
+- Fixed `CardTextField.delayToShowLoading`, now it uses it
+- Fixed bad assertion logic when providing stripe keys
+- Added ability to make Stripe call with `GlobalKey`
+- Refactored method `onTokenReceived` to `onStripeResponse` to be clearer
+- Refactored method `onCardDetailsComplete` to `onValidCardDetails` to be clearer
+
 ## 0.0.5
 
 - Fix Web, invalid call to `Platform.isAndroid`

README.md

@@ -23,7 +23,7 @@ Got to use emojis and taglines for attention grabbing and algorithm hacking:
 - Native Implementation: compiles and loads like the rest of your app, unlike embeded html
 - Automatic validation: no `inputFormatters` or `RegExp` needed on your side
 
-The card data can either be retrieved with the `onCardDetailsComplete` callback, or
+The card data can either be retrieved with the `onValidCardDetails` callback, or
 you can have the element automatically create a Stripe card token when the fields
 are filled out, and return the token with the `onTokenReceived` callback.
 
@@ -62,12 +62,13 @@ Include the package in a file:
 import 'package:stripe_native_card_field/stripe_native_card_field.dart';
 ```
 
-### For just Card Data
+### For Raw Card Data
 
+Provide a callback for the `CardTextField` to return you the data when its complete.
 ```dart
 CardTextField(
   width: 500,
-  onCardDetailsComplete: (details) {
+  onValidCardDetails: (details) {
     // Save the card details to use with your call to Stripe, or whoever
     setState(() => _cardDetails = details);
   },
@@ -76,17 +77,27 @@ CardTextField(
 
 ### For Stripe Token
 
+Simply provide a function for the `onStripeResponse` callback!
+
 ```dart
 CardTextField(
   width: 500,
   stripePublishableKey: 'pk_test_abc123', // Your stripe key here
-  onTokenReceived: (token) {
+  onStripeResponse: (Map<String, dynamic> data) {
     // Save the stripe token to send to your backend
-    setState(() => _token = token);
+    setState(() => _tokenData = data);
   },
 );
 ```
 
+If you want more fine-grained control of when the stripe call is made, you
+can create a `GlobalKey` and access the `CardTextFieldState`, calling the
+`getStripeResponse()` function yourself. See the provided [example](https://pub.dev/packages/stripe_native_card_field/example)
+for details. If you choose this route, do not provide an `onStripeResponse` callback, or you will end up
+making two calls to stripe!
+
 # Additional information
 
 Repository located [here](https://git.fosscat.com/n8r/stripe_native_card_field)
+
+Please email me at n8r@fosscat.com for any issues or PRs.

example/lib/dark_customization.dart

@@ -61,14 +61,15 @@ class _MyHomePageState extends State<MyHomePage> {
             ),
             CardTextField(
               width: 300,
-              onCardDetailsComplete: (details) {
+              onValidCardDetails: (details) {
                 if (kDebugMode) {
                   print(details);
                 }
               },
               textStyle:
                   const TextStyle(fontFamily: 'Lato', color: Colors.tealAccent),
-              hintTextStyle: const TextStyle(fontFamily: 'Lato', color: Colors.teal),
+              hintTextStyle:
+                  const TextStyle(fontFamily: 'Lato', color: Colors.teal),
               errorTextStyle: const TextStyle(color: Colors.purpleAccent),
               boxDecoration: BoxDecoration(
                 color: Colors.black54,

example/lib/main.dart

@@ -38,8 +38,26 @@ class _MyHomePageState extends State<MyHomePage> {
   CardDetailsValidState? state;
   String? errorText;
 
+  // Creating a global key here allows us to call the `getStripeResponse()`
+  // inside the CardTextFieldState widget in our build method. See below
+  final _key = GlobalKey<CardTextFieldState>();
+
   @override
   Widget build(BuildContext context) {
+    final cardField = CardTextField(
+      key: _key,
+      loadingWidgetLocation: LoadingLocation.above,
+      stripePublishableKey: 'pk_test_abc123testmykey',
+      width: 600,
+      onValidCardDetails: (details) {
+        if (kDebugMode) {
+          print(details);
+        }
+      },
+      overrideValidState: state,
+      errorText: errorText,
+    );
+
     return Scaffold(
       body: Center(
         child: Column(
@@ -51,22 +69,23 @@ class _MyHomePageState extends State<MyHomePage> {
                 'Enter your card details below:',
               ),
             ),
-            CardTextField(
+            cardField,
-              width: 300,
-              onCardDetailsComplete: (details) {
-                if (kDebugMode) {
-                  print(details);
-                }
-              },
-              overrideValidState: state,
-              errorText: errorText,
-            ),
             ElevatedButton(
               child: const Text('Set manual error'),
               onPressed: () => setState(() {
                 errorText = 'There is a problem';
                 state = CardDetailsValidState.invalidCard;
               }),
+            ),
+            const SizedBox(height: 12),
+            ElevatedButton(
+              child: const Text('Get Stripe token'),
+              onPressed: () async {
+                // Here we use the global key to get the stripe data, rather than
+                // using the `onStripeResponse` callback in the widget
+                final tok = await _key.currentState?.getStripeResponse();
+                if (kDebugMode) print(tok);
+              },
             )
           ],
         ),

example/pubspec.lock

@@ -45,10 +45,10 @@ packages:
     dependency: transitive
     description:
       name: collection
-      sha256: f092b211a4319e98e5ff58223576de6c2803db36221657b46c82574721240687
+      sha256: ee67cb0715911d28db6bf4af1026078bd6f0128b07a5f66fb2ed94ec6783c09a
       url: "https://pub.dev"
     source: hosted
-    version: "1.17.2"
+    version: "1.18.0"
   cupertino_icons:
     dependency: "direct main"
     description:
@@ -135,10 +135,10 @@ packages:
     dependency: transitive
     description:
       name: meta
-      sha256: "3c74dbf8763d36539f114c799d8a2d87343b5067e9d796ca22b5eb8437090ee3"
+      sha256: a6e590c838b18133bb482a2745ad77c5bb7715fb0451209e1a7567d416678b8e
       url: "https://pub.dev"
     source: hosted
-    version: "1.9.1"
+    version: "1.10.0"
   path:
     dependency: transitive
     description:
@@ -180,18 +180,18 @@ packages:
     dependency: transitive
     description:
       name: stack_trace
-      sha256: c3c7d8edb15bee7f0f74debd4b9c5f3c2ea86766fe4178eb2a18eb30a0bdaed5
+      sha256: "73713990125a6d93122541237550ee3352a2d84baad52d375a4cad2eb9b7ce0b"
       url: "https://pub.dev"
     source: hosted
-    version: "1.11.0"
+    version: "1.11.1"
   stream_channel:
     dependency: transitive
     description:
       name: stream_channel
-      sha256: "83615bee9045c1d322bbbd1ba209b7a749c2cbcdcb3fdd1df8eb488b3279c1c8"
+      sha256: ba2aa5d8cc609d96bbb2899c28934f9e1af5cddbd60a827822ea467161eb54e7
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.1"
+    version: "2.1.2"
   string_scanner:
     dependency: transitive
     description:
@@ -206,7 +206,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "0.0.3"
+    version: "0.0.9"
   term_glyph:
     dependency: transitive
     description:
@@ -219,10 +219,10 @@ packages:
     dependency: transitive
     description:
       name: test_api
-      sha256: "75760ffd7786fffdfb9597c35c5b27eaeec82be8edfb6d71d32651128ed7aab8"
+      sha256: "5c2f730018264d276c20e4f1503fd1308dfbbae39ec8ee63c5236311ac06954b"
       url: "https://pub.dev"
     source: hosted
-    version: "0.6.0"
+    version: "0.6.1"
   typed_data:
     dependency: transitive
     description:
@@ -267,10 +267,10 @@ packages:
     dependency: transitive
     description:
       name: web
-      sha256: dc8ccd225a2005c1be616fe02951e2e342092edf968cf0844220383757ef8f10
+      sha256: afe077240a270dcfd2aafe77602b4113645af95d0ad31128cc02bce5ac5d5152
       url: "https://pub.dev"
     source: hosted
-    version: "0.1.4-beta"
+    version: "0.3.0"
   xml:
     dependency: transitive
     description:
@@ -280,5 +280,5 @@ packages:
     source: hosted
     version: "6.3.0"
 sdks:
-  dart: ">=3.1.3 <4.0.0"
+  dart: ">=3.2.0-194.0.dev <4.0.0"
   flutter: ">=3.7.0-0"

example/pubspec.yaml

@@ -4,7 +4,7 @@ publish_to: 'none' # Remove this line if you wish to publish to pub.dev
 version: 1.0.0+1
 
 environment:
-  sdk: '>=3.1.3 <4.0.0'
+  sdk: '>=3.0.0 <4.0.0'
 
 dependencies:
   flutter:

lib/card_details.dart

@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:flutter/foundation.dart';
 
 /// Class encapsulating the card's data
@@ -39,6 +41,7 @@ class CardDetails {
   CardDetailsValidState _validState = CardDetailsValidState.blank;
   int _lastCheckHash = 0;
   CardProvider? provider;
+  StreamController<CardDetails> onCompleteController = StreamController();
 
   set overrideValidState(CardDetailsValidState state) => _validState = state;
 
@@ -51,7 +54,6 @@ class CardDetails {
   String get expMonth => isComplete ? expirationString!.split('/').first : '';
   String get expYear => isComplete ? expirationString!.split('/').last : '';
 
-  // TODO rename to be more clear
   /// Returns true if `_cardNumber` is null, or
   /// if the _cardNumber matches the detected `provider`'s
   /// card lenght, defaulting to 16.
@@ -66,6 +68,14 @@ class CardDetails {
     return _complete;
   }
 
+  /// Detects if the card is complete, then broadcasts
+  /// card details to `onCompleteController`
+  void broadcastStatus() {
+    if (isComplete) {
+      onCompleteController.add(this);
+    }
+  }
+
   /// The maximum length of the INN (identifier)
   /// of a card provider.
   int get maxINNLength => 4;
@@ -82,12 +92,12 @@ class CardDetails {
         return;
       }
 
+      _complete = false;
       _lastCheckHash = currentHash;
       if (_cardNumber == null &&
           expirationString == null &&
           securityCode == null &&
           postalCode == null) {
-        _complete = false;
         _validState = CardDetailsValidState.blank;
         return;
       }
@@ -99,63 +109,52 @@ class CardDetails {
           )
           .toList();
       if (!_luhnAlgorithmCheck(nums)) {
-        _complete = false;
         _validState = CardDetailsValidState.invalidCard;
         return;
       }
       if (_cardNumber == null || !cardNumberFilled) {
-        _complete = false;
         _validState = CardDetailsValidState.missingCard;
         return;
       }
       if (expirationString == null) {
-        _complete = false;
         _validState = CardDetailsValidState.missingDate;
         return;
       }
       final expSplits = expirationString!.split('/');
       if (expSplits.length != 2 || expSplits.last == '') {
-        _complete = false;
         _validState = CardDetailsValidState.missingDate;
         return;
       }
       final month = int.parse(
           expSplits.first[0] == '0' ? expSplits.first[1] : expSplits.first);
       if (month < 1 || month > 12) {
-        _complete = false;
         _validState = CardDetailsValidState.invalidMonth;
         return;
       }
       final year = 2000 + int.parse(expSplits.last);
       final date = DateTime(year, month);
       if (date.isBefore(DateTime.now())) {
-        _complete = false;
         _validState = CardDetailsValidState.dateTooEarly;
         return;
       } else if (date
           .isAfter(DateTime.now().add(const Duration(days: 365 * 50)))) {
-        _complete = false;
         _validState = CardDetailsValidState.dateTooLate;
         return;
       }
       expirationDate = date;
       if (securityCode == null) {
-        _complete = false;
         _validState = CardDetailsValidState.missingCVC;
         return;
       }
       if (provider != null && securityCode!.length != provider!.cvcLength) {
-        _complete = false;
         _validState = CardDetailsValidState.invalidCVC;
         return;
       }
       if (postalCode == null) {
-        _complete = false;
         _validState = CardDetailsValidState.missingZip;
         return;
       }
       if (!RegExp(r'^\d{5}(-\d{4})?$').hasMatch(postalCode!)) {
-        _complete = false;
         _validState = CardDetailsValidState.invalidZip;
         return;
       }

lib/card_text_field_error.dart

@@ -0,0 +1,19 @@
+/// Error class that `CardTextField` throws if any errors are encountered
+class CardTextFieldError extends Error {
+  /// Details provided for the error
+  String? details;
+  CardTextFieldErrorType type;
+
+  CardTextFieldError(this.type, {this.details});
+
+  @override
+  String toString() {
+    return 'CardTextFieldError-${type.name}: $details';
+  }
+}
+
+/// Enum to add typing to the `CardTextFieldErrorType`
+enum CardTextFieldErrorType {
+  stripeImplementation,
+  unknown,
+}

pubspec.yaml

@@ -1,11 +1,10 @@
 name: stripe_native_card_field
 description: A native flutter implementation of the elegant Stripe Card Field.
-version: 0.0.4
+version: 0.0.10
 repository: https://git.fosscat.com/n8r/stripe_native_card_field
 
 environment:
-  sdk: '>=3.1.3 <4.0.0'
+  sdk: '>=3.0.0 <4.0.0'
-  flutter: ">=1.17.0"
 
 dependencies:
   flutter:

test/stripe_native_card_field_test.dart

@@ -18,7 +18,7 @@ void main() {
       CardDetails? details;
       final cardField = CardTextField(
         width: width,
-        onCardDetailsComplete: (cd) => details = cd,
+        onValidCardDetails: (cd) => details = cd,
       );
       await tester.pumpWidget(baseCardFieldWidget(cardField));
 
@@ -110,7 +110,7 @@ void main() {
 
     final cardField = CardTextField(
       width: width,
-      onCardDetailsComplete: (cd) => details = cd,
+      onValidCardDetails: (cd) => details = cd,
     );
     await tester.pumpWidget(baseCardFieldWidget(cardField));