{"id":13515323,"url":"https://github.com/yjs/y-monaco","last_synced_at":"2025-04-10T00:18:52.997Z","repository":{"id":42164022,"uuid":"187193716","full_name":"yjs/y-monaco","owner":"yjs","description":"Monaco editor bindings for Yjs","archived":false,"fork":false,"pushed_at":"2024-07-31T13:00:27.000Z","size":466,"stargazers_count":178,"open_issues_count":8,"forks_count":34,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-04-09T14:51:22.668Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","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/yjs.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,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":"dmonad","patreon":null,"open_collective":"y-collective","ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2019-05-17T10:05:51.000Z","updated_at":"2025-03-28T09:29:57.000Z","dependencies_parsed_at":"2024-04-15T09:05:28.303Z","dependency_job_id":"4470814f-b0ed-4ca9-8757-551f5280a7f4","html_url":"https://github.com/yjs/y-monaco","commit_stats":{"total_commits":34,"total_committers":6,"mean_commits":5.666666666666667,"dds":0.6176470588235294,"last_synced_commit":"33d15837a7be84442bc5d70d2c417d889e60b5cf"},"previous_names":["y-js/y-monaco"],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yjs%2Fy-monaco","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yjs%2Fy-monaco/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yjs%2Fy-monaco/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yjs%2Fy-monaco/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yjs","download_url":"https://codeload.github.com/yjs/y-monaco/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248055271,"owners_count":21040151,"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-08-01T05:01:09.467Z","updated_at":"2025-04-10T00:18:52.973Z","avatar_url":"https://github.com/yjs.png","language":"JavaScript","funding_links":["https://github.com/sponsors/dmonad","https://opencollective.com/y-collective"],"categories":["JavaScript","Server"],"sub_categories":["JavaScript"],"readme":"# y-monaco\n\u003e [Monaco](https://microsoft.github.io/monaco-editor/index.html) Editor Binding for [Yjs](https://github.com/y-js/yjs) - [Demo](https://demos.yjs.dev/monaco/monaco.html)\n\nThis binding maps a Y.Text to the Monaco editor (the editor that power VS Code).\n\n### Features\n\n* Shared Cursors\n\n### Example\n\n```js\nimport * as Y from 'yjs'\nimport { WebsocketProvider } from 'y-websocket'\nimport { MonacoBinding } from 'y-monaco'\nimport * as monaco from 'monaco-editor'\n\nconst ydocument = new Y.Doc()\nconst provider = new WebsocketProvider(`${location.protocol === 'http:' ? 'ws:' : 'wss:'}//localhost:1234`, 'monaco', ydocument)\nconst type = ydocument.getText('monaco')\n\nconst editor = monaco.editor.create(document.getElementById('monaco-editor'), {\n  value: '', // MonacoBinding overwrites this value with the content of type\n  language: \"javascript\"\n})\n\n// Bind Yjs to the editor model\nconst monacoBinding = new MonacoBinding(type, editor.getModel(), new Set([editor]), provider.awareness)\n```\n\nAlso look [here](https://github.com/y-js/yjs-demos/tree/master/monaco) for a working example.\n\n## API\n\n```js\nimport { MonacoBinding } from 'y-monaco'\n\nconst binding = new MonacoBinding(type, editor.getModel(), new Set([editor]), provider.awareness)\n```\n\n### Class:MonacoBinding\n\n\u003cdl\u003e\n  \u003cb\u003e\u003ccode\u003econstructor(Y.Text, monaco.editor.ITextModel, [Set\u0026lt;monaco.editor.IStandaloneCodeEditor\u0026gt;, [Awareness]])\u003c/code\u003e\u003c/b\u003e\n  \u003cdd\u003eIf the editor(s) are specified, MonacoBinding adjusts selections when remote changes happen. \u003ccode\u003eAwareness\u003c/code\u003e is an implementation of the awareness protocol of \u003ccode\u003ey-protocols/awareness\u003c/code\u003e. If Awareness is specified, MonacoBinding renders remote selections.\u003c/dd\u003e\n  \u003cb\u003e\u003ccode\u003edestroy()\u003c/code\u003e\u003c/b\u003e\n  \u003cdd\u003eUnregister all event listeners. This is automatically called when the model is disposed.\u003c/dd\u003e\n\u003c/dl\u003e\n\n## Styling\n\nYou can use the following CSS classes to style remote cursor selections:\n\n- `yRemoteSelection`\n- `yRemoteSelectionHead`\n\nSee [demo/index.html](demo/index.html) for example styles. Additionally, you can enable per-user styling (e.g.: different colors per user). The recommended approach for this is to listen to `awareness.on(\"update\", () =\u003e ...));` and inject custom styles for every available clientId. You can use the following classnames for this:\n\n- `yRemoteSelection-${clientId}`\n- `yRemoteSelectionHead-${clientId`\n\n(where `${clientId}` is the Yjs clientId of the specific user).\n### License\n\n[The MIT License](./LICENSE) © Kevin Jahns\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyjs%2Fy-monaco","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyjs%2Fy-monaco","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyjs%2Fy-monaco/lists"}