@scania/tegel 0.0.5 → 0.0.6

package/dist/cjs/sdds-folder-tabs-button.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-folder-tabs-button.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,uBAAuB,GAAG,svDAAsvD;;MCOzwD,oBAAoB;;;oBAEH,KAAK;oBAGL,KAAK;;;;EAMjC,MAAM,WAAW,CAAC,KAAa;IAC7B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;GACvB;EAED,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,oBACE,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,EACtC,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;YACvC,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EACnC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAEvBA,iBAAK,KAAK,EAAC,OAAO,IAChBA,qBAAa,CACT,CACC,CACJ,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/tabs/folder-tabs/folder-tabs-button/sdds-folder-tabs-button.scss?tag=sdds-folder-tabs-button&encapsulation=shadow","./src/components/tabs/folder-tabs/folder-tabs-button/sdds-folder-tabs-button.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/z-index';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: block;\n  position: relative;\n  z-index: z(tab);\n\n  button {\n    min-width: 142px;\n    height: 100%;\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    cursor: pointer;\n    color: var(--sdds-folder-tab-color);\n    padding: 16px;\n    white-space: nowrap;\n    text-decoration: none;\n    text-align: left;\n    outline: none;\n    border: none;\n    border-top: 2px solid var(--sdds-folder-tab-background);\n    background-color: var(--sdds-folder-tab-background);\n    border-right: none;\n\n    .label {\n      opacity: var(--sdds-folder-tab-color-opacity);\n    }\n\n    &.selected {\n      background-color: var(--sdds-folder-tab-background-selected);\n      border-top: 2px solid var(--sdds-folder-tab-border-selected);\n\n      &::before {\n        // This ::before element hides the border-right of the tab to the left of the selected tab\n        content: ' ';\n        background-color: var(--sdds-folder-tab-background);\n        width: 1px;\n        top: 0;\n        bottom: 0;\n        left: -1px;\n        display: block;\n        position: absolute;\n      }\n\n      .label {\n        opacity: var(--sdds-folder-tab-color-opacity-selected);\n      }\n    }\n\n    &:not(.selected) {\n      border-right-width: 1px;\n      border-right-style: solid;\n      border-right-color: var(--sdds-folder-tab-divider-color);\n\n      &:hover {\n        border-top-color: var(--sdds-folder-tab-background-hover);\n        background-color: var(--sdds-folder-tab-background-hover);\n\n        .label {\n          opacity: var(--sdds-folder-tab-color-opacity-hover);\n        }\n      }\n    }\n\n    &.disabled {\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-folder-tab-color-opacity-disabled);\n      }\n\n      &:focus-visible {\n        .label {\n          opacity: var(--sdds-folder-tab-color-opacity-disabled);\n        }\n\n        outline: none;\n      }\n    }\n\n    &:focus-visible {\n      @include sdds-focus-state;\n\n      opacity: var(--sdds-folder-tab-color-opacity-focus);\n    }\n  }\n}\n\n:host(.last) {\n  button:not(.selected) {\n    border-right-color: transparent;\n  }\n}\n","import { Component, Host, h, Prop, State, Method } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-folder-tabs-button',\n  styleUrl: 'sdds-folder-tabs-button.scss',\n  shadow: true,\n})\nexport class SddsFolderTabsButton {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  @State() tabWidth: number;\n\n  /** @internal Method to set the width of the tab. Used by the <sdds-folder-tabs> */\n  @Method()\n  async setTabWidth(width: number) {\n    this.tabWidth = width;\n  }\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <button\n          style={{ width: `${this.tabWidth}px` }}\n          class={`${this.selected ? 'selected' : ''}\n          ${this.disabled ? 'disabled' : ''}`}\n          disabled={this.disabled}\n        >\n          <div class=\"label\">\n            <slot></slot>\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-folder-tabs-link.cjs.entry.js

@@ -1,34 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsFolderTabsLinkCss = ":host{box-sizing:border-box;display:block;position:relative;z-index:200}:host *{box-sizing:border-box}:host a{min-width:142px;display:block;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);cursor:pointer;padding:16px;white-space:nowrap;text-decoration:none;text-align:left;outline:none;border:none;border-right:1px solid;border-right-color:transparent;color:var(--sdds-folder-tab-color);border-top:2px solid var(--sdds-folder-tab-background);background-color:var(--sdds-folder-tab-background)}:host a .label{opacity:var(--sdds-folder-tab-color-opacity)}:host a.selected{background-color:var(--sdds-folder-tab-background-selected);border-top:2px solid var(--sdds-folder-tab-border-selected)}:host a.selected::before{content:\" \";background-color:var(--sdds-folder-tab-background-selected);width:1px;top:0;bottom:0;left:-1px;display:block;position:absolute}:host a.selected .label{opacity:var(--sdds-folder-tab-color-opacity-selected)}:host a:not(.selected){border-right-color:var(--sdds-folder-tab-divider-color)}:host a:not(.selected):hover{background-color:var(--sdds-folder-tab-background-hover)}:host a:not(.selected):hover .label{opacity:var(--sdds-folder-tab-color-opacity-hover)}:host a.disabled{pointer-events:none}:host a.disabled .label{opacity:var(--sdds-folder-tab-color-opacity-disabled)}:host a.disabled:focus-visible{outline:none}:host a.disabled:focus-visible .label{opacity:var(--sdds-folder-tab-color-opacity-disabled)}:host a:focus-visible{outline:2px solid var(--sdds-blue-400);outline-offset:-2px;opacity:var(--sdds-folder-tab-color-opacity-focus)}:host(.last) a:not(.selected){border-right-color:transparent}";
-
-const SddsFolderTabsLink = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.disabled = false;
-    this.selected = false;
-    this.href = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-    this.tabWidth = undefined;
-  }
-  /** @internal Method to set the width of the tab. Used by the <sdds-folder-tabs> */
-  async setTabWidth(width) {
-    this.tabWidth = width;
-  }
-  render() {
-    return (index.h(index.Host, { role: "listitem" }, index.h("a", { style: { width: `${this.tabWidth}px` }, class: `
-        ${this.selected ? 'selected' : ''}
-        ${this.disabled ? 'disabled' : ''}
-        `, href: this.href, target: this.target, rel: this.rel }, index.h("div", { class: "label" }, index.h("slot", null)))));
-  }
-};
-SddsFolderTabsLink.style = sddsFolderTabsLinkCss;
-
-exports.sdds_folder_tabs_link = SddsFolderTabsLink;
-
-//# sourceMappingURL=sdds-folder-tabs-link.cjs.entry.js.map

