Musical keyboard component written in React.

react components piano piano-keyboard pianoforte music instrument musical-keyboard keyboard midi

TheoryOfNekomata b6ea02a3ad Add keyboard map Keyboard map is the one responsible for handling mouse, touch, and keyboard events. This is to keep the keyboard rendering and external events handling separate.		4 anni fa
.storybook	Add keyboard map	4 anni fa
src	Add keyboard map	4 anni fa
.editorconfig	Initial commit	4 anni fa
.gitignore	Fix metrics, SSR support	4 anni fa
.npmignore	Update dependency list	4 anni fa
.prettierrc	Initial commit	4 anni fa
LICENSE	Initial commit	4 anni fa
README.md	Initial commit	4 anni fa
package.json	Fix metrics, SSR support	4 anni fa
tsconfig.json	Make accidentals more prominent	4 anni fa
yarn.lock	Remove extraneous dependency	4 anni fa

README.md

Musical Keyboard

Musical keyboard component written in React.

Installation

yarn add @theoryofnekomata/react-musical-keyboard

Usage

import * as React from 'react'
import ReactDOM from 'react-dom'
import Keyboard from '@theoryofnekomata/react-musical-keyboard'

const App = () => {
  return (
    <div>
      <Keyboard startKey={21} endKey={108}/>
    </div>
  )
}

const container = window.document.createElement('div')

ReactDOM.render(<App />, container)

window.document.body.appendChild(container)

License

MIT. See License file for details.