katex 0.10.0-rc → 0.10.2

package/src/Settings.js

@@ -18,6 +18,8 @@ export type StrictFunction =
 
 export type SettingsOptions = {
     displayMode?: boolean;
+    leqno?: boolean;
+    fleqn?: boolean;
     throwOnError?: boolean;
     errorColor?: string;
     macros?: MacroMap;
@@ -40,6 +42,8 @@ export type SettingsOptions = {
  */
 class Settings {
     displayMode: boolean;
+    leqno: boolean;
+    fleqn: boolean;
     throwOnError: boolean;
     errorColor: string;
     macros: MacroMap;
@@ -53,6 +57,8 @@ class Settings {
         // allow null options
         options = options || {};
         this.displayMode = utils.deflt(options.displayMode, false);
+        this.leqno = utils.deflt(options.leqno, false);
+        this.fleqn = utils.deflt(options.fleqn, false);
         this.throwOnError = utils.deflt(options.throwOnError, true);
         this.errorColor = utils.deflt(options.errorColor, "#cc0000");
         this.macros = options.macros || {};

package/src/buildCommon.js

@@ -5,7 +5,7 @@
  * different kinds of domTree nodes in a consistent manner.
  */
 
-import {SymbolNode, Anchor, Span, PathNode, SvgNode} from "./domTree";
+import {SymbolNode, Anchor, Span, PathNode, SvgNode, createClass} from "./domTree";
 import {getCharacterMetrics} from "./fontMetrics";
 import symbols, {ligatures} from "./symbols";
 import utils from "./utils";
@@ -15,15 +15,14 @@ import {DocumentFragment} from "./tree";
 
 import type Options from "./Options";
 import type {ParseNode} from "./parseNode";
-import type {NodeType} from "./parseNode";
 import type {CharacterMetrics} from "./fontMetrics";
 import type {FontVariant, Mode} from "./types";
 import type {documentFragment as HtmlDocumentFragment} from "./domTree";
 import type {HtmlDomNode, DomSpan, SvgSpan, CssStyle} from "./domTree";
 import type {Measurement} from "./units";
 
-// The following have to be loaded from Main-Italic font, using class mainit
-const mainitLetters = [
+// The following have to be loaded from Main-Italic font, using class mathit
+const mathitLetters = [
     "\\imath", "ı",       // dotless i
     "\\jmath", "ȷ",       // dotless j
     "\\pounds", "\\mathsterling", "\\textsterling", "£",   // pounds symbol
@@ -73,7 +72,7 @@ const makeSymbol = function(
     let symbolNode;
     if (metrics) {
         let italic = metrics.italic;
-        if (mode === "text") {
+        if (mode === "text" || (options && options.font === "mathit")) {
             italic = 0;
         }
         symbolNode = new SymbolNode(
@@ -133,70 +132,58 @@ const mathsym = function(
 };
 
 /**
- * Makes a symbol in the default font for mathords and textords.
+ * Determines which of the two font names (Main-Italic and Math-Italic) and
+ * corresponding style tags (maindefault or mathit) to use for default math font,
+ * depending on the symbol.
  */
-const mathDefault = function(
+const mathdefault = function(
     value: string,
     mode: Mode,
     options: Options,
     classes: string[],
-    type: NodeType,
-): SymbolNode {
-    if (type === "mathord") {
-        const fontLookup = mathit(value, mode, options, classes);
-        return makeSymbol(value, fontLookup.fontName, mode, options,
-            classes.concat([fontLookup.fontClass]));
-    } else if (type === "textord") {
-        const font = symbols[mode][value] && symbols[mode][value].font;
-        if (font === "ams") {
-            const fontName = retrieveTextFontName("amsrm", options.fontWeight,
-                  options.fontShape);
-            return makeSymbol(
-                value, fontName, mode, options,
-                classes.concat("amsrm", options.fontWeight, options.fontShape));
-        } else if (font === "main" || !font) {
-            const fontName = retrieveTextFontName("textrm", options.fontWeight,
-                  options.fontShape);
-            return makeSymbol(
-                value, fontName, mode, options,
-                classes.concat(options.fontWeight, options.fontShape));
-        } else { // fonts added by plugins
-            const fontName = retrieveTextFontName(font, options.fontWeight,
-                  options.fontShape);
-            // We add font name as a css class
-            return makeSymbol(
-                value, fontName, mode, options,
-                classes.concat(fontName, options.fontWeight, options.fontShape));
-        }
+): {| fontName: string, fontClass: string |} {
+    if (/[0-9]/.test(value.charAt(0)) ||
+            // glyphs for \imath and \jmath do not exist in Math-Italic so we
+            // need to use Main-Italic instead
+            utils.contains(mathitLetters, value)) {
+        return {
+            fontName: "Main-Italic",
+            fontClass: "mathit",
+        };
     } else {
-        throw new Error("unexpected type: " + type + " in mathDefault");
+        return {
+            fontName: "Math-Italic",
+            fontClass: "mathdefault",
+        };
     }
 };
 
 /**
- * Determines which of the two font names (Main-Italic and Math-Italic) and
- * corresponding style tags (mainit or mathit) to use for font "mathit",
- * depending on the symbol.  Use this function instead of fontMap for font
- * "mathit".
+ * Determines which of the font names (Main-Italic, Math-Italic, and Caligraphic)
+ * and corresponding style tags (mathit, mathdefault, or mathcal) to use for font
+ * "mathnormal", depending on the symbol.  Use this function instead of fontMap for
+ * font "mathnormal".
  */
-const mathit = function(
+const mathnormal = function(
     value: string,
     mode: Mode,
     options: Options,
     classes: string[],
 ): {| fontName: string, fontClass: string |} {
-    if (/[0-9]/.test(value.charAt(0)) ||
-            // glyphs for \imath and \jmath do not exist in Math-Italic so we
-            // need to use Main-Italic instead
-            utils.contains(mainitLetters, value)) {
+    if (utils.contains(mathitLetters, value)) {
         return {
             fontName: "Main-Italic",
-            fontClass: "mainit",
+            fontClass: "mathit",
+        };
+    } else if (/[0-9]/.test(value.charAt(0))) {
+        return {
+            fontName: "Caligraphic-Regular",
+            fontClass: "mathcal",
         };
     } else {
         return {
             fontName: "Math-Italic",
-            fontClass: "mathit",
+            fontClass: "mathdefault",
         };
     }
 };
@@ -252,15 +239,15 @@ const makeOrd = function<NODETYPE: "spacing" | "mathord" | "textord">(
     } else if (fontOrFamily) {
         let fontName;
         let fontClasses;
-        if (fontOrFamily === "boldsymbol") {
-            const fontData = boldsymbol(text, mode, options, classes);
-            fontName = fontData.fontName;
-            fontClasses = [fontData.fontClass];
-        } else if (fontOrFamily === "mathit" ||
-                   utils.contains(mainitLetters, text)) {
-            const fontData = mathit(text, mode, options, classes);
+        if (fontOrFamily === "boldsymbol" || fontOrFamily === "mathnormal") {
+            const fontData = fontOrFamily === "boldsymbol"
+                ? boldsymbol(text, mode, options, classes)
+                : mathnormal(text, mode, options, classes);
             fontName = fontData.fontName;
             fontClasses = [fontData.fontClass];
+        } else if (utils.contains(mathitLetters, text)) {
+            fontName = "Main-Italic";
+            fontClasses = ["mathit"];
         } else if (isFont) {
             fontName = fontMap[fontOrFamily].fontName;
             fontClasses = [fontOrFamily];
@@ -282,21 +269,88 @@ const makeOrd = function<NODETYPE: "spacing" | "mathord" | "textord">(
                                       classes.concat(fontClasses)));
             }
             return makeFragment(parts);
-        } else {
-            return mathDefault(text, mode, options, classes, type);
+        }
+    }
+
+    // Makes a symbol in the default font for mathords and textords.
+    if (type === "mathord") {
+        const fontLookup = mathdefault(text, mode, options, classes);
+        return makeSymbol(text, fontLookup.fontName, mode, options,
+            classes.concat([fontLookup.fontClass]));
+    } else if (type === "textord") {
+        const font = symbols[mode][text] && symbols[mode][text].font;
+        if (font === "ams") {
+            const fontName = retrieveTextFontName("amsrm", options.fontWeight,
+                  options.fontShape);
+            return makeSymbol(
+                text, fontName, mode, options,
+                classes.concat("amsrm", options.fontWeight, options.fontShape));
+        } else if (font === "main" || !font) {
+            const fontName = retrieveTextFontName("textrm", options.fontWeight,
+                  options.fontShape);
+            return makeSymbol(
+                text, fontName, mode, options,
+                classes.concat(options.fontWeight, options.fontShape));
+        } else { // fonts added by plugins
+            const fontName = retrieveTextFontName(font, options.fontWeight,
+                  options.fontShape);
+            // We add font name as a css class
+            return makeSymbol(
+                text, fontName, mode, options,
+                classes.concat(fontName, options.fontWeight, options.fontShape));
         }
     } else {
-        return mathDefault(text, mode, options, classes, type);
+        throw new Error("unexpected type: " + type + " in makeOrd");
     }
 };
 
 /**
- * Combine as many characters as possible in the given array of characters
- * via their tryCombine method.
+ * Returns true if subsequent symbolNodes have the same classes, skew, maxFont,
+ * and styles.
  */
-const tryCombineChars = function(chars: HtmlDomNode[]): HtmlDomNode[] {
+const canCombine = (prev: SymbolNode, next: SymbolNode) => {
+    if (createClass(prev.classes) !== createClass(next.classes)
+        || prev.skew !== next.skew
+        || prev.maxFontSize !== next.maxFontSize) {
+        return false;
+    }
+
+    for (const style in prev.style) {
+        if (prev.style.hasOwnProperty(style)
+            && prev.style[style] !== next.style[style]) {
+            return false;
+        }
+    }
+
+    for (const style in next.style) {
+        if (next.style.hasOwnProperty(style)
+            && prev.style[style] !== next.style[style]) {
+            return false;
+        }
+    }
+
+    return true;
+};
+
+/**
+ * Combine consequetive domTree.symbolNodes into a single symbolNode.
+ * Note: this function mutates the argument.
+ */
+const tryCombineChars = (chars: HtmlDomNode[]): HtmlDomNode[] => {
     for (let i = 0; i < chars.length - 1; i++) {
-        if (chars[i].tryCombine(chars[i + 1])) {
+        const prev = chars[i];
+        const next = chars[i + 1];
+        if (prev instanceof SymbolNode
+            && next instanceof SymbolNode
+            && canCombine(prev, next)) {
+
+            prev.text += next.text;
+            prev.height = Math.max(prev.height, next.height);
+            prev.depth = Math.max(prev.depth, next.depth);
+            // Use the last character's italic correction since we use
+            // it to add padding to the right of the span created from
+            // the combined characters.
+            prev.italic = next.italic;
             chars.splice(i + 1, 1);
             i--;
         }
@@ -405,6 +459,20 @@ const makeFragment = function(
     return fragment;
 };
 
+/**
+ * Wraps group in a span if it's a document fragment, allowing to apply classes
+ * and styles
+ */
+const wrapFragment = function(
+    group: HtmlDomNode,
+    options: Options,
+): HtmlDomNode {
+    if (group instanceof DocumentFragment) {
+        return makeSpan([], [group], options);
+    }
+    return group;
+};
+
 
 // These are exact object types to catch typos in the names of the optional fields.
 export type VListElem = {|
@@ -611,18 +679,6 @@ const makeVList = function(params: VListParam, options: Options): DomSpan {
     return vtable;
 };
 
-// Converts verb group into body string, dealing with \verb* form
-const makeVerb = function(group: ParseNode<"verb">, options: Options): string {
-    let text = group.body;
-    if (group.star) {
-        text = text.replace(/ /g, '\u2423');  // Open Box
-    } else {
-        text = text.replace(/ /g, '\xA0');    // No-Break Space
-        // (so that, in particular, spaces don't coalesce)
-    }
-    return text;
-};
-
 // Glue is a concept from TeX which is a flexible space between elements in
 // either a vertical or horizontal list. In KaTeX, at least for now, it's
 // static space between elements in a horizontal layout.
@@ -672,29 +728,6 @@ const retrieveTextFontName = function(
     return `${baseFontName}-${fontStylesName}`;
 };
 
-// A map of CSS-based spacing functions to their CSS class.
-const cssSpace: {[string]: string} = {
-    "\\nobreak": "nobreak",
-    "\\allowbreak": "allowbreak",
-};
-
-// A lookup table to determine whether a spacing function/symbol should be
-// treated like a regular space character.  If a symbol or command is a key
-// in this table, then it should be a regular space character.  Furthermore,
-// the associated value may have a `className` specifying an extra CSS class
-// to add to the created `span`.
-const regularSpace: {[string]: { className?: string }} = {
-    " ": {},
-    "\\ ": {},
-    "~": {
-        className: "nobreak",
-    },
-    "\\space": {},
-    "\\nobreakspace": {
-        className: "nobreak",
-    },
-};
-
 /**
  * Maps TeX font commands to objects containing:
  * - variant: string used for "mathvariant" attribute in buildMathML.js
@@ -715,11 +748,17 @@ const fontMap: {[string]: {| variant: FontVariant, fontName: string |}} = {
         variant: "italic",
         fontName: "Main-Italic",
     },
+    "mathit": {
+        variant: "italic",
+        fontName: "Main-Italic",
+    },
 
-    // "mathit" and "boldsymbol" are missing because they require the use of two
-    // fonts: Main-Italic and Math-Italic for "mathit", and Math-BoldItalic and
-    // Main-Bold for "boldsymbol".  This is handled by a special case in makeOrd
-    // which ends up calling mathit and boldsymbol.
+    // Default math font, "mathnormal" and "boldsymbol" are missing because they
+    // require the use of several fonts: Main-Italic and Math-Italic for default
+    // math font, Main-Italic, Math-Italic, Caligraphic for "mathnormal", and
+    // Math-BoldItalic and Main-Bold for "boldsymbol".  This is handled by a
+    // special case in makeOrd which ends up calling mathdefault, mathnormal,
+    // and boldsymbol.
 
     // families
     "mathbb": {
@@ -787,13 +826,11 @@ export default {
     makeLineSpan,
     makeAnchor,
     makeFragment,
+    wrapFragment,
     makeVList,
     makeOrd,
-    makeVerb,
     makeGlue,
     staticSvg,
     svgData,
     tryCombineChars,
-    cssSpace,
-    regularSpace,
 };