CodeMirror: Simple Mode Demo

## Simple Mode Demo

The `mode/simple` addon allows CodeMirror modes to be specified using a relatively simple declarative format. This format is not as powerful as writing code directly against the mode interface, but is a lot easier to get started with, and sufficiently expressive for many simple language modes.

This interface is still in flux. It is unlikely to be scrapped or overhauled completely, so do start writing code against it, but details might change as it stabilizes, and you might have to tweak your code when upgrading.

Simple modes (loosely based on the Common JavaScript Syntax Highlighting Specification, which never took off), are state machines, where each state has a number of rules that match tokens. A rule describes a type of token that may occur in the current state, and possibly a transition to another state caused by that token.

The `CodeMirror.defineSimpleMode(name, states)` method takes a mode name and an object that describes the mode's states. The editor below shows an example of such a mode (and is itself highlighted by the mode shown in it).

Each state is an array of rules. A rule may have the following properties:

`regex: string | RegExp`
  The regular expression that matches the token. May be a string or a regex object. When a regex, the `ignoreCase` flag will be taken into account when matching the token. This regex should only capture groups when the `token` property is an array.
`token`: string | null
  An optional token style. Multiple styles can be specified by separating them with dots or spaces. When the `regex` for this rule captures groups, it must capture all of the string (since JS provides no way to find out where a group matched), and this property must hold an array of token styles that has one style for each matched group.
`next: string`
  When a `next` property is present, the mode will transfer to the state named by the property when the token is encountered.
`push: string`
  Like `next`, but instead replacing the current state by the new state, the current state is kept on a stack, and can be returned to with the `pop` directive.
`pop: bool`
  When true, and there is another state on the state stack, will cause the mode to pop that state off the stack and transition to it.
`mode: {spec, end, persistent}`
  Can be used to embed another mode inside a mode. When present, must hold an object with a `spec` property that describes the embedded mode, and an optional `end` end property that specifies the regexp that will end the extent of the mode. When a `persistent` property is set (and true), the nested mode's state will be preserved between occurrences of the mode.
`indent: bool`
  When true, this token changes the indentation to be one unit more than the current line's indentation.
`dedent: bool`
  When true, this token will pop one scope off the indentation stack.
`dedentIfLineStart: bool`
  If a token has its `dedent` property set, it will, by default, cause lines where it appears at the start to be dedented. Set this property to false to prevent that behavior.

The `meta` property of the states object is special, and will not be interpreted as a state. Instead, properties set on it will be set on the mode, which is useful for properties like `lineComment`, which sets the comment style for a mode. The simple mode addon also recognizes a few such properties:

`dontIndentStates: array<string>`
  An array of states in which the mode's auto-indentation should not take effect. Usually used for multi-line comment and string states.