@scania/tegel 0.0.52 → 0.0.71-beta

package/dist/collection/components/header/header-toolbar.stories.js

@@ -1,207 +0,0 @@
-import readme from './readme.md';
-import { formatHtmlPreview } from '../../utils/utils';
-export default {
-  title: 'Components/Header',
-  parameters: {
-    notes: readme,
-    layout: 'fullscreen',
-    docs: {
-      source: {
-        state: 'closed',
-      },
-    },
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    siteName: {
-      name: 'Site name',
-      description: 'Sets a custom title for the header.',
-      control: {
-        type: 'text',
-      },
-    },
-  },
-  args: {
-    siteName: 'Application',
-  },
-};
-const ToolbarMenuTemplate = ({ siteName }) => formatHtmlPreview(`
-    <nav class='sdds-nav'>
-        <div class='sdds-nav__left'>
-          <div class="sdds-nav__overlay" onclick="closeDropdownsFromOverlay()"></div>
-          <button class='sdds-nav__mob-menu-btn' onclick='toggleMobileMenu()'>
-              <span id='sdds-nav__mob-menu-icon'>
-                  <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-1'></span>
-                  <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-2'></span>
-                  <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-3'></span>
-              </span>
-          </button>
-          <div class='sdds-nav__app-name'>${siteName}</div>
-        </div>
-
-        <div class='sdds-nav__center'>
-          <ul class='sdds-nav__inline-menu'>
-
-              <li class='sdds-nav__item'>
-                  <a class='sdds-nav__item-core' href='#'>
-                      <span class='span'>Item 1</span>
-                  </a>
-              </li>
-
-              <li class='sdds-nav__item sdds-nav__item--active'>
-                  <a class='sdds-nav__item-core ' href='#'>
-                      <span class='sdds-nav__item-core-text'>Item 2</span>
-                  </a>
-              </li>
-
-              <li class='sdds-nav__item sdds-nav__dropdown'>
-              <button class='sdds-nav__item-core' onclick='toggleInlineDropdown()'>
-                  <span class='sdds-nav__item-core-text'>Item 3</span>
-                  <span class='sdds-nav__dropdown-icon'>
-                    <sdds-icon class="sdds-nav__dropdown-icon-svg" name="chevron_down" size="16px"></sdds-icon> 
-                  </span>
-              </button>
-              <ul class='sdds-nav__dropdown-menu'>
-                  <li class='sdds-nav__dropdown-item'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3 long label...</a></li>
-                  <li class='sdds-nav__dropdown-item'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3</a></li>
-                  <li class='sdds-nav__dropdown-item sdds-nav__dropdown-item--active'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3 long label...</a></li>
-              </ul>
-              </li>
-          </ul>
-
-          <ul class='sdds-nav__toolbar-menu'>
-
-              <li class='sdds-nav__item sdds-nav__avatar' >
-                  <button class='sdds-nav__avatar-btn' onclick='toggleAvatarMenu()'>
-                      <img class="sdds-nav__avatar-img" src='https://www.svgrepo.com/show/170303/avatar.svg' alt='profile photo'/>
-                      <span class='sdds-nav__avatar-info sdds-nav__avatar-info--mobile'>
-                          <span class='sdds-nav__avatar-title'>Employee Name</span>
-                          <span class='sdds-nav__avatar-subtitle'>Company Name</span>
-                      </span>
-                  </button>
-
-                  <ul class='sdds-nav__avatar-menu'>
-                      <li class='sdds-nav__avatar-item sdds-nav__avatar-item--large'>
-                          <span class='sdds-nav__avatar-info'>
-                              <span class='sdds-nav__avatar-title'>Employee Name</span>
-                              <span class='sdds-nav__avatar-subtitle'>Company Name</span>
-                          </span>
-                      </li>
-                      <li class='sdds-nav__avatar-item'>
-                          <a href='' class='sdds-nav__avatar-item-core'>Link 1</a>
-                      </li>
-                      <li class='sdds-nav__avatar-item'>
-                          <a href='' class='sdds-nav__avatar-item-core'>Logout</a>
-                      </li>
-                  </ul>
-              </li>
-          </ul>
-        </div>
-
-        <div class='sdds-nav__right'>
-          <div class='sdds-nav__item sdds-nav__app-launcher'>
-              <button class='sdds-nav__app-launcher-btn' onclick='toggleAppLauncher()'>
-                <sdds-icon class="sdds-nav__app-launcher-btn-svg" name="bento" size="20px"></sdds-icon> 
-              </button>
-              <ul class='sdds-nav__app-launcher-menu'>
-                  <li class='sdds-nav__app-launcher-item sdds-nav__app-launcher-item--category'>
-                      <p class='sdds-nav__app-launcher-category-title'>Category 1</p>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 1</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 2</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 3</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 4</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 5</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 6</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item sdds-nav__app-launcher-item--category'>
-                      <p class='sdds-nav__app-launcher-category-title'>Category 2</p>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 1</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 2</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 3</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 4</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 5</a>
-                  </li>
-                  <li class='sdds-nav__app-launcher-item'>
-                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 6</a>
-                  </li>
-              </ul>
-          </div>
-          <a class='sdds-nav__item sdds-nav__app-logo' href='#'></a>
-        </div>
-    </nav>
-
-    <script>
-    /* Note: Code below is used only for inspiration and presentation purposes in Storybook */
-    toggleAvatarMenu = () => {
-        document.getElementsByClassName("sdds-nav")[0].classList.toggle("sdds-nav__avatar--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__mob-menu--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__app-launcher--opened");
-        document.getElementsByClassName("sdds-nav__item sdds-nav__dropdown")[0].classList.remove("sdds-nav__dropdown--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__searchbar--opened");
-    }
-    toggleMobileMenu = () => {
-        document.getElementsByClassName("sdds-nav")[0].classList.toggle("sdds-nav__mob-menu--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__avatar--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__app-launcher--opened");
-        document.getElementsByClassName("sdds-nav__item sdds-nav__dropdown")[0].classList.remove("sdds-nav__dropdown--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__searchbar--opened");
-    }
-    toggleAppLauncher = () => {
-        document.getElementsByClassName("sdds-nav")[0].classList.toggle("sdds-nav__app-launcher--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__mob-menu--opened");
-        document.getElementsByClassName("sdds-nav__item sdds-nav__dropdown")[0].classList.remove("sdds-nav__dropdown--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__avatar--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__searchbar--opened");
-    }
-    toggleInlineDropdown = () => {
-        document.getElementsByClassName("sdds-nav__item sdds-nav__dropdown")[0].classList.toggle("sdds-nav__dropdown--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__avatar--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__mob-menu--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__app-launcher--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__searchbar--opened");
-
-    }
-    closeDropdownsFromOverlay = () => {
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__mob-menu--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__app-launcher--opened");
-        document.getElementsByClassName("sdds-nav")[0].classList.remove("sdds-nav__searchbar--opened");
-
-    }
-
-    </script>
-    `);
-export const ToolbarMenu = ToolbarMenuTemplate.bind({});
-//# sourceMappingURL=header-toolbar.stories.js.map

