From dd52ffb39811045e10e45aa93f6474b9073f89d8 Mon Sep 17 00:00:00 2001
From: Nathan Anderson <nathananderson98@gmail.com>
Date: Tue, 21 Nov 2023 09:45:25 -0700
Subject: [PATCH] 0.0.3 released, see CHANGELOG.md

---
 .gitignore                        |   2 -
 CHANGELOG.md                      |  15 +
 LICENSE                           |  12 +-
 README.md                         |  56 ++-
 example/android/local.properties  |   5 +-
 example/lib/main.dart             |  46 +--
 example/loading.gif               | Bin 0 -> 18729 bytes
 lib/card_details.dart             |  36 +-
 lib/card_provider_icon.dart       |  28 +-
 lib/stripe_native_card_field.dart | 600 ++++++++++++++++++++----------
 pubspec.yaml                      |   2 +-
 11 files changed, 535 insertions(+), 267 deletions(-)
 create mode 100644 example/loading.gif

diff --git a/.gitignore b/.gitignore
index 3d13812..f91e482 100644
--- a/.gitignore
+++ b/.gitignore
@@ -29,5 +29,3 @@ migrate_working_dir/
 .packages
 build/
 
-# Example flutter app
-example/
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7278e03..346ba7a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,18 @@
+## 0.0.3
+
+Lots of improvements!
+
+- `CardTextField` now has customizable styles. Stripe integration is natively handled now, returning a card token, if stripe keys are provided.
+- `README` revamped with emojis, screen recordings, the whole nine yards.
+- `LICENSE` changed from BSD-3.0 to MIT license for pub points, I guess it wasn't being recognized correctly...
+- Added `http` depency for handling Stripe token api call.
+- Added Widget tests because that should be a thing that gets checked.
+- Fix for backspacing on mobile not changing focus.
+- Fix for text field spacing when in small form factor
+- Much improved usability on mobile, added manually scrolling to element
+- Added Icon Size param for card Provider Icon
+
+
 ## 0.0.2
 
 Added dartdoc comments for more pub points!
diff --git a/LICENSE b/LICENSE
index d1876df..7811508 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,11 +1,7 @@
-Copyright 2023 Nathan Anderson
+Copyright 2023 - Nathan Anderson
 
-BSD 3-Clause License
+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:
 
-Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
 
-    Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
-    Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
-    The names of its contributors may not be used to endorse or promote products derived from this software without specific prior written permission.
-
-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+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.
diff --git a/README.md b/README.md
index 9cc42b3..8fc98e3 100644
--- a/README.md
+++ b/README.md
@@ -3,10 +3,41 @@ A simple and clean Stripe Element Card clone, rebuilt in native Flutter widgets.
 This is not an officially maintained package by Stripe, but using the html stripe
 elements they provide with flutter is less than ideal.
 
+
+
 ## Features
 
