Package Exports
- metasdk-react
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (metasdk-react) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
metasdk-react
SDK to communicate between React and App using QRCode
Install
npm install --save metasdk-react
Components
- Login
- Request
- SendTransaction
Usage
If callbackUrl
will be given as prop, a component shows QR code directly, not popup button.
import React, { Component } from 'react';
import { Login, Request, SendTransaction } from 'metasdk-react';
class Example extends Component {
callbackExample(arg) {}
render () {
return (
<div>
<Login
data='testmsg'
service='example'
callback={this.callbackExample}
/>
<Request
request={['name', 'email']}
service='example'
callback={this.callbackExample}
/>
<SendTransaction
id='sendTransactionByRequest'
request={this.trxRequest}
usage='method'
service='example'
callback={this.callbackExample}
/>
<SendTransaction
id='sendTransactionWithCallbackURL'
request={this.trxRequest}
usage='method'
service='example'
callbackUrl='http://localhost/callback'
/>
<SendTransaction
id='sendTransactionByRaw'
to='0x8101487270f5411cf213b8d348a2ab46df66245d'
value='0x01'
data='0x02'
service='example'
qrsize={256}
qrvoffset={20}
qrpadding='2em'
qrposition='bottom right'
qrtext='SendTransaction'
callback={this.callbackExample}
/>
</div>
)
}
}
QRCode styles can be set for all components like above example SendTransaction
qrsize
changes the size of QRCodeqrvoffset
is a vertical offset from originqrpadding
applies padding thickness of QRCode as styleqrposition
decides relative position from origin, declaration for positions are inutil.js
qrtext
setsButton
text to open QRCode popup
Test
cd metasdk-react
npm start
[Ctrl+C]
cd example
npm start
Thanks to
License
MIT © hexoul