📦 Install

$ yarn add fingerboard

🔨 Usage

// import fingerboard component and stylesheet
import Fingerboard from 'fingerboard'
import 'fingerboard/dist/index.min.css'

const App = () => (
  <>
    <Fingerboard data={[ {string: 1, fret: 1} ]} />
  </>
)

📖 API

Property | Description | Type | Default --- | --- | --- | --- data | data record to be displayed | point | point[] (point: {'string': number, 'fret': number}) | [] className | container class name | string | '' fretMark | if fret show mark number | 'default' | 'all' | null | 'default' fretWidth | width of fret | number | 72

⌨️ Development

$ git clone https://github.com/z7w7/fingerboard.git
$ cd fingerboard
$ yarn
$ yarn link & yarn dev

$ yarn link fingerboard # in another project