@mp-lb/mdkit 0.0.1-main.3.1 → 0.1.0-main.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/document/MdKitConflictPanel.js +4 -4
- package/dist/document/MdKitDocumentToolbar.js +3 -3
- package/dist/markdown/MarkdownBubbleMenu.d.ts +1 -1
- package/dist/markdown/MarkdownBubbleMenu.js +58 -8
- package/dist/markdown/MdKitEditor.js +1 -1
- package/dist/markdown/TiptapMarkdownSurface.js +5 -5
- package/dist/theme/MdKitThemeEditor.js +1 -1
- package/dist/theme/editorTheme.d.ts +1 -1
- package/dist/theme/editorTheme.js +15 -15
- package/dist/versioning/VersionHistoryPanel.js +2 -2
- package/docs/api.md +1 -1
- package/docs/shadcn.md +1 -1
- package/docs/styling.md +190 -71
- package/package.json +6 -2
- package/src/styles.css +271 -258
- package/dist/core/documentEngine.test.d.ts +0 -1
- package/dist/core/documentEngine.test.js +0 -119
- package/dist/document/useMdKitDocument.test.d.ts +0 -1
- package/dist/document/useMdKitDocument.test.js +0 -151
- package/dist/markdown/MdKitEditor.test.d.ts +0 -1
- package/dist/markdown/MdKitEditor.test.js +0 -126
- package/dist/markdown/normalizeMarkdownSerialization.test.d.ts +0 -1
- package/dist/markdown/normalizeMarkdownSerialization.test.js +0 -16
- package/dist/markdown/prepareMarkdownForEditorHydration.test.d.ts +0 -1
- package/dist/markdown/prepareMarkdownForEditorHydration.test.js +0 -13
- package/dist/markdown/preserveMarkdownWhitespace.test.d.ts +0 -1
- package/dist/markdown/preserveMarkdownWhitespace.test.js +0 -25
- package/dist/test/setup.d.ts +0 -1
- package/dist/test/setup.js +0 -13
- package/dist/versioning/useMdKitDocumentVersions.test.d.ts +0 -1
- package/dist/versioning/useMdKitDocumentVersions.test.js +0 -41
- package/docs/.vitepress/dist/404.html +0 -22
- package/docs/.vitepress/dist/api.html +0 -120
- package/docs/.vitepress/dist/architecture.html +0 -25
- package/docs/.vitepress/dist/assets/api.md.asncK3PQ.js +0 -96
- package/docs/.vitepress/dist/assets/api.md.asncK3PQ.lean.js +0 -1
- package/docs/.vitepress/dist/assets/app.BQvrHyG0.js +0 -1
- package/docs/.vitepress/dist/assets/architecture.md.BHQLarmZ.js +0 -1
- package/docs/.vitepress/dist/assets/architecture.md.BHQLarmZ.lean.js +0 -1
- package/docs/.vitepress/dist/assets/chunks/framework.RRduUuAx.js +0 -19
- package/docs/.vitepress/dist/assets/chunks/theme.CkCo6Nk1.js +0 -1
- package/docs/.vitepress/dist/assets/index.md.CITl-897.js +0 -137
- package/docs/.vitepress/dist/assets/index.md.CITl-897.lean.js +0 -1
- package/docs/.vitepress/dist/assets/inter-italic-cyrillic-ext.r48I6akx.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-italic-cyrillic.By2_1cv3.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-italic-greek-ext.1u6EdAuj.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-italic-greek.DJ8dCoTZ.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-italic-latin-ext.CN1xVJS-.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-italic-latin.C2AdPX0b.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-italic-vietnamese.BSbpV94h.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-cyrillic-ext.BBPuwvHQ.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-cyrillic.C5lxZ8CY.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-greek-ext.CqjqNYQ-.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-greek.BBVDIX6e.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-latin-ext.4ZJIpNVo.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-latin.Di8DUHzh.woff2 +0 -0
- package/docs/.vitepress/dist/assets/inter-roman-vietnamese.BjW4sHH5.woff2 +0 -0
- package/docs/.vitepress/dist/assets/shadcn.md.C3idOo2N.js +0 -57
- package/docs/.vitepress/dist/assets/shadcn.md.C3idOo2N.lean.js +0 -1
- package/docs/.vitepress/dist/assets/style.BtrGaL3i.css +0 -1
- package/docs/.vitepress/dist/assets/styling.md.B2C6kVFa.js +0 -91
- package/docs/.vitepress/dist/assets/styling.md.B2C6kVFa.lean.js +0 -1
- package/docs/.vitepress/dist/hashmap.json +0 -1
- package/docs/.vitepress/dist/index.html +0 -161
- package/docs/.vitepress/dist/shadcn.html +0 -81
- package/docs/.vitepress/dist/styling.html +0 -115
- package/docs/.vitepress/dist/vp-icons.css +0 -1
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en-US" dir="ltr">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
-
<title>API Reference | Markdown Editor Kit</title>
|
|
7
|
-
<meta name="description" content="Docs for the mdkit markdown editor package">
|
|
8
|
-
<meta name="generator" content="VitePress v1.6.4">
|
|
9
|
-
<link rel="preload stylesheet" href="/assets/style.BtrGaL3i.css" as="style">
|
|
10
|
-
<link rel="preload stylesheet" href="/vp-icons.css" as="style">
|
|
11
|
-
|
|
12
|
-
<script type="module" src="/assets/app.BQvrHyG0.js"></script>
|
|
13
|
-
<link rel="preload" href="/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
|
|
14
|
-
<link rel="modulepreload" href="/assets/chunks/theme.CkCo6Nk1.js">
|
|
15
|
-
<link rel="modulepreload" href="/assets/chunks/framework.RRduUuAx.js">
|
|
16
|
-
<link rel="modulepreload" href="/assets/api.md.asncK3PQ.lean.js">
|
|
17
|
-
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
|
18
|
-
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
|
|
19
|
-
</head>
|
|
20
|
-
<body>
|
|
21
|
-
<div id="app"><div class="Layout" data-v-2b1fb0c9><!--[--><!--]--><!--[--><span tabindex="-1" data-v-db89ae83></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-db89ae83>Skip to content</a><!--]--><!----><header class="VPNav" data-v-2b1fb0c9 data-v-acb86623><div class="VPNavBar" data-v-acb86623 data-v-77efa7eb><div class="wrapper" data-v-77efa7eb><div class="container" data-v-77efa7eb><div class="title" data-v-77efa7eb><div class="VPNavBarTitle has-sidebar" data-v-77efa7eb data-v-8a08158e><a class="title" href="/" data-v-8a08158e><!--[--><!--]--><!----><span data-v-8a08158e>Markdown Editor Kit</span><!--[--><!--]--></a></div></div><div class="content" data-v-77efa7eb><div class="content-body" data-v-77efa7eb><!--[--><!--]--><div class="VPNavBarSearch search" data-v-77efa7eb><!----></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-77efa7eb data-v-5412324d><span id="main-nav-aria-label" class="visually-hidden" data-v-5412324d> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Quick Start</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/styling" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Styling</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/shadcn" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Shadcn</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/api" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>API</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Architecture</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-77efa7eb data-v-a01193e5><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-a01193e5 data-v-4329f1c4 data-v-b8a6dba1><span class="check" data-v-b8a6dba1><span class="icon" data-v-b8a6dba1><!--[--><span class="vpi-sun sun" data-v-4329f1c4></span><span class="vpi-moon moon" data-v-4329f1c4></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-77efa7eb data-v-75a0fea7 data-v-01120ffe><!--[--><a class="VPSocialLink no-icon" href="https://github.com/mp-lb/mdkit" aria-label="github" target="_blank" rel="noopener" data-v-01120ffe data-v-5a6aee0b><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-77efa7eb data-v-c5dd4def data-v-a3183fa5><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-a3183fa5><span class="vpi-more-horizontal icon" data-v-a3183fa5></span></button><div class="menu" data-v-a3183fa5><div class="VPMenu" data-v-a3183fa5 data-v-dbe48bad><!----><!--[--><!--[--><!----><div class="group" data-v-c5dd4def><div class="item appearance" data-v-c5dd4def><p class="label" data-v-c5dd4def>Appearance</p><div class="appearance-action" data-v-c5dd4def><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-c5dd4def data-v-4329f1c4 data-v-b8a6dba1><span class="check" data-v-b8a6dba1><span class="icon" data-v-b8a6dba1><!--[--><span class="vpi-sun sun" data-v-4329f1c4></span><span class="vpi-moon moon" data-v-4329f1c4></span><!--]--></span></span></button></div></div></div><div class="group" data-v-c5dd4def><div class="item social-links" data-v-c5dd4def><div class="VPSocialLinks social-links-list" data-v-c5dd4def data-v-01120ffe><!--[--><a class="VPSocialLink no-icon" href="https://github.com/mp-lb/mdkit" aria-label="github" target="_blank" rel="noopener" data-v-01120ffe data-v-5a6aee0b><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-77efa7eb data-v-da8b7b90><span class="container" data-v-da8b7b90><span class="top" data-v-da8b7b90></span><span class="middle" data-v-da8b7b90></span><span class="bottom" data-v-da8b7b90></span></span></button></div></div></div></div><div class="divider" data-v-77efa7eb><div class="divider-line" data-v-77efa7eb></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-2b1fb0c9 data-v-f4bea7e4><div class="container" data-v-f4bea7e4><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-f4bea7e4><span class="vpi-align-left menu-icon" data-v-f4bea7e4></span><span class="menu-text" data-v-f4bea7e4>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-f4bea7e4 data-v-15ddd090><button data-v-15ddd090>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-2b1fb0c9 data-v-e9f01ae8><div class="curtain" data-v-e9f01ae8></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-e9f01ae8><span class="visually-hidden" id="sidebar-aria-label" data-v-e9f01ae8> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-228ebfa9><section class="VPSidebarItem level-0 has-active" data-v-228ebfa9 data-v-be8e87ce><div class="item" role="button" tabindex="0" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><h2 class="text" data-v-be8e87ce>Guide</h2><!----></div><div class="items" data-v-be8e87ce><!--[--><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Quick Start</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/styling" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Styling</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/shadcn" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Shadcn Plugin</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/api" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>API Reference</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/architecture" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Architecture</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-2b1fb0c9 data-v-6a1b1c35><div class="VPDoc has-sidebar has-aside" data-v-6a1b1c35 data-v-311cca79><!--[--><!--]--><div class="container" data-v-311cca79><div class="aside" data-v-311cca79><div class="aside-curtain" data-v-311cca79></div><div class="aside-container" data-v-311cca79><div class="aside-content" data-v-311cca79><div class="VPDocAside" data-v-311cca79 data-v-2fa565e8><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-2fa565e8 data-v-8080a522><div class="content" data-v-8080a522><div class="outline-marker" data-v-8080a522></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-8080a522>On this page</div><ul class="VPDocOutlineItem root" data-v-8080a522 data-v-44b0cffc><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-2fa565e8></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-311cca79><div class="content-container" data-v-311cca79><!--[--><!--]--><main class="main" data-v-311cca79><div style="position:relative;" class="vp-doc _api" data-v-311cca79><div><h1 id="api-reference" tabindex="-1">API Reference <a class="header-anchor" href="#api-reference" aria-label="Permalink to "API Reference""></a></h1><p>This page lists the current public exports from <code>@mp-lb/mdkit</code>. It is hand-written for now; a generated API reference from JSDoc/TypeScript declarations is a good follow-up once the public surface settles.</p><h2 id="editor" tabindex="-1">Editor <a class="header-anchor" href="#editor" aria-label="Permalink to "Editor""></a></h2><h3 id="mdkiteditor" tabindex="-1"><code>MdKitEditor</code> <a class="header-anchor" href="#mdkiteditor" aria-label="Permalink to "`MdKitEditor`""></a></h3><p>Primary editor component.</p><p>Local mode:</p><div class="language-tsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">MdKitEditor</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> value</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{markdown} </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">onChange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{setMarkdown} /></span></span></code></pre></div><p>Collaborative mode:</p><div class="language-tsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">MdKitEditor</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> collaboration</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{collaboration} /></span></span></code></pre></div><h3 id="mdkiteditorprops" tabindex="-1"><code>MdKitEditorProps</code> <a class="header-anchor" href="#mdkiteditorprops" aria-label="Permalink to "`MdKitEditorProps`""></a></h3><p>Props for <code>MdKitEditor</code>.</p><p>Local editing props:</p><ul><li><code>value: string</code></li><li><code>onChange?: (markdown: string) => void</code></li><li><code>onFocusChange?: (focused: boolean) => void</code></li><li><code>fillHeight?: boolean</code></li><li><code>instanceKey?: string | number</code></li><li><code>className?: string</code></li><li><code>style?: CSSProperties</code></li></ul><p>Collaborative editing props:</p><ul><li><code>collaboration: MdKitCollaborationSession</code></li><li><code>onFocusChange?: (focused: boolean) => void</code></li><li><code>fillHeight?: boolean</code></li><li><code>className?: string</code></li><li><code>style?: CSSProperties</code></li></ul><p><code>fillHeight</code> makes the editor fill its parent height, own its scroll area, and keep blank space below the last line clickable so it focuses the cursor at the end. Leave it off when the host application owns sizing and scrolling.</p><p>The package stylesheet includes reset-resistant markdown rules for headings, lists, code blocks, blockquotes, and links. Styling is controlled with CSS variables on <code>.mdkit-markdown-editor</code>. See <a href="./styling">Styling</a> for setup, dark mode, fonts, sizing, and theme customization.</p><h2 id="document-persistence" tabindex="-1">Document Persistence <a class="header-anchor" href="#document-persistence" aria-label="Permalink to "Document Persistence""></a></h2><h3 id="usemdkitdocument" tabindex="-1"><code>useMdKitDocument</code> <a class="header-anchor" href="#usemdkitdocument" aria-label="Permalink to "`useMdKitDocument`""></a></h3><p>Hook for loading, editing, saving, autosaving, and resyncing a markdown document through a storage adapter.</p><h3 id="mdkitdocumentcontroller" tabindex="-1"><code>MdKitDocumentController</code> <a class="header-anchor" href="#mdkitdocumentcontroller" aria-label="Permalink to "`MdKitDocumentController`""></a></h3><p>Return type for <code>useMdKitDocument</code>. It contains the current markdown value, status flags, save actions, resync actions, conflict details, and state setters used by editor UI.</p><h3 id="mdkitdocumenttoolbar" tabindex="-1"><code>MdKitDocumentToolbar</code> <a class="header-anchor" href="#mdkitdocumenttoolbar" aria-label="Permalink to "`MdKitDocumentToolbar`""></a></h3><p>Unstyled workflow controls for a connected markdown document. Render this above or near <code>MdKitEditor</code> when you want mdkit to handle common document actions without adopting a design system.</p><div class="language-tsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">MdKitDocumentToolbar</span></span>
|
|
22
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> document</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{document}</span></span>
|
|
23
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> versions</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{versions}</span></span>
|
|
24
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> collaboration</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{collaboration}</span></span>
|
|
25
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onOpenConflict</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=></span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> setConflictDialogOpen</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)}</span></span>
|
|
26
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> onOpenVersionHistory</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=></span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> setVersionPanelOpen</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)}</span></span>
|
|
27
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">/></span></span></code></pre></div><p>It renders save status, collaboration status, an optional version-history entry point labelled with the current version, and a conflict entry point via <code>onOpenConflict</code>.</p><p>Related type:</p><ul><li><code>MdKitDocumentToolbarProps</code></li></ul><h3 id="mdkitconflictpanel" tabindex="-1"><code>MdKitConflictPanel</code> <a class="header-anchor" href="#mdkitconflictpanel" aria-label="Permalink to "`MdKitConflictPanel`""></a></h3><p>Base panel for conflict resolution. It renders inline semantic HTML, previews the remote and local content snapshots, and uses the document controller actions to keep the remote document or keep the local editor content.</p><div class="language-tsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">MdKitConflictPanel</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> document</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{document} /></span></span></code></pre></div><p>It returns <code>null</code> when <code>document.conflict</code> is false. Use it next to <code>MdKitDocumentToolbar</code> when you want the base-panel workflow. If your app uses a modal, drawer, or editor-replacement view, put this panel inside your own shell.</p><p>Related type:</p><ul><li><code>MdKitConflictPanelProps</code></li></ul><h3 id="mdkitdocumentadapter" tabindex="-1"><code>MdKitDocumentAdapter</code> <a class="header-anchor" href="#mdkitdocumentadapter" aria-label="Permalink to "`MdKitDocumentAdapter`""></a></h3><p>Storage adapter contract. Implement this to connect document persistence to your backend.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentAdapter</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
28
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> readDocument</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentSnapshot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
29
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> writeDocument</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
|
|
30
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> input</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentWriteInput</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
31
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> )</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentWriteResult</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
32
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> resyncDocument</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentSnapshot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
33
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> listDocumentVersions</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
|
|
34
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
35
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> )</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentVersionSummary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[]>;</span></span>
|
|
36
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> readDocumentVersion</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">input</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
37
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
38
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> versionId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
39
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> })</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentVersionDetail</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
40
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span></code></pre></div><p>Required storage methods:</p><ul><li><code>readDocument</code> returns the current markdown snapshot.</li><li><code>writeDocument</code> persists markdown with the caller's base version.</li><li><code>resyncDocument</code> is optional and can force a fresh read from the canonical source.</li></ul><p>Optional versioning methods:</p><ul><li><code>listDocumentVersions</code> returns available versions for the document.</li><li><code>readDocumentVersion</code> returns a saved markdown snapshot for one version.</li></ul><p>Related storage types:</p><ul><li><code>MdKitDocumentSnapshot</code></li><li><code>MdKitDocumentWriteInput</code></li><li><code>MdKitDocumentWriteResult</code></li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentSnapshot</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
41
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> content</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
42
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> version</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionToken</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
43
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> updatedAt</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
44
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span>
|
|
45
|
-
<span class="line"></span>
|
|
46
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentWriteInput</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
47
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
48
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> content</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
49
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> baseVersion</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionToken</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
50
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span>
|
|
51
|
-
<span class="line"></span>
|
|
52
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentWriteResult</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span></span>
|
|
53
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
54
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> version</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionToken</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
55
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> updatedAt</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
56
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
|
|
57
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
58
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> conflict</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
59
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> version</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionToken</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
60
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> updatedAt</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
61
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> };</span></span></code></pre></div><h2 id="styling" tabindex="-1">Styling <a class="header-anchor" href="#styling" aria-label="Permalink to "Styling""></a></h2><h3 id="mdkitthemeeditor" tabindex="-1"><code>MdKitThemeEditor</code> <a class="header-anchor" href="#mdkitthemeeditor" aria-label="Permalink to "`MdKitThemeEditor`""></a></h3><p>Reusable controls for editing an <code>MdKitEditorTheme</code>. This component is optional and mainly intended for theme builders, documentation, and debug tools.</p><div class="language-tsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tsx</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> [</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">theme</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">setTheme</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">] </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> useState</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(darkMdKitEditorTheme);</span></span>
|
|
62
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> style</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createMdKitEditorThemeStyle</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(theme);</span></span>
|
|
63
|
-
<span class="line"></span>
|
|
64
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">MdKitThemeEditor</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> theme</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{theme} </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">onChange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{setTheme} /></span></span>
|
|
65
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">MdKitEditor</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> style</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{style} </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">value</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{markdown} </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">onChange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{setMarkdown} /></span></span></code></pre></div><p>Related exports:</p><ul><li><code>MdKitEditorTheme</code></li><li><code>MdKitEditorThemeStyle</code></li><li><code>createMdKitEditorThemeStyle</code></li><li><code>defaultMdKitEditorTheme</code></li><li><code>darkMdKitEditorTheme</code></li></ul><p><code>MdKitThemeEditor</code> also relies on the optional package stylesheet for its own layout. Without that stylesheet, it still renders normal form controls.</p><h2 id="version-history" tabindex="-1">Version History <a class="header-anchor" href="#version-history" aria-label="Permalink to "Version History""></a></h2><h3 id="usemdkitdocumentversions" tabindex="-1"><code>useMdKitDocumentVersions</code> <a class="header-anchor" href="#usemdkitdocumentversions" aria-label="Permalink to "`useMdKitDocumentVersions`""></a></h3><p>Hook for listing versions, reading a version detail, and tracking version history loading state.</p><h3 id="versionhistorypanel" tabindex="-1"><code>VersionHistoryPanel</code> <a class="header-anchor" href="#versionhistorypanel" aria-label="Permalink to "`VersionHistoryPanel`""></a></h3><p>UI component for rendering version history from <code>useMdKitDocumentVersions</code>.</p><p>Related types:</p><ul><li><code>MdKitDocumentVersionSummary</code></li><li><code>MdKitDocumentVersionDetail</code></li><li><code>MdKitDocumentVersionToken</code></li><li><code>MdKitDocumentVersionsController</code></li><li><code>UseMdKitDocumentVersionsOptions</code></li><li><code>VersionHistoryPanelProps</code></li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionToken</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
66
|
-
<span class="line"></span>
|
|
67
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionSummary</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
68
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> id</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
69
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> label</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
70
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> createdAt</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
71
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> authorLabel</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
72
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> version</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionToken</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
73
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span>
|
|
74
|
-
<span class="line"></span>
|
|
75
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionDetail</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentVersionSummary</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> &</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
76
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> content</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
77
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span></code></pre></div><h2 id="collaboration" tabindex="-1">Collaboration <a class="header-anchor" href="#collaboration" aria-label="Permalink to "Collaboration""></a></h2><h3 id="usemdkitcollaboration" tabindex="-1"><code>useMdKitCollaboration</code> <a class="header-anchor" href="#usemdkitcollaboration" aria-label="Permalink to "`useMdKitCollaboration`""></a></h3><p>Hook for creating a Hocuspocus/Yjs collaboration session for <code>MdKitEditor</code>.</p><p>Related types:</p><ul><li><code>MdKitCollaborationParticipant</code></li><li><code>MdKitCollaborationSession</code></li><li><code>MdKitCollaborationStatus</code></li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitCollaborationSession</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
78
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> collaborator</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitCollaborationParticipant</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
79
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> document</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Y</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">Doc</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
80
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> provider</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> HocuspocusProvider</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
81
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> roomName</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
82
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> status</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitCollaborationStatus</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
83
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span></code></pre></div><h2 id="transport-helpers" tabindex="-1">Transport Helpers <a class="header-anchor" href="#transport-helpers" aria-label="Permalink to "Transport Helpers""></a></h2><h3 id="createmdkitrestadapter" tabindex="-1"><code>createMdKitRestAdapter</code> <a class="header-anchor" href="#createmdkitrestadapter" aria-label="Permalink to "`createMdKitRestAdapter`""></a></h3><p>Creates an <code>MdKitDocumentAdapter</code> that talks to the mdkit REST endpoint shape.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> adapter</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createMdKitRestAdapter</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
|
|
84
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> baseUrl: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"https://api.example.com/mdkit"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
85
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><p>Exported from <code>@mp-lb/mdkit</code>.</p><h3 id="registermdkitfastify" tabindex="-1"><code>registerMdKitFastify</code> <a class="header-anchor" href="#registermdkitfastify" aria-label="Permalink to "`registerMdKitFastify`""></a></h3><p>Registers the matching REST endpoints on a Fastify app.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> registerMdKitFastify</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(app, {</span></span>
|
|
86
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> prefix: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"/mdkit"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
87
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> store,</span></span>
|
|
88
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><p>Exported from <code>@mp-lb/mdkit/fastify</code>.</p><h3 id="createmdkittrpcrouter" tabindex="-1"><code>createMdKitTrpcRouter</code> <a class="header-anchor" href="#createmdkittrpcrouter" aria-label="Permalink to "`createMdKitTrpcRouter`""></a></h3><p>Creates a tRPC router for document reads, writes, resync, version list/read, and version restore.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> app.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">register</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(fastifyTRPCPlugin, {</span></span>
|
|
89
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> prefix: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"/trpc"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
90
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> trpcOptions: {</span></span>
|
|
91
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> router: </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">createMdKitTrpcRouter</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(store),</span></span>
|
|
92
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
|
|
93
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><p>Exported from <code>@mp-lb/mdkit/trpc/server</code>.</p><h3 id="createmdkittrpcclient-and-createmdkittrpcadapter" tabindex="-1"><code>createMdKitTrpcClient</code> and <code>createMdKitTrpcAdapter</code> <a class="header-anchor" href="#createmdkittrpcclient-and-createmdkittrpcadapter" aria-label="Permalink to "`createMdKitTrpcClient` and `createMdKitTrpcAdapter`""></a></h3><p>Creates a typed tRPC client and turns it into an <code>MdKitDocumentAdapter</code>.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> client</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createMdKitTrpcClient</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ url: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">`${</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">apiUrl</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">}/trpc`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> });</span></span>
|
|
94
|
-
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> adapter</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createMdKitTrpcAdapter</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ client });</span></span></code></pre></div><p>Exported from <code>@mp-lb/mdkit/trpc/client</code>.</p><h3 id="mdkittransportstore" tabindex="-1"><code>MdKitTransportStore</code> <a class="header-anchor" href="#mdkittransportstore" aria-label="Permalink to "`MdKitTransportStore`""></a></h3><p>Backend store contract used by the Fastify and tRPC helpers.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitTransportStore</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
95
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> readDocument</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentSnapshot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
96
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> writeDocument</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
|
|
97
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> input</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> MdKitDocumentWriteInput</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
98
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> )</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentWriteResult</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
99
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> resyncDocument</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentSnapshot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
100
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> listDocumentVersions</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
|
|
101
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
102
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> )</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentVersionSummary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">[]>;</span></span>
|
|
103
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> readDocumentVersion</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">input</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
104
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
105
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> versionId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
106
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> })</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentVersionDetail</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
107
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> restoreDocumentVersion</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">input</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
|
|
108
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
109
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> versionId</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
|
|
110
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> })</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">MdKitDocumentWriteResult</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
111
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> readCollaborationState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">documentName</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">Uint8Array</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> null</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
112
|
-
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> writeCollaborationState</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">?</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span></span>
|
|
113
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> documentName</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
114
|
-
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;"> state</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Uint8Array</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
|
|
115
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> )</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Promise</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">void</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">>;</span></span>
|
|
116
|
-
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-311cca79 data-v-e2638793><!--[--><!--]--><!----><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-e2638793><span class="visually-hidden" id="doc-footer-aria-label" data-v-e2638793>Pager</span><div class="pager" data-v-e2638793><a class="VPLink link pager-link prev" href="/shadcn" data-v-e2638793><!--[--><span class="desc" data-v-e2638793>Previous page</span><span class="title" data-v-e2638793>Shadcn Plugin</span><!--]--></a></div><div class="pager" data-v-e2638793><a class="VPLink link pager-link next" href="/architecture" data-v-e2638793><!--[--><span class="desc" data-v-e2638793>Next page</span><span class="title" data-v-e2638793>Architecture</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
|
|
117
|
-
<script>window.__VP_HASH_MAP__=JSON.parse("{\"api.md\":\"asncK3PQ\",\"architecture.md\":\"BHQLarmZ\",\"index.md\":\"CITl-897\",\"shadcn.md\":\"C3idOo2N\",\"styling.md\":\"B2C6kVFa\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Markdown Editor Kit\",\"description\":\"Docs for the mdkit markdown editor package\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"Quick Start\",\"link\":\"/\"},{\"text\":\"Styling\",\"link\":\"/styling\"},{\"text\":\"Shadcn\",\"link\":\"/shadcn\"},{\"text\":\"API\",\"link\":\"/api\"},{\"text\":\"Architecture\",\"link\":\"/architecture\"}],\"sidebar\":[{\"text\":\"Guide\",\"items\":[{\"text\":\"Quick Start\",\"link\":\"/\"},{\"text\":\"Styling\",\"link\":\"/styling\"},{\"text\":\"Shadcn Plugin\",\"link\":\"/shadcn\"},{\"text\":\"API Reference\",\"link\":\"/api\"},{\"text\":\"Architecture\",\"link\":\"/architecture\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/mp-lb/mdkit\"}]},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":true}");</script>
|
|
118
|
-
|
|
119
|
-
</body>
|
|
120
|
-
</html>
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en-US" dir="ltr">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
6
|
-
<title>Architecture | Markdown Editor Kit</title>
|
|
7
|
-
<meta name="description" content="Docs for the mdkit markdown editor package">
|
|
8
|
-
<meta name="generator" content="VitePress v1.6.4">
|
|
9
|
-
<link rel="preload stylesheet" href="/assets/style.BtrGaL3i.css" as="style">
|
|
10
|
-
<link rel="preload stylesheet" href="/vp-icons.css" as="style">
|
|
11
|
-
|
|
12
|
-
<script type="module" src="/assets/app.BQvrHyG0.js"></script>
|
|
13
|
-
<link rel="preload" href="/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
|
|
14
|
-
<link rel="modulepreload" href="/assets/chunks/theme.CkCo6Nk1.js">
|
|
15
|
-
<link rel="modulepreload" href="/assets/chunks/framework.RRduUuAx.js">
|
|
16
|
-
<link rel="modulepreload" href="/assets/architecture.md.BHQLarmZ.lean.js">
|
|
17
|
-
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
|
18
|
-
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
|
|
19
|
-
</head>
|
|
20
|
-
<body>
|
|
21
|
-
<div id="app"><div class="Layout" data-v-2b1fb0c9><!--[--><!--]--><!--[--><span tabindex="-1" data-v-db89ae83></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-db89ae83>Skip to content</a><!--]--><!----><header class="VPNav" data-v-2b1fb0c9 data-v-acb86623><div class="VPNavBar" data-v-acb86623 data-v-77efa7eb><div class="wrapper" data-v-77efa7eb><div class="container" data-v-77efa7eb><div class="title" data-v-77efa7eb><div class="VPNavBarTitle has-sidebar" data-v-77efa7eb data-v-8a08158e><a class="title" href="/" data-v-8a08158e><!--[--><!--]--><!----><span data-v-8a08158e>Markdown Editor Kit</span><!--[--><!--]--></a></div></div><div class="content" data-v-77efa7eb><div class="content-body" data-v-77efa7eb><!--[--><!--]--><div class="VPNavBarSearch search" data-v-77efa7eb><!----></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-77efa7eb data-v-5412324d><span id="main-nav-aria-label" class="visually-hidden" data-v-5412324d> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Quick Start</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/styling" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Styling</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/shadcn" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Shadcn</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/api" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>API</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/architecture" tabindex="0" data-v-5412324d data-v-8ef452a0><!--[--><span data-v-8ef452a0>Architecture</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-77efa7eb data-v-a01193e5><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-a01193e5 data-v-4329f1c4 data-v-b8a6dba1><span class="check" data-v-b8a6dba1><span class="icon" data-v-b8a6dba1><!--[--><span class="vpi-sun sun" data-v-4329f1c4></span><span class="vpi-moon moon" data-v-4329f1c4></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-77efa7eb data-v-75a0fea7 data-v-01120ffe><!--[--><a class="VPSocialLink no-icon" href="https://github.com/mp-lb/mdkit" aria-label="github" target="_blank" rel="noopener" data-v-01120ffe data-v-5a6aee0b><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-77efa7eb data-v-c5dd4def data-v-a3183fa5><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-a3183fa5><span class="vpi-more-horizontal icon" data-v-a3183fa5></span></button><div class="menu" data-v-a3183fa5><div class="VPMenu" data-v-a3183fa5 data-v-dbe48bad><!----><!--[--><!--[--><!----><div class="group" data-v-c5dd4def><div class="item appearance" data-v-c5dd4def><p class="label" data-v-c5dd4def>Appearance</p><div class="appearance-action" data-v-c5dd4def><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-c5dd4def data-v-4329f1c4 data-v-b8a6dba1><span class="check" data-v-b8a6dba1><span class="icon" data-v-b8a6dba1><!--[--><span class="vpi-sun sun" data-v-4329f1c4></span><span class="vpi-moon moon" data-v-4329f1c4></span><!--]--></span></span></button></div></div></div><div class="group" data-v-c5dd4def><div class="item social-links" data-v-c5dd4def><div class="VPSocialLinks social-links-list" data-v-c5dd4def data-v-01120ffe><!--[--><a class="VPSocialLink no-icon" href="https://github.com/mp-lb/mdkit" aria-label="github" target="_blank" rel="noopener" data-v-01120ffe data-v-5a6aee0b><span class="vpi-social-github"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-77efa7eb data-v-da8b7b90><span class="container" data-v-da8b7b90><span class="top" data-v-da8b7b90></span><span class="middle" data-v-da8b7b90></span><span class="bottom" data-v-da8b7b90></span></span></button></div></div></div></div><div class="divider" data-v-77efa7eb><div class="divider-line" data-v-77efa7eb></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-2b1fb0c9 data-v-f4bea7e4><div class="container" data-v-f4bea7e4><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-f4bea7e4><span class="vpi-align-left menu-icon" data-v-f4bea7e4></span><span class="menu-text" data-v-f4bea7e4>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-f4bea7e4 data-v-15ddd090><button data-v-15ddd090>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-2b1fb0c9 data-v-e9f01ae8><div class="curtain" data-v-e9f01ae8></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-e9f01ae8><span class="visually-hidden" id="sidebar-aria-label" data-v-e9f01ae8> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-228ebfa9><section class="VPSidebarItem level-0 has-active" data-v-228ebfa9 data-v-be8e87ce><div class="item" role="button" tabindex="0" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><h2 class="text" data-v-be8e87ce>Guide</h2><!----></div><div class="items" data-v-be8e87ce><!--[--><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Quick Start</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/styling" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Styling</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/shadcn" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Shadcn Plugin</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/api" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>API Reference</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-be8e87ce data-v-be8e87ce><div class="item" data-v-be8e87ce><div class="indicator" data-v-be8e87ce></div><a class="VPLink link link" href="/architecture" data-v-be8e87ce><!--[--><p class="text" data-v-be8e87ce>Architecture</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-2b1fb0c9 data-v-6a1b1c35><div class="VPDoc has-sidebar has-aside" data-v-6a1b1c35 data-v-311cca79><!--[--><!--]--><div class="container" data-v-311cca79><div class="aside" data-v-311cca79><div class="aside-curtain" data-v-311cca79></div><div class="aside-container" data-v-311cca79><div class="aside-content" data-v-311cca79><div class="VPDocAside" data-v-311cca79 data-v-2fa565e8><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-2fa565e8 data-v-8080a522><div class="content" data-v-8080a522><div class="outline-marker" data-v-8080a522></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-8080a522>On this page</div><ul class="VPDocOutlineItem root" data-v-8080a522 data-v-44b0cffc><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-2fa565e8></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-311cca79><div class="content-container" data-v-311cca79><!--[--><!--]--><main class="main" data-v-311cca79><div style="position:relative;" class="vp-doc _architecture" data-v-311cca79><div><h1 id="architecture" tabindex="-1">Architecture <a class="header-anchor" href="#architecture" aria-label="Permalink to "Architecture""></a></h1><p>The editor package should keep UI concerns separate from persistence, versioning, and collaboration infrastructure.</p><h2 id="layers" tabindex="-1">Layers <a class="header-anchor" href="#layers" aria-label="Permalink to "Layers""></a></h2><h3 id="editor" tabindex="-1">Editor <a class="header-anchor" href="#editor" aria-label="Permalink to "Editor""></a></h3><p><code>MdKitEditor</code> is the public editor component.</p><p>For local editing, it accepts:</p><ul><li><code>value: string</code></li><li><code>onChange?: (markdown: string) => void</code></li><li><code>onFocusChange?: (focused: boolean) => void</code></li><li><code>instanceKey?: string | number</code></li></ul><p>It should behave like a fancy textarea from the consumer's point of view. It must not know about storage, versions, auth, servers, Hocuspocus, MongoDB, or the host application.</p><p>For collaborative editing, the same component accepts:</p><ul><li><code>collaboration: MdKitCollaborationSession</code></li><li><code>onFocusChange?: (focused: boolean) => void</code></li></ul><p>Collaboration needs a different editor engine internally because it is backed by Yjs state and remote cursors, but consumers should not need a separate editor component.</p><h3 id="headless-hooks" tabindex="-1">Headless Hooks <a class="header-anchor" href="#headless-hooks" aria-label="Permalink to "Headless Hooks""></a></h3><p>Storage, versioning, and collaboration controls should come from hooks and consumer-owned UI. A product can render those controls in a header, toolbar, side panel, command menu, or nowhere at all.</p><p>Hooks should expose enough state for consumers to decide which UI features are visible based on available adapters:</p><ul><li>storage adapter present: load/save UI and autosave can exist</li><li>version adapter present: version history UI can exist</li><li>collaboration adapter present: collaborative state and presence can exist</li></ul><p>Missing adapters should remove functionality, not break the editor.</p><h3 id="reference-integrations" tabindex="-1">Reference Integrations <a class="header-anchor" href="#reference-integrations" aria-label="Permalink to "Reference Integrations""></a></h3><p>Reference integrations should provide plug-and-play adapters for supported backends. The editor UI should depend on adapter interfaces, not implementation details.</p><p>Examples:</p><ul><li>JSON document storage</li><li>MongoDB-backed document storage</li><li>JSON or MongoDB version history</li><li>Hocuspocus/Yjs collaboration</li></ul><h2 id="ownership-rule" tabindex="-1">Ownership Rule <a class="header-anchor" href="#ownership-rule" aria-label="Permalink to "Ownership Rule""></a></h2><p>The frontend editor owns rendering and local editing state. Adapters own durable state and transport. The editor should never import database clients, server framework code, or backend-specific SDKs.</p><h2 id="package-boundaries" tabindex="-1">Package Boundaries <a class="header-anchor" href="#package-boundaries" aria-label="Permalink to "Package Boundaries""></a></h2><p>Packages should expose:</p><ul><li>pure types for adapter contracts</li><li>React hooks/components for UI behavior</li><li>optional adapter factories in separate entrypoints when we add reference integrations</li></ul><p>Reference adapters should be optional dependencies or split entrypoints so a basic consumer does not install server-only or backend-specific code.</p></div></div></main><footer class="VPDocFooter" data-v-311cca79 data-v-e2638793><!--[--><!--]--><!----><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-e2638793><span class="visually-hidden" id="doc-footer-aria-label" data-v-e2638793>Pager</span><div class="pager" data-v-e2638793><a class="VPLink link pager-link prev" href="/api" data-v-e2638793><!--[--><span class="desc" data-v-e2638793>Previous page</span><span class="title" data-v-e2638793>API Reference</span><!--]--></a></div><div class="pager" data-v-e2638793><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
|
|
22
|
-
<script>window.__VP_HASH_MAP__=JSON.parse("{\"api.md\":\"asncK3PQ\",\"architecture.md\":\"BHQLarmZ\",\"index.md\":\"CITl-897\",\"shadcn.md\":\"C3idOo2N\",\"styling.md\":\"B2C6kVFa\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Markdown Editor Kit\",\"description\":\"Docs for the mdkit markdown editor package\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"Quick Start\",\"link\":\"/\"},{\"text\":\"Styling\",\"link\":\"/styling\"},{\"text\":\"Shadcn\",\"link\":\"/shadcn\"},{\"text\":\"API\",\"link\":\"/api\"},{\"text\":\"Architecture\",\"link\":\"/architecture\"}],\"sidebar\":[{\"text\":\"Guide\",\"items\":[{\"text\":\"Quick Start\",\"link\":\"/\"},{\"text\":\"Styling\",\"link\":\"/styling\"},{\"text\":\"Shadcn Plugin\",\"link\":\"/shadcn\"},{\"text\":\"API Reference\",\"link\":\"/api\"},{\"text\":\"Architecture\",\"link\":\"/architecture\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/mp-lb/mdkit\"}]},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":true}");</script>
|
|
23
|
-
|
|
24
|
-
</body>
|
|
25
|
-
</html>
|