/>
MDX UI
$ init
Invariant

Invariant

Algorithm invariant callout with optional complexity badge

Installation

npx @ravikumarsurya/mdx-ui add invariant

Usage

import { Invariant } from "@/components/mdx/invariant";
 
<Invariant>
  After every insertion, the BST property holds: all left descendants are
  smaller and all right descendants are larger than the current node.
</Invariant>;

Examples

An AVL tree remains height-balanced after every insertion and deletion — the height difference between left and right subtrees is at most 1.

O(log n)

A max-heap always satisfies the heap property: every parent node is greater than or equal to its children.

Basic invariant

<Invariant>
  At the start of each iteration, arr[0..i-1] contains the i smallest elements
  in sorted order.
</Invariant>

With complexity badge

The complexity prop adds a monospace badge — useful for tying an invariant to its asymptotic cost.

<Invariant complexity="O(log n)">
  After each comparison, the search space is halved. The target is either found
  or the interval is empty.
</Invariant>

Loop invariant for merge sort

<Invariant complexity="O(n log n)">
  After merging two sorted halves, the combined array segment is sorted. This
  invariant holds at every level of the recursion.
</Invariant>

Props

PropTypeDefaultDescription
complexitystring—Optional complexity label shown as a monospace badge (e.g. "O(log n)")
childrenReact.ReactNode—The invariant statement (required)
classNamestring—Additional CSS classes
PreviousInline Code
NextJSON-LD