package/dist/collection/components/header/header-toolbar.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"header-toolbar.stories.js","sourceRoot":"","sources":["../../../src/components/header/header-toolbar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,YAAY;IACpB,IAAI,EAAE;MACJ,MAAM,EAAE;QACN,KAAK,EAAE,QAAQ;OAChB;KACF;IACD,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,QAAQ,EAAE;MACR,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,qCAAqC;MAClD,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;GACF;EACD,IAAI,EAAE;IACJ,QAAQ,EAAE,aAAa;GACxB;CACF,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC3C,iBAAiB,CACf;;;;;;;;;;;4CAWwC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2J/C,CACF,CAAC;AAEJ,MAAM,CAAC,MAAM,WAAW,GAAG,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import readme from './readme.md';\nimport { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n  title: 'Components/Header',\n  parameters: {\n    notes: readme,\n    layout: 'fullscreen',\n    docs: {\n      source: {\n        state: 'closed',\n      },\n    },\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11142%3A42941&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    siteName: {\n      name: 'Site name',\n      description: 'Sets a custom title for the header.',\n      control: {\n        type: 'text',\n      },\n    },\n  },\n  args: {\n    siteName: 'Application',\n  },\n};\n\nconst ToolbarMenuTemplate = ({ siteName }) =>\n  formatHtmlPreview(\n    `\n    <nav class='sdds-nav'>\n        <div class='sdds-nav__left'>\n          <div class=\"sdds-nav__overlay\" onclick=\"closeDropdownsFromOverlay()\"></div>\n          <button class='sdds-nav__mob-menu-btn' onclick='toggleMobileMenu()'>\n              <span id='sdds-nav__mob-menu-icon'>\n                  <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-1'></span>\n                  <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-2'></span>\n                  <span class='sdds-nav__mob-menu-icon-line' id='sdds-nav__mob-menu-icon-line-3'></span>\n              </span>\n          </button>\n          <div class='sdds-nav__app-name'>${siteName}</div>\n        </div>\n\n        <div class='sdds-nav__center'>\n          <ul class='sdds-nav__inline-menu'>\n\n              <li class='sdds-nav__item'>\n                  <a class='sdds-nav__item-core' href='#'>\n                      <span class='span'>Item 1</span>\n                  </a>\n              </li>\n\n              <li class='sdds-nav__item sdds-nav__item--active'>\n                  <a class='sdds-nav__item-core ' href='#'>\n                      <span class='sdds-nav__item-core-text'>Item 2</span>\n                  </a>\n              </li>\n\n              <li class='sdds-nav__item sdds-nav__dropdown'>\n              <button class='sdds-nav__item-core' onclick='toggleInlineDropdown()'>\n                  <span class='sdds-nav__item-core-text'>Item 3</span>\n                  <span class='sdds-nav__dropdown-icon'>\n                    <sdds-icon class=\"sdds-nav__dropdown-icon-svg\" name=\"chevron_down\" size=\"16px\"></sdds-icon> \n                  </span>\n              </button>\n              <ul class='sdds-nav__dropdown-menu'>\n                  <li class='sdds-nav__dropdown-item'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3 long label...</a></li>\n                  <li class='sdds-nav__dropdown-item'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3</a></li>\n                  <li class='sdds-nav__dropdown-item sdds-nav__dropdown-item--active'><a class='sdds-nav__dropdown-item-core' href='#'>Sub item 3 long label...</a></li>\n              </ul>\n              </li>\n          </ul>\n\n          <ul class='sdds-nav__toolbar-menu'>\n\n              <li class='sdds-nav__item sdds-nav__avatar' >\n                  <button class='sdds-nav__avatar-btn' onclick='toggleAvatarMenu()'>\n                      <img class=\"sdds-nav__avatar-img\" src='https://www.svgrepo.com/show/170303/avatar.svg' alt='profile photo'/>\n                      <span class='sdds-nav__avatar-info sdds-nav__avatar-info--mobile'>\n                          <span class='sdds-nav__avatar-title'>Employee Name</span>\n                          <span class='sdds-nav__avatar-subtitle'>Company Name</span>\n                      </span>\n                  </button>\n\n                  <ul class='sdds-nav__avatar-menu'>\n                      <li class='sdds-nav__avatar-item sdds-nav__avatar-item--large'>\n                          <span class='sdds-nav__avatar-info'>\n                              <span class='sdds-nav__avatar-title'>Employee Name</span>\n                              <span class='sdds-nav__avatar-subtitle'>Company Name</span>\n                          </span>\n                      </li>\n                      <li class='sdds-nav__avatar-item'>\n                          <a href='' class='sdds-nav__avatar-item-core'>Link 1</a>\n                      </li>\n                      <li class='sdds-nav__avatar-item'>\n                          <a href='' class='sdds-nav__avatar-item-core'>Logout</a>\n                      </li>\n                  </ul>\n              </li>\n          </ul>\n        </div>\n\n        <div class='sdds-nav__right'>\n          <div class='sdds-nav__item sdds-nav__app-launcher'>\n              <button class='sdds-nav__app-launcher-btn' onclick='toggleAppLauncher()'>\n                <sdds-icon class=\"sdds-nav__app-launcher-btn-svg\" name=\"bento\" size=\"20px\"></sdds-icon> \n              </button>\n              <ul class='sdds-nav__app-launcher-menu'>\n                  <li class='sdds-nav__app-launcher-item sdds-nav__app-launcher-item--category'>\n                      <p class='sdds-nav__app-launcher-category-title'>Category 1</p>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 1</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 2</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 3</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 4</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 5</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 6</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item sdds-nav__app-launcher-item--category'>\n                      <p class='sdds-nav__app-launcher-category-title'>Category 2</p>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 1</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 2</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 3</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 4</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 5</a>\n                  </li>\n                  <li class='sdds-nav__app-launcher-item'>\n                      <a href='' class='sdds-nav__app-launcher-item-core'>Application 6</a>\n                  </li>\n              </ul>\n          </div>\n          <a class='sdds-nav__item sdds-nav__app-logo' href='#'></a>\n        </div>\n    </nav>\n\n    <script>\n    /* Note: Code below is used only for inspiration and presentation purposes in Storybook */\n    toggleAvatarMenu = () => {\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__avatar--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n        document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n    }\n    toggleMobileMenu = () => {\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__mob-menu--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n        document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n    }\n    toggleAppLauncher = () => {\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.toggle(\"sdds-nav__app-launcher--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n        document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.remove(\"sdds-nav__dropdown--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n    }\n    toggleInlineDropdown = () => {\n        document.getElementsByClassName(\"sdds-nav__item sdds-nav__dropdown\")[0].classList.toggle(\"sdds-nav__dropdown--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__avatar--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n\n    }\n    closeDropdownsFromOverlay = () => {\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__mob-menu--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__app-launcher--opened\");\n        document.getElementsByClassName(\"sdds-nav\")[0].classList.remove(\"sdds-nav__searchbar--opened\");\n\n    }\n\n    </script>\n    `,\n  );\n\nexport const ToolbarMenu = ToolbarMenuTemplate.bind({});\n"]}

