Value components
Many screens summarize values from the data set statically, such as a final screen where the user can review the data they have entered before submitting it to the bank. To make displaying such data easier, a number of Value components have been created. These function similarly as field components. That is, they are data-driven, can be given value-props, or connected to a surrounding DataContext.Provider by pointing to the relevant value they are to display with a path-prop. They are also available with more functional variants for given types of data. Examples of Value components are:
Creating custom value components
The useValue hook that is used in all existing value components is exported to make it possible to create custom value components that have the same properties and follow the same flow as the standard components, without the need to recreate all the basic state handling features.
Components
Base components
String
Value.String is a base component for displaying values of the type `string`.
Number
Value.Number is a base component for displaying values of the type `number`.
BankAccountNumber
Value.BankAccountNumber is a wrapper component for displaying string values, with user experience tailored for bank account number values.
Boolean
Value.Boolean is a base component for displaying values of the type `boolean`.
Currency
Value.Currency is a wrapper component for displaying number values, with user experience tailored for currency values.
Date
Value.Date is a wrapper component for displaying string values, with user experience tailored for date values.
Value.Email is a wrapper component for displaying string values, with user experience tailored for email values.
FirstName
Value.FirstName is a wrapper component for displaying string values, with user experience tailored for first name values.
LastName
Value.LastName is a wrapper component for displaying string values, with user experience tailored for last name values.
NationalIdentityNumber
Value.NationalIdentityNumber is a wrapper component for displaying string values, with user experience tailored for national identity number values.
PhoneNumber
Value.PhoneNumber is a wrapper component for displaying string values, with user experience tailored for phone number values.
Feature components
String
Value.String is a base component for displaying values of the type `string`.
Number
Value.Number is a base component for displaying values of the type `number`.
BankAccountNumber
Value.BankAccountNumber is a wrapper component for displaying string values, with user experience tailored for bank account number values.
Boolean
Value.Boolean is a base component for displaying values of the type `boolean`.
Currency
Value.Currency is a wrapper component for displaying number values, with user experience tailored for currency values.
Date
Value.Date is a wrapper component for displaying string values, with user experience tailored for date values.
Value.Email is a wrapper component for displaying string values, with user experience tailored for email values.
FirstName
Value.FirstName is a wrapper component for displaying string values, with user experience tailored for first name values.
LastName
Value.LastName is a wrapper component for displaying string values, with user experience tailored for last name values.
NationalIdentityNumber
Value.NationalIdentityNumber is a wrapper component for displaying string values, with user experience tailored for national identity number values.
PhoneNumber
Value.PhoneNumber is a wrapper component for displaying string values, with user experience tailored for phone number values.