-- Card number validation
-- No more depending on Flutter Webview
+Got to use emojis and taglines for attention grabbing and algorithm hacking:
+
+⚡Blazingly fast ( its as fast as the rest of flutter )
+🧹Cleaner ( fewer dependencies than the official stripe elements )
+🛡️Safe and Supports all Flutter Targets ( its native flutter with minimal dependencies )
+☑️Seemless UI/UX ( hard to match stripe quality, but I think I got close )
+🔄Built-in Stripe Integration ( guess that one is obvious )
+☯️Chi Energy Boost ( alright I'm fishing... )
+
+### Why StripeNativeCardField?
+
+- Fewer dependencies: no more depending on Flutter Webview
+- Customizable: the entire field can inherit native Flutter styling, i.e. `BoxDecoration()`
+- 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
+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.
+
+### Mobile
+
+![mobile showcase](./example/loading.gif)
+
+### Desktop
+
+![desktop showcase](./example/loading.gif)
+
+### Customizable
+
+![cumstomization showcase](./example/loading.gif)
 
 ## Getting started
 
@@ -16,10 +47,13 @@ elements they provide with flutter is less than ideal.
 
 Include the package in a file:
 
+
 ```dart
 import 'package:stripe_native_card_field/stripe_native_card_field.dart';
 ```
 
+### For just Card Data
+
 ```dart
 CardTextField(
   width: 500,
@@ -30,6 +64,24 @@ CardTextField(
 );
 ```
 
+### For Stripe Token
+
+```dart
+CardTextField(
+  width: 500,
+  stripePublishableKey: 'pk_test_abc123', // Your stripe key here
+  onTokenReceived: (token) {
+    // Save the stripe token to send to your backend
+    setState(() => _token = token);
+  },
+);
+```
+
+### Cumstomization
+
+For documentation on all of the available customizable aspects of the `CardTextField`, go
+to the [API docs here](https://pub.dev/documentation/stripe_native_card_field/latest/stripe_native_card_field/CardTextField-class.html).
+
 ## Additional information
 
 Repository located [here](https://git.fosscat.com/n8r/stripe_native_card_field)
diff --git a/example/android/local.properties b/example/android/local.properties
index 24d90b5..dafb1cf 100644
--- a/example/android/local.properties
+++ b/example/android/local.properties
@@ -1,2 +1,5 @@
 sdk.dir=/home/nate/Android/Sdk
-flutter.sdk=/home/nate/Tooling/flutter
\ No newline at end of file
+flutter.sdk=/home/nate/Tooling/flutter
+flutter.buildMode=debug
+flutter.versionName=1.0.0
+flutter.versionCode=1
\ No newline at end of file
diff --git a/example/lib/main.dart b/example/lib/main.dart
index c43b4f7..d3fb87c 100644
--- a/example/lib/main.dart
+++ b/example/lib/main.dart
@@ -14,23 +14,9 @@ class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-      title: 'Flutter Demo',
+      debugShowCheckedModeBanner: false,
+      title: 'Native Stripe Field Demo',
       theme: ThemeData(
-        // This is the theme of your application.
-        //
-        // TRY THIS: Try running your application with "flutter run". You'll see
-        // the application has a blue toolbar. Then, without quitting the app,
-        // try changing the seedColor in the colorScheme below to Colors.green
-        // and then invoke "hot reload" (save your changes or press the "hot
-        // reload" button in a Flutter-supported IDE, or press "r" if you used
-        // the command line to start the app).
-        //
-        // Notice that the counter didn't reset back to zero; the application
-        // state is not lost during the reload. To reset the state, use hot
-        // restart instead.
-        //
-        // This works for code too, not just values: Most code changes can be
-        // tested with just a hot reload.
         colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
         useMaterial3: true,
       ),
@@ -42,15 +28,6 @@ class MyApp extends StatelessWidget {
 class MyHomePage extends StatefulWidget {
   const MyHomePage({super.key, required this.title});
 
-  // This widget is the home page of your application. It is stateful, meaning
-  // that it has a State object (defined below) that contains fields that affect
-  // how it looks.
-
-  // This class is the configuration for the state. It holds the values (in this
-  // case the title) provided by the parent (in this case the App widget) and
-  // used by the build method of the State. Fields in a Widget subclass are
-  // always marked "final".
-
   final String title;
 
   @override
@@ -58,7 +35,7 @@ class MyHomePage extends StatefulWidget {
 }
 
 class _MyHomePageState extends State<MyHomePage> {
-  ValidState? state;
+  CardDetailsValidState? state;
   String? errorText;
 
   @override
@@ -79,11 +56,18 @@ class _MyHomePageState extends State<MyHomePage> {
               ),
             ),
             CardTextField(
-              width: 500,
-              stripePublishableKey: 'pk_test_abc123importantIDhere',
-              onStripeResponse: (details) {
-                if (kDebugMode) print('Got card details: $details');
+              width: 300,
+              onCardDetailsComplete: (details) {
+                if (kDebugMode) {
+                  print(details);
+                }
               },
+              // textStyle: TextStyle(fontSize: 24.0),
+              // cardFieldWidth: 260,
+              // expFieldWidth: 100.0,
+              // securityFieldWidth: 60.0,
+              // postalFieldWidth: 130.0,
+              // iconSize: Size(50.0, 35.0),
               overrideValidState: state,
               errorText: errorText,
             ),
@@ -91,7 +75,7 @@ class _MyHomePageState extends State<MyHomePage> {
               child: const Text('Set manual error'),
               onPressed: () => setState(() {
                 errorText = 'There is a problem';
-                state = ValidState.invalidCard;
+                state = CardDetailsValidState.invalidCard;
               }),
             )
           ],
diff --git a/example/loading.gif b/example/loading.gif
new file mode 100644
index 0000000000000000000000000000000000000000..ebbafbef6e8bebef20f930992082852f4e2f90ad
GIT binary patch
literal 18729
zcmb5VcR1CL|Ns9y1LtsXNRm{?I_DU1jF8YVl2Am$s!m9Dl1&`P-m>?eS;yWSdxj)C
z9ea;dQi-qEdwj3Y=l93=x_;;Uea?0MIk)G1J#O7rmAUrJ954sIvjDTRvz?utIXO8^
zO-(5&DKRlI9v&W{p`pda#Z^^ROG`^*V`IL)zK)KLTU%S-zkeSb90dOVytq#o?%uqw
ztE{MfQ(OcG0iAx9`xg`r1y}&#f4=9Rp8?RE5ctAPEz-;_IsG?U?1YE0uQ~3Ra3Qu&
zC@4_85GSlH$NrizTYA@}*Xn*3Ge(ph2d-Qz|4@4P!=*QnkZO(Oz%Vlh%(9F$j1E6i
zq!7eljJA>tul<<R1YK^5&`AqNAiyNCSN^Y&&cWV-5vdV@(E^Y-{{(@gWGwVeTB=hf
zCdc0_KS?mWB!Y&FjjgZ;s)Ge+>eCvV(5?PgFa=n~;%?#IK0f%sYsg3q2K=#foIiWY
zeg-{^E}}Lp@V5+9@vrlDZP9+(;ejr%tbOLo@qV3ErgDRh{+RKb{jQec8T#M1c@(vv
zVDD~QIblUL9=IeSDTw@Pw^#Mdp63a_b(UH%%zbM=mCd_kR-NV1Uem${?VMyNJxN4u
zZvlmk)KgJyqzl#qfwiB$$8%J@BjuI%ds{}H8Hi<(ofM1IUr@`gq(k=ugz6G-1+Pw2
z`@2PWxa-fcQY5ja?8!OkYy+czR>}Y?_&6L#{1AP=ljgVj-DT1{Y7OizR8MuX2WcX8
z_vo#rtVHNQ!JX(eHNn1yhXGIb`R{O+27wChT`#DeirheX<c5iO6KlTq2-vSGNb}%R
z=mrxL`1cOiUoDEotojpUA1!V6m{7+(U27YssJDCWz9PzPNR1cdV;I$Fy@8$2Nm>s*
zT1;mIsqs%A{P{{s^MYcfI!?e4RlXtbb;q9&NSwv3n5)NUiNJG>(EL<|FBj=zIpAbJ
zgBRoY$w#Kq_b11d1utn+{4!yLtOuArXLiR0`~!-v#7$zin<Bf#(pxq3HRT{ca(yXU
zTQ-rXr6@%Xh`3=^_&g3yPmBfM^A|t|EAo(+6V1(T^MXxkel5Mk{C&HUVzAHQo$MlI
z!3T0U_?2zpx?qu$?#c5CpJChX9F^#MU;)Xp5o}<|4jY<+<d`rSSR@4!1Xt3Mvn)81
z(^@QYQZns-(I@0?xbo!|j;iSv>hf6R#(S_QaS+uHHa5#B?W~E6P3Ui3O!7(@TNMn#
zNt2abU%?dcz{45q6GfO@Q3((g?2WIciWF&qXW|U4k#Ow`B6SnN(KhunW`=$spx8<@
zC36cT+61wKsQ?GGnr7Igokr0X2}Fi1Ws^znb{lO+2+&UCr{Fr67{u|NEZ+nm5Qe8s
zwhm;wK{4?CJVJTzf!Ptck2YNhJaE8-de-u|-N+UpSt(=%6%x%LAZZYhlx}|HUg^+q
zJK2618L3YJgYMf@3*6?A|2huotrGhf)P>ydVxT4yKbb>PevDfWBujRpb*+_}c^KY+
z!4~;pR~aEypKC~T!WYH*IwPB%;mD=b8XE{QJo<~xiANZ9FE0h$!GMwme+tgNX!s#4
zKt%Th5?TA%25<LLsGh+@nGBT8I)&G$(L#~Gx2>@c+-9UBRO*4ERw4!5Nr(Cg3mUMk
z)&Nt(8x3f;hH4gXGmxtXHD>dhK4nbqc&r6mV*mb7L$@~Pd|6cZbqIq#9r-mI9eKRX
zH`uEH9&3CJ9D%BY+K)1oXaBO|`J5B9Tzw&gMNPXKNAFF&_H;wR@cgPjXL0B0Vm{9w
z=Tpw`Q9Xb8(9BT-$Z)qspREg=!jpCiCw*l;NfuOP@yTlgHz~eDz&v6&{sxy@<Qwi3
zDC3Vj@a1D|H$^s;Ez@&KyyA8q%|2boBB!Pc?KqmVzDBIdVk$7Ufgm(F{YwojL;+$~
zYU%VE#PR8wT<POIZh}F_*{Ap>LePtFrxeo9QRfCZ!A#e0x|x@~0q^fNc9Byvyce<p
z)%bDLuyGjZe<Brh3e*?>1F7m@tv`UJ@UVkTd{EJizEh;86Kc;uBYJbp700f`j9^RZ
zqYd6L-3ohG#0Y-G&#mEvGBt|d!sF@~eN{OMu<`J62O%dy(}~M#DJLg_pc}IoqgN;m
zNfPesgbZ*Kv<VHRix7|UjkOS@OH4`;OLNk~1`5#R<mL$!Jf}w##bH9qypqeY43*Do
zGcn-CrWWkmHhl=D7)|5ZV;kOw88jWP<If(WZJt1zObzjm@O}JZzkqQZ#I4TqZuEF>
zf0)wW@8pGjp*^B1gYfBZS=M-P1+|-V_%pv3g4EVF4C?~W$hF2E-;j5(IiOo9BZJTP
zQhvqBXXVJ1P}t+K;zF!l2Jw!e0vj;dr|Ug<W`OjU3*R-XLA-HC5=ABpKmsIO)MJxk
zeEV5doH^vx83o}G@NXHLjp|Qhm4Jd0;-Qp(7u&O*aCypI|GQPXXX}Jn2ytN4*{Acu
zZTKXkdb;P-uA&JjPU{x<MR51`z4;IUTHz;0@z876S$$vxHQ<~1K!JtzO4C)PFJ?Ma
za+}eaYMW0*=akK@g7a)<5+qhv<o3Srj!7`hUi2IvsqXJ#K35>*g9lb#Tz@KYso5g^
zoj6#yr&Rv@&m9_<VIuL(3)iP3*_HR&2}hPO6AcnFM50?1=pggQ6LJ5kxH&GkFxlYb
z6@|w6CUNH(Te|aMq7q=h5rq6=y^SP9-#H&XLJ4F<urCB*^9mM%pYcVGgK^#1#ZVlY
z0E94-=jTCk2Wut~>+s025J~piCgxcGAB$0%`*rbvs_JbMV+{NFQmn!#ANZ|~Qz6eC
zJ%3k<;^R1YcCc~qdN0T<Zr#WqmLq_cv2pr^R(;hUv>fKB9+a1M$DreRy0|AC8%?Kp
zdoA?7zxi?|-e1BzT`jGEFXw0;XOSqiP{5n;j23<=Bqz>tqY(SM=5jD?<QfVyt_Uas
zpk7WMFmx%&Dy0v=36)T2Gag>A+jv(5IQx6!$%CWna0NJrkWFbe`Yq+8>^<!t>+4|6
z>m@)K&oc^m(u_eE>dvxOQVT{<FC$mFg{-fCC~dT@lR{{hHnlNb&}cqz3&A%?BJHlU
zuKc#5r-0lUco-2|A$#>_e~;R992_fmRGfKHwAacpV`u|s)k3rZ8}d<4dbdVL#46X~
zh?HU^^@0ir!WW6ph8hi4luGdJRaADc+wB8tUT=$;At+$yBZRLDHy|04Qc^t66Zw7o
z_oec09|`U^@#WkzTM2!KmhXRzYtS(s%zRFxJncQ3Z%6zzRI@!jZPfZsf*v8m`17OV
zpT%zt(hqG)i_28)B){CoC@6tsAEn`S7!k)#R_mHJ!foQhBf=-puv;S{ONJV@_@TH*
z3dE&Et4lTXw2>uN^WrenW?x1!64)?gHnZD|`*Nmni@LBgH3{Cc<lZwJ=#>2`d*K0*
z+RKaE$G0k<(7?xPnH2VY%O>T&gO1o*mihK>dF~5bvQyaWD1CbE>8|uk9@TG<m!!X5
zLW;-Jj#&^FW{Y_+;j`O;0(6V{@?W3XQ8rl2k-+ddOXa7#SaZ?}Ba)YHi&Gm2B!QO7
zocjV%U-$wbtSeymipC6q`*k&Jc6(6VSPJ5rVn@#U6|i(C_b;czz>k?bB*j5BrY~{g
zx^lKQST04@Z0_qrijgnZL)zFh?Bwe#u6Sw{Cn9R}z|vqzMk51vYLJr-L_CeES+Gy~
zTg-8bUo*nZp_rEyO1M$E{uKs-ePKRvfl3%KJ@;MeRMKGs|A(c>|0PdR|B<Jc0{$&e
z7qE2;D2Lq>ilOZqz!}l|fzW#&5jA42IoWwOcTzaWpxLrjFyQBd=lz$M$>kY99f&@y
zNY3LTc+EpY-u=&K=xYZV5vXeb6N87Cjn_*pK_6d{fLMzVL3p?q=xtO?TtH+3COJIK
zM=&!k2OE}WTi_r76vdWc%E$nsG#x|BRO4z=$J_XlzNHWY>2S^N=1J<ch1a+84-K1t
z7)3TTP7d<Vx_;rO`81A>>YrX=_Fm)L1cLc@wpY5o(;e)puJLkHjPP!J?32kD<BUMk
z${x4yGcBGvYwE%sId8%|Oyo{CY|+Vvg+zmeob=v%Rz{3c%tpN0tR=O9l4(7x4XENb
zdo0~iP@zRsJ}hzANK$4bqwr&zINOd9vg+~Gf{#ftT;2|P^bi_^%*7d?h{3T@IH{nU
ztU|nt;RvmYB>|8M)2{9UY{vPD%k=(jSDq0Co;2C$PdC=us{p!m?vr3b7JjlLz`Z%6
zM(-IMJio)ONa+^_l_!YpKHhp!6v!`Q#5?5_1odew)Gagni^eZJl)ksBVC^8Wdt;3r
zG5mOz22$8_&ZWb__1CjJahRQgNEp$viI)B+2axLcbJv9VDD6W~t>p4r8(Pe6_=$-Q
z!dK#_2)}oh<r+0^24r@#P1#`0B|hl{lvD@`G3ch;Vu$=JWa+((YzZ)Mp^=<a2T8Nk
zy@i>$%KV3=+1C!nLvZa_F!+7yBmhCp<t>KGRRG3thED8Kq-cftxd=71tKm~-mi3&-
z%?}+JQTKOTqC>RI3K#A?aOwk;_5H6+20n3{0z-`buU(V{$E@@FSeVtXNZT~%=iYlI
zo0ye)pEh<i(r`a<Ne+Aje;%w$|86ms2Wqiqs4Do5H=4JXWi|9_xQj{n^WS=BLo)mY
zHwrE|a?IuH$Uf(Bgj8*8Bv@Bac|ipv?$n~Xc1uJ_MZW>j+5kq}B$sTc(}SDQ8ibPD
zC?rtc$r%DK>pxJ(pTyi)f^OHufFIdZ)1XH1tTS=fF_*y}e{4XL?U9tq6{SCn6&s!!
z_*yaF3oq-xjTeao(&Q0WT9(0$Fc9ju)ovXQra^968!57@F3Q@&Rl%W}kK4~+ipt^V
zR^8IcyEQW%AUKSOH{NneDQ@JhHAqy4jfLXDtNoGt)p9S4NSz`*NPFN=DWl@O+Uikz
zznt`A0tjrkwcCT*-JF5n;!XX|tSP<iU^F&v$W2eDm#PFduu26g;T(vz_$Tg<zr*fL
z6r~{clr8|3$dMGOQAC6t00y&_?&mXhUaXx_`t*2vRzzh$8VWs1b)qunSRbyy38i%l
zf*eSx6Nboh`^NpE2txgMmtym;O$7h3>qnFPj-Bf0TVFRfr2fb)ZkClf{MnLQJr3Jw
zn%Lr;r(BrRo9K)WXWH-kbFBR>IXdIgSGkE}Mu<7)DfhutG!FPVQRB+<qc0iXGLO#i
zD*0JQ6g}?WX?^;AZ}x>C<DVkK=;IYM@aqHf8U4kJ)8xDx#eKU5u=?~$Z5*DB5AQi@
z2nDX3t7E;t2d!9~1N|bmRf+BRFtKqfsn=DrW#IfOFJ$_$^~z*l9l@+6!x+Bilg_0P
z+=Gjr3DF`Ia`Yoe(wc1``Z^i5OaTvmcW-8`y`nsRiq{3jAVi*;AQs2$F1}^VEEynw
znLGFc-A|tMzM(ZA5JAhr`lxM(-dW;Z7Yn>r@gD47mYxO*{J)u*g$3+*Pnn4~vQ5wh
zB6^q1@z!A4{sKv~1AG3Yb)n@|%T|$qb7nTD%-kyn^y<z5ZAF?M++2rpig(=q%)1LZ
zDF4Gu<9{Jjo8$wC1_lO;z{0#hkv`920^o51p^3Ip*>45YW3sS0xeO@|0t~0jM3<2f
zrG*$oO>G@N*)zYs1>F|V)4>Dp^33c_MMDN$BZhbza^KJP@lCqU@Y8&FDaZfz3vy!7
zdwF)Pe5}%N(PW>8?sMXA<YX*IKt4sm_&d<az;PF7bE5nEoTsfTNPz~*oQA}|RBQ^q
z)6Kz|A07cni13{pTX2)$7j1aU^+}7J1bWRiJtZ7a5$Me#=5uFJLhVIq3O`atK!B&<
z%FVyfhG4UgD#SaO6wivz(r~zWmnWghFV=j5+g=^I=hXR7UI9MD>N<1(Q8FK(aOFO4
zZQn?oast|QHA8r!MTK_jlgv$l1#XA)TF>y`zMknbfOS@Lov&nz54`Rkx3Bko4I4<4
z-p%7&%~M$VG+ylDbp{ZoI^e7fg{b&xmg2*3`R);2L=hxP=xOPZB>=i{OBzQ>_V(VK
ztTcH+X*btcp>|-NKE^lx`Zl@90z<XPf9v{_mz|#8{FC+PAsxrKd1{LnM5;XgvS-@g
zpO-}u2$_r%(~<Ko8KhrgYg8{J4ED^0=5F96(JzmCXFchD<Yzibm8{OYr}arMIB_|-
z@VE-)#oza1Z&>AW$iMR_)qA#Fdo}`3E06=D!DVEdGV)E~LrU0ic(AroVVE5BeveXY
zo!t57F}kwK_?LtOC(6^O<~7TSa3VGscvdsDcn)SBv=aANYCSKRhC<h=_4=SNpYzk_
zsTB}RGD9UjFmD}^Oqz40q~rKdFS1^|v(U*7V~-q1B<Tbf<XYl_3$t7LA~W&>-{q;r
zW=p9PGjTAYWqQVwY0GS}L0JsAb-uzdqn5P(n7(1Oz7PhMyM`}QL#hK{_p{oj<Y(<f
z{7Jd?&MF@m>=1%axs4avu7kN?0CH_NP9S$U5s$Ckb2D5;G=*F3l9RHMEfAoL2J45j
z-4{d?#bJcqw$Wqp?Sh_n6d-poGxF5-#vA&)Lmv8*o4q(g*FofV@=hEGr{4~+>2itR
z03)gUjdNGYU)wl#9ZEA8TSs;iAqht9l>!W0_K=YlYllqUUO9;#L5{uW$=5pYMEf(X
zMEj9F9^^%+E9bW319j0WHe)MGiTT3@Y)ITVcu!X8!;@B{s7X5Jq7R+c&VL>aylV9*
zZga4b<(zYElm~x#)2h*)?Ohah9%5w@M)3@~@Wy`esk)Qn{LaIj3V7J{p{M0bdZH`8
zR{6P*zsL8HLsD(X6sF5mhv?7hbNaWgxIfHPeg|7uG;H_-hZ9;NHWhhOKdobZuheYE
zq0+^-?ubQzw>6Z@0>6WGpEj=wBDMc0?5aO`y*2*y@}Xj~?$)0@fdYkZze*7J-_?W1
zDGKzVyqY&e;PjJA9svq_^%+1H@3~FfqCd&?uDh~5XyG?)8*Hxg^+_d)o|>=7sVQt*
zv4KL4b=TG`Yxzo&BTSY48%#0*!XN;2>Y>g4anTvP{|Y8$!PZ6p1d|RnUtEsSHeb*U
z8QQBtVE<mz!8Ki3tKfVGOIZM=2m6t;rdnH5>;iIf84fo2RgG-)9s_<idDidx6nfk(
zOP_W&(e-%ki6(mMgLHh&{rLlf^t8glBX~hk#xb#vP2+iBN&0tFpV(zEy^Ts&%6n4C
zmz|>oFMC?fQxv5Hl+{O8A}z1gQYzX@q`Q0g8iV*W<v$F*=WRC-8WraIM9_!8aKp}g
za-#(_b65z#%*<3Efdu_HK+-u?B0h}rZR9;cqEtH4+T4Fjeg^c`Z|0w;;~m#f437&V
zV%d*4F=9MWFqVzoDyBz;M7ODZ;;@xa(n(b57h$!W+I|?%A@u0@)tT3(>8x0rIp4Rh
z`Jt~?fbYf6S2{0cDnDg=FR&Y>T0pkDyUnpF@X*Mq#;Lf0w*8UlFH;oq0?Yl8GU>JQ
zRG0M<?WC);gOBf@6D;SVWhbAtvmk0iZnO5j51NR09Hj$YyP8C=m>+c?s$qQ;h@8Jl
zBPW&oZ3+p2AVx3oQj)5xC&(rPX*SAuBB<{5=3H2^6CA=wVz?~ARSkzVMGLK7NUr;~
z+I}0GKGcYRy*3%Z>tvVQ@N=%r`^DuisLN(wBzvR3gwOfA?Qg$qy8M#r;lc5(oOkCq
zRo43JFP8X+USs-nhQ!YD0In17CNXCesV$ap!G~H+M{w%?oIme>N~{jh!q>(5GjJ3k
zE6DV*4gkq7uQR@gjB!~AqOcJtVKSU{fR5qdT6WOE`KZN6;ovo2K>S$7B-n~5vlM+-
z5{ZveAA-@JD!)Fwh2s77=aJ8mk;@4M=UpJ+`)=#JSmUT`W+2ojJTb{KZvmaC+O2&#
z)$xfdCee((Ge5q(>ep&?eizO>*60aoIa5WjVJ!+1(`(9P$cn;eFmX}&a%9wH1tL~p
zgm;DJO!tWS#ZrRp78w=!N=cSXNDM-40|gW{y?Y1-k&oAl=zX4SY#^Htf=M8$<7<%A
zcv&K)a7-t8^#su;m<$HdK|`>NPi5Nx5KRojYIUmFKoNd!#l;FSUmUclv=Zk|YG}4M
zP=dT~2vG*lcSho?p~=&f8$ZxS;FisH>iWCi>aXx^G|^;>_8<0rxUw~{#FehGD0PwU
zm6n0+Zn~zT`BJ`6P4N`|;^6)AmipiJ&HQ}CeGrR}IIedr$*!{g=g=%-WNhPlRr7<b
zV(vm-;fr7UE)>aKc(0RBbr4odr_Y1vrxPhd@?~GeMg@EyJA5inVH6*OF*jf7f7nXv
zJS$y<l4x<f{FgM1wMGmM)5Ko^Q!zPtBJcf?m&6f)>164mlWWJ0gBn8pMF8DE_j!7e
z=-Jv!y1aR*&g+UsN8*bGJxJG0dt*7-tw|o-eo6<4^<QT3RQQ~B8UG-|?BB@vPnRJ`
zPgxKlW(=Joqi(WAF7kvz5NQ(<VQtT`w~!P`A2F=tC^=@MU;pm-TBdlQ1I!A;vsX;T
zT~|KUNyIFGR;hPc&bQQ{(G2>EWalWu;2QWGX6Y#b@*(N_Ny37HkdQZF0uhlUwP-<?
zIJYD#!8D(!Ol)?JtAHni0J89HaaCCmEw%#tkMO}j8UiaZEtr>WcE}D)Z1;0y27f<4
z<o&Dh5x&xf-ic)X!S_XTe00>Zki~p{_>7&$I{#J~dXg9S?Etfx7yDJw_$l=D`;EVU
z&?5+M(h?6e31d6o><>b<pZTzxa+3|Z_t>rX?QEyb4*CS%8;uIXdLx-aQ59VV-mYuf
z$gc|-hK!mJ5-lT2!Vh>G$PtPocff!rJhoZ)6^Z$uM5Vy6&$3nK;@;}FVYmhHjhYlb
zdTgEL*(>-`yMd+AYC6B!GZ@|aPi=8mZr`(m&>d=kL8CA5NzcW-Gs;Xj4Im66LOg9n
z!H;yfPqUx$)$?$^kW1ui8yxb^aV|P|8Pe*6q-qFLWW_#*<O5d1J+ezDaf1A!_fjhU
znJk!rNcV`FP`5U^9@9D`<D+Q0YWIeT0rk1^(ODWKA%NkH-p>}KflrG<i(KiqN1rD+
zMDKfI51H5q$IpO**ZmzwPEYhS?u&Cdo;XYxp0K?S^Ush6nrJB`0vFHZt<pFC8lbJS
zKAA8p{j<ulG&lkg^yQh_>3^yCa6aT;!JD6C!YMLV3QWwQ_?x_7207GHqzbzLpDhoR
zd>Xtda4en%Zvy<RP@Khbc=sDvZj2H8`8ME@f6!v+<G5>lfN|dKyhO9SLbFionsu`T
z@oxQ<lt-l&`7wlr`kXX(b~rxPb0dM@-;h?_G|F#5jXN|*&@wFSHPZ-h7!PnB8<pU+
zv7Vpd=|TiCO5&*jxp8hA{xB4ZQUo^tsRhD}8!R}Lw$m3C&xIOTl_17wX+aI_e>Sp5
zz8`K@Ac}vh6nAq96-%Q<thP@;0pJf5pkCFm*sboqRY^4hHbP`AaofC7Q9L5M(@1No
zal3YdbHEnc-+p}uM9mxFY5u|PzRUM(<Bx4HmSaSRGFKy8)b{(5-422VSG+?xR4Nwb
zXV(xSHWhQBO1lR}M_!e~t5k_aa8!y){S{7UVj17Wbax+FM-SgGRLWuH%_BWi3<$7m
ziubVdMpnSD9BfIJNg+|+$KH!?mv#>&;fP&bsUuY%?`mDR`ssdSXjb>%D5Q0>`URSU
z8U0(-JvcT>zPd^0f}EH+BQw$&D%ZOGeU1mGO_>iYvwZhi7g87Vp_P;pRt`V9@|OB?
z_cNs@(Ajne79t@cdD6=`Vr|8AUFZsanioa9HtB9M^K0vgpNK4^I0Usn$P;iRJNbhw
z<G$+k-ow4Jd0_4LuFyF8XfNOl`o~v)q2Z?CFN!xBrxh>n9^P1fqD35<=Do!H0}=Y$
zm^x_q*fZ|)m*Zw>+Q8wgKg-F;)-_g>I=OGg?qBAc{99({H9X4plYp-kH@a`%<zHBg
z1uFT0@A72i$)Ah!qZO1hG2w3Kij`@_q+8*61h-lSZVuH$sq!$2@3Cweh~bs|In`Vr
zlm&Inh?emH6k#l*nXqQYL4VnpIdC@_RMYE3{FSTxOiKcVXj7J4dSk0vSl-6Qy_ln&
zy7xxqI}ejgzC1f7m<47iw|EAbA%EfBJ=mS^T+GcZ|IO8y|ChR={zqMjXfs^-S4R<D
zT-4#bdm`;?3sXGxh&h1;y0Yn#D@gTb5OCEZI<G*M+uIKH&ZZBV)wQre6Z~aSZ%SBq
zW}?Z7O(vj|*4bOnP3@Jy8%J+v-_St8U{a_WB;a*Kq_a=dgK$j3+vJouY<fthttvW|
z4-Vuy<=^srm(5>VW>t>0Yce+HFA}P2h^~5`*3sG6+~lfJ-ChRJ^<xH`DI*qrpPo+F
z)qftCFrLyu&xS%lF<Kx5uaZIG%%~ClV|ft#=&!_*F@hSou!V16J7h&yiDjgBKy3mO
zaEI#t?IB6VIP=4id7{%ekarlEMY*DR{?3V!QQ}M0o_GlT*8V;m=sY8=KT18^e-@#C
z<1Vc@n`r*M^DsBTW_V~ktDMthfn?Ih<<T^V=UV_W1}6y#+|<rhUwo(I){hG1xB9fD
zkySpfLnF|!Jz#4eF^;5s6lt||eboMWeImVrLLb4lBCW@|5O;Tr6%~iFi*3;Z4Sah2
zfa^hW81CeU(T}lP5euqDTjQweATasyK-!(gnr*2g<l5Z(#-D35v|t&IyG?ap7aT5s
ze=_9ZY(LeLt#Mf-3;%6%pzy<8T(kSv<jIcR((PtB$FFOB$v;cE-ndL7$K7vGkN<8R
z?&p6j^LqT|c#UUoBE{?E{7<4I_#p4|iS_K+!^d*)4W}6h6Z<12+nv8=hIUK}((?f*
ze{7a`Nf-zH8!!wHfWR3K-h&uBCy5{i+pL9P8CEKfnD~J?@u3Zyok{pL@h+1HHTp4H
zu!_{R^HyrAaOP9cCT43ka3GiCBoq==Vjr^K=7~2HWHC!n_16IsO~r}1j7n+e&8}KU
zO+ljV4H6d;9PKTX)65@Mnx#9Xfy|=?gR}WF?~U4F-(K%l_5(q=v@PHW90eQYudwkP
z4x^wq^6@Y`BB+3q0u=IC3oarE{%})x*0|+G*20zG4LDBxT@HfCqs<GinU=L;q*+TU
zqE9-w-4XHP(&^KyYx+0j1k%4ED_kD(TOX1ZnD@(|x;lw~2hruY<11Fo8jI=s+zge$
zcU0Ad>X+j(c3Nf{{*)rZe&a4N9<E#mw;sh&cUvWJb{lA#5LuS?4dVvfyUA%ZzLN|J
z66soRaiw-OPItco<&c`ny7(%m8LPRpiucK|$fF{w%rxQ3el%fb-&%GTVLvRTB{0;@
zrE&drL({Zyg*c}1h%!18O#RliK;e2te?On_`co#V`6~V6Y`f~#TRnq6Mg{mn9Hot;
zg|^$QU%&bKv0P;^i~f1OT}?&dveA`EhhbsJw2YPfJH(rrlA;e4@F&WPgT}(uL4Myt
zud!YB3H`Zp>;Aia*5!;p1ebMfM40T^F@Me90^I*KVgFK8z^MuQpX(3<@z8(8@A-hD
zq8-C&l+=3DR>tTbOu!VaX_5T}Z2qsAxIY%h-LKxLA)EtH-&mj1-{j~eBIY2l;pdlH
zpu{d45VrUQ$c_Z^6m+~MLgOYK%Ao2cYD*%$76<@|z(bRzO(O-s(OGc+06|DdN~m@^
z#yiU=*HN(WoqI_sIV&y?D_fHsQO8%-U`N~1jHacew4a7a-6XxzetzJ6a>58N>?5g|
zKOO_Ge!uXUrR(GD;soz1Wq5;*Y8T79#1ESe^V|6T+1<qW@;R?saFh&Xh(q3or-Iwa
z4nJS#4FO6URq>Z_Av9w4g}Qg3?Y^knCrAp691<IK5wilR)Zrv0*6&p7>D-zHMGQSL
z*TJD5hk{^Hf)~kWZWg%rs^GqXxh;LAj@db`+#{|flv$dh9;iPw&^;5Cr+-$F!Vd)t
zA>Cx}QHws8eb>RM;cG;}7IBmZa*B~6+A-+E*~i5nqQ3N;*Yc293Gbe#$<ajZH5}Sb
zYDQev=(whT|Mul@YsQh;`X34BGEFcgT$%W3>A=VwTPPp`A1Xc95qa@?+n}ec-6h3H
zI{XR?ghUt67VomvT{o?seoP|%n5=pQ`r_&Qg8^dF`g3{aitMi;dfHYjDx<+Icb+@U
zi<v-td0y(Xw4wB$xA9LA2Zhem6HXdh=V@j}Xk>=<$$S*xMW5o=`E*>K?!EiU^Z8V3
zZl!EJtAxLxHs9N^lVMirfA8VJ@P>jRV}|>OeIQ!N5u!i+S#1i4W-Vd#bRAN-6s3;T
zP6f181#)A&Sjg;AYuBiFP9vxFT(Ci$3?;@i?tE^5n(eRUBr91I_>EcjwOo%|Xv#|J
zQ>AAqDIWCX*qbi2{kh4~Kl<{cNN7&)%r{wu+CUJ!8<6cG%Zbc+yWon?jEM^}&vRBK
zzsT1;E<_esH^4E4I-`kEsReF*{RzcN76NLP-Sm0tTAT*UvA4_;i!z>xTWpp0q8pb$
z3Q~YI9;$NTie$9<g_4uP4w*el&5U5iEc>y((3P5W^MUR9FY5Pl>K5kc;o#NoKSZ#U
zAc((lEALN0(~*L<s4tu<gma2SjEJ^E<TQK$u=JKK2i?z2ijn;67`fxK3fEVkZzb;K
z6lR~yuifGtL`u)OO$J&h@2xFCdb*6za#>K->@G>LPmZj_FgYlSkPR8YJwosTODwcV
zd`{8TKOQ?56*WRu^62hAb_6YTqX5Wz*&+w{-Pa6|4%u{T(kJsrCH6e>PTPx>E7O{(
zgWx73!)c4MFeQ+!vkm0~{1Bl$DqvD1Irs3K-S@07oFh(O6htnyf$3GYh@YdbT079g
zP-#vOehxd}gh6;u54`l|!fmD5{gvGIz6G9)z2r161tkbHvh+FxN)!Qa*j~Wz!Jyw~
zI`Ta4ZYq7QHr)R6pz)U1pG69@mXgEl@pT%AvQ+DLSnw?^S-c$hOYx${rJXl^*&$DV
zE3HU}xZ(%hZ}7o)Hp6dBd|eEG{&P-Q_gJkb;`pz*Q%AwmZ)6EPyKo0_yu)v=>BZGE
zl1R0qkf#y&td^C+9TJA{@MPs@5Yu?68V1OO)8m^r1Uh}wBx33Bj5M;eM3Ov|+Ynk4
zO1*FQm~oxS8!BYw(n+MjrmiB(BV_C4QV=mPJA(B>0az$;ILJzyFwJ*MMerTq(yjpq
zXSh_~xhzr+&E7N|jT|G2J+TQDmEq+qS*u><htr9hr~e^iNg%4GzBw1_GU&F?UcD&E
z_sIKFmvpa6Kf!9@V=}KhrSYIEG$dLR{5$gh7M%Z2!eUquhe+fpVQ;9}$`Jn{tQww=
z{&Xy|H9km_GbvoCKIZl~#4q%E42bP1%7kdn>m+Kw!><S3@$TZ5H);F~rxCH25uri4
z1gUzw@(Py|^o5AL3<?evgoY=>-uk|c%hXE1c&6CE)9eKUGvjm6dHJwHY?Od(X&KqD
z(u=X?wBu}u3u)qQ@p_coj&|yDiSFeE_uFRk*P>%TIH!*BR#bkR9^xyR>zQXkOxQ#k
zu4>G=xNj}&Qum9de}Fdk#MJggs5LAj8=pJkcMVXUrfQRiJ)zui5)-#Qx1v}^7mVgR
zoK?|Jqbumg!pR%>lqyl(a2IhuIy$WFM#SvC?-YjDo0yJ2Q>B)<&WU5`)a+OJEjkkf
zW<aT>3g%%(if;Jj!3b3<-e}%i$ZrpSbb1%)epC;81{4_@2;hbc%$aV290gDr50a&<
z`D%$QBPA<ETwxBSE)Qo0q^|%RFhJw(o;d01U4M7f-TNU>aCg|pxI5hS--idEUgYoH
zGLgWyvH-qmVIO_hM`2II^%*bRzF3%glMlFa{YvOet$Q?&cFv(S2Tf!=(@;p=x5BY|
z9D%}*#j95)eu;4W&H}u5Z1p9gE<U;Pob$?u^t|qt<|jYI>au&%yJfe7@sc>et^cbx
z-h}}m$DFW^qw+a~kAvb;SwAF7aifRi18)M+Vy2HtIb0cEv^aT`jh=gOjZlJ@^zTzZ
z2rg~vEy;27#W0ymuhKMVzOOAtDD3D_?n!e-0>HlsOM4C$sjWI?5`++-EXC?&v9y7p
zYU|4p(5gcguwGoBDF)_IXcmE8Fj+~yo%LZk$#M?1nu_{Rh>q=r+F??}H-7P_Hy!@U
zPc)+6$W0B1JFl1&tTctb9%fd*obt9pAn&H>!v;PXEi+D?@P}@}IdME&f$Q<m6lv3N
z)g-rP;Z@_7n<e0qNeYSmnQY-Xqf4k_a%)r;rMwqRz0c{5*t9P9KnZP^Gv%ypom988
z{_Z;eQJsNOEXzu~QX`={vt57mV+5bHSfg?0l(3tWJo&&G+s0|Ld3@7Rxaw*9G#4Uz
z_0Rr*C~*W{Y}ca4W^LDGM;ReD)7LWCu!H1|_6XQcy|0vcnc`Qqu$dpP8kh4F0Vr<|
zLr33))B1yW=w4DMz$~)|v_q<9w;9+viaFvD90Z5Zf!{<TL{s`AV9isTveySBYgc{H
zyFj6I2}o{V{dlaf@vS`a4OgE2qZeV0{Q|(=j|u(|dHZTn$qYLO0j`Xi>6_Vmx;-yj
zKi6~{G1!#>Qqjc2IeiIy4y<v5(-jVd9{+#{uo3o5#5pd#Uf^SklsZ{dJu^j#jN1Hd
z`7X|D8w^?<m50Qa9Ka;k!_HXXHws1dTsNPz;<zfPN|{%8^m=4S!A+a$@nDMdW4Ws|
zs8%U>xb!d&eB@Tyx3H^*FM&|Lt<t}x!K+(uCbvRGTdwn`lv%;SF0C)ap0&Ir9SJ3k
zH2=J8L0Pk_6*!i^3x$x=A$2vZU(e&O(aL#)#R4KWnwf91g!+L$#`4gi8SRfM{r=`n
z;5V-^(VUm`2C?ZWetnPiL)#gC$8s<+ER-7IB)$LcWlDpO1q1kr`0p~k0ef$UXz&Q*
zP4hrz5Msnc4e<;u+|y#Gxn+qcFkoB$NrFHrR?O7NTRSMo)o&Ke4p<l9%&TS6mPN!9
zYfbRCDonQwPg~e~pX`f{rmBz66TRJ26hjB47367k;Hs7XtM>e7*8Jl1eOeg&XDaev
zt%?!ja}ocCq^)?{1la#3DdQ<ggA6`dw3c=$jbH2s0Ne-;4}%7NE=qBir#swKl(%X<
zv7-?=-HOnFTu(_V3L!?21byKmuY!U?MW7K8Fj$mtRD8BpA_krk5hD;S7?>TLmtUA#
zoQWl8hg9$tRC&P|u_YMm`tl||+g7hf`L&py_&&ZtqV2E)239s|GuAx*vWUNv|MO@g
z6^R%ams=j;1<$#F+&6h!7SJoaKMwZanq%$~WnsrCVZcR;AoB{g7qsUbnAu@Z)2B$)
z=}Lq-^e{aUrtX|0sa;q<aS;ZznJ!1!!6?!9wG&`q2QzU1#yiw>32sWyPoxlo?<`m=
z5k5XA-ec)*idA|=P$U-V_4ML#RaPYSx~Mqp2$X-!P4Iy5*!_XOcd6Yx+1MYjz7fX9
z<Z|XVspKh)mA~yGS2?XjlQ{m#Z&MQSOAn~30g0;<pXjcVJMQhO<23EXVIN%zi+_%J
zuZUN|G0az5ab%n5iYRK)S@CIwI<U9B|M6n7+~<qb^Nyb{IcP{ds@DDQUiCKWa!}tj
z?cdjrNxNZoE*rnUVVC&rRp}cWZO$|b^Vu?g4_6huO3@4E?&bqNMs4rQL;23XurIOB
z7e#lUf4yk&Yxbw#39m2Q^zuUsQ+vQs>1HjHA#%{PAH?WzIChhcYzKIqi#7jeD&nF7
ziaBdXIZgjyi_To{%<*6#F!OXOvH>Hivh@8k6=Bjd4wpwKn)>pxuA7F^c<5yT>JO(D
z&w%9$mqYkSCd=^(r8UcOSds;rU}9-8?`K9zT#2(HozYKzDD?~d_W7tjKU9BCz%+hr
zt<aRy>33gl%(;64*ofTIsR&5*iSJStg9;WL0<Ej#4^vNdS<JCHE?6iyo!wamBOE3(
zgA(2HpP><Ty<mnil23Pu`PlE9VD2H=qS6X1QK*!D?`u|BuQ<{I9m^E53H}axYf;e$
zruRP~4>1)1mbWC4EY(yUACsCXK|*|0Gbwqi!jhn2TXPGhO>EexaNlm+6{N(|f6LR@
zZ5XQyd07Jjtdt<%j*Cj$2v8iZg&rD5YX3exv(vF_?@nrE8<t&=l_O}1ATIK58pH3f
z60xih8S1_w1SVXOD}dDAFNR#or~t`b$gpMw>V&HX%KAga5L`t?-)!Wi-&a-(BCb@M
z@}dZmEt&V^cHsz_ZOJhV7F9jwp&$0DTvRf$sw^_kjyUn;C!R8Cl0PEcLYUFKk|PvB
zmY9`yZukK4Jr_Pb>!6XU1cD4_)Rxh}6xgYEon`U!2{$tIK|vaKo`O`f<&{s0=iXSu
zmhTAp;a3u!{asd-hC$xos#`_Sjk_9Ez-EHRf$SDjXX5Zo-30>sZelc2a!(}tP<lf+
zk|?+G3AZc$9{kJb$bnz;sSA9(5g~PXSl6=@Hh0FheV-DNrUjY#W3BX?Ibo#Y2STH+
zxpOVwOX-jasTLD_uIS8&DCd0TMUKFL#^)FJyvDN)#5n?G`+f|&V+q8`1nH)Qw`<-Q
zJ>n19K-uHl!(IX$^Rif&w7)l!hN6q&poPhtYubZ?h@Wrv_ejtt?D=xYsV~f8B5CEc
zo`}}XOLfQHxMqQ%QP+G1Xr1-J>WIM`lhdGO1yGR7u(8p1MQ|jhgC2JP00|v)vj4YF
z{ZHa&_HR7?C-D<xhb-_YXa1)gIXW#zs1dhRV5h4P-g`^@r$RGq%0WI?k8A1S^7Gbr
zzC=87vO$y+B(BCs3!;_5pl9G$t3t+|{;bNtoqZ(TR0YAF!L}fxrH`|jpucWNaCmg2
zPXIPX;7y!YLTZw)KpG}9E;}dJDGF17eiu@VF)4M*cf%s9s%!Y`%Tk*#8Li|t9$1HI
z3SR|pZ`DBU5LBFhl&95GVH`bK-px0cHP2tyfgWvHrLMOR^)ru-z5BY)`+jKT{)5sr
znV)9qL6A)&0m!5ZLHeZ_7dIPDbtd%HhlUu`WC5)&U}%rR;wwz$*@mW1t_pl0qQW9T
z#@z^u?40*tXhy1<{sR6jM0ogv97s3sL-<wO)1F#zqVGcM_gESAt7dm{)oFSa^*7Wi
zo@iG*>k0<vqXTY$3pO59Um0aHSu~K0M}nqNV{^fJkvDCPK(8C8x|C2r3c+)EM}t~Z
z{^>j&YtJVOtF?2Ks6PMKvy&CU5MzmWNvt^C%@6znCW8I?c`vvM7z&&^8>+`pnSa5L
z(HV||G_>u;aRV`uAEwlfc$}A9D7pgmcXo=dMDG^N^QF@jS<cpZmwfIBxvbUF6lP5~
zTJ&`I66WwLj2)k#)!Om~#!!qAxb)=s@5zaN&m0k2aqAKhHYcrm;*DU%J|Q7TYbmxX
zf06TkXTf3=KNhpY4u3ART4sQhZvqO$m{&08gQhLW3Z|<u|Khpy3&ZQlm+{ls6xxJ&
z;(=bdwQyRFoE~}zvPC|TMQ~90Al`k^mjPgH6$ZW|TbK*FN2~kXlVAX+h3MPXFDpFD
zOZ;N5#6?(1rVU-oO|k^r#Ul;c;4fqyM&UO>&o?a4Ud0|$nAEaQ#H<XGzsXvrBbWu7
zZMF}$NC#%~z`0@m5|r%tJUE^)MO=`%Ak*LV1w1<LcWT4{lxX=br=cM?g@+4x4$<Mu
zpp;b(atbom$m&0Y^zsY<nTkgn!en$#l37VgyP(oZ#UxKiXXR{*YHpQOi~-&bW14)W
zRN8K!Bo7R`Zo^nI*S`frB!raEf6L7%ZIHkR`=kvF5nk3*$`JP2%+HcVYt!G%thUCE
z;&5%e9CmwMbkRcX?Xwj@8wEGE{7d0yzFb!VI7~ug+PQ9Qvcv-9LY2P0xJdhczN)PX
zmmj0Elt5_{Bht{2|0Cisqq(rs$T{XaRp9yaL<f1z%hv55wWFP?hSfzMS3@vzpD&JL
zJQxpD^`cdsrk)0**2t+j%af+CO&9MDOAh}5K0BUiju;l)`&>I@_mRtG=J)SZruXAR
zVTaT!=M-@90gvP%^IlqVKGYyl>y-Mdc1*u;l_;w#j-%L7l-ue^aJ~h75$`YMt%^mw
z`}XM!`^RS848e8x7Amr0kTOHgdG+r+@ZSw9aN4l`@6!fZ_CP!mtW)sMDB~`AXOjV*
zYNy8aJG?i`zK@MNQcdNxdh?GAQAI}~U%cI;;)5DJyJSZFXQ>Gv$bCOE&R*acQu*Pg
zCDSyoAW0(!_Va^5Tx8wc-8}_~-jV(>enG)fVM*>L*tepBFo#%wXu?%+a#AWLJx{<l
z$6qo3G!YCd<}Ve<uJEg>#@5!kGp40uEm~vR+R@Oiupz!C3}`S$XSifEtgNvQEjAT1
z+c9U=z%$NYJ~g(=OS^6r@oC}HasXl<8#<b?d|^Ihir)*(p`zg&`I!O((f2EjFwet@
zb-yEF5Wlk_Z}7r-D0JA_TYSZHCt@KOd#I0_6-;%Sect5S`F1w;wZ-m-%_clf;0+5r
zPoaMYD?*Q6Bmkh*&StHPHqMmJU>T(-606%<FoI0b)6mZvxTux=P98<v=yK4zNtWlK
zroqaVBclkon&PLqGMrr68i&gbEDv8jkW^%+fn-<e2>;b^6$`8KgP$WeW%04ZPA8Re
z;OoCnX(mckZeLpfM3R(OjyNZ3C7(B!=xizg*TFCEK;3%SpTk%-VMuGC7p_XR-x5Bh
zp~wR{z&fY_8u`TbPd8z;kh!j=m-J`<0=4Zj`@<Qz<sWEHq}t^tRXFI54Kuaa_?z=@
z%eH(q_g`;ggOMKqj*OEV(1u${tZ%TrM52qN`6bSeAhlE+lnv%>c!v)*_iEO<c9zQ}
za5cqlIKlja-yOcabc2J`MPq%4$Jas78;>3n4W3yUAgCHQLV5eDy7RR2Y=WL%i>V4M
z$E*fQCxG<+xfauAjN^-;g&`>k8nG66i6%-TGxrT^*3oe)V0c@i!?=E4I1B#AN}8eP
z6f4My*3AqkW23BQ>g`YH03@k~m~agqx3!pXS+}^HsP;+Y+;G)kf%GK$4vTzO&jw6x
z_OxqKW?oHUfm&#uIwmKrCO9{p2P7zzL?v4Y$=~Ox-Av`z(-%rdxSY36FzKE)PZFjT
z+O8UVXk~Mvk<5Q#wc5yKzU16hdyOve7f%La-HVtaTa~qknLCXPxCvV(Sd-N*7&TM`
zsXv%@PipydFtZD;1Eqjl!86JDI@<V1lXgh!G!70^F1D>Y!+SvP+DJP?grLr)&;fkB
zvG^{oMOS(dsur<duOSTJ&r3p3oc-)KDv1MfLSho{@h8_wfDFUnrC~WCJaj}ezK!(*
zd-6SoQMG{UXnGpS_mYDcy(aE+_a8k5gZbha@h|Djn;q#bF1%3(Kl_FV2hk_k)PQYs
zOQc3PCVVT$@;k5mgh3{4ek!`{KBk>$M&Mr;XrNGa1Jp4amnrqiY?+bB*AlJ+i6Mkv
z)60PGrM8u;x^T)Ws#2+8>eEqZLkta>$sS%7|Cj_W7&yABL{GMDfYnD^gQ3k5X+_&^
zXUjaGu<tFDnzR{D(zgi=^Aa%l^yv{C^HZb@S5z4eKA6fbt+-Ls8tkbw9nvXFMK^iL
zZ49TIc+wwCw7MS85|gRp0gb!4C?I(=8Aq$;bDT(dWeLfUBi*{{&oWGW@b==zoKEpH
z0UVf#D}WY+mwziq1<Am;=}GZotf4#h9ah{-Pt5B$`bTK}+*5mP3&5Pl;Q_AN#AV+@
zMbs!>PKW;gbIJ9e4cdPOC9;=b_t>EJ|HfUzORY6Z25wS_GoUv|oCn8AGf?n-Mfh%6
z8xa1;Z~jzxQ1NC{4G)tESJZq1mR&OacRnGvn*M}c=vhQaI*O89{oOsTdWDdDB(;N-
zp&?#31bki#z}~7w$GnQeB&a2)VAIl{$A@Dh^Hd67<)X7O5dS*sGHm%fY&E*H5noWA
z$w%RHsrRq!;BRi>@8h8vtQ#)*AW>D!HxV#}p{1D#{4~c)bzPYLkjQKFpogw~yK|;z
z|8CE~=FrcKn?fI;VPr?^x|@P@S|9MH=4z7o$!=N_Xw@Exqm-L?(+c*>`>sI)<<B5!
zPf&V&_QdXR93xJ~$#^L+@g@wKloge$MU>>|^zEYpcf1QFK@aF`*8`z9vKKhitBKx8
z<?Si=*&n<MgWNA1TDoZ=6b>B>XI-1RYN^WhY*AchJzukfTe~9`Hd0gek@XcMIuT7I
z5>s_DTEc)&FAXm!K>}{h-X)r}N|~yMyMI4BGjQ*E$h2Jj#kCrE=|Z3;XWsh98v#{L
zsoUSyyJYCe=qp19&&3*-b><we18M>Uej$(X$=wnhBCF@BRe!m;fcQJw(2=v!4xg2>
zznq=$$o;uJ#VLs+b2b0@xwklw&U3%{@1LI!iqb@li6<uj?OHlJKlKIG`{3&>!U-!a
zY7OPNe-=gcW&4e32Qix!%z5rSSbIh^kSuuSf5a$84CGbN<6#wus>?!RYs{%3_&VRr
zP+I%Ixd1sPJRwx(5?#8l{6p-$$c^gNIg-X${ya>!|Iw0{=BW8{te#mt6l7%oYYwCo
z#7hJ-#aOIFfpQX8M8I;Vnu!St^-gl2CFA)Zk?_@IuU9%RQbqj4C~3Y5cEjmjByK;D
z539O)MhA?zmU9oFuI2hGNUY{WE73!t@%~Bc5-IlY3Yaqdg9~MH<EAl^@7}p>h`_51
zHi`wI$j#gbI~9c`fpg@dZ09*$A#&R|ZY!->5WnK8BuvJu!j6KsPLldX3|9*HWKQEe
z4LliuE=7g3S6fbJ*rcHGd)tj_p@ut6Y2k#D5~;fLn~;#@UpuvGgF?8{ud^EKkKPGt
zZ^2KFg*qu<QEM<+Mi?o`$k=-Q2_ph8jANwznCR2;Qo$}2cHT-83<%e5iNi0t%ZW15
zacJ5x`Y7xHzz^}1{n|Y~>i!6j!uzd>wMctM=mta%{6Qt!?)%{W)$J>Qkn-P(X5Hvy
zNw<gBFT9*sX*nlVrv~5;CVu*cRkK<(I!jeaN51(c@glp#w@J71&gPWv<X=l32H!B6
zspcK<;n`QUCNk_GhwWN{2$Qzjo@m|U*9#g5+||kRuP@!a0v3O9Ob?uYZU1ZZ>$Si1
zpT5NkgwGkIW&9Yg7JB7AP%p~;ecR!u$dUWKm*@UFNju%*|Bp%9e?lq2OG@+X?f-UN
zflVIXOQ!^x5MuZ5&8c|q0FN123mb7@$<ZUA?21|{sQSF!1ai1US%|6{a?VDXLrr9c
zK|Gc-)wt~h{#w_`_qn~Br39T<=nYb^pI=De6G2#L!lMWQ=vzMzjJqH>(JMR|lbYt6
zlo@oo#<$Ba;D1;2oQ@Hjg<-77tIn+R)hdm}*iv40xAWC@Mx&eg!Q}%bL%bt(8N6eB
z@sm~4JdAXmPOf}Z9-7IQ0n2>g_4<!x!+YM}_-WS;4&Mx5jDaS%znWu}0pS-FZ!EGh
zRmO*@$67DMy^Y4UKPh$8Op<h`d-<75f^Os_QKil1Q|Z|!<9~x?e27FSjMXLk9)&oZ
z-tgVU1O6;jElZ-jkPt~p(gi^pj#4(FiE@4iflk8h87eyZ;5#@DB6a;ES%6df@c_y&
z2>hYce`fNPzQh@s_enQLs#m64>6S`SD+j9GI+;lupDsAk`m{z)#84d11&V84pNV-~
z9KR#co55K3{A-^?cwVSO90#S|arsQ9V!p==I5P%v=kuh_mYZ1EWafK5-|~9r)h`sq
zbL`#IGOMZRA^r$CX2n;lFKE(Xa&NZx@4PR+-V9AW^K&O_)$d${uA0{OFPBTCZRPtC
zdiwrYR<3ik0VQfwP>ScWQIEbZfdf2!V%5Iat?!||_v4W(qliCnt^l_;r^P0_NVt0u
zJxK`!)H^AGCw4gt!NN6bSvaup9wqdjct4aOq5G{lgpay-y2VeV0L5XElrS~))c*<R
z1{nF+i#-bIq>~sXDdmkzvRJ^ASPDr108@5J<BM5_`QrdymI<bqVwUNpi)f;$W|wTX
z8RnZ)o+;;(T+)f8op%Nqm7Y|-cx9hKUU4L#GgjGRlY}OKAp|k%nd6Hi@YrXOlxC{w
zrkqmx21zY)r=d0i0N}u>rz)^w07SMLK!{PGDl4iSvD&Ju3&>~ctg-@-kgc}{%U}`%
z@M^3BzXq%900HQT0|Un%t7t7yEvqd57uw;lfCAAT+mE&2PJ2VQ-F_SHvH_q~69nXz
ztKPZR?oh)4?RNX9hwy?M0D&k3P;ayn<!kM*B>Zda0uVlOrNGP5VDPN>LNI^=6swCw
zj1Vk<)`bk;IzzD!pK6N&0F+!Z$x&>vMaG47Or*mPTWs>o0H``dt}5p|?Gp?~e1gGr
z4M6kIL*#5U1auJqY`8TL(5|m2kUaFv->n=91V$g7!WQSQ6m_%;P$>1(CVLa(0%)UM
z83S2oohu3lEFG-RDI5zS0%X(7hXDYj?e_uz$isHqIYX*K+{#*ps>U>ooi_k{B=Gm&
z0?9yl&To(6=oSP=f%oGkw=((O<lA6<`O2No<M`twjQ)2Cr>p!T;GmbBjq83tV|wf@
z7Et@iCE%WR3BJb8h1c`^-nR+DqiurmR&%uF@9H+6`3M&p4*~MdtWLJg!8hNp_7Wwa
zytvjUv-|1JKJq*G;R}z#0?^Z4i}zFWJ3{)fK`#;hG*bcpPT;?U0MKOcW1jd_z`KN)
z?{W4M!2nMX754ovZxNK>0#mTLtYu6^-%Hp8ujawtIZgrX8{r8swz36qPa-0-feKSV
zu}<A!hBj0J4s(bE$>GjoJWN90MhCSZW}#Gm13>Cf5dr`q`2+<701p5x00031X8>jZ
z00sZxBaUQgo@h!EM|%)zEYEapmu`OCeDC`@-ET-NidaDx%*brY3Q1SNN#zY{(OeAz
zsTv6kgMmTIx}J%Gx`1eSePOYD7c;kHg!P($c;DoJVlsAgDtd>0HGzR-DugNmd54IJ
zhKqrPCy$1cdIFV}mw;0!n<$-!pP;9rfQ_1VDX6KdrLBM|rY5s`OSL5hw{ovIu_uze
zq`$kug0N;M0?BHs%O-Kc#3H&Q)5_K+1kGb6+z;Mt;3?yMB<9|}>LudM+T6&z@+#xs
zP+8y7rd88dVobdiX5yVoR?ENvZ863bivny~4Fni{G}y?IMzeWQ6nc|^fPl%932y&z
zT-m_Dw-X-=1~IUUp^5~NPU=+2awW}Nw;+xXFtFmR7&&$76!23<&!<91v>IX)M@gkv
z6|Q^A6-6tpHV~l7L?UU{r8BsybrTMo!=gU$r8{=^Y}&P48Q5bXjtT++?Mhs&YxgeR
zr%lxnFiTh|+!Ke_zWkM-F<~2#yMiNX`E1}CnOVx~j8z(s0t`ZPoD8Zm>64#%95A4o
zbtTuNANLTKIdQE5xvQkcOVDy`C$!aqtwq>$BBoEtg3GG=&Fq!Z!TmK!^f<xq57>eq
zPrkhQ^Hc^nSkJz_`}P5RmrsxYqy78%5zsI3zQ6zV=sl3%fCP?^z<&s~my-W^1U8u8
z6bVKMV0jK!XrBlYM#!Lr79Nmcf?bfuVTT_g7~*&%R`@`P|81CJfh_vx;*0o+aA1rI
zo=4+@7~;rYfID7Df_gE=7vKZ*rMTabOg8D{lk%)lUKrwmqrjC{jyC{(^bK&uFIa||
zB|%)4Ilzf;BmjVzVv<?rn+tlu=9~)1vn8Bwe(40AbH@1#0eIqhW)pnU2~GfkCh8{-
zh4QHmqKXRILja9B3JwI320B1>CsbOfJeek1!vLNdDi5Tg!bwA^bE2tTs;bVws+f9?
z0Kl!@4Z(%04+wB4tV_l)>zF0ny1=mu0I)z25Cq`tvk<(5DX@#8Fzo+v0U)bwvbsL&
zEutp`@N1;Cs!%ElYHq9T56yn-?J46X%B!`Fs-Ud8$O2%SmnpdW?Yts*si+NWnyLc6
z+e)|Vt|rLWgQhkZd@#buX0pJ-3ok2`zwXWeX8=85NyEJqA4>uP7-Jk5104T5Y5>bs
zQL@P;q`YtmEq@!cJS5Ldg3TC{kh8Y{>oYUWKLgFM&_h2<-T^&RY=Y8DkFY?~&X#wy
z#x+yT>i}36{YwE+BYc9_yb6Fd$lsNXF92tI9d6j)Z4E%R51@?#+e|{Rbqad_Q0_8r
zs|&c??CMjvwnYbi0@y=~UCH9d!hJZ^Dl{#5B_+$?_})2l3d%v^gLjR&3JA2kIVj1h
zYq<)agYNF?wHV8_=ZMQdG?X#KZtv^7U#@iURGdyc6DTX4>+wBYZ1e5R8{s?`(5n*y
F06VwF?+O3_

literal 0
HcmV?d00001

diff --git a/lib/card_details.dart b/lib/card_details.dart
index 0e870f2..b0bf20d 100644
--- a/lib/card_details.dart
+++ b/lib/card_details.dart
@@ -32,14 +32,14 @@ class CardDetails {
   String? expirationString;
   DateTime? expirationDate;
   bool _complete = false;
-  ValidState _validState = ValidState.blank;
+  CardDetailsValidState _validState = CardDetailsValidState.blank;
   int _lastCheckHash = 0;
   CardProvider? provider;
 
-  set overrideValidState(ValidState state) => _validState = state;
+  set overrideValidState(CardDetailsValidState state) => _validState = state;
 
   /// Checks the validity of the `CardDetails` and returns the result.
-  ValidState get validState {
+  CardDetailsValidState get validState {
     checkIsValid();
     return _validState;
   }
@@ -80,7 +80,7 @@ class CardDetails {
       _lastCheckHash = currentHash;
       if (_cardNumber == null && expirationString == null && securityCode == null && postalCode == null) {
         _complete = false;
-        _validState = ValidState.blank;
+        _validState = CardDetailsValidState.blank;
         return;
       }
       final nums = _cardNumber!
@@ -92,71 +92,71 @@ class CardDetails {
           .toList();
       if (!_luhnAlgorithmCheck(nums)) {
         _complete = false;
-        _validState = ValidState.invalidCard;
+        _validState = CardDetailsValidState.invalidCard;
         return;
       }
       if (_cardNumber == null || !cardNumberFilled) {
         _complete = false;
-        _validState = ValidState.missingCard;
+        _validState = CardDetailsValidState.missingCard;
         return;
       }
       if (expirationString == null) {
         _complete = false;
-        _validState = ValidState.missingDate;
+        _validState = CardDetailsValidState.missingDate;
         return;
       }
       final expSplits = expirationString!.split('/');
       if (expSplits.length != 2 || expSplits.last == '') {
         _complete = false;
-        _validState = ValidState.missingDate;
+        _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 = ValidState.invalidMonth;
+        _validState = CardDetailsValidState.invalidMonth;
         return;
       }
       final year = 2000 + int.parse(expSplits.last);
       final date = DateTime(year, month);
       if (date.isBefore(DateTime.now())) {
         _complete = false;
-        _validState = ValidState.dateTooEarly;
+        _validState = CardDetailsValidState.dateTooEarly;
         return;
       } else if (date.isAfter(DateTime.now().add(const Duration(days: 365 * 50)))) {
         _complete = false;
-        _validState = ValidState.dateTooLate;
+        _validState = CardDetailsValidState.dateTooLate;
         return;
       }
       expirationDate = date;
       if (securityCode == null) {
         _complete = false;
-        _validState = ValidState.missingCVC;
+        _validState = CardDetailsValidState.missingCVC;
         return;
       }
       if (provider != null && securityCode!.length != provider!.cvcLength) {
         _complete = false;
-        _validState = ValidState.invalidCVC;
+        _validState = CardDetailsValidState.invalidCVC;
         return;
       }
       if (postalCode == null) {
         _complete = false;
-        _validState = ValidState.missingZip;
+        _validState = CardDetailsValidState.missingZip;
         return;
       }
       if (!RegExp(r'^\d{5}(-\d{4})?$').hasMatch(postalCode!)) {
         _complete = false;
-        _validState = ValidState.invalidZip;
+        _validState = CardDetailsValidState.invalidZip;
         return;
       }
       _complete = true;
-      _validState = ValidState.ok;
+      _validState = CardDetailsValidState.ok;
     } catch (err, st) {
       if (kDebugMode) {
         print('Error while validating CardDetails: $err\n$st');
       }
       _complete = false;
-      _validState = ValidState.error;
+      _validState = CardDetailsValidState.error;
     }
   }
 
@@ -245,7 +245,7 @@ class CardDetails {
 }
 
 /// Enum of validation states a `CardDetails` object can have.
-enum ValidState {
+enum CardDetailsValidState {
   ok,
   error,
   blank,
diff --git a/lib/card_provider_icon.dart b/lib/card_provider_icon.dart
index ce10680..0271cbc 100644
--- a/lib/card_provider_icon.dart
+++ b/lib/card_provider_icon.dart
@@ -7,9 +7,10 @@ import 'package:flutter_svg/flutter_svg.dart';
 ///
 /// To see a list of supported card providers, see `CardDetails.provider`.
 class CardProviderIcon extends StatefulWidget {
-  const CardProviderIcon({required this.cardDetails, super.key});
+  const CardProviderIcon({required this.cardDetails, this.size, super.key});
 
   final CardDetails? cardDetails;
+  final Size? size;
 
   @override
   State<CardProviderIcon> createState() => _CardProviderIconState();
@@ -34,22 +35,29 @@ class _CardProviderIconState extends State<CardProviderIcon> {
     CardProviderID.jcb.name:
         '<svg enable-background="new 0 0 780 500" height="500" viewBox="0 0 780 500" width="780" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientTransform="matrix(132.87 0 0 323.02 -120270 -100930)" gradientUnits="userSpaceOnUse" x1="908.72" x2="909.72" y1="313.21" y2="313.21"><stop offset="0" stop-color="#007b40"/><stop offset="1" stop-color="#55b330"/></linearGradient><linearGradient id="b" gradientTransform="matrix(133.43 0 0 323.02 -121080 -100920)" gradientUnits="userSpaceOnUse" x1="908.73" x2="909.73" y1="313.21" y2="313.21"><stop offset="0" stop-color="#1d2970"/><stop offset="1" stop-color="#006dba"/></linearGradient><linearGradient id="c" gradientTransform="matrix(132.96 0 0 323.03 -120500 -100930)" gradientUnits="userSpaceOnUse" x1="908.72" x2="909.72" y1="313.21" y2="313.21"><stop offset="0" stop-color="#6e2b2f"/><stop offset="1" stop-color="#e30138"/></linearGradient><path d="m632.24 361.27c0 41.615-33.729 75.36-75.357 75.36h-409.13v-297.88c0-41.626 33.73-75.371 75.364-75.371h409.12l-.001 297.89z" fill="#fff"/><path d="m498.86 256.54c11.686.254 23.438-.516 35.077.4 11.787 2.199 14.628 20.043 4.156 25.887-7.145 3.85-15.633 1.434-23.379 2.113h-15.854zm41.834-32.145c2.596 9.164-6.238 17.392-15.064 16.13h-26.77c.188-8.642-.367-18.022.272-26.209 10.724.302 21.547-.616 32.209.48 4.581 1.151 8.415 4.917 9.353 9.599zm64.425-135.9c.498 17.501.072 35.927.215 53.783-.033 72.596.07 145.19-.057 217.79-.47 27.207-24.582 50.848-51.601 51.391-27.045.11-54.094.017-81.143.047v-109.75c29.471-.152 58.957.309 88.416-.23 13.666-.858 28.635-9.875 29.271-24.914 1.609-15.104-12.631-25.551-26.151-27.201-5.197-.135-5.045-1.515 0-2.117 12.895-2.787 23.021-16.133 19.227-29.499-3.233-14.058-18.771-19.499-31.695-19.472-26.352-.179-52.709-.025-79.062-.077.17-20.489-.355-41 .283-61.474 2.088-26.716 26.807-48.748 53.446-48.27 26.287-.004 52.57-.004 78.851-.005z" fill="url(#a)"/><path d="m174.74 139.54c.673-27.164 24.888-50.611 51.872-51.008 26.945-.083 53.894-.012 80.839-.036-.074 90.885.146 181.78-.111 272.66-1.038 26.834-24.989 49.834-51.679 50.309-26.996.098-53.995.014-80.992.041v-113.45c26.223 6.195 53.722 8.832 80.474 4.723 15.991-2.573 33.487-10.426 38.901-27.016 3.984-14.191 1.741-29.126 2.334-43.691v-33.825h-46.297c-.208 22.371.426 44.781-.335 67.125-1.248 13.734-14.849 22.46-27.802 21.994-16.064.17-47.897-11.642-47.897-11.642-.08-41.914.466-94.405.693-136.18z" fill="url(#b)"/><path d="m324.72 211.89c-2.437.517-.49-8.301-1.113-11.646.166-21.15-.347-42.323.283-63.458 2.082-26.829 26.991-48.916 53.738-48.288h78.768c-.074 90.885.145 181.78-.111 272.66-1.039 26.834-24.992 49.833-51.683 50.309-26.997.102-53.997.016-80.996.042v-124.3c18.439 15.129 43.5 17.484 66.472 17.525 17.318-.006 34.535-2.676 51.353-6.67v-22.772c-18.953 9.446-41.233 15.446-62.243 10.019-14.656-3.648-25.295-17.812-25.058-32.937-1.698-15.729 7.522-32.335 22.979-37.011 19.191-6.008 40.107-1.413 58.096 6.398 3.854 2.018 7.766 4.521 6.225-1.921v-17.899c-30.086-7.158-62.104-9.792-92.33-2.005-8.749 2.468-17.273 6.211-24.38 11.956z" fill="url(#c)"/></svg>',
   };
-  final double height = 20;
-  final double width = 30;
+
+  late final Size _size;
+
+  @override
+  initState() {
+    super.initState();
+
+    _size = widget.size ?? const Size(30.0, 20.0);
+  }
 
   @override
   Widget build(BuildContext context) {
     late Widget child;
     if (widget.cardDetails?.cardNumber != null &&
         widget.cardDetails!.cardNumberFilled &&
-        widget.cardDetails!.validState == ValidState.invalidCard) {
+        widget.cardDetails!.validState == CardDetailsValidState.invalidCard) {
       child = Padding(
         padding: const EdgeInsets.symmetric(horizontal: 5.0),
         child: SvgPicture.string(
           key: const Key('invalid-card'),
           cardProviderSvg['error']!,
-          height: height,
-          width: width,
+          height: _size.height,
+          width: _size.width,
         ),
       );
     } else {
@@ -59,8 +67,8 @@ class _CardProviderIconState extends State<CardProviderIcon> {
           child: SvgPicture.string(
             key: const Key('credit_card'),
             cardProviderSvg['credit-card']!,
-            height: height,
-            width: width,
+            height: _size.height,
+            width: _size.width,
           ),
         );
       } else {
@@ -86,8 +94,8 @@ class _CardProviderIconState extends State<CardProviderIcon> {
     return SvgPicture.string(
       key: Key('${id.name}-card'),
       cardProviderSvg[id.name]!,
-      height: height,
-      width: width,
+      height: _size.height,
+      width: _size.width,
     );
   }
 }
diff --git a/lib/stripe_native_card_field.dart b/lib/stripe_native_card_field.dart
index 2e721a6..323498d 100644
--- a/lib/stripe_native_card_field.dart
+++ b/lib/stripe_native_card_field.dart
@@ -2,6 +2,8 @@ library stripe_native_card_field;
 
 import 'dart:async';
 import 'dart:convert';
+import 'dart:developer';
+import 'dart:io';
 
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
@@ -28,9 +30,9 @@ enum CardEntryStep { number, exp, cvc, postal }
 class CardTextField extends StatefulWidget {
   CardTextField({
     Key? key,
+    required this.width,
     this.onStripeResponse,
     this.onCardDetailsComplete,
-    required this.width,
     this.stripePublishableKey,
     this.height,
     this.textStyle,
@@ -39,61 +41,89 @@ class CardTextField extends StatefulWidget {
     this.boxDecoration,
     this.errorBoxDecoration,
     this.loadingWidget,
+    this.showInternalLoadingWidget = true,
     this.delayToShowLoading = const Duration(milliseconds: 750),
+    this.onCallToStripe,
     this.overrideValidState,
     this.errorText,
+    this.cardFieldWidth,
+    this.expFieldWidth,
+    this.securityFieldWidth,
+    this.postalFieldWidth,
+    this.iconSize,
     // this.loadingWidgetLocation = LoadingLocation.rightInside,
   }) : super(key: key) {
     if (stripePublishableKey != null) {
       assert(stripePublishableKey!.startsWith('pk_'));
       if (kReleaseMode && !stripePublishableKey!.startsWith('pk_live_')) {
-        print('StripeNativeCardField: *WARN* You are not using a live publishableKey in production.');
+        log('StripeNativeCardField: *WARN* You are not using a live publishableKey in production.');
       } else if ((kDebugMode || kProfileMode) && stripePublishableKey!.startsWith('pk_live_')) {
-        print(
-            'StripeNativeCardField: *WARN* You are using a live stripe key in a debug environment, proceed with caution!');
-        print('StripeNativeCardField: *WARN* Ideally you should be using your test keys whenever not in production.');
+        log('StripeNativeCardField: *WARN* You are using a live stripe key in a debug environment, proceed with caution!');
+        log('StripeNativeCardField: *WARN* Ideally you should be using your test keys whenever not in production.');
       }
     } else {
       if (onStripeResponse != null) {
-        print(
-            'StripeNativeCardField: *ERROR* You provided the onTokenReceived callback, but did not provide a stripePublishableKey.');
+        log('StripeNativeCardField: *ERROR* You provided the onTokenReceived callback, but did not provide a stripePublishableKey.');
         assert(false);
       }
     }
   }
 
+  /// Width of the entire CardTextField
+  final double width;
+
+  /// Height of the entire CardTextField, defaults to 60.0
+  final double? height;
+
+  /// Width of card number field, only override if changing the default `textStyle.fontSize`, defaults to 180.0
+  final double? cardFieldWidth;
+
+  /// Width of expiration date field, only override if changing the default `textStyle.fontSize`, defaults to 70.0
+  final double? expFieldWidth;
+
+  /// Width of security number field, only override if changing the default `textStyle.fontSize`, defaults to 40.0
+  final double? securityFieldWidth;
+
+  /// Width of postal code field, only override if changing the default `textStyle.fontSize`, defaults to 95.0
+  final double? postalFieldWidth;
+
   /// Overrides the default box decoration of the text field
   final BoxDecoration? boxDecoration;
 
   /// Overrides the default box decoration of the text field when there is a validation error
   final BoxDecoration? errorBoxDecoration;
 
-  /// Width of the entire CardTextField
-  final double width;
-
-  /// Height of the entire CardTextField
-  final double? height;
-
-  /// Stripe publishable key, starts with 'pk_'
-  final String? stripePublishableKey;
-
   /// Shown and overrides CircularProgressIndicator() if the request to stripe takes longer than `delayToShowLoading`
   final Widget? loadingWidget;
 
+  /// Overrides default icon size of the card provider, defaults to `Size(30.0, 20.0)`
+  final Size? iconSize;
+
+  /// Determines where the loading indicator appears when contacting stripe
+  // final LoadingLocation loadingWidgetLocation;
+
   /// Default TextStyle
   final TextStyle? textStyle;
 
-  /// Default TextStyle for the hint text in each TextFormField
+  /// Default TextStyle for the hint text in each TextFormField.
+  /// If null, inherits from the `textStyle`.
   final TextStyle? hintTextStyle;
 
   /// TextStyle used when any TextFormField's have a validation error
+  /// If null, inherits from the `textStyle`.
   final TextStyle? errorTextStyle;
 
   /// Time to wait until showing the loading indicator when retrieving Stripe token
   final Duration delayToShowLoading;
 
-  /// Determines where the loading indicator appears when contacting stripe
-  // final LoadingLocation loadingWidgetLocation;
+  /// Whether to show the internal loading widget on calls to Stripe
+  final bool showInternalLoadingWidget;
+
+  /// Stripe publishable key, starts with 'pk_'
+  final String? stripePublishableKey;
+
+  /// Callback when the http request is made to Stripe
+  final void Function()? onCallToStripe;
 
   /// Callback that returns the stripe token for the card
   final void Function(Map<String, dynamic>)? onStripeResponse;
@@ -102,7 +132,7 @@ class CardTextField extends StatefulWidget {
   final void Function(CardDetails)? onCardDetailsComplete;
 
   /// Can manually override the ValidState to surface errors returned from Stripe
-  final ValidState? overrideValidState;
+  final CardDetailsValidState? overrideValidState;
 
   /// Can manually override the errorText displayed to surface errors returned from Stripe
   final String? errorText;
@@ -137,16 +167,32 @@ class CardTextFieldState extends State<CardTextField> {
   late final TextStyle _normalTextStyle;
   late final TextStyle _hintTextSyle;
 
-  final double _cardFieldWidth = 180.0;
-  final double _expirationFieldWidth = 70.0;
-  final double _securityFieldWidth = 40.0;
-  final double _postalFieldWidth = 95.0;
+  /// Width of the card number text field
+  late final double _cardFieldWidth;
+
+  /// Width of the expiration text field
+  late final double _expirationFieldWidth;
+
+  /// Width of the security code text field
+  late final double _securityFieldWidth;
+
+  /// Width of the postal code text field
+  late final double _postalFieldWidth;
+
+  /// Width of the internal scrollable field, is potentially larger than the provided `widget.width`
   late final double _internalFieldWidth;
+
+  /// Width of the gap between card number and expiration text fields when expanded
   late final double _expanderWidthExpanded;
-  late final double _expanderWidthContracted;
+
+  /// Width of the gap between card number and expiration text fields when collapsed
+  late final double _expanderWidthCollapsed;
 
   String? _validationErrorText;
   bool _showBorderError = false;
+  final _isMobile = Platform.isAndroid || Platform.isIOS;
+
+  /// If a request to Stripe is being made
   bool _loading = false;
   final CardDetails _cardDetails = CardDetails.blank();
   int _prevErrorOverrideHash = 0;
@@ -159,19 +205,32 @@ class CardTextFieldState extends State<CardTextField> {
 
   @override
   void initState() {
+    _cardFieldWidth = widget.cardFieldWidth ?? 180.0;
+    _expirationFieldWidth = widget.expFieldWidth ?? 70.0;
+    _securityFieldWidth = widget.securityFieldWidth ?? 40.0;
+    _postalFieldWidth = widget.postalFieldWidth ?? 95.0;
+
+    // No way to get backspace events on soft keyboards, so add invisible character to detect delete
     _cardNumberController = TextEditingController();
-    _expirationController = TextEditingController();
-    _securityCodeController = TextEditingController();
-    _postalCodeController = TextEditingController();
+    _expirationController = TextEditingController(text: _isMobile ? '\u200b' : '');
+    _securityCodeController = TextEditingController(text: _isMobile ? '\u200b' : '');
+    _postalCodeController = TextEditingController(text: _isMobile ? '\u200b' : '');
+
+    // Otherwise, use `RawKeyboard` listener
+    if (!_isMobile) {
+      RawKeyboard.instance.addListener(_backspaceTransitionListener);
+    }
 
     cardNumberFocusNode = FocusNode();
     expirationFocusNode = FocusNode();
     securityCodeFocusNode = FocusNode();
     postalCodeFocusNode = FocusNode();
 
-    _errorTextStyle = const TextStyle(color: Colors.red, fontSize: 14, inherit: true).merge(widget.errorTextStyle);
+    _errorTextStyle = const TextStyle(color: Colors.red, fontSize: 14, inherit: true)
+        .merge(widget.errorTextStyle ?? widget.textStyle);
     _normalTextStyle = const TextStyle(color: Colors.black87, fontSize: 14, inherit: true).merge(widget.textStyle);
-    _hintTextSyle = const TextStyle(color: Colors.black54, fontSize: 14, inherit: true).merge(widget.hintTextStyle);
+    _hintTextSyle = const TextStyle(color: Colors.black54, fontSize: 14, inherit: true)
+        .merge(widget.hintTextStyle ?? widget.textStyle);
 
     _normalBoxDecoration = BoxDecoration(
       color: const Color(0xfff6f9fc),
@@ -212,12 +271,13 @@ class CardTextFieldState extends State<CardTextField> {
     _currentCardEntryStepController.stream.listen(
       _onStepChange,
     );
-    RawKeyboard.instance.addListener(_backspaceTransitionListener);
-    isWideFormat = widget.width >= 450;
+
+    isWideFormat =
+        widget.width >= _cardFieldWidth + _expirationFieldWidth + _securityFieldWidth + _postalFieldWidth + 60.0;
     if (isWideFormat) {
       _internalFieldWidth = widget.width + _postalFieldWidth + 35;
       _expanderWidthExpanded = widget.width - _cardFieldWidth - _expirationFieldWidth - _securityFieldWidth - 35;
-      _expanderWidthContracted =
+      _expanderWidthCollapsed =
           widget.width - _cardFieldWidth - _expirationFieldWidth - _securityFieldWidth - _postalFieldWidth - 70;
     } else {
       _internalFieldWidth = _cardFieldWidth + _expirationFieldWidth + _securityFieldWidth + _postalFieldWidth + 80;
@@ -236,7 +296,9 @@ class CardTextFieldState extends State<CardTextField> {
     expirationFocusNode.dispose();
     securityCodeFocusNode.dispose();
 
-    RawKeyboard.instance.removeListener(_backspaceTransitionListener);
+    if (!_isMobile) {
+      RawKeyboard.instance.removeListener(_backspaceTransitionListener);
+    }
 
     super.dispose();
   }
@@ -259,6 +321,30 @@ class CardTextFieldState extends State<CardTextField> {
               // Focuses to the current field
               _currentCardEntryStepController.add(_currentStep);
             },
+            // Enable scrolling on mobile and if its narrow (not all fields visible)
+            onHorizontalDragUpdate: (details) {
+              if (!_isMobile || isWideFormat) return;
+              final newOffset = _horizontalScrollController.offset - details.delta.dx;
+
+              final max = _horizontalScrollController.position.maxScrollExtent;
+              if (newOffset < -30.0) {
+                _horizontalScrollController.jumpTo(-30.0);
+              } else if (newOffset > max + 30.0) {
+                _horizontalScrollController.jumpTo(max + 30.0);
+              } else {
+                _horizontalScrollController.jumpTo(newOffset);
+              }
+            },
+            onHorizontalDragEnd: (details) {
+              if (!_isMobile || isWideFormat || details.primaryVelocity == null) return;
+
+              const dur = Duration(milliseconds: 300);
+              const cur = Curves.ease;
+
+              // final max = _horizontalScrollController.position.maxScrollExtent;
+              final newOffset = _horizontalScrollController.offset - details.primaryVelocity! * 0.15;
+              _horizontalScrollController.animateTo(newOffset, curve: cur, duration: dur);
+            },
             child: Container(
               width: widget.width,
               height: widget.height ?? 60.0,
@@ -279,6 +365,7 @@ class CardTextFieldState extends State<CardTextField> {
                             padding: const EdgeInsets.symmetric(horizontal: 6.0),
                             child: CardProviderIcon(
                               cardDetails: _cardDetails,
+                              size: widget.iconSize,
                             ),
                           ),
                           SizedBox(
@@ -288,7 +375,11 @@ class CardTextFieldState extends State<CardTextField> {
                               focusNode: cardNumberFocusNode,
                               controller: _cardNumberController,
                               keyboardType: TextInputType.number,
-                              style: _isRedText([ValidState.invalidCard, ValidState.missingCard, ValidState.blank])
+                              style: _isRedText([
+                                CardDetailsValidState.invalidCard,
+                                CardDetailsValidState.missingCard,
+                                CardDetailsValidState.blank
+                              ])
                                   ? _errorTextStyle
                                   : _normalTextStyle,
                               validator: (content) {
@@ -296,9 +387,9 @@ class CardTextFieldState extends State<CardTextField> {
                                   return null;
                                 }
                                 _cardDetails.cardNumber = content;
-                                if (_cardDetails.validState == ValidState.invalidCard) {
+                                if (_cardDetails.validState == CardDetailsValidState.invalidCard) {
                                   _setValidationState('Your card number is invalid.');
-                                } else if (_cardDetails.validState == ValidState.missingCard) {
+                                } else if (_cardDetails.validState == CardDetailsValidState.missingCard) {
                                   _setValidationState('Your card number is incomplete.');
                                 }
                                 return null;
@@ -340,7 +431,7 @@ class CardTextFieldState extends State<CardTextField> {
                                         Size(_expanderWidthExpanded, 0.0),
                                       )
                                     : BoxConstraints.tight(
-                                        Size(_expanderWidthContracted, 0.0),
+                                        Size(_expanderWidthCollapsed, 0.0),
                                       ),
                               ),
                             ),
@@ -348,170 +439,210 @@ class CardTextFieldState extends State<CardTextField> {
                           // Spacer(flex: _currentStep == CardEntryStep.number ? 100 : 1),
                           SizedBox(
                             width: _expirationFieldWidth,
-                            child: TextFormField(
-                              key: const Key('expiration_field'),
-                              focusNode: expirationFocusNode,
-                              controller: _expirationController,
-                              style: _isRedText([
-                                ValidState.dateTooLate,
-                                ValidState.dateTooEarly,
-                                ValidState.missingDate,
-                                ValidState.invalidMonth
-                              ])
-                                  ? _errorTextStyle
-                                  : _normalTextStyle,
-                              validator: (content) {
-                                if (content == null || content.isEmpty) {
-                                  return null;
-                                }
-                                setState(() => _cardDetails.expirationString = content);
-                                if (_cardDetails.validState == ValidState.dateTooEarly) {
-                                  _setValidationState('Your card\'s expiration date is in the past.');
-                                } else if (_cardDetails.validState == ValidState.dateTooLate) {
-                                  _setValidationState('Your card\'s expiration year is invalid.');
-                                } else if (_cardDetails.validState == ValidState.missingDate) {
-                                  _setValidationState('You must include your card\'s expiration date.');
-                                } else if (_cardDetails.validState == ValidState.invalidMonth) {
-                                  _setValidationState('Your card\'s expiration month is invalid.');
-                                }
-                                return null;
-                              },
-                              onChanged: (str) {
-                                setState(() => _cardDetails.expirationString = str);
-                                if (str.length == 5) {
-                                  _currentCardEntryStepController.add(CardEntryStep.cvc);
-                                }
-                              },
-                              onFieldSubmitted: (_) => _currentCardEntryStepController.add(CardEntryStep.cvc),
-                              inputFormatters: [
-                                LengthLimitingTextInputFormatter(5),
-                                FilteringTextInputFormatter.allow(RegExp('[0-9/]')),
-                                CardExpirationFormatter(),
+                            child: Stack(
+                              alignment: Alignment.centerLeft,
+                              children: [
+                                // Must manually add hint label because they wont show on mobile with backspace hack
+                                if (_isMobile && _expirationController.text == '\u200b')
+                                  Text('MM/YY', style: _hintTextSyle),
+                                TextFormField(
+                                  key: const Key('expiration_field'),
+                                  focusNode: expirationFocusNode,
+                                  controller: _expirationController,
+                                  keyboardType: TextInputType.number,
+                                  style: _isRedText([
+                                    CardDetailsValidState.dateTooLate,
+                                    CardDetailsValidState.dateTooEarly,
+                                    CardDetailsValidState.missingDate,
+                                    CardDetailsValidState.invalidMonth
+                                  ])
+                                      ? _errorTextStyle
+                                      : _normalTextStyle,
+                                  validator: (content) {
+                                    if (content == null || content.isEmpty || _isMobile && content == '\u200b') {
+                                      return null;
+                                    }
+
+                                    if (_isMobile) {
+                                      setState(() => _cardDetails.expirationString = content.replaceAll('\u200b', ''));
+                                    } else {
+                                      setState(() => _cardDetails.expirationString = content);
+                                    }
+
+                                    if (_cardDetails.validState == CardDetailsValidState.dateTooEarly) {
+                                      _setValidationState('Your card\'s expiration date is in the past.');
+                                    } else if (_cardDetails.validState == CardDetailsValidState.dateTooLate) {
+                                      _setValidationState('Your card\'s expiration year is invalid.');
+                                    } else if (_cardDetails.validState == CardDetailsValidState.missingDate) {
+                                      _setValidationState('You must include your card\'s expiration date.');
+                                    } else if (_cardDetails.validState == CardDetailsValidState.invalidMonth) {
+                                      _setValidationState('Your card\'s expiration month is invalid.');
+                                    }
+                                    return null;
+                                  },
+                                  onChanged: (str) {
+                                    if (_isMobile) {
+                                      if (str.isEmpty) {
+                                        _backspacePressed();
+                                      }
+                                      setState(() => _cardDetails.expirationString = str.replaceAll('\u200b', ''));
+                                    } else {
+                                      setState(() => _cardDetails.expirationString = str);
+                                    }
+                                    if (str.length == 5) {
+                                      _currentCardEntryStepController.add(CardEntryStep.cvc);
+                                    }
+                                  },
+                                  onFieldSubmitted: (_) => _currentCardEntryStepController.add(CardEntryStep.cvc),
+                                  inputFormatters: [
+                                    LengthLimitingTextInputFormatter(5),
+                                    FilteringTextInputFormatter.allow(RegExp('[0-9/]')),
+                                    CardExpirationFormatter(),
+                                  ],
+                                  decoration: InputDecoration(
+                                    contentPadding: EdgeInsets.zero,
+                                    hintText: _isMobile ? '' : 'MM/YY',
+                                    hintStyle: _hintTextSyle,
+                                    fillColor: Colors.transparent,
+                                    border: InputBorder.none,
+                                  ),
+                                ),
                               ],
-                              decoration: InputDecoration(
-                                contentPadding: EdgeInsets.zero,
-                                hintText: 'MM/YY',
-                                hintStyle: _hintTextSyle,
-                                fillColor: Colors.transparent,
-                                border: InputBorder.none,
-                              ),
                             ),
                           ),
                           SizedBox(
                             width: _securityFieldWidth,
-                            child: TextFormField(
-                              key: const Key('security_field'),
-                              focusNode: securityCodeFocusNode,
-                              controller: _securityCodeController,
-                              style: _isRedText([ValidState.invalidCVC, ValidState.missingCVC])
-                                  ? _errorTextStyle
-                                  : _normalTextStyle,
-                              validator: (content) {
-                                if (content == null || content.isEmpty) {
-                                  return null;
-                                }
-                                setState(() => _cardDetails.securityCode = content);
-                                if (_cardDetails.validState == ValidState.invalidCVC) {
-                                  _setValidationState('Your card\'s security code is invalid.');
-                                } else if (_cardDetails.validState == ValidState.missingCVC) {
-                                  _setValidationState('Your card\'s security code is incomplete.');
-                                }
-                                return null;
-                              },
-                              onFieldSubmitted: (_) => _currentCardEntryStepController.add(CardEntryStep.postal),
-                              onChanged: (str) {
-                                setState(() => _cardDetails.expirationString = str);
-                                if (str.length == _cardDetails.provider?.cvcLength) {
-                                  _currentCardEntryStepController.add(CardEntryStep.postal);
-                                }
-                              },
-                              inputFormatters: [
-                                LengthLimitingTextInputFormatter(
-                                    _cardDetails.provider == null ? 4 : _cardDetails.provider!.cvcLength),
-                                FilteringTextInputFormatter.allow(RegExp('[0-9]')),
+                            child: Stack(
+                              alignment: Alignment.centerLeft,
+                              children: [
+                                if (_isMobile && _securityCodeController.text == '\u200b')
+                                  Text(
+                                    'CVC',
+                                    style: _hintTextSyle,
+                                  ),
+                                TextFormField(
+                                  key: const Key('security_field'),
+                                  focusNode: securityCodeFocusNode,
+                                  controller: _securityCodeController,
+                                  keyboardType: TextInputType.number,
+                                  style:
+                                      _isRedText([CardDetailsValidState.invalidCVC, CardDetailsValidState.missingCVC])
+                                          ? _errorTextStyle
+                                          : _normalTextStyle,
+                                  validator: (content) {
+                                    if (content == null || content.isEmpty || _isMobile && content == '\u200b') {
+                                      return null;
+                                    }
+
+                                    if (_isMobile) {
+                                      setState(() => _cardDetails.securityCode = content.replaceAll('\u200b', ''));
+                                    } else {
+                                      setState(() => _cardDetails.securityCode = content);
+                                    }
+
+                                    if (_cardDetails.validState == CardDetailsValidState.invalidCVC) {
+                                      _setValidationState('Your card\'s security code is invalid.');
+                                    } else if (_cardDetails.validState == CardDetailsValidState.missingCVC) {
+                                      _setValidationState('Your card\'s security code is incomplete.');
+                                    }
+                                    return null;
+                                  },
+                                  onFieldSubmitted: (_) => _currentCardEntryStepController.add(CardEntryStep.postal),
+                                  onChanged: (str) {
+                                    if (_isMobile) {
+                                      if (str.isEmpty) {
+                                        _backspacePressed();
+                                      }
+                                      setState(() => _cardDetails.expirationString = str.replaceAll('\u200b', ''));
+                                    } else {
+                                      setState(() => _cardDetails.expirationString = str);
+                                    }
+
+                                    if (str.length == _cardDetails.provider?.cvcLength) {
+                                      _currentCardEntryStepController.add(CardEntryStep.postal);
+                                    }
+                                  },
+                                  inputFormatters: [
+                                    LengthLimitingTextInputFormatter(
+                                        _cardDetails.provider == null ? 4 : _cardDetails.provider!.cvcLength),
+                                    FilteringTextInputFormatter.allow(RegExp('[0-9]')),
+                                  ],
+                                  decoration: InputDecoration(
+                                    contentPadding: EdgeInsets.zero,
+                                    hintText: _isMobile ? '' : 'CVC',
+                                    hintStyle: _hintTextSyle,
+                                    fillColor: Colors.transparent,
+                                    border: InputBorder.none,
+                                  ),
+                                ),
                               ],
-                              decoration: InputDecoration(
-                                contentPadding: EdgeInsets.zero,
-                                hintText: 'CVC',
-                                hintStyle: _hintTextSyle,
-                                fillColor: Colors.transparent,
-                                border: InputBorder.none,
-                              ),
                             ),
                           ),
                           SizedBox(
                             width: _postalFieldWidth,
-                            child: TextFormField(
-                              key: const Key('postal_field'),
-                              focusNode: postalCodeFocusNode,
-                              controller: _postalCodeController,
-                              style: _isRedText([ValidState.invalidZip, ValidState.missingZip])
-                                  ? _errorTextStyle
-                                  : _normalTextStyle,
-                              validator: (content) {
-                                if (content == null || content.isEmpty) {
-                                  return null;
-                                }
-                                setState(() => _cardDetails.postalCode = content);
+                            child: Stack(
+                              alignment: Alignment.centerLeft,
+                              children: [
+                                if (_isMobile && _postalCodeController.text == '\u200b')
+                                  Text(
+                                    'Postal Code',
+                                    style: _hintTextSyle,
+                                  ),
+                                TextFormField(
+                                  key: const Key('postal_field'),
+                                  focusNode: postalCodeFocusNode,
+                                  controller: _postalCodeController,
+                                  keyboardType: TextInputType.number,
+                                  style:
+                                      _isRedText([CardDetailsValidState.invalidZip, CardDetailsValidState.missingZip])
+                                          ? _errorTextStyle
+                                          : _normalTextStyle,
+                                  validator: (content) {
+                                    if (content == null || content.isEmpty || _isMobile && content == '\u200b') {
+                                      return null;
+                                    }
 
-                                if (_cardDetails.validState == ValidState.invalidZip) {
-                                  _setValidationState('The postal code you entered is not correct.');
-                                } else if (_cardDetails.validState == ValidState.missingZip) {
-                                  _setValidationState('You must enter your card\'s postal code.');
-                                }
-                                return null;
-                              },
-                              onChanged: (str) {
-                                setState(() => _cardDetails.postalCode = str);
-                              },
-                              textInputAction: TextInputAction.done,
-                              onFieldSubmitted: (_) async {
-                                _validateFields();
-                                if (_cardDetails.isComplete) {
-                                  if (widget.onCardDetailsComplete != null) {
-                                    widget.onCardDetailsComplete!(_cardDetails);
-                                  } else if (widget.onStripeResponse != null) {
-                                    bool returned = false;
+                                    if (_isMobile) {
+                                      setState(() => _cardDetails.postalCode = content.replaceAll('\u200b', ''));
+                                    } else {
+                                      setState(() => _cardDetails.postalCode = content);
+                                    }
 
-                                    Future.delayed(
-                                      const Duration(milliseconds: 750),
-                                      () => returned ? null : setState(() => _loading = true),
-                                    );
-
-                                    const stripeCardUrl = 'https://api.stripe.com/v1/tokens';
-                                    final response = await http.post(
-                                      Uri.parse(stripeCardUrl),
-                                      body: {
-                                        'card[number]': _cardDetails.cardNumber,
-                                        'card[cvc]': _cardDetails.securityCode,
-                                        'card[exp_month]': _cardDetails.expMonth,
-                                        'card[exp_year]': _cardDetails.expYear,
-                                        'card[address_zip]': _cardDetails.postalCode,
-                                        'key': widget.stripePublishableKey,
-                                      },
-                                      headers: {"Content-Type": "application/x-www-form-urlencoded"},
-                                    );
-
-                                    returned = true;
-                                    final jsonBody = jsonDecode(response.body);
-
-                                    widget.onStripeResponse!(jsonBody);
-                                    if (_loading) setState(() => _loading = false);
-                                  }
-                                }
-                              },
-                              decoration: InputDecoration(
-                                contentPadding: EdgeInsets.zero,
-                                hintText: 'Postal Code',
-                                hintStyle: _hintTextSyle,
-                                fillColor: Colors.transparent,
-                                border: InputBorder.none,
-                              ),
+                                    if (_cardDetails.validState == CardDetailsValidState.invalidZip) {
+                                      _setValidationState('The postal code you entered is not correct.');
+                                    } else if (_cardDetails.validState == CardDetailsValidState.missingZip) {
+                                      _setValidationState('You must enter your card\'s postal code.');
+                                    }
+                                    return null;
+                                  },
+                                  onChanged: (str) {
+                                    if (_isMobile) {
+                                      if (str.isEmpty) {
+                                        _backspacePressed();
+                                      }
+                                      setState(() => _cardDetails.postalCode = str.replaceAll('\u200b', ''));
+                                    } else {
+                                      setState(() => _cardDetails.postalCode = str);
+                                    }
+                                  },
+                                  textInputAction: TextInputAction.done,
+                                  onFieldSubmitted: (_) {
+                                    _postalFieldSubmitted();
+                                  },
+                                  decoration: InputDecoration(
+                                    contentPadding: EdgeInsets.zero,
+                                    hintText: _isMobile ? '' : 'Postal Code',
+                                    hintStyle: _hintTextSyle,
+                                    fillColor: Colors.transparent,
+                                    border: InputBorder.none,
+                                  ),
+                                ),
+                              ],
                             ),
                           ),
                           AnimatedOpacity(
                             duration: const Duration(milliseconds: 300),
-                            opacity: _loading ? 1.0 : 0.0,
+                            opacity: _loading && widget.showInternalLoadingWidget ? 1.0 : 0.0,
                             child: widget.loadingWidget ?? const CircularProgressIndicator(),
                           ),
                         ],
@@ -529,7 +660,8 @@ class CardTextFieldState extends State<CardTextField> {
           child: Padding(
             padding: const EdgeInsets.only(top: 8.0, left: 14.0),
             child: Text(
-              _validationErrorText ?? '',
+              // Spacing changes by like a pixel if its an empty string, slight jitter when error appears and disappears
+              _validationErrorText ?? ' ',
               style: const TextStyle(color: Colors.red),
             ),
           ),
@@ -538,9 +670,47 @@ class CardTextFieldState extends State<CardTextField> {
     );
   }
 
+  Future<void> _postalFieldSubmitted() async {
+    _validateFields();
+    if (_cardDetails.isComplete) {
+      if (widget.onCardDetailsComplete != null) {
+        widget.onCardDetailsComplete!(_cardDetails);
+      } else if (widget.onStripeResponse != null) {
+        bool returned = false;
+
+        Future.delayed(
+          const Duration(milliseconds: 750),
+          () => returned ? null : setState(() => _loading = true),
+        );
+
+        const stripeCardUrl = 'https://api.stripe.com/v1/tokens';
+        // Callback that stripe call is being made
+        if (widget.onCallToStripe != null) widget.onCallToStripe!();
+        final response = await http.post(
+          Uri.parse(stripeCardUrl),
+          body: {
+            'card[number]': _cardDetails.cardNumber,
+            'card[cvc]': _cardDetails.securityCode,
+            'card[exp_month]': _cardDetails.expMonth,
+            'card[exp_year]': _cardDetails.expYear,
+            'card[address_zip]': _cardDetails.postalCode,
+            'key': widget.stripePublishableKey,
+          },
+          headers: {"Content-Type": "application/x-www-form-urlencoded"},
+        );
+
+        returned = true;
+        final jsonBody = jsonDecode(response.body);
+
+        widget.onStripeResponse!(jsonBody);
+        if (_loading) setState(() => _loading = false);
+      }
+    }
+  }
+
   /// Provided a list of `ValidState`, returns whether
   /// make the text field red
-  bool _isRedText(List<ValidState> args) {
+  bool _isRedText(List<CardDetailsValidState> args) {
     return _showBorderError && args.contains(_cardDetails.validState);
   }
 
@@ -623,6 +793,23 @@ class CardTextFieldState extends State<CardTextField> {
     if (!isWideFormat) {
       _scrollRow(step);
     }
+    // If mobile, and keyboard is closed, unfocus, to allow refocus
+    // print(MediaQuery.of(context).viewInsets.bottom);
+    // if (_isMobile && _hasFocus() && MediaQuery.of(context).viewInsets.bottom == 0.0) {
+    //     cardNumberFocusNode.unfocus();
+    //     expirationFocusNode.unfocus();
+    //     securityCodeFocusNode.unfocus();
+    //     postalCodeFocusNode.unfocus();
+    // }
+  }
+
+  /// Returns true if any field in the `CardTextField` has focus.
+  // ignore: unused_element
+  bool _hasFocus() {
+    return cardNumberFocusNode.hasFocus ||
+        expirationFocusNode.hasFocus ||
+        securityCodeFocusNode.hasFocus ||
+        postalCodeFocusNode.hasFocus;
   }
 
   /// Function that is listening to the keyboard events.
@@ -638,24 +825,49 @@ class CardTextFieldState extends State<CardTextField> {
       case CardEntryStep.number:
         break;
       case CardEntryStep.exp:
-        final expStr = _expirationController.text;
-        if (expStr.isNotEmpty) break;
+        if (_expirationController.text.isNotEmpty) break;
+      case CardEntryStep.cvc:
+        if (_securityCodeController.text.isNotEmpty) break;
+      case CardEntryStep.postal:
+        if (_postalCodeController.text.isNotEmpty) break;
+    }
+    _transitionStepFocus();
+  }
+
+  void _backspacePressed() {
+    // Put the empty char back into the controller
+    switch (_currentStep) {
+      case CardEntryStep.number:
+        break;
+      case CardEntryStep.exp:
+        _expirationController.text = '\u200b';
+      case CardEntryStep.cvc:
+        _securityCodeController.text = '\u200b';
+      case CardEntryStep.postal:
+        _postalCodeController.text = '\u200b';
+    }
+    _transitionStepFocus();
+  }
+
+  void _transitionStepFocus() {
+    switch (_currentStep) {
+      case CardEntryStep.number:
+        break;
+      case CardEntryStep.exp:
         _currentCardEntryStepController.add(CardEntryStep.number);
         String numStr = _cardNumberController.text;
         _cardNumberController.text = numStr.substring(0, numStr.length - 1);
         break;
       case CardEntryStep.cvc:
-        final cvcStr = _securityCodeController.text;
-        if (cvcStr.isNotEmpty) break;
         _currentCardEntryStepController.add(CardEntryStep.exp);
         final expStr = _expirationController.text;
         _expirationController.text = expStr.substring(0, expStr.length - 1);
+        break;
       case CardEntryStep.postal:
-        final String postalStr = _postalCodeController.text;
-        if (postalStr.isNotEmpty) break;
         _currentCardEntryStepController.add(CardEntryStep.cvc);
         final String cvcStr = _securityCodeController.text;
         _securityCodeController.text = cvcStr.substring(0, cvcStr.length - 1);
+        break;
     }
   }
 }
diff --git a/pubspec.yaml b/pubspec.yaml
index 8005687..8f063da 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -1,6 +1,6 @@
 name: stripe_native_card_field
 description: A native flutter implementation of the elegant Stripe Card Field.
-version: 0.0.2
+version: 0.0.3
 repository: https://git.fosscat.com/n8r/stripe_native_card_field
 
 environment: