Catalog npm
Back to packageRELEASE DETAILS

0.39.5

npm

@0xflair/react-ui

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

Published16 May 2022
Direct dependencies9
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

  1. Install the package:

    npm install @0xflair/react-ui
    
  2. Install peer dependencies if not already done:

    npm install tailwindcss @headlessui/react @heroicons/react @tailwindcss/aspect-ratio
    
  3. 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 16

Native requirements
9 direct targetsNot calculated transitive count
Package / targetRequirementRelationship
@0xflair/react-common
Environment
{
  "local_name": "@0xflair/react-common",
  "alias": false,
  "peer_metadata": null
}
^0.39.5runtime
@headlessui/react
Environment
{
  "local_name": "@headlessui/react",
  "alias": false,
  "peer_metadata": null
}
^1.6.0runtime
@heroicons/react
Environment
{
  "local_name": "@heroicons/react",
  "alias": false,
  "peer_metadata": null
}
^1.0.6runtime
prism-react-renderer
Environment
{
  "local_name": "prism-react-renderer",
  "alias": false,
  "peer_metadata": null
}
^1.3.1runtime
react-dropzone
Environment
{
  "local_name": "react-dropzone",
  "alias": false,
  "peer_metadata": null
}
^12.0.4runtime
usehooks-ts
Environment
{
  "local_name": "usehooks-ts",
  "alias": false,
  "peer_metadata": null
}
^2.5.2runtime
wagmi
Environment
{
  "local_name": "wagmi",
  "alias": false,
  "peer_metadata": null
}
^0.3.5runtime
@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.0peer
@heroicons/react
Environment
{
  "local_name": "@heroicons/react",
  "alias": false,
  "peer_metadata": null
}
^1.0.6peer
prism-react-renderer
Environment
{
  "local_name": "prism-react-renderer",
  "alias": false,
  "peer_metadata": null
}
^1.3.1peer
react
Environment
{
  "local_name": "react",
  "alias": false,
  "peer_metadata": null
}
^17.0.2peer
react-dom
Environment
{
  "local_name": "react-dom",
  "alias": false,
  "peer_metadata": null
}
^17.0.2peer
react-dropzone
Environment
{
  "local_name": "react-dropzone",
  "alias": false,
  "peer_metadata": null
}
^12.0.4peer
usehooks-ts
Environment
{
  "local_name": "usehooks-ts",
  "alias": false,
  "peer_metadata": null
}
^2.5.2peer
wagmi
Environment
{
  "local_name": "wagmi",
  "alias": false,
  "peer_metadata": null
}
^0.3.5peer

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "integrity": "sha512-XaPR+Ipm1HzmAMidZcA4Q1XdBlvjQuPo+dY3VcVAYc31XVcXgG2KTVFG0idxNVNsQs5r0eIVQi2D9unHp1Gneg==",
  "shasum": "af2b2e090ed0b3cf01bc6c4fbdb401ba4e3234db",
  "tarball": "https://registry.npmjs.org/@0xflair/react-ui/-/react-ui-0.39.5.tgz",
  "fileCount": 8,
  "unpackedSize": 632191,
  "signatures": [
    {
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
      "sig": "MEYCIQCpYHndKMLUEt4an+I/6gjaHC0+OcMwGGpItIa1eY9XIAIhAJ+6UBPFF0amGZWcf72itHlYMsZ+PwaF8vMo/eClSBNX"
    }
  ],
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiglurACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmratw//Wj4vhhch2aIh7EAI9W9EHZVHBnjkZqjjEwCTRDvLqB4s9sks\r\n6Ac08ZdmMTBuBwp40DZRLumvStKgEb2OK/B8yKZ8cqjxfHodGfBI1dytxeKH\r\nuHMaMXUSABZv+Cu/EFSA1SvbS7ZkpO+0vw2rQtGWqPlr375ZsxSjCq4GAs6z\r\nX3FglQIyroT4Zd/K4OHiBe5YEh9C8qMmQpNAU0cMpYJ2SDxHHPPBCCcekwsT\r\nI2k0yvpbS5L3KVJKz63e4+E9DmYKnpe/HazpRNUNXSYFs12E+CH1zjfCZndl\r\n8eMtGb24Ml60D67G+zkPMzYHA1FXpazBVFPQWntJCbzMcJuvEw6dtxvU9n0J\r\n8n+4p5116JTntEnOaq/262WC/6Bn+aouUptZaPmJ0iURRgAAnJMd21UwAg8K\r\n+0i80S7eevQ+0rHjXJCbCO4OaGe9UpyZXQfY90pzhR3CoZPtM+qHeZkd1xb6\r\ngzOrKigPfhITWlo5QxaHQbMNwP8JTCgv8EUMjSStqqwEPT+28eNSgFnroJ46\r\nyLt27VLsTsWXTghZrLYm+5VE4RMECd4dn0BdDXDK50xC8XDN9sIjCgEgqeIt\r\nNxeoXTQtP2cbEqYlwyfW+/gl7Ck6wEAulHJMOmVwtLRMRPNYJFtoxPwn/I1U\r\nN6DjCoKWJjvkl9srKGRcpWfBbICWJaDjWtw=\r\n=BuK7\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:c71dc5677c5d27f6dc63979f77fcd9e1544726bbc5b4bee09f5c7f6db95cbb35

Other collected versions

0.123.227 Nov0.123.112 Nov0.123.08 Nov0.122.228 Oct0.122.128 Oct0.122.028 OctView all collected versions →