temml 0.10.13 → 0.10.15

package/dist/temml.mjs

@@ -971,6 +971,10 @@ defineSymbol(math, mathord, "\u21af", "\\lightning", true);
 defineSymbol(math, mathord, "\u220E", "\\QED", true);
 defineSymbol(math, mathord, "\u2030", "\\permil", true);
 defineSymbol(text, textord, "\u2030", "\\permil");
+defineSymbol(math, mathord, "\u2609", "\\astrosun", true);
+defineSymbol(math, mathord, "\u263c", "\\sun", true);
+defineSymbol(math, mathord, "\u263e", "\\leftmoon", true);
+defineSymbol(math, mathord, "\u263d", "\\rightmoon", true);
 
 // AMS Negated Binary Relations
 defineSymbol(math, rel, "\u226e", "\\nless", true);
@@ -1115,6 +1119,7 @@ defineSymbol(math, rel, "\u2ab7", "\\precapprox", true);
 defineSymbol(math, rel, "\u22b2", "\\vartriangleleft");
 defineSymbol(math, rel, "\u22b4", "\\trianglelefteq");
 defineSymbol(math, rel, "\u22a8", "\\vDash", true);
+defineSymbol(math, rel, "\u22ab", "\\VDash", true);
 defineSymbol(math, rel, "\u22aa", "\\Vvdash", true);
 defineSymbol(math, rel, "\u2323", "\\smallsmile");
 defineSymbol(math, rel, "\u2322", "\\smallfrown");
