@pie-lib/math-input-mathlive 1.0.10 → 1.0.12

package/src/keys/misc.js

@@ -29,10 +29,16 @@ export const brackets = set({
   command: '[',
 });
 
+// `%` must be escaped. MathQuill was not a real LaTeX parser: it defined
+// `LatexCmds['%']` as a symbol that *serialised* to `\%`, so a bare `%` worked
+// both as a label and as a command. MathLive parses LaTeX properly, where `%`
+// begins a comment - it rendered nothing (a blank button) and, once inserted,
+// silently swallowed the rest of the expression. `\%` is what MathQuill stored
+// all along, so this changes the key only, not the saved latex.
 export const percentage = set({
   name: 'Percent',
-  latex: '%',
-  command: '%',
+  latex: '\\%',
+  command: '\\%',
 });
 
 export const approx = set({

package/src/latex-bridge.js

@@ -114,6 +114,40 @@ export const toNativeCommands = (latex) => {
   out = replaceAbs(out);
   out = out.replace(/\\longdiv\{/g, '\\enclose{longdiv}{');
   out = out.replace(/\\overarc\{/g, '\\overparen{');
+  out = escapeBareComments(out);
+
+  return out;
+};
+
+/**
+ * Escape an unescaped `%`.
+ *
+ * In real LaTeX `%` starts a comment, so MathLive discards it *and everything
+ * after it*: `50%` renders as `50`, and `x%y` as just `x`. MathQuill had no
+ * such notion - it treated `%` as a symbol - so latex from anywhere outside the
+ * keypad may still carry a bare one.
+ *
+ * Only a `%` preceded by an even number of backslashes is bare: `\%` is already
+ * escaped, while the `%` in `\\%` (a line break, then a comment) is not.
+ *
+ * @param {string} latex
+ * @returns {string}
+ */
+const escapeBareComments = (latex) => {
+  if (latex.indexOf('%') === -1) {
+    return latex;
+  }
+
+  let out = '';
+  // Consecutive backslashes immediately before the current character.
+  let backslashes = 0;
+
+  for (let i = 0; i < latex.length; i++) {
+    const ch = latex[i];
+
+    out += ch === '%' && backslashes % 2 === 0 ? '\\%' : ch;
+    backslashes = ch === '\\' ? backslashes + 1 : 0;
+  }
 
   return out;
 };

package/src/mathlive-instance.js

@@ -196,7 +196,81 @@ const configureLoaded = () => {
  * `:has(.ML__stretchy)` keeps the fix to stretchy accents; single-glyph accents
  * (`\hat{x}`, `\vec{x}`) still need their centring offset.
  */
-const SHADOW_CSS = '.ML__latex .ML__center:has(.ML__stretchy){margin-left:0 !important}';
+/**
+ * Marker put on the host `<math-field>` while a `\placeholder{}` is selected,
+ * so the caret rules below apply to a placeholder and nothing else.
+ */
+export const PLACEHOLDER_CARET_CLASS = 'pie-caret-in-placeholder';
+
+/** What MathLive serialises a `#?` slot as. */
+const PLACEHOLDER_LATEX = '\\placeholder{}';
+
+/**
+ * A blinking caret inside a selected placeholder box.
+ *
+ * A keypad key such as `\frac` inserts `\frac{#?}{#?}`. MathLive turns each
+ * `#?` into a `\placeholder{}` atom and *selects* the first one. That atom is a
+ * leaf - the offsets around it are "before" and "after", there is no position
+ * inside it - so MathLive renders **no caret element at all** and shows only
+ * the selection highlight. The box therefore looked focused (blue) but dead,
+ * where MathQuill used to blink a cursor inside its empty box.
+ *
+ * So the caret is drawn here. `:not(:has(.ML__selected))` picks the innermost
+ * selected element (MathLive puts the class on a wrapper *and* the glyph span,
+ * which would otherwise give two carets), and the `ML__caret-blink` keyframes
+ * plus `--_caret-color` are MathLive's own, already in this shadow root.
+ *
+ * Typing still replaces the whole placeholder, which for an empty box is
+ * indistinguishable from inserting at the caret.
+ */
+const PLACEHOLDER_CARET_CSS = [
+  `:host(.${PLACEHOLDER_CARET_CLASS}) .ML__selected:not(:has(.ML__selected)){position:relative}`,
+  `:host(.${PLACEHOLDER_CARET_CLASS}) .ML__selected:not(:has(.ML__selected))::after{`,
+  'content:"";position:absolute;left:50%;top:12%;height:76%;',
+  'border-right:2px solid var(--_caret-color, currentColor);',
+  'animation:ML__caret-blink 1.05s step-end forwards infinite}',
+].join('');
+
+const SHADOW_CSS = '.ML__latex .ML__center:has(.ML__stretchy){margin-left:0 !important}' + PLACEHOLDER_CARET_CSS;
+
+/**
+ * Keep {@link PLACEHOLDER_CARET_CLASS} in step with the selection.
+ *
+ * Gating on the class is what keeps the caret specific to placeholders: an
+ * ordinary selection (`x+1`) must not sprout one. MathLive fires
+ * `selection-change` for every caret move, including the one that lands on the
+ * placeholder straight after an insert.
+ *
+ * @param {HTMLElement} mathField
+ * @returns {function|undefined} teardown, to call on unmount
+ */
+export const trackPlaceholderCaret = (mathField) => {
+  if (!mathField || typeof mathField.addEventListener !== 'function') {
+    return undefined;
+  }
+
+  const update = () => {
+    let selected = '';
+
+    try {
+      // A collapsed selection already has a real MathLive caret.
+      if (!mathField.selectionIsCollapsed && mathField.selection) {
+        selected = mathField.getValue(mathField.selection, 'latex');
+      }
+    } catch (e) {
+      log('could not read the selection: %s', e && e.message);
+    }
+
+    if (mathField.classList) {
+      mathField.classList.toggle(PLACEHOLDER_CARET_CLASS, selected === PLACEHOLDER_LATEX);
+    }
+  };
+
+  mathField.addEventListener('selection-change', update);
+  update();
+
+  return () => mathField.removeEventListener('selection-change', update);
+};
 
 /**
  * Apply {@link SHADOW_CSS} inside a mathfield's shadow root.

package/src/mf/input.jsx

@@ -2,7 +2,13 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@mui/material/styles';
 import debug from 'debug';
-import { loadMathLive, getMacros, MATH_MODE_SPACE, applyShadowStyles } from '../mathlive-instance';
+import {
+  loadMathLive,
+  getMacros,
+  MATH_MODE_SPACE,
+  applyShadowStyles,
+  trackPlaceholderCaret,
+} from '../mathlive-instance';
 import { toMathLive, fromMathLive, keyToAction, KEYSTROKES } from '../latex-bridge';
 
 const log = debug('pie-lib:math-input-mathlive:input');
@@ -79,6 +85,9 @@ export class Input extends React.Component {
     // stretchy-accent fix has to be injected there directly.
     applyShadowStyles(this.mathField);
 
+    // A selected `\placeholder{}` gets no MathLive caret; draw one.
+    this.untrackCaret = trackPlaceholderCaret(this.mathField);
+
     this.mathField.addEventListener('input', this.onInputEdit);
 
     // Belt and braces: drop anything a previous mount may have left behind.
@@ -117,6 +126,11 @@ export class Input extends React.Component {
     // append a field into a holder that is going away.
     this.mountGeneration = (this.mountGeneration || 0) + 1;
 
+    if (this.untrackCaret) {
+      this.untrackCaret();
+      this.untrackCaret = undefined;
+    }
+
     if (this.mathField) {
       this.mathField.removeEventListener('input', this.onInputEdit);
       this.mathField.remove();

package/src/mf/static.jsx

@@ -2,7 +2,14 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@mui/material/styles';
 import debug from 'debug';
-import { loadMathLive, getMacros, latexToMarkup, MATH_MODE_SPACE, applyShadowStyles } from '../mathlive-instance';
+import {
+  loadMathLive,
+  getMacros,
+  latexToMarkup,
+  MATH_MODE_SPACE,
+  applyShadowStyles,
+  trackPlaceholderCaret,
+} from '../mathlive-instance';
 import { toMathLive, fromMathLive, fieldIds } from '../latex-bridge';
 import { placeholderStyles } from './common-styles';
 
@@ -97,6 +104,10 @@ export default class Static extends React.Component {
     // stretchy-accent fix has to be injected there directly.
     applyShadowStyles(this.mathField);
 
+    // A selected `\placeholder{}` gets no MathLive caret; draw one. Answer
+    // blocks are typed into with the same keypad, so they grow placeholders too.
+    this.untrackCaret = trackPlaceholderCaret(this.mathField);
+
     this.mathField.addEventListener('input', this.onPromptInput);
     this.mathField.addEventListener('focusin', this.onPromptFocus);
     this.mathField.addEventListener('keydown', this.onKeyDown);
@@ -123,6 +134,11 @@ export default class Static extends React.Component {
     // Invalidate any mount still awaiting the MathLive load.
     this.mountGeneration = (this.mountGeneration || 0) + 1;
 
+    if (this.untrackCaret) {
+      this.untrackCaret();
+      this.untrackCaret = undefined;
+    }
+
     if (this.mathField) {
       this.mathField.removeEventListener('input', this.onPromptInput);
       this.mathField.removeEventListener('focusin', this.onPromptFocus);
@@ -254,6 +270,13 @@ export default class Static extends React.Component {
   promptHandle(id) {
     return {
       id,
+      // MathQuill's inner fields could be focused directly; keep that.
+      focus: () => {
+        if (this.mathField) {
+          this.mathField.focus();
+          this.focusPrompt(id);
+        }
+      },
       latex: (value) => {
         if (!this.mathField) {
           return '';
@@ -351,8 +374,77 @@ export default class Static extends React.Component {
     }
   };
 
+  /** The id of the prompt whose range contains `position`, if any. */
+  promptContaining(position) {
+    if (!this.mathField || typeof position !== 'number') {
+      return undefined;
+    }
+
+    return (this.mathField.getPrompts() || []).find((id) => {
+      const range = this.mathField.getPromptRange(id);
+
+      return range && position >= range[0] && position <= range[1];
+    });
+  }
+
+  /**
+   * Put a blinking caret inside an answer block.
+   *
+   * MathLive only makes the caret visible while the field element carries the
+   * `ML__focused` class, and it adds that class during a *render*, gated on
+   * `isSelectionEditable && hasFocus()`. In a read-only field only prompt
+   * interiors are editable, so the two things both have to be true:
+   *
+   *  - the selection must sit inside a prompt, and
+   *  - a render must run afterwards.
+   *
+   * Assigning `selection` satisfies the first but not the second - it updates
+   * the model without re-rendering, so the class stays off and the caret span
+   * remains `visibility: hidden`. Executing any command does trigger the
+   * render, and `scrollIntoView` is the one with no other effect: it keeps the
+   * caret on screen, which the preceding `focus()` already does anyway.
+   *
+   * @param {string} [id] prompt to focus; defaults to the first one
+   */
+  focusPrompt(id) {
+    if (!this.mathField) {
+      return;
+    }
+
+    const ids = this.mathField.getPrompts() || [];
+    const target = id && ids.indexOf(id) !== -1 ? id : ids[0];
+
+    if (!target) {
+      return;
+    }
+
+    const range = this.mathField.getPromptRange(target);
+
+    if (!range) {
+      return;
+    }
+
+    this.mathField.selection = { ranges: [[range[0], range[0]]] };
+
+    if (typeof this.mathField.executeCommand === 'function') {
+      this.mathField.executeCommand('scrollIntoView');
+    }
+  }
+
   focus() {
-    this.mathField && this.mathField.focus();
+    if (!this.mathField) {
+      return;
+    }
+
+    this.mathField.focus();
+
+    // A bare focus() leaves the selection outside every prompt, which in a
+    // read-only field is not editable - the block looked focused but had no
+    // cursor. Clicking a prompt already works, because MathLive's own pointer
+    // handling moves the selection and re-renders.
+    if (!this.promptContaining(this.mathField.position)) {
+      this.focusPrompt();
+    }
   }
 
   blur() {

package/lib/__tests__/composites.test.js

@@ -1,255 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@testing-library/react");
-var _mathInput = _interopRequireDefault(require("../math-input"));
-var _horizontalKeypad = _interopRequireDefault(require("../horizontal-keypad"));
-var _input = _interopRequireDefault(require("../mf/input"));
-/**
- * The pieces that sit between the keypad and the field: how a pressed key is
- * routed into the field, and the legacy `{value,type}` shape math-toolbar
- * consumes.
- */
-describe('MathInput.keypadPress routing', function () {
-  var withInput = function withInput() {
-    var mi = new _mathInput["default"]({});
-    var calls = {
-      write: [],
-      keystroke: []
-    };
-    mi.input = {
-      write: function write(v) {
-        return calls.write.push(v);
-      },
-      keystroke: function keystroke(v) {
-        return calls.keystroke.push(v);
-      }
-    };
-    return {
-      mi: mi,
-      calls: calls
-    };
-  };
-  it('routes an insert action to write()', function () {
-    var _withInput = withInput(),
-      mi = _withInput.mi,
-      calls = _withInput.calls;
-    mi.keypadPress({
-      latex: '\\pi'
-    });
-    expect(calls.write).toEqual(['\\pi']);
-    expect(calls.keystroke).toEqual([]);
-  });
-  it('expands an argument-taking command before writing', function () {
-    var _withInput2 = withInput(),
-      mi = _withInput2.mi,
-      calls = _withInput2.calls;
-    mi.keypadPress({
-      command: '\\frac'
-    });
-    expect(calls.write).toEqual(['\\frac{#?}{#?}']);
-  });
-  it('routes a cursor keystroke to keystroke()', function () {
-    var _withInput3 = withInput(),
-      mi = _withInput3.mi,
-      calls = _withInput3.calls;
-    mi.keypadPress({
-      keystroke: 'Left'
-    });
-    expect(calls.keystroke).toEqual(['moveToPreviousChar']);
-    expect(calls.write).toEqual([]);
-  });
-  it('ignores keys with no action', function () {
-    var _withInput4 = withInput(),
-      mi = _withInput4.mi,
-      calls = _withInput4.calls;
-    mi.keypadPress({});
-    mi.keypadPress({
-      keystroke: 'Nonsense'
-    });
-    expect(calls.write).toEqual([]);
-    expect(calls.keystroke).toEqual([]);
-  });
-  it('is a no-op before the field ref exists', function () {
-    var mi = new _mathInput["default"]({});
-    expect(function () {
-      return mi.keypadPress({
-        latex: '\\pi'
-      });
-    }).not.toThrow();
-  });
-  it('changeLatex only fires onChange when the value differs', function () {
-    var onChange = jest.fn();
-    var mi = new _mathInput["default"]({
-      latex: 'x',
-      onChange: onChange
-    });
-    mi.changeLatex('x');
-    expect(onChange).not.toHaveBeenCalled();
-    mi.changeLatex('y');
-    expect(onChange).toHaveBeenCalledWith('y');
-  });
-  it('tracks focus state', function () {
-    var mi = new _mathInput["default"]({});
-    mi.setState = function (s) {
-      return Object.assign(mi.state, s);
-    };
-    mi.inputFocus();
-    expect(mi.state.focused).toBe(true);
-    mi.inputBlur();
-    expect(mi.state.focused).toBe(false);
-  });
-});
-describe('HorizontalKeypad legacy {value,type} model', function () {
-  var pressed = function pressed(key) {
-    var onClick = jest.fn();
-    var hk = new _horizontalKeypad["default"]({
-      onClick: onClick
-    });
-    hk.keypadPress(key);
-    return onClick.mock.calls[0][0];
-  };
-  it('maps a command to {value, type: command}', function () {
-    expect(pressed({
-      command: '\\frac'
-    })).toEqual({
-      value: '\\frac',
-      type: 'command'
-    });
-  });
-  it('maps a write to {value}', function () {
-    expect(pressed({
-      write: 'x'
-    })).toEqual({
-      value: 'x'
-    });
-  });
-  it('maps a keystroke to {type: cursor}', function () {
-    expect(pressed({
-      keystroke: 'Left'
-    })).toEqual({
-      type: 'cursor',
-      value: 'Left'
-    });
-  });
-  it('renders without throwing', function () {
-    expect(function () {
-      return (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_horizontalKeypad["default"], {
-        onClick: function onClick() {}
-      }));
-    }).not.toThrow();
-  });
-});
-describe('Input: controlled-value sync and events', function () {
-  var withField = function withField() {
-    var input = new _input["default"]({});
-    input.mathField = {
-      value: '',
-      getValue: function getValue() {
-        return input.mathField.value;
-      },
-      insert: function insert(v) {
-        input.mathField.value += v;
-      },
-      executeCommand: function executeCommand() {},
-      focus: function focus() {},
-      blur: function blur() {},
-      addEventListener: function addEventListener() {},
-      removeEventListener: function removeEventListener() {},
-      remove: function remove() {}
-    };
-    return input;
-  };
-  it('emits stored-form latex on edit', function () {
-    var onChange = jest.fn();
-    var input = withField();
-    input.props = {
-      onChange: onChange
-    };
-    input.mathField.value = '\\longdiv{\\placeholder{}}';
-    input.onInputEdit();
-
-    // \placeholder is MathLive-internal and must not reach the model
-    expect(onChange).toHaveBeenCalledWith('\\longdiv{}');
-    expect(input.lastEmitted).toEqual('\\longdiv{}');
-  });
-  it('does not push a prop echo back into the field', function () {
-    var input = withField();
-    input.mathField.value = 'x';
-    input.lastEmitted = 'x';
-    input.props = {
-      latex: 'x'
-    };
-    input.componentDidUpdate({
-      latex: ''
-    });
-    expect(input.mathField.value).toEqual('x');
-  });
-  it('pushes a genuinely new latex prop into the field', function () {
-    var input = withField();
-    input.mathField.value = 'x';
-    input.lastEmitted = 'x';
-    input.props = {
-      latex: 'y'
-    };
-    input.componentDidUpdate({
-      latex: 'x'
-    });
-    expect(input.mathField.value).toEqual('y');
-  });
-  it('bridges stored latex on the way in', function () {
-    var input = withField();
-    input.props = {
-      latex: '\\longdiv{5}'
-    };
-    input.componentDidUpdate({
-      latex: ''
-    });
-
-    // must become native \enclose so the content stays editable
-    expect(input.mathField.value).toEqual('\\enclose{longdiv}{5}');
-  });
-  it('toggles readOnly', function () {
-    var input = withField();
-    input.props = {
-      readOnly: true
-    };
-    input.componentDidUpdate({
-      readOnly: false
-    });
-    expect(input.mathField.readOnly).toBe(true);
-  });
-  it('clear() empties the field', function () {
-    var input = withField();
-    input.mathField.value = 'abc';
-    expect(input.clear()).toEqual('');
-    expect(input.mathField.value).toEqual('');
-  });
-  it('suppresses Enter so it cannot insert a line break', function () {
-    var input = withField();
-    var preventDefault = jest.fn();
-    input.onKeyDown({
-      key: 'Enter',
-      preventDefault: preventDefault
-    });
-    expect(preventDefault).toHaveBeenCalled();
-    preventDefault.mockClear();
-    input.onKeyDown({
-      key: 'a',
-      preventDefault: preventDefault
-    });
-    expect(preventDefault).not.toHaveBeenCalled();
-  });
-  it('componentDidUpdate is safe before the field exists', function () {
-    var input = new _input["default"]({
-      latex: 'x'
-    });
-    expect(function () {
-      return input.componentDidUpdate({
-        latex: ''
-      });
-    }).not.toThrow();
-  });
-});
-//# sourceMappingURL=composites.test.js.map

package/lib/__tests__/composites.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"composites.test.js","names":["_react","_interopRequireDefault","require","_react2","_mathInput","_horizontalKeypad","_input","describe","withInput","mi","MathInput","calls","write","keystroke","input","v","push","it","_withInput","keypadPress","latex","expect","toEqual","_withInput2","command","_withInput3","_withInput4","not","toThrow","onChange","jest","fn","changeLatex","toHaveBeenCalled","toHaveBeenCalledWith","setState","s","Object","assign","state","inputFocus","focused","toBe","inputBlur","pressed","key","onClick","hk","HorizontalKeypad","mock","value","type","render","createElement","withField","Input","mathField","getValue","insert","executeCommand","focus","blur","addEventListener","removeEventListener","remove","props","onInputEdit","lastEmitted","componentDidUpdate","readOnly","clear","preventDefault","onKeyDown","mockClear"],"sources":["../../src/__tests__/composites.test.jsx"],"sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\n\nimport MathInput from '../math-input';\nimport HorizontalKeypad from '../horizontal-keypad';\nimport Input from '../mf/input';\n\n/**\n * The pieces that sit between the keypad and the field: how a pressed key is\n * routed into the field, and the legacy `{value,type}` shape math-toolbar\n * consumes.\n */\ndescribe('MathInput.keypadPress routing', () => {\n  const withInput = () => {\n    const mi = new MathInput({});\n    const calls = { write: [], keystroke: [] };\n\n    mi.input = {\n      write: (v) => calls.write.push(v),\n      keystroke: (v) => calls.keystroke.push(v),\n    };\n\n    return { mi, calls };\n  };\n\n  it('routes an insert action to write()', () => {\n    const { mi, calls } = withInput();\n\n    mi.keypadPress({ latex: '\\\\pi' });\n\n    expect(calls.write).toEqual(['\\\\pi']);\n    expect(calls.keystroke).toEqual([]);\n  });\n\n  it('expands an argument-taking command before writing', () => {\n    const { mi, calls } = withInput();\n\n    mi.keypadPress({ command: '\\\\frac' });\n\n    expect(calls.write).toEqual(['\\\\frac{#?}{#?}']);\n  });\n\n  it('routes a cursor keystroke to keystroke()', () => {\n    const { mi, calls } = withInput();\n\n    mi.keypadPress({ keystroke: 'Left' });\n\n    expect(calls.keystroke).toEqual(['moveToPreviousChar']);\n    expect(calls.write).toEqual([]);\n  });\n\n  it('ignores keys with no action', () => {\n    const { mi, calls } = withInput();\n\n    mi.keypadPress({});\n    mi.keypadPress({ keystroke: 'Nonsense' });\n\n    expect(calls.write).toEqual([]);\n    expect(calls.keystroke).toEqual([]);\n  });\n\n  it('is a no-op before the field ref exists', () => {\n    const mi = new MathInput({});\n\n    expect(() => mi.keypadPress({ latex: '\\\\pi' })).not.toThrow();\n  });\n\n  it('changeLatex only fires onChange when the value differs', () => {\n    const onChange = jest.fn();\n    const mi = new MathInput({ latex: 'x', onChange });\n\n    mi.changeLatex('x');\n    expect(onChange).not.toHaveBeenCalled();\n\n    mi.changeLatex('y');\n    expect(onChange).toHaveBeenCalledWith('y');\n  });\n\n  it('tracks focus state', () => {\n    const mi = new MathInput({});\n\n    mi.setState = (s) => Object.assign(mi.state, s);\n    mi.inputFocus();\n    expect(mi.state.focused).toBe(true);\n\n    mi.inputBlur();\n    expect(mi.state.focused).toBe(false);\n  });\n});\n\ndescribe('HorizontalKeypad legacy {value,type} model', () => {\n  const pressed = (key) => {\n    const onClick = jest.fn();\n    const hk = new HorizontalKeypad({ onClick });\n\n    hk.keypadPress(key);\n\n    return onClick.mock.calls[0][0];\n  };\n\n  it('maps a command to {value, type: command}', () => {\n    expect(pressed({ command: '\\\\frac' })).toEqual({ value: '\\\\frac', type: 'command' });\n  });\n\n  it('maps a write to {value}', () => {\n    expect(pressed({ write: 'x' })).toEqual({ value: 'x' });\n  });\n\n  it('maps a keystroke to {type: cursor}', () => {\n    expect(pressed({ keystroke: 'Left' })).toEqual({ type: 'cursor', value: 'Left' });\n  });\n\n  it('renders without throwing', () => {\n    expect(() => render(<HorizontalKeypad onClick={() => {}} />)).not.toThrow();\n  });\n});\n\ndescribe('Input: controlled-value sync and events', () => {\n  const withField = () => {\n    const input = new Input({});\n\n    input.mathField = {\n      value: '',\n      getValue: () => input.mathField.value,\n      insert(v) {\n        input.mathField.value += v;\n      },\n      executeCommand() {},\n      focus() {},\n      blur() {},\n      addEventListener() {},\n      removeEventListener() {},\n      remove() {},\n    };\n\n    return input;\n  };\n\n  it('emits stored-form latex on edit', () => {\n    const onChange = jest.fn();\n    const input = withField();\n\n    input.props = { onChange };\n    input.mathField.value = '\\\\longdiv{\\\\placeholder{}}';\n    input.onInputEdit();\n\n    // \\placeholder is MathLive-internal and must not reach the model\n    expect(onChange).toHaveBeenCalledWith('\\\\longdiv{}');\n    expect(input.lastEmitted).toEqual('\\\\longdiv{}');\n  });\n\n  it('does not push a prop echo back into the field', () => {\n    const input = withField();\n\n    input.mathField.value = 'x';\n    input.lastEmitted = 'x';\n    input.props = { latex: 'x' };\n\n    input.componentDidUpdate({ latex: '' });\n\n    expect(input.mathField.value).toEqual('x');\n  });\n\n  it('pushes a genuinely new latex prop into the field', () => {\n    const input = withField();\n\n    input.mathField.value = 'x';\n    input.lastEmitted = 'x';\n    input.props = { latex: 'y' };\n\n    input.componentDidUpdate({ latex: 'x' });\n\n    expect(input.mathField.value).toEqual('y');\n  });\n\n  it('bridges stored latex on the way in', () => {\n    const input = withField();\n\n    input.props = { latex: '\\\\longdiv{5}' };\n    input.componentDidUpdate({ latex: '' });\n\n    // must become native \\enclose so the content stays editable\n    expect(input.mathField.value).toEqual('\\\\enclose{longdiv}{5}');\n  });\n\n  it('toggles readOnly', () => {\n    const input = withField();\n\n    input.props = { readOnly: true };\n    input.componentDidUpdate({ readOnly: false });\n\n    expect(input.mathField.readOnly).toBe(true);\n  });\n\n  it('clear() empties the field', () => {\n    const input = withField();\n\n    input.mathField.value = 'abc';\n    expect(input.clear()).toEqual('');\n    expect(input.mathField.value).toEqual('');\n  });\n\n  it('suppresses Enter so it cannot insert a line break', () => {\n    const input = withField();\n    const preventDefault = jest.fn();\n\n    input.onKeyDown({ key: 'Enter', preventDefault });\n    expect(preventDefault).toHaveBeenCalled();\n\n    preventDefault.mockClear();\n    input.onKeyDown({ key: 'a', preventDefault });\n    expect(preventDefault).not.toHaveBeenCalled();\n  });\n\n  it('componentDidUpdate is safe before the field exists', () => {\n    const input = new Input({ latex: 'x' });\n\n    expect(() => input.componentDidUpdate({ latex: '' })).not.toThrow();\n  });\n});\n"],"mappings":";;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAEA,IAAAE,UAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,iBAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,MAAA,GAAAL,sBAAA,CAAAC,OAAA;AAEA;AACA;AACA;AACA;AACA;AACAK,QAAQ,CAAC,+BAA+B,EAAE,YAAM;EAC9C,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAA,EAAS;IACtB,IAAMC,EAAE,GAAG,IAAIC,qBAAS,CAAC,CAAC,CAAC,CAAC;IAC5B,IAAMC,KAAK,GAAG;MAAEC,KAAK,EAAE,EAAE;MAAEC,SAAS,EAAE;IAAG,CAAC;IAE1CJ,EAAE,CAACK,KAAK,GAAG;MACTF,KAAK,EAAE,SAAPA,KAAKA,CAAGG,CAAC;QAAA,OAAKJ,KAAK,CAACC,KAAK,CAACI,IAAI,CAACD,CAAC,CAAC;MAAA;MACjCF,SAAS,EAAE,SAAXA,SAASA,CAAGE,CAAC;QAAA,OAAKJ,KAAK,CAACE,SAAS,CAACG,IAAI,CAACD,CAAC,CAAC;MAAA;IAC3C,CAAC;IAED,OAAO;MAAEN,EAAE,EAAFA,EAAE;MAAEE,KAAK,EAALA;IAAM,CAAC;EACtB,CAAC;EAEDM,EAAE,CAAC,oCAAoC,EAAE,YAAM;IAC7C,IAAAC,UAAA,GAAsBV,SAAS,CAAC,CAAC;MAAzBC,EAAE,GAAAS,UAAA,CAAFT,EAAE;MAAEE,KAAK,GAAAO,UAAA,CAALP,KAAK;IAEjBF,EAAE,CAACU,WAAW,CAAC;MAAEC,KAAK,EAAE;IAAO,CAAC,CAAC;IAEjCC,MAAM,CAACV,KAAK,CAACC,KAAK,CAAC,CAACU,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC;IACrCD,MAAM,CAACV,KAAK,CAACE,SAAS,CAAC,CAACS,OAAO,CAAC,EAAE,CAAC;EACrC,CAAC,CAAC;EAEFL,EAAE,CAAC,mDAAmD,EAAE,YAAM;IAC5D,IAAAM,WAAA,GAAsBf,SAAS,CAAC,CAAC;MAAzBC,EAAE,GAAAc,WAAA,CAAFd,EAAE;MAAEE,KAAK,GAAAY,WAAA,CAALZ,KAAK;IAEjBF,EAAE,CAACU,WAAW,CAAC;MAAEK,OAAO,EAAE;IAAS,CAAC,CAAC;IAErCH,MAAM,CAACV,KAAK,CAACC,KAAK,CAAC,CAACU,OAAO,CAAC,CAAC,gBAAgB,CAAC,CAAC;EACjD,CAAC,CAAC;EAEFL,EAAE,CAAC,0CAA0C,EAAE,YAAM;IACnD,IAAAQ,WAAA,GAAsBjB,SAAS,CAAC,CAAC;MAAzBC,EAAE,GAAAgB,WAAA,CAAFhB,EAAE;MAAEE,KAAK,GAAAc,WAAA,CAALd,KAAK;IAEjBF,EAAE,CAACU,WAAW,CAAC;MAAEN,SAAS,EAAE;IAAO,CAAC,CAAC;IAErCQ,MAAM,CAACV,KAAK,CAACE,SAAS,CAAC,CAACS,OAAO,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACvDD,MAAM,CAACV,KAAK,CAACC,KAAK,CAAC,CAACU,OAAO,CAAC,EAAE,CAAC;EACjC,CAAC,CAAC;EAEFL,EAAE,CAAC,6BAA6B,EAAE,YAAM;IACtC,IAAAS,WAAA,GAAsBlB,SAAS,CAAC,CAAC;MAAzBC,EAAE,GAAAiB,WAAA,CAAFjB,EAAE;MAAEE,KAAK,GAAAe,WAAA,CAALf,KAAK;IAEjBF,EAAE,CAACU,WAAW,CAAC,CAAC,CAAC,CAAC;IAClBV,EAAE,CAACU,WAAW,CAAC;MAAEN,SAAS,EAAE;IAAW,CAAC,CAAC;IAEzCQ,MAAM,CAACV,KAAK,CAACC,KAAK,CAAC,CAACU,OAAO,CAAC,EAAE,CAAC;IAC/BD,MAAM,CAACV,KAAK,CAACE,SAAS,CAAC,CAACS,OAAO,CAAC,EAAE,CAAC;EACrC,CAAC,CAAC;EAEFL,EAAE,CAAC,wCAAwC,EAAE,YAAM;IACjD,IAAMR,EAAE,GAAG,IAAIC,qBAAS,CAAC,CAAC,CAAC,CAAC;IAE5BW,MAAM,CAAC;MAAA,OAAMZ,EAAE,CAACU,WAAW,CAAC;QAAEC,KAAK,EAAE;MAAO,CAAC,CAAC;IAAA,EAAC,CAACO,GAAG,CAACC,OAAO,CAAC,CAAC;EAC/D,CAAC,CAAC;EAEFX,EAAE,CAAC,wDAAwD,EAAE,YAAM;IACjE,IAAMY,QAAQ,GAAGC,IAAI,CAACC,EAAE,CAAC,CAAC;IAC1B,IAAMtB,EAAE,GAAG,IAAIC,qBAAS,CAAC;MAAEU,KAAK,EAAE,GAAG;MAAES,QAAQ,EAARA;IAAS,CAAC,CAAC;IAElDpB,EAAE,CAACuB,WAAW,CAAC,GAAG,CAAC;IACnBX,MAAM,CAACQ,QAAQ,CAAC,CAACF,GAAG,CAACM,gBAAgB,CAAC,CAAC;IAEvCxB,EAAE,CAACuB,WAAW,CAAC,GAAG,CAAC;IACnBX,MAAM,CAACQ,QAAQ,CAAC,CAACK,oBAAoB,CAAC,GAAG,CAAC;EAC5C,CAAC,CAAC;EAEFjB,EAAE,CAAC,oBAAoB,EAAE,YAAM;IAC7B,IAAMR,EAAE,GAAG,IAAIC,qBAAS,CAAC,CAAC,CAAC,CAAC;IAE5BD,EAAE,CAAC0B,QAAQ,GAAG,UAACC,CAAC;MAAA,OAAKC,MAAM,CAACC,MAAM,CAAC7B,EAAE,CAAC8B,KAAK,EAAEH,CAAC,CAAC;IAAA;IAC/C3B,EAAE,CAAC+B,UAAU,CAAC,CAAC;IACfnB,MAAM,CAACZ,EAAE,CAAC8B,KAAK,CAACE,OAAO,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC;IAEnCjC,EAAE,CAACkC,SAAS,CAAC,CAAC;IACdtB,MAAM,CAACZ,EAAE,CAAC8B,KAAK,CAACE,OAAO,CAAC,CAACC,IAAI,CAAC,KAAK,CAAC;EACtC,CAAC,CAAC;AACJ,CAAC,CAAC;AAEFnC,QAAQ,CAAC,4CAA4C,EAAE,YAAM;EAC3D,IAAMqC,OAAO,GAAG,SAAVA,OAAOA,CAAIC,GAAG,EAAK;IACvB,IAAMC,OAAO,GAAGhB,IAAI,CAACC,EAAE,CAAC,CAAC;IACzB,IAAMgB,EAAE,GAAG,IAAIC,4BAAgB,CAAC;MAAEF,OAAO,EAAPA;IAAQ,CAAC,CAAC;IAE5CC,EAAE,CAAC5B,WAAW,CAAC0B,GAAG,CAAC;IAEnB,OAAOC,OAAO,CAACG,IAAI,CAACtC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;EACjC,CAAC;EAEDM,EAAE,CAAC,0CAA0C,EAAE,YAAM;IACnDI,MAAM,CAACuB,OAAO,CAAC;MAAEpB,OAAO,EAAE;IAAS,CAAC,CAAC,CAAC,CAACF,OAAO,CAAC;MAAE4B,KAAK,EAAE,QAAQ;MAAEC,IAAI,EAAE;IAAU,CAAC,CAAC;EACtF,CAAC,CAAC;EAEFlC,EAAE,CAAC,yBAAyB,EAAE,YAAM;IAClCI,MAAM,CAACuB,OAAO,CAAC;MAAEhC,KAAK,EAAE;IAAI,CAAC,CAAC,CAAC,CAACU,OAAO,CAAC;MAAE4B,KAAK,EAAE;IAAI,CAAC,CAAC;EACzD,CAAC,CAAC;EAEFjC,EAAE,CAAC,oCAAoC,EAAE,YAAM;IAC7CI,MAAM,CAACuB,OAAO,CAAC;MAAE/B,SAAS,EAAE;IAAO,CAAC,CAAC,CAAC,CAACS,OAAO,CAAC;MAAE6B,IAAI,EAAE,QAAQ;MAAED,KAAK,EAAE;IAAO,CAAC,CAAC;EACnF,CAAC,CAAC;EAEFjC,EAAE,CAAC,0BAA0B,EAAE,YAAM;IACnCI,MAAM,CAAC;MAAA,OAAM,IAAA+B,cAAM,eAACpD,MAAA,YAAAqD,aAAA,CAAChD,iBAAA,WAAgB;QAACyC,OAAO,EAAE,SAATA,OAAOA,CAAA,EAAQ,CAAC;MAAE,CAAE,CAAC,CAAC;IAAA,EAAC,CAACnB,GAAG,CAACC,OAAO,CAAC,CAAC;EAC7E,CAAC,CAAC;AACJ,CAAC,CAAC;AAEFrB,QAAQ,CAAC,yCAAyC,EAAE,YAAM;EACxD,IAAM+C,SAAS,GAAG,SAAZA,SAASA,CAAA,EAAS;IACtB,IAAMxC,KAAK,GAAG,IAAIyC,iBAAK,CAAC,CAAC,CAAC,CAAC;IAE3BzC,KAAK,CAAC0C,SAAS,GAAG;MAChBN,KAAK,EAAE,EAAE;MACTO,QAAQ,EAAE,SAAVA,QAAQA,CAAA;QAAA,OAAQ3C,KAAK,CAAC0C,SAAS,CAACN,KAAK;MAAA;MACrCQ,MAAM,WAANA,MAAMA,CAAC3C,CAAC,EAAE;QACRD,KAAK,CAAC0C,SAAS,CAACN,KAAK,IAAInC,CAAC;MAC5B,CAAC;MACD4C,cAAc,WAAdA,cAAcA,CAAA,EAAG,CAAC,CAAC;MACnBC,KAAK,WAALA,KAAKA,CAAA,EAAG,CAAC,CAAC;MACVC,IAAI,WAAJA,IAAIA,CAAA,EAAG,CAAC,CAAC;MACTC,gBAAgB,WAAhBA,gBAAgBA,CAAA,EAAG,CAAC,CAAC;MACrBC,mBAAmB,WAAnBA,mBAAmBA,CAAA,EAAG,CAAC,CAAC;MACxBC,MAAM,WAANA,MAAMA,CAAA,EAAG,CAAC;IACZ,CAAC;IAED,OAAOlD,KAAK;EACd,CAAC;EAEDG,EAAE,CAAC,iCAAiC,EAAE,YAAM;IAC1C,IAAMY,QAAQ,GAAGC,IAAI,CAACC,EAAE,CAAC,CAAC;IAC1B,IAAMjB,KAAK,GAAGwC,SAAS,CAAC,CAAC;IAEzBxC,KAAK,CAACmD,KAAK,GAAG;MAAEpC,QAAQ,EAARA;IAAS,CAAC;IAC1Bf,KAAK,CAAC0C,SAAS,CAACN,KAAK,GAAG,4BAA4B;IACpDpC,KAAK,CAACoD,WAAW,CAAC,CAAC;;IAEnB;IACA7C,MAAM,CAACQ,QAAQ,CAAC,CAACK,oBAAoB,CAAC,aAAa,CAAC;IACpDb,MAAM,CAACP,KAAK,CAACqD,WAAW,CAAC,CAAC7C,OAAO,CAAC,aAAa,CAAC;EAClD,CAAC,CAAC;EAEFL,EAAE,CAAC,+CAA+C,EAAE,YAAM;IACxD,IAAMH,KAAK,GAAGwC,SAAS,CAAC,CAAC;IAEzBxC,KAAK,CAAC0C,SAAS,CAACN,KAAK,GAAG,GAAG;IAC3BpC,KAAK,CAACqD,WAAW,GAAG,GAAG;IACvBrD,KAAK,CAACmD,KAAK,GAAG;MAAE7C,KAAK,EAAE;IAAI,CAAC;IAE5BN,KAAK,CAACsD,kBAAkB,CAAC;MAAEhD,KAAK,EAAE;IAAG,CAAC,CAAC;IAEvCC,MAAM,CAACP,KAAK,CAAC0C,SAAS,CAACN,KAAK,CAAC,CAAC5B,OAAO,CAAC,GAAG,CAAC;EAC5C,CAAC,CAAC;EAEFL,EAAE,CAAC,kDAAkD,EAAE,YAAM;IAC3D,IAAMH,KAAK,GAAGwC,SAAS,CAAC,CAAC;IAEzBxC,KAAK,CAAC0C,SAAS,CAACN,KAAK,GAAG,GAAG;IAC3BpC,KAAK,CAACqD,WAAW,GAAG,GAAG;IACvBrD,KAAK,CAACmD,KAAK,GAAG;MAAE7C,KAAK,EAAE;IAAI,CAAC;IAE5BN,KAAK,CAACsD,kBAAkB,CAAC;MAAEhD,KAAK,EAAE;IAAI,CAAC,CAAC;IAExCC,MAAM,CAACP,KAAK,CAAC0C,SAAS,CAACN,KAAK,CAAC,CAAC5B,OAAO,CAAC,GAAG,CAAC;EAC5C,CAAC,CAAC;EAEFL,EAAE,CAAC,oCAAoC,EAAE,YAAM;IAC7C,IAAMH,KAAK,GAAGwC,SAAS,CAAC,CAAC;IAEzBxC,KAAK,CAACmD,KAAK,GAAG;MAAE7C,KAAK,EAAE;IAAe,CAAC;IACvCN,KAAK,CAACsD,kBAAkB,CAAC;MAAEhD,KAAK,EAAE;IAAG,CAAC,CAAC;;IAEvC;IACAC,MAAM,CAACP,KAAK,CAAC0C,SAAS,CAACN,KAAK,CAAC,CAAC5B,OAAO,CAAC,uBAAuB,CAAC;EAChE,CAAC,CAAC;EAEFL,EAAE,CAAC,kBAAkB,EAAE,YAAM;IAC3B,IAAMH,KAAK,GAAGwC,SAAS,CAAC,CAAC;IAEzBxC,KAAK,CAACmD,KAAK,GAAG;MAAEI,QAAQ,EAAE;IAAK,CAAC;IAChCvD,KAAK,CAACsD,kBAAkB,CAAC;MAAEC,QAAQ,EAAE;IAAM,CAAC,CAAC;IAE7ChD,MAAM,CAACP,KAAK,CAAC0C,SAAS,CAACa,QAAQ,CAAC,CAAC3B,IAAI,CAAC,IAAI,CAAC;EAC7C,CAAC,CAAC;EAEFzB,EAAE,CAAC,2BAA2B,EAAE,YAAM;IACpC,IAAMH,KAAK,GAAGwC,SAAS,CAAC,CAAC;IAEzBxC,KAAK,CAAC0C,SAAS,CAACN,KAAK,GAAG,KAAK;IAC7B7B,MAAM,CAACP,KAAK,CAACwD,KAAK,CAAC,CAAC,CAAC,CAAChD,OAAO,CAAC,EAAE,CAAC;IACjCD,MAAM,CAACP,KAAK,CAAC0C,SAAS,CAACN,KAAK,CAAC,CAAC5B,OAAO,CAAC,EAAE,CAAC;EAC3C,CAAC,CAAC;EAEFL,EAAE,CAAC,mDAAmD,EAAE,YAAM;IAC5D,IAAMH,KAAK,GAAGwC,SAAS,CAAC,CAAC;IACzB,IAAMiB,cAAc,GAAGzC,IAAI,CAACC,EAAE,CAAC,CAAC;IAEhCjB,KAAK,CAAC0D,SAAS,CAAC;MAAE3B,GAAG,EAAE,OAAO;MAAE0B,cAAc,EAAdA;IAAe,CAAC,CAAC;IACjDlD,MAAM,CAACkD,cAAc,CAAC,CAACtC,gBAAgB,CAAC,CAAC;IAEzCsC,cAAc,CAACE,SAAS,CAAC,CAAC;IAC1B3D,KAAK,CAAC0D,SAAS,CAAC;MAAE3B,GAAG,EAAE,GAAG;MAAE0B,cAAc,EAAdA;IAAe,CAAC,CAAC;IAC7ClD,MAAM,CAACkD,cAAc,CAAC,CAAC5C,GAAG,CAACM,gBAAgB,CAAC,CAAC;EAC/C,CAAC,CAAC;EAEFhB,EAAE,CAAC,oDAAoD,EAAE,YAAM;IAC7D,IAAMH,KAAK,GAAG,IAAIyC,iBAAK,CAAC;MAAEnC,KAAK,EAAE;IAAI,CAAC,CAAC;IAEvCC,MAAM,CAAC;MAAA,OAAMP,KAAK,CAACsD,kBAAkB,CAAC;QAAEhD,KAAK,EAAE;MAAG,CAAC,CAAC;IAAA,EAAC,CAACO,GAAG,CAACC,OAAO,CAAC,CAAC;EACrE,CAAC,CAAC;AACJ,CAAC,CAAC","ignoreList":[]}