Equation Editor for React Applications
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.
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;