@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
76 lines (53 loc) • 2.56 kB
Markdown
---
title: 'v4.10'
description: 'August, 24. 2019'
version: 11.8.2
generatedAt: 2026-07-03T14:39:18.347Z
checksum: 090b7d977ba4be5e2c4c04d199a30a4048416c59f443a56985df2f80629d9c40
---
# v4.10
- [Since last release info](#since-last-release-info)
- [GlobalStatus](#globalstatus) (**new**)
- [How to Install](#install)
- More in the [Releases section on GitHub](https://github.com/dnbexperience/eufemia/releases)
## Since last release info
- [Dropdown](/uilib/components/dropdown) got several new properties like `prevent_selection` (Popup Menu), `size` (small), `align_options` (right) and `more_menu`. For the `more_menu`, have a look at the Demos and also take a look at **Popup Menu**.
- [DatePicker](/uilib/components/date-picker) is now using v2 of `date-fns` and with this it's easier to translate to English (including new properties `submit_button_text` and `cancel_button_text`), as Norwegian (`nb`) is the default `locale`. But also `align_picker` is a nice feature to have.
- Also mostly every "from" component now supports HTML `data-*` attributes in event returns.
## GlobalStatus
This component is made to be used for mainly three UX situations:
- Global application error messages
- User-generated error messages
- User input correction advices
The component has to be placed directly under a header bar (UX principles). From there it will expand / slide down once a message is appearing.
Every "form" component, like [Input](/uilib/components/dropdown) will automatically connect and update the [GlobalStatus](/uilib/components/global-status) once an error status is show to the form component:
```jsx
import { Input } from 'dnb-ui-lib/components'
// 1. Place it under the header bar
<GlobalStatus />
// 2. Else where in your app - input with error status
<Input label="My Input" status="Error message" />
```
But you can also manually update / show as many messages as you want:
```jsx
import { GlobalStatus } from 'dnb-ui-lib/components'
// 1. Place it under the header bar
<GlobalStatus />
// 2. Else where in you app and later on, you can show a message
<GlobalStatus.Add
status_id="custom-id-1"
title="New title"
text="First long info text ..."
item="Item from status #1"
/>
// 3. and remove it again whenever you want
<GlobalStatus.Remove status_id="custom-id-1" />
```
## Install
To upgrade to v4.10 with NPM, use:
```bash
$ npm i dnb-ui-lib@4.10
# In case the NPM mirroring is not up to date
$ npm i https://github.com/dnbexperience/eufemia/releases/download/v4.10.0/dnb-ui-lib-4.10.0.tgz
```
_August, 24. 2019_