@api3/logos
TypeScript icon, indicating that this package has built-in type declarations

0.2.13 • Public • Published

Getting started

Installation

pnpm add @api3/logos
npm i @api3/logos
yarn add @api3/logos

Usage

React

import { ChainLogo, SymbolLogo, ApiProviderLogo } from '@api3/logos';

<div>
    <img src={ChainLogo('43114')} width={50} height={50} alt="43114" />
    <img src={SymbolLogo('BTC')} width={50} height={50} alt="BTC" />
    <img src={ApiProviderLogo('nodary')} width={50} height={50} alt="nodary" />
</div>;

HTML

<template>
    <div>
        <img src={ChainLogo('43114')} width={50} height={50} alt='43114' />
        <img src={SymbolLogo('BTC')} width={50} height={50} alt='BTC' />
        <img src={ApiProviderLogo('nodary')} width={50} height={50} alt='nodary' />
    </div>
</template>

<script>
import { ChainLogo, SymbolLogo, ApiProviderLogo } from '@api3/logos';

export default {
...
methods: {
    getSymbolLogo(symbol) {
      return SymbolLogo(symbol);
    },
    getChainLogo(chainId) {
      return ChainLogo(chainId);
    },
    getApiProviderLogo(apiProvider) {
      return ApiProviderLogo(apiProvider);
    },
}
...
}
</script>

API

light prop is optional and defaults to false (dark theme). light = true will return the light theme logo.

ChainLogo

Prop Type Description
id string Chain id
light boolean Light theme

SymbolLogo

Prop Type Description
id string Symbol id
light boolean Light theme

ApiProviderLogo

Prop Type Description
id string ApiProvider
light boolean Light theme

Visit

Live demo at https://api3dao.github.io/logos

Dependents (0)

Package Sidebar

Install

npm i @api3/logos

Weekly Downloads

563

Version

0.2.13

License

MIT

Unpacked Size

1.49 MB

Total Files

346

Last publish

Collaborators

  • siegrift
  • dcroote
  • aquarat
  • bbenligiray