mirror of
https://github.com/cupcakearmy/autorestic.git
synced 2024-11-05 21:24:11 +01:00
55 lines
26 KiB
HTML
55 lines
26 KiB
HTML
|
<!DOCTYPE html><html><head><title>Autorestic | Code Features</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"><meta name="robots" content="index,follow"><meta name="theme-color" content="#212121"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link href="https://fonts.googleapis.com/css?family=Hind:400,700&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:300,400&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/icon?family=Material+Icons|Material+Icons+Outlined" rel="stylesheet"><style>
|
|||
|
|
body, input, button {
|
|||
|
|
font-family: 'Hind', sans-serif;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
code, .hljs {
|
|||
|
|
font-family: 'Source Code Pro', 'Courier New', Courier, monospace;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.icon-font {
|
|||
|
|
font-family: 'Material Icons';
|
|||
|
|
font-weight: normal;
|
|||
|
|
font-style: normal;
|
|||
|
|
font-size: 24px; /* Preferred icon size */
|
|||
|
|
display: inline-block;
|
|||
|
|
line-height: 1;
|
|||
|
|
text-transform: none;
|
|||
|
|
letter-spacing: normal;
|
|||
|
|
word-wrap: normal;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
direction: ltr;
|
|||
|
|
|
|||
|
|
/* Support for all WebKit browsers. */
|
|||
|
|
-webkit-font-smoothing: antialiased;
|
|||
|
|
/* Support for Safari and Chrome. */
|
|||
|
|
text-rendering: optimizeLegibility;
|
|||
|
|
|
|||
|
|
/* Support for Firefox. */
|
|||
|
|
-moz-osx-font-smoothing: grayscale;
|
|||
|
|
|
|||
|
|
/* Support for IE. */
|
|||
|
|
font-feature-settings: 'liga';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.icon-font.outline {
|
|||
|
|
font-family: 'Material Icons Outlined';
|
|||
|
|
}
|
|||
|
|
</style><link href="/autorestic/docs/assets/codedoc-styles.css" rel="stylesheet"><script async="" defer="" src="/autorestic/docs/assets/codedoc-bundle.js"></script></head><body><div class="header-0-0-4"><script async="" defer="" src="https://buttons.github.io/buttons.js"></script><a class="github-button" data-color-scheme="no-preference: light; light: light; dark: dark;" data-icon="false" data-show-count="true" data-size="false" href="https://github.com/cupcakearmy/autorestic/">Star</a><br><br><a class="watermark-0-0-3" href="https://github.com/CONNECT-platform/codedoc" target="_blank">Created With<svg viewBox="0 0 536 296" version="1.1" xmlns="http://www.w3.org/2000/svg"><g id="codedoc" transform="translate(-244.000000, -364.000000)" fill-rule="nonzero"><path d="M580,532 C615.346224,532 644,560.653776 644,596 C644,631.346224 615.346224,660 580,660 C544.653776,660 516,631.346224 516,596 C516,560.653776 544.653776,532 580,532 Z M716,532 C751.346224,532 780,560.653776 780,596 C780,631.346224 751.346224,660 716,660 L692,660 C687.581722,660 684,656.418278 684,652 C684,647.581722 687.581722,644 692,644 L716,644 C742.509668,644 764,622.509668 764,596 C764,569.490332 742.509668,548 716,548 L692,548 C687.581722,548 684,544.418278 684,540 C684,535.581722 687.581722,532 692,532 L716,532 Z M468,532 C472.418278,532 476,535.581722 476,540 L476,652 C476,656.418278 472.418278,660 468,660 L444,660 C408.653776,660 380,631.346224 380,596 C380,560.653776 408.653776,532 444,532 L468,532 Z M332,532 C336.418278,532 340,535.581722 340,540 L340,652 C340,656.418278 336.418278,660 332,660 L252,660 C247.581722,660 244,656.418278 244,652 L244,540 C244,535.581722 247.581722,532 252,532 L332,532 Z M580,548 C553.490332,548 532,569.490332 532,596 C532,622.509668 553.490332,644 580,644 C606.509668,644 628,622.509668 628,596 C628,569.490332 606.509668,548 580,548 Z M461,548 L444,548 C417.490332,548 396,569.490332 396,596 C396,622.509668 417.490332,644 444,644 L461,644 L461,548 Z M444,364 C479.346224,364 508,392.653776 508,428 C508,463.346224 479.346224,492 444,492 C408.653776,492 380,463.346224 380,428 C380,392.653776 408.653776,364 444,364 Z M332,364 C336.418278,364 340,367.581722 340,372 C340,376.418278 336.418278,380 332,380 L308,380 C281.490332,380 260,401.490332 260,428 C260,454.509668 281.490332,476 308,476 L332,476 C336.418278,476 340,479.581722 340,484 C340,488.418278 336.418278,492 332,492 L308,492 C272.653776,492 244,463.346224 244,428 C244,392.653776 272.653776,364 308,364 L332,364 Z M580,364 C615.346224,364 644,392.653776 644,428 C644,463.346224 615.346224,492 580,492 L556,492 C551.581722,492 548,488.418278 548,484 L548,372 C548,367.581722 551.581722,364 556,364 L580,364 Z M772,364 C776.418278,364 780,367.581722 780,372 C780,376.418278 776.418278,380 772,380 L700,380 L700,420 L772,420 C776.418278,420 780,423.581722 780,428 C780,432.418278 776.418278,436 772,436 L700,436 L700,476 L772,476 C776.418278,476 780,479.581722 780,484 C780,488.418278 776.418278,492 772,492 L692,492 C687.581722,492 684,488.418278 684,484 L684,372 C684,367.581722 687.581722,364 692,364 L772,364 Z M444,380 C417.490332,380 396,401.490332 396,428 C396,454.509668 417.490332,476 444,476 C470.509668,476 492,454.509668 492,428 C492,401.490332 470.509668,380 444,380 Z M580,380 L563,380 L563,476 L580,476 C606.509668,476 628,454.509668 628,428 C628,401.490332 606.509668,380 580,380 Z"></path></g></svg></a></div><div id="-codedoc-container" class="container"><h1 id="code-features" class="heading-0-0-1"><span class="anchor-0-0-2" data-ignore-text=""><span class="icon-font" data-ignore-text="" style="vertical-align: sub">link</span></span>Code Features</h1><p>This is a quick overview of codedoc specific features at your disposal in markdown
|
|||
|
|
<code>code</code> elements. For a complete list, please checkout the <a href="https://codedoc.cc">official documentation</a>.
|
|||
|
|
You can also take a look at <code>docs/md/docs/code-features.md</code> to see the markdown behind this page.</p><div style="text-align: right"><a class="button-0-0-14" href="https://codedoc.cc" target="_blank">Official Docs</a></div><marker><br>
|
|||
|
|
|
|||
|
|
</marker><blockquote><p>⚠️⚠️
|
|||
|
|
Do not forget to <strong>REMOVE THIS PAGE</strong> from your actual documentation!
|
|||
|
|
⚠️⚠️</p></blockquote><marker><hr>
|
|||
|
|
|
|||
|
|
</marker><h2 id="hints" class="heading-0-0-1"><span class="anchor-0-0-2" data-ignore-text=""><span class="icon-font" data-ignore-text="" style="vertical-align: sub">link</span></span>Hints</h2><p>A comment with the following format will cause a hint to be displayed on-hover:</p><blockquote><p><code>// --> some hint here</code></p></blockquote><pre class="with-bar"><code class="tsx code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span>index.tsx</span></span><div class="line-0-0-12 " data-content="import { Renderer } from '@connectv/html'; // --> there is a hint on this line"><span class="lineCounter-0-0-11 prim">1</span><span class="token keyword">import</span> <span class="token punctuation">{</span> Renderer <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'@connectv/html'</span><span class="token punctuation">;</span> <span class="token comment">// --> there is a hint on this line</span></div><br><div class="line-0-0-12 " data-content=""><span class="lineCounter-0-0-11">2</span></div><br><div class="line-0-0-12 " data-content="const MyComp = ({ name }, renderer) => <div>Hellow {name}!</div> // --> there is also a hint on this line"><span class="lineCounter-0-0-11">3</span><span class="token keyword">const</span> <span class="token function-variable function">MyComp</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> name <span class="token punctuation">}</span><span class="token punctuation">,</span> renderer</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span><span class="token plain-text">Hellow </span><span class="token punctuation">{</span>name<span class="token punctuation">}</span><span class="token plain-text">!</span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token comment">// --> there is also a hint on this line</span></div><br><div class="line-0-0-12 " data-content=""><span class="lineCounter-0-0-11">4</span></div><br><div class="line-0-0-12 " data-content="const renderer = new Renderer();"><span class="lineCounter-0-0-11 prim">5</span><span class="token keyword">const</span> renderer <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Renderer</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><br><div class="line-0-0-12 " data-content="renderer.render("><span class="lineCounter-0-0-11">6</span>renderer<span class="token punctuation">.</span><span class="token function">render</span><span class="token punctuation">(</span></div><br><div class="line-0-0-12 " data-content=" <fragment>"><span class="lineCounter-0-0-11">7</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>fragment</span><span class="token punctuation">></span></span><span class="token plain-text"></span></div><br><div class="line-0-0-12 " data-content=" <MyComp name='World'/>"><span class="lineCounter-0-0-11">8</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">MyComp</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">'</span>World<span class="token punctuation">'</span></span><span class="token punctuation">/></span></span><span class="token plain-text"></span></div><br><div class="line-0-0-12 " data-content=" <MyComp name='Fellas'/> {/* --> also this is a hint */}"><
|
|||
|
|
|
|||
|
|
</marker><p>The following syntax styles are supported:</p><pre class=""><code class="go code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content=""// --> standard one-liner" // --> standard one-liner"><span class="lineCounter-0-0-11 prim">1</span><span class="token string">"// --> standard one-liner"</span> <span class="token comment">// --> standard one-liner</span></div><br></code></pre><pre class=""><code class="java code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content=""/* --> standard multi-liner */" /* --> standard multi-liner */"><span class="lineCounter-0-0-11 prim">1</span><span class="token string">"/* --> standard multi-liner */"</span> <span class="token comment">/* --> standard multi-liner */</span></div><br></code></pre><pre class=""><code class="py code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content=""# --> python/bash comments" # --> python/bash comments"><span class="lineCounter-0-0-11 prim">1</span><span class="token string">"# --> python/bash comments"</span> <span class="token comment"># --> python/bash comments</span></div><br></code></pre><pre class=""><code class="md code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content="<!--> html comments --> <!--> html comments -->"><span class="lineCounter-0-0-11 prim">1</span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>!--</span><span class="token punctuation">></span></span> html comments --> <span class="token comment"><!--> html comments --></span></div><br></code></pre><marker><hr>
|
|||
|
|
|
|||
|
|
</marker><h2 id="references" class="heading-0-0-1"><span class="anchor-0-0-2" data-ignore-text=""><span class="icon-font" data-ignore-text="" style="vertical-align: sub">link</span></span>References</h2><p>Add a comment with following format in the code will show a link on-hover over the line:</p><blockquote><p><code>// @see https://www.google.com</code></p></blockquote><pre class=""><code class="tsx code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content="import { Renderer } from '@connectv/html'; // @see https://github.com/CONNECT-platform/connective-html"><span class="lineCounter-0-0-11 prim">1</span><span class="token keyword">import</span> <span class="token punctuation">{</span> Renderer <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'@connectv/html'</span><span class="token punctuation">;</span> <span class="token comment">// @see https://github.com/CONNECT-platform/connective-html</span></div><br></code></pre><p>You can also use the markdown link format to give your links a title:</p><pre class=""><code class="md code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content="```"><span class="lineCounter-0-0-11 prim">1</span><span class="token code"><span class="token punctuation">```</span></span></div><br><div class="line-0-0-12 " data-content="import { Renderer } from '@connectv/html'; // @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)"><span class="lineCounter-0-0-11">2</span><span class="token code-block">import { Renderer } from '@connectv/html'; // @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)</span></div><br><div class="line-0-0-12 " data-content="```"><span class="lineCounter-0-0-11 prim">3</span><span class="token punctuation">```</span></div><br></code></pre><pre class=""><code class="tsx code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content="import { Renderer } from '@connectv/html'; // @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)"><span class="lineCounter-0-0-11 prim">1</span><span class="token keyword">import</span> <span class="token punctuation">{</span> Renderer <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'@connectv/html'</span><span class="token punctuation">;</span> <span class="token comment">// @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)</span></div><br></code></pre><p>You can also use these references to refer to another tab in a tab-component:</p><pre class="with-bar"><code class="md code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span>some-doc.md</span></span><div class="line-0-0-12 " data-content="> :Tabs"><span class="lineCounter-0-0-11 prim">1</span><span class="token blockquote punctuation">></span> :Tabs</div><br><div class="line-0-0-12 " data-content="> > :Tab title=First Tab"><span class="lineCounter-0-0-11">2</span><span class="token blockquote punctuation">> ></span> :Tab title=First Tab</div><br><div class="line-0-0-12 " data-content="> >"><span class="lineCounter-0-0-11">3</span><span class="token blockquote punctuation">> ></span></div><br><div class="line-0-0-12 " data-content="> > ```tsx"><span class="lineCounter-0-0-11">4</span><span class="token blockquote punctuation">> ></span> ```tsx</div><br><div class="line-0-0-12 " data-content="> > import { func } from './other'; // @see tab:Second Tab"><span class="lineCounter-0-0-11 prim">5</span><span class="token blockquote punctuation">> ></span> import { func } from './other'; // @see tab:Second Tab</div><br><div class="line-0-0-12 "
|
|||
|
|
|
|||
|
|
</marker><div class="tabs-0-0-15"><script id="RghuQAPgmh">(function(){function load(){if (window.__sdh_transport){window.__sdh_transport("RghuQAPgmh", "MVgs1OFLDAYAeQUA+lgVCg==", {});} }; if (document.readyState == 'complete') load(); else window.addEventListener('load', load); })()</script><div class="tab first selected" data-tab-title="First Tab"><pre class="with-bar"><code class="tsx code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content="import { func } from './other'; // @see tab:Second Tab"><span class="lineCounter-0-0-11 prim">1</span><span class="token keyword">import</span> <span class="token punctuation">{</span> func <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'./other'</span><span class="token punctuation">;</span> <span class="token comment">// @see tab:Second Tab</span></div><br><div class="line-0-0-12 " data-content=""><span class="lineCounter-0-0-11">2</span></div><br><div class="line-0-0-12 " data-content="func(); // --> good stuff will happen now"><span class="lineCounter-0-0-11 prim">3</span><span class="token function">func</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// --> good stuff will happen now</span></div><br></code></pre></div><div class="tab" data-tab-title="Second Tab"><pre class="with-bar"><code class="tsx code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content="export function func() {"><span class="lineCounter-0-0-11 prim">1</span><span class="token keyword">export</span> <span class="token keyword">function</span> <span class="token function">func</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></div><br><div class="line-0-0-12 " data-content=" console.log('Good Stuff!');"><span class="lineCounter-0-0-11">2</span> <span class="token builtin">console</span><span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">'Good Stuff!'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></div><br><div class="line-0-0-12 " data-content="}"><span class="lineCounter-0-0-11 prim">3</span><span class="token punctuation">}</span></div><br></code></pre></div></div><p>Similar syntax styles to hints are supported for references as well:</p><pre class=""><code class="js code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content=""// @see [random stuff](https://www.randomlists.com/things)" // @see [random stuff](https://www.randomlists.com/things)"><span class="lineCounter-0-0-11 prim">1</span><span class="token string">"// @see [random stuff](https://www.randomlists.com/things)"</span> <span class="token comment">// @see [random stuff](https://www.randomlists.com/things)</span></div><br></code></pre><pre class=""><code class="go code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content=""/* @see https://google.com */" /* @see https://google.com */"><span class="lineCounter-0-0-11 prim">1</span><span class="token string">"/* @see https://google.com */"</span> <span class="token comment">/* @see https://google.com */</span></div><br></code></pre><pre class=""><code class="python code-0-0-10" tabindex="0"><span class="wmbar-0-0-13"><span></span><span></span><span></span><span></span></span><div class="line-0-0-12 " data-content=""#@see https://github.com" #@see https://github.com"><span class="lineCounter-0-0-11 prim">1</span><span class="token string">"#@see https://github.com"</span> <span class="token comment">#@see https:
|
|||
|
|
<a href="/autorestic/quickstart">Getting Started</a>
|
|||
|
|
<a href="/autorestic/docs/cheat-sheet">Markdown Cheat Sheet</a>
|
|||
|
|
<a href="/autorestic/docs/code-features">Code Features</a></p></div><div class="search-0-0-8"><script id="WJyrgDIhoO">(function(){function load(){if (window.__sdh_transport){window.__sdh_transport("WJyrgDIhoO", "+SrlfVhZ/PRQ5WhUlZbTaA==", {"repo":"autorestic","user":"cupcakearmy","root":"docs/md","pick":"\\.md$","drop":"(^_)|(\\/_)"});} }; if (document.readyState == 'complete') load(); else window.addEventListener('load', load); })()</script></div></div><div class="footer-0-0-5"><div class="left"><script id="Bo_nVMsPer">(function(){function load(){if (window.__sdh_transport){window.__sdh_transport("Bo_nVMsPer", "XsNW3ht5ee+RmVUActEo9g==", {});} }; if (document.readyState == 'complete') load(); else window.addEventListener('load', load); })()</script></div><div class="main"><div class="inside"><a href="https://github.com/cupcakearmy/autorestic/" target="_blank">GitHub</a></div></div><div class="right"><script id="FErLxviL_G">(function(){function load(){if (window.__sdh_transport){window.__sdh_transport("FErLxviL_G", "Y1WWvCKxkgk1yh8xbCfXqw==", {});} }; if (document.readyState == 'complete') load(); else window.addEventListener('load', load); })()</script></div></div><script id="DMgHyZLdAW">(function(){function load(){if (window.__sdh_transport){window.__sdh_transport("DMgHyZLdAW", "v641FmLj+AeGp0uuFTI6ug==", {"namespace":"/autorestic"});} }; if (document.readyState == 'complete') load(); else window.addEventListener('load', load); })()</script></body></html>
|