package/dist/collection/components/icon/icon-font.stories.js

@@ -1,58 +0,0 @@
-import { formatHtmlPreview } from '../../utils/utils';
-import { iconsNames } from './iconsArray';
-import readme from './readme.md';
-export default {
-  title: 'Foundations/Icons',
-  parameters: {
-    layout: 'centered',
-    notes: readme,
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    icon: {
-      name: 'Icon name',
-      description: 'Select icon to display',
-      control: {
-        type: 'select',
-      },
-      options: iconsNames,
-    },
-    size: {
-      name: 'Size in pixels',
-      description: 'Set the size of the icon',
-      control: {
-        type: 'range',
-        min: 16,
-        max: 100,
-        step: 4,
-      },
-    },
-  },
-  args: {
-    size: 32,
-    icon: 'truck',
-  },
-};
-const IconFontTemplate = (args) => formatHtmlPreview(`
-  <style>
-    /* Demo code for presentation purposes */
-    @import url('https://cdn.digitaldesign.scania.com/icons/webfont/css/sdds-icons.css');
-    .sdds-icon { font-size: ${args.size}px; }
-  </style>
-
-  <i class="sdds-icon ${args.icon}"></i>
-  `);
-export const Native = IconFontTemplate.bind({});
-Native.args = {};
-//# sourceMappingURL=icon-font.stories.js.map

