{"id":23283564,"url":"https://github.com/fa-sharp/abc-notation-editor","last_synced_at":"2025-04-06T14:43:52.236Z","repository":{"id":210764717,"uuid":"721007428","full_name":"fa-sharp/abc-notation-editor","owner":"fa-sharp","description":"A visual music notation editor for the browser","archived":false,"fork":false,"pushed_at":"2023-12-31T08:52:54.000Z","size":1001,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2023-12-31T09:19:50.788Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://fa-sharp.github.io/abc-notation-editor/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fa-sharp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2023-11-20T06:57:33.000Z","updated_at":"2023-12-31T09:19:53.320Z","dependencies_parsed_at":null,"dependency_job_id":"8f918b63-5e2c-4f23-9164-7b78e2853259","html_url":"https://github.com/fa-sharp/abc-notation-editor","commit_stats":null,"previous_names":["fa-sharp/abc-notation-editor"],"tags_count":0,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fa-sharp%2Fabc-notation-editor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fa-sharp%2Fabc-notation-editor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fa-sharp%2Fabc-notation-editor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fa-sharp%2Fabc-notation-editor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fa-sharp","download_url":"https://codeload.github.com/fa-sharp/abc-notation-editor/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247500454,"owners_count":20948877,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-20T01:22:27.654Z","updated_at":"2025-04-06T14:43:52.210Z","avatar_url":"https://github.com/fa-sharp.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ABC Music Notation Editor\n\n[![library CI status](https://github.com/fa-sharp/abc-notation-editor/actions/workflows/lib.yml/badge.svg)](https://github.com/fa-sharp/abc-notation-editor/actions/workflows/lib.yml)\n[![docs site CI status](https://github.com/fa-sharp/abc-notation-editor/actions/workflows/docs.yml/badge.svg)](https://github.com/fa-sharp/abc-notation-editor/actions/workflows/docs.yml)\n\n⚠️⚠️⚠️ Currently in alpha stage and missing a lot of features. Things _will_ break. Use at your own risk! ⚠️⚠️⚠️\n\nA visual music notation editor, using [ABC notation](https://abcnotation.com/) and built on top of the [abcjs](https://github.com/paulrosen/abcjs) rendering library.\n\n\u003cimg src=\"https://github.com/fa-sharp/abc-notation-editor/raw/main/astro/src/assets/preview.gif\" alt=\"Preview\" width=\"400\" /\u003e\n\n## Installation\n\nAdd the corresponding package for your framework (only React available for now), as well as the [abcjs](https://github.com/paulrosen/abcjs) library, which acts as the rendering engine.\n\n```bash\nnpm install @abc-editor/react@alpha abcjs\n# or\npnpm add @abc-editor/react@alpha abcjs\n# etc...\n```\n\n## Usage\n\n### React\n\n```jsx\n\"use client\"; // if needed - see https://react.dev/reference/react/use-client\n\nimport { ABCEditor } from \"@abc-editor/react\";\n\nfunction AbcNotationEditor() {\n  return \u003cABCEditor minWidth={600} onChange={(abc) =\u003e console.log(abc)} /\u003e;\n}\n```\n\nKeep in mind that rendering and editing sheet music relies heavily on browser APIs, so this should be be a client-side-only component.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffa-sharp%2Fabc-notation-editor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffa-sharp%2Fabc-notation-editor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffa-sharp%2Fabc-notation-editor/lists"}