package/dist/cjs/sdds-folder-tabs-link.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-folder-tabs-link.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,qBAAqB,GAAG,snDAAsnD;;MCOvoD,kBAAkB;;;oBAED,KAAK;oBAGL,KAAK;;kBAMyB,OAAO;eAG3C,UAAU;;;;EAMhC,MAAM,WAAW,CAAC,KAAa;IAC7B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;GACvB;EAED,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,eACE,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,EACtC,KAAK,EAAE;UACP,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;UAC/B,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;SAChC,EACC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,IAAI,CAAC,GAAG,IAEbA,iBAAK,KAAK,EAAC,OAAO,IAChBA,qBAAa,CACT,CACJ,CACC,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/tabs/folder-tabs/folder-tabs-link/sdds-folder-tabs-link.scss?tag=sdds-folder-tabs-link&encapsulation=shadow","./src/components/tabs/folder-tabs/folder-tabs-link/sdds-folder-tabs-link.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/z-index';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: block;\n  position: relative;\n  z-index: z(tab);\n\n  a {\n    min-width: 142px;\n    display: block;\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    cursor: pointer;\n    padding: 16px;\n    white-space: nowrap;\n    text-decoration: none;\n    text-align: left;\n    outline: none;\n    border: none;\n    border-right: 1px solid;\n    border-right-color: transparent;\n    color: var(--sdds-folder-tab-color);\n    border-top: 2px solid var(--sdds-folder-tab-background);\n    background-color: var(--sdds-folder-tab-background);\n\n    .label {\n      opacity: var(--sdds-folder-tab-color-opacity);\n    }\n\n    &.selected {\n      background-color: var(--sdds-folder-tab-background-selected);\n      border-top: 2px solid var(--sdds-folder-tab-border-selected);\n\n      &::before {\n        content: ' ';\n        background-color: var(--sdds-folder-tab-background-selected);\n        width: 1px;\n        top: 0;\n        bottom: 0;\n        left: -1px;\n        display: block;\n        position: absolute;\n      }\n\n      .label {\n        opacity: var(--sdds-folder-tab-color-opacity-selected);\n      }\n    }\n\n    &:not(.selected) {\n      border-right-color: var(--sdds-folder-tab-divider-color);\n\n      &:hover {\n        background-color: var(--sdds-folder-tab-background-hover);\n\n        .label {\n          opacity: var(--sdds-folder-tab-color-opacity-hover);\n        }\n      }\n    }\n\n    &.disabled {\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-folder-tab-color-opacity-disabled);\n      }\n\n      &:focus-visible {\n        .label {\n          opacity: var(--sdds-folder-tab-color-opacity-disabled);\n        }\n\n        outline: none;\n      }\n    }\n\n    &:focus-visible {\n      @include sdds-focus-state;\n\n      opacity: var(--sdds-folder-tab-color-opacity-focus);\n    }\n  }\n}\n\n:host(.last) {\n  a:not(.selected) {\n    border-right-color: transparent;\n  }\n}\n","import { Component, Host, h, Prop, State, Method } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-folder-tabs-link',\n  styleUrl: 'sdds-folder-tabs-link.scss',\n  shadow: true,\n})\nexport class SddsFolderTabsLink {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  /** Href 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  /** '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  @State() tabWidth: number;\n\n  /** @internal Method to set the width of the tab. Used by the <sdds-folder-tabs> */\n  @Method()\n  async setTabWidth(width: number) {\n    this.tabWidth = width;\n  }\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <a\n          style={{ width: `${this.tabWidth}px` }}\n          class={`\n        ${this.selected ? 'selected' : ''}\n        ${this.disabled ? 'disabled' : ''}\n        `}\n          href={this.href}\n          target={this.target}\n          rel={this.rel}\n        >\n          <div class=\"label\">\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-footer-link-group.cjs.entry.js

@@ -1,36 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsFooterLinkGroupCss = ".sc-sdds-footer-link-group-h{display:block;width:100%}.sc-sdds-footer-link-group-h .footer-top-title.sc-sdds-footer-link-group{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);opacity:var(--sdds-footer-top-title-opacity);color:var(--sdds-footer-top-links);padding-bottom:8px}.sc-sdds-footer-link-group-h button.footer-top-title-button.sc-sdds-footer-link-group{display:none;border:none;width:100%;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:var(--sdds-footer-top-links);background-color:transparent;text-align:left;padding:19px 24px;justify-content:space-between;border-bottom:1px solid var(--sdds-footer-top-divider)}.sc-sdds-footer-link-group-h button.footer-top-title-button.expanded.sc-sdds-footer-link-group{border-bottom:none}.sc-sdds-footer-link-group-h button.footer-top-title-button.expanded.sc-sdds-footer-link-group sdds-icon.sc-sdds-footer-link-group{transform:rotateZ(180deg)}.sc-sdds-footer-link-group-h button.footer-top-title-button.sc-sdds-footer-link-group:hover{cursor:pointer}.sc-sdds-footer-link-group-h button.footer-top-title-button.sc-sdds-footer-link-group:active{background-color:var(--sdds-footer-top-button-active)}.sc-sdds-footer-link-group-h button.footer-top-title-button.sc-sdds-footer-link-group sdds-icon.sc-sdds-footer-link-group{transition:transform 0.2s ease-in-out}.sc-sdds-footer-link-group-h [role=list].sc-sdds-footer-link-group{list-style:none;padding:0;margin:0;display:flex;gap:8px}.sc-sdds-footer-link-group-h [role=list].top-part-child.sc-sdds-footer-link-group{flex-direction:column}@media all and (max-width: 992px){.sc-sdds-footer-link-group-h [role=list].left.sc-sdds-footer-link-group:not(.top-part-child){flex-direction:column}.sc-sdds-footer-link-group-h [role=list].top-part-child.closed.sc-sdds-footer-link-group{display:none}.sc-sdds-footer-link-group-h [role=list].top-part-child.sc-sdds-footer-link-group{gap:0}.sc-sdds-footer-link-group-h .footer-top-title.sc-sdds-footer-link-group{display:none}.sc-sdds-footer-link-group-h button.footer-top-title-button.sc-sdds-footer-link-group{display:flex;align-items:center}}";
-
-const SddsFooterLinkGroup = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.rightSlot = false;
-    this.parentIsTopPart = false;
-    this.titleText = undefined;
-    this.open = false;
-  }
-  connectedCallback() {
-    this.rightSlot = this.host.parentElement.slot === 'main-right';
-    this.parentIsTopPart = this.host.parentElement.slot === 'top';
-  }
-  render() {
-    return (index.h(index.Host, null, this.titleText && this.parentIsTopPart && (index.h("div", { class: "footer-top-title" }, this.titleText)), this.titleText && this.parentIsTopPart && (index.h("button", { onClick: () => {
-        this.open = !this.open;
-      }, class: `footer-top-title-button  ${this.open ? 'expanded' : 'closed'}` }, this.titleText, index.h("sdds-icon", { name: "chevron_down", size: "20px" }))), index.h("div", { role: "list", class: `
-        ${this.rightSlot ? 'right' : 'left'}
-        ${this.parentIsTopPart ? 'top-part-child' : ''}
-        ${this.open ? 'expanded' : 'closed'}
-        ` }, index.h("slot", null))));
-  }
-  get host() { return index.getElement(this); }
-};
-SddsFooterLinkGroup.style = sddsFooterLinkGroupCss;
-
-exports.sdds_footer_link_group = SddsFooterLinkGroup;
-
-//# sourceMappingURL=sdds-footer-link-group.cjs.entry.js.map

