temml 0.9.1

package/src/mathMLTree.js

@@ -0,0 +1,175 @@
+//
+/**
+ * These objects store data about MathML nodes.
+ * The `toNode` and `toMarkup` functions  create namespaced DOM nodes and
+ * HTML text markup respectively.
+ */
+
+import utils from "./utils";
+import { DocumentFragment } from "./tree";
+import { createClass } from "./domTree";
+
+export function newDocumentFragment(children) {
+  return new DocumentFragment(children);
+}
+
+/**
+ * This node represents a general purpose MathML node of any type,
+ * for example, `"mo"` or `"mspace"`, corresponding to `<mo>` and
+ * `<mspace>` tags).
+ */
+export class MathNode {
+  constructor(type, children, classes, style) {
+    this.type = type;
+    this.attributes = {};
+    this.children = children || [];
+    this.classes = classes || [];
+    this.style = style || {};   // Used for <mstyle> elements
+  }
+
+  /**
+   * Sets an attribute on a MathML node. MathML depends on attributes to convey a
+   * semantic content, so this is used heavily.
+   */
+  setAttribute(name, value) {
+    this.attributes[name] = value;
+  }
+
+  /**
+   * Gets an attribute on a MathML node.
+   */
+  getAttribute(name) {
+    return this.attributes[name];
+  }
+
+  /**
+   * Converts the math node into a MathML-namespaced DOM element.
+   */
+  toNode() {
+    const node = document.createElementNS("http://www.w3.org/1998/Math/MathML", this.type);
+
+    for (const attr in this.attributes) {
+      if (Object.prototype.hasOwnProperty.call(this.attributes, attr)) {
+        node.setAttribute(attr, this.attributes[attr]);
+      }
+    }
+
+    if (this.classes.length > 0) {
+      node.className = createClass(this.classes);
+    }
+
+    // Apply inline styles
+    for (const style in this.style) {
+      if (Object.prototype.hasOwnProperty.call(this.style, style )) {
+        node.style[style] = this.style[style];
+      }
+    }
+
+    for (let i = 0; i < this.children.length; i++) {
+      node.appendChild(this.children[i].toNode());
+    }
+
+    return node;
+  }
+
+  /**
+   * Converts the math node into an HTML markup string.
+   */
+  toMarkup() {
+    let markup = "<" + this.type;
+
+    // Add the attributes
+    for (const attr in this.attributes) {
+      if (Object.prototype.hasOwnProperty.call(this.attributes, attr)) {
+        markup += " " + attr + '="';
+        markup += utils.escape(this.attributes[attr]);
+        markup += '"';
+      }
+    }
+
+    if (this.classes.length > 0) {
+      markup += ` class="${utils.escape(createClass(this.classes))}"`;
+    }
+
+    let styles = "";
+
+    // Add the styles, after hyphenation
+    for (const style in this.style) {
+      if (Object.prototype.hasOwnProperty.call(this.style, style )) {
+        styles += `${utils.hyphenate(style)}:${this.style[style]};`;
+      }
+    }
+
+    if (styles) {
+      markup += ` style="${styles}"`;
+    }
+
+    markup += ">";
+
+    for (let i = 0; i < this.children.length; i++) {
+      markup += this.children[i].toMarkup();
+    }
+
+    markup += "</" + this.type + ">";
+
+    return markup;
+  }
+
+  /**
+   * Converts the math node into a string, similar to innerText, but escaped.
+   */
+  toText() {
+    return this.children.map((child) => child.toText()).join("");
+  }
+}
+
+/**
+ * This node represents a piece of text.
+ */
+export class TextNode {
+  constructor(text) {
+    this.text = text;
+  }
+
+  /**
+   * Converts the text node into a DOM text node.
+   */
+  toNode() {
+    return document.createTextNode(this.text);
+  }
+
+  /**
+   * Converts the text node into escaped HTML markup
+   * (representing the text itself).
+   */
+  toMarkup() {
+    return utils.escape(this.toText());
+  }
+
+  /**
+   * Converts the text node into a string
+   * (representing the text iteself).
+   */
+  toText() {
+    return this.text;
+  }
+}
+
+// Do not make an <mrow> the only child of a <mstyle>.
+// An <mstyle> acts as its own implicit <mrow>.
+export const wrapWithMstyle = expression => {
+  let node
+  if (expression.length === 1 && expression[0].type === "mrow") {
+    node = expression.pop()
+    node.type = "mstyle"
+  } else {
+    node = new MathNode("mstyle", expression);
+  }
+  return node
+}
+
+export default {
+  MathNode,
+  TextNode,
+  newDocumentFragment
+};

