pix-react

QRCode para pagamento PIX / QRCode for Brazilian PIX payment

Usage no npm install needed!

<script type="module">
  import pixReact from 'https://cdn.skypack.dev/pix-react';
</script>

README

pix-react

QRCode para pagamento PIX / QRCode for Brazilian PIX payment

CI

codecov

FOSSA Status

Instalação

npm install pix-react

Uso

var React = require('react');
var { PixQRCode } = require('pix-react');

React.render(
  <PixQRCode
        pixParams={{
          chave: 'recebedor@email.com',
          recebedor: 'Nome do reebedor',
          cidade: 'Nome da Cidade',
          identificador: '123',
          valor: 123.45,
          mensagem: 'minha mensagem'
        }}
        renderAs="svg"
        includeMargin={true}
        size={256}
      />,
  mountNode
);

demonstração

Clique aqui para ver uma demonstração online

Parâmetros PIX

A propriedade pixParams concentra os parâmetros necessários para gerar o PIX

parametro tipo Observações
chave string Informe aqui a Chave PIX, use apenas números para CPF ou CNPJ, se for telefone use o padrão internacional.
recebedor string Nome do(a) recebedor(a)
cidade string Nome da Cidade do(a) recebedor(a) ou do(a) pagador(a)
identificador string Identificador do pagamento
valor number Valor do PIX
mensagem string Mensagem adicioinal no PIX (não obrigatória)

Propriedades herdadas de qrcode.react

prop type default value
renderAs string ('canvas' 'svg') 'canvas'
size number 128
bgColor string (CSS color) "#FFFFFF"
fgColor string (CSS color) "#000000"
level string ('L' 'M' 'Q' 'H') 'L'
includeMargin boolean false
imageSettings object (see below)

imageSettings

field type default value
src string
x number none, will center
y number none, will center
height number 10% of size
width number 10% of size
excavate boolean false

Mais informações sobre qrcode.react

Referência

Este projeto foi escrito tendo como base o projeto: https://github.com/joseviniciusnunes/qrcode-pix/