package/dist/cjs/sdds-footer-link-group.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-footer-link-group.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,sBAAsB,GAAG,mlEAAmlE;;MCSrmE,mBAAmB;;;IAQ9B,cAAS,GAAY,KAAK,CAAC;IAE3B,oBAAe,GAAY,KAAK,CAAC;;gBAJR,KAAK;;EAM9B,iBAAiB;IACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,YAAY,CAAC;IAC/D,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,KAAK,CAAC;GAC/D;EAED,MAAM;IACJ,QACEA,QAACC,UAAI,QACF,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,eAAe,KACrCD,iBAAK,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,SAAS,CAAO,CACrD,EAEA,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,eAAe,KACrCA,oBACE,OAAO,EAAE;QACP,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;OACxB,EACD,KAAK,EAAE,4BAA4B,IAAI,CAAC,IAAI,GAAG,UAAU,GAAG,QAAQ,EAAE,IAErE,IAAI,CAAC,SAAS,EACfA,uBAAW,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,MAAM,GAAa,CAChD,CACV,EACDA,iBACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;UACP,IAAI,CAAC,SAAS,GAAG,OAAO,GAAG,MAAM;UACjC,IAAI,CAAC,eAAe,GAAG,gBAAgB,GAAG,EAAE;UAC5C,IAAI,CAAC,IAAI,GAAG,UAAU,GAAG,QAAQ;SAClC,IAECA,qBAAa,CACT,CACD,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["./src/components/footer/webcomponent/sdds-footer-link-group/sdds-footer-link-group.scss?tag=sdds-footer-link-group&encapsulation=scoped","./src/components/footer/webcomponent/sdds-footer-link-group/sdds-footer-link-group.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n\n  .footer-top-title {\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    opacity: var(--sdds-footer-top-title-opacity);\n    color: var(--sdds-footer-top-links);\n    padding-bottom: 8px;\n  }\n\n  button.footer-top-title-button {\n    display: none;\n    border: none;\n    width: 100%;\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    color: var(--sdds-footer-top-links);\n    background-color: transparent;\n    text-align: left;\n    padding: 19px 24px;\n    justify-content: space-between;\n    border-bottom: 1px solid var(--sdds-footer-top-divider);\n\n    &.expanded {\n      border-bottom: none;\n\n      sdds-icon {\n        transform: rotateZ(180deg);\n      }\n    }\n\n    &:hover {\n      cursor: pointer;\n    }\n\n    &:active {\n      background-color: var(--sdds-footer-top-button-active);\n    }\n\n    sdds-icon {\n      transition: transform 0.2s ease-in-out;\n    }\n  }\n\n  [role='list'] {\n    list-style: none;\n    padding: 0;\n    margin: 0;\n    display: flex;\n    gap: 8px;\n\n    &.top-part-child {\n      flex-direction: column;\n    }\n  }\n\n  @media all and (max-width: 992px) {\n    [role='list'].left:not(.top-part-child) {\n      flex-direction: column;\n    }\n\n    [role='list'].top-part-child.closed {\n      display: none;\n    }\n\n    [role='list'].top-part-child {\n      gap: 0;\n    }\n\n    .footer-top-title {\n      display: none;\n    }\n\n    button.footer-top-title-button {\n      display: flex;\n      align-items: center;\n    }\n  }\n}\n","import { Component, Host, h, Prop, Element } from '@stencil/core';\nimport { HostElement, State } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-footer-link-group',\n  styleUrl: 'sdds-footer-link-group.scss',\n  shadow: false,\n  scoped: true,\n})\nexport class SddsFooterLinkGroup {\n  /** Title text for the link group, only valid on top part of footer. */\n  @Prop() titleText: string;\n\n  @Element() host: HostElement;\n\n  @State() open: boolean = false;\n\n  rightSlot: boolean = false;\n\n  parentIsTopPart: boolean = false;\n\n  connectedCallback() {\n    this.rightSlot = this.host.parentElement.slot === 'main-right';\n    this.parentIsTopPart = this.host.parentElement.slot === 'top';\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.titleText && this.parentIsTopPart && (\n          <div class=\"footer-top-title\">{this.titleText}</div>\n        )}\n\n        {this.titleText && this.parentIsTopPart && (\n          <button\n            onClick={() => {\n              this.open = !this.open;\n            }}\n            class={`footer-top-title-button  ${this.open ? 'expanded' : 'closed'}`}\n          >\n            {this.titleText}\n            <sdds-icon name=\"chevron_down\" size=\"20px\"></sdds-icon>\n          </button>\n        )}\n        <div\n          role=\"list\"\n          class={`\n        ${this.rightSlot ? 'right' : 'left'}\n        ${this.parentIsTopPart ? 'top-part-child' : ''}\n        ${this.open ? 'expanded' : 'closed'}\n        `}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-footer-link.cjs.entry.js

@@ -1,29 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsFooterLinkCss = "[role=listitem].sc-sdds-footer-link a.sc-sdds-footer-link{font:var(--sdds-headline-06);letter-spacing:var(--sdds-headline-06-ls);color:var(--sdds-footer-main-links);opacity:var(--sdds-footer-main-links-opacity);text-decoration:none}[role=listitem].sc-sdds-footer-link a.sc-sdds-footer-link:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}[role=listitem].sc-sdds-footer-link a.sc-sdds-footer-link:hover{text-decoration:underline}[role=listitem].top-part-child.sc-sdds-footer-link a.sc-sdds-footer-link{color:var(--sdds-footer-top-links);font-family:\"Scania Sans Semi Condensed\", \"Scania Sans Condensed\", arial, helvetica, sans-serif;font-weight:bold;font-size:14px;line-height:18px}[role=listitem].top-part-child.sc-sdds-footer-link a.sc-sdds-footer-link:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}@media all and (max-width: 992px){[role=listitem].top-part-child.sc-sdds-footer-link{border-bottom:1px solid var(--sdds-footer-top-divider)}[role=listitem].top-part-child.sc-sdds-footer-link a.sc-sdds-footer-link{display:block;height:100%;padding:19px 40px;font-weight:normal}[role=listitem].top-part-child.sc-sdds-footer-link a.sc-sdds-footer-link:hover{text-decoration:underline;background-color:var(--sdds-footer-top-links-background-hover)}[role=listitem].top-part-child.sc-sdds-footer-link a.sc-sdds-footer-link:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}}";
-
-const SddsFooterLink = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.parentIsTopPart = false;
-    this.linkHref = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-  }
-  connectedCallback() {
-    this.parentIsTopPart = this.host.closest('sdds-footer-link-group').parentElement.slot === 'top';
-  }
-  render() {
-    return (index.h("div", { role: "listitem", class: `${this.parentIsTopPart ? 'top-part-child' : ''}` }, index.h("a", { target: this.target, rel: this.rel, href: this.linkHref }, index.h("slot", null))));
-  }
-  get host() { return index.getElement(this); }
-};
-SddsFooterLink.style = sddsFooterLinkCss;
-
-exports.sdds_footer_link = SddsFooterLink;
-
-//# sourceMappingURL=sdds-footer-link.cjs.entry.js.map

