#Markdown for SharePoint, and for Teams

Markstrata is a SharePoint Framework web part that renders markdown out of a document library, themed like the editors the markdown was written in: GitHub, Obsidian and VS Code, in light and dark. A Teams channel's Files are a document library, so the same web part shows the same documents as a tab.

This page is rendered by the web part's own pipeline and stylesheets. So is every other page here. Nothing on this site can claim a feature the code has stopped doing.

#Two ways to look at it

The demo is the web part itself, running its real renderer classes in your browser: the toolbar, the contents sidebar, copy buttons, the property pane and the split editor. Nothing is installed to open it.

The themes page renders one document that uses every feature at once, in whichever theme you pick, so a theme can be judged in one screen rather than six.

#What it renders

Markdown web parts for SharePoint tend to render the two things documentation is mostly made of, code and notes, in a way that is tiring to read: a fixed dark code background whatever the page theme is, one syntax palette baked in, and callouts with fills that fight the text on them. Markstrata treats the theme as data. Every colour, font and shape is a CSS custom property, and a theme is a file that sets them, so the page can follow the editor the documentation is actually written in.

/** Resolves the configured mode into a concrete light or dark value. */export function resolveMode(mode: ColorMode, isInverted?: boolean): ResolvedMode {  if (mode === 'light' || mode === 'dark') {    return mode;  }  return isInverted ? 'dark' : 'light';}

Callouts are written three ways and rendered one way, so a document written for GitHub, for Obsidian or for an older SharePoint web part needs no editing:

Tables, task lists, footnotes, definition lists, emoji, highlights, Mermaid diagrams themed to match the page, and KaTeX maths are all rendered as well. The syntax page has every one of them, with what you write beside what it turns into.

#A folder of documents, not a file

A document library full of markdown is a wiki that nobody wrote a wiki for. Markstrata reads it as one: a [[Wiki link]] points at the file beside it, and following one opens that document in the web part rather than handing the reader the raw file. The toolbar keeps the trail of documents they walked, so the way back is the page they came from rather than the beginning.

A ?strataDoc= parameter on the page address points the web part at any document in the library, which is what lets a SharePoint navigation menu have more than one entry.

How linking between documents works

#In Microsoft Teams

A channel's Files tab is a folder in a SharePoint document library. That is the whole reason this works: a Markstrata tab in a channel is the same web part, reading the same library, so a runbook is one document rather than one document and a copy of it.

How the Teams tab is installed and configured

#Installing it

Download the .sppkg from the latest release, upload it to your tenant App Catalog, and add Markstrata to a page. Nothing is fetched from a CDN while it runs: the parsing, the highlighting, the maths fonts and the diagram renderer are all inside the package.

Install notes, upgrades and what it asks of a tenant

flowchart LR
  A[Markdown in a document library] --> B[Markstrata]
  B --> C[A SharePoint page]
  B --> D[A Teams tab]

Markstrata is free and MIT licensed. If it saved you an afternoon, there are ways to say thanks, most of which cost nothing.