package/dist/collection/components/icon/icon-font.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"icon-font.stories.js","sourceRoot":"","sources":["../../../src/components/icon/icon-font.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,IAAI,EAAE;MACJ,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,wBAAwB;MACrC,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;OACf;MACD,OAAO,EAAE,UAAU;KACpB;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,gBAAgB;MACtB,WAAW,EAAE,0BAA0B;MACvC,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,EAAE;QACP,GAAG,EAAE,GAAG;QACR,IAAI,EAAE,CAAC;OACR;KACF;GACF;EACD,IAAI,EAAE;IACJ,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,OAAO;GACd;CACF,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,EAAE,CAChC,iBAAiB,CAAC;;;;8BAIU,IAAI,CAAC,IAAI;;;wBAGf,IAAI,CAAC,IAAI;GAC9B,CAAC,CAAC;AAEL,MAAM,CAAC,MAAM,MAAM,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAEhD,MAAM,CAAC,IAAI,GAAG,EAAE,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport { iconsNames } from './iconsArray';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Foundations/Icons',\n  parameters: {\n    layout: 'centered',\n    notes: readme,\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    icon: {\n      name: 'Icon name',\n      description: 'Select icon to display',\n      control: {\n        type: 'select',\n      },\n      options: iconsNames,\n    },\n    size: {\n      name: 'Size in pixels',\n      description: 'Set the size of the icon',\n      control: {\n        type: 'range',\n        min: 16,\n        max: 100,\n        step: 4,\n      },\n    },\n  },\n  args: {\n    size: 32,\n    icon: 'truck',\n  },\n};\n\nconst IconFontTemplate = (args) =>\n  formatHtmlPreview(`\n  <style>\n    /* Demo code for presentation purposes */\n    @import url('https://cdn.digitaldesign.scania.com/icons/webfont/css/sdds-icons.css');\n    .sdds-icon { font-size: ${args.size}px; }\n  </style>\n\n  <i class=\"sdds-icon ${args.icon}\"></i>\n  `);\n\nexport const Native = IconFontTemplate.bind({});\n\nNative.args = {};\n"]}

