Skip to content

MirrorSharp is a code editor <textarea> built on Roslyn and CodeMirror

Notifications You must be signed in to change notification settings

baronfel/mirrorsharp

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Overview

MirrorSharp is a code editor <textarea> built on Roslyn and CodeMirror.

Features

Code completion

Code completion

Signature help

Signature help

Quick fixes

Quick fixes

Diagnostics

Diagnostics

Quick info

Quick info

Usage

You'll need the following:

  • MirrorSharp.AspNetCore on the server (MirrorSharp.Owin if .NET Framework)
  • mirrorsharp.js — client library that provides the user interface

Server

build

MirrorSharp.AspNetCore

NuGet

Install-Package MirrorSharp.AspNetCore

If using Endpoint Routing (3.0+ only):

app.UseEndpoints(endpoints => {
    // ...
    endpoints.MapMirrorSharp("/mirrorsharp");
});

If not using Endpoint Routing:

app.MapMirrorSharp("/mirrosharp");

MirrorSharp.Owin

NuGet

Install-Package MirrorSharp.Owin

In your Startup:

app.MapMirrorSharp("/mirrosharp");

Client

build
npm

npm install mirrorsharp --save

CSS

If you are using LESS, CSS references can be done automatically by including mirrorsharp/mirrorsharp.less.

Otherwise, make sure to include the following:

  1. codemirror/lib/codemirror.css
  2. codemirror/addon/lint/lint.css
  3. codemirror/addon/hint/show-hint.css
  4. codemirror-addon-infotip/dist/infotip.css
  5. codemirror-addon-lint-fix/dist/lint-fix.css
  6. mirrorsharp/mirrorsharp.css

JS

Since mirrorsharp JS files are not bundled, you'll need to either:

  1. Use a bundler such as Webpack or Parcel
  2. Use <script type="module">.

You can see a Parcel example in AspNetCore.Demo.

Note that mirrorsharp is written in TypeScript, and the package includes full TypeScript types.

Usage

import mirrorsharp from 'mirrorsharp';

mirrorsharp(textarea, { serviceUrl: 'wss://your_app_root/mirrorsharp' })

If you're not using HTTPS, you'll likely need ws:// instead of wss://.

Note that textarea is an actual textarea element, and not a CSS selector or jQuery object.

API

TODO. In general the idea is that "it just works", however customization is a goal and some options are already available.

Demos

You can check out the demos if you clone the repository locally.
After cloning, run mirrorsharp setup to build and prepare everything.

Testing

TODO, but see MirrorSharp.Testing on NuGet.

About

MirrorSharp is a code editor <textarea> built on Roslyn and CodeMirror

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • C# 78.6%
  • TypeScript 16.3%
  • CSS 3.5%
  • PowerShell 0.6%
  • JavaScript 0.4%
  • Less 0.3%
  • Other 0.3%