temml 0.10.24 → 0.10.30

package/dist/temmlPostProcess.js

@@ -14,7 +14,7 @@
    * https://mit-license.org/
    */
 
-  const version = "0.10.24";
+  const version = "0.10.30";
 
   function postProcess(block) {
     const labelMap = {};
@@ -65,6 +65,4 @@
   exports.postProcess = postProcess;
   exports.version = version;
 
-  Object.defineProperty(exports, '__esModule', { value: true });
-
 }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "temml",
-  "version": "0.10.24",
+  "version": "0.10.30",
   "description": "TeX to MathML conversion in JavaScript.",
   "main": "dist/temml.js",
   "engines": {
@@ -28,10 +28,13 @@
   ],
   "license": "MIT",
   "devDependencies": {
-    "eslint": "^8.39.0",
+    "@eslint/eslintrc": "^3.1.0",
+    "@eslint/js": "^9.11.1",
+    "eslint": "^9.11.1",
     "esm": "^3.2.25",
-    "rollup": "^2.66.1",
-    "terser": "^5.14.2"
+    "globals": "^15.9.0",
+    "rollup": "^4.22.4",
+    "terser": "^5.34.0"
   },
   "scripts": {
     "lint": "eslint temml.js src",
@@ -39,7 +42,7 @@
     "visual-test": "node utils/buildTests.js",
     "test": "yarn lint && node utils/buildTests.js && yarn unit-test",
     "minify": "terser test/temml.js -o site/assets/temml.min.js -c -m && terser contrib/mhchem/mhchem.js -o site/assets/mhchem.min.js -c -m",
-    "build": "rollup --config ./utils/rollupConfig.js && yarn minify && node utils/insertPlugins.js",
+    "build": "rollup --config ./utils/rollupConfig.mjs && yarn minify && node utils/insertPlugins.js",
     "docs": "node utils/buildDocs.js",
     "dist": "yarn build && node ./utils/copyfiles.js && terser contrib/auto-render/test/auto-render.js -o contrib/auto-render/dist/auto-render.min.js -c -m"
   }

package/src/Parser.js

@@ -16,6 +16,7 @@ import unicodeAccents from /*preval*/ "./unicodeAccents";
 import unicodeSymbols from /*preval*/ "./unicodeSymbols";
 
 const binLeftCancellers = ["bin", "op", "open", "punct", "rel"];
