@scania/tegel 1.3.3 → 1.5.0

package/dist/components/tds-banner.js

@@ -6,79 +6,79 @@ import { d as defineCustomElement$2 } from './icon.js';
 const bannerCss = ":root,.tds-mode-light{--tds-link:var(--tds-blue-500);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-grey-900);--tds-link-disabled:var(--tds-grey-400)}:root tds-toast,.tds-mode-light tds-toast{--tds-link:var(--tds-blue-300);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-blue-100);--tds-link-disabled:var(--tds-grey-800)}.tds-mode-dark{--tds-link:var(--tds-blue-300);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-blue-100);--tds-link-disabled:var(--tds-grey-800)}.tds-mode-dark tds-toast{--tds-link:var(--tds-blue-500);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-grey-900);--tds-link-disabled:var(--tds-grey-400)}:host(.hide){display:none;visibility:hidden}:host(.error){background-color:var(--tds-banner-background-error)}:host(.information){background-color:var(--tds-banner-background-info)}:host{display:flex;background-color:var(--tds-banner-background-default);z-index:400}:host .banner-icon{padding-left:20px;padding-top:14px;padding-right:12px;color:var(--tds-banner-prefix-default-color)}:host .banner-icon.error{color:var(--tds-banner-prefix-error-color)}:host .banner-icon.information{color:var(--tds-banner-prefix-info-color)}:host .content{color:var(--tds-banner-text-color);display:flex;flex-direction:column;flex-grow:1;padding:16px 0}:host .content.no-icon{padding-left:16px}:host .header-subheader{display:flex;flex-direction:column;gap:4px}:host .header,:host slot[name=header]{font:var(--tds-headline-06);letter-spacing:var(--tds-headline-06-ls)}:host .subheader,:host slot[name=subheader]{display:block;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}:host slot[name=actions]::slotted(*){display:block;width:fit-content;margin-top:16px}:host .banner-close{color:var(--tds-banner-x-color)}:host .banner-close button{padding-right:16px;padding-top:14px;background-color:transparent;border:none;color:var(--tds-banner-x-color)}:host .banner-close button:hover{cursor:pointer}:host .banner-close button:focus-visible{outline:none}:host .banner-close button:focus-visible tds-icon{outline:2px solid var(--tds-blue-400);outline-offset:-2px}";
 
 const TdsBanner$1 = /*@__PURE__*/ proxyCustomElement(class TdsBanner extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.tdsClose = createEvent(this, "tdsClose", 7);
-    this.handleClose = () => {
-      const tdsCloseEvent = this.tdsClose.emit({
-        bannerId: this.bannerId,
-      });
-      if (!tdsCloseEvent.defaultPrevented) {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.tdsClose = createEvent(this, "tdsClose", 7);
+        this.handleClose = () => {
+            const tdsCloseEvent = this.tdsClose.emit({
+                bannerId: this.bannerId,
+            });
+            if (!tdsCloseEvent.defaultPrevented) {
+                this.hidden = true;
+            }
+        };
+        this.icon = undefined;
+        this.header = undefined;
+        this.subheader = undefined;
+        this.variant = 'default';
+        this.bannerId = generateUniqueId();
+        this.hidden = false;
+    }
+    /** Hides the Banner. */
+    async hideBanner() {
         this.hidden = true;
-      }
-    };
-    this.icon = undefined;
-    this.header = undefined;
-    this.subheader = undefined;
-    this.variant = 'default';
-    this.bannerId = generateUniqueId();
-    this.hidden = false;
-  }
-  /** Hides the Banner. */
-  async hideBanner() {
-    this.hidden = true;
-  }
-  /** Shows the Banner */
-  async showBanner() {
-    this.hidden = false;
-  }
-  connectedCallback() {
-    if (this.variant === 'error') {
-      this.icon = 'error';
     }
-    else if (this.variant === 'information') {
-      this.icon = 'info';
+    /** Shows the Banner */
+    async showBanner() {
+        this.hidden = false;
+    }
+    connectedCallback() {
+        if (this.variant === 'error') {
+            this.icon = 'error';
+        }
+        else if (this.variant === 'information') {
+            this.icon = 'info';
+        }
     }
-  }
-  render() {
-    const usesHeaderSlot = hasSlot('subheader', this.host);
-    const usesSubheaderSlot = hasSlot('subheader', this.host);
-    const usesActionsSlot = hasSlot('actions', this.host);
-    return (h(Host, { role: "banner", "aria-hidden": `${this.hidden}`, "aria-live": this.host.getAttribute('aria-live') ? this.host.getAttribute('aria-live') : 'polite', "aria-atomic": this.host.getAttribute('aria-atomic'), class: `${this.variant} ${this.hidden ? 'hide' : 'show'}` }, this.icon && (h("div", { class: `banner-icon ${this.variant}` }, h("tds-icon", { name: this.icon, size: "20px" }))), h("div", { class: "content" }, h("div", { class: "header-subheader" }, this.header && h("div", { class: "header" }, this.header), usesHeaderSlot && h("slot", { name: "header" }), this.subheader && h("div", { class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { name: "subheader" })), usesActionsSlot && h("slot", { name: "actions" })), h("div", { class: `banner-close` }, h("button", { onClick: () => {
-        this.handleClose();
-      } }, h("tds-icon", { name: "cross", size: "20px" })))));
-  }
-  get host() { return this; }
-  static get style() { return bannerCss; }
+    render() {
+        const usesHeaderSlot = hasSlot('subheader', this.host);
+        const usesSubheaderSlot = hasSlot('subheader', this.host);
+        const usesActionsSlot = hasSlot('actions', this.host);
+        return (h(Host, { role: "banner", "aria-hidden": `${this.hidden}`, "aria-live": this.host.getAttribute('aria-live') ? this.host.getAttribute('aria-live') : 'polite', "aria-atomic": this.host.getAttribute('aria-atomic'), class: `${this.variant} ${this.hidden ? 'hide' : 'show'}` }, this.icon && (h("div", { class: `banner-icon ${this.variant}` }, h("tds-icon", { name: this.icon, size: "20px" }))), h("div", { class: "content" }, h("div", { class: "header-subheader" }, this.header && h("div", { class: "header" }, this.header), usesHeaderSlot && h("slot", { name: "header" }), this.subheader && h("div", { class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { name: "subheader" })), usesActionsSlot && h("slot", { name: "actions" })), h("div", { class: `banner-close` }, h("button", { onClick: () => {
+                this.handleClose();
+            } }, h("tds-icon", { name: "cross", size: "20px" })))));
+    }
+    get host() { return this; }
+    static get style() { return bannerCss; }
 }, [1, "tds-banner", {
-    "icon": [1],
-    "header": [1],
-    "subheader": [1],
-    "variant": [1],
-    "bannerId": [1, "banner-id"],
-    "hidden": [516],
-    "hideBanner": [64],
-    "showBanner": [64]
-  }]);
+        "icon": [1],
+        "header": [1],
+        "subheader": [1],
+        "variant": [1],
+        "bannerId": [1, "banner-id"],
+        "hidden": [516],
+        "hideBanner": [64],
+        "showBanner": [64]
+    }]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["tds-banner", "tds-icon"];
-  components.forEach(tagName => { switch (tagName) {
-    case "tds-banner":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TdsBanner$1);
-      }
-      break;
-    case "tds-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["tds-banner", "tds-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "tds-banner":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TdsBanner$1);
+            }
+            break;
+        case "tds-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
 }
 defineCustomElement$1();
 

