Import#
import { Value } from '@dnb/eufemia/extensions/forms'render(<Value.Date />)
Description#
Value.Date is a wrapper component for displaying string values, with user experience tailored for date values.
There is a corresponding Field.Date component.
import { Value } from '@dnb/eufemia/extensions/forms'render(<Value.Date />)
Check the Best Practices for number formatting page to see how its locale examples align with what this component renders.
Relevant links#
Demos#
Label and value#
Label text16. januar 2023
<Value.Date label="Label text" value="2023-01-16" />
Variant short#
Label text16. jan. 2023
<Value.Date label="Label text" value="2023-01-16" variant="short" />
Variant numeric#
Label text16.01.2023
<Value.Date label="Label text" value="2023-01-16" variant="numeric" />
Date range#
Label text16. januar–1. april 2023
<Value.Date label="Label text" value="2023-01-16|2023-04-01" />
Inline#
This is before the component 16. januar 2023 This is after the component
<P> This is before the component{' '} <Value.Date label="Label text" value="2023-01-16" inline /> This is after the component </P>