v0.58

0.58.0 (2020-10-11)

New Features

• #225 Added onCommit listener to mf.options. This listener is invoked when
  the user presses Enter or Return key, or when the field loses focus
  and its value has changed since it acquired it.
  In addition, a change event is triggered when using a MathfieldElement.
  The event previously named change has been renamed to input.
  This mimics the behavior of <input> and <textarea> elements.

• #225 Changed the keyboard shortcuts to add columns and rows:

  Shortcut	Command
  ctrl/cmd + Return/Enter	addRowAfter
  ctrl/cmd + shift + Return/Enter	addRowBefore
  ctrl/cmd + ;	addRowAfter
  ctrl/cmd + shift + ;	addRowBefore
  ctrl/cmd + ,	addColumnAfter
  ctrl/cmd + shift + ,	addColumnBefore

  Note that Enter/Return no longer create a matrix/vector when inside a parenthesized expression. Use ctrl/cmd + Return/Enter instead.

• Added a commit command to programmatically trigger the onCommit listener
  change event.

• Added mount and unmount events to MathfieldElement

• The $text() method, which is deprecated, was accidentally prematurely removed.
  It has been added back.

Bug Fixes

• Inline shortcuts would not always be triggered correctly,
  for example x=sin -> x\sin instead of x=\sin
• The text in tooltip was not vertically centered in narrow layouts (mobile devices)
• #668 Extensible symbols, such as \xrightarrow were incorrectly
  treated as if they had an invisible boundary, resulting in the cursor
  being positioned incorrectly when navigating with the keyboard.

0.57.0 (2020-10-09)

Major New Feature

This release introduce two major new features which will require code changes.
For now, the older API remains supported but it will be dropped in an
upcoming release.

#665: Web Component

Support for MathfieldElement custom element/web component and <math-field> tag.

The makeMathField() method is still supported, but it will be removed in an upcoming version. You should transition to using <math-field> or
MathfieldElement instead.

This transition require the following changes:

1. Create mathfields using MathfieldElement or declaratively

// Before
let mf = MathLive.makeMathField(document.createElement('div'), {
    virtualKeyboardMode: 'manual',
});
mf.$latex('f(x) = \\sin x');
document.body.appendChild(mf.$el());

// After
let mfe = new MathfieldElement({
    virtualKeyboardMode: 'manual',
});
mfe.value = 'f(x) = \\sin x';
document.body.appendChild(mfe);

or:

<math-field virtual-keyboard-mode="manual">f(x) = \sin x</math-field>

2. Use events instead of callbacks

    // Before
    mf.setConfig({ onContentDidChange: (mf) => {
        console.log(mf.$latex())
    });

    // After
    mfe.addEventListener('input', (ev) => {
        console.log(mfe.value);
    });

#667 Modernized Public API

Support for web component is an opportunity to revisit the MathLive public API and modernize it.

The goals are:

• clarity. For example, the $latex() can be used to read or change the content of the mathfield.
• expressiveness. For example, $selectedText() can return the value of the selection,
  but there is no way to inspect (or save/restore) the selection.
• consistency with web platform APIs when applicable, otherwise following the monaco (VSCode editor) or CodeMirror conventions primarily. As part of this proposal, the APIs of TinyMCE, CKEditor and QuillJS were also considered. For example, the method equivalent to getConfig() is called getOptions() in most
  Javascript text editor libraries.

Mathfield methods

The following Mathfield methods have been renamed as indicated:

Before	After
$setConfig()	setOptions()
getConfig()	getOptions() and getOption()
$text()	getValue()
$latex()	value, getValue() and setValue()
$insert()	insert()
$hasFocus()	hasFocus()
$focus()	focus()
$blur()	blur()
$selectedText()	mf.getValue(mf.selection)
$selectionIsCollapsed()	mf.selection[0].collapsed
$selectionDepth()	mf.selection[0].depth
$selectionAtStart()	mf.position === 0
$selectionAtEnd()	mf.position === mf.lastPosition
$select()	select()
$clearSelection()	executeCommand('delete-previous-char')
$keystroke()	executeCommand()
$typedText()	executeCommand('typed-text')
$perform()	executeCommand()
$revertToOriginalContent()	n/a
$el()	n/a
n/a	selection
n/a	position

The methods indicated with "n/a" in the After column have been dropped.

Only the new methods are available on MathfieldElement (i.e. when using web components). The Mathfield class retains both the old methods and the
new ones to facilitate the transition, but the old ones will be dropped
in an upcoming version.

There is also a new selection property on Mathfield and MathfieldElement
which can be used to inspect and change the selection and a position
property to inspect and change the insertion point (caret).

The getValue() method also now take an (optional) Range, which is
the type of the selection property, to extract a fragment of the expression.

Default Exports

While default exports have the benefits of expediency, particularly when converting an existing code base to ES Modules, they are problematic for effective tree shaking. Therefore the default export will be eliminated.

This means that instead of:

import Mathlive from 'mathlive';
Mathlive.renderMathInDocument();

you will need to use:

import { renderMathInDocument } from 'mathlive';
renderMathInDocument();

The following functions have been renamed:

Before	After
MathLive.latexToAST()	Use MathJSON
MathLive.latexToMarkup()	convertLatexToMarkup()
MathLive.latexToMathML()	convertLatexToMathMl()
MathLive.latexToSpeakableText()	convertLatexToSpeakableText()

New Features

• #101: added getCaretPosition() and setCaretPosition()

Improvements

• The Typescript types for Selector has been improved
• The Typescript type for getOptions() (getConfig()) are more accurate
• The "sqrt" inline shortcut now inserts an argument
• Don't throw an error if the first argument of \enclose is empty
• #591: add upward and downward hooks when navigating out of the
  mathfield (now also sent as a focus-out event)
• Improved layout of the virtual keyboard on narrow mobile devices (fill the available width).

Bug Fixes

• #198: typing backspace while typing inline shortcuts would prevent the
  shortcuts from being recognized
• #573: brackets were not properly styled (i.e. color applied to them)
• #543: spurious focus/blur events were dispatched if tabIndex was
  set to 0 on the mathfield and some area of the mathfield were clicked on.
  The issue was that with tabIndex="0" the mathfield frame would be focusable
  and when that happened the focus would correctly switch to the invisible
  <textarea> element which is normally focused to receive keyboard events,
  but this generated an incorrect blur event (for the container losing focus)
  and an incorrect focus event (for the <textarea> gaining focus)
• #599: some characters, for example "ü", would not be correctly parsed or
  displayed. Note that technically, those characters are ignored by TeX,
  but it's a reasonable behavior nowadays to accept them as input.
• #628: typing "e" repeatedly inside a matrix would corrupt the emited
• #637: in Chrome, thin lines, such as fraction bars or square root lines
  would not display at some zoom levels
• The locale was not properly taking into account when it was set manually
• The config.strings property did not reflect the state of the localization strings
• When configs was updated (e.g. new macros added), the content of the mathfield was not properly re-parsed and rendered
• When making the virtual keyboard visible, the mathfield would not be focused
• The virtual keyboard would not display correctly when the mathfield was inside a shadow DOM

Special Thanks

• Thanks to @stefnotch for contributing several of the improvements in this
  release