package/dist/collection/components/icon/icon-web-component.stories.js

@@ -1,52 +0,0 @@
-import { formatHtmlPreview } from '../../utils/utils';
-import { iconsNames } from './iconsArray';
-import readme from './readme.md';
-export default {
-  title: 'Foundations/Icons',
-  parameters: {
-    layout: 'centered',
-    notes: readme,
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    icon: {
-      name: 'Icon name',
-      description: 'Select icon to display',
-      control: {
-        type: 'select',
-      },
-      options: iconsNames,
-    },
-    size: {
-      name: 'Size in pixels',
-      description: 'Set the size of the icon',
-      control: {
-        type: 'range',
-        min: 16,
-        max: 100,
-        step: 4,
-      },
-    },
-  },
-  args: {
-    size: 32,
-    icon: 'truck',
-  },
-};
-const IconTemplate = (args) => formatHtmlPreview(`
-  <sdds-icon name="${args.icon}" size="${`${args.size.toString()}px`}"></sdds-icon> 
-  `);
-export const WebComponent = IconTemplate.bind({});
-WebComponent.args = {};
-//# sourceMappingURL=icon-web-component.stories.js.map

package/dist/collection/components/icon/icon-web-component.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"icon-web-component.stories.js","sourceRoot":"","sources":["../../../src/components/icon/icon-web-component.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,mBAAmB;EAC1B,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,KAAK,EAAE,MAAM;IACb,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,+GAA+G;OACrH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,+GAA+G;OACrH;KACF;GACF;EACD,QAAQ,EAAE;IACR,IAAI,EAAE;MACJ,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,wBAAwB;MACrC,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;OACf;MACD,OAAO,EAAE,UAAU;KACpB;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,gBAAgB;MACtB,WAAW,EAAE,0BAA0B;MACvC,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,EAAE;QACP,GAAG,EAAE,GAAG;QACR,IAAI,EAAE,CAAC;OACR;KACF;GACF;EACD,IAAI,EAAE;IACJ,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,OAAO;GACd;CACF,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,EAAE,CAC5B,iBAAiB,CAAC;qBACC,IAAI,CAAC,IAAI,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI;GACjE,CAAC,CAAC;AAEL,MAAM,CAAC,MAAM,YAAY,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAElD,YAAY,CAAC,IAAI,GAAG,EAAE,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport { iconsNames } from './iconsArray';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Foundations/Icons',\n  parameters: {\n    layout: 'centered',\n    notes: readme,\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=9119%3A315952&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    icon: {\n      name: 'Icon name',\n      description: 'Select icon to display',\n      control: {\n        type: 'select',\n      },\n      options: iconsNames,\n    },\n    size: {\n      name: 'Size in pixels',\n      description: 'Set the size of the icon',\n      control: {\n        type: 'range',\n        min: 16,\n        max: 100,\n        step: 4,\n      },\n    },\n  },\n  args: {\n    size: 32,\n    icon: 'truck',\n  },\n};\n\nconst IconTemplate = (args) =>\n  formatHtmlPreview(`\n  <sdds-icon name=\"${args.icon}\" size=\"${`${args.size.toString()}px`}\"></sdds-icon> \n  `);\n\nexport const WebComponent = IconTemplate.bind({});\n\nWebComponent.args = {};\n"]}

