angular4-paystack - npm Package Compare versions

Comparing version 1.2.1 to 2.0.0

angular4-paystack.module.js

 import { NgModule } from '@angular/core';
 import { CommonModule } from "@angular/common";
 import { Angular4PaystackComponent } from './angular4-paystack.component';
+import { Angular4PaystackEmbed } from "./angular4-paystack-embed.component";
 var Angular4PaystackModule = /** @class */ (function () {
@@ -10,4 +11,4 @@ function Angular4PaystackModule() {
                     imports: [CommonModule],
-                    exports: [Angular4PaystackComponent],
-                    declarations: [Angular4PaystackComponent],
+                    exports: [Angular4PaystackComponent, Angular4PaystackEmbed],
+                    declarations: [Angular4PaystackComponent, Angular4PaystackEmbed],
                     providers: [],
@@ -14,0 +15,0 @@ },] },

angular4-paystack.module.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"Angular4PaystackModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"exports":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"}],"declarations":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"}],"providers":[]}]}]}}},{"__symbolic":"module","version":1,"metadata":{"Angular4PaystackModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"exports":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"}],"declarations":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"}],"providers":[]}]}]}}}]
+[{"__symbolic":"module","version":3,"metadata":{"Angular4PaystackModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"exports":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"},{"__symbolic":"reference","module":"./angular4-paystack-embed.component","name":"Angular4PaystackEmbed"}],"declarations":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"},{"__symbolic":"reference","module":"./angular4-paystack-embed.component","name":"Angular4PaystackEmbed"}],"providers":[]}]}]}}},{"__symbolic":"module","version":1,"metadata":{"Angular4PaystackModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"exports":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"},{"__symbolic":"reference","module":"./angular4-paystack-embed.component","name":"Angular4PaystackEmbed"}],"declarations":[{"__symbolic":"reference","module":"./angular4-paystack.component","name":"Angular4PaystackComponent"},{"__symbolic":"reference","module":"./angular4-paystack-embed.component","name":"Angular4PaystackEmbed"}],"providers":[]}]}]}}}]

CHANGELOG.md

@@ -12,3 +12,3 @@ # Changelog
 ### Removed
- - removed unecessary packaged file
+- removed unecessary packaged file
 ### Fixed
@@ -26,2 +26,11 @@ - Some minor bugs
 - updated readme to show that a callback is compulsory
-- corrected `@angular/core` version in peerDependency
+- corrected `@angular/core` version in peerDependency
+
+## 2.0.0 - 2017-12-02
+### Added
+- You can now use the paystack inline embed in your angular application 
+- Added tests
+### Changed
+- updated README to show how to use the paystack inline embed and little fixes
+### Removed
+- Text input (`(text)`) is no longer suypported for the `angular4-paystack` component. Check README for details

package.json

 {
   "name": "angular4-paystack",
-  "version": "1.2.1",
+  "version": "2.0.0",
   "description": "an angular 4 module for paystack transactions",
@@ -20,2 +20,3 @@ "main": "index.ts",
     "paystack",
+    "transactions",
     "payments",
@@ -45,3 +46,4 @@ "angular2"
     "zone.js": "^0.8.10"
-  }
+  },
+  "dependencies": {}
 }

paystack-options.d.ts

@@ -15,2 +15,3 @@ export interface PaystackOptions {
     onClose: () => void;
+    container?: string;
 }

README.md

 # ANGULAR4-PAYSTACK
 
-> This is an angular module that abstracts the complexity of making paystack payments with Angular.
-
+> This is an angular module that abstracts the complexity of making paystack payments with Angular2+.
+  
 ## USAGE
@@ -18,5 +18,5 @@
 ### 3. Import the module
-  In your `app.module.ts` or any preferred module, import the module like so:
+  In your `app.module.ts` or your working module like so:
 
-  ```js
+  ```ts
   import { NgModule } from '@angular/core'; 
@@ -29,3 +29,2 @@
     imports: [
-      ...
       Angular4PaystackModule,
@@ -39,15 +38,34 @@ ]
 ### 4. Use the component in your code
+  There are two available options
 