package/dist/components/tds-block.d.ts

@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
 
 interface TdsBlock extends Components.TdsBlock, HTMLElement {}
 export const TdsBlock: {
-  prototype: TdsBlock;
-  new (): TdsBlock;
+    prototype: TdsBlock;
+    new (): TdsBlock;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/tds-block.js

@@ -3,45 +3,45 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
 const blockCss = ".tds-block{box-sizing:border-box;color:var(--tds-block-color);border-radius:4px;padding:16px;font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls);background-color:var(--tds-block-background)}.tds-block *{box-sizing:border-box}.tds-mode-variant-primary{--tds-block-background:var(--tds-block-background-primary);--tds-block-background-nested:var(--tds-block-background-nested-primary)}.tds-mode-variant-secondary{--tds-block-background:var(--tds-block-background-secondary);--tds-block-background-nested:var(--tds-block-background-nested-secondary)}";
 
 const TdsBlock$1 = /*@__PURE__*/ proxyCustomElement(class TdsBlock extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.modeVariant = null;
-  }
-  setModeVariantOnChildBlocks() {
-    var _a;
-    this.children = Array.from(this.host.children).filter((item) => item.tagName === 'TDS-BLOCK');
-    (_a = this.children) === null || _a === void 0 ? void 0 : _a.forEach((item) => {
-      if (!this.modeVariant) {
-        item.setAttribute('mode-variant', 'secondary');
-      }
-      else {
-        item.setAttribute('mode-variant', this.modeVariant === 'primary' ? 'secondary' : 'primary');
-      }
-    });
-  }
-  render() {
-    this.setModeVariantOnChildBlocks();
-    return (h("div", { class: `tds-block ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", null)));
-  }
-  get host() { return this; }
-  static get style() { return blockCss; }
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.modeVariant = null;
+    }
+    setModeVariantOnChildBlocks() {
+        var _a;
+        this.children = Array.from(this.host.children).filter((item) => item.tagName === 'TDS-BLOCK');
+        (_a = this.children) === null || _a === void 0 ? void 0 : _a.forEach((item) => {
+            if (!this.modeVariant) {
+                item.setAttribute('mode-variant', 'secondary');
+            }
+            else {
+                item.setAttribute('mode-variant', this.modeVariant === 'primary' ? 'secondary' : 'primary');
+            }
+        });
+    }
+    render() {
+        this.setModeVariantOnChildBlocks();
+        return (h("div", { class: `tds-block ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", null)));
+    }
+    get host() { return this; }
+    static get style() { return blockCss; }
 }, [1, "tds-block", {
-    "modeVariant": [1, "mode-variant"]
-  }]);
+        "modeVariant": [1, "mode-variant"]
+    }]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["tds-block"];
-  components.forEach(tagName => { switch (tagName) {
-    case "tds-block":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TdsBlock$1);
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["tds-block"];
+    components.forEach(tagName => { switch (tagName) {
+        case "tds-block":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TdsBlock$1);
+            }
+            break;
+    } });
 }
 defineCustomElement$1();
 

