Markdoc primer

Adjust's developer documentation is written using GitHub-flavored markdown (GFM) enhanced with Markdoc to add support for dynamic structural components.

Important: All inline Markdown MUST conform to the GFM spec to avoid issues in localization.

Note: All Markdoc tags {% %} are treated as placeholders during localization, meaning attributes in Markdoc can't be translated.

This primer demonstrates the use custom features in the Adjust developer documentation.

Code fences

This repository makes use of expressive-code to render code blocks. Code blocks may be written by using the Fenced code block syntax.

The {% codeblock %} tag can be used to add the following to a code block:

Prop	Data type	Required	Description
highlight	String	No	A string of highlighted elements. Can be written as a string, a {range} object, or a regex string
ins	String	No	Content that has been added in a diff
del	String	No	Content that has been removed in a diff
collapse	String	No	A range of lines to collapse

For example, the following renders a standard Javascript code block with no additional decoration:

```js
const foo = "bar";
```

The following renders a code block with the words "me" and "dogs" highlighted.

{% codeblock highlight="me, dogs" %}
```text
Highlight me but not them
Highlight dogs but not cats
```
{% /codeblock %}

See Expressive code's documentation for more information about these directives.

Callouts

Callouts are components which highlight information. These can be rendered using the {% callout %} tag. The following attributes are supported:

Attribute	Type	Required	Description
type	String	No. Defaults to info	Available values: info | note | tip | warning | important | seealso

Callouts infer a title from the type. For example a note callout has the title Note, while a seealso callout has the title See also.

{% callout type="note" %}
This is a note callout. It [contains](https://google.com) **Markdown**.
{% /callout %}

Version change badges

To visually highlight when a feature/API was added/changed/removed, you can add a badge to the top of content using the {% minorversion %} tag.

| Attribute | Type | Required | Description | | added | String | No | The version in which the feature was added | | changed | String | No | The version in which the feature was changed | | removed | String | No | The version in which the feature was removed | | size | String | No | The size of the badge. Defaults to "medium". "medium" | "large" |

{% minorversion added="v5.0.1" size="medium" /%}

Tabbed content

Tabs are used to group information together and enable readers to switch between the content they want to see. Tabs may be synchronized to allow all tabs groups to update when the reader selects a tab with a corresponding sync ID.

Attribut	Data type	Required	Description
title	String	Yes	The title of the tab
icon	IconName	No	An optional icon that appears on the left of the panel. See the list of icons in ATLAS
sync	String	No	The sync ID of the tab. Add the same sync ID to all tabs you want to synchronize.

{% tabs %}
{% tab title="Tab 1" sync="tab1" %}
This is the tab information in tab 1.
{% /tab %}
{% tab title="Tab 2" sync="tab2" %}
This is the tab information in tab 2.
{% /tab %}
{% /tabs %}