package/dist/collection/components/icon/icon.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AAAA,mCAAmC;AAEnC,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEhE,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAO/C,MAAM,OAAO,IAAI;;IAwBf,aAAQ,GAAG,GAAG,EAAE,CACd,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;MAC9B,IAAI,OAAO,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;QAC9B,OAAO,CACL,WAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,qBAAkB,QAAQ,OAAO,CAAC,IAAI,EAAE,EAAE,IAAI,EAAC,KAAK,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,EAAE;UAC5I,iBAAQ,QAAQ,OAAO,CAAC,IAAI,EAAE,CAAS;UACvC,YAAM,IAAI,EAAC,cAAc,EAAC,CAAC,EAAE,OAAO,CAAC,UAAU,GAAI,CAC/C,CACP,CAAC;OACH;IACH,CAAC,CAAC,CAAC;gBAhCmC,gBAAgB;gBAGhB,MAAM;wBAEd,eAAe;wBAEvB,EAAE;;EAE1B,iBAAiB;IACf,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EAC3C,CAAC;EAED,gBAAgB,CAAC,QAAgB;IAC/B,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;KAC1C;SAAM;MACL,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;KAC9B;IACD,IAAI,CAAC,YAAY,GAAG,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC;EAC7C,CAAC;EAcD,MAAM;IACJ,OAAO,EAAC,IAAI,QAAE,IAAI,CAAC,QAAQ,EAAE,CAAQ,CAAC;EACxC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["// Check status of webFont solution\n\nimport { Component, h, Prop, State, Host } from '@stencil/core';\n\nimport { iconsCollection } from './iconsArray';\n\n@Component({\n  tag: 'sdds-icon',\n  styleUrl: 'icon.scss',\n  shadow: true,\n})\nexport class Icon {\n  /** Pass a name of the icon. For icon names, refer to https://digitaldesign.scania.com/foundations/icons/icon-library or storybook */\n  @Prop({ reflect: true }) name: string = 'arrow_diagonal';\n\n  /** Pass a size of icon as a string, for example: 32px, 1rem, 4em... */\n  @Prop({ reflect: true }) size: string = '16px';\n\n  @State() icons_object: string = iconsCollection;\n\n  @State() arrayOfIcons = [];\n\n  componentWillLoad() {\n    this.arrayDataWatcher(this.icons_object);\n  }\n\n  arrayDataWatcher(newValue: string) {\n    if (typeof newValue === 'string') {\n      this.arrayOfIcons = JSON.parse(newValue);\n    } else {\n      this.arrayOfIcons = newValue;\n    }\n    this.arrayOfIcons = [...this.arrayOfIcons];\n  }\n\n  setIcons = () =>\n    this.arrayOfIcons.map(element => {\n      if (element.name === this.name) {\n        return (\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" aria-labelledby={`icon ${element.name}`} role=\"img\" style={{ fontSize: this.size }}>\n            <title>{`icon ${element.name}`}</title>\n            <path fill=\"currentColor\" d={element.definition} />\n          </svg>\n        );\n      }\n    });\n\n  render() {\n    return <Host>{this.setIcons()}</Host>;\n  }\n}\n"]}

package/dist/collection/components/link/link.stories.js

