JSFiddle - React, Tailwind, and code Playground

by Josh Pullen

HTML

<link rel="stylesheet" href="https://unpkg.com/[email protected]/build/mathquill.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/build/mathquill.min.js"></script>

<script>
	var MQ = MathQuill.getInterface(2);
</script>

<span id="fill-in-the-blank">\sqrt{ \MathQuillMathField{x}^2 + \MathQuillMathField{y}^2 }</span>
<script>
  var fillInTheBlank = MQ.StaticMath(document.getElementById('fill-in-the-blank'));
  fillInTheBlank.innerFields[0].config({
  	autoCommands: 'pi theta sqrt sum',
    charsThatBreakOutOfSupSub: '=<>',
    autoSubscriptNumerals: true,
    sumStartsWithNEquals: true
  })
  fillInTheBlank.innerFields[1].config({
  	autoCommands: 'pi theta sqrt sum',
    sumStartsWithNEquals: true
  })
</script>