package/dist/components/tds-body-cell.d.ts

@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
 
 interface TdsBodyCell extends Components.TdsBodyCell, HTMLElement {}
 export const TdsBodyCell: {
-  prototype: TdsBodyCell;
-  new (): TdsBodyCell;
+    prototype: TdsBodyCell;
+    new (): TdsBodyCell;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/tds-body-cell.js

@@ -3,99 +3,99 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 const tableBodyCellCss = ":host(.tds-table__body-cell){box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:table-cell;box-sizing:border-box;color:var(--tds-table-color);padding:var(--tds-spacing-element-16);min-width:192px;vertical-align:top;background-color:transparent;transition:background-color 200ms ease}:host(.tds-table__body-cell) *{box-sizing:border-box}:host(.tds-table__body-cell--no-padding){padding:0}:host(.tds-table__body-cell--hover){background-color:var(--tds-table-body-cell-background-hover)}:host(.tds-table__compact){padding:var(--tds-spacing-element-8) var(--tds-spacing-element-16)}:host(.tds-table--divider){border-right:1px solid var(--tds-table-divider)}:host(.tds-table--divider:last-of-type){border-right:none}:host(.tds-table--no-min-width){min-width:unset}";
 
 const relevantTableProps = [
-  'verticalDividers',
-  'compactDesign',
-  'noMinWidth',
+    'verticalDividers',
+    'compactDesign',
+    'noMinWidth',
 ];
 const TdsTableBodyCell = /*@__PURE__*/ proxyCustomElement(class TdsTableBodyCell extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.cellValue = undefined;
-    this.cellKey = undefined;
-    this.disablePadding = false;
-    this.textAlignState = undefined;
-    this.activeSorting = false;
-    this.verticalDividers = false;
-    this.compactDesign = false;
-    this.noMinWidth = false;
-    this.whiteBackground = false;
-    this.tableId = '';
-  }
-  internalTdsPropChangeListener(event) {
-    if (this.tableId === event.detail.tableId) {
-      event.detail.changed
-        .filter((changedProp) => relevantTableProps.includes(changedProp))
-        .forEach((changedProp) => {
-        if (typeof this[changedProp] === 'undefined') {
-          throw new Error(`Table prop is not supported: ${changedProp}`);
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.cellValue = undefined;
+        this.cellKey = undefined;
+        this.disablePadding = false;
+        this.textAlignState = undefined;
+        this.activeSorting = false;
+        this.verticalDividers = false;
+        this.compactDesign = false;
+        this.noMinWidth = false;
+        this.whiteBackground = false;
+        this.tableId = '';
+    }
+    internalTdsPropChangeListener(event) {
+        if (this.tableId === event.detail.tableId) {
+            event.detail.changed
+                .filter((changedProp) => relevantTableProps.includes(changedProp))
+                .forEach((changedProp) => {
+                if (typeof this[changedProp] === 'undefined') {
+                    throw new Error(`Table prop is not supported: ${changedProp}`);
+                }
+                this[changedProp] = event.detail[changedProp];
+            });
+        }
+    }
+    // Listen to headKey from table-header-element
+    internalTdsHoverListener(event) {
+        const { tableId, key } = event.detail;
+        if (tableId === this.tableId) {
+            this.activeSorting = this.cellKey === key;
         }
-        this[changedProp] = event.detail[changedProp];
-      });
     }
-  }
-  // Listen to headKey from table-header-element
-  internalTdsHoverListener(event) {
-    const { tableId, key } = event.detail;
-    if (tableId === this.tableId) {
-      this.activeSorting = this.cellKey === key;
+    // Listen to internalTdsTextAlign from table-header-element
+    internalTdsTextAlignListener(event) {
+        const [receivedID, receivedKey, receivedTextAlign] = event.detail;
+        if (this.tableId === receivedID) {
+            if (this.cellKey === receivedKey) {
+                this.textAlignState = receivedTextAlign;
+            }
+        }
     }
-  }
-  // Listen to internalTdsTextAlign from table-header-element
-  internalTdsTextAlignListener(event) {
-    const [receivedID, receivedKey, receivedTextAlign] = event.detail;
-    if (this.tableId === receivedID) {
-      if (this.cellKey === receivedKey) {
-        this.textAlignState = receivedTextAlign;
-      }
+    connectedCallback() {
+        this.tableEl = this.host.closest('tds-table');
+        this.tableId = this.tableEl.tableId;
     }
-  }
-  connectedCallback() {
-    this.tableEl = this.host.closest('tds-table');
-    this.tableId = this.tableEl.tableId;
-  }
-  componentWillLoad() {
-    relevantTableProps.forEach((tablePropName) => {
-      this[tablePropName] = this.tableEl[tablePropName];
-    });
-  }
-  render() {
-    return (h(Host, { class: {
-        'tds-table__body-cell': true,
-        'tds-table__body-cell--hover': this.activeSorting,
-        'tds-table__compact': this.compactDesign,
-        'tds-table--divider': this.verticalDividers,
-        'tds-table--no-min-width': this.noMinWidth,
-        'tds-table__body-cell--no-padding': this.disablePadding,
-      }, style: { textAlign: this.textAlignState } }, this.cellValue, h("slot", null)));
-  }
-  get host() { return this; }
-  static get style() { return tableBodyCellCss; }
+    componentWillLoad() {
+        relevantTableProps.forEach((tablePropName) => {
+            this[tablePropName] = this.tableEl[tablePropName];
+        });
+    }
+    render() {
+        return (h(Host, { class: {
+                'tds-table__body-cell': true,
+                'tds-table__body-cell--hover': this.activeSorting,
+                'tds-table__compact': this.compactDesign,
+                'tds-table--divider': this.verticalDividers,
+                'tds-table--no-min-width': this.noMinWidth,
+                'tds-table__body-cell--no-padding': this.disablePadding,
+            }, style: { textAlign: this.textAlignState } }, this.cellValue, h("slot", null)));
+    }
+    get host() { return this; }
+    static get style() { return tableBodyCellCss; }
 }, [1, "tds-body-cell", {
-    "cellValue": [520, "cell-value"],
-    "cellKey": [520, "cell-key"],
-    "disablePadding": [516, "disable-padding"],
-    "textAlignState": [32],
-    "activeSorting": [32],
-    "verticalDividers": [32],
-    "compactDesign": [32],
-    "noMinWidth": [32],
-    "whiteBackground": [32],
-    "tableId": [32]
-  }, [[16, "internalTdsPropChange", "internalTdsPropChangeListener"], [16, "internalTdsHover", "internalTdsHoverListener"], [16, "internalTdsTextAlign", "internalTdsTextAlignListener"]]]);
+        "cellValue": [520, "cell-value"],
+        "cellKey": [520, "cell-key"],
+        "disablePadding": [516, "disable-padding"],
+        "textAlignState": [32],
+        "activeSorting": [32],
+        "verticalDividers": [32],
+        "compactDesign": [32],
+        "noMinWidth": [32],
+        "whiteBackground": [32],
+        "tableId": [32]
+    }, [[16, "internalTdsPropChange", "internalTdsPropChangeListener"], [16, "internalTdsHover", "internalTdsHoverListener"], [16, "internalTdsTextAlign", "internalTdsTextAlignListener"]]]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["tds-body-cell"];
-  components.forEach(tagName => { switch (tagName) {
-    case "tds-body-cell":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TdsTableBodyCell);
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["tds-body-cell"];
+    components.forEach(tagName => { switch (tagName) {
+        case "tds-body-cell":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TdsTableBodyCell);
+            }
+            break;
+    } });
 }
 defineCustomElement$1();
 

