Back to packageRELEASE DETAILS

0.51.0

npm

@0xflair/react-ui

Tailwind and React components and hooks that helps building a web3 dApp dashboard.

Published3 Jun 2022

Direct dependencies12

Transitive dependenciesNot calculated

README

Current package documentation

Flair SDK: `react-dashboard`

Tailwind and React components and hooks that helps building a web3 dApp dashboard.

Getting Started

Installation

Install the package:
```
npm install @0xflair/react-ui
```

Install peer dependencies if not already done:

npm install tailwindcss @headlessui/react @heroicons/react @tailwindcss/aspect-ratio

Configure tailwind.config.js (Tailwind v3) to scan SDK for classes:

module.exports = {
  purge: [
    "./public/**/*.html",
    "./src/**/*.{js,jsx,ts,tsx,vue}",

    // This line tells Tailwind to look into SDK files
    "./node_modules/@0xflair/**/*.{js,jsx,ts,tsx,vue}",
  ],
  content: ["./src/**/*.{js,jsx,ts,tsx}"],
  plugins: [
    // These plugsins are used in this package
    require("@tailwindcss/forms"),
    require("@tailwindcss/aspect-ratio"),
  ],
};

Example

import { FormSection } from "@0xflair/react-ui";

function CreatePage() {
  return (
    <>
      <FormSection
        title={"Wallet Info"}
        description={"Provide information about your wallet"}
      >
        ...
      </FormSection>
    </>
  );

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 20

Native requirements

12 direct targetsNot calculated transitive count

Package / target	Requirement	Relationship
@0xflair/react-common Environment { "local_name": "@0xflair/react-common", "alias": false, "peer_metadata": null }	`^0.51.0`	runtime
@headlessui/react Environment { "local_name": "@headlessui/react", "alias": false, "peer_metadata": null }	`^1.6.0`	runtime
@heroicons/react Environment { "local_name": "@heroicons/react", "alias": false, "peer_metadata": null }	`^1.0.6`	runtime
ethers Environment { "local_name": "ethers", "alias": false, "peer_metadata": null }	`^5.6.5`	runtime
prism-react-renderer Environment { "local_name": "prism-react-renderer", "alias": false, "peer_metadata": null }	`^1.3.1`	runtime
react-dropzone Environment { "local_name": "react-dropzone", "alias": false, "peer_metadata": null }	`^12.0.4`	runtime
usehooks-ts Environment { "local_name": "usehooks-ts", "alias": false, "peer_metadata": null }	`^2.5.2`	runtime
wagmi Environment { "local_name": "wagmi", "alias": false, "peer_metadata": null }	`^0.3.5`	runtime
@0xflair/react-common Environment { "local_name": "@0xflair/react-common", "alias": false, "peer_metadata": null }	`0.*`	peer
@headlessui/react Environment { "local_name": "@headlessui/react", "alias": false, "peer_metadata": null }	`^1.6.0`	peer
@heroicons/react Environment { "local_name": "@heroicons/react", "alias": false, "peer_metadata": null }	`^1.0.6`	peer
ethers Environment { "local_name": "ethers", "alias": false, "peer_metadata": null }	`^5.6.5`	peer
prism-react-renderer Environment { "local_name": "prism-react-renderer", "alias": false, "peer_metadata": null }	`^1.3.1`	peer
react Environment { "local_name": "react", "alias": false, "peer_metadata": null }	`^17.0.2\|\|^18.0.0`	peer
react-dom Environment { "local_name": "react-dom", "alias": false, "peer_metadata": null }	`^17.0.2\|\|^18.0.0`	peer
react-dropzone Environment { "local_name": "react-dropzone", "alias": false, "peer_metadata": null }	`^12.0.4`	peer
react-query Environment { "local_name": "react-query", "alias": false, "peer_metadata": null }	`*`	peer
styled-components Environment { "local_name": "styled-components", "alias": false, "peer_metadata": null }	`*`	peer
usehooks-ts Environment { "local_name": "usehooks-ts", "alias": false, "peer_metadata": null }	`^2.5.2`	peer
wagmi Environment { "local_name": "wagmi", "alias": false, "peer_metadata": null }	`^0.3.5`	peer

Distribution files

1 collected

Distribution 1

Source distribution

Source file

Checksums from source

{
  "integrity": "sha512-0qVe67iTRSFHX1lymYI40ycwDx91znGdmmu3RJRq6LN5CeftDZEu2I+kg11i4bnt0rfmKrbHNlGjU0g89d/9Fw==",
  "shasum": "216e4351c6074fe6f340fcf2b448eb0cb95bfb93",
  "tarball": "https://registry.npmjs.org/@0xflair/react-ui/-/react-ui-0.51.0.tgz",
  "fileCount": 8,
  "unpackedSize": 176147,
  "signatures": [
    {
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
      "sig": "MEUCIQDZmPQBobKTrfm0UbqLd4/YmAUNyC0ggeu/8IoxqwPOkAIgOsXAw4xSG6REZGkBBP2mXIqi4T6H31KM1VsuDjrSm6s="
    }
  ],
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJimkwkACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo7rQ/+Lw0wt4gUG22ymqV8qy52jCsccCAdgkCBSVCw2H0SsJewqvbR\r\n66zta7jZ+vUrEfPTGHaoL7G9Rf/VaWzY8CTtzClJxmQp6A7sLCrYFWfVqj4Y\r\ncSpo1pU9ATs5JvyZfmlXbxm4impCMQD3VflMHzptMn0TwmuogrO2PYprEqUk\r\nQw1Qoko9ddgNfFWybC36hby1zsKFj6bI8ZVJIlbveVzv/ZcZDL4t9uvWSwhn\r\nglfPRmNtiTpUbYK/hN6y2Am+Q/boFE+CS+e7jkK+WEK0DhlDZBE+ac1dl7U+\r\ny+l6k7m6eLDZ0kPz95vXburV2yXd8rjKNfLkHGLZq4f5PO+8RKMMoULivRcA\r\ncU30IJOJ9efgnOz1K8bkiQQw3dzaOR76y/dEZoJeowlR/9c0TKNxa5WXdvzK\r\ndhKlVB2PQ8uknJc9c3AkOmoIFp2eonuHKTDi0UnU1hwUAsdW87t1f8IsWNdX\r\nGAsy8r3p6OHb8fNFQMxgBiCnoTEYShTc+/rMMqBJT0NSV2VXGL/z8jKbdUwE\r\nbCWHLZDIHP3pOzLM22MDCS51nG2Fx8RwVBRyWNnNJxOQzoAoKysoYk6sCZEE\r\nDqpwpcgSNw3s06qOuj0MAymOYnDiwf7UU1rEiuh2qRJebJsYk5OGCje8VNxm\r\nTpw+IbSgOrLTzlQMICT+Krm7FVKeg45xv60=\r\n=DuU0\r\n-----END PGP SIGNATURE-----\r\n"
}

Repository

PENDING

0xflair/typescript-sdk

Shared repository data · GitHub

License detected in repository: Not collected

Metadata history

Meaningful changes

Current collected state Current

Observed since 20 Oct, 23:32 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:f8cf4e517fc2aad53a5ab7a6fd1fd2e0c762f2f9acf7809490497c7158fdc025

Other collected versions

0.123.227 Nov 0.123.112 Nov 0.123.08 Nov 0.122.228 Oct 0.122.128 Oct 0.122.028 Oct View all collected versions →