@bonniernews/dn-design-system-web 4.1.0-alpha.0 → 4.1.0-alpha.2

package/CHANGELOG.md

@@ -3,6 +3,23 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 4.1.0-alpha.2 (2023-08-25)
+
+
+### Features
+
+* **web:** implement the groupheader component ([#961](https://github.com/BonnierNews/dn-design-system/issues/961)) ([7767031](https://github.com/BonnierNews/dn-design-system/commit/77670310626cbbe1516e5fd0937c300c6938dbcb))
+
+
+
+## 4.1.0-alpha.1 (2023-08-24)
+
+**Note:** Version bump only for package @bonniernews/dn-design-system-web
+
+
+
+
+
 ## 4.1.0-alpha.0 (2023-08-23)
 
 

package/components/article-body-image/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/article-body-image](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/article-body-image)
-- Storybook: [ArticleBodyImage > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-image-bodyimage-web--article-body-image)
+- Storybook: [ArticleBodyImage](https://designsystem.dn.se/?path=/docs/article-articlebodyimage--docs)
+- Storybook (Latest): [ArticleBodyImage](https://designsystem-latest.dn.se/?path=/docs/article-articlebodyimage--docs)
 
 ----
 

package/components/article-top-image/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/article-top-image](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/article-top-image)
-- Storybook: [ArticleTopImage > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-image-topimage-web--article-top-image)
+- Storybook: [ArticleTopImage](https://designsystem.dn.se/?path=/docs/article-articletopimage--docs)
+- Storybook (Latest): [ArticleTopImage](https://designsystem-latest.dn.se/?path=/docs/article-articletopimage--docs)
 
 ----
 

package/components/badge/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/badge](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/badge)
-- Storybook: [Badge > Badge > Web](https://designsystem.dn.se/?path=/story/components-app-web-badge-badge-web)
-- Storybook: [Badge > BadgeWithFigure > Web ](https://designsystem.dn.se/?path=/story/components-app-web-badge-badgewithfigure-web)
+- Storybook: [Badge](https://designsystem.dn.se/?path=/docs/basic-badge--docs)
+- Storybook (Latest): [Badge](https://designsystem-latest.dn.se/?path=/docs/basic-badge--docs)
 
 ----
 

package/components/blocked-content/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/blocked-content](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/blocked-content)
-- Storybook (PROD): [BlockedContent > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-blocked-content-web--standard)
-- Storybook (LATEST): [BlockedContent > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-article-components-blocked-content-web--standard)
+- Storybook: [BlockedContent](https://designsystem.dn.se/?path=/docs/article-blockedcontent--docs)
+- Storybook (Latest): [BlockedContent](https://designsystem-latest.dn.se/?path=/docs/article-blockedcontent--docs)
 
 ----
 

package/components/buddy-menu/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/buddy-menu](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/buddy-menu)
-- Storybook: [BuddyMenu > Web](https://designsystem.dn.se/?path=/story/components-web-buddymenu-web--buddy-menu)
+- Storybook: [BuddyMenu](https://designsystem.dn.se/?path=/docs/page-buddymenu--docs)
+- Storybook (Latest): [BuddyMenu](https://designsystem-latest.dn.se/?path=/docs/page-buddymenu--docs)
 
 ----
 

package/components/button/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/button](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/button)
-- Storybook: [Button > Web](https://designsystem.dn.se/?path=/story/components-app-web-button-web)
+- Storybook: [Buttons > Button](https://designsystem.dn.se/?path=/docs/basic-buttons-button--docs)
+- Storybook (Latest): [Buttons > Button](https://designsystem-latest.dn.se/?path=/docs/basic-buttons-button--docs)
 
 ----
 
@@ -17,7 +18,7 @@
 |mobile.fullWidth | bool | no | true, false | false | Ex mobile: { fullWidth: true } |
 |condensed | bool | no | true, false | false | Condensed reduces spacing to a bare minimum, use with care since this might make touch target area smaller than recommended size |
 |iconPosition | String | no | none, left, right | none | |
-|iconName | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|iconName | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |loading | bool | no | true, false | false | |
 |type | String | no | button, submit | button | |
 |href | String | no | | | If href is set the button will be rendered as an a-tag |

package/components/button-toggle/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/button-toggle](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/button-toggle)
-- Storybook: [Button > Web](https://designsystem.dn.se/?path=/story/components-app-web-button-togglebutton-web)
+- Storybook: [Buttons > ButtonToggle](https://designsystem.dn.se/?path=/docs/basic-buttons-buttontoggle--docs)
+- Storybook (Latest): [Buttons > ButtonToggle](https://designsystem-latest.dn.se/?path=/docs/basic-buttons-buttontoggle--docs)
 
 ----
 
@@ -14,7 +15,7 @@
 |selectedText | String | yes | | | |
 |disabled | bool | no | true, false | false | |
 |variant | String | no | brand, SecondaryFilled | brand | Design variant |
-|size| String | no | default, small | default | |
+|size| String | no | default, small, xsmall | default | |
 |fullWidth | bool | no | true, false | false | Button will be full width on both desktop and mobile |
 |condensed | bool | no | true, false | false | Condensed reduces spacing to a bare minimum, use with care since this might make touch target area smaller than recommended size |
 |mobile.fullWidth | bool | no | true, false | false | Ex mobile: { fullWidth: true } |

package/components/byline/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/byline](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/byline)
-- Storybook: [Byline > Web > Link](https://designsystem.dn.se/?path=/story/components-app-web-article-components-byline-web--link)
-- Storybook: [Byline > Web > Follow ](https://designsystem.dn.se/?path=/story/components-app-web-article-components-byline-web--follow)
+- Storybook: [Byline](https://designsystem.dn.se/?path=/docs/article-byline--docs)
+- Storybook (Latest): [Byline](https://designsystem-latest.dn.se/?path=/docs/article-byline--docs)
 
 ----
 

package/components/checkbox/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/checkbox](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/checkbox)
-- Storybook: [Checkbox > Web](https://designsystem.dn.se/?path=/story/components-app-web-checkbox-web)
+- Storybook: [Form > Checkbox](https://designsystem.dn.se/?path=/docs/basic-form-checkbox--docs)
+- Storybook (Latest): [Form > Checkbox](https://designsystem-latest.dn.se/?path=/docs/basic-form-checkbox--docs)
 
 ----
 

package/components/disclaimer/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/disclaimer](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/disclaimer)
-- Storybook (PROD): [Disclaimer > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-disclaimer-web--plain-disclaimer)
-- Storybook (LATEST): [Disclaimer > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-article-components-disclaimer-web--plain-disclaimer)
+- Storybook: [Disclaimer](https://designsystem.dn.se/?path=/docs/article-disclaimer--docs)
+- Storybook (Latest): [Disclaimer](https://designsystem-latest.dn.se/?path=/docs/article-disclaimer--docs)
 
 ----
 
@@ -11,7 +11,7 @@
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
 |bodyHtml | String | yes | | | Intended use is text, links and inlined icons |
-|iconName | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|iconName | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |variant | String | no | default, native | default | |
 |attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |
 |classNames | String | no | | | Ex. "my-special-class" |

package/components/divider/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/divider](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/divider)
-- Storybook: [Divider > Web](https://designsystem.dn.se/?path=/story/components-app-web-divider-web)
+- Storybook: [Divider](https://designsystem.dn.se/?path=/docs/basic-divider--docs)
+- Storybook (Latest): [Divider](https://designsystem-latest.dn.se/?path=/docs/basic-divider--docs)
 
 ----
 

package/components/factbox/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/factbox](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/factbox)
-- Storybook (PROD): [Factbox > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-factbox-web--standard)
-- Storybook (LATEST): [Factbox > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-article-components-factbox-web--standard)
+- Storybook: [Factbox](https://designsystem.dn.se/?path=/docs/article-factbox--docs)
+- Storybook (Latest): [Factbox](https://designsystem-latest.dn.se/?path=/docs/article-factbox--docs)
 
 ----
 

package/components/footer/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/footer](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/footer)
-- Storybook: [Footer > Web](https://designsystem.dn.se/?path=/story/components-web-footer-web--footer)
+- Storybook: [Footer](https://designsystem.dn.se/?path=/docs/page-footer--docs)
+- Storybook (Latest): [Footer](https://designsystem-latest.dn.se/?path=/docs/page-footer--docs)
 
 ----
 
@@ -28,19 +29,19 @@ These are copy paste friendly examples to quickliy get started using a component
 
 {{ Footer({
   linkGroups: [
-    { 
-      title: "Om Dn", 
+    {
+      title: "Om Dn",
       links: [
-        { 
+        {
           href: "/kontakt/",
           text: "Kontakta oss"
         }
       ]
     },
-    { 
-      title: "Följ oss", 
+    {
+      title: "Följ oss",
       links: [
-        { 
+        {
           href: "#",
           text: "Twitter",
           classNames: "twitter-link",
@@ -56,10 +57,10 @@ These are copy paste friendly examples to quickliy get started using a component
     text: "Punkten efter Dagens Nyheter har funnits med.."
   },
   channels: [
-    { 
-      href: "?channel=mobile", 
-      text: "Mobil", 
-      classNames: "hidden-mobile", 
+    {
+      href: "?channel=mobile",
+      text: "Mobil",
+      classNames: "hidden-mobile",
       attributes: {rel: "nofollow"}
     }
   ],

package/components/group-header/README.md

@@ -0,0 +1,44 @@
+- GitHub: [BonnierNews/dn-design-system/../web/src/components/group-header](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/group-header)
+- Storybook: [GroupHeader](https://designsystem.dn.se/?path=/docs/basic-groupheader--docs)
+- Storybook (Latest): [GroupHeader](https://designsystem.dn.se/?path=/docs/basic-groupheader--docs)
+
+----
+
+# GroupHeader
+
+## Parameters
+
+|parameter | type | required | options | default | description |
+|:--- | :--- | :--- | :--- | :--- | :--- |
+|title | string | yes | | | The title text |
+|variant | string | no | icon, link, toggle | icon | The variant to render |
+|href | string | no | | | If given, the title is rendered as a link. Only available for variants `icon` and `link` |
+|linkText | string | no | | | The link text to render (only for variant `link`) |
+|toggle | object | no | | | Arguments to the ToggleButton (only for variant `toggle`) |
+|classNames | String | no | | | Ex. "my-special-class" |
+|attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |
+
+Depending on variant, only one of `toggle`, `linkText` is allowed. In `icon` and `link` mode, the `href` is required to show the ornament.
+
+## Minimum requirement example
+
+### Nunjucks
+
+These are copy paste friendly examples to quickliy get started using a component.
+
+```html
+{% from '@bonniernews/dn-design-system-web/components/group-header/group-header.njk' import GroupHeader %}
+
+{{ call GroupHeader({
+  title: "Dagens Nyheter",
+  href: "https://www.dn.se/"
+}) }}
+```
+
+### SCSS
+```scss
+@use "@bonniernews/dn-design-system-web/components/group-header/group-header";
+```
+
+### JS
+If you provide the `toggle` parameter, you might need to initiate that component, [as per the documentation](https://designsystem.dn.se/?path=/readmetab/basic-buttons-buttontoggle--docs).

package/components/group-header/group-header.njk

@@ -0,0 +1,42 @@
+{% from '@bonniernews/dn-design-system-web/njk-helpers/attributes.njk' import getAttributes %}
+{% from '@bonniernews/dn-design-system-web/components/icon-sprite/icon-sprite.njk' import IconUse %}
+{% from '@bonniernews/dn-design-system-web/components/button-toggle/button-toggle.njk' import ButtonToggle %}
+
+{% macro GroupHeader(params) %}
+  {% set componentClassName = "ds-group-header" %}
+  {% set classNamePrefix = componentClassName + "--" %}
+  {% set variant = [] %}
+  {% set attributes = getAttributes(params.attributes) %}
+
+  {% if params.classNames %}
+    {% set variant = (variant.push(params.classNames), variant) %}
+  {% endif%}
+
+  {% set classes = componentClassName + " " + variant | join(" ") %}
+
+  {% set groupHeaderInner %}
+    <h2 class="{{ componentClassName + '__title'}}">{{ params.title}}</h2>
+
+    {% if params.variant == 'toggle' and params.toggle %}
+      {# Could we add defaults here? #}
+      {{ ButtonToggle(params.toggle) }}
+    {% elif params.variant == 'link' and params.linkText and params.href %}
+      <span class="{{ componentClassName + '__right-link' }}">
+        {{ params.linkText }}
+      </span>
+    {% elif (params.variant == 'icon' or not params.variant) and params.href %}
+      {{ IconUse({ icon: "arrow_forward" }) }}
+    {% endif %}
+  {% endset %}
+
+  {% if (params.variant == 'link' or params.variant == 'icon' or not params.variant) and params.href %}
+    <a class="{{ classes }} {{ componentClassName + '--link'}}" href="{{ params.titleHref }}" {{ attributes | safe }}>
+      {{ groupHeaderInner | safe }}
+    </a>
+  {% else %}
+    <div class="{{ classes }}" {{ attributes | safe }}>
+      {{ groupHeaderInner | safe }}
+    </div>
+  {% endif %}
+
+{% endmacro %}

package/components/group-header/group-header.scss

@@ -0,0 +1,49 @@
+@use "../../foundations/helpers/forward.helpers.scss" as *;
+@use "../button-toggle/button-toggle.scss";
+
+.ds-group-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background: $ds-color-background-primary;
+  color: $ds-color-text-primary;
+  padding: ds-spacing-component(0 $ds-sc-x4);
+  @include ds-typography($ds-typography-functional-body02regular);
+
+  .ds-group-header__right-link,
+  .ds-btn-toggle,
+  .ds-icon {
+    flex-shrink: 0;
+  }
+
+  .ds-group-header__right-link {
+    @include ds-link($ds-link-paragraph);
+  }
+
+  .ds-icon {
+    height: 24px;
+    width: 24px;
+  }
+
+  &.ds-group-header--link {
+    @include ds-link($ds-link-list);
+
+    @include ds-hover(true) {
+      text-decoration: none;
+
+      .ds-group-header__title {
+        @include ds-underline(1px, 2px);
+      }
+
+      .ds-group-header__right-link {
+        text-decoration: none;
+      }
+    }
+  }
+
+  .ds-group-header__title {
+    padding: ds-spacing-component($ds-sc-x3 0);
+    @include ds-typography($ds-typography-functional-body02bold);
+    margin: 0;
+  }
+}

package/components/icon-button/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/icon-button](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/icon-button)
-- Storybook: [IconButton > Web](https://designsystem.dn.se/?path=/story/components-app-web-iconbutton-iconbutton-web)
+- Storybook: [Buttons > IconButton](https://designsystem.dn.se/?path=/docs/basic-buttons-iconbutton--docs)
+- Storybook (Latest): [Buttons > IconButton](https://designsystem-latest.dn.se/?path=/docs/basic-buttons-iconbutton--docs)
 
 ----
 
@@ -9,7 +10,7 @@
 
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
-|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |disabled | bool | no | true, false | false | Note: only works on button-tag, not on a-tag |
 |variant | String | no | outlined, transparent, elevated | outlined | Design variant |
 |size| String | no | default, small, large | default | |

package/components/icon-button-toggle/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/icon-button-toggle](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/icon-button-toggle)
-- Storybook: [IconButton > Web](https://designsystem.dn.se/?path=/story/components-app-web-iconbutton-toggleiconbutton-web)
+- Storybook: [Buttons > IconButtonToggle](https://designsystem.dn.se/?path=/docs/basic-buttons-iconbuttontoggle--docs)
+- Storybook (Latest): [Buttons > IconButtonToggle](https://designsystem-latest.dn.se/?path=/docs/basic-buttons-iconbuttontoggle--docs)
 
 ----
 
@@ -10,8 +11,8 @@
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
 |selected | bool | no | true, false | false | |
-|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
-|selectedIconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |v
+|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
+|selectedIconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |v
 |disabled | bool | no | true, false | false | Note: only works on button-tag, not on a-tag |
 |variant | String | no | outlined, transparent | outlined | Design variant |
 |size| String | no | default, small, large | default | |
@@ -49,4 +50,4 @@ These are copy paste friendly examples to quickliy get started using a component
 import dsIconButtonToggle from '@bonniernews/dn-design-system-web/components/icon-button-toggle/icon-button-toggle.js'
 const toggleElements = Array.from(document.getElementsByClassName("ds-icon-btn-toggle"));
 dsIconButtonToggle(toggleElements);
-```
+```

package/components/icon-sprite/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/icon-sprite](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/icon-sprite)
-- Storybook: [Icon > Web](https://designsystem.dn.se/?path=/story/foundations-icon-web--all)
+- Storybook: [Icon](https://designsystem.dn.se/?path=/docs/foundations-icons--docs)
+- Storybook (Latest): [Icon](https://designsystem-latest.dn.se/?path=/docs/foundations-icons--docs)
 
 ----
 # Icons
@@ -16,7 +17,7 @@ There are three ways to use icons from DS:
 
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
-|icon | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|icon | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |classNames | String | no | | | Ex. "my-special-class" |
 |attributes | Object | no | | | Ex. { "data-test": "lorem ipsum" } |
 |~forcePx~ | | | | | Not supported |

package/components/icon-with-wrapper/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/icon-with-wrapper](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/icon-with-wrapper)
-- Storybook: [Icon > Web](https://designsystem.dn.se/?path=/story/foundations-icon-web--all)
+- Storybook: [Icon](https://designsystem.dn.se/?path=/docs/foundations-icons--docs)
+- Storybook (Latest): [Icon](https://designsystem-latest.dn.se/?path=/docs/foundations-icons--docs)
 
 ----
 
@@ -9,7 +10,7 @@
 
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
-|icon | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|icon | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |color | String | no | primary, primary-02 etc | primary | Any icon color, use without `icon-` prefix. For all available colors see: https://designsystem.dn.se/?path=/story/foundations-colors--colors |
 |size| Int | no | 16, 20, 24, 32, 40 | 24 | |
 |classNames | String | no | | | Ex. "my-special-class" |
@@ -48,7 +49,7 @@ These are copy paste friendly examples to quickliy get started using a component
 
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
-|icon | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|icon | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |classNames | String | no | | | Ex. "my-special-class" |
 |attributes | Object | no | | | Ex. { "data-test": "lorem ipsum" } |
 |~forcePx~ | | | | | Not supported |

package/components/image-caption/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/image-caption](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/image-caption)
-- Storybook: [ImageCaption > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-image-imagecaption-web--image-caption)
+- Storybook: [ImageCaption](https://designsystem.dn.se/?path=/docs/article-imagecaption--docs)
+- Storybook (Latest): [ImageCaption](https://designsystem-latest.dn.se/?path=/docs/article-imagecaption--docs)
 
 ----
 

package/components/list-item/README-accordion.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/list-item](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/list-item)
-- Storybook: [ListItem > AccordionListItem > Web](https://designsystem.dn.se/?path=/story/components-app-web-listitem-accordionlistitem-web)
+- Storybook: [ListItem > AccordionListItem](https://designsystem.dn.se/?path=/story/basic-listitem-accordionlistitem--docs)
+- Storybook (Latest): [ListItem > AccordionListItem](https://designsystem-latest.dn.se/?path=/story/basic-listitem-accordionlistitem--docs)
 
 ----
 
@@ -16,7 +17,7 @@
 |meta | String | no | | | |
 |disabled | bool | no | true, false | false | |
 |border | bool | no | true, false | false | |
-|leadingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|leadingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |
 |classNames | String | no | | | Ex. "my-special-class" |
 |forcePx | bool | no | true, false | false | Fixed pixel value is used for typography to prevent scaling based on html font-size

package/components/list-item/README-checkbox.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/list-item](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/list-item)
-- Storybook: [ListItem > CheckboxListItem > Web](https://designsystem.dn.se/?path=/story/components-app-web-listitem-checkboxlistitem-web)
+- Storybook: [ListItem > CheckboxListItem](https://designsystem.dn.se/?path=/docs/basic-listitem-checkboxlistitem--docs)
+- Storybook (Latest): [ListItem > CheckboxListItem](https://designsystem-latest.dn.se/?path=/docs/basic-listitem-checkboxlistitem--docs)
 
 ----
 

package/components/list-item/README-radio.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/list-item](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/list-item)
-- Storybook: [ListItem > RadioListItem > Web](https://designsystem.dn.se/?path=/story/components-app-web-listitem-radiolistitem-web)
+- Storybook: [ListItem > RadioListItem](https://designsystem.dn.se/?path=/docs/basic-listitem-radiolistitem--docs)
+- Storybook (Latest): [ListItem > RadioListItem](https://designsystem-latest.dn.se/?path=/docs/basic-listitem-radiolistitem--docs)
 
 ----
 

package/components/list-item/README-switch.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/list-item](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/list-item)
-- Storybook: [ListItem > SwitchListItem > Web](https://designsystem.dn.se/?path=/story/components-app-web-listitem-switchlistitem-web)
+- Storybook: [ListItem > SwitchListItem](https://designsystem.dn.se/?path=/docs/basic-listitem-switchlistitem--docs)
+- Storybook (Latest): [ListItem > SwitchListItem](https://designsystem-latest.dn.se/?path=/docs/basic-listitem-switchlistitem--docs)
 
 ----
 
@@ -16,7 +17,7 @@
 |selected | bool | no | true, false | false | |
 |disabled | bool | no | true, false | false | |
 |border | bool | no | true, false | false | |
-|leadingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|leadingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |
 |elementAttributes | Object | no | | | Sets attributes on actual switch element and not list item. Same structure as attributes above |
 |classNames | String | no | | | Ex. "my-special-class" |

package/components/list-item/README-toggle.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/list-item](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/list-item)
-- Storybook: [ListItem > ToggleListItem > Web](https://designsystem.dn.se/?path=/story/components-app-web-listitem-togglelistitem-web)
+- Storybook: [ListItem > ToggleListItem](https://designsystem.dn.se/?path=/docs/basic-listitem-togglelistitem--docs)
+- Storybook (Latest): [ListItem > ToggleListItem](https://designsystem-latest.dn.se/?path=/docs/basic-listitem-togglelistitem--docs)
 
 ----
 

package/components/list-item/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/list-item](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/list-item)
-- Storybook: [ListItem > StandardListItem > Web](https://designsystem.dn.se/?path=/story/components-app-web-listitem-standardlistitem-web)
+- Storybook: [ListItem > StandardListItem](https://designsystem.dn.se/?path=/docs/basic-listitem-standardlistitem--docs)
+- Storybook (Latest): [ListItem > StandardListItem](https://designsystem-latest.dn.se/?path=/docs/basic-listitem-standardlistitem--docs)
 
 ----
 
@@ -15,8 +16,8 @@
 |meta | String | no | | | |
 |disabled | bool | no | true, false | false | Note: only works on button-tag, not on a-tag |
 |border | bool | no | true, false | false | |
-|leadingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
-|trailingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|leadingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
+|trailingIcon | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |href | String | no | | | If href is set the list item will be rendered as an a-tag |
 |attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |
 |classNames | String | no | | | Ex. "my-special-class" |

package/components/pictogram/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/pictogram](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/pictogram)
-- Storybook: [Pictogram > Web](https://designsystem.dn.se/?path=/story/components-app-web-pictogram-web)
+- Storybook: [Pictogram](https://designsystem.dn.se/?path=/docs/basic-pictogram--docs)
+- Storybook (Latest): [Pictogram](https://designsystem-latest.dn.se/?path=/docs/basic-pictogram--docs)
 
 ----
 
@@ -10,7 +11,7 @@
 |parameter | type | required | options | default | description |
 |:--- | :--- | :--- | :--- | :--- | :--- |
 |variant| String | yes | brand, business | brand | Design variant |
-|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |size| String | yes | small, large | small | |
 |attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |
 |classNames | String | no | | | Ex. "my-special-class" |

package/components/quote/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/quote](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/quote)
-- Storybook: [Quote > Web](https://designsystem.dn.se/?path=/story/components-app-web-quote-web)
+- Storybook: [Quote](https://designsystem.dn.se/?path=/docs/article-quote--docs)
+- Storybook (Latest): [Quote](https://designsystem-latest.dn.se/?path=/docs/article-quote--docs)
 
 ----
 

package/components/radio-button/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/radio-button](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/radio-button)
-- Storybook: [RadioButton > Web](https://designsystem.dn.se/?path=/story/components-app-web-radiobutton-web)
+- Storybook: [Form > RadioButton](https://designsystem.dn.se/?path=/docs/basic-form-radiobutton--docs)
+- Storybook (Latest): [Form > RadioButton](https://designsystem-latest.dn.se/?path=/docs/basic-form-radiobutton--docs)
 
 ----
 

package/components/spinner/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/spinner](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/spinner)
-- Storybook: [Spinner > Web](https://designsystem.dn.se/?path=/story/components-app-web-spinner-web)
+- Storybook: [Spinner](https://designsystem.dn.se/?path=/docs/basic-spinner--docs)
+- Storybook (Latest): [Spinner](https://designsystem-latest.dn.se/?path=/docs/basic-spinner--docs)
 ----
 
 # Spinner

package/components/switch/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/switch](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/switch)
-- Storybook: [Switch > Web](https://designsystem.dn.se/?path=/story/components-app-web-switch-web)
+- Storybook: [Form > Switch](https://designsystem.dn.se/?path=/docs/basic-form-switch--docs)
+- Storybook (Latest): [Form > Switch](https://designsystem-latest.dn.se/?path=/docs/basic-form-switch--docs)
 ----
 
 # Switch

package/components/teaser-dot/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-dot](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-dot)
-- Storybook: [TeaserDot > Web](https://designsystem.dn.se/?path=/story/components-app-web-teaser-dot-web)
+- Storybook: [Subcomponents > TeaserDot](https://designsystem.dn.se/?path=/docs/section-subcomponents-teaserdot--docs)
+- Storybook (Latest): [Subcomponents > TeaserDot](https://designsystem-latest.dn.se/?path=/docs/section-subcomponents-teaserdot--docs)
 
 ----
 

package/components/teaser-image/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-image](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-image)
-- Storybook (PROD): [TeaserImage > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaserimage-web--teaser-image)
-- Storybook (LATEST): [TeaserImage > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaserimage-web--teaser-image)
+- Storybook: [Subcomponents > TeaserImage](https://designsystem.dn.se/?path=/docs/section-subcomponents-teaserimage--docs)
+- Storybook (Latest): [Subcomponents > TeaserImage](https://designsystem-latest.dn.se/?path=/docs/section-subcomponents-teaserimage--docs)
 
 ----
 
@@ -37,4 +37,3 @@ These are copy paste friendly examples to quickliy get started using a component
 ```
 
 This scss is already included in `teaser.scss`.
-

package/components/teaser-large/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-large](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-large)
-- Storybook (PROD): [TeaserLarge > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaserlarge-web)
-- Storybook (LATEST): [TeaserLarge > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaserlarge-web)
+- Storybook: [TeaserLarge](https://designsystem.dn.se/?path=/docs/section-teaserlarge--docs)
+- Storybook (Latest): [TeaserLarge](https://designsystem-latest.dn.se/?path=/docs/section-teaserlarge--docs)
 
 ----
 

package/components/teaser-list-timeline/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-list-timeline](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-list-timeline)
-- Storybook (PROD): [TeaserListTimeline > Web](https://designsystem.dn.se/?path=/story/section-teaserlisttimeline--teaser-list-timeline)
-- Storybook (LATEST): [TeaserListTimeline > Web](https://designsystem-latest.dn.se/?path=/story/section-teaserlisttimeline--teaser-list-timeline)
+- Storybook: [TeaserListTimeline](https://designsystem.dn.se/?path=/docs/section-teaserlisttimeline--docs)
+- Storybook (Latest): [TeaserListTimeline](https://designsystem-latest.dn.se/?path=/docs/section-teaserlisttimeline--docs)
 
 ----
 

package/components/teaser-native/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-native](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-native)
-- Storybook (PROD): [TeaserNative > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teasernative-web--native)
-- Storybook (LATEST): [TeaserNative > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teasernative-web--native)
+- Storybook: [TeaserNative](https://designsystem.dn.se/?path=/docs/section-teasernative--docs)
+- Storybook (Latest): [TeaserNative](https://designsystem-latest.dn.se/?path=/docs/section-teasernative--docs)
 
 ----
 

package/components/teaser-onsite/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-onsite](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-onsite)
-- Storybook (PROD): [TeaserOnSite > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaseronsite-web)
-- Storybook (LATEST): [TeaserOnSite > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaseronsite-web)
+- Storybook: [TeaserOnSite](https://designsystem.dn.se/?path=/docs/section-teaseronsite--docs)
+- Storybook (Latest): [TeaserOnSite](https://designsystem-latest.dn.se/?path=/docs/section-teaseronsite--docs)
 
 ----
 

package/components/teaser-package/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-package](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-package)
-- Storybook (PROD): [TeaserPackage > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaserpackage-web)
-- Storybook (LATEST): [TeaserPackage > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaserpackage-web)
+- Storybook: [TeaserPackage](https://designsystem.dn.se/?path=/docs/section-teaserpackage--docs)
+- Storybook (Latest): [TeaserPackage](https://designsystem-latest.dn.se/?path=/docs/section-teaserpackage--docs)
 
 ----
 

package/components/teaser-right-now/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-right-now](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-right-now)
-- Storybook (PROD): [TeaserRightNow > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaserrightnow-web--right-now)
-- Storybook (LATEST): [TeaserRightNow > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaserrightnow-web--right-now)
+- Storybook: [TeaserRightNow](https://designsystem.dn.se/?path=/docs/section-teaserrightnow--docs)
+- Storybook (Latest): [TeaserRightNow](https://designsystem-latest.dn.se/?path=/docs/section-teaserrightnow--docs)
 
 ----
 

package/components/teaser-slideshow/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-slideshow](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-slideshow)
-- Storybook (PROD): [TeaserSlideshow > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaserslideshow-web)
-- Storybook (LATEST): [TeaserSlideshow > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaserslideshow-web)
+- Storybook: [TeaserSlideshow](https://designsystem.dn.se/?path=/docs/section-teaserslideshow--docs)
+- Storybook (Latest): [TeaserSlideshow](https://designsystem-latest.dn.se/?path=/docs/section-teaserslideshow--docs)
 
 ----
 

package/components/teaser-split/README-container.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-split](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-split)
-- Storybook (PROD): [TeaserSplitContainer > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teasersplitcontainer-web)
-- Storybook (LATEST): [TeaserSplitContainer > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teasersplitcontainer-web)
+- Storybook: [TeaserSplitContainer](https://designsystem.dn.se/?path=/docs/section-teasersplitcontainer--docs)
+- Storybook (Latest): [TeaserSplitContainer](https://designsystem-latest.dn.se/?path=/docs/section-teasersplitcontainer--docs)
 
 ----
 

package/components/teaser-split/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-split](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-split)
-- Storybook (PROD): [TeaserSplit > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teasersplit-web)
-- Storybook (LATEST): [TeaserSplit > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teasersplit-web)
+- Storybook: [TeaserSplit](https://designsystem.dn.se/?path=/docs/section-teasersplitcontainer-teasersplit--docs)
+- Storybook (Latest): [TeaserSplit](https://designsystem-latest.dn.se/?path=/docs/section-teasersplitcontainer-teasersplit--docs)
 
 ----
 

package/components/teaser-standard/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-standard](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-standard)
-- Storybook (PROD): [TeaserStandard > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teaserstandard-web)
-- Storybook (LATEST): [TeaserStandard > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teaserstandard-web)
+- Storybook: [TeaserStandard](https://designsystem.dn.se/?path=/docs/section-teaserstandard--docs)
+- Storybook (Latest): [TeaserStandard](https://designsystem-latest.dn.se/?path=/docs/section-teaserstandard--docs)
 
 ----
 

package/components/teaser-tipsa/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/teaser-tipsa](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/teaser-tipsa)
-- Storybook (PROD): [TeaserTipsa > Web](https://designsystem.dn.se/?path=/story/components-app-web-section-components-teasertipsa-web)
-- Storybook (LATEST): [TeaserTipsa > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-teasertipsa-web)
+- Storybook: [TeaserTipsa](https://designsystem.dn.se/?path=/docs/section-teasertipsa--docs)
+- Storybook (Latest): [TeaserTipsa](https://designsystem-latest.dn.se/?path=/docs/section-teasertipsa--docs)
 
 ----
 

package/components/text-button/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/text-button](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/text-button)
-- Storybook: [TextButton > Web](https://designsystem.dn.se/?path=/story/components-app-web-textbutton-textbutton-web)
+- Storybook: [Buttons > TextButton](https://designsystem.dn.se/?path=/docs/basic-buttons-textbutton--docs)
+- Storybook (Latest): [Buttons > TextButton](https://designsystem-latest.dn.se/?path=/docs/basic-buttons-textbutton--docs)
 
 ----
 
@@ -15,7 +16,7 @@
 |mobile.fullWidth | bool | no | true, false | false | Ex mobile: { fullWidth: true } |
 |condensed | bool | no | true, false | false | Condensed reduces spacing to a bare minimum, use with care since this might make touch target area smaller than recommended size |
 |iconPosition | String | no | none, left, right | none | |
-|iconName | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|iconName | String | no | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |loading | bool | no | true, false | false | |
 |href | String | no | | | If href is set the button will be rendered as an a-tag |
 |attributes | Object | no | | | Ex. { target: "_blank", "data-test": "lorem ipsum" } |

package/components/text-button-toggle/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/text-button-toggle](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/text-button-toggle)
-- Storybook: [TextButton > Web](https://designsystem.dn.se/?path=/story/components-app-web-textbutton-toggletextbutton-web--toggle-text-button)
+- Storybook: [Buttons > TextButtonToggle](https://designsystem.dn.se/?path=/docs/basic-buttons-textbuttontoggle--docs)
+- Storybook (Latest): [Buttons > TextButtonToggle](https://designsystem-latest.dn.se/?path=/docs/basic-buttons-textbuttontoggle--docs)
 
 ----
 
@@ -12,8 +13,8 @@
 |selected | bool | no | true, false | false | |
 |text | String | yes | | | |
 |selectedText | String | yes | | | |
-|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
-|selectedIconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icon-web--all |
+|iconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
+|selectedIconName | String | yes | add, arrow_back, arrow_forward etc | | For all available icons see: https://designsystem.dn.se/?path=/story/foundations-icons--all-icons |
 |disabled | bool | no | true, false | false | Note: only works on button-tag, not on a-tag |
 |condensed | bool | no | true, false | false | Condensed reduces spacing to a bare minimum, use with care since this might make touch target area smaller than recommended size |
 |loading | bool | no | true, false | false | |

package/components/text-input/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/text-input](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/text-input)
-- Storybook: [Inputs > Password > Web](https://designsystem.dn.se/?path=/story/components-app-web-inputs-password-web)
-- Storybook: [Inputs > Text > Web](https://designsystem.dn.se/?path=/story/components-app-web-inputs-text-web)
+- Storybook: [Form > TextInput](https://designsystem.dn.se/?path=/docs/basic-form-textinput--docs)
+- Storybook (Latest): [Form > TextInput](https://designsystem-latest.dn.se/?path=/docs/basic-form-textinput--docs)
 
 ----
 

package/components/thematic-break/README.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/thematic-break](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/thematic-break)
-- Storybook: [ThematicBreak > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-thematicbreak-web--thematic-break)
+- Storybook: [ThematicBreak](https://designsystem.dn.se/?path=/docs/article-thematicbreak--docs)
+- Storybook (Latest): [ThematicBreak](https://designsystem-latest.dn.se/?path=/docs/article-thematicbreak--docs)
 
 ----
 

package/components/video-caption/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/video-caption](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/video-caption)
-- Storybook (PROD): [VideoCaption > Web](https://designsystem.dn.se/?path=/story/components-app-web-article-components-videocaption-web--video-caption)
-- Storybook (LATEST): [VideoCaption > Web](https://designsystem-latest.dn.se/?path=/story/components-app-web-article-components-videocaption-web--video-caption)
+- Storybook: [VideoCaption](https://designsystem.dn.se/?path=/docs/article-videocaption--docs)
+- Storybook (Latest): [VideoCaption](https://designsystem-latest.dn.se/?path=/docs/article-videocaption--docs)
 
 ----
 

package/components/vip-badge/README.md

@@ -1,6 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/components/vip-badge](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/components/vip-badge)
-- Storybook (PROD): [VipBadge > Web > Vip Badge](https://designsystem.dn.se/?path=/story/components-app-web-section-components-vipbadge-web)
-- Storybook (LATEST): [VipBadge > Web > Vip Badge With Text](https://designsystem-latest.dn.se/?path=/story/components-app-web-section-components-vipbadge-web)
+- Storybook: [Subcomponents > Vip Badge](https://designsystem.dn.se/?path=/docs/section-subcomponents-vipbadge--docs)
+- Storybook (Latest): [Subcomponents > Vip Badge](https://designsystem-latest.dn.se/?path=/docs/section-subcomponents-vipbadge--docs)
 
 ----
 

package/foundations/helpers/README-links.md

@@ -1,5 +1,6 @@
 - GitHub: [BonnierNews/dn-design-system/../web/src/foundations/helpers/links.scss](https://github.com/BonnierNews/dn-design-system/tree/main/web/src/foundations/helpers/links.scss)
-- Storybook: [Helpers > Link > Web](https://designsystem.dn.se/?path=/story/helpers-link-web--underline)
+- Storybook: [Link](https://designsystem.dn.se/?path=/docs/helpers-link--docs)
+- Storybook (Latest): [Link](https://designsystem-latest.dn.se/?path=/docs/helpers-link--docs)
 
 ----
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bonniernews/dn-design-system-web",
-  "version": "4.1.0-alpha.0",
+  "version": "4.1.0-alpha.2",
   "description": "DN design system for web.",
   "main": "index.js",
   "homepage": "https://github.com/BonnierNews/dn-design-system/tree/main/web/src#readme",