package/dist/components/tds-breadcrumb.d.ts

@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
 
 interface TdsBreadcrumb extends Components.TdsBreadcrumb, HTMLElement {}
 export const TdsBreadcrumb: {
-  prototype: TdsBreadcrumb;
-  new (): TdsBreadcrumb;
+    prototype: TdsBreadcrumb;
+    new (): TdsBreadcrumb;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/tds-breadcrumb.js

@@ -3,31 +3,31 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
 const breadcrumbCss = "@charset \"UTF-8\";[role=listitem] ::slotted(*){color:var(--tds-breadcrumb-color);text-decoration:none}[role=listitem]:hover ::slotted(*){color:var(--tds-breadcrumb-color-hover);text-decoration:underline}[role=listitem] ::slotted(*:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px;outline-offset:0}[role=listitem].current ::slotted(*),[role=listitem] [aria-current=page] ::slotted(*){pointer-events:none;cursor:default;color:var(--tds-breadcrumb-color-current)}[role=listitem].current:hover ::slotted(*),[role=listitem] [aria-current=page]:hover ::slotted(*){text-decoration:none;cursor:not-allowed}[role=listitem]::after{content:\"›\";color:var(--tds-breadcrumb-separator-color);margin-right:4px;margin-left:4px;display:inline-block;width:4px;height:8px}:host(.last) [role=listitem]::after{display:none}";
 
 const TdsBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class TdsBreadcrumb extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.current = false;
-  }
-  render() {
-    return (h("div", { role: "listitem", class: `${this.current ? 'current' : ''}` }, h("slot", null)));
-  }
-  static get style() { return breadcrumbCss; }
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.current = false;
+    }
+    render() {
+        return (h("div", { role: "listitem", class: `${this.current ? 'current' : ''}` }, h("slot", null)));
+    }
+    static get style() { return breadcrumbCss; }
 }, [1, "tds-breadcrumb", {
-    "current": [4]
-  }]);
+        "current": [4]
+    }]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["tds-breadcrumb"];
-  components.forEach(tagName => { switch (tagName) {
-    case "tds-breadcrumb":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TdsBreadcrumb$1);
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["tds-breadcrumb"];
+    components.forEach(tagName => { switch (tagName) {
+        case "tds-breadcrumb":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TdsBreadcrumb$1);
+            }
+            break;
+    } });
 }
 defineCustomElement$1();
 

