<img src="demo/public/logo192.png" style="margin: auto; width: 192px; display: block; margin-top: 24px">

Equation Editor for React Applications

<!-- [](https://github.com/flw0/equation-editor-react/issues) [](http://nodejs.org/download/) -->

By Douwe den Blanken
(v0xnihili)

Demo

To see this package in action, a demo is available
here. It is possible to type
an equation and see the output in LaTeX underneath the editor in pink.

Usage

When embedding the EquationEditor component into your project, you have four properties you have
to set. value and onChange speak for themselves, while autoCommands contains a list of commands
for which you only have to type the name of the command with a \ in front of it. The same goes for
the autoOperatorNames but then for operators.

tsxCopy
import React, { useState } from "react";

import EquationEditor from "equation-editor-react";

const Example = () => {
  const [equation, setEquation] = useState("y=x");

  console.log(equation);

  return (
    <EquationEditor
      value={equation}
      onChange={setEquation}
      autoCommands="pi theta sqrt sum prod alpha beta gamma rho"
      autoOperatorNames="sin cos tan"
    />
  )
};

export default Example;

<!-- ## Size Please see [BundlePhobia](https://bundlephobia.com/result?p=equation-editor-react). -->

License

MIT