andatoshiki/toshiki-notebook
1
0
Fork 0
mirror of https://github.com/andatoshiki/toshiki-notebook.git synced 2026-06-06 04:34:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity
a4375468cb
toshiki-notebook/assets/application_vitepress-plugin-shiki-twoslash_api_includes.md.fcb33628.js

100 lines
32 KiB
JavaScript
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import{_ as a}from"./chunks/PageInfo.vue_vue_type_script_setup_true_lang.250b3e56.js";import{_ as o,o as t,c as r,H as p,k as s,a as e,Q as l}from"./chunks/framework.b7580407.js";import"./chunks/commonjsHelpers.725317a4.js";const U=JSON.parse('{"title":"Includes","description":"Include re-usable TypeScript blocks in your code examples.","frontmatter":{"description":"Include re-usable TypeScript blocks in your code examples.","title":"Includes"},"headers":[],"relativePath":"application/vitepress-plugin-shiki-twoslash/api/includes.md","filePath":"application/vitepress-plugin-shiki-twoslash/api/includes.md","lastUpdated":1713421977000}'),c={name:"application/vitepress-plugin-shiki-twoslash/api/includes.md"},i=s("h1",{id:"includes",tabindex:"-1"},[e("Includes "),s("a",{class:"header-anchor",href:"#includes","aria-label":'Permalink to "Includes"'},"​")],-1),d=l('<p>As your documentation grows, you may need a way of re-using code blocks to prevent code duplication. Shiki Twoslash provides a simple includes system.</p><h2 id="defining-a-re-usable-block" tabindex="-1">Defining a re-usable block <a class="header-anchor" href="#defining-a-re-usable-block" aria-label="Permalink to &quot;Defining a re-usable block&quot;">​</a></h2><p>Re-usable code blocks are defined by the <code>twoslash</code> language, followed by the <code>include</code> keyword and the reference name of your choice.</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;">```twoslash include myBlock</span></span>\n<span class="line"><span style="color:#ADBAC7;">type SomeString = string</span></span>\n<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;">```twoslash include myBlock</span></span>\n<span class="line"><span style="color:#24292E;">type SomeString = string</span></span>\n<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></div></div><h3 id="incremental-steps" tabindex="-1">Incremental steps <a class="header-anchor" href="#incremental-steps" aria-label="Permalink to &quot;Incremental steps&quot;">​</a></h3><p>Shiki Twoslash also provide the ability to define incremental steps through the definition of re-usable blocks. This means whenever a new step is delimited down the code, it will also include previous steps. These are <strong>not groups</strong>.</p><ul><li>Incremental steps are delimited by <code>// - [name of the step]</code></li><li>They are named <strong>at the end</strong> of the actual code</li></ul><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;">```twoslash include myBlockWithSteps</span></span>\n<span class="line"><span style="color:#ADBAC7;">type SomeString = string</span></span>\n<span class="line"><span style="color:#ADBAC7;">// - base</span></span>\n<span class="line"><span style="color:#ADBAC7;">type SomeUser = { name: string; mail?: SomeUserMail }</span></span>\n<span class="line"><span style="color:#ADBAC7;">type SomeUserMail = { content: string; verified: boolean }</span></span>\n<span class="line"><span style="color:#ADBAC7;">// - afterUserDefinitions</span></span>\n<span class="line"><span style="color:#ADBAC7;">type SomeGroup = { name: string; members: SomeUser[] }</span></span>\n<span class="line"><span style="color:#ADBAC7;">// - afterGroupDefinitions</span></span>\n<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;">```twoslash include myBlockWithSteps</span></span>\n<span class="line"><span style="color:#24292E;">type SomeString = string</span></span>\n<span class="line"><span style="color:#24292E;">// - base</span></span>\n<span class="line"><span style="color:#24292E;">type SomeUser = { name: string; mail?: SomeUserMail }</span></span>\n<span class="line"><span style="color:#24292E;">type SomeUserMail = { content: string; verified: boolean }</span></span>\n<span class="line"><span style="color:#24292E;">// - afterUserDefinitions</span></span>\n<span class="line"><span style="color:#24292E;">type SomeGroup = { name: string; members: SomeUser[] }</span></span>\n<span class="line"><span style="color:#24292E;">// - afterGroupDefinitions</span></span>\n<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></div></div><h2 id="including-a-whole-block" tabindex="-1">Including a whole block <a class="header-anchor" href="#including-a-whole-block" aria-label="Permalink to &quot;Including a whole block&quot;">​</a></h2><p>To include a re-usable block, add <code>// @include: [block name]</code> in your code block.</p><div class="language-twoslash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">twoslash</span><pre></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div>',11),y=s("div",{class:"vp-code-group vp-adaptive-theme"},[s("div",{class:"tabs"},[s("input",{type:"radio",name:"group-wQklj",id:"tab-Rk99Fet",checked:"checked"}),s("label",{for:"tab-Rk99Fet"},"output"),s("input",{type:"radio",name:"group-wQklj",id:"tab-BKeHxJg"}),s("label",{for:"tab-BKeHxJg"},"markdown")]),s("div",{class:"blocks"},[s("div",{class:"language-ts vp-adaptive-theme active 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"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type SomeString = string"},"SomeString")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"const"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},[s("data-lsp",{lsp:"const a: string"},"a")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type SomeString = string"},"SomeString")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'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:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type SomeString = string"},"SomeString")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"const"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},[s("data-lsp",{lsp:"const a: string"},"a")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type SomeString = string"},"SomeString")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'string'")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])]),s("div",{class:"language-md vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"md"),s("pre",{class:"shiki github-dark-dimmed vp-code-dark"},[s("code",null,[s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```twoslash include myBlock")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeString = string")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```")]),e(`
`),s("span",{class:"line"}),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```ts twoslash")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#768390"}},"// @include: myBlock")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#F47067"}},"const"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"a"),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},"SomeString"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#96D0FF"}},"'string'")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```")])])]),s("pre",{class:"shiki github-light vp-code-light"},[s("code",null,[s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```twoslash include myBlock")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeString = string")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```")]),e(`
`),s("span",{class:"line"}),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```ts twoslash")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// @include: myBlock")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#D73A49"}},"const"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"a"),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},"SomeString"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#032F62"}},"'string'")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```")])])]),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"),s("span",{class:"line-number"},"5"),s("br"),s("span",{class:"line-number"},"6"),s("br"),s("span",{class:"line-number"},"7"),s("br"),s("span",{class:"line-number"},"8"),s("br")])])])],-1),m=l('<h2 id="including-a-block-step" tabindex="-1">Including a block step <a class="header-anchor" href="#including-a-block-step" aria-label="Permalink to &quot;Including a block step&quot;">​</a></h2><p>To include a re-usable block at a specific step, add <code>// @include: [block name]-[step name]</code> in your code block.</p><div class="language-twoslash vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">twoslash</span><pre></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div>',3),u=s("div",{class:"vp-code-group vp-adaptive-theme"},[s("div",{class:"tabs"},[s("input",{type:"radio",name:"group-h3zDv",id:"tab-dd89axX",checked:"checked"}),s("label",{for:"tab-dd89axX"},"output"),s("input",{type:"radio",name:"group-h3zDv",id:"tab-KNGlRRX"}),s("label",{for:"tab-KNGlRRX"},"markdown")]),s("div",{class:"blocks"},[s("div",{class:"language-ts vp-adaptive-theme active 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"}},"type"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"type SomeString = string"},"SomeString")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string")]),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 SomeUser = {
name: string;
mail?: SomeUserMail | undefined;
}`},"SomeUser")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),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("span",{style:{color:"#ADBAC7"}},"; "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) mail?: SomeUserMail | undefined"},"mail")]),s("span",{style:{color:"#F47067"}},"?:"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#ADBAC7"}}," }")]),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 SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," { "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) content: string"},"content")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"string"),s("span",{style:{color:"#ADBAC7"}},"; "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:"(property) verified: boolean"},"verified")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"boolean"),s("span",{style:{color:"#ADBAC7"}}," }")]),s("div",{class:"line"},[s("span",{style:{color:"#F47067"}},"const"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},[s("data-lsp",{lsp:"const mail: SomeUserMail"},"mail")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}},[e(" { "),s("data-lsp",{lsp:"(property) content: string"},"content"),e(": ")]),s("span",{style:{color:"#96D0FF"}},"'some-email'"),s("span",{style:{color:"#ADBAC7"}},[e(", "),s("data-lsp",{lsp:"(property) verified: boolean"},"verified"),e(": ")]),s("span",{style:{color:"#6CB6FF"}},"true"),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:"#D73A49"}},"type"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:"type SomeString = string"},"SomeString")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string")]),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 SomeUser = {
name: string;
mail?: SomeUserMail | undefined;
}`},"SomeUser")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),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("span",{style:{color:"#24292E"}},"; "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) mail?: SomeUserMail | undefined"},"mail")]),s("span",{style:{color:"#D73A49"}},"?:"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#24292E"}}," }")]),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 SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," { "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) content: string"},"content")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"string"),s("span",{style:{color:"#24292E"}},"; "),s("span",{style:{color:"#E36209"}},[s("data-lsp",{lsp:"(property) verified: boolean"},"verified")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"boolean"),s("span",{style:{color:"#24292E"}}," }")]),s("div",{class:"line"},[s("span",{style:{color:"#D73A49"}},"const"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},[s("data-lsp",{lsp:"const mail: SomeUserMail"},"mail")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}},[e(" { "),s("data-lsp",{lsp:"(property) content: string"},"content"),e(": ")]),s("span",{style:{color:"#032F62"}},"'some-email'"),s("span",{style:{color:"#24292E"}},[e(", "),s("data-lsp",{lsp:"(property) verified: boolean"},"verified"),e(": ")]),s("span",{style:{color:"#005CC5"}},"true"),s("span",{style:{color:"#24292E"}}," }")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])]),s("div",{class:"language-md vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"md"),s("pre",{class:"shiki github-dark-dimmed vp-code-dark"},[s("code",null,[s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```twoslash include myBlockWithSteps")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeString = string")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"// - base")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeUser = { name: string; mail?: SomeUserMail }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeUserMail = { content: string; verified: boolean }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"// - afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeGroup = { name: string; members: SomeUser[] }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"// - afterGroupDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```")]),e(`
`),s("span",{class:"line"}),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```ts twoslash")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#768390"}},"// @include: myBlockWithSteps-afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#F47067"}},"const"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"mail"),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},"SomeUserMail"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," { content: "),s("span",{style:{color:"#96D0FF"}},"'some-email'"),s("span",{style:{color:"#ADBAC7"}},", verified: "),s("span",{style:{color:"#6CB6FF"}},"true"),s("span",{style:{color:"#ADBAC7"}}," }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```")])])]),s("pre",{class:"shiki github-light vp-code-light"},[s("code",null,[s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```twoslash include myBlockWithSteps")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeString = string")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"// - base")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeUser = { name: string; mail?: SomeUserMail }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeUserMail = { content: string; verified: boolean }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"// - afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeGroup = { name: string; members: SomeUser[] }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"// - afterGroupDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```")]),e(`
`),s("span",{class:"line"}),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```ts twoslash")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// @include: myBlockWithSteps-afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#D73A49"}},"const"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"mail"),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},"SomeUserMail"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," { content: "),s("span",{style:{color:"#032F62"}},"'some-email'"),s("span",{style:{color:"#24292E"}},", verified: "),s("span",{style:{color:"#005CC5"}},"true"),s("span",{style:{color:"#24292E"}}," }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```")])])]),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"),s("span",{class:"line-number"},"5"),s("br"),s("span",{class:"line-number"},"6"),s("br"),s("span",{class:"line-number"},"7"),s("br"),s("span",{class:"line-number"},"8"),s("br"),s("span",{class:"line-number"},"9"),s("br"),s("span",{class:"line-number"},"10"),s("br"),s("span",{class:"line-number"},"11"),s("br"),s("span",{class:"line-number"},"12"),s("br"),s("span",{class:"line-number"},"13"),s("br"),s("span",{class:"line-number"},"14"),s("br")])])])],-1),b=s("h2",{id:"hiding-re-used-code",tabindex:"-1"},[e("Hiding re-used code "),s("a",{class:"header-anchor",href:"#hiding-re-used-code","aria-label":'Permalink to "Hiding re-used code"'},"​")],-1),A=s("p",null,[e("Re-using a lot of TypeScript code can easily bloat your documentation and obstruct the main point of your code block. You can hide re-used code to keep your code blocks clean and concise by "),s("a",{href:"./cutting"},"cutting"),e(" right after the "),s("code",null,"@include"),e(" statement.")],-1),g=s("div",{class:"vp-code-group vp-adaptive-theme"},[s("div",{class:"tabs"},[s("input",{type:"radio",name:"group-nFqMs",id:"tab-CkiDfwv",checked:"checked"}),s("label",{for:"tab-CkiDfwv"},"output"),s("input",{type:"radio",name:"group-nFqMs",id:"tab-c0gMhuq"}),s("label",{for:"tab-c0gMhuq"},"markdown")]),s("div",{class:"blocks"},[s("div",{class:"language-ts vp-adaptive-theme active 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"}},"const"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},[s("data-lsp",{lsp:"const mail: SomeUserMail"},"mail")]),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},[s("data-lsp",{lsp:`type SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}},[e(" { "),s("data-lsp",{lsp:"(property) content: string"},"content"),e(": ")]),s("span",{style:{color:"#96D0FF"}},"'some-email'"),s("span",{style:{color:"#ADBAC7"}},[e(", "),s("data-lsp",{lsp:"(property) verified: boolean"},"verified"),e(": ")]),s("span",{style:{color:"#6CB6FF"}},"true"),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:"#D73A49"}},"const"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},[s("data-lsp",{lsp:"const mail: SomeUserMail"},"mail")]),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},[s("data-lsp",{lsp:`type SomeUserMail = {
content: string;
verified: boolean;
}`},"SomeUserMail")]),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}},[e(" { "),s("data-lsp",{lsp:"(property) content: string"},"content"),e(": ")]),s("span",{style:{color:"#032F62"}},"'some-email'"),s("span",{style:{color:"#24292E"}},[e(", "),s("data-lsp",{lsp:"(property) verified: boolean"},"verified"),e(": ")]),s("span",{style:{color:"#005CC5"}},"true"),s("span",{style:{color:"#24292E"}}," }")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])]),s("div",{class:"language-md vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"md"),s("pre",{class:"shiki github-dark-dimmed vp-code-dark"},[s("code",null,[s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```twoslash include myBlockWithSteps")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeString = string")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"// - base")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeUser = { name: string; mail?: SomeUserMail }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeUserMail = { content: string; verified: boolean }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"// - afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"type SomeGroup = { name: string; members: SomeUser[] }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"// - afterGroupDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```")]),e(`
`),s("span",{class:"line"}),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```ts twoslash")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#768390"}},"// @include: myBlockWithSteps-afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#768390"}},"// ---cut---")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#F47067"}},"const"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#6CB6FF"}},"mail"),s("span",{style:{color:"#F47067"}},":"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F69D50"}},"SomeUserMail"),s("span",{style:{color:"#ADBAC7"}}," "),s("span",{style:{color:"#F47067"}},"="),s("span",{style:{color:"#ADBAC7"}}," { content: "),s("span",{style:{color:"#96D0FF"}},"'some-email'"),s("span",{style:{color:"#ADBAC7"}},", verified: "),s("span",{style:{color:"#6CB6FF"}},"true"),s("span",{style:{color:"#ADBAC7"}}," }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#ADBAC7"}},"```")])])]),s("pre",{class:"shiki github-light vp-code-light"},[s("code",null,[s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```twoslash include myBlockWithSteps")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeString = string")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"// - base")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeUser = { name: string; mail?: SomeUserMail }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeUserMail = { content: string; verified: boolean }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"// - afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"type SomeGroup = { name: string; members: SomeUser[] }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"// - afterGroupDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```")]),e(`
`),s("span",{class:"line"}),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```ts twoslash")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// @include: myBlockWithSteps-afterUserDefinitions")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#6A737D"}},"// ---cut---")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#D73A49"}},"const"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#005CC5"}},"mail"),s("span",{style:{color:"#D73A49"}},":"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#6F42C1"}},"SomeUserMail"),s("span",{style:{color:"#24292E"}}," "),s("span",{style:{color:"#D73A49"}},"="),s("span",{style:{color:"#24292E"}}," { content: "),s("span",{style:{color:"#032F62"}},"'some-email'"),s("span",{style:{color:"#24292E"}},", verified: "),s("span",{style:{color:"#005CC5"}},"true"),s("span",{style:{color:"#24292E"}}," }")]),e(`
`),s("span",{class:"line"},[s("span",{style:{color:"#24292E"}},"```")])])]),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"),s("span",{class:"line-number"},"5"),s("br"),s("span",{class:"line-number"},"6"),s("br"),s("span",{class:"line-number"},"7"),s("br"),s("span",{class:"line-number"},"8"),s("br"),s("span",{class:"line-number"},"9"),s("br"),s("span",{class:"line-number"},"10"),s("br"),s("span",{class:"line-number"},"11"),s("br"),s("span",{class:"line-number"},"12"),s("br"),s("span",{class:"line-number"},"13"),s("br"),s("span",{class:"line-number"},"14"),s("br"),s("span",{class:"line-number"},"15"),s("br")])])])],-1);function h(C,D,v,S,B,f){const n=a;return t(),r("div",null,[i,p(n,{readTime:"2",words:"431"}),d,y,m,u,b,A,g])}const w=o(c,[["render",h]]);export{U as __pageData,w as default};
Reference in New Issue View Git Blame Copy Permalink