0.1.3 • Published 5 years ago

tutch-codemirror v0.1.3

Weekly downloads
4
License
GPL-3.0
Repository
github
Last release
5 years ago

Tutch Component

A CodeMirror component for Tutch.

Creating a Tutch component

A Tutch component is created by passing in a host element that will host the component, a url where the tutch-worker javascript file is located, and an instance of the CodeMirror library.

import Tutch from 'tutch';

Tutch({
    host: document.getElementById('host'),
    url: '/worker.js',
    codemirror: CodeMirror,
});

In addition, there are a number of optional arguments:

  • text: string - the initial text in the editor
  • onSuccess: (justs: Justification[]) => void - A callback called whenever Tutch successfully parses and check a file.
  • onError: (errorMessage: string, loc: SourceLocation | null) => void - A callback called whenever Tutch runs into a syntax error
  • onUpdate: (text: string) => void - A callback called whenever the text inside the editor changes

Styling a Tutch component

The component will only look right if you include the CSS file for CodeMirror in your code and give styles to the following four classes:

  • TutchSyntaxError - Style for syntax errors
  • TutchJustified - Style for propositions that are justified
  • TutchNotJustified - Style for propositions that are not justified

A example and reasonable set of defaults are at demo/tutch.css.

Demo

You can see the component in action by downloading this repository, running

npm i
npm start

and going to http://localhost:8080/.