Components
Equation Element

Equation Element

Displays a LaTeX equation element with an editable popover for inputting and rendering mathematical expressions.

EquationBlock Context MenuBlock MenuBlock Menu ItemsBlock SelectionButtonColor Dropdown MenuDropdown MenuInputMenuPlate ElementPopoverSeparatorSpinnerTextareaToolbarTooltipTurn Into Dropdown Menu

Installation

Install the following dependencies:

npm install @udecode/plate-math @udecode/plate-selection @udecode/plate-ai @udecode/plate-caption @udecode/plate-comments @udecode/plate-font @udecode/plate-media @radix-ui/react-toolbar @radix-ui/react-tooltip @radix-ui/react-separator @radix-ui/react-dropdown-menu @udecode/plate-block-quote @udecode/plate-callout @udecode/plate-code-block @udecode/plate-heading @udecode/plate-indent-list @udecode/plate-toggle @udecode/plate-date @udecode/plate-layout @udecode/plate-table @ariakit/[email protected] @radix-ui/react-slot @radix-ui/react-popover

Copy and paste the following code into your project.

Get the code ->

Update the import paths to match your project setup.

Examples

Equation

Get the code ->

Equation

  1. Equations allow you to express complex mathematical concepts in both inline and block formats.
  1. Key features:
  • LaTeX syntax support
  • Inline and block equation formats
  1. Inline equation example:
    
    (Einstein's famous equation)
  1. Block equation examples:

The quadratic formula for solving

.

The fundamental theorem of calculus.
  1. Try these actions:
  • Click on any equation to edit it. Press Escape to close the menu without editing it.
  • You can navigate through the equation by using the arrow keys
  • Use the slash command (/equation) to insert a new equation
  • Use the slash command (/inline equation) for inline equations
Advanced usage: Combine equations with other elements like tables or code blocks for comprehensive scientific documentation. For example:
The Schrödinger equation,

, is fundamental in quantum mechanics.
Experiment with different equation types and formatting to create rich, mathematical content in your documents.
Emoji Input ElementHeading Element