squiggle/packages/playground/src/components/charts/NumberShower.res
2022-02-10 10:16:07 +11:00

32 lines
823 B
Plaintext

module JS = {
@deriving(abstract)
type numberPresentation = {
value: string,
power: option<float>,
symbol: option<string>,
}
@module("./numberShower.js")
external numberShow: (float, int) => numberPresentation = "numberShow"
}
let sup = {
open CssJs
style(. [ fontSize(#em(0.6)), verticalAlign(#super) ])
}
@react.component
let make = (~number, ~precision) => {
let numberWithPresentation = JS.numberShow(number, precision)
<span>
{JS.valueGet(numberWithPresentation) |> React.string}
{JS.symbolGet(numberWithPresentation) |> R.O.fmapOrNull(React.string)}
{JS.powerGet(numberWithPresentation) |> R.O.fmapOrNull(e =>
<span>
{j`\\u00b710` |> React.string}
<span className=sup> {e |> E.Float.toString |> React.string} </span>
</span>
)}
</span>
}