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! ⚠️⚠️
A comment with the following format will cause a hint to be displayed on-hover:
// --> some hint here
1linkimport { Renderer } from '@connectv/html'; // --> there is a hint on this line
2link
3linkconst MyComp = ({ name }, renderer) => <div>Hellow {name}!</div> // --> there is also a hint on this line
4link
5linkconst renderer = new Renderer();
6linkrenderer.render(
7link <fragment>
8link <MyComp name='World'/>
9link <MyComp name='Fellas'/> {/* --> also this is a hint */}
10link </fragment>
11link)
12link.on(document.body);
The following syntax styles are supported:
1link"// --> standard one-liner" // --> standard one-liner
1link"/* --> standard multi-liner */" /* --> standard multi-liner */
1link"# --> python/bash comments" # --> python/bash comments
1link<!--> html comments --> <!--> html comments -->
Add a comment with following format in the code will show a link on-hover over the line:
// @see https://www.google.com
1linkimport { 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:
1link```
2linkimport { Renderer } from '@connectv/html'; // @see [CONNECTIVE HTML Docs](https://github.com/CONNECT-platform/connective-html)
3link```
1linkimport { 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:
1link> :Tabs
2link> > :Tab title=First Tab
3link> >
4link> > ```tsx
5link> > import { func } from './other'; // @see tab:Second Tab
6link> >
7link> > func(); // --> good stuff will happen now
8link> > ```
9link>
10link> > :Tab title=Second Tab
11link> >
12link> > ```tsx
13link> > export function func() {
14link> > console.log('Good Stuff!');
15link> > }
16link> > ```
1linkimport { func } from './other'; // @see tab:Second Tab
2link
3linkfunc(); // --> good stuff will happen now
1linkexport function func() {
2link console.log('Good Stuff!');
3link}
Similar syntax styles to hints are supported for references as well:
1link"// @see [random stuff](https://www.randomlists.com/things)" // @see [random stuff](https://www.randomlists.com/things)
1link"/* @see https://google.com */" /* @see https://google.com */
1link"#@see https://github.com" #@see https://github.com
1link<!-- @see [the first page](/) --> <!-- @see [the first page](/) -->