import{_ as o}from"./chunks/PageInfo.vue_vue_type_script_setup_true_lang.250b3e56.js";import{_ as n,o as p,c as t,H as r,k as s,a as l,Q as e}from"./chunks/framework.b7580407.js";import"./chunks/commonjsHelpers.725317a4.js";const q=JSON.parse('{"title":"VitePress Twoslash: VitePress Plugin for Shiki Twoslash","titleTemplate":false,"description":"Static code examples for VitePress using Shiki Twoslash.","frontmatter":{"description":"Static code examples for VitePress using Shiki Twoslash.","title":"VitePress Twoslash: VitePress Plugin for Shiki Twoslash","titleTemplate":false,"keywords":["getting-started","intro"]},"headers":[],"relativePath":"application/vitepress-plugin-shiki-twoslash/index.md","filePath":"application/vitepress-plugin-shiki-twoslash/index.md","lastUpdated":1710267201000}'),c={name:"application/vitepress-plugin-shiki-twoslash/index.md"},i=s("h1",{id:"andatoshiki-vitepress-plugin-shiki-twoslash",tabindex:"-1"},[l("@andatoshiki/vitepress-plugin-shiki-twoslash "),s("a",{class:"header-anchor",href:"#andatoshiki-vitepress-plugin-shiki-twoslash","aria-label":'Permalink to "@andatoshiki/vitepress-plugin-shiki-twoslash"'},"​")],-1),y=s("blockquote",null,[s("p",null,[l("Static code examples for "),s("a",{href:"https://vitepress.dev",target:"_blank",rel:"noreferrer"},"VitePress"),l(" using "),s("a",{href:"https://github.com/shikijs/twoslash",target:"_blank",rel:"noreferrer"},"Shiki Twoslash"),l(" — powered by the syntax engine of Visual Studio Code and the TypeScript compiler.")])],-1),d=s("h2",{id:"overview",tabindex:"-1"},[l("Overview "),s("a",{class:"header-anchor",href:"#overview","aria-label":'Permalink to "Overview"'},"​")],-1),u=s("p",null,"Try moving your cursor into the code block below:",-1),A=s("div",{class:"language-ts vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"ts"),s("pre",{class:"shiki github-dark-dimmed twoslash lsp",style:{"background-color":"#22272e",color:"#adbac7"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#768390"}},"// Removes 'readonly' attributes from a type's properties")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#ADBAC7"}},"<"),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#ADBAC7"}},"> "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"    "),s("span",{style:{color:"#F47067"}},"-readonly"),s("span",{style:{color:"#ADBAC7"}}," ["),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"in"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"keyof"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#ADBAC7"}},"]"),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#ADBAC7"}},"["),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#ADBAC7"}},"]")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"    "),s("span",{style:{color:"#F47067"}},"readonly"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) id: string"},"id")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"    "),s("span",{style:{color:"#F47067"}},"readonly"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) name: string"},"name")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type UnlockedAccount = {
    id: string;
    name: string;
}`},"UnlockedAccount")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#ADBAC7"}},"<"),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#ADBAC7"}},">")])])])]),s("pre",{class:"shiki github-light twoslash lsp",style:{"background-color":"#fff",color:"#24292e"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// Removes 'readonly' attributes from a type's properties")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#24292E"}},"<"),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#24292E"}},"> "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#D73A49"}},"-readonly"),s("span",{style:{color:"#24292E"}}," ["),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"in"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"keyof"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#24292E"}},"]"),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#24292E"}},"["),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#24292E"}},"]")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#D73A49"}},"readonly"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) id: string"},"id")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#D73A49"}},"readonly"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) name: string"},"name")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type UnlockedAccount = {
    id: string;
    name: string;
}`},"UnlockedAccount")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#24292E"}},"<"),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#24292E"}},">")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])],-1),h=s("p",null,"Pretty neat, right? To some extent, anything your editor can show you about code, Twoslash can show. For example, here is the real auto-complete for a VitePress config:",-1),C=s("div",{class:"language-ts vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"ts"),s("pre",{class:"shiki github-dark-dimmed twoslash lsp",style:{"background-color":"#22272e",color:"#adbac7"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"import"),s("span",{style:{color:"#ADBAC7"}},[l(" { "),s("data-lsp",{lsp:`(alias) function defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig"),l(" } ")]),s("span",{style:{color:"#F47067"}},"from"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'vitepress'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"export"),s("span",{style:{color:"#F69D50"}}," "),s("span",{style:{color:"#F47067"}},"default"),s("span",{style:{color:"#F69D50"}}," "),s("span",{style:{color:"#DCBDFB"}},[s("data-lsp",{lsp:`(alias) defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig")]),s("span",{style:{color:"#F69D50"}},"({")]),s("div",{class:"line"},[s("span",{style:{color:"#F69D50"}},"    "),s("span",{style:{color:"#ADBAC7"}},[s("data-lsp",{lsp:"(property) ti: any"},"ti")]),s("span",{style:{color:"#F69D50"}},",")]),s("div",{class:"meta-line"},[l("      "),s("span",{class:"inline-completions"},[s("ul",{class:"dropdown"},[s("li",{class:""},[s("span",null,[s("span",{class:"result-found"},"ti"),l("tle")])]),s("li",{class:""},[s("span",null,[s("span",{class:"result-found"},"ti"),l("tleTemplate")])])])])]),s("div",{class:"line"},[s("span",{style:{color:"#F69D50"}},"})")])])])]),s("pre",{class:"shiki github-light twoslash lsp",style:{"background-color":"#fff",color:"#24292e"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"import"),s("span",{style:{color:"#24292E"}},[l(" { "),s("data-lsp",{lsp:`(alias) function defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig"),l(" } ")]),s("span",{style:{color:"#D73A49"}},"from"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'vitepress'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"export"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"default"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`(alias) defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig")]),s("span",{style:{color:"#24292E"}},"({")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},[l("    "),s("data-lsp",{lsp:"(property) ti: any"},"ti"),l(",")])]),s("div",{class:"meta-line"},[l("      "),s("span",{class:"inline-completions"},[s("ul",{class:"dropdown"},[s("li",{class:""},[s("span",null,[s("span",{class:"result-found"},"ti"),l("tle")])]),s("li",{class:""},[s("span",null,[s("span",{class:"result-found"},"ti"),l("tleTemplate")])])])])]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"})")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])],-1),m=e(`<p>The name Twoslash refers to specially formatted comments (e.g. <code>// ^?</code>) which can be used to set up your environment, like compiler flags or separate input files. It couldn&#39;t be easier to set up and start creating incredible code examples!</p><h2 id="install" tabindex="-1">Install <a class="header-anchor" href="#install" aria-label="Permalink to &quot;Install&quot;">​</a></h2><p>Install <code>@andatoshiki/vitepress-plugin-shiki-twoslash</code> (requires <code>vitepress@&gt;=1.0.0-alpha.61</code>).</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-NYJm3" id="tab-Y_KRhaj" checked="checked"><label for="tab-Y_KRhaj">pnpm</label><input type="radio" name="group-NYJm3" id="tab-LVnKVoj"><label for="tab-LVnKVoj">npm</label><input type="radio" name="group-NYJm3" id="tab-9cD2hiv"><label for="tab-9cD2hiv">yarn</label></div><div class="blocks"><div class="language-bash vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark-dimmed vp-code-dark"><code><span class="line"><span style="color:#F69D50;">pnpm</span><span style="color:#ADBAC7;"> </span><span style="color:#96D0FF;">add</span><span style="color:#ADBAC7;"> </span><span style="color:#96D0FF;">@andatoshiki/vitepress-plugin-shiki-twoslash</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">pnpm</span><span style="color:#24292E;"> </span><span style="color:#032F62;">add</span><span style="color:#24292E;"> </span><span style="color:#032F62;">@andatoshiki/vitepress-plugin-shiki-twoslash</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark-dimmed vp-code-dark"><code><span class="line"><span style="color:#F69D50;">npm</span><span style="color:#ADBAC7;"> </span><span style="color:#96D0FF;">i</span><span style="color:#ADBAC7;"> </span><span style="color:#96D0FF;">@andatoshiki/vitepress-plugin-shiki-twoslash</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">npm</span><span style="color:#24292E;"> </span><span style="color:#032F62;">i</span><span style="color:#24292E;"> </span><span style="color:#032F62;">@andatoshiki/vitepress-plugin-shiki-twoslash</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-bash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark-dimmed vp-code-dark"><code><span class="line"><span style="color:#F69D50;">yarn</span><span style="color:#ADBAC7;"> </span><span style="color:#96D0FF;">add</span><span style="color:#ADBAC7;"> </span><span style="color:#96D0FF;">@andatoshiki/vitepress-plugin-shiki-twoslash</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">yarn</span><span style="color:#24292E;"> </span><span style="color:#032F62;">add</span><span style="color:#24292E;"> </span><span style="color:#032F62;">@andatoshiki/vitepress-plugin-shiki-twoslash</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>Until <code>shiki-twoslash</code> uses the same version of <code>shiki</code> as VitePress, you must override the following packages&#39; <code>shiki</code> versions for syntax highlighting to look the same.</p><div class="language-json vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki github-dark-dimmed vp-code-dark"><code><span class="line"><span style="color:#ADBAC7;">{</span></span>
<span class="line"><span style="color:#ADBAC7;">    </span><span style="color:#8DDB8C;">&quot;pnpm&quot;</span><span style="color:#ADBAC7;">: {</span></span>
<span class="line"><span style="color:#ADBAC7;">        </span><span style="color:#8DDB8C;">&quot;overrides&quot;</span><span style="color:#ADBAC7;">: {</span></span>
<span class="line"><span style="color:#ADBAC7;">            </span><span style="color:#8DDB8C;">&quot;remark-shiki-twoslash&gt;shiki&quot;</span><span style="color:#ADBAC7;">: </span><span style="color:#96D0FF;">&quot;^0.14.1&quot;</span><span style="color:#ADBAC7;">,</span></span>
<span class="line"><span style="color:#ADBAC7;">            </span><span style="color:#8DDB8C;">&quot;shiki-twoslash&gt;shiki&quot;</span><span style="color:#ADBAC7;">: </span><span style="color:#96D0FF;">&quot;^0.14.1&quot;</span></span>
<span class="line"><span style="color:#ADBAC7;">        }</span></span>
<span class="line"><span style="color:#ADBAC7;">    }</span></span>
<span class="line"><span style="color:#ADBAC7;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">{</span></span>
<span class="line"><span style="color:#24292E;">    </span><span style="color:#005CC5;">&quot;pnpm&quot;</span><span style="color:#24292E;">: {</span></span>
<span class="line"><span style="color:#24292E;">        </span><span style="color:#005CC5;">&quot;overrides&quot;</span><span style="color:#24292E;">: {</span></span>
<span class="line"><span style="color:#24292E;">            </span><span style="color:#005CC5;">&quot;remark-shiki-twoslash&gt;shiki&quot;</span><span style="color:#24292E;">: </span><span style="color:#032F62;">&quot;^0.14.1&quot;</span><span style="color:#24292E;">,</span></span>
<span class="line"><span style="color:#24292E;">            </span><span style="color:#005CC5;">&quot;shiki-twoslash&gt;shiki&quot;</span><span style="color:#24292E;">: </span><span style="color:#032F62;">&quot;^0.14.1&quot;</span></span>
<span class="line"><span style="color:#24292E;">        }</span></span>
<span class="line"><span style="color:#24292E;">    }</span></span>
<span class="line"><span style="color:#24292E;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><p>Tracked in an upstream issue: <a href="https://github.com/shikijs/twoslash/issues/180" target="_blank" rel="noreferrer">https://github.com/shikijs/twoslash/issues/180</a></p></div><h2 id="configure" tabindex="-1">Configure <a class="header-anchor" href="#configure" aria-label="Permalink to &quot;Configure&quot;">​</a></h2><p>First, wrap your VitePress config file with the <code>withTwoslash</code> wrapper.</p>`,7),g=s("div",{class:"language-ts vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"ts"),s("pre",{class:"shiki github-dark-dimmed twoslash lsp",style:{"background-color":"#22272e",color:"#adbac7"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#768390"}},"// .vitepress/config.[ext]")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"import"),s("span",{style:{color:"#ADBAC7"}},[l(" { "),s("data-lsp",{lsp:`(alias) function defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig"),l(" } ")]),s("span",{style:{color:"#F47067"}},"from"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'vitepress'")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"import"),s("span",{style:{color:"#ADBAC7"}},[l(" { "),s("data-lsp",{lsp:`(alias) function withTwoslash(config: UserConfig<DefaultTheme.Config>): Promise<UserConfig<DefaultTheme.Config>>
import withTwoslash`},"withTwoslash"),l(" } ")]),s("span",{style:{color:"#F47067"}},"from"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'@andatoshiki/vitepress-plugin-shiki-twoslash'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"export"),s("span",{style:{color:"#F69D50"}}," "),s("span",{style:{color:"#F47067"}},"default"),s("span",{style:{color:"#F69D50"}}," "),s("span",{style:{color:"#DCBDFB"}},[s("data-lsp",{lsp:`(alias) withTwoslash(config: UserConfig<DefaultTheme.Config>): Promise<UserConfig<DefaultTheme.Config>>
import withTwoslash`},"withTwoslash")]),s("span",{style:{color:"#F69D50"}},"(")]),s("div",{class:"line"},[s("span",{style:{color:"#F69D50"}},"    "),s("span",{style:{color:"#DCBDFB"}},[s("data-lsp",{lsp:`(alias) defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig")]),s("span",{style:{color:"#F69D50"}},"({")]),s("div",{class:"line"},[s("span",{style:{color:"#F69D50"}},"        "),s("span",{style:{color:"#768390"}},"// Your VitePress config")]),s("div",{class:"line"},[s("span",{style:{color:"#F69D50"}},"    })")]),s("div",{class:"line"},[s("span",{style:{color:"#F69D50"}},")")])])])]),s("pre",{class:"shiki github-light twoslash lsp",style:{"background-color":"#fff",color:"#24292e"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// .vitepress/config.[ext]")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"import"),s("span",{style:{color:"#24292E"}},[l(" { "),s("data-lsp",{lsp:`(alias) function defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig"),l(" } ")]),s("span",{style:{color:"#D73A49"}},"from"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'vitepress'")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"import"),s("span",{style:{color:"#24292E"}},[l(" { "),s("data-lsp",{lsp:`(alias) function withTwoslash(config: UserConfig<DefaultTheme.Config>): Promise<UserConfig<DefaultTheme.Config>>
import withTwoslash`},"withTwoslash"),l(" } ")]),s("span",{style:{color:"#D73A49"}},"from"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'@andatoshiki/vitepress-plugin-shiki-twoslash'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"export"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"default"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`(alias) withTwoslash(config: UserConfig<DefaultTheme.Config>): Promise<UserConfig<DefaultTheme.Config>>
import withTwoslash`},"withTwoslash")]),s("span",{style:{color:"#24292E"}},"(")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`(alias) defineConfig(config: UserConfig<DefaultTheme.Config>): UserConfig<DefaultTheme.Config>
import defineConfig`},"defineConfig")]),s("span",{style:{color:"#24292E"}},"({")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"        "),s("span",{style:{color:"#6A737D"}},"// Your VitePress config")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    })")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},")")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])],-1),D=s("p",null,[l("Then, import "),s("code",null,"@andatoshiki/vitepress-plugin-shiki-twoslash/styles.css"),l(" into your theme.")],-1),f=s("div",{class:"language-ts vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"ts"),s("pre",{class:"shiki github-dark-dimmed twoslash lsp",style:{"background-color":"#22272e",color:"#adbac7"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#768390"}},"// .vitepress/theme/index.ts")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"import"),s("span",{style:{color:"#ADBAC7"}},[l(),s("data-lsp",{lsp:`(alias) const defaultTheme: {
    Layout: DefineComponent;
    enhanceApp: (ctx: EnhanceAppContext) => void;
}
import defaultTheme`},"defaultTheme"),l()]),s("span",{style:{color:"#F47067"}},"from"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'vitepress/theme'")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"import"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'@andatoshiki/vitepress-plugin-shiki-twoslash/styles.css'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"export"),s("span",{style:{color:"#F69D50"}}," "),s("span",{style:{color:"#F47067"}},"default"),s("span",{style:{color:"#F69D50"}}," "),s("span",{style:{color:"#ADBAC7"}},[s("data-lsp",{lsp:`(alias) const defaultTheme: {
    Layout: DefineComponent;
    enhanceApp: (ctx: EnhanceAppContext) => void;
}
import defaultTheme`},"defaultTheme")])])])])]),s("pre",{class:"shiki github-light twoslash lsp",style:{"background-color":"#fff",color:"#24292e"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// .vitepress/theme/index.ts")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"import"),s("span",{style:{color:"#24292E"}},[l(),s("data-lsp",{lsp:`(alias) const defaultTheme: {
    Layout: DefineComponent;
    enhanceApp: (ctx: EnhanceAppContext) => void;
}
import defaultTheme`},"defaultTheme"),l()]),s("span",{style:{color:"#D73A49"}},"from"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'vitepress/theme'")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"import"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'@andatoshiki/vitepress-plugin-shiki-twoslash/styles.css'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"export"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"default"),s("span",{style:{color:"#24292E"}},[l(),s("data-lsp",{lsp:`(alias) const defaultTheme: {
    Layout: DefineComponent;
    enhanceApp: (ctx: EnhanceAppContext) => void;
}
import defaultTheme`},"defaultTheme")])])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])],-1),v=e(`<div class="tip custom-block"><p class="custom-block-title">TIP</p><p>You can <a href="./config/reference">configure VitePress Twoslash</a> using the <code>twoslash</code> property added to <code>defineConfig</code>.</p></div><h2 id="add-twoslash" tabindex="-1">Add Twoslash <a class="header-anchor" href="#add-twoslash" aria-label="Permalink to &quot;Add Twoslash&quot;">​</a></h2><p>Finally, add the <code>twoslash</code> attribute to markdown fenced code blocks.</p><div class="language-md vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark-dimmed vp-code-dark"><code><span class="line"><span style="color:#ADBAC7;">\`\`\`ts twoslash</span></span>
<span class="line"><span style="color:#768390;">// Removes &#39;readonly&#39; attributes from a type&#39;s properties</span></span>
<span class="line"><span style="color:#F47067;">type</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">CreateMutable</span><span style="color:#ADBAC7;">&lt;</span><span style="color:#F69D50;">Type</span><span style="color:#ADBAC7;">&gt; </span><span style="color:#F47067;">=</span><span style="color:#ADBAC7;"> {</span></span>
<span class="line"><span style="color:#ADBAC7;">    </span><span style="color:#F47067;">-readonly</span><span style="color:#ADBAC7;"> [</span><span style="color:#F69D50;">Property</span><span style="color:#ADBAC7;"> </span><span style="color:#F47067;">in</span><span style="color:#ADBAC7;"> </span><span style="color:#F47067;">keyof</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">Type</span><span style="color:#ADBAC7;">]</span><span style="color:#F47067;">:</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">Type</span><span style="color:#ADBAC7;">[</span><span style="color:#F69D50;">Property</span><span style="color:#ADBAC7;">]</span></span>
<span class="line"><span style="color:#ADBAC7;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#F47067;">type</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">LockedAccount</span><span style="color:#ADBAC7;"> </span><span style="color:#F47067;">=</span><span style="color:#ADBAC7;"> {</span></span>
<span class="line"><span style="color:#ADBAC7;">    </span><span style="color:#F47067;">readonly</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">id</span><span style="color:#F47067;">:</span><span style="color:#ADBAC7;"> </span><span style="color:#6CB6FF;">string</span></span>
<span class="line"><span style="color:#ADBAC7;">    </span><span style="color:#F47067;">readonly</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">name</span><span style="color:#F47067;">:</span><span style="color:#ADBAC7;"> </span><span style="color:#6CB6FF;">string</span></span>
<span class="line"><span style="color:#ADBAC7;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#F47067;">type</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">UnlockedAccount</span><span style="color:#ADBAC7;"> </span><span style="color:#F47067;">=</span><span style="color:#ADBAC7;"> </span><span style="color:#F69D50;">CreateMutable</span><span style="color:#ADBAC7;">&lt;</span><span style="color:#F69D50;">LockedAccount</span><span style="color:#ADBAC7;">&gt;</span></span>
<span class="line"><span style="color:#768390;">//   ^?</span></span>
<span class="line"><span style="color:#ADBAC7;">\`\`\`</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">\`\`\`ts twoslash</span></span>
<span class="line"><span style="color:#6A737D;">// Removes &#39;readonly&#39; attributes from a type&#39;s properties</span></span>
<span class="line"><span style="color:#D73A49;">type</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">CreateMutable</span><span style="color:#24292E;">&lt;</span><span style="color:#6F42C1;">Type</span><span style="color:#24292E;">&gt; </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {</span></span>
<span class="line"><span style="color:#24292E;">    </span><span style="color:#D73A49;">-readonly</span><span style="color:#24292E;"> [</span><span style="color:#6F42C1;">Property</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">in</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">keyof</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">Type</span><span style="color:#24292E;">]</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">Type</span><span style="color:#24292E;">[</span><span style="color:#6F42C1;">Property</span><span style="color:#24292E;">]</span></span>
<span class="line"><span style="color:#24292E;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#D73A49;">type</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">LockedAccount</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {</span></span>
<span class="line"><span style="color:#24292E;">    </span><span style="color:#D73A49;">readonly</span><span style="color:#24292E;"> </span><span style="color:#E36209;">id</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">string</span></span>
<span class="line"><span style="color:#24292E;">    </span><span style="color:#D73A49;">readonly</span><span style="color:#24292E;"> </span><span style="color:#E36209;">name</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">string</span></span>
<span class="line"><span style="color:#24292E;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#D73A49;">type</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">UnlockedAccount</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">CreateMutable</span><span style="color:#24292E;">&lt;</span><span style="color:#6F42C1;">LockedAccount</span><span style="color:#24292E;">&gt;</span></span>
<span class="line"><span style="color:#6A737D;">//   ^?</span></span>
<span class="line"><span style="color:#24292E;">\`\`\`</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br></div></div><p>And your code blocks will be twoslashified!</p>`,5),b=s("div",{class:"language-ts vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"ts"),s("pre",{class:"shiki github-dark-dimmed twoslash lsp",style:{"background-color":"#22272e",color:"#adbac7"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#768390"}},"// Removes 'readonly' attributes from a type's properties")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#ADBAC7"}},"<"),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#ADBAC7"}},"> "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"    "),s("span",{style:{color:"#F47067"}},"-readonly"),s("span",{style:{color:"#ADBAC7"}}," ["),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"in"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"keyof"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#ADBAC7"}},"]"),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#ADBAC7"}},"["),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#ADBAC7"}},"]")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"    "),s("span",{style:{color:"#F47067"}},"readonly"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) id: string"},"id")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"    "),s("span",{style:{color:"#F47067"}},"readonly"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) name: string"},"name")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type UnlockedAccount = {
    id: string;
    name: string;
}`,style:{"border-bottom":"solid 2px lightgrey"}},"UnlockedAccount")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#ADBAC7"}},"<"),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#ADBAC7"}},">")]),s("div",{class:"meta-line"},[s("span",{class:"popover-prefix"},"           "),s("span",{class:"popover"},[s("div",{class:"arrow"}),l(`type UnlockedAccount = {
    id: string;
    name: string;
}`)])])])])]),s("pre",{class:"shiki github-light twoslash lsp",style:{"background-color":"#fff",color:"#24292e"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// Removes 'readonly' attributes from a type's properties")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#24292E"}},"<"),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#24292E"}},"> "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#D73A49"}},"-readonly"),s("span",{style:{color:"#24292E"}}," ["),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"in"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"keyof"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#24292E"}},"]"),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Type in type CreateMutable<Type>"},"Type")]),s("span",{style:{color:"#24292E"}},"["),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"(type parameter) Property"},"Property")]),s("span",{style:{color:"#24292E"}},"]")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," {")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#D73A49"}},"readonly"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) id: string"},"id")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"    "),s("span",{style:{color:"#D73A49"}},"readonly"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) name: string"},"name")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#24292E"}},"}")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type UnlockedAccount = {
    id: string;
    name: string;
}`,style:{"border-bottom":"solid 2px lightgrey"}},"UnlockedAccount")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type CreateMutable<Type> = { -readonly [Property in keyof Type]: Type[Property]; }"},"CreateMutable")]),s("span",{style:{color:"#24292E"}},"<"),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type LockedAccount = {
    readonly id: string;
    readonly name: string;
}`},"LockedAccount")]),s("span",{style:{color:"#24292E"}},">")]),s("div",{class:"meta-line"},[s("span",{class:"popover-prefix"},"           "),s("span",{class:"popover"},[s("div",{class:"arrow"}),l(`type UnlockedAccount = {
    id: string;
    name: string;
}`)])])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br"),s("span",{class:"line-number"},"2"),s("br"),s("span",{class:"line-number"},"3"),s("br"),s("span",{class:"line-number"},"4"),s("br")])],-1);function F(k,T,E,B,w,_){const a=o;return p(),t("div",null,[i,r(a,{readTime:"2",words:"437"}),y,d,u,A,h,C,m,g,D,f,v,b])}const M=n(c,[["render",F]]);export{q as __pageData,M as default};