package/dist/cjs/sdds-footer-link.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-footer-link.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,i5CAAi5C;;MCS95C,cAAc;;;IAYzB,oBAAe,GAAY,KAAK,CAAC;;kBAPyB,OAAO;eAG3C,UAAU;;EAMhC,iBAAiB;IACf,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,aAAa,CAAC,IAAI,KAAK,KAAK,CAAC;GACjG;EAED,MAAM;IACJ,QACEA,iBAAK,IAAI,EAAC,UAAU,EAAC,KAAK,EAAE,GAAG,IAAI,CAAC,eAAe,GAAG,gBAAgB,GAAG,EAAE,EAAE,IAC3EA,eAAG,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,IACxDA,qBAAa,CACX,CACA,EACN;GACH;;;;;;;","names":["h"],"sources":["./src/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.scss?tag=sdds-footer-link&encapsulation=scoped","./src/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n\n[role='listitem'] {\n  a {\n    font: var(--sdds-headline-06);\n    letter-spacing: var(--sdds-headline-06-ls);\n    color: var(--sdds-footer-main-links);\n    opacity: var(--sdds-footer-main-links-opacity);\n    text-decoration: none;\n\n    &:focus {\n      @include sdds-focus-state;\n    }\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  &.top-part-child {\n    a {\n      color: var(--sdds-footer-top-links);\n      font-family: 'Scania Sans Semi Condensed', 'Scania Sans Condensed', arial, helvetica,\n        sans-serif;\n      font-weight: bold;\n      font-size: 14px;\n      line-height: 18px;\n\n      &:focus {\n        @include sdds-focus-state;\n      }\n    }\n  }\n}\n\n@media all and (max-width: 992px) {\n  [role='listitem'].top-part-child {\n    border-bottom: 1px solid var(--sdds-footer-top-divider);\n\n    a {\n      display: block;\n      height: 100%;\n      padding: 19px 40px;\n      font-weight: normal;\n\n      &:hover {\n        text-decoration: underline;\n        background-color: var(--sdds-footer-top-links-background-hover);\n      }\n\n      &:focus {\n        @include sdds-focus-state;\n      }\n    }\n  }\n}\n","import { Component, Element, h, Prop } from '@stencil/core';\nimport { HostElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-footer-link',\n  styleUrl: 'sdds-footer-link.scss',\n  shadow: false,\n  scoped: true,\n})\nexport class SddsFooterLink {\n  /** URL for the link */\n  @Prop() linkHref: string;\n\n  /** Where to open the linked URL */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  /** 'noopener' is a security measure for legacy browsers that prevents the opened page from getting access to the original page when using target='_blank'. */\n  @Prop() rel: string = 'noopener';\n\n  @Element() host: HostElement;\n\n  parentIsTopPart: boolean = false;\n\n  connectedCallback() {\n    this.parentIsTopPart = this.host.closest('sdds-footer-link-group').parentElement.slot === 'top';\n  }\n\n  render() {\n    return (\n      <div role=\"listitem\" class={`${this.parentIsTopPart ? 'top-part-child' : ''}`}>\n        <a target={this.target} rel={this.rel} href={this.linkHref}>\n          <slot></slot>\n        </a>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-inline-tabs-button.cjs.entry.js

@@ -1,24 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsInlineTabsButtonCss = ":host{box-sizing:border-box;display:block;position:relative;z-index:200}:host *{box-sizing:border-box}:host button{all:unset;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:var(--sdds-navigation-tabs-tab-color);padding:8px 4px;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out 0s;white-space:nowrap;background-color:transparent;border:0}:host button .label{margin:12px 0}:host button:hover{cursor:pointer}:host button:hover::after{width:100%}:host button:focus-visible .label{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host button::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0%;margin-right:auto;height:2px;background-color:var(--sdds-inline-tabs-tab-indicator-background-hover);transition:width 0.15s ease-in-out 0s;z-index:1}:host button.selected{color:var(--sdds-inline-tabs-tab-color-selected)}:host button.selected::after{width:100%;background-color:var(--sdds-inline-tabs-tab-indicator-background-active)}:host button.disabled{color:var(--sdds-inline-tabs-tab-color-disabled);pointer-events:none}:host button.disabled .label{opacity:var(--sdds-inline-tabs-tab-color-opacity-disabled)}:host(.first){margin-left:32px}:host(.last){margin-right:32px}";
-
-const SddsInlineTabsButton = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.disabled = false;
-    this.selected = false;
-  }
-  render() {
-    return (index.h(index.Host, { role: "listitem" }, index.h("button", { class: `${this.selected ? 'selected' : ''}
-        ${this.disabled ? 'disabled' : ''}`, disabled: this.disabled }, index.h("div", { class: "label" }, index.h("slot", null)))));
-  }
-};
-SddsInlineTabsButton.style = sddsInlineTabsButtonCss;
-
-exports.sdds_inline_tabs_button = SddsInlineTabsButton;
-
-//# sourceMappingURL=sdds-inline-tabs-button.cjs.entry.js.map

package/dist/cjs/sdds-inline-tabs-button.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-inline-tabs-button.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,uBAAuB,GAAG,kxCAAkxC;;MCOryC,oBAAoB;;;oBAEH,KAAK;oBAGL,KAAK;;EAEjC,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,oBACE,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;UACzC,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAEvBA,iBAAK,KAAK,EAAC,OAAO,IAChBA,qBAAa,CACT,CACC,CACJ,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/tabs/inline-tabs/inline-tabs-button/sdds-inline-tabs-button.scss?tag=sdds-inline-tabs-button&encapsulation=shadow","./src/components/tabs/inline-tabs/inline-tabs-button/sdds-inline-tabs-button.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/z-index';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: block;\n  position: relative;\n  z-index: z(tab);\n\n  button {\n    all: unset;\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    color: var(--sdds-navigation-tabs-tab-color);\n    padding: 8px 4px;\n    margin-right: 32px;\n    text-decoration: none;\n    display: block;\n    position: relative;\n    transition: color 0.15s ease-in-out 0s;\n    white-space: nowrap;\n    background-color: transparent;\n    border: 0;\n\n    .label {\n      margin: 12px 0;\n    }\n\n    &:hover {\n      cursor: pointer;\n\n      &::after {\n        width: 100%;\n      }\n    }\n\n    &:focus-visible {\n      .label {\n        @include sdds-focus-state;\n      }\n    }\n\n    &::after {\n      content: ' ';\n      position: absolute;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      margin-left: auto;\n      width: 0%;\n      margin-right: auto;\n      height: 2px;\n      background-color: var(--sdds-inline-tabs-tab-indicator-background-hover);\n      transition: width 0.15s ease-in-out 0s;\n      z-index: 1;\n    }\n\n    &.selected {\n      color: var(--sdds-inline-tabs-tab-color-selected);\n\n      &::after {\n        width: 100%;\n        background-color: var(--sdds-inline-tabs-tab-indicator-background-active);\n      }\n    }\n\n    &.disabled {\n      color: var(--sdds-inline-tabs-tab-color-disabled);\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-inline-tabs-tab-color-opacity-disabled);\n      }\n    }\n  }\n}\n\n:host(.first) {\n  margin-left: 32px;\n}\n\n:host(.last) {\n  margin-right: 32px;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-inline-tabs-button',\n  styleUrl: 'sdds-inline-tabs-button.scss',\n  shadow: true,\n})\nexport class SddsInlineTabsButton {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <button\n          class={`${this.selected ? 'selected' : ''}\n        ${this.disabled ? 'disabled' : ''}`}\n          disabled={this.disabled}\n        >\n          <div class=\"label\">\n            <slot></slot>\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-inline-tabs-link.cjs.entry.js

@@ -1,29 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsInlineTabsLinkCss = ":host{box-sizing:border-box;display:block;position:relative;z-index:200}:host *{box-sizing:border-box}:host a{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:var(--sdds-navigation-tabs-tab-color);padding:8px 4px;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out 0s;white-space:nowrap;background-color:transparent;border:0}:host a .label{margin:12px 0}:host a:hover{cursor:pointer}:host a:hover::after{width:100%}:host a:focus-visible{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host a::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0%;margin-right:auto;height:2px;background-color:var(--sdds-inline-tabs-tab-indicator-background-hover);transition:width 0.15s ease-in-out 0s;z-index:1}:host a.selected{color:var(--sdds-inline-tabs-tab-color-selected)}:host a.selected .label{opacity:var(--sdds-inline-tab-color-opacity-selected)}:host a.selected::after{width:100%;background-color:var(--sdds-inline-tabs-tab-indicator-background-active)}:host a.disabled{color:var(--sdds-inline-tabs-tab-color-disabled);pointer-events:none}:host a.disabled .label{opacity:var(--sdds-inline-tabs-tab-color-opacity-disabled)}:host(.first){margin-left:32px}:host(.last){margin-right:32px}";
-
-const SddsInlineTabsLink = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.disabled = false;
-    this.selected = false;
-    this.href = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-  }
-  render() {
-    return (index.h(index.Host, { role: "listitem" }, index.h("a", { class: `
-        ${this.selected ? 'selected' : ''}
-        ${this.disabled ? 'disabled' : ''}
-        `, href: this.href, target: this.target, rel: this.rel }, index.h("div", { class: "label" }, index.h("slot", null)))));
-  }
-};
-SddsInlineTabsLink.style = sddsInlineTabsLinkCss;
-
-exports.sdds_inline_tabs_link = SddsInlineTabsLink;
-
-//# sourceMappingURL=sdds-inline-tabs-link.cjs.entry.js.map

