MathSteps #

Props #

PropTypeRequiredDescription
steps{ label?: string, expression: string }[]YesOrdered derivation steps.
classNamestringNoWrapper classes.

Live example #

  1. 1

    Start from the quadratic equation

    ax2+bx+c=0ax^2 + bx + c = 0
  2. 2

    Normalize by a

    x2+bax+ca=0x^2 + \frac{b}{a}x + \frac{c}{a} = 0
  3. 3

    Solve for x

    x=−b±b2−4ac2ax = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}

Code #

mdx
<MathSteps
steps={[
{ label: 'Start from the quadratic equation', expression: 'ax^2 + bx + c = 0' },
{ label: 'Normalize by a', expression: 'x^2 + \\frac{b}{a}x + \\frac{c}{a} = 0' },
{ label: 'Solve for x', expression: 'x = \\frac{-b \\pm \\sqrt{b^2 - 4ac}}{2a}' },
]}
/>