@depay/widgets 10.2.15 → 11.0.0

package/README.md

@@ -276,6 +276,21 @@ DePayWidgets.Payment.preload({
 });
 ```
 
+#### title
+
+`title`
+
+Allows you to change the title of the widget:
+
+```javascript
+DePayWidgets.Payment({
+
+  title: 'Donation'
+
+  //...
+})
+```
+
 #### track
 
 `track`
@@ -550,8 +565,9 @@ A function that will be called once the payment has been validated by DePay Apis
 ```javascript
 DePayWidgets.Payment({
 
-  validated: (successful)=> {
+  validated: (successful, data)=> {
     // successful (true or false)
+    // data (can contain transaction_id)
   }
 })
 ```
@@ -1285,483 +1301,6 @@ DePayWidgets.Sale({
 })
 ```
 
-## DePay Donations
-
-DePay Donations allows you to accept donation payments made with thousands of different cryptocurrencies.
-
-### Preparation
-
-In order to receive decentralized donation payments on any blockchain you need to have your own wallet on that particular blockchain first:
-
-- [Create an Ethereum wallet](https://ethereum.org/en/wallets/)
-- [Create an BSC wallet](https://academy.binance.com/en/articles/how-to-get-started-with-binance-smart-chain-bsc)
-
-### Quick start
-
-```javascript
-DePayWidgets.Donation({
-  accept: [{
-    blockchain: 'ethereum',
-    token: '0xa0bEd124a09ac2Bd941b10349d8d224fe3c955eb',
-    receiver: '0x4e260bB2b25EC6F3A59B478fCDe5eD5B8D783B02'
-  }]
-});
-```
-
-### Configuration
-
-You need to pass a configuration object to `DePayWidgets.Donation` which needs to at least contain the `accept` field:
-
-```javascript
-DePayWidgets.Donation({
-  accept: [{
-    blockchain: 'ethereum',
-    token: '0xa0bEd124a09ac2Bd941b10349d8d224fe3c955eb',
-    receiver: '0x4e260bB2b25EC6F3A59B478fCDe5eD5B8D783B02'
-  }]
-});
-```
-
-You can also accept donations on multiple blockchains:
-
-```javascript
-DePayWidgets.Donation({
-  accept: [{
-    blockchain: 'ethereum',
-    token: '0xa0bEd124a09ac2Bd941b10349d8d224fe3c955eb',
-    receiver: '0x4e260bB2b25EC6F3A59B478fCDe5eD5B8D783B02'
-  },{
-    blockchain: 'bsc',
-    token: '0xa0bEd124a09ac2Bd941b10349d8d224fe3c955eb',
-    receiver: '0x4e260bB2b25EC6F3A59B478fCDe5eD5B8D783B02'
-  }]
-});
-```
-
-#### accept
-
-`blockchain`
-
-The blockchain you want to receive the payment on.
-
-Currently supported:
-
-- `ethereum`
-- `bsc` (Binance Smart Chain)
-
-`token`
-
-The address of the token you want to receive.
-
-Use our [donation configurator](https://depay.com/documentation/donations#donation-configurator) in order to simplify configuring this.
-
-`receiver`
-
-The address receiving the donation. Always double check that you've set the right address.
-
-#### amount
-
-When you want to control how the amount selection behaves, pass the `amount` configuration object,
-alongside values for `start`, `min` and `step`.
-
-`start`: The amount that is initially selected.
-
-`min`: The minimum amount selectable.
-
-`step`: The number by which to increment/decrement changes to the amount.
-
-#### connected
-
-`connected`
-
-A function that will be called once the user connects a wallet.
-
-Will be called with the connected wallet address as the main argument:
-
-```javascript
-DePayWidgets.Donation({
-
-  connected: (address)=> {
-    // do something with the address
-  }
-});
-```
-
-#### fee
-
-You can configure a fee which will be applied to every payment with its own dedicated fee receiver address.
-
-The fee will be taken from the target token and target amount (after swap, depending on your `accept` configuration).
-
-`amount`: Either percentage (e.g. `5%`, or absolute amount as BigNumber string ('100000000000000000') or pure number (2.5)
-
-`receiver`: The address that is supposed to receive the fee.
-
-```javascript
-DePayWidgets.Donation({
-  accept: [...],
-  fee: {
-    amount: '3%',
-    receiver: '0x4e260bB2b25EC6F3A59B478fCDe5eD5B8D783B02'
-  }
-});
-```
-
-#### closed
-
-`closed`
-
-A function that will be called once the user closes the widget (no matter if before or after the payment).
-
-```javascript
-DePayWidgets.Donation({
-
-  closed: ()=> {
-    // do something if user closed the widget
-  }
-});
-```
-
-#### sent
-
-`sent`
-
-A function that will be called once the payment has been sent to the network (but still needs to be mined/confirmed).
-
-The widget will call this function with a transaction as single argument (see: [depay-web3-wallets](https://github.com/depayfi/depay-web3-wallets#transaction) for more details)
-
-```javascript
-DePayWidgets.Donation({
-  
-  sent: (transaction)=> {
-    // called when payment transaction has been sent to the network
-  }
-});
-```
-
-#### succeeded
-
-`succeeded`
-
-A function that will be called once the payment has succeeded on the network (checked client-side).
-
-The widget will call this function passing a transaction as single argument (see: [depay-web3-wallets](https://github.com/depayfi/depay-web3-wallets#transaction) for more details)
-
-```javascript
-DePayWidgets.Donation({
-
-  succeeded: (transaction)=> {
-    // called when payment transaction has been confirmed once by the network
-  }
-});
-```
-
-#### validated
-
-`validated`
-
-A function that will be called once the payment has been validated by DePay Apis (server-side).
-
-```javascript
-DePayWidgets.Payment({
-
-  validated: (successful)=> {
-    // successful (true or false)
-  }
-})
-```
-
-#### failed
-
-`failed`
-
-A function that will be called if the payment execution failed on the blockchain (after it has been sent/submitted).
-
-The widget will call this function passing a transaction as single argument (see: [depay-web3-wallets](https://github.com/depayfi/depay-web3-wallets#transaction) for more details)
-
-```javascript
-DePayWidgets.Donation({
-
-  failed: (transaction)=> {
-    // called when payment transaction failed on the blockchain
-    // handled by the widget, no need to display anything
-  }
-});
-```
-
-#### critical
-
-`critical`
-
-A function that will be called if the widget throws a critical internal error that it can't handle and display on its own:
-
-```javascript
-DePayWidgets.Donation({
-  
-  critical: (error)=> {
-    // render and display the error with error.toString()
-  }
-});
-```
-
-#### error
-
-`error`
-
-A function that will be called if the widget throws a non-critical internal error that it can and will handle and display on its own:
-
-```javascript
-DePayWidgets.Donation({
-  
-  error: (error)=> {
-    // maybe do some internal tracking with error.toString()
-    // no need to display anything as widget takes care of displaying the error
-  }
-});
-```
-
-#### providers
-
-Allows to set providers to be used for making RPC calls to the individual blockchains:
-
-```javascript
-DePayWidgets.Donation({
-
-  providers: {
-    ethereum: ['http://localhost:8545'],
-    bsc: ['http://localhost:8545']
-  }
-});
-```
-
-#### currency
-
-Allows you to enforce displayed local currency (instead of automatically detecting it):
-
-```javascript
-DePayWidgets.Donation({
-
-  currency: 'USD'
-
-});
-```
-
-#### whitelist
-
-Allows only the configured tokens to be eligible as means of payment (from the sender):
-
-```javacript
-DePayWidgets.Donation({
-  
-  whitelist: {
-    ethereum: [
-      '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE', // ETH
-      '0xdac17f958d2ee523a2206206994597c13d831ec7', // USDT
-      '0x6b175474e89094c44da98b954eedeac495271d0f'  // DAI
-    ],
-    bsc: [
-      '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE', // BNB
-      '0xe9e7cea3dedca5984780bafc599bd69add087d56', // BUSD
-      '0x55d398326f99059ff775485246999027b3197955'  // BSC-USD
-    ],
-    polygon: [
-      '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE', // MATIC
-      '0x2791bca1f2de4661ed88a30c99a7a9449aa84174', // USDC
-    ]
-  }
-})
-```
-
-#### blacklist
-
-Allows to blacklist tokens so that they will not be suggested as means of payment (from the sender):
-
-```javacript
-DePayWidgets.Donation({
-  
-  blacklist: {
-    ethereum: [
-      '0x82dfDB2ec1aa6003Ed4aCBa663403D7c2127Ff67',  // akSwap
-      '0x1368452Bfb5Cd127971C8DE22C58fBE89D35A6BF',  // JNTR/e
-      '0xC12D1c73eE7DC3615BA4e37E4ABFdbDDFA38907E',  // KICK
-    ],
-    bsc: [
-      '0x119e2ad8f0c85c6f61afdf0df69693028cdc10be', // Zepe
-      '0xb0557906c617f0048a700758606f64b33d0c41a6', // Zepe
-      '0x5190b01965b6e3d786706fd4a999978626c19880', // TheEver
-      '0x68d1569d1a6968f194b4d93f8d0b416c123a599f', // AABek
-      '0xa2295477a3433f1d06ba349cde9f89a8b24e7f8d', // AAX
-      '0xbc6675de91e3da8eac51293ecb87c359019621cf', // AIR
-      '0x5558447b06867ffebd87dd63426d61c868c45904', // BNBW
-      '0x569b2cf0b745ef7fad04e8ae226251814b3395f9', // BSCTOKEN
-      '0x373233a38ae21cf0c4f9de11570e7d5aa6824a1e', // ALPACA
-      '0x7269163f2b060fb90101f58cf724737a2759f0bb', // PUPDOGE
-      '0xb16600c510b0f323dee2cb212924d90e58864421', // FLUX
-      '0x2df0b14ee90671021b016dab59f2300fb08681fa', // SAFEMOON.is
-      '0xd22202d23fe7de9e3dbe11a2a88f42f4cb9507cf', // MNEB
-      '0xfc646d0b564bf191b3d3adf2b620a792e485e6da', // PIZA
-      '0xa58950f05fea2277d2608748412bf9f802ea4901', // WSG
-      '0x12e34cdf6a031a10fe241864c32fb03a4fdad739' // FREE
-    ]
-  }
-})
-```
-
-#### container
-
-`container`
-
-Allows you to pass a container element that is supposed to contain the widget:
-
-```javascript
-DePayWidgets.Dontaion({
-  container: document.getElementById('my-container')
-})
-```
-
-Make sure to set the css value `position: relative;` for the container element. Otherwise it can not contain the widget.
-
-React example:
-
-```javascript
-let CustomComponentWithWidget = (props)=>{
-    let container = useRef()
-
-    useEffect(()=>{
-      if(container.current) {
-        DePayWidgets.Payment({ ...defaultArguments, document,
-          container: container.current
-        })
-      }
-    }, [container])
-
-    return(
-      <div ref={container} style={{ position: 'relative', border: '1px solid black', width: "600px", height: "600px" }}></div>
-    )
-  }
-```
-
-#### style
-
-`style`
-
-Allows you to change the style of the widget.
-
-```javascript
-DePayWidgets.Donation({
-  
-  style: {
-    colors: {
-      primary: '#ffd265',
-      text: '#e1b64a',
-      buttonText: '#000000',
-      icons: '#ffd265'
-    },
-    fontFamily: '"Cardo", serif !important',
-    css: `
-      @import url("https://fonts.googleapis.com/css2?family=Cardo:wght@400;700&display=swap");
-
-      .ReactDialogBackground {
-        background: rgba(0,0,0,0.8);
-      }
-    `
-  }
-});
-```
-
-##### colors
-
-`colors`
-
-Allows you to set color values:
-
-```javascript
-DePayWidgets.Donation({
-  
-  style: {
-    colors: {
-      primary: '#ffd265',
-      text: '#ffd265',
-      buttonText: '#000000',
-      icons: '#ffd265'
-    }
-  }
-});
-```
-
-##### fontFamily
-
-`fontFamily`
-
-Allows you to set the font-family:
-
-```javascript
-DePayWidgets.Donation({
-  
-  style: {
-    fontFamily: '"Cardo", serif !important'
-  }
-});
-```
-
-##### css
-
-`css`
-
-Allows you to inject CSS:
-
-```javascript
-DePayWidgets.Donation({
-  
-  style: {
-    css: `
-      @import url("https://fonts.googleapis.com/css2?family=Cardo:wght@400;700&display=swap");
-
-      .ReactDialogBackground {
-        background: rgba(0,0,0,0.8);
-      }
-    `
-  }
-});
-```
-
-#### unmount
-
-`unmount`
-
-Allows you to unmount (the React safe way) the entire widget from the outside:
-
-```javascript
-let { unmount } = await DePayWidgets.Donation({})
-
-unmount()
-```
-
-#### closable
-
-`closable`
-
-Makes the widget unclosable:
-
-```javascript
-DePayWidgets.Donation({
-  closable: false
-})
-
-```
-
-#### integration
-
-`integration`
-
-Labels donations to track them per integration.
-
-```javascript
-DePayWidgets.Donation({
-  integration: 'fe690fbc-1740-4894-b12c-23a72abec54d'
-})
-```
-
 ## DePay Connect
 
 DePay Connect allows you to have your users connect their crypto wallet to your dApp or website.
@@ -2035,5 +1574,5 @@ test:cypress:debug
 Test and debug single cypress file:
 
 ```
-yarn test:cypress:debug --spec "cypress/e2e/Payment/track.js"
+yarn test:cypress:debug --spec "cypress/e2e/Payment/main.solana.js"
 ```