package/dist/cjs/sdds-inline-tabs-link.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-inline-tabs-link.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,qBAAqB,GAAG,6xCAA6xC;;MCO9yC,kBAAkB;;;oBAED,KAAK;oBAGL,KAAK;;kBAMyB,OAAO;eAG3C,UAAU;;EAEhC,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,eACE,KAAK,EAAE;UACP,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;UAC/B,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;SAChC,EACC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,IAAI,CAAC,GAAG,IAEbA,iBAAK,KAAK,EAAC,OAAO,IAChBA,qBAAa,CACT,CACJ,CACC,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/tabs/inline-tabs/inline-tabs-link/sdds-inline-tabs-link.scss?tag=sdds-inline-tabs-link&encapsulation=shadow","./src/components/tabs/inline-tabs/inline-tabs-link/sdds-inline-tabs-link.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/z-index';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  display: block;\n  position: relative;\n  z-index: z(tab);\n\n  a {\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    color: var(--sdds-navigation-tabs-tab-color);\n    padding: 8px 4px;\n    margin-right: 32px;\n    text-decoration: none;\n    display: block;\n    position: relative;\n    transition: color 0.15s ease-in-out 0s;\n    white-space: nowrap;\n    background-color: transparent;\n    border: 0;\n    \n    .label {\n      margin: 12px 0;\n    }\n\n    &:hover {\n      cursor: pointer;\n\n      &::after {\n        width: 100%;\n      }\n    }\n\n    &:focus-visible {\n      @include sdds-focus-state;\n    }\n\n    &::after {\n      content: ' ';\n      position: absolute;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      margin-left: auto;\n      width: 0%;\n      margin-right: auto;\n      height: 2px;\n      background-color: var(--sdds-inline-tabs-tab-indicator-background-hover);\n      transition: width 0.15s ease-in-out 0s;\n      z-index: 1;\n    }\n\n    &.selected {\n      color: var(--sdds-inline-tabs-tab-color-selected);\n\n      .label {\n        opacity: var(--sdds-inline-tab-color-opacity-selected);\n      }\n\n      &::after {\n        width: 100%;\n        background-color: var(--sdds-inline-tabs-tab-indicator-background-active);\n      }\n    }\n\n    &.disabled {\n      color: var(--sdds-inline-tabs-tab-color-disabled);\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-inline-tabs-tab-color-opacity-disabled);\n      }\n    }\n  }\n}\n\n\n:host(.first) {\n  margin-left: 32px;\n}\n\n:host(.last) {\n  margin-right: 32px;\n}","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-inline-tabs-link',\n  styleUrl: 'sdds-inline-tabs-link.scss',\n  shadow: true,\n})\nexport class SddsInlineTabsLink {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  /** Href 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  /** '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      <Host role=\"listitem\">\n        <a\n          class={`\n        ${this.selected ? 'selected' : ''}\n        ${this.disabled ? 'disabled' : ''}\n        `}\n          href={this.href}\n          target={this.target}\n          rel={this.rel}\n        >\n          <div class=\"label\">\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-navigation-tabs-button.cjs.entry.js

@@ -1,24 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsNavigationTabsButtonCss = ":host{box-sizing:border-box}:host *{box-sizing:border-box}:host button{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:var(--sdds-navigation-tabs-tab-color);padding:18px 0;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out;white-space:nowrap;background-color:transparent;border:0}:host button.selected{color:var(--sdds-navigation-tabs-tab-color-selected)}:host button.selected::after{width:100%;background-color:var(--sdds-navigation-tabs-tab-indicator-background-active)}:host button .label{padding:8px 4px}:host button:focus-visible{outline:none}:host button:focus-visible .label{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host button:hover{color:var(--sdds-navigation-tabs-tab-color-hover);opacity:1}:host button:hover::after{width:100%}:host button.disabled{color:var(--sdds-navigation-tabs-tab-color-disabled);pointer-events:none}:host button.disabled .label{opacity:var(--sdds-navigation-tabs-tab-color-opacity-disabled)}:host button::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0;margin-right:auto;height:2px;background-color:var(--sdds-navigation-tabs-tab-indicator-background-hover);transition:width 0.15s ease-in-out;z-index:1}:host(.first){margin-left:32px}:host(.last){margin-right:32px}";
-
-const SddsNavigationTabsButton = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.disabled = false;
-    this.selected = false;
-  }
-  render() {
-    return (index.h(index.Host, { role: "listitem" }, index.h("button", { class: `${this.selected ? 'selected' : ''}
-         ${this.disabled ? 'disabled' : ''}`, disabled: this.disabled }, index.h("div", { class: "label" }, index.h("slot", null)))));
-  }
-};
-SddsNavigationTabsButton.style = sddsNavigationTabsButtonCss;
-
-exports.sdds_navigation_tabs_button = SddsNavigationTabsButton;
-
-//# sourceMappingURL=sdds-navigation-tabs-button.cjs.entry.js.map

package/dist/cjs/sdds-navigation-tabs-button.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-navigation-tabs-button.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,2BAA2B,GAAG,+zCAA+zC;;MCOt1C,wBAAwB;;;oBAEP,KAAK;oBAGL,KAAK;;EAEjC,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,oBACE,KAAK,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;WACxC,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EAClC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAEvBA,iBAAK,KAAK,EAAC,OAAO,IAChBA,qBAAa,CACT,CACC,CACJ,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/tabs/navigation-tabs/navigation-tabs-button/sdds-navigation-tabs-button.scss?tag=sdds-navigation-tabs-button&encapsulation=shadow","./src/components/tabs/navigation-tabs/navigation-tabs-button/sdds-navigation-tabs-button.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  button {\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    color: var(--sdds-navigation-tabs-tab-color);\n    padding: 18px 0;\n    margin-right: 32px;\n    text-decoration: none;\n    display: block;\n    position: relative;\n    transition: color 0.15s ease-in-out;\n    white-space: nowrap;\n    background-color: transparent;\n    border: 0;\n\n    &.selected {\n      color: var(--sdds-navigation-tabs-tab-color-selected);\n\n      &::after {\n        width: 100%;\n        background-color: var(--sdds-navigation-tabs-tab-indicator-background-active);\n      }\n    }\n\n    .label {\n      padding: 8px 4px;\n    }\n\n    &:focus-visible {\n      outline: none;\n\n      .label {\n        @include sdds-focus-state;\n      }\n    }\n\n    &:hover {\n      color: var(--sdds-navigation-tabs-tab-color-hover);\n      opacity: 1;\n\n      &::after {\n        width: 100%;\n      }\n    }\n\n    &.disabled {\n      color: var(--sdds-navigation-tabs-tab-color-disabled);\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-navigation-tabs-tab-color-opacity-disabled);\n      }\n    }\n\n    &::after {\n      content: ' ';\n      position: absolute;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      margin-left: auto;\n      width: 0;\n      margin-right: auto;\n      height: 2px;\n      background-color: var(--sdds-navigation-tabs-tab-indicator-background-hover);\n      transition: width 0.15s ease-in-out;\n      z-index: 1;\n    }\n  }\n}\n\n:host(.first) {\n  margin-left: 32px;\n}\n\n:host(.last) {\n  margin-right: 32px;\n}","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-navigation-tabs-button',\n  styleUrl: 'sdds-navigation-tabs-button.scss',\n  shadow: true,\n})\nexport class SddsNavigationTabsButton {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  render() {\n    return (\n      <Host role=\"listitem\">\n        <button\n          class={`${this.selected ? 'selected' : ''}\n         ${this.disabled ? 'disabled' : ''}`}\n          disabled={this.disabled}\n        >\n          <div class=\"label\">\n            <slot></slot>\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/sdds-navigation-tabs-link.cjs.entry.js

@@ -1,29 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-5ad19933.js');
-
-const sddsNavigationTabsLinkCss = ":host{box-sizing:border-box}:host *{box-sizing:border-box}:host a{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:var(--sdds-navigation-tabs-tab-color);padding:18px 0;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out;white-space:nowrap;background-color:transparent;border:0}:host a.selected{color:var(--sdds-navigation-tabs-tab-color-selected)}:host a.selected::after{width:100%;background-color:var(--sdds-navigation-tabs-tab-indicator-background-active)}:host a .label{padding:8px 4px}:host a:focus-visible{outline:none}:host a:focus-visible .label{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host a:hover{color:var(--sdds-navigation-tabs-tab-color-hover);opacity:1}:host a:hover::after{width:100%}:host a.disabled{color:var(--sdds-navigation-tabs-tab-color-disabled);pointer-events:none}:host a.disabled .label{opacity:var(--sdds-navigation-tabs-tab-color-opacity-disabled)}:host a::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0;margin-right:auto;height:2px;background-color:var(--sdds-navigation-tabs-tab-indicator-background-hover);transition:width 0.15s ease-in-out;z-index:1}:host(.first){margin-left:32px}:host(.last){margin-right:32px}";
-
-const SddsNavigationTabsLink = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.disabled = false;
-    this.selected = false;
-    this.href = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-  }
-  render() {
-    return (index.h(index.Host, { role: "listitem" }, index.h("a", { class: `
-        ${this.selected ? 'selected' : ''}
-        ${this.disabled ? 'disabled' : ''}
-        `, href: this.href, target: this.target, rel: this.rel }, index.h("div", { class: "label" }, index.h("slot", null)))));
-  }
-};
-SddsNavigationTabsLink.style = sddsNavigationTabsLinkCss;
-
-exports.sdds_navigation_tabs_link = SddsNavigationTabsLink;
-
-//# sourceMappingURL=sdds-navigation-tabs-link.cjs.entry.js.map

package/dist/cjs/sdds-navigation-tabs-link.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"sdds-navigation-tabs-link.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,yBAAyB,GAAG,wwCAAwwC;;MCO7xC,sBAAsB;;;oBAEL,KAAK;oBAGL,KAAK;;kBAMyB,OAAO;eAG3C,UAAU;;EAEhC,MAAM;IACJ,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,eACE,KAAK,EAAE;UACP,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;UAC/B,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE;SAChC,EACC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,GAAG,EAAE,IAAI,CAAC,GAAG,IAEbA,iBAAK,KAAK,EAAC,OAAO,IAChBA,qBAAa,CACT,CACJ,CACC,EACP;GACH;;;;;;","names":["h","Host"],"sources":["./src/components/tabs/navigation-tabs/navigation-tabs-link/sdds-navigation-tabs-link.scss?tag=sdds-navigation-tabs-link&encapsulation=shadow","./src/components/tabs/navigation-tabs/navigation-tabs-link/sdds-navigation-tabs-link.tsx"],"sourcesContent":["@import '../../../../mixins/focus-state';\n@import '../../../../mixins/box-sizing';\n\n:host {\n  @include sdds-box-sizing;\n\n  a {\n    font: var(--sdds-headline-07);\n    letter-spacing: var(--sdds-headline-07-ls);\n    color: var(--sdds-navigation-tabs-tab-color);\n    padding: 18px 0;\n    margin-right: 32px;\n    text-decoration: none;\n    display: block;\n    position: relative;\n    transition: color 0.15s ease-in-out;\n    white-space: nowrap;\n    background-color: transparent;\n    border: 0;\n\n    &.selected {\n      color: var(--sdds-navigation-tabs-tab-color-selected);\n\n      &::after {\n        width: 100%;\n        background-color: var(--sdds-navigation-tabs-tab-indicator-background-active);\n      }\n    }\n\n    .label {\n      padding: 8px 4px;\n    }\n\n    &:focus-visible {\n      outline: none;\n\n      .label {\n        @include sdds-focus-state;\n      }\n    }\n\n    &:hover {\n      color: var(--sdds-navigation-tabs-tab-color-hover);\n      opacity: 1;\n\n      &::after {\n        width: 100%;\n      }\n    }\n\n    &.disabled {\n      color: var(--sdds-navigation-tabs-tab-color-disabled);\n      pointer-events: none;\n\n      .label {\n        opacity: var(--sdds-navigation-tabs-tab-color-opacity-disabled);\n      }\n    }\n\n    &::after {\n      content: ' ';\n      position: absolute;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      margin-left: auto;\n      width: 0;\n      margin-right: auto;\n      height: 2px;\n      background-color: var(--sdds-navigation-tabs-tab-indicator-background-hover);\n      transition: width 0.15s ease-in-out;\n      z-index: 1;\n    }\n  }\n}\n\n:host(.first) {\n  margin-left: 32px;\n}\n\n:host(.last) {\n  margin-right: 32px;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-navigation-tabs-link',\n  styleUrl: 'sdds-navigation-tabs-link.scss',\n  shadow: true,\n})\nexport class SddsNavigationTabsLink {\n  /** Disables the tab. */\n  @Prop() disabled: boolean = false;\n\n  /** Marks the tab as the selected one. */\n  @Prop() selected: boolean = false;\n\n  /** Href 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  /** '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      <Host role=\"listitem\">\n        <a\n          class={`\n        ${this.selected ? 'selected' : ''}\n        ${this.disabled ? 'disabled' : ''}\n        `}\n          href={this.href}\n          target={this.target}\n          rel={this.rel}\n        >\n          <div class=\"label\">\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/collection/components/breadcrumb/sdds-breadcrumb-link/sdds-breadcrumb-link.css

@@ -1,43 +0,0 @@
-@charset "UTF-8";
-[role=listitem] {
-  display: flex;
-  align-items: center;
-  color: var(--sdds-breadcrumb-color);
-}
-[role=listitem] a {
-  color: var(--sdds-breadcrumb-color);
-  text-decoration: none;
-}
-[role=listitem]:hover {
-  cursor: pointer;
-}
-[role=listitem]:hover a {
-  color: var(--sdds-breadcrumb-color-hover);
-  text-decoration: underline;
-}
-[role=listitem].disabled {
-  pointer-events: none;
-}
-[role=listitem].disabled a, [role=listitem].current a,
-[role=listitem] [aria-current=page] a {
-  cursor: default;
-  color: var(--sdds-breadcrumb-color-disabled);
-}
-[role=listitem].disabled:hover a, [role=listitem].current:hover a,
-[role=listitem] [aria-current=page]:hover a {
-  color: var(--sdds-breadcrumb-color-disabled);
-  text-decoration: none;
-}
-[role=listitem] a::after {
-  content: "›";
-  color: var(--sdds-breadcrumb-separator-color);
-  margin-right: 4px;
-  margin-left: 4px;
-  display: inline-block;
-  width: 4px;
-  height: 8px;
-}
-
-:host(.last) a::after {
-  display: none;
-}

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

@@ -1,120 +0,0 @@
-import { h } from '@stencil/core';
-export class SddsBreadcrumbLink {
-  constructor() {
-    this.current = false;
-    this.href = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-    this.disabled = false;
-  }
-  render() {
-    return (h("div", { role: "listitem", class: `${this.current ? 'current' : ''} 
-      ${this.disabled ? 'disabled' : ''}` }, h("a", { href: !this.disabled ? this.href : null, target: this.target, rel: this.rel }, h("slot", null))));
-  }
-  static get is() { return "sdds-breadcrumb-link"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sdds-breadcrumb-link.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sdds-breadcrumb-link.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "current": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Boolean for the current link"
-        },
-        "attribute": "current",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "href": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Href for the link"
-        },
-        "attribute": "href",
-        "reflect": false
-      },
-      "target": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'_self' | '_blank' | '_parent' | '_top'",
-          "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Where to open the linked URL"
-        },
-        "attribute": "target",
-        "reflect": false,
-        "defaultValue": "'_self'"
-      },
-      "rel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "'noopener' is a security measure for legacy browsers that preventsthe opened page from getting access to the original page when using target='_blank'."
-        },
-        "attribute": "rel",
-        "reflect": false,
-        "defaultValue": "'noopener'"
-      },
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Toggle the disabled state for the breadcrumb"
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-}
-//# sourceMappingURL=sdds-breadcrumb-link.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"sdds-breadcrumb-link.js","sourceRoot":"","sources":["../../../../src/components/breadcrumb/sdds-breadcrumb-link/sdds-breadcrumb-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,kBAAkB;;mBAEF,KAAK;;kBAM0B,OAAO;eAG3C,UAAU;oBAGJ,KAAK;;EAEjC,MAAM;IACJ,OAAO,CACL,WACE,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;QACvC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;MAEjC,SAAG,IAAI,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG;QAC5E,eAAa,CACX,CACA,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'sdds-breadcrumb-link',\n  styleUrl: 'sdds-breadcrumb-link.scss',\n  shadow: true,\n})\nexport class SddsBreadcrumbLink {\n  /** Boolean for the current link */\n  @Prop() current: boolean = false;\n\n  /** Href 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  /** '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  /** Toggle the disabled state for the breadcrumb */\n  @Prop() disabled: boolean = false;\n\n  render() {\n    return (\n      <div\n        role=\"listitem\"\n        class={`${this.current ? 'current' : ''} \n      ${this.disabled ? 'disabled' : ''}`}\n      >\n        <a href={!this.disabled ? this.href : null} target={this.target} rel={this.rel}>\n          <slot></slot>\n        </a>\n      </div>\n    );\n  }\n}\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"chips.stories.js","sourceRoot":"","sources":["../../../src/components/chips/chips.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,eAAe;EACb,KAAK,EAAE,kBAAkB;EACzB,UAAU,EAAE;IACV,MAAM,EAAE,UAAU;IAClB,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,MAAM,EAAE;MACN,IAAI,EAAE,QAAQ;MACd,WAAW,EAAE,uCAAuC;MACpD,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;OACjC;KACF;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,WAAW,EAAE,qBAAqB;MAClC,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;MAC3B,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;OACnC;KACF;IACD,eAAe,EAAE;MACf,IAAI,EAAE,aAAa;MACnB,WAAW,EAAE,wBAAwB;MACrC,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;OACb;KACF;IACD,IAAI,EAAE;MACJ,IAAI,EAAE,MAAM;MACZ,WAAW,EAAE,2BAA2B;MACxC,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;OAChB;MACD,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;OACjC;KACF;IACD,YAAY,EAAE;MACZ,IAAI,EAAE,eAAe;MACrB,WAAW,EAAE,iCAAiC;MAC9C,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,WAAW,EAAE,YAAY,CAAC;MACpC,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE;MAC7B,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,YAAY,EAAE;OACxC;KACF;IACD,QAAQ,EAAE;MACR,IAAI,EAAE,WAAW;MACjB,WAAW,EAAE,0DAA0D;MACvE,OAAO,EAAE;QACP,IAAI,EAAE,OAAO;OACd;MACD,OAAO,EAAE,CAAC,QAAQ,EAAE,eAAe,CAAC;MACpC,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE;MAC7B,KAAK,EAAE;QACL,YAAY,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;OACpC;KACF;GACF;EACD,IAAI,EAAE;IACJ,MAAM,EAAE,KAAK;IACb,IAAI,EAAE,OAAO;IACb,eAAe,EAAE,WAAW;IAC5B,IAAI,EAAE,KAAK;IACX,YAAY,EAAE,YAAY;IAC1B,QAAQ,EAAE,QAAQ;GACnB;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,IAAI,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE;EACnF,MAAM,WAAW,GAAG,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC;EAC9D,MAAM,SAAS,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC;EACzD,MAAM,kBAAkB,GAAG;IACzB,WAAW,EAAE,qBAAqB;IAClC,YAAY,EAAE,sBAAsB;GACrC,CAAC;EAEF,iCAAiC;EACjC,MAAM,OAAO,GAAG;MAEZ,QAAQ,KAAK,QAAQ;IACnB,CAAC,CAAC,yCAAyC;IAC3C,CAAC,CAAC,yDACN;KACC,CAAC;EAEJ,OAAO,iBAAiB,CAAC;IAEvB,QAAQ,KAAK,QAAQ;IACnB,CAAC,CAAC;;;;mBAIW;IACb,CAAC,CAAC,EACN;;;+BAII,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,EAC5C,IAAI,WAAW,IAAI,SAAS;QAExB,IAAI;IACF,CAAC,CAAC;;UAEF,OAAO;;OAEV;IACG,CAAC,CAAC,EACN,gCAAgC,eAAe;;KAEhD,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { formatHtmlPreview } from '../../utils/utils';\n\nexport default {\n  title: 'Components/Chips',\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=11268%3A39456&t=rVXuTOgTmXPauyHd-1',\n      },\n      {\n        name: 'Link',\n        type: 'link',\n        url: 'https://www.figma.com/file/d8bTgEx7h694MSesi2CTLF/Tegel-UI-Library?node-id=11268%3A39456&t=rVXuTOgTmXPauyHd-1',\n      },\n    ],\n  },\n  argTypes: {\n    active: {\n      name: 'Active',\n      description: 'Toggles if the chip is active or not.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    size: {\n      name: 'Size',\n      description: 'Sets the chip size.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Large', 'Small'],\n      table: {\n        defaultValue: { summary: 'Large' },\n      },\n    },\n    placeholderText: {\n      name: 'Placeholder',\n      description: 'Sets custom chip text.',\n      control: {\n        type: 'text',\n      },\n    },\n    icon: {\n      name: 'Icon',\n      description: 'Adds an icon to the chip.',\n      control: {\n        type: 'boolean',\n      },\n      table: {\n        defaultValue: { summary: false },\n      },\n    },\n    iconPosition: {\n      name: 'Icon position',\n      description: 'Sets the placement of the icon.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Icon left', 'Icon right'],\n      if: { arg: 'icon', eq: true },\n      table: {\n        defaultValue: { summary: 'Icon right' },\n      },\n    },\n    iconType: {\n      name: 'Icon type',\n      description: 'Switch between showing a native or a web component icon.',\n      control: {\n        type: 'radio',\n      },\n      options: ['Native', 'Web Component'],\n      if: { arg: 'icon', eq: true },\n      table: {\n        defaultValue: { summary: 'Native' },\n      },\n    },\n  },\n  args: {\n    active: false,\n    size: 'Large',\n    placeholderText: 'Chip text',\n    icon: false,\n    iconPosition: 'Icon right',\n    iconType: 'Native',\n  },\n};\n\nconst Template = ({ active, size, placeholderText, icon, iconPosition, iconType }) => {\n  const activeValue = active === true ? 'sdds-chip-active' : '';\n  const sizeValue = size === 'Small' ? 'sdds-chip-sm' : '';\n  const iconPositionLookup = {\n    'Icon left': 'sdds-chip-icon-left',\n    'Icon right': 'sdds-chip-icon-right',\n  };\n\n  // TODO - Add dark theme to story\n  const iconSvg = `\n    ${\n      iconType === 'Native'\n        ? '<i class=\" sdds-icon notification\"></i>'\n        : '<sdds-icon name=\"notification\" size=\"16px\"></sdds-icon>'\n    }\n    `;\n\n  return formatHtmlPreview(`\n  ${\n    iconType === 'Native'\n      ? `<style>\n/* Note: In case you are using WebFont icons, please make sure to import icons css file in your implementation */\n    @import url('https://cdn.digitaldesign.scania.com/icons/webfont/css/sdds-icons.css');\n\n          </style>`\n      : ''\n  }\n    <!-- Below is a chip button implementation. Please use the proper html element \n    depending on usage (button, checkbox, radio, etc) -->\n    <button class=\"sdds-chip ${\n      icon ? iconPositionLookup[iconPosition] : ''\n    } ${activeValue} ${sizeValue}\">\n      ${\n        icon\n          ? `\n      <div class=\"sdds-chip-icon\">\n        ${iconSvg}\n      </div>\n      `\n          : ''\n      }<span class=\"sdds-chip-text\">${placeholderText}</span>\n    </button>\n    `);\n};\n\nexport const Native = Template.bind({});\n"]}

package/dist/collection/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.js

@@ -1,86 +0,0 @@
-import { h } from '@stencil/core';
-export class SddsFooterLink {
-  constructor() {
-    this.parentIsTopPart = false;
-    this.linkHref = undefined;
-    this.target = '_self';
-    this.rel = 'noopener';
-  }
-  connectedCallback() {
-    this.parentIsTopPart = this.host.closest('sdds-footer-link-group').parentElement.slot === 'top';
-  }
-  render() {
-    return (h("div", { role: "listitem", class: `${this.parentIsTopPart ? 'top-part-child' : ''}` }, h("a", { target: this.target, rel: this.rel, href: this.linkHref }, h("slot", null))));
-  }
-  static get is() { return "sdds-footer-link"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["sdds-footer-link.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["sdds-footer-link.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "linkHref": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "URL for the link"
-        },
-        "attribute": "link-href",
-        "reflect": false
-      },
-      "target": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'_self' | '_blank' | '_parent' | '_top'",
-          "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Where to open the linked URL"
-        },
-        "attribute": "target",
-        "reflect": false,
-        "defaultValue": "'_self'"
-      },
-      "rel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "'noopener' is a security measure for legacy browsers that prevents the opened page from getting access to the original page when using target='_blank'."
-        },
-        "attribute": "rel",
-        "reflect": false,
-        "defaultValue": "'noopener'"
-      }
-    };
-  }
-  static get elementRef() { return "host"; }
-}
-//# sourceMappingURL=sdds-footer-link.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"sdds-footer-link.js","sourceRoot":"","sources":["../../../../../src/components/footer/webcomponent/sdds-footer-link/sdds-footer-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAS5D,MAAM,OAAO,cAAc;;IAYzB,oBAAe,GAAY,KAAK,CAAC;;kBAPyB,OAAO;eAG3C,UAAU;;EAMhC,iBAAiB;IACf,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,aAAa,CAAC,IAAI,KAAK,KAAK,CAAC;EAClG,CAAC;EAED,MAAM;IACJ,OAAO,CACL,WAAK,IAAI,EAAC,UAAU,EAAC,KAAK,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,EAAE;MAC3E,SAAG,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ;QACxD,eAAa,CACX,CACA,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Prop } from '@stencil/core';\nimport { HostElement } from '@stencil/core/internal';\n\n@Component({\n  tag: 'sdds-footer-link',\n  styleUrl: 'sdds-footer-link.scss',\n  shadow: false,\n  scoped: true,\n})\nexport class SddsFooterLink {\n  /** URL for the link */\n  @Prop() linkHref: string;\n\n  /** Where to open the linked URL */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  /** 'noopener' is a security measure for legacy browsers that prevents the opened page from getting access to the original page when using target='_blank'. */\n  @Prop() rel: string = 'noopener';\n\n  @Element() host: HostElement;\n\n  parentIsTopPart: boolean = false;\n\n  connectedCallback() {\n    this.parentIsTopPart = this.host.closest('sdds-footer-link-group').parentElement.slot === 'top';\n  }\n\n  render() {\n    return (\n      <div role=\"listitem\" class={`${this.parentIsTopPart ? 'top-part-child' : ''}`}>\n        <a target={this.target} rel={this.rel} href={this.linkHref}>\n          <slot></slot>\n        </a>\n      </div>\n    );\n  }\n}\n"]}