@@ -1,52 +0,0 @@
-import { formatHtmlPreview } from '../../utils/utils';
-export default {
-  title: 'Components/Link',
-  parameters: {
-    layout: 'centered',
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    underline: {
-      name: 'Underline',
-      description: 'Adds an underline under the link text.',
-      controls: {
-        type: 'boolean',
-      },
-      table: {
-        defaultValue: { summary: true },
-      },
-    },
-    disabled: {
-      name: 'Disabled',
-      description: 'Disables the link.',
-      controls: {
-        type: 'boolean',
-      },
-      table: {
-        defaultValue: { summary: false },
-      },
-    },
-  },
-  args: {
-    underline: true,
-    disabled: false,
-  },
-};
-const Template = ({ underline, disabled }) => formatHtmlPreview(`
-      <a class="sdds-link ${disabled ? 'disabled' : ''} ${underline ? '' : 'sdds-link--no-underline'}" href="#">
-        This is a link.
-      </a>
-  `);
-export const Native = Template.bind({});
-//# sourceMappingURL=link.stories.js.map

package/dist/collection/components/link/link.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"link.stories.js","sourceRoot":"","sources":["../../../src/components/link/link.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,iBAAiB;EACxB,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,8GAA8G;OACpH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,8GAA8G;OACpH;KACF;GACF;EACD,QAAQ,EAAE;IACR,SAAS,EAAE;MACT,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,wCAAwC;MACrD,QAAQ,EAAE;QACR,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;OAChC;KACF;IACD,QAAQ,EAAE;MACR,IAAI,EAAE,UAAU;MAChB,WAAW,EAAE,oBAAoB;MACjC,QAAQ,EAAE;QACR,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;OACjC;KACF;GACF;EACD,IAAI,EAAE;IACJ,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,KAAK;GAChB;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC3C,iBAAiB,CACf;4BACwB,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,IAChD,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,yBACnB;;;GAGD,CACA,CAAC;AACJ,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n  title: 'Components/Link',\n  parameters: {\n    layout: 'centered',\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    underline: {\n      name: 'Underline',\n      description: 'Adds an underline under the link text.',\n      controls: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: true },\n      },\n    },\n    disabled: {\n      name: 'Disabled',\n      description: 'Disables the link.',\n      controls: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n  },\n  args: {\n    underline: true,\n    disabled: false,\n  },\n};\n\nconst Template = ({ underline, disabled }) =>\n  formatHtmlPreview(\n    `\n      <a class=\"sdds-link ${disabled ? 'disabled' : ''} ${\n      underline ? '' : 'sdds-link--no-underline'\n    }\" href=\"#\">\n        This is a link.\n      </a>\n  `,\n  );\nexport const Native = Template.bind({});\n"]}

package/dist/collection/components/link/sdds-link.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sdds-link.js","sourceRoot":"","sources":["../../../src/components/link/sdds-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,QAAQ;;;kBAKuC,OAAO;oBAGrC,KAAK;qBAGJ,IAAI;eAGX,UAAU;;EAEhC,MAAM;IACJ,OAAO,CACL,SACE,KAAK,EAAE;UACL,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;UAC/B,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc;;SAErC,EACD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,IAAI,CAAC,GAAG;MAEb,eAAa,CACX,CACL,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-link',\n  styleUrl: 'sdds-link.scss',\n  shadow: false,\n})\nexport class SddsLink {\n  /** URL for the link */\n  @Prop() href: string;\n\n  /** Where to open the linked URL */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  /** Disables the link */\n  @Prop() disabled: boolean = false;\n\n  /** Displays the link with an underline. */\n  @Prop() underline: boolean = true;\n\n  /** 'noopener' is a security measure for legacy browsers that preventsthe opened page from getting access to the original page when using target='_blank'. */\n  @Prop() rel: string = 'noopener';\n\n  render() {\n    return (\n      <a\n        class={`\n        ${this.disabled ? 'disabled' : ''}\n        ${this.underline ? '' : 'no-underline'}\n        \n        `}\n        href={this.href}\n        target={this.target}\n        rel={this.rel}\n      >\n        <slot></slot>\n      </a>\n    );\n  }\n}\n"]}

package/dist/collection/components/link/sdds-link.stories.js