package/dist/components/tds-breadcrumbs.d.ts

@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
 
 interface TdsBreadcrumbs extends Components.TdsBreadcrumbs, HTMLElement {}
 export const TdsBreadcrumbs: {
-  prototype: TdsBreadcrumbs;
-  new (): TdsBreadcrumbs;
+    prototype: TdsBreadcrumbs;
+    new (): TdsBreadcrumbs;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/tds-breadcrumbs.js

@@ -3,31 +3,31 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
 const breadcrumbsCss = ":host{box-sizing:border-box}:host *{box-sizing:border-box}:host [role=list]{padding:0;margin:0;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:flex;flex-wrap:wrap;list-style-type:none}";
 
 const TdsBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class TdsBreadcrumbs extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-  }
-  render() {
-    var _a;
-    (_a = this.host.children[this.host.children.length - 1]) === null || _a === void 0 ? void 0 : _a.classList.add('last');
-    return (h("nav", null, h("div", { role: "list", class: 'tds-breadcrumb' }, h("slot", null))));
-  }
-  get host() { return this; }
-  static get style() { return breadcrumbsCss; }
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    render() {
+        var _a;
+        (_a = this.host.children[this.host.children.length - 1]) === null || _a === void 0 ? void 0 : _a.classList.add('last');
+        return (h("nav", null, h("div", { role: "list", class: 'tds-breadcrumb' }, h("slot", null))));
+    }
+    get host() { return this; }
+    static get style() { return breadcrumbsCss; }
 }, [1, "tds-breadcrumbs"]);
 function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["tds-breadcrumbs"];
-  components.forEach(tagName => { switch (tagName) {
-    case "tds-breadcrumbs":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TdsBreadcrumbs$1);
-      }
-      break;
-  } });
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["tds-breadcrumbs"];
+    components.forEach(tagName => { switch (tagName) {
+        case "tds-breadcrumbs":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TdsBreadcrumbs$1);
+            }
+            break;
+    } });
 }
 defineCustomElement$1();
 

package/dist/components/tds-button.d.ts

@@ -2,8 +2,8 @@ import type { Components, JSX } from "../types/components";
 
 interface TdsButton extends Components.TdsButton, HTMLElement {}
 export const TdsButton: {
-  prototype: TdsButton;
-  new (): TdsButton;
+    prototype: TdsButton;
+    new (): TdsButton;
 };
 /**
  * Used to define this component and all nested components recursively.