package/src/parseNode.js

@@ -0,0 +1,42 @@
+import { NON_ATOMS } from "./symbols";
+
+/**
+ * Asserts that the node is of the given type and returns it with stricter
+ * typing. Throws if the node's type does not match.
+ */
+export function assertNodeType(node, type) {
+  if (!node || node.type !== type) {
+    throw new Error(
+      `Expected node of type ${type}, but got ` +
+        (node ? `node of type ${node.type}` : String(node))
+    );
+  }
+  return node;
+}
+
+/**
+ * Returns the node more strictly typed iff it is of the given type. Otherwise,
+ * returns null.
+ */
+export function assertSymbolNodeType(node) {
+  const typedNode = checkSymbolNodeType(node);
+  if (!typedNode) {
+    throw new Error(
+      `Expected node of symbol group type, but got ` +
+        (node ? `node of type ${node.type}` : String(node))
+    );
+  }
+  return typedNode;
+}
+
+/**
+ * Returns the node more strictly typed iff it is of the given type. Otherwise,
+ * returns null.
+ */
+export function checkSymbolNodeType(node) {
+  if (node && (node.type === "atom" ||
+      Object.prototype.hasOwnProperty.call(NON_ATOMS, node.type))) {
+    return node;
+  }
+  return null;
+}

package/src/parseTree.js

@@ -0,0 +1,40 @@
+import Parser from "./Parser"
+import ParseError from "./ParseError"
+
+/**
+ * Parses an expression using a Parser, then returns the parsed result.
+ */
+const parseTree = function(toParse, settings) {
+  if (!(typeof toParse === "string" || toParse instanceof String)) {
+    throw new TypeError("Temml can only parse string typed expression")
+  }
+  const parser = new Parser(toParse, settings)
+  // Blank out any \df@tag to avoid spurious "Duplicate \tag" errors
+  delete parser.gullet.macros.current["\\df@tag"]
+
+  let tree = parser.parse()
+
+  // LaTeX ignores a \tag placed outside an AMS environment.
+  if (!(tree.length > 0 &&  tree[0].type && tree[0].type === "array" && tree[0].addEqnNum)) {
+    // If the input used \tag, it will set the \df@tag macro to the tag.
+    // In this case, we separately parse the tag and wrap the tree.
+    if (parser.gullet.macros.get("\\df@tag")) {
+      if (!settings.displayMode) {
+        throw new ParseError("\\tag works only in display mode")
+      }
+      parser.gullet.feed("\\df@tag")
+      tree = [
+        {
+          type: "tag",
+          mode: "text",
+          body: tree,
+          tag: parser.parse()
+        }
+      ]
+    }
+  }
+
+  return tree
+}
+
+export default parseTree

package/src/postProcess.js