-  ```html
-    <angular4-paystack
-      [key]="'pk_test_xxxxxxxxxxxxxxxxxxxxxxxxxxxx'"
-      [email]="'[e-mail]'"
-      [amount]="5000000"
-      [ref]="'2637458697'"
-      [class]="'btn btn-primary'"
-      (close)="paymentCancel()"
-      (callback)="paymentDone($event)"
-    >Pay with Paystack</angular4-paystack>
-  ```
+  * Paystack Inline - Loads the credit card form in an iframe that appears as a popup
+    ```html
+      <angular4-paystack
+        [key]="'pk_test_xxxxxxxxxxxxxxxxxxxxxxxxxxxx'"
+        [email]="'[e-mail]'"
+        [amount]="5000000"
+        [ref]="'2637458697'"
+        [class]="'btn btn-primary'"
+        (close)="paymentCancel()"
+        (callback)="paymentDone($event)"
+      >Pay with Paystack</angular4-paystack>
+    ```
 
+  * Paystack Inline Embed - Paystack Inline Embed is the latest addition to the stack, it offers a stylish Inline that loads the credit card form in a set container like it sits in your page.
+    ```html
+      <angular4-paystack-embed
+        [key]="'pk_test_xxxxxxxxxxxxxxxxxxxxxxxxxxxx'"
+        [email]="'[e-mail]'"
+        [amount]="5000000"
+        [ref]="'2637458697'"
+        [class]="'btn btn-primary'"
+        (close)="paymentCancel()"
+        (callback)="paymentDone($event)"
+      ></angular4-paystack-embed>
+    ```
+    **NOTE**
+    - The payment form will be 100% of the width of wherever you put it.
+    - To maintain a uniform design, your page's background color should be white
+
+
 ## OPTIONS
@@ -58,10 +76,9 @@
 |  `amount `            | `number`       | true                |  undefined          | Amount to withdraw (in kobo for NGN)
-|  `email `             | `string`       | true                |  undefined          | Email of subscriber/client
+|  `email `             | `string`       | true                |  undefined          | The customer's email address.
 |  `key`                | `string`       | true                |  undefined          | Your pubic Key from Paystack. Use test key for test mode and live key for live mode
-|  `ref`                | `string`       | true                |  undefined          | Unique reference
-|  `callback`           | `function`     | true                |  undefined          | A function called when transaction is successful. Returns a parameter containing unique reference
-|  `transaction_charge` | `number`       | false               |  0                  |  A flat fee to charge the subaccount for this transaction, in kobo.
+|  `ref`                | `string`       | true                |  undefined          | Unique case sensitive transaction reference. Only -,., = and alphanumeric characters allowed.
+|  `callback`           | `function`     | true                |  undefined          | A function called when transaction is successful. Returns an object containing unique reference
 |  `metadata`           | `object`       | false               |  {}                 | custom details
-|  `class`              | `string`       | false               |  undefined          | A string of classes to add to the component
-|  `style`              | `object`       | false               |  undefined          | CSS stylings, eg ```{fontColor: 'red'}```
+|  `class`              | `string`       | false               |  undefined          | A string of classes to add to the component (not available for **inline embed**)
+|  `style`              | `object`       | false               |  undefined          | CSS stylings, eg ```{fontColor: 'red'}```  (not available for **inline embed**)
 |  `text`               | `object`       | false               |  undefined          | Text output of the component
@@ -71,5 +88,7 @@ |  `currency`           | `string`       | false               |  "NGN"              | Transaction currency
 |  `quantity`           | `string`       | false               |  ""                 | Used to apply a multiple to the amount returned by the plan code above.
+|  `onClose`            | `function`     | false               |  undefined          | A function called if the customer closes the payment window
+**For Split Payments** |
 |  `subaccount`         | `string`       | false               |  ""                 | The code for the subaccount that owns the payment. 
+|  `transaction_charge` | `number`       | false               |  0                  |  A flat fee to charge the subaccount for this transaction, in kobo.
 |  `bearer`             | `string`       | false               |  ""                 | Who bears Paystack charges? account or subaccount
-|  `onClose`            | `function`     | false               |  undefined          | A function called when transaction is cancelled
 
@@ -76,0 +95,0 @@ > For more information checkout [paystack's documentation](https://developers.paystack.co/docs/paystack-inline#section-working-with-paystack-inline)

No alert changes

Improved metrics

Total package byte prevSize

31526

increased by55.19%

Number of package files

19

increased by18.75%

Lines of code

247

increased by71.53%

Number of lines in readme file

108

increased by21.35%

No dependency changes