linkCode Features

This is a quick overview of codedoc specific features at your disposal in markdown code elements. For a complete list, please checkout the official documentation. You can also take a look at docs/md/docs/code-features.md to see the markdown behind this page.

⚠️⚠️ Do not forget to REMOVE THIS PAGE from your actual documentation! ⚠️⚠️

linkHints

A comment with the following format will cause a hint to be displayed on-hover:

// --> some hint here

index.tsx
1import { Renderer } from '@connectv/html';                       // --> there is a hint on this line

2

3const MyComp = ({ name }, renderer) => <div>Hellow {name}!</div> // --> there is also a hint on this line

4

5const renderer = new Renderer();

6renderer.render(

7  <fragment>

8    <MyComp name='World'/>

9    <MyComp name='Fellas'/>                                      {/* --> also this is a hint */}

10  </fragment>

11)

12.on(document.body);

The following syntax styles are supported:

1"// --> standard one-liner" // --> standard one-liner

1"/* --> standard multi-liner */" /* --> standard multi-liner */

1"# --> python/bash comments" # --> python/bash comments

1<‌!--> html comments --> <!--> html comments -->

linkReferences

Add a comment with following format in the code will show a link on-hover over the line:

// @see https://www.google.com

1import { Renderer } from '@connectv/html';                       // @see https://github.com/CONNECT-platform/connective-html

You can also use the markdown link format to give your links a title:

1```

2import { Renderer } from '@connectv/html'; // @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)

3```

1import { Renderer } from '@connectv/html';                       // @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)

You can also use these references to refer to another tab in a tab-component:

some-doc.md
1> :Tabs

2> > :Tab title=First Tab

3> >

4> > ```tsx

5> > import { func } from './other'; // @see tab:Second Tab

6> >

7> > func(); // --> good stuff will happen now

8> > ```

9>

10> > :Tab title=Second Tab

11> >

12> > ```tsx

13> > export function func() {

14> >   console.log('Good Stuff!');

15> > }

16> > ```

1import { func } from './other'; // @see tab:Second Tab

2

3func(); // --> good stuff will happen now

1export function func() {

2  console.log('Good Stuff!');

3}

Similar syntax styles to hints are supported for references as well:

1"// @‌see [random stuff](https://www.randomlists.com/things)" // @see [random stuff](https://www.randomlists.com/things)

1"/* @‌see https://google.com */" /* @see https://google.com */

1"#@see https://github.com" #@see https://github.com

1<!-- @‌see [the first page](/) --> <!-- @see [the first page](/) -->