katex 0.16.32 → 0.16.34

package/src/{Token.js → Token.ts}

@@ -1,11 +1,13 @@
-// @flow
 import SourceLocation from "./SourceLocation";
 
 /**
  * Interface required to break circular dependency between Token, Lexer, and
  * ParseError.
  */
-export interface LexerInterface {input: string, tokenRegex: RegExp}
+export interface LexerInterface {
+    input: string;
+    tokenRegex: RegExp;
+}
 
 /**
  * The resulting token returned from `lex`.
@@ -22,13 +24,13 @@ export interface LexerInterface {input: string, tokenRegex: RegExp}
  */
 export class Token {
     text: string;
-    loc: ?SourceLocation;
-    noexpand: ?boolean; // don't expand the token
-    treatAsRelax: ?boolean; // used in \noexpand
+    loc: SourceLocation | null | undefined;
+    noexpand: boolean | null | undefined; // don't expand the token
+    treatAsRelax: boolean | null | undefined; // used in \noexpand
 
     constructor(
         text: string,           // the text of this token
-        loc: ?SourceLocation,
+        loc?: SourceLocation | null | undefined,
     ) {
         this.text = text;
         this.loc = loc;

package/src/{buildCommon.js → buildCommon.ts}

@@ -1,4 +1,3 @@
-// @flow
 /* eslint no-console:0 */
 /**
  * This module contains general functions that can be used for building
@@ -29,13 +28,20 @@ const lookupSymbol = function(
     // TODO(#963): Use a union type for this.
     fontName: string,
     mode: Mode,
-): {value: string, metrics: ?CharacterMetrics} {
+): {
+    value: string;
+    metrics: CharacterMetrics | null | undefined;
+} {
     // Replace the value with its replaced value from symbol.js
-    if (symbols[mode][value] && symbols[mode][value].replace) {
-        value = symbols[mode][value].replace;
+    if (symbols[mode][value]) {
+        const replacement = symbols[mode][value].replace;
+        if (replacement) {
+            value = replacement;
+        }
     }
+
     return {
-        value: value,
+        value,
         metrics: getCharacterMetrics(value, fontName, mode),
     };
 };
@@ -99,7 +105,7 @@ export const mathsym = function(
     value: string,
     mode: Mode,
     options: Options,
-    classes?: string[] = [],
+    classes: string[] = [],
 ): SymbolNode {
     // Decide what font to render the symbol in by its entry in the symbols
     // table.
@@ -132,7 +138,10 @@ const boldsymbol = function(
     options: Options,
     classes: string[],
     type: "mathord" | "textord",
-): {| fontName: string, fontClass: string |} {
+): {
+    fontName: string;
+    fontClass: string;
+} {
     if (type !== "textord" &&
         lookupSymbol(value, "Math-BoldItalic", mode).metrics) {
         return {
@@ -152,7 +161,7 @@ const boldsymbol = function(
 /**
  * Makes either a mathord or textord in the correct font and color.
  */
-export const makeOrd = function<NODETYPE: "spacing" | "mathord" | "textord">(
+export const makeOrd = function<NODETYPE extends "spacing" | "mathord" | "textord">(
     group: ParseNode<NODETYPE>,
     options: Options,
     type: "mathord" | "textord",
@@ -258,16 +267,14 @@ const canCombine = (prev: SymbolNode, next: SymbolNode) => {
         }
     }
 
-    for (const style in prev.style) {
-        if (prev.style.hasOwnProperty(style)
-            && prev.style[style] !== next.style[style]) {
+    for (const key of Object.keys(prev.style) as Array<keyof CssStyle>) {
+        if (prev.style[key] !== next.style[key]) {
             return false;
         }
     }
 
-    for (const style in next.style) {
-        if (next.style.hasOwnProperty(style)
-            && prev.style[style] !== next.style[style]) {
+    for (const key of Object.keys(next.style) as Array<keyof CssStyle>) {
+        if (prev.style[key] !== next.style[key]) {
             return false;
         }
     }
@@ -419,36 +426,36 @@ export const wrapFragment = function(
     return group;
 };
 
-
-// These are exact object types to catch typos in the names of the optional fields.
-export type VListElem = {|
-    type: "elem",
-    elem: HtmlDomNode,
-    marginLeft?: ?string,
-    marginRight?: string,
-    wrapperClasses?: string[],
-    wrapperStyle?: CssStyle,
-|};
-type VListElemAndShift = {|
-    type: "elem",
-    elem: HtmlDomNode,
-    shift: number,
-    marginLeft?: ?string,
-    marginRight?: string,
-    wrapperClasses?: string[],
-    wrapperStyle?: CssStyle,
-|};
-type VListKern = {| type: "kern", size: number |};
+export type VListElem = {
+    type: "elem";
+    elem: HtmlDomNode;
+    marginLeft?: string | null | undefined;
+    marginRight?: string;
+    wrapperClasses?: string[];
+    wrapperStyle?: CssStyle;
+};
+type VListElemAndShift = {
+    type: "elem";
+    elem: HtmlDomNode;
+    shift: number;
+    marginLeft?: string | null | undefined;
+    marginRight?: string;
+    wrapperClasses?: string[];
+    wrapperStyle?: CssStyle;
+};
+type VListKern = {
+    type: "kern";
+    size: number;
+};
 
 // A list of child or kern nodes to be stacked on top of each other (i.e. the
 // first element will be at the bottom, and the last at the top).
 type VListChild = VListElem | VListKern;
-
-type VListParam = {|
+type VListParam = {
     // Each child contains how much it should be shifted downward.
-    positionType: "individualShift",
-    children: VListElemAndShift[],
-|} | {|
+    positionType: "individualShift";
+    children: VListElemAndShift[];
+} | {
     // "top": The positionData specifies the topmost point of the vlist (note this
     //        is expected to be a height, so positive values move up).
     // "bottom": The positionData specifies the bottommost point of the vlist (note
@@ -456,25 +463,24 @@ type VListParam = {|
     // "shift": The vlist will be positioned such that its baseline is positionData
     //          away from the baseline of the first child which MUST be an
     //          "elem". Positive values move downwards.
-    positionType: "top" | "bottom" | "shift",
-    positionData: number,
-    children: VListChild[],
-|} | {|
+    positionType: "top" | "bottom" | "shift";
+    positionData: number;
+    children: VListChild[];
+} | {
     // The vlist is positioned so that its baseline is aligned with the baseline
     // of the first child which MUST be an "elem". This is equivalent to "shift"
     // with positionData=0.
-    positionType: "firstBaseline",
-    children: VListChild[],
-|};
-
+    positionType: "firstBaseline";
+    children: VListChild[];
+};
 
 // Computes the updated `children` list and the overall depth.
 //
 // This helper function for makeVList makes it easier to enforce type safety by
 // allowing early exits (returns) in the logic.
 const getVListChildrenAndDepth = function(params: VListParam): {
-    children: (VListChild | VListElemAndShift)[] | VListChild[],
-    depth: number,
+    children: (VListChild | VListElemAndShift)[] | VListChild[];
+    depth: number;
 } {
     if (params.positionType === "individualShift") {
         const oldChildren = params.children;
@@ -492,7 +498,6 @@ const getVListChildrenAndDepth = function(params: VListParam): {
                  oldChildren[i - 1].elem.depth);
 
             currPos = currPos + diff;
-
             children.push({type: "kern", size});
             children.push(oldChildren[i]);
         }
@@ -527,6 +532,7 @@ const getVListChildrenAndDepth = function(params: VListParam): {
             throw new Error(`Invalid positionType ${params.positionType}.`);
         }
     }
+
     return {children: params.children, depth};
 };
 
@@ -680,7 +686,10 @@ const retrieveTextFontName = function(
  * - fontName: the "style" parameter to fontMetrics.getCharacterMetrics
  */
 // A map between tex font commands an MathML mathvariant attribute values
-export const fontMap: {[string]: {| variant: FontVariant, fontName: string |}} = {
+export const fontMap: Record<string, {
+    variant: FontVariant;
+    fontName: string;
+}> = {
     // styles
     "mathbf": {
         variant: "bold",
@@ -737,10 +746,8 @@ export const fontMap: {[string]: {| variant: FontVariant, fontName: string |}} =
     },
 };
 
-export const svgData: {
-    [string]: ([string, number, number])
-} = {
-     //   path, width, height
+export const svgData: Record<string, [string, number, number]> = {
+    //   path, width, height
     vec: ["vec", 0.471, 0.714],                // values from the font glyph
     oiintSize1: ["oiintSize1", 0.957, 0.499],  // oval to overlay the integrand
     oiintSize2: ["oiintSize2", 1.472, 0.659],

package/src/{buildHTML.js → buildHTML.ts}

@@ -1,4 +1,3 @@
-// @flow
 /**
  * This file does the main work of building a domTree structure from a parse
  * tree. The entry point is the `buildHTML` function, which takes a parse tree.
@@ -48,7 +47,7 @@ const DomEnum = {
     mpunct: "mpunct",
     minner: "minner",
 };
-type DomType = $Keys<typeof DomEnum>;
+type DomType = keyof typeof DomEnum;
 
 /**
  * Take a list of nodes, build them in order, and return a list of the built
@@ -62,14 +61,14 @@ export const buildExpression = function(
     expression: AnyParseNode[],
     options: Options,
     isRealGroup: boolean | "root",
-    surrounding: [?DomType, ?DomType] = [null, null],
+    surrounding: [DomType | null | undefined, DomType | null | undefined] = [null, null],
 ): HtmlDomNode[] {
     // Parse expressions into `groups`.
     const groups: HtmlDomNode[] = [];
     for (let i = 0; i < expression.length; i++) {
         const output = buildGroup(expression[i], options);
         if (output instanceof DocumentFragment) {
-            const children: $ReadOnlyArray<HtmlDomNode> = output.children;
+            const children: ReadonlyArray<HtmlDomNode> = output.children;
             groups.push(...children);
         } else {
             groups.push(output);
@@ -108,7 +107,7 @@ export const buildExpression = function(
     // Before determining what spaces to insert, perform bin cancellation.
     // Binary operators change to ordinary symbols in some contexts.
     const isRoot = (isRealGroup === "root");
-    traverseNonSpaceNodes(groups, (node, prev) => {
+    traverseNonSpaceNodes(groups, (node, prev): void => {
         const prevType = prev.classes[0];
         const type = node.classes[0];
         if (prevType === "mbin" && binRightCanceller.has(type)) {
@@ -118,14 +117,15 @@ export const buildExpression = function(
         }
     }, {node: dummyPrev}, dummyNext, isRoot);
 
-    traverseNonSpaceNodes(groups, (node, prev) => {
+    traverseNonSpaceNodes(groups, (node, prev): HtmlDomNode | undefined => {
         const prevType = getTypeOfDomTree(prev);
         const type = getTypeOfDomTree(node);
 
         // 'mtight' indicates that the node is script or scriptscript style.
         const space = prevType && type ? (node.hasClass("mtight")
-            ? tightSpacings[prevType][type]
-            : spacings[prevType][type]) : null;
+            ? tightSpacings[prevType]?.[type]
+            : spacings[prevType]?.[type]) : null;
+
         if (space) { // Insert glue (spacing) after the `prev`.
             return makeGlue(space, glueOptions);
         }
@@ -141,12 +141,13 @@ export const buildExpression = function(
 // Used for bin cancellation and inserting spacings.
 const traverseNonSpaceNodes = function(
     nodes: HtmlDomNode[],
-    callback: (HtmlDomNode, HtmlDomNode) => ?HtmlDomNode,
-    prev: {|
+    callback: (arg0: HtmlDomNode, arg1: HtmlDomNode) =>
+        HtmlDomNode | null | void,
+    prev: {
         node: HtmlDomNode,
-        insertAfter?: HtmlDomNode => void,
-    |},
-    next: ?HtmlDomNode,
+        insertAfter?: (arg0: HtmlDomNode) => void,
+    },
+    next: HtmlDomNode | null | undefined,
     isRoot: boolean,
 ) {
     if (next) { // temporarily append the right node, if exists
@@ -156,9 +157,10 @@ const traverseNonSpaceNodes = function(
     for (; i < nodes.length; i++) {
         const node = nodes[i];
         const partialGroup = checkPartialGroup(node);
+
         if (partialGroup) { // Recursive DFS
-            // $FlowFixMe: make nodes a $ReadOnlyArray by returning a new array
-            traverseNonSpaceNodes(partialGroup.children,
+            // TODO(ts): make nodes a $ReadOnlyArray by returning a new array
+            traverseNonSpaceNodes(partialGroup.children as HtmlDomNode[],
                 callback, prev, null, isRoot);
             continue;
         }
@@ -188,6 +190,7 @@ const traverseNonSpaceNodes = function(
             i++;
         })(i);
     }
+
     if (next) {
         nodes.pop();
     }
@@ -196,7 +199,7 @@ const traverseNonSpaceNodes = function(
 // Check if given node is a partial group, i.e., does not affect spacing around.
 const checkPartialGroup = function(
     node: HtmlDomNode,
-): ?(DocumentFragment<HtmlDomNode> | Anchor | DomSpan) {
+): DocumentFragment<HtmlDomNode> | Anchor | DomSpan | null | undefined {
     if (node instanceof DocumentFragment || node instanceof Anchor
         || (node instanceof Span && node.hasClass("enclosing"))) {
         return node;
@@ -226,9 +229,9 @@ const getOutermostNode = function(
 // Return math atom class (mclass) of a domTree.
 // If `side` is given, it will get the type of the outermost node at given side.
 export const getTypeOfDomTree = function(
-    node: ?HtmlDomNode,
-    side: ?Side,
-): ?DomType {
+    node: HtmlDomNode | null | undefined,
+    side?: Side | null | undefined,
+): DomType | null | undefined {
     if (!node) {
         return null;
     }
@@ -237,9 +240,9 @@ export const getTypeOfDomTree = function(
     }
     // This makes a lot of assumptions as to where the type of atom
     // appears.  We should do a better job of enforcing this.
-    return DomEnum[node.classes[0]] || null;
+    const className = node.classes[0] as keyof typeof DomEnum;
+    return (DomEnum[className] as DomType | undefined) || null;
 };
-
 export const makeNullDelimiter = function(
     options: Options,
     classes: string[],
@@ -254,7 +257,7 @@ export const makeNullDelimiter = function(
  * between parents and children.
  */
 export const buildGroup = function(
-    group: ?AnyParseNode,
+    group: AnyParseNode | null | undefined,
     options: Options,
     baseOptions?: Options,
 ): HtmlDomNode {
@@ -264,7 +267,7 @@ export const buildGroup = function(
 
     if (groupBuilders[group.type]) {
         // Call the groupBuilders function
-        // $FlowFixMe
+        // TODO(ts)
         let groupNode: HtmlDomNode = groupBuilders[group.type](group, options);
 
         // If the size changed between the parent and the current group, account
@@ -293,7 +296,7 @@ export const buildGroup = function(
  * guarantee correct vertical extent.  `buildHTML` calls this repeatedly to
  * make up the entire expression as a sequence of unbreakable units.
  */
-function buildHTMLUnbreakable(children, options) {
+function buildHTMLUnbreakable(children: HtmlDomNode[], options: Options) {
     // Compute height and depth of this chunk.
     const body = makeSpan(["base"], children, options);
 
@@ -382,7 +385,8 @@ export default function buildHTML(tree: AnyParseNode[], options: Options): DomSp
     let tagChild;
     if (tag) {
         tagChild = buildHTMLUnbreakable(
-            buildExpression(tag, options, true)
+            buildExpression(tag, options, true),
+            options,
         );
         tagChild.classes = ["tag"];
         children.push(tagChild);

package/src/{buildMathML.js → buildMathML.ts}

@@ -1,4 +1,3 @@
-// @flow
 /**
  * This file converts a parse tree into a corresponding MathML tree. The main
  * entry point is the `buildMathML` function, which takes a parse tree from the
@@ -35,7 +34,7 @@ export const makeText = function(
         !(ligatures.hasOwnProperty(text) && options &&
           ((options.fontFamily && options.fontFamily.slice(4, 6) === "tt") ||
            (options.font && options.font.slice(4, 6) === "tt")))) {
-        text = symbols[mode][text].replace;
+        text = symbols[mode][text].replace!;
     }
 
     return new TextNode(text);
@@ -45,7 +44,7 @@ export const makeText = function(
  * Wrap the given array of nodes in an <mrow> node if needed, i.e.,
  * unless the array has length 1.  Always returns a single node.
  */
-export const makeRow = function(body: $ReadOnlyArray<MathDomNode>): MathDomNode {
+export const makeRow = function(body: MathDomNode[]): MathDomNode {
     if (body.length === 1) {
         return body[0];
     } else {
@@ -59,7 +58,7 @@ export const makeRow = function(body: $ReadOnlyArray<MathDomNode>): MathDomNode
 export const getVariant = function(
     group: SymbolParseNode,
     options: Options,
-): ?FontVariant {
+): FontVariant | null | undefined {
     // Handle \text... font specifiers as best we can.
     // MathML has a limited list of allowable mathvariant specifiers; see
     // https://www.w3.org/TR/MathML3/chapter3.html#presm.commatt
@@ -117,8 +116,11 @@ export const getVariant = function(
         return null;
     }
 
-    if (symbols[mode][text] && symbols[mode][text].replace) {
-        text = symbols[mode][text].replace;
+    if (symbols[mode][text]) {
+        const replacement = symbols[mode][text].replace;
+        if (replacement) {
+            text = replacement;
+        }
     }
 
     const fontName = fontMap[font].fontName;
@@ -134,7 +136,7 @@ export const getVariant = function(
  * or <mo separator="true" lspace="0em" rspace="0em">,</mo>
  * which is how a braced comma {,} renders in MathML
  */
-function isNumberPunctuation(group: ?MathNode): boolean {
+function isNumberPunctuation(group: MathNode | null | undefined): boolean {
     if (!group) {
         return false;
     }
@@ -247,7 +249,7 @@ export const buildExpressionRow = function(
  * on it to produce a MathML node.
  */
 export const buildGroup = function(
-    group: ?AnyParseNode,
+    group: AnyParseNode | null | undefined,
     options: Options,
 ): MathNode {
     if (!group) {
@@ -256,10 +258,10 @@ export const buildGroup = function(
 
     if (groupBuilders[group.type]) {
         // Call the groupBuilders function
-        // $FlowFixMe
+        // TODO(ts)
         const result: MathDomNode = groupBuilders[group.type](group, options);
-        // $FlowFixMe
-        return result;
+        // TODO(ts)
+        return result as MathNode;
     } else {
         throw new ParseError(
             "Got group of unknown type: '" + group.type + "'");
@@ -318,6 +320,6 @@ export default function buildMathML(
     // we don't want to make the children type more generic since the children
     // of span are expected to have more fields in `buildHtml` contexts.
     const wrapperClass = forMathmlOnly ? "katex" : "katex-mathml";
-    // $FlowFixMe
-    return makeSpan([wrapperClass], [math]);
+    // TODO(ts)
+    return makeSpan([wrapperClass], [math as any]);
 }

package/src/{buildTree.js → buildTree.ts}

@@ -1,4 +1,3 @@
-// @flow
 import buildHTML from "./buildHTML";
 import buildMathML from "./buildMathML";
 import {makeSpan} from "./buildCommon";
@@ -39,7 +38,7 @@ export const buildTree = function(
     const options = optionsFromSettings(settings);
     let katexNode;
     if (settings.output === "mathml") {
-        return  buildMathML(tree, expression, options, settings.displayMode, true);
+        return buildMathML(tree, expression, options, settings.displayMode, true);
     } else if (settings.output === "html") {
         const htmlNode = buildHTML(tree, options);
         katexNode = makeSpan(["katex"], [htmlNode]);

package/src/{defineEnvironment.js → defineEnvironment.ts}

@@ -1,4 +1,3 @@
-// @flow
 import {_htmlGroupBuilders, _mathmlGroupBuilders} from "./defineFunction";
 
 import type Parser from "./Parser";
@@ -13,11 +12,11 @@ import type {HtmlBuilder, MathMLBuilder} from "./defineFunction";
  *  - envName: the name of the environment, one of the listed names.
  *  - parser: the parser object.
  */
-type EnvContext = {|
-    mode: Mode,
-    envName: string,
-    parser: Parser,
-|};
+type EnvContext = {
+    mode: Mode;
+    envName: string;
+    parser: Parser;
+};
 
 /**
  *  - context: information and references provided by the parser
@@ -27,7 +26,7 @@ type EnvContext = {|
 type EnvHandler = (
     context: EnvContext,
     args: AnyParseNode[],
-    optArgs: (?AnyParseNode)[],
+    optArgs: (AnyParseNode | null | undefined)[],
 ) => AnyParseNode;
 
 /**
@@ -38,7 +37,7 @@ type EnvHandler = (
  *  - numOptionalArgs: (default 0) Just like for a function
  */
 type EnvProps = {
-    numArgs: number,
+    numArgs: number;
 };
 
 /**
@@ -48,45 +47,45 @@ type EnvProps = {
  * 2. requires all arguments except argType
  * It is generated by `defineEnvironment()` below.
  */
-export type EnvSpec<NODETYPE: NodeType> = {|
-    type: NODETYPE, // Need to use the type to avoid error. See NOTES below.
-    numArgs: number,
-    argTypes?: ArgType[],
-    allowedInText: boolean,
-    numOptionalArgs: number,
-    handler: EnvHandler,
-|};
+export type EnvSpec<NODETYPE extends NodeType> = {
+    type: NODETYPE;
+    // Need to use the type to avoid error. See NOTES below.
+    numArgs: number;
+    argTypes?: ArgType[];
+    allowedInText: boolean;
+    numOptionalArgs: number;
+    handler: EnvHandler;
+};
 
 /**
  * All registered environments.
  * `environments.js` exports this same dictionary again and makes it public.
  * `Parser.js` requires this dictionary via `environments.js`.
  */
-export const _environments: {[string]: EnvSpec<*>} = {};
+export const _environments: Record<string, EnvSpec<any>> = {};
 
-type EnvDefSpec<NODETYPE: NodeType> = {|
+type EnvDefSpec<NODETYPE extends NodeType> = {
     // Unique string to differentiate parse nodes.
-    type: NODETYPE,
+    type: NODETYPE;
 
     // List of functions which use the give handler, htmlBuilder,
     // and mathmlBuilder.
-    names: Array<string>,
+    names: Array<string>;
 
     // Properties that control how the environments are parsed.
-    props: EnvProps,
-
-    handler: EnvHandler,
+    props: EnvProps;
+    handler: EnvHandler;
 
     // This function returns an object representing the DOM structure to be
     // created when rendering the defined LaTeX function.
-    htmlBuilder: HtmlBuilder<NODETYPE>,
+    htmlBuilder: HtmlBuilder<NODETYPE>;
 
     // This function returns an object representing the MathML structure to be
     // created when rendering the defined LaTeX function.
-    mathmlBuilder: MathMLBuilder<NODETYPE>,
-|};
+    mathmlBuilder: MathMLBuilder<NODETYPE>;
+};
 
-export default function defineEnvironment<NODETYPE: NodeType>({
+export default function defineEnvironment<NODETYPE extends NodeType>({
     type,
     names,
     props,