#v9

• Migration
• Changes
• Feature

#Migration

v9 of @dnb/eufemia contains breaking changes. As a migration process, you can simply search and replace:

#General

1. Uninstall dnb-ui-lib and install @dnb/eufemia.
2. Rename with Regex ("|')dnb-ui-lib and replace with $1@dnb/eufemia.
3. Rename node_modules/dnb-ui-lib/ and replace with node_modules/dnb/eufemia/.
4. Find formRow inside a (e.g. <Provider formRow= ...) and replace it with FormRow (PascalCase).

#Number to NumberFormat

1. Find the Number component and rename it with NumberFormat.
2. Find the dnb-number and replace it with dnb-number-format.
3. In case you import it from components/number/Number, it has to be components/number-format/NumberFormat.
4. In case you use format or cleanNumber from either /components/Number or /components/number/Number, replace the import path to be /components/number-format/NumberUtils.
5. You can also use Regex: Find Number([^F)]|$) and replace it with NumberFormat$1.

#Tabs properties

Tabs has changed two property names.

1. Find section_style in <Tabs section_style="..." /> and replace with tabs_style.
2. Find section_spacing in <Tabs section_spacing="..." /> and replace with tabs_spacing.

#Helper classes

1. Removed dnb-nudge
2. Removed dnb-belt
3. Removed dnb-hide-on-mobile
4. Removed dnb-mobile-exclusive
5. Removed dnb-width-limit

#Patterns to Extensions

Most of the Eufemia "patterns" got removed in favor of calling this part as extensions.

1. Find dnb-ui-lib/patterns or @dnb/eufemia/patterns and replace with @dnb/eufemia/extensions
2. Find dnb-ui-patterns and replace with dnb-ui-extensions

The following patterns/extensions/components are removed:

• ActionNav
• DescriptionList
• Footer
• Form
• Grid
• MainMenu
• SummaryTable
• FieldsetDescription
• FormSummaryPage
• RangeSlider
• ViewTitle
• LineTitle
• Notification

#Properties

Removed already deprecated CSS properties (vars):

• --color-sea-green-alt-30
• --color-signal-yellow-30
• --color-black-30
• --color-sea-green-alt
• --color-signal-yellow
• --font-weight-book
• --font-weight-demi
• --font-family-book
• --font-family-demi

#Textarea

• Removed support of style only for Textarea. You have to use the component now.

#StepIndicator

• Has now a deprecation warning when properties like use_navigation, active_item, active_url, url, url_future and url_passed are used.

#Changes

• The visual appearance of a couple of components has been changed (e.g. border-radius).
• The color success-green has changed its HEX value

#Updates to the language files

Strings were changed/removed and added to the language files nb-NO.js and en-GB.js:

• NumberFormat (added)

#Features

• New useful properties added to <Tabs content_style="..." /> to define a section style.

• Added stretch support for Autocomplete, Dropdown and DatePicker.

• Enhance Webpack v5 compatibility

• Enhance React v17 compatibility

• Linear ProgressIndicator

• Release of Tooltip inclusive integration into Button, Anchor and NumberFormat

• Tertiary Button with top placed icon

• The Eufemia Provider can send along global component properties:

  <Provider
    value={{
      Button: { size: 'large' },
    }}
  >
    ...
    <Button text="Large button" />
  </Provider>

#Install

To upgrade to @dnb/eufemia v9 with NPM, use:

$ npm i @dnb/eufemia@9
# or
$ yarn add @dnb/eufemia@9

March, 3. 2021