MDX Example File

This is an example of an MDX file that showcases different components such as lists, tables, and more.

Headings

Headings are created using the # symbol. The number of # symbols indicates the level of the heading.

Paragraphs

Text not preceded by any special syntax is considered a paragraph.

Lists

Ordered List

1. First item
2. Second item
3. Third item

Unordered List

• First item
• Second item
• Third item

Tables

JSX Component Example

An example of embedding a JSX component within MDX:

<MyComponent>
  <h1>This is a JSX component inside MDX</h1>
  <p>JSX allows you to use React components and elements in your markdown.</p>
</MyComponent>

Collapsible Section with HTML Tags

Sample text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean blandit velit vel commodo mollis. Etiam sit amet sapien nibh. In lobortis eleifend purus, tempus laoreet est fringilla ac. Nunc ultricies urna augue, a egestas enim imperdiet et. Nullam efficitur sed turpis at lobortis. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer vestibulum consectetur est a lobortis. Nullam tempor tincidunt lacus. Quisque egestas orci eu neque ultrices dapibus. Sed hendrerit rutrum magna in maximus.

Nunc eu commodo arcu, eu molestie erat. Etiam eget hendrerit tortor, eu blandit mi. Integer lacinia purus nulla, at porttitor ipsum ullamcorper vel. Phasellus dui risus, tempor ac erat sit amet, faucibus ullamcorper nisi. Donec a venenatis enim, eget blandit lacus. Integer quis orci volutpat, ullamcorper lorem ac, vestibulum sem. Praesent pretium dictum orci, nec posuere lacus. Aliquam at cursus nisi, dignissim lobortis lacus. In neque nisl, elementum sed ipsum ut, elementum porta sem. Maecenas libero augue, mattis in faucibus aliquam, volutpat id risus. Sed faucibus blandit mi quis fermentum. Sed dapibus tortor id commodo consectetur. Fusce mollis ex ut odio scelerisque scelerisque. Maecenas placerat semper sapien ullamcorper consectetur. Morbi non convallis sem, sed sollicitudin arcu.

Cras suscipit felis tortor, non consectetur lectus elementum ac. Pellentesque a aliquam urna. Quisque semper nunc massa, non pulvinar diam congue id. Quisque eget nulla purus. Cras vitae sagittis urna. Sed ipsum libero, maximus nec neque vitae, tristique tincidunt magna. Nullam at turpis et elit sodales suscipit eu ut dui. Mauris quis neque vel tortor convallis pharetra nec in purus.

Curabitur auctor diam id ultrices aliquam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non vehicula ante. Cras arcu leo, iaculis nec cursus sed, pretium nec odio. Quisque imperdiet imperdiet metus, vel dignissim ipsum sagittis ut. Aenean tincidunt sit amet ante nec bibendum. Sed libero neque, blandit nec consectetur non, pretium quis ex. Curabitur imperdiet libero elit, id finibus mauris mattis in. Donec et arcu ligula. Mauris a interdum libero. Maecenas commodo viverra velit, a efficitur justo.

Pellentesque eget libero gravida, rhoncus massa at, molestie augue. Aenean accumsan leo vel orci tincidunt elementum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse ut egestas tortor. Vivamus ornare sapien ut leo tempus finibus. Pellentesque fermentum felis in eros gravida, a molestie turpis suscipit. Mauris rhoncus sapien sit amet elit pellentesque malesuada. Vivamus tempor ex id porttitor facilisis. Duis orci nisi, laoreet et justo ut, tincidunt facilisis eros. Praesent non malesuada tellus, quis ultricies turpis. Morbi convallis quam sit amet nisi laoreet mattis. Maecenas non efficitur metus, in aliquet ligula. Praesent vel lorem consectetur, vehicula mauris vel, rhoncus massa. Suspendisse tristique tristique velit, eu sodales neque sodales at.

Links and Footnotes

Here's a link to a website, to a local doc, and to a section heading in the current doc and to headings. Here's a footnote ¹.