20.0.11 • Published 12 months ago

@consolelabs/mochi-formatter v20.0.11

Weekly downloads
-
License
ISC
Repository
-
Last release
12 months ago

Mochi UI

This package includes the basic components that you need to render any Mochi data, generally speaking there are 3 main goal:

  • Render Mochi identity
  • Use components such as balance list, activities, transactions list, etc...
  • Utilize helpers such as text/number formatters, etc...

🚀 Usage

import API from "@consolelabs/mochi-rest";
import UI, { utils } from "@consolelabs/mochi-formatter";
import Redis from "ioredis";

// optionally use redis for better perf
UI.redis = new Redis();

const api = new API({});
api.init().then(() => {
  UI.api = api;
});

const [account, otherAccount] = await UI.formatProfile(
  Platform.Web,
  profile_id,
  other_profile_id
);

const markdownText = await UI.components.balance({
  /* props */
});

const formattedUsd = utils.formatUsdDigit(23.12563);
console.log(formattedUsd); // "$23.12"

🤖 API

resolve(on: Platform.Web | Platform.Discord | Platform.Telegram, profile_id_A: string, profile_id_B?: string)

const [account, otherAccount] = await UI.formatProfile(
  Platform.Web, // if you're using UI library on web
  profile_id,
  other_profile_id
);

// or using it on self
const [account] = await UI.formatProfile(Platform.Web, profile_id);

Takes in a platform that you're rendering on, a pair of profile ids to resolve, profile_id_B defaults to profile_id_A if not passed in. The return value is an object with the following properties

type UsernameFmt = {
  // this value is markdown
  value: string;
  // the id of that platform
  id: string;
  // url of this account
  url: string;
  // same as `value` but in plain text format
  plain: string;
  // in case of invalid account, this will be null
  platform?:
    | Platform.App
    | Platform.Mochi
    | Platform.Discord
    | Platform.Telegram
    | Platform.Twitter
    | Platform.Vault
    | null;
};

Utilities

  • formatUsdDigit(input: string | number | object): string: returns a string representation of the usd value with $ prefix
  • formatPercentDigit(input: string | number | object): string: returns a string representation of the percentage value with % suffix
  • formatTokenDigit(input: string | number | object): string: returns a string representation of the token value
  • formatDigit(options: object): string: the base formatter, the shape of options is:
type Options = {
  value: string | number;
  // how many numbers to keep after decimal point
  fractionDigits?: number;
  // decides whether the result should have commas
  withoutCommas?: boolean;
  // use shorten form e.g. 200,000 -> 200K, $1,234,567,890 -> $1B
  // note that by using this option some precision of number will be lost
  shorten?: boolean;
  // use for very small numbers e.g. 1e-8
  scientificFormat?: boolean;
};

Note: All the format functions except formatDigit follows the same decimal point formatting rule, that is:

  • For percentage value, automatically hide decimal point if value >= 10
  • For USD value, automatically hide decimal point if value >= 100
  • For token value, automatically hide decimal point if value >= 1000

  • In case of having to show decimal point, we only take maximum 2 digits that are not 0 starting from the dot, if both are 0 then take the first digit that is not zero, some examples:

0.02345 -> 0.02
0.2103 -> 0.2
0.00003981 -> 0.0003

components (coming soon)

20.0.10

1 year ago

20.0.11

12 months ago

20.0.9

1 year ago

20.0.8

1 year ago

20.0.7

1 year ago

20.0.6

1 year ago

20.0.5

1 year ago

20.0.4

1 year ago

20.0.3

1 year ago

20.0.1

1 year ago

20.0.2

1 year ago

19.0.7

1 year ago

19.0.9

1 year ago

19.0.8

1 year ago

19.0.10

1 year ago

19.0.12

1 year ago

19.0.11

1 year ago

20.0.0

1 year ago

19.0.5

1 year ago

19.0.4

1 year ago

19.0.6

1 year ago

19.0.3

1 year ago

19.0.2

1 year ago

19.0.1

1 year ago

19.0.0

1 year ago

18.2.9

1 year ago

18.2.8

1 year ago

18.2.7

1 year ago

18.2.6

1 year ago

18.2.5

1 year ago

18.2.4

1 year ago

18.2.3

1 year ago

18.2.2

1 year ago

18.2.1

1 year ago

18.2.0

1 year ago

18.1.3

2 years ago

18.1.2

2 years ago

18.1.1

2 years ago

18.1.0

2 years ago

18.0.5

2 years ago

18.0.4

2 years ago

18.0.3

2 years ago

18.0.2

2 years ago

18.0.1

2 years ago

18.0.0

2 years ago

17.0.1

2 years ago

0.0.1-rc.57

2 years ago

0.0.1-rc.56

2 years ago

0.0.1-rc.55

2 years ago

0.0.1-rc.54

2 years ago

0.0.1-rc.53

2 years ago

0.0.1-rc.52

2 years ago

0.0.1-rc.51

2 years ago

0.0.1-rc.50

2 years ago

0.0.1-rc.49

2 years ago

0.0.1-rc.48

2 years ago

0.0.1-rc.47

2 years ago

0.0.1-rc.46

2 years ago

0.0.1-rc.45

2 years ago

0.0.1-rc.44

2 years ago

0.0.1-rc.43

2 years ago

0.0.1-rc.42

2 years ago

0.0.1-rc.41

2 years ago

0.0.1-rc.40

2 years ago

0.0.1-rc.39

2 years ago

0.0.1-rc.38

2 years ago

0.0.1-rc.37

2 years ago

0.0.1-rc.36

2 years ago

0.0.1-rc.34

2 years ago

0.0.1-rc.33

2 years ago

0.0.1-rc.32

2 years ago

0.0.1-rc.31

2 years ago

0.0.1-rc.30

2 years ago

0.0.1-rc.29

2 years ago

0.0.1-rc.28

2 years ago

0.0.1-rc.27

2 years ago

0.0.1-rc.26

2 years ago

0.0.1-rc.25

2 years ago

0.0.1-rc.24

2 years ago

0.0.1-rc.23

2 years ago

0.0.1-rc.22

2 years ago

0.0.1-rc.21

2 years ago

0.0.1-rc.20

2 years ago

0.0.1-rc.19

2 years ago

0.0.1-rc.18

2 years ago

0.0.1-rc.17

2 years ago

0.0.1-rc.16

2 years ago

0.0.1-rc.15

2 years ago

0.0.1-rc.14

2 years ago

0.0.1-rc.13

2 years ago

0.0.1-rc.12

2 years ago

0.0.1-rc.11

2 years ago

0.0.1-rc.10

2 years ago

0.0.1-rc.9

2 years ago

0.0.1-rc.8

2 years ago

0.0.1-rc.7

2 years ago

0.0.1-rc.6

2 years ago

0.0.1-rc.5

2 years ago

0.0.1-rc.4

2 years ago

0.0.1-rc.3

2 years ago

0.0.1-rc.2

2 years ago

0.0.1-rc.1

2 years ago

0.0.1-rc.0

2 years ago