# ReleaseNotes

*Category:* Components
*Section:* Misc
*Source:* https://uikit.developers.rio.cloud/#/components/releaseNotes
*Captured:* 2026-04-27T14:58:25.843Z

Component to render release notes in a standardized manner.

## ReleaseNotes

### Example: Example 1

1.1.0 23.07.2018

Map view within the tour history table
• Modern map design as used in the Beta of the fleet monitor
• Works with all event types
• Event specific map marker
• Map size adjustable via slider

1.0.0 27.06.2018

New feature XYZ has been added ...

fixed bugs in ...

Another feature has been added

#### React (tsx)

```tsx
import ReleaseNotes from '@rio-cloud/rio-uikit/ReleaseNotes';

const releaseNotes = {
    'en-GB': {
        '1.1.0': {
            date: '23.07.2018',
            content: (
                <div className='padding-left-15'>{`Map view within the tour history table
• Modern map design as used in the Beta of the fleet monitor
• Works with all event types
• Event specific map marker
    • Map size adjustable via slider`}</div>
            ),
        },
        '1.0.0': {
            date: '27.06.2018',
            content: [
                <div>New feature XYZ has been added ...</div>,
                <div>fixed bugs in ...</div>,
                <div>Another feature has been added</div>,
            ],
        },
    },
};

const translationKey = 'en-GB';

export default () => <ReleaseNotes releaseNotes={releaseNotes[translationKey]} />;
```

#### HTML (html)

```html
<div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <div class="display-flex justify-content-between">
                <span class="text-size-16 text-medium">1.1.0</span>
                <span class="text-thin">23.07.2018</span>
            </div>
        </div>
        <div class="panel-body white-space-pre-line">
            <div>
                <div class="padding-left-15">Map view within the tour history table
                    • Modern map design as used in the Beta of the fleet monitor
                    • Works with all event types
                    • Event specific map marker
                    • Map size adjustable via slider</div>
            </div>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <div class="display-flex justify-content-between">
                <span class="text-size-16 text-medium">1.0.0</span>
                <span class="text-thin">27.06.2018</span>
            </div>
        </div>
        <div class="panel-body white-space-pre-line">
            <ul class="margin-bottom-0 margin-left-5 padding-left-25">
                <li>
                    <div>New feature XYZ has been added ...</div>
                </li>
                <li>
                    <div>fixed bugs in ...</div>
                </li>
                <li>
                    <div>Another feature has been added</div>
                </li>
            </ul>
        </div>
    </div>
</div>
```

#### Props (json)

```json
{
    "0.1.2": {
        date: '23.07.2018',
        content: (
            <div className='padding-left-15'>
                Map view within the tour history table
                • Modern map design as used in the Beta of the fleet monitor
                • Works with all event types
            </div>
        ),
    }
}
```