@@ -0,0 +1,57 @@
+/* Temml Post Process
+ * Perform two tasks not done by Temml when it created each individual Temml <math> element.
+ * Given a block,
+ *   1. At each AMS auto-numbered environment, assign an id.
+ *   2. Populate the text contents of each \ref & \eqref
+ *
+ * As with other Temml code, this file is released under terms of the MIT license.
+ * https://mit-license.org/
+ */
+
+export const version = "0.9.1";
+
+export function postProcess(block) {
+  const labelMap = {}
+  let i = 0
+
+  // Get a collection of the parents of each \tag & auto-numbered equation
+  const parents = block.getElementsByClassName("tml-tageqn");
+  for (const parent of parents) {
+    const eqns = parent.getElementsByClassName("tml-eqn")
+    if (eqns. length > 0 ) {
+      // AMS automatically numbered equation.
+      // Assign an id.
+      i += 1;
+      eqns[0].id = "tml-eqn-" + i
+      // No need to write a number into the text content of the element.
+      // A CSS counter does that even if this postProcess() function is not used.
+    }
+    // If there is a \label, add it to labelMap
+    const labels = parent.getElementsByClassName("tml-label")
+    if (labels.length === 0) { continue }
+    if (eqns.length > 0) {
+      labelMap[labels[0].id] = String(i)
+    } else {
+      const tags = parent.getElementsByClassName("tml-tag")
+      if (tags.length > 0) {
+        labelMap[labels[0].id] = tags[0].textContent
+      }
+    }
+  }
+
+  // Populate \ref & \eqref text content
+  const refs = block.getElementsByClassName("tml-ref");
+  [...refs].forEach(ref => {
+    let str = labelMap[ref.getAttribute("href").slice(1)];
+    if (ref.className.indexOf("tml-eqref") === -1) {
+      // \ref. Omit parens.
+      str = str.replace(/^\(/, "")
+      str = str.replace(/\($/, "")
+    }  {
+      // \eqref. Include parens
+      if (str.charAt(0) !== "(") { str = "(" + str }
+      if (str.slice(-1) !== ")") { str =  str + ")" }
+    }
+    ref.textContent = str
+  })
+}

package/src/replace.js

@@ -0,0 +1,225 @@
+// Chromium does not support the MathML `mathvariant` attribute.
+// Instead, we replace ASCII characters with Unicode characters that
+// are defined in the font as bold, italic, double-struck, etc.
+// This module identifies those Unicode code points.
+
+// First, a few helpers.
+const script = Object.freeze({
+  B: 0x20EA, // Offset from ASCII B to Unicode script B
+  E: 0x20EB,
+  F: 0x20EB,
+  H: 0x20C3,
+  I: 0x20C7,
+  L: 0x20C6,
+  M: 0x20E6,
+  R: 0x20C9,
+  e: 0x20CA,
+  g: 0x20A3,
+  o: 0x20C5
+})
+
+const frak = Object.freeze({
+  C: 0x20EA,
+  H: 0x20C4,
+  I: 0x20C8,
+  R: 0x20CA,
+  Z: 0x20CE
+})
+
+const bbb = Object.freeze({
+  C: 0x20BF, // blackboard bold
+  H: 0x20C5,
+  N: 0x20C7,
+  P: 0x20C9,
+  Q: 0x20C9,
+  R: 0x20CB,
+  Z: 0x20CA
+})
+
+const bold = Object.freeze({
+  "\u03f5": 0x1D2E7, // lunate epsilon
+  "\u03d1": 0x1D30C, // vartheta
+  "\u03f0": 0x1D2EE, // varkappa
+  "\u03c6": 0x1D319, // varphi
+  "\u03f1": 0x1D2EF, // varrho
+  "\u03d6": 0x1D30B  // varpi
+})
+
+const boldItalic = Object.freeze({
+  "\u03f5": 0x1D35B, // lunate epsilon
+  "\u03d1": 0x1D380, // vartheta
+  "\u03f0": 0x1D362, // varkappa
+  "\u03c6": 0x1D38D, // varphi
+  "\u03f1": 0x1D363, // varrho
+  "\u03d6": 0x1D37F  // varpi
+})
+
+const boldsf = Object.freeze({
+  "\u03f5": 0x1D395, // lunate epsilon
+  "\u03d1": 0x1D3BA, // vartheta
+  "\u03f0": 0x1D39C, // varkappa
+  "\u03c6": 0x1D3C7, // varphi
+  "\u03f1": 0x1D39D, // varrho
+  "\u03d6": 0x1D3B9  // varpi
+})
+
+const bisf = Object.freeze({
+  "\u03f5": 0x1D3CF, // lunate epsilon
+  "\u03d1": 0x1D3F4, // vartheta
+  "\u03f0": 0x1D3D6, // varkappa
+  "\u03c6": 0x1D401, // varphi
+  "\u03f1": 0x1D3D7, // varrho
+  "\u03d6": 0x1D3F3  // varpi
+})
+
+// Code point offsets below are derived from https://www.unicode.org/charts/PDF/U1D400.pdf
+const offset = Object.freeze({
+  upperCaseLatin: { // A-Z
+    "normal": ch =>                 { return 0 },
+    "bold": ch =>                   { return 0x1D3BF },
+    "italic": ch =>                 { return 0x1D3F3 },
+    "bold-italic": ch =>            { return 0x1D427 },
+    "script": ch =>                 { return script[ch] || 0x1D45B },
+    "script-bold": ch =>            { return 0x1D48F },
+    "fraktur": ch =>                { return frak[ch] || 0x1D4C3 },
+    "fraktur-bold": ch =>           { return 0x1D52B },
+    "double-struck": ch =>          { return bbb[ch] || 0x1D4F7 },
+    "sans-serif": ch =>             { return 0x1D55F },
+    "sans-serif-bold": ch =>        { return 0x1D593 },
+    "sans-serif-italic": ch =>      { return 0x1D5C7 },
+    "sans-serif-bold-italic": ch => { return 0x1D63C },
+    "monospace": ch =>              { return 0x1D62F }
+  },
+  lowerCaseLatin: { // a-z
+    "normal": ch =>                 { return 0 },
+    "bold": ch =>                   { return 0x1D3B9 },
+    "italic": ch =>                 { return ch === "h" ? 0x20A6 : 0x1D3ED },
+    "bold-italic": ch =>            { return 0x1D421 },
+    "script": ch =>                 { return script[ch] || 0x1D455 },
+    "script-bold": ch =>            { return 0x1D489 },
+    "fraktur": ch =>                { return 0x1D4BD },
+    "fraktur-bold": ch =>           { return 0x1D525 },
+    "double-struck": ch =>          { return 0x1D4F1 },
+    "sans-serif": ch =>             { return 0x1D559 },
+    "sans-serif-bold": ch =>        { return 0x1D58D },
+    "sans-serif-italic": ch =>      { return 0x1D5C1 },
+    "sans-serif-bold-italic": ch => { return 0x1D5F5 },
+    "monospace": ch =>              { return 0x1D629 }
+  },
+  upperCaseGreek: { // A-Ω ∇
+    "normal": ch =>                 { return 0 },
+    "bold": ch =>                   { return ch === "∇" ? 0x1B4BA : 0x1D317 },
+    "italic": ch =>                 { return ch === "∇" ? 0x1B4F4 : 0x1D351 },
+    // \boldsymbol actually returns upright bold for upperCaseGreek
+    "bold-italic": ch =>            { return ch === "∇" ? 0x1B4BA : 0x1D317 },
+    "script": ch =>                 { return 0 },
+    "script-bold": ch =>            { return 0 },
+    "fraktur": ch =>                { return 0 },
+    "fraktur-bold": ch =>           { return 0 },
+    "double-struck": ch =>          { return 0 },
+    // Unicode has no code points for regular-weight san-serif Greek. Use bold.
+    "sans-serif": ch =>             { return ch === "∇" ? 0x1B568 : 0x1D3C5 },
+    "sans-serif-bold": ch =>        { return ch === "∇" ? 0x1B568 : 0x1D3C5 },
+    "sans-serif-italic": ch =>      { return 0 },
+    "sans-serif-bold-italic": ch => { return ch === "∇" ? 0x1B5A2 : 0x1D3FF },
+    "monospace": ch =>              { return 0 }
+  },
+  lowerCaseGreek: { // α-ω
+    "normal": ch =>                 { return 0 },
+    "bold": ch =>                   { return 0x1D311 },
+    "italic": ch =>                 { return 0x1D34B },
+    "bold-italic": ch =>            { return ch === "\u03d5" ? 0x1D37E : 0x1D385 },
+    "script": ch =>                 { return 0 },
+    "script-bold": ch =>            { return 0 },
+    "fraktur": ch =>                { return 0 },
+    "fraktur-bold": ch =>           { return 0 },
+    "double-struck": ch =>          { return 0 },
+    // Unicode has no code points for regular-weight san-serif Greek. Use bold.
+    "sans-serif": ch =>             { return 0x1D3BF },
+    "sans-serif-bold": ch =>        { return 0x1D3BF },
+    "sans-serif-italic": ch =>      { return 0 },
+    "sans-serif-bold-italic": ch => { return 0x1D3F9 },
+    "monospace": ch =>              { return 0 }
+  },
+  varGreek: { // \varGamma, etc
+    "normal": ch =>                 { return 0 },
+    "bold": ch =>                   { return  bold[ch] || -51 },
+    "italic": ch =>                 { return 0 },
+    "bold-italic": ch =>            { return boldItalic[ch] || 0x3A },
+    "script": ch =>                 { return 0 },
+    "script-bold": ch =>            { return 0 },
+    "fraktur": ch =>                { return 0 },
+    "fraktur-bold": ch =>           { return 0 },
+    "double-struck": ch =>          { return 0 },
+    "sans-serif": ch =>             { return boldsf[ch] || 0x74 },
+    "sans-serif-bold": ch =>        { return boldsf[ch] || 0x74 },
+    "sans-serif-italic": ch =>      { return 0 },
+    "sans-serif-bold-italic": ch => { return bisf[ch] || 0xAE },
+    "monospace": ch =>              { return 0 }
+  },
+  numeral: { // 0-9
+    "normal": ch =>                 { return 0 },
+    "bold": ch =>                   { return 0x1D79E },
+    "italic": ch =>                 { return 0 },
+    "bold-italic": ch =>            { return 0 },
+    "script": ch =>                 { return 0 },
+    "script-bold": ch =>            { return 0 },
+    "fraktur": ch =>                { return 0 },
+    "fraktur-bold": ch =>           { return 0 },
+    "double-struck": ch =>          { return 0x1D7A8 },
+    "sans-serif": ch =>             { return 0x1D7B2 },
+    "sans-serif-bold": ch =>        { return 0x1D7BC },
+    "sans-serif-italic": ch =>      { return 0 },
+    "sans-serif-bold-italic": ch => { return 0 },
+    "monospace": ch =>              { return 0x1D7C6 }
+  }
+})
+
+export const variantChar = (ch, variant) => {
+  const codePoint = ch.codePointAt(0)
+  const block = 0x40 < codePoint && codePoint < 0x5b
+    ? "upperCaseLatin"
+    : 0x60 < codePoint && codePoint < 0x7b
+    ? "lowerCaseLatin"
+    : (0x390  < codePoint && codePoint < 0x3AA) || ch === "∇"
+    ? "upperCaseGreek"
+    : 0x3B0 < codePoint && codePoint < 0x3CA || ch === "\u03d5"
+    ? "lowerCaseGreek"
+    : 0x1D6E1 < codePoint && codePoint < 0x1D6FC  || bold[ch]
+    ? "varGreek"
+    : (0x2F < codePoint && codePoint <  0x3A)
+    ? "numeral"
+    : "other"
+  return block === "other"
+    ? ch
+    : String.fromCodePoint(codePoint + offset[block][variant](ch))
+}
+
+export const smallCaps = Object.freeze({
+  a: "ᴀ",
+  b: "ʙ",
+  c: "ᴄ",
+  d: "ᴅ",
+  e: "ᴇ",
+  f: "ꜰ",
+  g: "ɢ",
+  h: "ʜ",
+  i: "ɪ",
+  j: "ᴊ",
+  k: "ᴋ",
+  l: "ʟ",
+  m: "ᴍ",
+  n: "ɴ",
+  o: "ᴏ",
+  p: "ᴘ",
+  q: "ǫ",
+  r: "ʀ",
+  s: "s",
+  t: "ᴛ",
+  u: "ᴜ",
+  v: "ᴠ",
+  w: "ᴡ",
+  x: "x",
+  y: "ʏ",
+  z: "ᴢ"
+})

package/src/stretchy.js

@@ -0,0 +1,66 @@
+/**
+ * This file provides support for building horizontal stretchy elements.
+ */
+
+import mathMLTree from "./mathMLTree"
+
+const stretchyCodePoint = {
+  widehat: "^",
+  widecheck: "ˇ",
+  widetilde: "~",
+  wideparen: "⏜", // \u23dc
+  utilde: "~",
+  overleftarrow: "\u2190",
+  underleftarrow: "\u2190",
+  xleftarrow: "\u2190",
+  overrightarrow: "\u2192",
+  underrightarrow: "\u2192",
+  xrightarrow: "\u2192",
+  underbrace: "\u23df",
+  overbrace: "\u23de",
+  overgroup: "\u23e0",
+  overparen: "⏜",
+  undergroup: "\u23e1",
+  underparen: "\u23dd",
+  overleftrightarrow: "\u2194",
+  underleftrightarrow: "\u2194",
+  xleftrightarrow: "\u2194",
+  Overrightarrow: "\u21d2",
+  xRightarrow: "\u21d2",
+  overleftharpoon: "\u21bc",
+  xleftharpoonup: "\u21bc",
+  overrightharpoon: "\u21c0",
+  xrightharpoonup: "\u21c0",
+  xLeftarrow: "\u21d0",
+  xLeftrightarrow: "\u21d4",
+  xhookleftarrow: "\u21a9",
+  xhookrightarrow: "\u21aa",
+  xmapsto: "\u21a6",
+  xrightharpoondown: "\u21c1",
+  xleftharpoondown: "\u21bd",
+  xtwoheadleftarrow: "\u219e",
+  xtwoheadrightarrow: "\u21a0",
+  xlongequal: "=",
+  xrightleftarrows: "\u21c4",
+  yields: "\u2192",
+  yieldsLeft: "\u2190",
+  mesomerism: "\u2194",
+  longrightharpoonup: "\u21c0",
+  longleftharpoondown: "\u21bd",
+  eqrightharpoonup: "\u21c0",
+  eqleftharpoondown: "\u21bd",
+  "\\cdrightarrow": "\u2192",
+  "\\cdleftarrow": "\u2190",
+  "\\cdlongequal": "="
+}
+
+const mathMLnode = function(label) {
+  const child = new mathMLTree.TextNode(stretchyCodePoint[label.slice(1)])
+  const node = new mathMLTree.MathNode("mo", [child])
+  node.setAttribute("stretchy", "true")
+  return node
+}
+
+export default {
+  mathMLnode
+}