@@ -1,71 +0,0 @@
-import { formatHtmlPreview } from '../../utils/utils';
-import readme from './readme.md';
-export default {
-  title: 'Components/Link',
-  parameters: {
-    notes: readme,
-    layout: 'centered',
-    design: [
-      {
-        name: 'Figma',
-        type: 'figma',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',
-      },
-      {
-        name: 'Link',
-        type: 'link',
-        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',
-      },
-    ],
-  },
-  argTypes: {
-    underline: {
-      name: 'Underline',
-      description: 'Adds an underline under the link text.',
-      controls: {
-        type: 'boolean',
-      },
-      table: {
-        defaultValue: { summary: true },
-      },
-    },
-    target: {
-      name: 'Target',
-      description: 'Sets where to open the linked URL.',
-      control: {
-        type: 'radio',
-      },
-      options: ['_self', '_blank', '_parent', '_top'],
-      table: {
-        defaultValue: { summary: '_self' },
-      },
-    },
-    disabled: {
-      name: 'Disabled',
-      description: 'Disables the link.',
-      controls: {
-        type: 'boolean',
-      },
-      table: {
-        defaultValue: { summary: false },
-      },
-    },
-  },
-  args: {
-    underline: true,
-    target: '_self',
-    disabled: false,
-  },
-};
-const Template = ({ underline, target, disabled }) => formatHtmlPreview(`
-    <sdds-link
-        ${disabled ? 'disabled' : ''}
-        ${underline ? '' : 'underline="false"'}
-        href="#"
-        target="${target}"
-        >
-        This is a link.
-    </sdds-link>
-  `);
-export const WebComponent = Template.bind({});
-//# sourceMappingURL=sdds-link.stories.js.map

package/dist/collection/components/link/sdds-link.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sdds-link.stories.js","sourceRoot":"","sources":["../../../src/components/link/sdds-link.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACb,KAAK,EAAE,iBAAiB;EACxB,UAAU,EAAE;IACV,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE;MACN;QACE,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,GAAG,EAAE,8GAA8G;OACpH;MACD;QACE,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,GAAG,EAAE,8GAA8G;OACpH;KACF;GACF;EACD,QAAQ,EAAE;IACR,SAAS,EAAE;MACT,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,wCAAwC;MACrD,QAAQ,EAAE;QACR,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;OAChC;KACF;IACD,MAAM,EAAE;MACN,IAAI,EAAE,QAAQ;MACd,WAAW,EAAE,oCAAoC;MACjD,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,CAAC;MAC/C,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;OACnC;KACF;IACD,QAAQ,EAAE;MACR,IAAI,EAAE,UAAU;MAChB,WAAW,EAAE,oBAAoB;MACjC,QAAQ,EAAE;QACR,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;OACjC;KACF;GACF;EACD,IAAI,EAAE;IACJ,SAAS,EAAE,IAAI;IACf,MAAM,EAAE,OAAO;IACf,QAAQ,EAAE,KAAK;GAChB;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,CACnD,iBAAiB,CACf;;UAEM,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;UAC1B,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB;;kBAE5B,MAAM;;;;GAIrB,CACA,CAAC;AACJ,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\nimport readme from './readme.md';\n\nexport default {\n  title: 'Components/Link',\n  parameters: {\n    notes: readme,\n    layout: 'centered',\n    design: [\n      {\n        name: 'Figma',\n        type: 'figma',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=2147%3A99321&t=Ne6myqwca5m00de7-1',\n      },\n    ],\n  },\n  argTypes: {\n    underline: {\n      name: 'Underline',\n      description: 'Adds an underline under the link text.',\n      controls: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: true },\n      },\n    },\n    target: {\n      name: 'Target',\n      description: 'Sets where to open the linked URL.',\n      control: {\n        type: 'radio',\n      },\n      options: ['_self', '_blank', '_parent', '_top'],\n      table: {\n        defaultValue: { summary: '_self' },\n      },\n    },\n    disabled: {\n      name: 'Disabled',\n      description: 'Disables the link.',\n      controls: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n  },\n  args: {\n    underline: true,\n    target: '_self',\n    disabled: false,\n  },\n};\n\nconst Template = ({ underline, target, disabled }) =>\n  formatHtmlPreview(\n    `\n    <sdds-link\n        ${disabled ? 'disabled' : ''}\n        ${underline ? '' : 'underline=\"false\"'}\n        href=\"#\"\n        target=\"${target}\"\n        >\n        This is a link.\n    </sdds-link>\n  `,\n  );\nexport const WebComponent = Template.bind({});\n"]}