@@ -1764,13 +1769,16 @@ for (let i = 0; i < 10; i++) {
  * much of this module.
  */
 
+const openDelims = "([{⌊⌈⟨⟮⎰⟦⦃";
+const closeDelims = ")]}⌋⌉⟩⟯⎱⟦⦄";
+
 function setLineBreaks(expression, wrapMode, isDisplayMode) {
   const mtrs = [];
   let mrows = [];
   let block = [];
   let numTopLevelEquals = 0;
-  let canBeBIN = false; // The first node cannot be an infix binary operator.
   let i = 0;
+  let level = 0;
   while (i < expression.length) {
     while (expression[i] instanceof DocumentFragment) {
       expression.splice(i, 1, ...expression[i].children); // Expand the fragment.
@@ -1793,7 +1801,12 @@ function setLineBreaks(expression, wrapMode, isDisplayMode) {
     }
     block.push(node);
     if (node.type && node.type === "mo" && node.children.length === 1) {
-      if (wrapMode === "=" && node.children[0].text === "=") {
+      const ch = node.children[0].text;
+      if (openDelims.indexOf(ch) > -1) {
+        level += 1;
+      } else if (closeDelims.indexOf(ch) > -1) {
+        level -= 1;
+      } else if (level === 0 && wrapMode === "=" && ch === "=") {
         numTopLevelEquals += 1;
         if (numTopLevelEquals > 1) {
           block.pop();
@@ -1802,59 +1815,48 @@ function setLineBreaks(expression, wrapMode, isDisplayMode) {
           mrows.push(element);
           block = [node];
         }
-      } else if (wrapMode === "tex") {
-        // This may be a place for a soft line break.
-        if (canBeBIN && !node.attributes.form) {
-          // Check if the following node is a \nobreak text node, e.g. "~""
-          const next = i < expression.length - 1 ? expression[i + 1] : null;
-          let glueIsFreeOfNobreak = true;
-          if (
-            !(
-              next &&
-              next.type === "mtext" &&
-              next.attributes.linebreak &&
-              next.attributes.linebreak === "nobreak"
-            )
-          ) {
-            // We may need to start a new block.
-            // First, put any post-operator glue on same line as operator.
-            for (let j = i + 1; j < expression.length; j++) {
-              const nd = expression[j];
+      } else if (level === 0 && wrapMode === "tex") {
+        // Check if the following node is a \nobreak text node, e.g. "~""
+        const next = i < expression.length - 1 ? expression[i + 1] : null;
+        let glueIsFreeOfNobreak = true;
+        if (
+          !(
+            next &&
+            next.type === "mtext" &&
+            next.attributes.linebreak &&
+            next.attributes.linebreak === "nobreak"
+          )
+        ) {
+          // We may need to start a new block.
+          // First, put any post-operator glue on same line as operator.
+          for (let j = i + 1; j < expression.length; j++) {
+            const nd = expression[j];
+            if (
+              nd.type &&
+              nd.type === "mspace" &&
+              !(nd.attributes.linebreak && nd.attributes.linebreak === "newline")
+            ) {
+              block.push(nd);
+              i += 1;
               if (
-                nd.type &&
-                nd.type === "mspace" &&
-                !(nd.attributes.linebreak && nd.attributes.linebreak === "newline")
+                nd.attributes &&
+                nd.attributes.linebreak &&
+                nd.attributes.linebreak === "nobreak"
               ) {
-                block.push(nd);
-                i += 1;
-                if (
-                  nd.attributes &&
-                  nd.attributes.linebreak &&
-                  nd.attributes.linebreak === "nobreak"
-                ) {
-                  glueIsFreeOfNobreak = false;
-                }
-              } else {
-                break;
+                glueIsFreeOfNobreak = false;
               }
+            } else {
+              break;
             }
           }
-          if (glueIsFreeOfNobreak) {
-            // Start a new block. (Insert a soft linebreak.)
-            const element = new mathMLTree.MathNode("mrow", block);
-            mrows.push(element);
-            block = [];
-          }
-          canBeBIN = false;
         }
-        const isOpenDelimiter = node.attributes.form && node.attributes.form === "prefix";
-        // Any operator that follows an open delimiter is unary.
-        canBeBIN = !(node.attributes.separator || isOpenDelimiter);
-      } else {
-        canBeBIN = true;
+        if (glueIsFreeOfNobreak) {
+          // Start a new block. (Insert a soft linebreak.)
+          const element = new mathMLTree.MathNode("mrow", block);
+          mrows.push(element);
+          block = [];
+        }
       }
-    } else {
-      canBeBIN = true;
     }
     i += 1;
   }
@@ -2131,9 +2133,10 @@ function buildMathML(tree, texExpression, style, settings) {
   }
   if (settings.displayMode) {
     math.setAttribute("display", "block");
-    math.style.display = math.children.length === 1 && math.children[0].type === "mtable"
-      ? "inline"
-      : "block math";
+    math.style.display = "block math"; // necessary in Chromium.
+    // Firefox and Safari do not recognize display: "block math".
+    // Set a class so that the CSS file can set display: block.
+    math.classes = ["tml-display"];
   }
   return math;
 }
@@ -3662,10 +3665,9 @@ defineFunction({
       // so we have to explicitly set stretchy to true.
       node.setAttribute("stretchy", "true");
     }
-
     node.setAttribute("symmetric", "true"); // Needed for tall arrows in Firefox.
     node.setAttribute("minsize", sizeToMaxHeight[group.size] + "em");
-    // Don't set the maxsize attribute. It's broken in Chromium.
+    node.setAttribute("maxsize", sizeToMaxHeight[group.size] + "em");
     return node;
   }
 });
@@ -3800,34 +3802,42 @@ const padding$1 = _ => {
 
 const mathmlBuilder$8 = (group, style) => {
   let node;
-  if (group.label.indexOf("colorbox") > -1) {
-    // Chrome mpadded +width attribute is broken. Insert <mspace>
-    node = new mathMLTree.MathNode("mpadded", [
+  if (group.label.indexOf("colorbox") > -1 || group.label === "\\boxed") {
+    // MathML core does not support +width attribute in <mpadded>.
+    // Firefox does not reliably add side padding.
+    // Insert <mspace>
+    node = new mathMLTree.MathNode("mrow", [
       padding$1(),
       buildGroup$1(group.body, style),
       padding$1()
     ]);
   } else {
-    node = new mathMLTree.MathNode("menclose", [buildGroup$1(group.body, style)]);
+    node = new mathMLTree.MathNode("mrow", [buildGroup$1(group.body, style)]);
   }
   switch (group.label) {
     case "\\overline":
-      node.setAttribute("notation", "top");
       node.style.padding = "0.1em 0 0 0";
       node.style.borderTop = "0.065em solid";
       break
     case "\\underline":
-      node.setAttribute("notation", "bottom");
       node.style.padding = "0 0 0.1em 0";
       node.style.borderBottom = "0.065em solid";
       break
     case "\\cancel":
-      node.setAttribute("notation", "updiagonalstrike");
-      node.classes.push("cancel");
+      node.style.background = `linear-gradient(to top left,
+rgba(0,0,0,0) 0%,
+rgba(0,0,0,0) calc(50% - 0.06em),
+rgba(0,0,0,1) 50%,
+rgba(0,0,0,0) calc(50% + 0.06em),
+rgba(0,0,0,0) 100%);`;
       break
     case "\\bcancel":
-      node.setAttribute("notation", "downdiagonalstrike");
-      node.classes.push("bcancel");
+      node.style.background = `linear-gradient(to top right,
+rgba(0,0,0,0) 0%,
+rgba(0,0,0,0) calc(50% - 0.06em),
+rgba(0,0,0,1) 50%,
+rgba(0,0,0,0) calc(50% + 0.06em),
+rgba(0,0,0,0) 100%);`;
       break
     /*
     case "\\longdiv":
@@ -3837,18 +3847,21 @@ const mathmlBuilder$8 = (group, style) => {
       node.setAttribute("notation", "phasorangle");
       break */
     case "\\angl":
-      node.setAttribute("notation", "actuarial");
       node.style.padding = "0.03889em 0.03889em 0 0.03889em";
       node.style.borderTop = "0.049em solid";
       node.style.borderRight = "0.049em solid";
       node.style.marginRight = "0.03889em";
       break
     case "\\sout":
-      node.setAttribute("notation", "horizontalstrike");
       node.style["text-decoration"] = "line-through 0.08em solid";
       break
+    case "\\boxed":
+      // \newcommand{\boxed}[1]{\fbox{\m@th$\displaystyle#1$}} from amsmath.sty
+      node.style = { padding: "3pt 0 3pt 0", border: "1px solid" };
+      node.setAttribute("scriptlevel", "0");
+      node.setAttribute("displaystyle", "true");
+      break
     case "\\fbox":
-      node.setAttribute("notation", "box");
       node.style = { padding: "3pt", border: "1px solid" };
       break
     case "\\fcolorbox":
@@ -3868,8 +3881,18 @@ const mathmlBuilder$8 = (group, style) => {
       break
     }
     case "\\xcancel":
-      node.setAttribute("notation", "updiagonalstrike downdiagonalstrike");
-      node.classes.push("xcancel");
+      node.style.background = `linear-gradient(to top left,
+rgba(0,0,0,0) 0%,
+rgba(0,0,0,0) calc(50% - 0.06em),
+rgba(0,0,0,1) 50%,
+rgba(0,0,0,0) calc(50% + 0.06em),
+rgba(0,0,0,0) 100%),
+linear-gradient(to top right,
+rgba(0,0,0,0) 0%,
+rgba(0,0,0,0) calc(50% - 0.06em),
+rgba(0,0,0,1) 50%,
+rgba(0,0,0,0) calc(50% + 0.06em),
+rgba(0,0,0,0) 100%);`;
       break
   }
   if (group.backgroundColor) {
@@ -3963,7 +3986,7 @@ defineFunction({
 
 defineFunction({
   type: "enclose",
-  names: ["\\angl", "\\cancel", "\\bcancel", "\\xcancel", "\\sout", "\\overline"],
+  names: ["\\angl", "\\cancel", "\\bcancel", "\\xcancel", "\\sout", "\\overline", "\\boxed"],
    // , "\\phase", "\\longdiv"
   props: {
     numArgs: 1
@@ -4300,24 +4323,94 @@ const mathmlBuilder$7 = function(group, style) {
     // Write horizontal rules
     if (i === 0 && hlines[0].length > 0) {
       if (hlines[0].length === 2) {
-        mtr.classes.push("tml-top-double");
+        mtr.children.forEach(cell => { cell.style.borderTop = "0.15em double"; });
       } else {
-        mtr.classes.push(hlines[0][0] ? "tml-top-dashed" : "tml-top-solid");
+        mtr.children.forEach(cell => {
+          cell.style.borderTop = hlines[0][0] ? "0.06em dashed" : "0.06em solid";
+        });
       }
     }
     if (hlines[i + 1].length > 0) {
       if (hlines[i + 1].length === 2) {
-        mtr.classes.push("tml-hline-double");
+        mtr.children.forEach(cell => { cell.style.borderBottom = "0.15em double"; });
       } else {
-        mtr.classes.push(hlines[i + 1][0] ? "tml-hline-dashed" : "tml-hline-solid");
+        mtr.children.forEach(cell => {
+          cell.style.borderBottom = hlines[i + 1][0] ? "0.06em dashed" : "0.06em solid";
+        });
       }
     }
     tbl.push(mtr);
   }
-  let table = new mathMLTree.MathNode("mtable", tbl);
+
   if (group.envClasses.length > 0) {
-    table.classes = group.envClasses.map(e => "tml-" + e);
+    const pad = group.envClasses.includes("jot")
+      ? "0.7" // 0.5ex + 0.09em top & bot padding
+      : group.envClasses.includes("small")
+      ? "0.35"
+      : "0.5"; // 0.5ex default top & bot padding
+    const sidePadding = group.envClasses.includes("abut")
+      ? "0"
+      : group.envClasses.includes("cases")
+      ? "0"
+      : group.envClasses.includes("small")
+      ? "0.1389"
+      : group.envClasses.includes("cd")
+      ? "0.25"
+      : "0.4"; // default side padding
+
+    const numCols = tbl.length === 0 ? 0 : tbl[0].children.length;
+
+    const sidePad = (j, hand) => {
+      if (j === 0 && hand === 0) { return "0" }
+      if (j === numCols - 1 && hand === 1) { return "0" }
+      if (group.envClasses[0] !== "align") { return sidePadding }
+      if (hand === 1) { return "0" }
+      if (group.addEqnNum) {
+        return (j % 2) ? "1" : "0"
+      } else {
+        return (j % 2) ? "0" : "1"
+      }
+    };
+
+    // Padding
+    for (let i = 0; i < tbl.length; i++) {
+      for (let j = 0; j < tbl[i].children.length; j++) {
+        tbl[i].children[j].style.padding = `${pad}ex ${sidePad(j, 1)}em ${pad}ex ${sidePad(j, 0)}em`;
+      }
+    }
+
+    // Justification
+    const align = group.envClasses.includes("align") || group.envClasses.includes("alignat");
+    for (let i = 0; i < tbl.length; i++) {
+      const row = tbl[i];
+      if (align) {
+        for (let j = 0; j < row.children.length; j++) {
+          // Chromium does not recognize text-align: left. Use -webkit-
+          // TODO: Remove -webkit- when Chromium no longer needs it.
+          row.children[j].style.textAlign = "-webkit-" + (j % 2 ? "left" : "right");
+        }
+      }
+      if (row.children.length > 1 && group.envClasses.includes("cases")) {
+        row.children[1].style.padding = row.children[1].style.padding.replace(/0em$/, "1em");
+      }
+
+      if (group.envClasses.includes("cases") || group.envClasses.includes("subarray")) {
+        for (const cell of row.children) {
+          cell.style.textAlign = "-webkit-" + "left";
+        }
+      }
+    }
+  } else {
+    // Set zero padding on side of the matrix
+    for (let i = 0; i < tbl.length; i++) {
+      tbl[i].children[0].style.paddingLeft = "0em";
+      if (tbl[i].children.length === tbl[0].children.length) {
+        tbl[i].children[tbl[i].children.length - 1].style.paddingRight = "0em";
+      }
+    }
   }
+
+  let table = new mathMLTree.MathNode("mtable", tbl);
   if (group.scriptLevel === "display") { table.setAttribute("displaystyle", "true"); }
 
   if (group.addEqnNum || group.envClasses.includes("multline")) {
@@ -4397,6 +4490,8 @@ const mathmlBuilder$7 = function(group, style) {
     align = "left " + (align.length > 0 ? align : "center ") + "right ";
   }
   if (align) {
+    // Firefox reads this attribute, not the -webkit-left|right written above.
+    // TODO: When Chrome no longer needs "-webkit-", use CSS and delete the next line.
     table.setAttribute("columnalign", align.trim());
   }
 
@@ -4421,7 +4516,7 @@ const alignedHandler = function(context, args) {
       cols,
       addEqnNum: context.envName === "align" || context.envName === "alignat",
       emptySingleRow: true,
-      envClasses: ["jot", "abut"], // set row spacing & provisional column spacing
+      envClasses: ["abut", "jot"], // set row spacing & provisional column spacing
       maxNumCols: context.envName === "split" ? 2 : undefined,
       leqno: context.parser.settings.leqno
     },
@@ -4439,18 +4534,22 @@ const alignedHandler = function(context, args) {
   // binary.  This behavior is implemented in amsmath's \start@aligned.
   let numMaths;
   let numCols = 0;
-  if (args[0] && args[0].type === "ordgroup") {
+  const isAlignedAt = context.envName.indexOf("at") > -1;
+  if (args[0] && isAlignedAt) {
+    // alignat environment takes an argument w/ number of columns
     let arg0 = "";
     for (let i = 0; i < args[0].body.length; i++) {
       const textord = assertNodeType(args[0].body[i], "textord");
       arg0 += textord.text;
     }
+    if (isNaN(arg0)) {
+      throw new ParseError("The alignat enviroment requires a numeric first argument.")
+    }
     numMaths = Number(arg0);
     numCols = numMaths * 2;
   }
-  const isAligned = !numCols;
   res.body.forEach(function(row) {
-    if (!isAligned) {
+    if (isAlignedAt) {
       // Case 1
       const curMaths = row.length / 2;
       if (numMaths < curMaths) {
@@ -4478,14 +4577,10 @@ const alignedHandler = function(context, args) {
       align: align
     };
   }
-  if (context.envName === "split") ; else if (context.envName.indexOf("ed") > -1) {
-    res.envClasses.push("aligned"); // Sets justification
-  } else if (isAligned) {
-    res.envClasses[1] = context.envName === "align*"
-      ? "align-star"
-      : "align"; // Sets column spacing & justification
+  if (context.envName === "split") ; else if (isAlignedAt) {
+    res.envClasses.push("alignat"); // Sets justification
   } else {
-    res.envClasses.push("aligned"); // Sets justification
+    res.envClasses[0] = "align"; // Sets column spacing & justification
   }
   return res;
 };
@@ -4735,7 +4830,7 @@ defineEnvironment({
     }
     const res = {
       cols: [],
-      envClasses: ["jot", "abut"],
+      envClasses: ["abut", "jot"],
       addEqnNum: context.envName === "gather",
       emptySingleRow: true,
       leqno: context.parser.settings.leqno
@@ -6829,8 +6924,6 @@ defineFunction({
   }
 });
 
-const sign = num => num >= 0 ? "+" : "-";
-
 // \raise, \lower, and \raisebox
 
 const mathmlBuilder = (group, style) => {
@@ -6838,11 +6931,13 @@ const mathmlBuilder = (group, style) => {
   const node = new mathMLTree.MathNode("mpadded", [buildGroup$1(group.body, newStyle)]);
   const dy = calculateSize(group.dy, style);
   node.setAttribute("voffset", dy.number + dy.unit);
-  const dyAbs = Math.abs(dy.number);
-  // The next two lines do not work in Chromium.
-  // TODO: Find some other way to adjust height and depth.
-  node.setAttribute("height", sign(dy.number) +  dyAbs + dy.unit);
-  node.setAttribute("depth", sign(-dy.number) +  dyAbs + dy.unit);
+  // Add padding, which acts to increase height in Chromium.
+  // TODO: Figure out some way to change height in Firefox w/o breaking Chromium.
+  if (dy.number > 0) {
+    node.style.padding = dy.number + dy.unit + " 0 0 0";
+  } else {
+    node.style.padding = "0 0 " + Math.abs(dy.number) + dy.unit + " 0";
+  }
   return node
 };
 
@@ -8471,9 +8566,6 @@ defineMacro("\u22ee", "\\vdots");
 //\newcommand{\substack}[1]{\subarray{c}#1\endsubarray}
 defineMacro("\\substack", "\\begin{subarray}{c}#1\\end{subarray}");
 
-// \newcommand{\boxed}[1]{\fbox{\m@th$\displaystyle#1$}}
-defineMacro("\\boxed", "\\fbox{$\\displaystyle{#1}$}");
-
 // \def\iff{\DOTSB\;\Longleftrightarrow\;}
 // \def\implies{\DOTSB\;\Longrightarrow\;}
 // \def\impliedby{\DOTSB\;\Longleftarrow\;}
@@ -8722,7 +8814,7 @@ defineMacro(
 defineMacro(
   "\\Temml",
   // eslint-disable-next-line max-len
-  "\\textrm{T}\\kern-0.2em\\lower{0.2em}\\textrm{E}\\kern-0.08em{\\textrm{M}\\kern-0.08em\\raise{0.2em}\\textrm{M}\\kern-0.08em\\textrm{L}}"
+  "\\textrm{T}\\kern-0.2em\\lower{0.2em}{\\textrm{E}}\\kern-0.08em{\\textrm{M}\\kern-0.08em\\raise{0.2em}\\textrm{M}\\kern-0.08em\\textrm{L}}"
 );
 
 // \DeclareRobustCommand\hspace{\@ifstar\@hspacer\@hspace}
@@ -12902,7 +12994,7 @@ class Style {
  * https://mit-license.org/
  */
 
-const version = "0.10.13";
+const version = "0.10.15";
 
 function postProcess(block) {
   const labelMap = {};
@@ -12953,6 +13045,7 @@ function postProcess(block) {
 /* eslint no-console:0 */
 
 /**
+ * @type {import('./temml').render}
  * Parse and build an expression, and place that expression in the DOM node
  * given.
  */
@@ -12990,6 +13083,7 @@ if (typeof document !== "undefined") {
 }
 
 /**
+ * @type {import('./temml').renderToString}
  * Parse and build an expression, and return the markup for that.
  */
 const renderToString = function(expression, options) {
@@ -12998,6 +13092,7 @@ const renderToString = function(expression, options) {
 };
 
 /**
+ * @type {import('./temml').generateParseTree}
  * Parse an expression and return the parse tree.
  */
 const generateParseTree = function(expression, options) {
@@ -13006,6 +13101,7 @@ const generateParseTree = function(expression, options) {
 };
 
 /**
+ * @type {import('./temml').definePreamble}
  * Take an expression which contains a preamble.
  * Parse it and return the macros.
  */
@@ -13038,6 +13134,7 @@ const renderError = function(error, expression, options) {
 };
 
 /**
+ * @type {import('./temml').renderToMathMLTree}
  * Generates and returns the Temml build tree. This is used for advanced
  * use cases (like rendering to custom output).
  */
@@ -13055,6 +13152,7 @@ const renderToMathMLTree = function(expression, options) {
   }
 };
 
+/** @type {import('./temml').default} */
 var temml = {
   /**
    * Current Temml version

package/dist/temmlPostProcess.js

@@ -14,7 +14,7 @@
    * https://mit-license.org/
    */
 
-  const version = "0.10.13";
+  const version = "0.10.15";
 
   function postProcess(block) {
     const labelMap = {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "temml",
-  "version": "0.10.13",
+  "version": "0.10.15",
   "description": "TeX to MathML conversion in JavaScript.",
   "main": "dist/temml.js",
   "engines": {
@@ -8,7 +8,9 @@
   },
   "exports": {
     ".": {
-      "require": "./dist/temml.cjs"
+      "require": "./dist/temml.cjs",
+      "import": "./dist/temml.mjs",
+      "types": "./dist/temml.d.ts"
     },
     "./*": "./*"
   },

package/src/buildMathML.js

@@ -260,9 +260,10 @@ export default function buildMathML(tree, texExpression, style, settings) {
   }
   if (settings.displayMode) {
     math.setAttribute("display", "block");
-    math.style.display = math.children.length === 1 && math.children[0].type === "mtable"
-      ? "inline"
-      : "block math"
+    math.style.display = "block math" // necessary in Chromium.
+    // Firefox and Safari do not recognize display: "block math".
+    // Set a class so that the CSS file can set display: block.
+    math.classes = ["tml-display"]
   }
   return math;
 }