+const sizeRegEx = /([-+]?) *(\d+(?:\.\d*)?|\.\d+) *([a-z]{2})/
 
 /**
  * This file contains the parser used to parse out a TeX expression from the
@@ -679,7 +680,7 @@ export default class Parser {
       res.text = "0pt"; // Enable \above{}
       isBlank = true; // This is here specifically for \genfrac
     }
-    const match = /([-+]?) *(\d+(?:\.\d*)?|\.\d+) *([a-z]{2})/.exec(res.text);
+    const match = sizeRegEx.exec(res.text);
     if (!match) {
       throw new ParseError("Invalid size: '" + res.text + "'", res);
     }
@@ -885,7 +886,7 @@ export default class Parser {
     // At this point, we should have a symbol, possibly with accents.
     // First expand any accented base symbol according to unicodeSymbols.
     if (Object.prototype.hasOwnProperty.call(unicodeSymbols, text[0]) &&
-        !symbols[this.mode][text[0]]) {
+      this.mode === "math" && !symbols[this.mode][text[0]]) {
       // This behavior is not strict (XeTeX-compatible) in math mode.
       if (this.settings.strict && this.mode === "math") {
         throw new ParseError(`Accented Unicode text character "${text[0]}" used in ` + `math mode`,
@@ -895,7 +896,9 @@ export default class Parser {
       text = unicodeSymbols[text[0]] + text.slice(1);
     }
     // Strip off any combining characters
-    const match = combiningDiacriticalMarksEndRegex.exec(text);
+    const match = this.mode === "math"
+      ? combiningDiacriticalMarksEndRegex.exec(text)
+      : null
     if (match) {
       text = text.substring(0, match.index);
       if (text === "i") {
@@ -948,7 +951,7 @@ export default class Parser {
         };
       }
       symbol = s;
-    } else if (text.charCodeAt(0) >= 0x80) {
+    } else if (text.charCodeAt(0) >= 0x80 || combiningDiacriticalMarksEndRegex.exec(text)) {
       // no symbol for e.g. ^
       if (this.settings.strict && this.mode === "math") {
         throw new ParseError(`Unicode text character "${text[0]}" used in math mode`, nucleus)

package/src/buildMathML.js

@@ -34,49 +34,72 @@ export const makeText = function(text, mode, style) {
   return new mathMLTree.TextNode(text);
 };
 
+const copyChar = (newRow, child) => {
+  if (newRow.children.length === 0 ||
+      newRow.children[newRow.children.length - 1].type !== "mtext") {
+    const mtext = new mathMLTree.MathNode(
+      "mtext",
+      [new mathMLTree.TextNode(child.children[0].text)]
+    )
+    newRow.children.push(mtext)
+  } else {
+    newRow.children[newRow.children.length - 1].children[0].text += child.children[0].text
+  }
+}
+
 export const consolidateText = mrow => {
   // If possible, consolidate adjacent <mtext> elements into a single element.
   if (mrow.type !== "mrow" && mrow.type !== "mstyle") { return mrow }
   if (mrow.children.length === 0) { return mrow } // empty group, e.g., \text{}
-  if (!mrow.children[0].attributes || mrow.children[0].type !== "mtext") { return mrow }
-  const variant = mrow.children[0].attributes.mathvariant || ""
-  const mtext = new mathMLTree.MathNode(
-    "mtext",
-    [new mathMLTree.TextNode(mrow.children[0].children[0].text)]
-  )
-  for (let i = 1; i < mrow.children.length; i++) {
-    // Check each child and, if possible, copy the character into child[0].
-    const localVariant = mrow.children[i].attributes.mathvariant || ""
-    if (mrow.children[i].type === "mrow") {
-      const childRow = mrow.children[i]
-      for (let j = 0; j < childRow.children.length; j++) {
-        // We'll also check the children of a mrow. One level only. No recursion.
-        const childVariant = childRow.children[j].attributes.mathvariant || ""
-        if (childVariant !== variant || childRow.children[j].type !== "mtext") {
-          return mrow // At least one element cannot be consolidated. Get out.
-        } else {
-          mtext.children[0].text += childRow.children[j].children[0].text
+  const newRow = new mathMLTree.MathNode("mrow")
+  for (let i = 0; i < mrow.children.length; i++) {
+    const child = mrow.children[i];
+    if (child.type === "mtext" && Object.keys(child.attributes).length === 0) {
+      copyChar(newRow, child)
+    } else if (child.type === "mrow") {
+      // We'll also check the children of an mrow. One level only. No recursion.
+      let canConsolidate = true
+      for (let j = 0; j < child.children.length; j++) {
+        const grandChild = child.children[j];
+        if (grandChild.type !== "mtext" || Object.keys(child.attributes).length !== 0) {
+          canConsolidate = false
+          break
+        }
+      }
+      if (canConsolidate) {
+        for (let j = 0; j < child.children.length; j++) {
+          const grandChild = child.children[j];
+          copyChar(newRow, grandChild)
         }
+      } else {
+        newRow.children.push(child)
       }
-    } else if (localVariant !== variant || mrow.children[i].type !== "mtext") {
-      return mrow
     } else {
-      mtext.children[0].text += mrow.children[i].children[0].text
+      newRow.children.push(child)
     }
   }
-  // Firefox does not render a space at either end of an <mtext> string.
-  // To get proper rendering, we replace leading or trailing spaces with no-break spaces.
-  if (mtext.children[0].text.charAt(0) === " ") {
-    mtext.children[0].text = "\u00a0" + mtext.children[0].text.slice(1)
-  }
-  const L = mtext.children[0].text.length
-  if (L > 0 && mtext.children[0].text.charAt(L - 1) === " ") {
-    mtext.children[0].text = mtext.children[0].text.slice(0, -1) + "\u00a0"
+  for (let i = 0; i < newRow.children.length; i++) {
+    if (newRow.children[i].type === "mtext") {
+      const mtext = newRow.children[i];
+      // Firefox does not render a space at either end of an <mtext> string.
+      // To get proper rendering, we replace leading or trailing spaces with no-break spaces.
+      if (mtext.children[0].text.charAt(0) === " ") {
+        mtext.children[0].text = "\u00a0" + mtext.children[0].text.slice(1)
+      }
+      const L = mtext.children[0].text.length
+      if (L > 0 && mtext.children[0].text.charAt(L - 1) === " ") {
+        mtext.children[0].text = mtext.children[0].text.slice(0, -1) + "\u00a0"
+      }
+      for (const [key, value] of Object.entries(mrow.attributes)) {
+        mtext.attributes[key] = value
+      }
+    }
   }
-  for (const [key, value] of Object.entries(mrow.attributes)) {
-    mtext.attributes[key] = value
+  if (newRow.children.length === 1 && newRow.children[0].type === "mtext") {
+    return newRow.children[0]; // A consolidated <mtext>
+  } else {
+    return newRow
   }
-  return mtext
 }
 
 const numberRegEx = /^[0-9]$/

package/src/environments/array.js

@@ -7,7 +7,8 @@ import { StyleLevel } from "../constants"
 import ParseError from "../ParseError";
 import { assertNodeType, assertSymbolNodeType } from "../parseNode";
 import { checkSymbolNodeType } from "../parseNode";
-
+import { stringFromArg } from "../macros"
+import { calculateSize } from "../units"
 import * as mml from "../buildMathML";
 
 // Helper functions
@@ -38,6 +39,24 @@ const validateAmsEnvironmentContext = context => {
   }
 }
 
+const sizeRegEx = /([-+]?) *(\d+(?:\.\d*)?|\.\d+) *([a-z]{2})/
+const arrayGaps = macros => {
+  let arraystretch = macros.get("\\arraystretch")
+  if (typeof arraystretch !== "string") {
+    arraystretch = stringFromArg(arraystretch.tokens)
+  }
+  arraystretch = isNaN(arraystretch) ? null : Number(arraystretch)
+  let arraycolsepStr = macros.get("\\arraycolsep")
+  if (typeof arraycolsepStr !== "string") {
+    arraycolsepStr = stringFromArg(arraycolsepStr.tokens)
+  }
+  const match = sizeRegEx.exec(arraycolsepStr)
+  const arraycolsep = match
+    ? { number: +(match[1] + match[2]), unit: match[3] }
+    : null
+  return [arraystretch, arraycolsep]
+}
+
 const getTag = (group, style, rowNum) => {
   let tag
   const tagContents = group.tags.shift()
@@ -76,12 +95,14 @@ function parseArray(
   {
     cols, // [{ type: string , align: l|c|r|null }]
     envClasses, // align(ed|at|edat) | array | cases | cd | small | multline
-    addEqnNum, // boolean
-    singleRow, // boolean
+    addEqnNum,      // boolean
+    singleRow,      // boolean
     emptySingleRow, // boolean
-    maxNumCols, // number
-    leqno // boolean
-  },
+    maxNumCols,     // number
+    leqno,          // boolean
+    arraystretch,   // number  | null
+    arraycolsep     // size value | null
+},
   scriptLevel
 ) {
   parser.gullet.beginGroup();
@@ -111,7 +132,6 @@ function parseArray(
   // Test for \hline at the top of the array.
   hLinesBeforeRow.push(getHLines(parser));
 
-  // eslint-disable-next-line no-constant-condition
   while (true) {
     // Parse each cell in its own group (namespace)
     let cell = parser.parseExpression(false, singleRow ? "\\end" : "\\\\");
@@ -211,7 +231,9 @@ function parseArray(
     addEqnNum,
     scriptLevel,
     tags,
-    leqno
+    leqno,
+    arraystretch,
+    arraycolsep
   };
 }
 
@@ -301,12 +323,18 @@ const mathmlBuilder = function(group, style) {
   }
 
   if (group.envClasses.length > 0) {
-    const pad = group.envClasses.includes("jot")
+    let 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")
+    if (group.arraystretch && group.arraystretch !== 1) {
+      // In LaTeX, \arraystretch is a factor applied to a 12pt strut height.
+      // It defines a baseline to baseline distance.
+      // Here, we do an approximation of that approach.
+      pad = String(1.4 * group.arraystretch - 0.8)
+    }
+    let sidePadding = group.envClasses.includes("abut")
       ? "0"
       : group.envClasses.includes("cases")
       ? "0"
@@ -315,6 +343,12 @@ const mathmlBuilder = function(group, style) {
       : group.envClasses.includes("cd")
       ? "0.25"
       : "0.4" // default side padding
+    let sidePadUnit = "em"
+    if (group.arraycolsep) {
+      const arraySidePad = calculateSize(group.arraycolsep, style)
+      sidePadding = arraySidePad.number
+      sidePadUnit = arraySidePad.unit
+    }
 
     const numCols = tbl.length === 0 ? 0 : tbl[0].children.length
 
@@ -333,7 +367,8 @@ const mathmlBuilder = function(group, style) {
     // 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`
+        tbl[i].children[j].style.padding = `${pad}ex ${sidePad(j, 1)}${sidePadUnit}`
+          + ` ${pad}ex ${sidePad(j, 0)}${sidePadUnit}`
       }
     }
 
@@ -587,10 +622,13 @@ defineEnvironment({
       }
       throw new ParseError("Unknown column alignment: " + ca, nde);
     });
+    const [arraystretch, arraycolsep] = arrayGaps(context.parser.gullet.macros)
     const res = {
       cols,
       envClasses: ["array"],
-      maxNumCols: cols.length
+      maxNumCols: cols.length,
+      arraystretch,
+      arraycolsep
     };
     return parseArray(context.parser, res, dCellStyle(context.envName));
   },
@@ -656,6 +694,7 @@ defineEnvironment({
     }
     const res = parseArray(context.parser, payload, "text")
     res.cols = new Array(res.body[0].length).fill({ type: "align", align: colAlign })
+    const [arraystretch, arraycolsep] = arrayGaps(context.parser.gullet.macros)
     return delimiters
       ? {
         type: "leftright",
@@ -663,7 +702,9 @@ defineEnvironment({
         body: [res],
         left: delimiters[0],
         right: delimiters[1],
-        rightColor: undefined // \right uninfluenced by \color in array
+        rightColor: undefined, // \right uninfluenced by \color in array
+        arraystretch,
+        arraycolsep
       }
       : res;
   },

package/src/environments/cd.js

@@ -71,7 +71,7 @@ export function parseCD(parser) {
   parser.gullet.beginGroup();
   parser.gullet.macros.set("\\cr", "\\\\\\relax");
   parser.gullet.beginGroup();
-  while (true) { // eslint-disable-line no-constant-condition
+  while (true) {
     // Get the parse nodes for the next row.
     parsedRows.push(parser.parseExpression(false, "\\\\"));
     parser.gullet.endGroup();

package/src/functions/accent.js

@@ -71,6 +71,20 @@ const needWebkitShift = new Set([
   "\\'", "\\^", "\\~", "\\=", "\\u", "\\.", '\\"', "\\r", "\\H", "\\v"
 ])
 
+const combiningChar = {
+  "\\`": "\u0300",
+  "\\'": "\u0301",
+  "\\^": "\u0302",
+  "\\~": "\u0303",
+  "\\=": "\u0304",
+  "\\u": "\u0306",
+  "\\.": "\u0307",
+  '\\"': "\u0308",
+  "\\r": "\u030A",
+  "\\H": "\u030B",
+  "\\v": "\u030C"
+}
+
 // Accents
 defineFunction({
   type: "accent",
@@ -140,13 +154,24 @@ defineFunction({
       console.log(`Temml parse error: Command ${context.funcName} is invalid in math mode.`)
     }
 
-    return {
-      type: "accent",
-      mode: mode,
-      label: context.funcName,
-      isStretchy: false,
-      base: base
-    };
+    if (mode === "text" && base.text && base.text.length === 1
+        && context.funcName in combiningChar  && smalls.indexOf(base.text) > -1) {
+      // Return a combining accent character
+      return {
+        type: "textord",
+        mode: "text",
+        text: base.text + combiningChar[context.funcName]
+      }
+    } else {
+      // Build up the accent
+      return {
+        type: "accent",
+        mode: mode,
+        label: context.funcName,
+        isStretchy: false,
+        base: base
+      }
+    }
   },
   mathmlBuilder
 });

package/src/functions/color.js

@@ -186,6 +186,7 @@ defineFunction({
       type: "color",
       mode: parser.mode,
       color,
+      isTextColor: true,
       body: ordargument(body)
     }
   },
@@ -218,6 +219,7 @@ defineFunction({
       type: "color",
       mode: parser.mode,
       color,
+      isTextColor: false,
       body
     }
   },

package/src/functions/def.js

@@ -252,8 +252,7 @@ defineFunction({
 
     parser.gullet.macros.set(
       name,
-      { tokens, numArgs },
-      !parser.settings.strict
+      { tokens, numArgs }
     )
 
     return { type: "internal", mode: parser.mode };

package/src/functions/delimsizing.js

@@ -118,10 +118,8 @@ function checkDelimiter(delim, context) {
   if (symDelim && delimiters.includes(symDelim.text)) {
     // If a character is not in the MathML operator dictionary, it will not stretch.
     // Replace such characters w/characters that will stretch.
-    if (["/", "\u2044"].includes(symDelim.text)) { symDelim.text = "\u2215" }
     if (["<", "\\lt"].includes(symDelim.text)) { symDelim.text = "⟨" }
     if ([">", "\\gt"].includes(symDelim.text)) { symDelim.text = "⟩" }
-    if (symDelim.text === "\\backslash") { symDelim.text = "\u2216" }
     return symDelim;
   } else if (symDelim) {
     throw new ParseError(`Invalid delimiter '${symDelim.text}' after '${context.funcName}'`, delim);
@@ -130,6 +128,9 @@ function checkDelimiter(delim, context) {
   }
 }
 
+//                               /         \
+const needExplicitStretch = ["\u002F", "\u005C", "\\backslash", "\\vert", "|"];
+
 defineFunction({
   type: "delimsizing",
   names: [
@@ -182,8 +183,7 @@ defineFunction({
       // defaults.
       node.setAttribute("fence", "false");
     }
-    if (group.delim === "\u2216" || group.delim === "\\vert" ||
-        group.delim === "|" || group.delim.indexOf("arrow") > -1) {
+    if (needExplicitStretch.includes(group.delim) || group.delim.indexOf("arrow") > -1) {
       // We have to explicitly set stretchy to true.
       node.setAttribute("stretchy", "true")
     }
@@ -269,7 +269,7 @@ defineFunction({
     const leftNode = new mathMLTree.MathNode("mo", [mml.makeText(group.left, group.mode)]);
     leftNode.setAttribute("fence", "true")
     leftNode.setAttribute("form", "prefix")
-    if (group.left === "\u2216" || group.left.indexOf("arrow") > -1) {
+    if (group.left === "/" || group.left === "\u005C" || group.left.indexOf("arrow") > -1) {
       leftNode.setAttribute("stretchy", "true")
     }
     inner.unshift(leftNode)
@@ -281,6 +281,15 @@ defineFunction({
     if (group.right === "\u2216" || group.right.indexOf("arrow") > -1) {
       rightNode.setAttribute("stretchy", "true")
     }
+    if (group.body.length > 0) {
+      const lastElement = group.body[group.body.length - 1];
+      if (lastElement.type === "color" && !lastElement.isTextColor) {
+        // \color is a switch. If the last element is of type "color" then
+        // the user set the \color switch and left it on.
+        // A \right delimiter turns the switch off, but the delimiter itself gets the color.
+        rightNode.setAttribute("mathcolor", lastElement.color);
+      }
+    }
     inner.push(rightNode)
 
     return mml.makeRow(inner);

package/src/functions/enclose.js

@@ -22,52 +22,62 @@ const mathmlBuilder = (group, style) => {
       padding()
     ])
   } else {
-    node = new mathMLTree.MathNode("mrow", [mml.buildGroup(group.body, style)])
+    node = new mathMLTree.MathNode("menclose", [mml.buildGroup(group.body, style)])
   }
   switch (group.label) {
     case "\\overline":
-      node.style.padding = "0.1em 0 0 0"
-      node.style.borderTop = "0.065em solid"
+      node.setAttribute("notation", "top") // for Firefox & WebKit
+      node.classes.push("tml-overline")    // for Chromium
       break
     case "\\underline":
-      node.style.padding = "0 0 0.1em 0"
-      node.style.borderBottom = "0.065em solid"
+      node.setAttribute("notation", "bottom")
+      node.classes.push("tml-underline")
       break
     case "\\cancel":
-      // We can't use an inline background-gradient. It does not work client-side.
-      // So set a class and put the rule in the external CSS file.
-      node.classes.push("tml-cancel")
+      node.setAttribute("notation", "updiagonalstrike")
+      node.children.push(new mathMLTree.MathNode("mrow", [], ["tml-cancel", "upstrike"]))
       break
     case "\\bcancel":
-      node.classes.push("tml-bcancel")
+      node.setAttribute("notation", "downdiagonalstrike")
+      node.children.push(new mathMLTree.MathNode("mrow", [], ["tml-cancel", "downstrike"]))
+      break
+    case "\\sout":
+      node.setAttribute("notation", "horizontalstrike")
+      node.children.push(new mathMLTree.MathNode("mrow", [], ["tml-cancel", "sout"]))
+      break
+    case "\\xcancel":
+      node.setAttribute("notation", "updiagonalstrike downdiagonalstrike")
+      node.classes.push("tml-xcancel")
       break
-    /*
     case "\\longdiv":
-      node.setAttribute("notation", "longdiv");
+      node.setAttribute("notation", "longdiv")
+      node.classes.push("longdiv-top")
+      node.children.push(new mathMLTree.MathNode("mrow", [], ["longdiv-arc"]))
       break
     case "\\phase":
-      node.setAttribute("notation", "phasorangle");
-      break */
-    case "\\angl":
-      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"
+      node.setAttribute("notation", "phasorangle")
+      node.classes.push("phasor-bottom")
+      node.children.push(new mathMLTree.MathNode("mrow", [], ["phasor-angle"]))
       break
