diff --git a/packages/dnb-design-system-portal/src/pages/icons/primary.md b/packages/dnb-design-system-portal/src/pages/icons/primary.md
index c3d9abf7cac..d5d10d033e8 100644
--- a/packages/dnb-design-system-portal/src/pages/icons/primary.md
+++ b/packages/dnb-design-system-portal/src/pages/icons/primary.md
@@ -11,7 +11,7 @@ import Icons from "Parts/icons/ListAllIcons";
The Primary Icons are included in the [UI Library](/uilib) and also shipped bundled as an [UMD Package](https://unpkg.com/dnb-ui-lib@latest/umd/dnb-ui-lib-icons.min.js).
-Primary Icons an easily be included, for instance, in [Buttons](/uilib/components/button). They are integrated by using the `` Component.
+Primary Icons an easily be included, for instance, in [Buttons](/uilib/components/button). They are integrated by using the `` Component.
#### A list of all Primary Icons
diff --git a/packages/dnb-design-system-portal/src/pages/uilib/usage/first-steps/react.md b/packages/dnb-design-system-portal/src/pages/uilib/usage/first-steps/react.md
index 496713afbaf..b091f8aac02 100644
--- a/packages/dnb-design-system-portal/src/pages/uilib/usage/first-steps/react.md
+++ b/packages/dnb-design-system-portal/src/pages/uilib/usage/first-steps/react.md
@@ -5,7 +5,7 @@ draft: false
order: 5
---
-import { Button, IconWithAllIcons } from 'dnb-ui-lib/src'
+import { Button, IconPrimary } from 'dnb-ui-lib/src'
import { ButtonEventExample } from 'Pages/uilib/usage/first-steps/examples/react-examples'
# React JS for the web
@@ -27,7 +27,7 @@ The most basic way to use the `dnb-ui-lib` is like this:
```jsx
```
@@ -35,7 +35,7 @@ The most basic way to use the `dnb-ui-lib` is like this:
diff --git a/packages/dnb-design-system-portal/src/uilib/components/examples/Icon.txt b/packages/dnb-design-system-portal/src/uilib/components/examples/Icon.txt
index 35932215fbe..8bee29b0656 100644
--- a/packages/dnb-design-system-portal/src/uilib/components/examples/Icon.txt
+++ b/packages/dnb-design-system-portal/src/uilib/components/examples/Icon.txt
@@ -1,3 +1,3 @@
-
-
+
+
diff --git a/packages/dnb-design-system-portal/src/uilib/performance-test/PerformanceTest.js b/packages/dnb-design-system-portal/src/uilib/performance-test/PerformanceTest.js
index ad32290ae62..b341f6a0b69 100644
--- a/packages/dnb-design-system-portal/src/uilib/performance-test/PerformanceTest.js
+++ b/packages/dnb-design-system-portal/src/uilib/performance-test/PerformanceTest.js
@@ -15,7 +15,7 @@ import 'dnb-ui-lib/src/style' // import both all components and the default them
import dnb, {
Button,
Input,
- IconWithAllIcons as Icon,
+ IconPrimary as Icon,
Switch,
FormLabel
} from 'dnb-ui-lib/src'
@@ -338,7 +338,7 @@ class InputTest extends Component {
const IconWrap = ({ webComponentsEnabled, ...props }) =>
webComponentsEnabled ? (
-
+
) : (
)
diff --git a/packages/dnb-design-system-portal/src/uilib/scripts/makeDemosFactory.js b/packages/dnb-design-system-portal/src/uilib/scripts/makeDemosFactory.js
index c4747e11562..086b1979ea8 100644
--- a/packages/dnb-design-system-portal/src/uilib/scripts/makeDemosFactory.js
+++ b/packages/dnb-design-system-portal/src/uilib/scripts/makeDemosFactory.js
@@ -10,11 +10,7 @@ import runFactory from './tasks/makerFactory'
import processAllPartsFile from './tasks/processAllPartsFile'
if (require.main === module && process.env.NODE_ENV !== 'test') {
- const ignoreUiLibList = [
- 'web-components',
- 'style',
- 'icon-with-all-icons'
- ]
+ const ignoreUiLibList = ['web-components', 'style', 'icon-primary']
const keepFiles = [] //'!**/footer/*'
const autoAdvice = `
ATTENTION: This file is auto generated by using "makeDemosFactory".
diff --git a/packages/dnb-ui-lib/src/components/button/Button.js b/packages/dnb-ui-lib/src/components/button/Button.js
index 89328f14066..59e4f212106 100644
--- a/packages/dnb-ui-lib/src/components/button/Button.js
+++ b/packages/dnb-ui-lib/src/components/button/Button.js
@@ -6,7 +6,7 @@
import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import classnames from 'classnames'
-import Icon from '../icon/IconWithAllIcons'
+import Icon from '../icon/IconPrimary'
import {
registerElement,
validateDOMAttributes,
diff --git a/packages/dnb-ui-lib/src/components/button/__tests__/__snapshots__/Button.test.js.snap b/packages/dnb-ui-lib/src/components/button/__tests__/__snapshots__/Button.test.js.snap
index 9361c40593f..cbca54929ae 100644
--- a/packages/dnb-ui-lib/src/components/button/__tests__/__snapshots__/Button.test.js.snap
+++ b/packages/dnb-ui-lib/src/components/button/__tests__/__snapshots__/Button.test.js.snap
@@ -57,7 +57,7 @@ exports[`Button component have to match default button snapshot 1`] = `
>
text
-
-
+
@@ -153,7 +153,7 @@ exports[`Button component have to match href="..." snapshot 1`] = `
>
text
-
-
+
diff --git a/packages/dnb-ui-lib/src/components/dropdown/Dropdown.js b/packages/dnb-ui-lib/src/components/dropdown/Dropdown.js
index e1d63f0ba40..fc332e46f64 100644
--- a/packages/dnb-ui-lib/src/components/dropdown/Dropdown.js
+++ b/packages/dnb-ui-lib/src/components/dropdown/Dropdown.js
@@ -14,7 +14,7 @@ import {
dispatchCustomElementEvent
} from '../../shared/component-helper'
// import './style/dnb-dropdown.scss' // no good solution to import the style here
-import Icon from '../icon/IconWithAllIcons'
+import Icon from '../icon/IconPrimary'
const renderProps = {
on_show: null,
diff --git a/packages/dnb-ui-lib/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap b/packages/dnb-ui-lib/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
index 77c5c74471e..6a131b0aefc 100644
--- a/packages/dnb-ui-lib/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
+++ b/packages/dnb-ui-lib/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
@@ -35,7 +35,7 @@ exports[`Dropdown component have to match snapshot 1`] = `
-
-
-
+
+
)
diff --git a/packages/dnb-ui-lib/src/components/icon/IconWithAllIcons.js b/packages/dnb-ui-lib/src/components/icon/IconPrimary.js
similarity index 84%
rename from packages/dnb-ui-lib/src/components/icon/IconWithAllIcons.js
rename to packages/dnb-ui-lib/src/components/icon/IconPrimary.js
index 0e97dcc5dba..6cf604df71c 100644
--- a/packages/dnb-ui-lib/src/components/icon/IconWithAllIcons.js
+++ b/packages/dnb-ui-lib/src/components/icon/IconPrimary.js
@@ -25,16 +25,13 @@ export const propTypes = {
export const defaultProps = { ...DefaultIcon.defaultProps }
-export default class IconWithAllIcons extends PureComponent {
- static tagName = 'dnb-icon-with-all-icons'
+export default class IconPrimary extends PureComponent {
+ static tagName = 'dnb-icon-primary'
static propTypes = propTypes
static defaultProps = defaultProps
static enableWebComponent() {
- DefaultIcon.enableWebComponent(
- IconWithAllIcons.tagName,
- IconWithAllIcons
- )
+ DefaultIcon.enableWebComponent(IconPrimary.tagName, IconPrimary)
}
static getIcon(props) {
diff --git a/packages/dnb-ui-lib/src/components/icon/description.md b/packages/dnb-ui-lib/src/components/icon/description.md
index ea7fc12a55a..63c7e1c9fe5 100644
--- a/packages/dnb-ui-lib/src/components/icon/description.md
+++ b/packages/dnb-ui-lib/src/components/icon/description.md
@@ -2,4 +2,4 @@ The main Icon component is basically only a wrapper for what ever Icon You send
#### More details
-To make it clear that all the "often used" icons are loaded at once, we have an additional Icon component, named `IconWithAllIcons` or `dnb-icon-with-all-icons`.
+To make it clear that all the "often used" icons are loaded at once, we have an additional Icon component, named `IconPrimary` or `dnb-icon-primary`.
diff --git a/packages/dnb-ui-lib/src/components/icon/details.md b/packages/dnb-ui-lib/src/components/icon/details.md
index a9ebbde4512..9e7a3516df3 100644
--- a/packages/dnb-ui-lib/src/components/icon/details.md
+++ b/packages/dnb-ui-lib/src/components/icon/details.md
@@ -1,6 +1,6 @@
| Properties | Description |
| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `icon` | _(mandatory)_ a React SVG Component or the icon name (in case we use `IconWithAllIcons` or `dnb-icon-with-all-icons`). |
+| `icon` | _(mandatory)_ a React SVG Component or the icon name (in case we use `IconPrimary` or `dnb-icon-primary`). |
| `alt` | _(mandatory)_ the alternative label (text version) of the icon. |
| `size` | _(optional)_ the dimension of the icon. This will be the `viewBox` and represent `width` and `height`. Defaults to `16`. You can use `small`,`medium` or `large` |
| `color` | _(optional)_ sets a color property to the `svg` markup. Default is no color, witch means _black_ |
diff --git a/packages/dnb-ui-lib/src/components/index.js b/packages/dnb-ui-lib/src/components/index.js
index b3fd1632017..484a1ea9f49 100644
--- a/packages/dnb-ui-lib/src/components/index.js
+++ b/packages/dnb-ui-lib/src/components/index.js
@@ -16,7 +16,7 @@ import Button from './button/Button'
import Dropdown from './dropdown/Dropdown'
import FormLabel from './form-label/FormLabel'
import Icon from './icon/Icon'
-import IconWithAllIcons from './icon-with-all-icons/IconWithAllIcons'
+import IconPrimary from './icon-primary/IconPrimary'
import Input from './input/Input'
import InputMasked from './input-masked/InputMasked'
import LineTitle from './line-title/LineTitle'
@@ -33,7 +33,7 @@ export {
Dropdown,
FormLabel,
Icon,
- IconWithAllIcons,
+ IconPrimary,
Input,
InputMasked,
LineTitle,
@@ -51,7 +51,7 @@ export const getComponents = () => {
Dropdown,
FormLabel,
Icon,
- IconWithAllIcons,
+ IconPrimary,
Input,
InputMasked,
LineTitle,
diff --git a/packages/dnb-ui-lib/src/components/modal/__tests__/__snapshots__/Modal.test.js.snap b/packages/dnb-ui-lib/src/components/modal/__tests__/__snapshots__/Modal.test.js.snap
index cc449272119..307a68d09ec 100644
--- a/packages/dnb-ui-lib/src/components/modal/__tests__/__snapshots__/Modal.test.js.snap
+++ b/packages/dnb-ui-lib/src/components/modal/__tests__/__snapshots__/Modal.test.js.snap
@@ -77,7 +77,7 @@ exports[`Modal component have to match snapshot 1`] = `
>
modal_trigger_text
-
-
-
+
diff --git a/packages/dnb-ui-lib/src/components/notification/Notification.js b/packages/dnb-ui-lib/src/components/notification/Notification.js
index 16afb335071..e18a6a4154e 100644
--- a/packages/dnb-ui-lib/src/components/notification/Notification.js
+++ b/packages/dnb-ui-lib/src/components/notification/Notification.js
@@ -12,7 +12,7 @@ import {
// processChildren
} from '../../shared/component-helper'
// import './style/dnb-notification.scss' // no good solution to import the style here
-import Icon from '../../components/icon/IconWithAllIcons'
+import Icon from '../../components/icon/IconPrimary'
const renderProps = {
// render_content: null
diff --git a/packages/dnb-ui-lib/src/index.js b/packages/dnb-ui-lib/src/index.js
index 0373dc02ae2..d2db20e66bd 100644
--- a/packages/dnb-ui-lib/src/index.js
+++ b/packages/dnb-ui-lib/src/index.js
@@ -18,7 +18,7 @@ import Button from './components/button/Button'
import Dropdown from './components/dropdown/Dropdown'
import FormLabel from './components/form-label/FormLabel'
import Icon from './components/icon/Icon'
-import IconWithAllIcons from './components/icon-with-all-icons/IconWithAllIcons'
+import IconPrimary from './components/icon-primary/IconPrimary'
import Input from './components/input/Input'
import InputMasked from './components/input-masked/InputMasked'
import LineTitle from './components/line-title/LineTitle'
@@ -50,7 +50,7 @@ export {
Dropdown,
FormLabel,
Icon,
- IconWithAllIcons,
+ IconPrimary,
Input,
InputMasked,
LineTitle,
diff --git a/packages/dnb-ui-lib/src/patterns/main-nav/MainNav.js b/packages/dnb-ui-lib/src/patterns/main-nav/MainNav.js
index e233572c7cc..84d0e403228 100644
--- a/packages/dnb-ui-lib/src/patterns/main-nav/MainNav.js
+++ b/packages/dnb-ui-lib/src/patterns/main-nav/MainNav.js
@@ -13,7 +13,7 @@ import {
} from '../../shared/component-helper'
// import './style/dnb-main-nav.scss' // no good solution to import the style here
import Input from '../../components/input/Input'
-import Icon from '../../components/icon/IconWithAllIcons'
+import Icon from '../../components/icon/IconPrimary'
import Button from '../../components/button/Button'
import Logo from '../../components/logo/Logo'
import Notification from '../../components/notification/Notification'
diff --git a/packages/dnb-ui-lib/src/style/dnb-ui-components.scss b/packages/dnb-ui-lib/src/style/dnb-ui-components.scss
index 85ec88c883d..15e744cc168 100644
--- a/packages/dnb-ui-lib/src/style/dnb-ui-components.scss
+++ b/packages/dnb-ui-lib/src/style/dnb-ui-components.scss
@@ -9,7 +9,6 @@
@import '../components/dropdown/style/_dropdown.scss';
@import '../components/form-label/style/_form-label.scss';
@import '../components/icon/style/_icon.scss';
-@import '../components/icon-with-all-icons/style/_icon-with-all-icons.scss';
@import '../components/input/style/_input.scss';
@import '../components/input-masked/style/_input-masked.scss';
@import '../components/line-title/style/_line-title.scss';
diff --git a/packages/dnb-ui-lib/stories/components.js b/packages/dnb-ui-lib/stories/components.js
index 70dcfc45aeb..937dd01d9db 100644
--- a/packages/dnb-ui-lib/stories/components.js
+++ b/packages/dnb-ui-lib/stories/components.js
@@ -10,7 +10,7 @@ import styled from 'react-emotion'
import '../src/style'
// UI Components
-import { Button, IconWithAllIcons as Icon } from '../src/components'
+import { Button, IconPrimary as Icon } from '../src/components'
// import Body from '../src/components/body/Body'
// import ActionNavExample from '../src/patterns/action-nav/Example'
diff --git a/packages/examples/example-html/static/index.html b/packages/examples/example-html/static/index.html
index 863b4a77414..d178bd3d1b9 100644
--- a/packages/examples/example-html/static/index.html
+++ b/packages/examples/example-html/static/index.html
@@ -13,7 +13,7 @@