{"id":23456394,"url":"https://github.com/gravity-ui/markdown-editor","last_synced_at":"2026-03-18T01:20:53.721Z","repository":{"id":59663968,"uuid":"526156868","full_name":"gravity-ui/markdown-editor","owner":"gravity-ui","description":"Markdown wysiwyg and markup editor","archived":false,"fork":false,"pushed_at":"2025-04-02T09:09:08.000Z","size":37638,"stargazers_count":243,"open_issues_count":43,"forks_count":19,"subscribers_count":14,"default_branch":"main","last_synced_at":"2025-04-02T09:57:52.012Z","etag":null,"topics":["codemirror","diplodoc","gfm","markdown","prosemirror","react","wysiwyg","yfm"],"latest_commit_sha":null,"homepage":"https://preview.gravity-ui.com/md-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/gravity-ui.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-08-18T10:06:14.000Z","updated_at":"2025-04-01T15:04:10.000Z","dependencies_parsed_at":"2023-12-26T16:57:43.541Z","dependency_job_id":"eea18acc-fb7b-4509-8fa6-93c84d3a03aa","html_url":"https://github.com/gravity-ui/markdown-editor","commit_stats":{"total_commits":104,"total_committers":7,"mean_commits":"14.857142857142858","dds":0.4326923076923077,"last_synced_commit":"f1910c3ff50d08b97e4c1ba7c8f9c96fb8acba3a"},"previous_names":["gravity-ui/markdown-editor","yandex-cloud/yfm-editor"],"tags_count":135,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fmarkdown-editor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fmarkdown-editor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fmarkdown-editor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fmarkdown-editor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gravity-ui","download_url":"https://codeload.github.com/gravity-ui/markdown-editor/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248027407,"owners_count":21035594,"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":["codemirror","diplodoc","gfm","markdown","prosemirror","react","wysiwyg","yfm"],"created_at":"2024-12-24T04:29:01.530Z","updated_at":"2026-03-18T01:20:53.708Z","avatar_url":"https://github.com/gravity-ui.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"![Markdown Editor](https://github.com/user-attachments/assets/0b4e5f65-54cf-475f-9c68-557a4e9edb46)\n\n# @gravity-ui/markdown-editor \u0026middot; [![npm package](https://img.shields.io/npm/v/@gravity-ui/markdown-editor)](https://www.npmjs.com/package/@gravity-ui/markdown-editor) [![CI](https://img.shields.io/github/actions/workflow/status/gravity-ui/markdown-editor/ci.yml?branch=main\u0026label=CI)](https://github.com/gravity-ui/markdown-editor/actions/workflows/ci.yml?query=branch:main) [![Release](https://img.shields.io/github/actions/workflow/status/gravity-ui/markdown-editor/release.yml?branch=main\u0026label=Release)](https://github.com/gravity-ui/markdown-editor/actions/workflows/release.yml?query=branch:main) [![storybook](https://img.shields.io/badge/Storybook-deployed-ff4685)](https://preview.gravity-ui.com/md-editor/)\n\n## Markdown wysiwyg and markup editor\n\nMarkdownEditor is a powerful tool for working with Markdown, which combines WYSIWYG and Markup modes. This means that you can create and edit content in a convenient visual mode, as well as have full control over the markup.\n\n### 🔧 Main features\n\n- Support for the basic Markdown and [YFM](https://ydocs.tech) syntax.\n- Extensibility through the use of ProseMirror and CodeMirror engines.\n- The ability to work in WYSIWYG and Markup modes for maximum flexibility.\n\n## Install\n\n```shell\nnpm install @gravity-ui/markdown-editor\n```\n\n### Required dependencies\n\nPlease note that to start using the package, your project must also have the following installed: `@diplodoc/transform`, `react`, `react-dom`, `@gravity-ui/uikit`, `@gravity-ui/components` and some others. Check out the `peerDependencies` section of `package.json` for accurate information.\n\n## Getting started\n\nThe markdown editor is supplied as a React hook to create an instance of editor and a component for rendering the view.\\\nTo set up styling and theme see [UIKit docs](https://github.com/gravity-ui/uikit?tab=readme-ov-file#styles).\n\n```tsx\nimport React from 'react';\nimport {useMarkdownEditor, MarkdownEditorView} from '@gravity-ui/markdown-editor';\n\nfunction Editor({onSubmit}) {\n  const editor = useMarkdownEditor({allowHTML: false});\n\n  React.useEffect(() =\u003e {\n    function submitHandler() {\n      // Serialize current content to markdown markup\n      const value = editor.getValue();\n      onSubmit(value);\n    }\n\n    editor.on('submit', submitHandler);\n    return () =\u003e {\n      editor.off('submit', submitHandler);\n    };\n  }, [onSubmit]);\n\n  return \u003cMarkdownEditorView stickyToolbar autofocus editor={editor} /\u003e;\n}\n```\nRead more:\n- [How to connect the editor in the Create React App](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-getting-started-create-react-app--docs)\n- [How to add preview for markup mode](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-getting-started-preview--docs)\n- [How to add HTML extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-extensions-html-block--docs)\n- [How to add Latex extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-extensions-latex-extension--docs)\n- [How to add Mermaid extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-extensions-mermaid-extension--docs)\n- [How to write extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-extension-creation--docs)\n- [How to add GPT extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-extensions-gpt--docs)\n- [How to add text binding extension in markdown](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-extension-with-popup--docs)\n\n### Development\n\n1. Install Nodejs environment, version is specified in `.nvmrc` file. We recommend using [NVM](https://github.com/nvm-sh/nvm) or a similar tool.\n2. Install [pnpm](https://pnpm.io/installation), version is specified in `package.json` in \"packageManager\" property.\n3. Install dependencies: `pnpm i`\n4. Run storybook dev-server: `pnpm start`\n\n\n### i18n\n\nTo set up internationalization, you just need to use the `configure`:\n\n```typescript\nimport {configure} from '@gravity-ui/markdown-editor';\n\nconfigure({\n  lang: 'ru',\n});\n```\n\nDon't forget to call `configure()` from [UIKit](https://github.com/gravity-ui/uikit?tab=readme-ov-file#i18n) and other UI libraries.\n\n### Contributing\n\n- [Contributor Guidelines](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-contributing--docs)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravity-ui%2Fmarkdown-editor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgravity-ui%2Fmarkdown-editor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravity-ui%2Fmarkdown-editor/lists"}