-    case "\\sout":
-      node.style.backgroundImage = 'linear-gradient(black, black)'
-      node.style.backgroundRepeat = 'no-repeat'
-      node.style.backgroundSize = '100% 1.5px'
-      node.style.backgroundPosition = '0 center'
+    case "\\textcircled":
+      node.setAttribute("notation", "circle")
+      node.classes.push("circle-pad")
+      node.children.push(new mathMLTree.MathNode("mrow", [], ["textcircle"]))
+      break
+    case "\\angl":
+      node.setAttribute("notation", "actuarial")
+      node.classes.push("actuarial")
       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("notation", "box")
+      node.classes.push("tml-box")
       node.setAttribute("scriptlevel", "0")
       node.setAttribute("displaystyle", "true")
       break
     case "\\fbox":
-      node.style = { padding: "3pt", border: "1px solid" }
+      node.setAttribute("notation", "box")
+      node.classes.push("tml-fbox")
       break
     case "\\fcolorbox":
     case "\\colorbox": {
@@ -80,14 +90,11 @@ const mathmlBuilder = (group, style) => {
       const style = { padding: "3pt 0 3pt 0" }
 
       if (group.label === "\\fcolorbox") {
-        style.border = "0.06em solid " + String(group.borderColor)
+        style.border = "0.0667em solid " + String(group.borderColor)
       }
       node.style = style
       break
     }
-    case "\\xcancel":
-      node.classes.push("tml-xcancel")
-      break
   }
   if (group.backgroundColor) {
     node.setAttribute("mathbackground", group.backgroundColor);
@@ -180,8 +187,8 @@ defineFunction({
 
 defineFunction({
   type: "enclose",
-  names: ["\\angl", "\\cancel", "\\bcancel", "\\xcancel", "\\sout", "\\overline", "\\boxed"],
-   // , "\\phase", "\\longdiv"
+  names: ["\\angl", "\\cancel", "\\bcancel", "\\xcancel", "\\sout", "\\overline",
+    "\\boxed", "\\longdiv", "\\phase"],
   props: {
     numArgs: 1
   },
@@ -215,3 +222,25 @@ defineFunction({
   },
   mathmlBuilder
 });
+
+
+defineFunction({
+  type: "enclose",
+  names: ["\\textcircled"],
+  props: {
+    numArgs: 1,
+    argTypes: ["text"],
+    allowedInArgument: true,
+    allowedInText: true
+  },
+  handler({ parser, funcName }, args) {
+    const body = args[0];
+    return {
+      type: "enclose",
+      mode: parser.mode,
+      label: funcName,
+      body
+    };
+  },
+  mathmlBuilder
+});