@scania/tegel 0.0.8 → 0.0.10

package/dist/cjs/tds-accordion-item.cjs.entry.js

@@ -0,0 +1,40 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+const accordionItemCss = ".tds-accordion-item{box-sizing:border-box;list-style:none;color:var(--tds-accordion-color);position:relative;border-top:1px solid var(--tds-accordion-border)}.tds-accordion-item *{box-sizing:border-box}.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{all:unset}.tds-accordion-item .tds-accordion-header-icon-start,.tds-accordion-item .tds-accordion-header-icon-end,.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{box-sizing:border-box;cursor:pointer;display:flex;align-items:center;width:100%;font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);padding:var(--tds-spacing-element-16);background-color:var(--tds-accordion-background)}.tds-accordion-item .tds-accordion-header-icon-start *,.tds-accordion-item .tds-accordion-header-icon-end *,.tds-accordion-item button.tds-accordion-header-icon-start *,.tds-accordion-item button.tds-accordion-header-icon-end *{box-sizing:border-box}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon{transform-origin:center;transition:transform 0.15s ease-in-out;color:var(--tds-accordion-icon-color)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon>tds-icon{display:block}.tds-accordion-item .tds-accordion-title{flex-grow:2}.tds-accordion-item .tds-accordion-panel{cursor:default;padding:var(--tds-spacing-element-8) var(--tds-spacing-layout-64) var(--tds-spacing-element-32) var(--tds-spacing-element-16);display:none;font:var(--tds-detail-03);letter-spacing:var(--tds-detail-03-ls)}.tds-accordion-item .tds-accordion-panel p{margin:0;padding:0}.tds-accordion-item .tds-accordion-panel--padding-reset{padding-right:var(--tds-spacing-element-16)}.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon{margin:0 0 0 var(--tds-spacing-element-32)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-title{order:1}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon{order:0;margin:0 var(--tds-spacing-element-16) 0 0}.tds-accordion-item.disabled,.tds-accordion-item.disabled .tds-accordion-header-icon-end,.tds-accordion-item.disabled .tds-accordion-header-icon-start,.tds-accordion-item.disabled .tds-accordion-panel{color:var(--tds-accordion-color-disabled);cursor:not-allowed}.tds-accordion-item.disabled .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-panel .tds-accordion-icon{color:var(--tds-accordion-color-disabled)}.tds-accordion-item.disabled:hover,.tds-accordion-item.disabled:hover *,.tds-accordion-item.disabled:focus,.tds-accordion-item.disabled:focus *,.tds-accordion-item.disabled:active,.tds-accordion-item.disabled:active *,.tds-accordion-item.disabled.active,.tds-accordion-item.disabled.active *{cursor:not-allowed}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-start,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-end,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end::after{border-color:transparent}.tds-accordion-item.expanded .tds-accordion-panel{display:block;padding-bottom:31px}.tds-accordion-item.expanded .tds-accordion-icon{transform:rotate(180deg)}.tds-accordion-item.expanded .tds-accordion-header-icon-end .tds-accordion-icon{margin-right:0;margin-left:var(--tds-spacing-element-32)}.tds-accordion-item.expanded .tds-accordion-header-icon-start .tds-accordion-icon{margin-left:0;margin-right:var(--tds-spacing-element-16)}.tds-accordion-item:focus{border-top:1px solid var(--tds-accordion-border-focus)}.tds-accordion-item[disabled=true]:focus{border-color:var(--tds-accordion-border)}:host(:focus) .tds-accordion-item{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host(:focus) .tds-accordion-item .tds-accordion-header-icon-start,:host(:focus) .tds-accordion-item .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-focus);outline:none}:host(:hover) .tds-accordion-header-icon-start,:host(:hover) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-hover)}:host(:active) .tds-accordion-header-icon-start,:host(:active) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-active);outline:none}";
+
+const TdsAccordionItem = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.tdsToggle = index.createEvent(this, "tdsToggle", 7);
+    this.header = '';
+    this.expandIconPosition = 'end';
+    this.disabled = false;
+    this.expanded = false;
+    this.paddingReset = false;
+  }
+  /** Method for toggling the expanded state of the Accordion Item. */
+  async toggleAccordionItem() {
+    // This is negated in order to emit the value the Accordion Item will have after it has expanded/redacted.
+    const event = this.tdsToggle.emit({
+      expanded: !this.expanded,
+    });
+    if (!event.defaultPrevented) {
+      this.expanded = !this.expanded;
+    }
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: `tds-accordion-item
+        ${this.disabled ? 'disabled' : ''}
+        ${this.expanded ? 'expanded' : ''}
+        ` }, index.h("button", { type: "button", "aria-expanded": this.expanded, class: `tds-accordion-header-icon-${this.expandIconPosition}`, onClick: () => this.toggleAccordionItem(), disabled: this.disabled }, index.h("div", { class: "tds-accordion-title" }, this.header, index.h("slot", { name: "header" })), index.h("div", { class: "tds-accordion-icon" }, index.h("tds-icon", { name: "chevron_down", size: "16px" }))), index.h("div", { class: `tds-accordion-panel
+            ${this.paddingReset ? 'tds-accordion-panel--padding-reset ' : ''}
+            ` }, index.h("slot", null)))));
+  }
+};
+TdsAccordionItem.style = accordionItemCss;
+
+exports.tds_accordion_item = TdsAccordionItem;

package/dist/cjs/tds-accordion.cjs.entry.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+const accordionCss = ":host{display:block;box-sizing:border-box}:host *{box-sizing:border-box}:host .tds-accordion-header-icon-start,:host .tds-accordion-header-icon-end{position:relative}:host(:focus){outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host(:focus) .tds-accordion-item .tds-accordion-header-icon-start,:host(:focus) .tds-accordion-item .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-focus);outline:none}:host(:focus) .tds-accordion-item .tds-accordion-header-icon-start::after,:host(:focus) .tds-accordion-item .tds-accordion-header-icon-end::after{border-color:var(--tds-accordion-border-focus)}:host(:focus) .disabled,:host(:focus) .disabled *{cursor:not-allowed}:host(:focus) .disabled .tds-accordion-header-icon-start,:host(:focus) .disabled .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}:host(:focus) .disabled .tds-accordion-header-icon-start::after,:host(:focus) .disabled .tds-accordion-header-icon-end::after{border-color:transparent}:host(:active) .tds-accordion-header-icon-start,:host(:active) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-active);outline:none}:host(:active) .disabled,:host(:active) .disabled *{cursor:not-allowed}:host(:active) .disabled .tds-accordion-header-icon-start,:host(:active) .disabled .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}:host(:active) .disabled .tds-accordion-header-icon-start::after,:host(:active) .disabled .tds-accordion-header-icon-end::after{border-color:transparent}:host(:last-child){border-bottom:1px solid var(--tds-accordion-border)}";
+
+const TdsAccordion = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.modeVariant = null;
+  }
+  render() {
+    return (index.h(index.Host, { class: `tds-accordion ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("slot", null)));
+  }
+};
+TdsAccordion.style = accordionCss;
+
+exports.tds_accordion = TdsAccordion;

package/dist/cjs/tds-badge.cjs.entry.js

@@ -0,0 +1,48 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+const badgeCss = ":host{--tds-badge-background-color:var(--tds-negative);--tds-badge-color-text:var(--tds-white);box-sizing:border-box;display:block}:host *{box-sizing:border-box}.tds-badge{display:block;border-radius:12px;background-color:var(--tds-badge-background-color);text-align:center}.tds-badge.tds-badge-sm{height:8px;width:8px;line-height:8px}.tds-badge.tds-badge-lg{height:20px;line-height:20px;width:20px}.tds-badge.tds-badge-pill{display:inline-block;width:unset;padding-left:8px;padding-right:8px}.tds-badge.tds-badge-hidden{display:none}.tds-badge-text{font-family:var(--tds-font-family-semi-condensed-bold);font-size:12px;color:var(--tds-badge-color-text);font-weight:bold}";
+
+const TdsBadge = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.value = '';
+    this.hidden = false;
+    this.size = 'lg';
+    this.shape = '';
+    this.text = '';
+  }
+  watchProps() {
+    this.checkProps();
+  }
+  componentWillLoad() {
+    this.checkProps();
+  }
+  checkProps() {
+    const valueAsNumber = parseInt(this.value);
+    if (!Number.isNaN(valueAsNumber) && this.size !== 'sm') {
+      this.shape = this.value.toString().length >= 2 ? 'pill' : '';
+      this.size = 'lg';
+      this.text = valueAsNumber.toString().length >= 3 ? '99+' : valueAsNumber.toString();
+    }
+    else {
+      // eslint-disable-next-line no-unused-expressions, @typescript-eslint/no-unused-expressions
+      if (this.value !== '' && this.size !== 'sm') {
+        console.warn('The provided value is either empty or string, please provide value as number.');
+      }
+    }
+  }
+  render() {
+    return (index.h("host", { class: `tds-badge tds-badge-${this.size} ${this.shape === 'pill' ? 'tds-badge-pill' : ''} ${this.hidden ? 'tds-badge-hidden' : ''}` }, index.h("div", { class: "tds-badge-text" }, this.text)));
+  }
+  static get watchers() { return {
+    "value": ["watchProps"],
+    "size": ["watchProps"]
+  }; }
+};
+TdsBadge.style = badgeCss;
+
+exports.tds_badge = TdsBadge;

package/dist/cjs/tds-banner.cjs.entry.js

@@ -0,0 +1,67 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+const utils = require('./utils-41de5fb2.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)}.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)}: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=bottom]::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 = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.tdsClose = index.createEvent(this, "tdsClose", 7);
+    this.tdsShow = index.createEvent(this, "tdsShow", 7);
+    this.handleClose = () => {
+      const tdsCloseEvent = this.tdsClose.emit({
+        bannerId: this.bannerId,
+      });
+      if (!tdsCloseEvent.defaultPrevented) {
+        this.hidden = true;
+      }
+    };
+    this.handleShow = () => {
+      const tdsCloseEvent = this.tdsShow.emit({
+        bannerId: this.bannerId,
+      });
+      if (!tdsCloseEvent.defaultPrevented) {
+        this.hidden = false;
+      }
+    };
+    this.icon = undefined;
+    this.header = undefined;
+    this.subheader = undefined;
+    this.type = 'none';
+    this.bannerId = utils.generateUniqueId();
+    this.persistent = false;
+    this.hidden = false;
+  }
+  /** Hides the Banner. */
+  async hideBanner() {
+    this.hidden = true;
+  }
+  /** Shows the Banner */
+  async showBanner() {
+    this.hidden = false;
+  }
+  connectedCallback() {
+    if (this.type === 'error') {
+      this.icon = 'error';
+    }
+    else if (this.type === 'information') {
+      this.icon = 'info';
+    }
+  }
+  render() {
+    const usesHeaderSlot = utils.hasSlot('subheader', this.host);
+    const usesSubheaderSlot = utils.hasSlot('subheader', this.host);
+    const usesBottomSlot = utils.hasSlot('bottom', this.host);
+    return (index.h(index.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.type} ${this.hidden ? 'hide' : 'show'}` }, this.icon && (index.h("div", { class: `banner-icon ${this.type}` }, index.h("tds-icon", { name: this.icon, size: "20px" }))), index.h("div", { class: "content" }, index.h("div", { class: "header-subheader" }, this.header && index.h("div", { class: "header" }, this.header), usesHeaderSlot && index.h("slot", { name: "header" }), this.subheader && index.h("div", { class: "subheader" }, this.subheader), usesSubheaderSlot && index.h("slot", { name: "subheader" })), usesBottomSlot && index.h("slot", { name: "bottom" })), !this.persistent && (index.h("div", { class: `banner-close` }, index.h("button", { onClick: () => {
+        this.handleClose();
+      } }, index.h("tds-icon", { name: "cross", size: "20px" }))))));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsBanner.style = bannerCss;
+
+exports.tds_banner = TdsBanner;

package/dist/cjs/tds-block.cjs.entry.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+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 = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.modeVariant = null;
+  }
+  connectedCallback() {
+    this.children = Array.from(this.host.children).filter((item) => item.tagName === 'TDS-BLOCK');
+    this.children.forEach((item) => {
+      if (!this.modeVariant) {
+        item.setAttribute('mode-variant', 'secondary');
+      }
+      else {
+        item.setAttribute('mode-variant', this.modeVariant === 'primary' ? 'secondary' : 'primary');
+      }
+    });
+  }
+  render() {
+    return (index.h("div", { class: `tds-block ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("slot", null)));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsBlock.style = blockCss;
+
+exports.tds_block = TdsBlock;

package/dist/cjs/tds-body-cell_2.cjs.entry.js

@@ -0,0 +1,173 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+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$1 = [
+  'verticalDividers',
+  'compactDesign',
+  'noMinWidth',
+];
+const TdsTableBodyCell = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    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$1.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;
+    }
+  }
+  // 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;
+  }
+  componentWillLoad() {
+    relevantTableProps$1.forEach((tablePropName) => {
+      this[tablePropName] = this.tableEl[tablePropName];
+    });
+  }
+  render() {
+    return (index.h(index.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, index.h("slot", null)));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsTableBodyCell.style = tableBodyCellCss;
+
+const tableBodyRowCss = ":host(.tds-table__row){box-sizing:border-box;display:table-row;border-bottom:1px solid var(--tds-table-divider);background-color:var(--tds-table-body-row-background);transition:background-color 200ms ease;color:var(--tds-table-color)}:host(.tds-table__row) *{box-sizing:border-box}:host(.tds-table__row) .tds-table__body-cell--checkbox{min-width:48px;width:48px;padding:0}:host(.tds-table__row:hover){background-color:var(--tds-table-body-row-background-hover)}:host(.tds-table__row--selected){background-color:var(--tds-table-body-row-background-active)}:host(.tds-table__row--selected:hover){background-color:var(--tds-table-body-row-background-active-hover)}:host(.tds-table__row--hidden){display:none}:host(.tds-table__row--expended){width:100%;background-color:pink}:host .tds-form-label--table{width:100%;height:48px;display:flex;justify-content:center;align-items:center;cursor:pointer}:host(.tds-table__compact) .tds-form-label--table{height:32px}:host(.tds-table--divider) .tds-table__body-cell--checkbox{border-right:1px solid var(--tds-table-divider)}";
+
+const relevantTableProps = [
+  'enableMultiselect',
+  'verticalDividers',
+  'compactDesign',
+  'modeVariant',
+];
+const TdsTableBodyRow = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.internalTdsRowChange = index.createEvent(this, "internalTdsRowChange", 6);
+    this.internalTdsPagination = index.createEvent(this, "internalTdsPagination", 6);
+    this.enableMultiselect = false;
+    this.bodyCheckBoxStatus = false;
+    this.mainCheckBoxStatus = false;
+    this.verticalDividers = false;
+    this.compactDesign = false;
+    this.noMinWidth = false;
+    this.modeVariant = null;
+    this.tableId = '';
+  }
+  bodyCheckBoxClicked(event) {
+    const row = this.host;
+    this.bodyCheckBoxStatus = event.currentTarget.checked;
+    if (this.bodyCheckBoxStatus === true) {
+      row.classList.add('tds-table__row--selected');
+    }
+    else {
+      row.classList.remove('tds-table__row--selected');
+    }
+    this.internalTdsRowChange.emit(this.bodyCheckBoxStatus);
+  }
+  bodyCheckBoxStatusUpdater(status) {
+    this.mainCheckBoxStatus = status;
+    this.bodyCheckBoxStatus = this.mainCheckBoxStatus;
+    const row = this.host;
+    if (this.bodyCheckBoxStatus === true) {
+      row.classList.add('tds-table__row--selected');
+    }
+    else {
+      row.classList.remove('tds-table__row--selected');
+    }
+    this.internalTdsRowChange.emit(this.bodyCheckBoxStatus);
+  }
+  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];
+      });
+    }
+  }
+  headCheckboxListener(event) {
+    if (this.tableId === event.detail[0]) {
+      this.bodyCheckBoxStatusUpdater(event.detail[1]);
+    }
+  }
+  internalTdsCheckboxChangeListener(event) {
+    const [receivedID, receivedBodyCheckboxStatus] = event.detail;
+    if (this.tableId === receivedID) {
+      this.bodyCheckBoxStatusUpdater(receivedBodyCheckboxStatus);
+    }
+  }
+  connectedCallback() {
+    this.tableEl = this.host.closest('tds-table');
+    this.tableId = this.tableEl.tableId;
+  }
+  componentWillLoad() {
+    relevantTableProps.forEach((tablePropName) => {
+      this[tablePropName] = this.tableEl[tablePropName];
+    });
+  }
+  componentDidLoad() {
+    this.internalTdsPagination.emit(this.tableId);
+  }
+  render() {
+    return (index.h(index.Host, { class: {
+        'tds-table__row': true,
+        'tds-table__compact': this.compactDesign,
+        'tds-table--divider': this.verticalDividers,
+        'tds-mode-variant-primary': this.modeVariant === 'primary',
+        'tds-mode-variant-secondary': this.modeVariant === 'secondary',
+      } }, this.enableMultiselect && (index.h("td", { class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, index.h("tds-checkbox", { onTdsChange: (event) => this.bodyCheckBoxClicked(event), checked: this.bodyCheckBoxStatus }))), index.h("slot", null)));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsTableBodyRow.style = tableBodyRowCss;
+
+exports.tds_body_cell = TdsTableBodyCell;
+exports.tds_table_body_row = TdsTableBodyRow;

package/dist/cjs/tds-breadcrumb.cjs.entry.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+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]:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}[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] ::slotted(*)::after{content:\"›\";color:var(--tds-breadcrumb-separator-color);margin-right:4px;margin-left:4px;display:inline-block;width:4px;height:8px}:host(:last-of-type) ::slotted(*)::after{display:none}";
+
+const TdsBreadcrumb = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.current = false;
+  }
+  render() {
+    return (index.h("div", { role: "listitem", class: `${this.current ? 'current' : ''}` }, index.h("slot", null)));
+  }
+};
+TdsBreadcrumb.style = breadcrumbCss;
+
+exports.tds_breadcrumb = TdsBreadcrumb;

package/dist/cjs/tds-breadcrumbs.cjs.entry.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+
+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 = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+  }
+  render() {
+    return (index.h("nav", null, index.h("div", { role: "list", class: 'tds-breadcrumb' }, index.h("slot", null))));
+  }
+  get el() { return index.getElement(this); }
+};
+TdsBreadcrumbs.style = breadcrumbsCss;
+
+exports.tds_breadcrumbs = TdsBreadcrumbs;

package/dist/cjs/tds-button.cjs.entry.js

@@ -0,0 +1,41 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+const utils = require('./utils-41de5fb2.js');
+
+const buttonCss = ":root,.tds-mode-light{--tds-btn-primary-background:var(--tds-blue-600);--tds-btn-primary-color:var(--tds-white);--tds-btn-primary-border-color:transparent;--tds-btn-primary-background-hover:var(--tds-blue-500);--tds-btn-primary-color-hover:var(--tds-white);--tds-btn-primary-border-color-hover:transparent;--tds-btn-primary-background-active:var(--tds-blue-700);--tds-btn-primary-color-active:var(--tds-white);--tds-btn-primary-border-color-active:var(--tds-blue-700);--tds-btn-primary-background-focus:var(--tds-blue-400);--tds-btn-primary-color-focus:var(--tds-white);--tds-btn-primary-border-color-focus:var(--tds-blue-600);--tds-btn-primary-outline-color-focus:var(--tds-blue-600);--tds-btn-primary-background-disabled-primary:var(--tds-grey-50);--tds-btn-primary-background-disabled-secondary:var(--tds-white);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary);--tds-btn-primary-color-disabled:var(--tds-grey-400);--tds-btn-primary-border-color-disabled:transparent;--tds-btn-icon-primary-fill:var(--tds-grey-50);--tds-btn-icon-primary-color:var(--tds-grey-50);--tds-btn-secondary-background:transparent;--tds-btn-secondary-color:var(--tds-black);--tds-btn-secondary-border-color:rgb(0 0 0 / 48%);--tds-btn-secondary-background-hover:var(--tds-blue-500);--tds-btn-secondary-color-hover:var(--tds-white);--tds-btn-secondary-border-color-hover:var(--tds-blue-500);--tds-btn-secondary-background-active:transparent;--tds-btn-secondary-color-active:var(--tds-black);--tds-btn-secondary-border-color-active:rgb(0 0 0 / 87%);--tds-btn-secondary-background-focus:transparent;--tds-btn-secondary-color-focus:var(--tds-black);--tds-btn-secondary-border-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color:rgb(0 0 0 / 38%);--tds-btn-secondary-outline-color-focus:var(--tds-blue-400);--tds-btn-secondary-background-disabled:transparent;--tds-btn-secondary-color-disabled:rgb(0 0 0 / 38%);--tds-btn-secondary-border-color-disabled:rgb(0 0 0 / 38%);--tds-btn-icon-secondary-color-focus:var(--tds-black);--tds-btn-icon-secondary-fill-focus:var(--tds-black);--tds-btn-icon-secondary-fill:var(--tds-black);--tds-btn-icon-secondary-color:var(--tds-black);--tds-btn-icon-secondary-fill-hover:var(--tds-grey-50);--tds-btn-icon-secondary-color-hover:var(--tds-grey-50);--tds-btn-ghost-background:transparent;--tds-btn-ghost-color:var(--tds-black);--tds-btn-ghost-border-color:transparent;--tds-btn-ghost-background-hover:transparent;--tds-btn-ghost-color-hover:var(--tds-black);--tds-btn-ghost-border-color-hover:rgb(0 0 0 / 60%);--tds-btn-ghost-outline-color-hover:rgb(0 0 0 / 60%);--tds-btn-ghost-background-active:transparent;--tds-btn-ghost-color-active:var(--tds-black);--tds-btn-ghost-border-color-active:rgb(0 0 0 / 87%);--tds-btn-ghost-background-focus:transparent;--tds-btn-ghost-color-focus:var(--tds-black);--tds-btn-ghost-border-color-focus:var(--tds-blue-300);--tds-btn-ghost-outline-color-focus:var(--tds-blue-300);--tds-btn-ghost-background-disabled:transparent;--tds-btn-ghost-color-disabled:rgb(0 0 0 / 38%);--tds-btn-ghost-border-color-disabled:transparent;--tds-btn-icon-ghost-fill:var(--tds-black);--tds-btn-icon-ghost-color:var(--tds-black);--tds-btn-danger-background:var(--tds-negative);--tds-btn-danger-color:var(--tds-white);--tds-btn-danger-border-color:transparent;--tds-btn-danger-background-hover:var(--tds-red-600);--tds-btn-danger-color-hover:var(--tds-white);--tds-btn-danger-border-color-hover:transparent;--tds-btn-danger-background-active:var(--tds-red-700);--tds-btn-danger-color-active:var(--tds-white);--tds-btn-danger-border-color-active:var(--tds-red-700);--tds-btn-danger-background-focus:var(--tds-red-400);--tds-btn-danger-color-focus:var(--tds-white);--tds-btn-danger-border-color-focus:var(--tds-red-400);--tds-btn-danger-outline-color-focus:var(--tds-red-700);--tds-btn-danger-background-disabled-primary:var(--tds-grey-50);--tds-btn-danger-background-disabled-secondary:var(--tds-white);--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-danger-color-disabled:rgb(0 0 0 / 38%);--tds-btn-danger-border-color-disabled:transparent;--tds-btn-icon-danger-fill:var(--tds-white);--tds-btn-icon-danger-color:var(--tds-white)}:root .tds-mode-variant-primary,.tds-mode-light .tds-mode-variant-primary{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary)}:root .tds-mode-variant-secondary,.tds-mode-light .tds-mode-variant-secondary{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-secondary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-secondary)}.tds-mode-dark{--tds-btn-primary-background:var(--tds-blue-400);--tds-btn-primary-background-hover:var(--tds-blue-500);--tds-btn-primary-background-active:var(--tds-blue-300);--tds-btn-primary-background-focus:var(--tds-blue-600);--tds-btn-primary-border-color-focus:var(--tds-blue-400);--tds-btn-primary-outline-color-focus:var(--tds-blue-400);--tds-btn-primary-background-disabled-primary:var(--tds-grey-900);--tds-btn-primary-background-disabled-secondary:var(--tds-grey-868);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary);--tds-btn-primary-color-disabled:var(--tds-grey-600);--tds-btn-icon-primary-fill:var(--tds-grey-50);--tds-btn-icon-primary-color:var(--tds-grey-50);--tds-btn-secondary-background:transparent;--tds-btn-secondary-color:var(--tds-white);--tds-btn-secondary-border-color:var(--tds-white);--tds-btn-secondary-background-hover:var(--tds-blue-500);--tds-btn-secondary-color-hover:var(--tds-white);--tds-btn-secondary-border-color-hover:var(--tds-blue-500);--tds-btn-secondary-background-active:transparent;--tds-btn-secondary-color-active:var(--tds-white);--tds-btn-secondary-border-color-active:var(--tds-white);--tds-btn-secondary-background-focus:transparent;--tds-btn-secondary-color-focus:var(--tds-white);--tds-btn-secondary-border-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color:var(--tds-white);--tds-btn-secondary-background-disabled:transparent;--tds-btn-secondary-color-disabled:rgb(255 255 255 / 38%);--tds-btn-secondary-border-color-disabled:rgb(255 255 255 / 38%);--tds-btn-icon-secondary-color-focus:var(--tds-white);--tds-btn-icon-secondary-fill-focus:var(--tds-white);--tds-btn-icon-secondary-fill:var(--tds-grey-50);--tds-btn-icon-secondary-color:var(--tds-grey-50);--tds-btn-ghost-background:transparent;--tds-btn-ghost-color:var(--tds-white);--tds-btn-ghost-border-color:transparent;--tds-btn-ghost-background-hover:transparent;--tds-btn-ghost-color-hover:var(--tds-white);--tds-btn-ghost-border-color-hover:rgb(255 255 255 / 41%);--tds-btn-ghost-outline-color-hover:rgb(255 255 255 / 41%);--tds-btn-ghost-background-active:transparent;--tds-btn-ghost-color-active:var(--tds-white);--tds-btn-ghost-border-color-active:rgb(255 255 255 / 87%);--tds-btn-ghost-background-focus:transparent;--tds-btn-ghost-color-focus:var(--tds-white);--tds-btn-ghost-border-color-focus:var(--tds-blue-300);--tds-btn-ghost-outline-color-focus:var(--tds-blue-300);--tds-btn-ghost-background-disabled:transparent;--tds-btn-ghost-color-disabled:rgb(255 255 255/ 38%);--tds-btn-ghost-border-color-disabled:transparent;--tds-btn-icon-ghost-fill:var(--tds-grey-50);--tds-btn-icon-ghost-color:var(--tds-grey-50);--tds-btn-danger-background:var(--tds-negative);--tds-btn-danger-color:var(--tds-white);--tds-btn-danger-border-color:transparent;--tds-btn-danger-background-hover:var(--tds-red-600);--tds-btn-danger-color-hover:var(--tds-white);--tds-btn-danger-border-color-hover:transparent;--tds-btn-danger-background-active:var(--tds-red-700);--tds-btn-danger-color-active:var(--tds-white);--tds-btn-danger-border-color-active:transparent;--tds-btn-danger-background-focus:var(--tds-red-400);--tds-btn-danger-color-focus:var(--tds-white);--tds-btn-danger-border-color-focus:var(--tds-red-400);--tds-btn-danger-outline-color-focus:var(--tds-red-700);--tds-btn-danger-background-disabled-primary:var(--tds-grey-900);--tds-btn-danger-background-disabled-secondary:var(--tds-grey-868);--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-danger-color-disabled:rgb(255 255 255 / 38%);--tds-btn-danger-border-color-disabled:transparent;--tds-btn-icon-danger-fill:var(--tds-white);--tds-btn-icon-danger-color:var(--tds-white)}.tds-mode-dark .tds-mode-variant-primary{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary)}.tds-mode-dark .tds-mode-variant-secondary{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-secondary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-secondary)}button{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:inline-flex;align-items:center;border-radius:4px;border:none;box-shadow:none;position:relative;text-decoration:none;cursor:pointer;height:56px;padding:var(--tds-spacing-element-20);border:1px solid}button *{box-sizing:border-box}button:disabled,button.disabled{cursor:unset}button:focus{outline:none}button:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.xs{padding:var(--tds-spacing-element-4) var(--tds-spacing-element-8);height:24px;font-size:12px;border-radius:2px}button.xs:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.sm{padding:var(--tds-spacing-element-12);height:40px}button.sm.icon{padding:10px var(--tds-spacing-element-12)}button.sm.only-icon{padding:11px}button.sm:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.md{padding:var(--tds-spacing-element-16);height:48px}button.md.icon{padding:14px var(--tds-spacing-element-16)}button.md.only-icon{padding:13px}button.md:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.lg{padding:var(--tds-spacing-element-20);height:56px}button.lg.icon{padding:18px var(--tds-spacing-element-20)}button.lg.only-icon{padding:17px}button.lg:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.fullbleed{width:inherit;display:flex;justify-content:center}button.primary{background:var(--tds-btn-primary-background);border-color:var(--tds-btn-primary-border-color);color:var(--tds-btn-primary-color);outline-color:var(--tds-btn-primary-outline-color)}button.primary .icon{fill:var(--tds-btn-icon-primary-fill);color:var(--tds-btn-icon-primary-fill);fill:var(--tds-btn-icon-primary-color);color:var(--tds-btn-icon-primary-color);font-size:16px}button.primary:hover{background:var(--tds-btn-primary-background-hover);border-color:var(--tds-btn-primary-border-color-hover);color:var(--tds-btn-primary-color-hover);outline-color:var(--tds-btn-primary-outline-color-hover)}button.primary:hover:not(.disabled) ::slotted([slot=icon]){fill:var(--tds-btn-icon-primary-fill-hover);color:var(--tds-btn-icon-primary-fill-hover);fill:var(--tds-btn-icon-primary-color-hover);color:var(--tds-btn-icon-primary-color-hover)}button.primary:focus-visible{background:var(--tds-btn-primary-background-focus);border-color:var(--tds-btn-primary-border-color-focus);color:var(--tds-btn-primary-color-focus);outline-color:var(--tds-btn-primary-outline-color-focus)}button.primary:focus-visible ::slotted([slot=icon]){fill:var(--tds-btn-icon-primary-fill-focus);color:var(--tds-btn-icon-primary-fill-focus);fill:var(--tds-btn-icon-primary-color-focus);color:var(--tds-btn-icon-primary-color-focus)}button.primary:active,button.primary.active{background:var(--tds-btn-primary-background-active);border-color:var(--tds-btn-primary-border-color-active);color:var(--tds-btn-primary-color-active);outline-color:var(--tds-btn-primary-outline-color-active)}button.primary.disabled,button.primary:disabled{cursor:not-allowed;background:var(--tds-btn-primary-background-disabled);cursor:not-allowed;border-color:var(--tds-btn-primary-border-color-disabled);cursor:not-allowed;color:var(--tds-btn-primary-color-disabled);cursor:not-allowed;outline-color:var(--tds-btn-primary-outline-color-disabled)}button.secondary{background:var(--tds-btn-secondary-background);border-color:var(--tds-btn-secondary-border-color);color:var(--tds-btn-secondary-color);outline-color:var(--tds-btn-secondary-outline-color)}button.secondary .icon{fill:var(--tds-btn-icon-secondary-fill);color:var(--tds-btn-icon-secondary-fill);fill:var(--tds-btn-icon-secondary-color);color:var(--tds-btn-icon-secondary-color);font-size:16px}button.secondary:hover{background:var(--tds-btn-secondary-background-hover);border-color:var(--tds-btn-secondary-border-color-hover);color:var(--tds-btn-secondary-color-hover);outline-color:var(--tds-btn-secondary-outline-color-hover)}button.secondary:hover:not(.disabled) ::slotted([slot=icon]){fill:var(--tds-btn-icon-secondary-fill-hover);color:var(--tds-btn-icon-secondary-fill-hover);fill:var(--tds-btn-icon-secondary-color-hover);color:var(--tds-btn-icon-secondary-color-hover)}button.secondary:focus-visible{background:var(--tds-btn-secondary-background-focus);border-color:var(--tds-btn-secondary-border-color-focus);color:var(--tds-btn-secondary-color-focus);outline-color:var(--tds-btn-secondary-outline-color-focus)}button.secondary:focus-visible ::slotted([slot=icon]){fill:var(--tds-btn-icon-secondary-fill-focus);color:var(--tds-btn-icon-secondary-fill-focus);fill:var(--tds-btn-icon-secondary-color-focus);color:var(--tds-btn-icon-secondary-color-focus)}button.secondary:active,button.secondary.active{background:var(--tds-btn-secondary-background-active);border-color:var(--tds-btn-secondary-border-color-active);color:var(--tds-btn-secondary-color-active);outline-color:var(--tds-btn-secondary-outline-color-active)}button.secondary.disabled,button.secondary:disabled{cursor:not-allowed;background:var(--tds-btn-secondary-background-disabled);cursor:not-allowed;border-color:var(--tds-btn-secondary-border-color-disabled);cursor:not-allowed;color:var(--tds-btn-secondary-color-disabled);cursor:not-allowed;outline-color:var(--tds-btn-secondary-outline-color-disabled)}button.ghost{background:var(--tds-btn-ghost-background);border-color:var(--tds-btn-ghost-border-color);color:var(--tds-btn-ghost-color);outline-color:var(--tds-btn-ghost-outline-color)}button.ghost .icon{fill:var(--tds-btn-icon-ghost-fill);color:var(--tds-btn-icon-ghost-fill);fill:var(--tds-btn-icon-ghost-color);color:var(--tds-btn-icon-ghost-color);font-size:16px}button.ghost:hover{background:var(--tds-btn-ghost-background-hover);border-color:var(--tds-btn-ghost-border-color-hover);color:var(--tds-btn-ghost-color-hover);outline-color:var(--tds-btn-ghost-outline-color-hover)}button.ghost:hover:not(.disabled) ::slotted([slot=icon]){fill:var(--tds-btn-icon-ghost-fill-hover);color:var(--tds-btn-icon-ghost-fill-hover);fill:var(--tds-btn-icon-ghost-color-hover);color:var(--tds-btn-icon-ghost-color-hover)}button.ghost:focus-visible{background:var(--tds-btn-ghost-background-focus);border-color:var(--tds-btn-ghost-border-color-focus);color:var(--tds-btn-ghost-color-focus);outline-color:var(--tds-btn-ghost-outline-color-focus)}button.ghost:focus-visible ::slotted([slot=icon]){fill:var(--tds-btn-icon-ghost-fill-focus);color:var(--tds-btn-icon-ghost-fill-focus);fill:var(--tds-btn-icon-ghost-color-focus);color:var(--tds-btn-icon-ghost-color-focus)}button.ghost:active,button.ghost.active{background:var(--tds-btn-ghost-background-active);border-color:var(--tds-btn-ghost-border-color-active);color:var(--tds-btn-ghost-color-active);outline-color:var(--tds-btn-ghost-outline-color-active)}button.ghost.disabled,button.ghost:disabled{cursor:not-allowed;background:var(--tds-btn-ghost-background-disabled);cursor:not-allowed;border-color:var(--tds-btn-ghost-border-color-disabled);cursor:not-allowed;color:var(--tds-btn-ghost-color-disabled);cursor:not-allowed;outline-color:var(--tds-btn-ghost-outline-color-disabled)}button.danger{background:var(--tds-btn-danger-background);border-color:var(--tds-btn-danger-border-color);color:var(--tds-btn-danger-color);outline-color:var(--tds-btn-danger-outline-color)}button.danger .icon{fill:var(--tds-btn-icon-danger-fill);color:var(--tds-btn-icon-danger-fill);fill:var(--tds-btn-icon-danger-color);color:var(--tds-btn-icon-danger-color);font-size:16px}button.danger:hover{background:var(--tds-btn-danger-background-hover);border-color:var(--tds-btn-danger-border-color-hover);color:var(--tds-btn-danger-color-hover);outline-color:var(--tds-btn-danger-outline-color-hover)}button.danger:hover:not(.disabled) ::slotted([slot=icon]){fill:var(--tds-btn-icon-danger-fill-hover);color:var(--tds-btn-icon-danger-fill-hover);fill:var(--tds-btn-icon-danger-color-hover);color:var(--tds-btn-icon-danger-color-hover)}button.danger:focus-visible{background:var(--tds-btn-danger-background-focus);border-color:var(--tds-btn-danger-border-color-focus);color:var(--tds-btn-danger-color-focus);outline-color:var(--tds-btn-danger-outline-color-focus)}button.danger:focus-visible ::slotted([slot=icon]){fill:var(--tds-btn-icon-danger-fill-focus);color:var(--tds-btn-icon-danger-fill-focus);fill:var(--tds-btn-icon-danger-color-focus);color:var(--tds-btn-icon-danger-color-focus)}button.danger:active,button.danger.active{background:var(--tds-btn-danger-background-active);border-color:var(--tds-btn-danger-border-color-active);color:var(--tds-btn-danger-color-active);outline-color:var(--tds-btn-danger-outline-color-active)}button.danger.disabled,button.danger:disabled{cursor:not-allowed;background:var(--tds-btn-danger-background-disabled);cursor:not-allowed;border-color:var(--tds-btn-danger-border-color-disabled);cursor:not-allowed;color:var(--tds-btn-danger-color-disabled);cursor:not-allowed;outline-color:var(--tds-btn-danger-outline-color-disabled)}:host(tds-button){display:inline-flex;align-items:center}:host(tds-button) ::slotted([slot=icon]){width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}:host(tds-button) .sm ::slotted([slot=icon]){width:var(--tds-spacing-element-16);height:var(--tds-spacing-element-16)}:host(tds-button[disabled]){pointer-events:none}:host(tds-button[disabled]) ::slotted([slot=icon]){pointer-events:none}:host(tds-button[fullbleed]){width:100%;justify-content:center}:host(tds-button[only-icon]) .sm{padding:11px}:host(tds-button[only-icon]) .md{padding:13px}:host(tds-button[only-icon]) .lg{padding:17px}:host(tds-button:not([only-icon])){display:inline-flex;align-items:center}:host(tds-button:not([only-icon])) .sm ::slotted([slot=icon]){margin-left:var(--tds-spacing-element-12);width:var(--tds-spacing-element-16);height:var(--tds-spacing-element-16)}:host(tds-button:not([only-icon])) .md ::slotted([slot=icon]){margin-left:var(--tds-spacing-element-16);width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}:host(tds-button:not([only-icon])) .lg ::slotted([slot=icon]){margin-left:var(--tds-spacing-element-20);width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}";
+
+const TdsButton = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.text = undefined;
+    this.type = 'primary';
+    this.size = 'lg';
+    this.disabled = false;
+    this.fullbleed = false;
+    this.modeVariant = null;
+    this.onlyIcon = false;
+  }
+  connectedCallback() {
+    if (!this.text) {
+      this.onlyIcon = true;
+      this.host.setAttribute('only-icon', '');
+    }
+  }
+  render() {
+    const usesIconSlot = utils.hasSlot('icon', this.host);
+    return (index.h(index.Host, { class: `${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("button", { disabled: this.disabled, class: `${this.type}
+            ${this.size}
+            ${this.disabled ? 'disabled' : ''}
+            ${this.fullbleed ? 'fullbleed' : ''}
+            ${usesIconSlot ? 'icon' : ''}
+            ${this.onlyIcon ? 'only-icon' : ''}
+            ` }, this.text, index.h("slot", { name: "icon" }))));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsButton.style = buttonCss;
+
+exports.tds_button = TdsButton;

package/dist/cjs/tds-card.cjs.entry.js

@@ -0,0 +1,52 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+const utils = require('./utils-41de5fb2.js');
+
+const cardCss = ".card{box-sizing:border-box;box-shadow:var(--tds-card-box);background-color:var(--tds-card-background);display:block;border-radius:4px;overflow:hidden}.card *{box-sizing:border-box}.card.clickable:hover{box-shadow:var(--tds-card-box-hover);cursor:pointer}.card .card-header{font:var(--tds-headline-06);letter-spacing:var(--tds-headline-06-ls);padding:16px;display:flex;align-items:center}.card .card-header slot[name=thumbnail]::slotted(*){width:36px;height:36px;border-radius:100%;margin-right:16px}.card .card-header .card-top-header{padding-left:16px;display:flex;flex-direction:column}.card .card-header .card-top-header.no-header-img{padding-left:0}.card .card-header.below{padding-top:16px}.card .header-subheader{display:flex;flex-direction:column;gap:4px}.card .header-subheader .header,.card .header-subheader slot[name=header]{color:var(--tds-card-headline)}.card .header-subheader .subheader,.card .header-subheader slot[name=subheader]{color:var(--tds-card-sub-headline)}.card .tds-divider{margin:16px 16px 0;background-color:var(--tds-card-divider);height:1px}.card .card-body{display:block;word-wrap:break-word}.card slot[name=body]::slotted(*){font:var(--tds-detail-03);letter-spacing:var(--tds-detail-03-ls);color:var(--tds-card-body-color);padding:0 16px;margin-bottom:16px;margin-top:16px;max-width:336px}.card slot[name=bottom]::slotted(*){display:flex;padding:16px;color:var(--tds-card-icon-color)}button{border:none;text-align:left;padding:0}button:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button:active{box-shadow:var(--tds-card-box-pressed)}";
+
+const TdsCard = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.tdsClick = index.createEvent(this, "tdsClick", 6);
+    this.handleClick = () => {
+      this.tdsClick.emit({
+        cardId: this.cardId,
+      });
+    };
+    this.getCardHeader = () => {
+      const usesHeaderSlot = utils.hasSlot('header', this.host);
+      const usesSubheaderSlot = utils.hasSlot('subheader', this.host);
+      const usesThumbnailSlot = utils.hasSlot('thumbnail', this.host);
+      return (index.h("div", { class: "card-header" }, usesThumbnailSlot && index.h("slot", { name: "thumbnail" }), index.h("div", { class: "header-subheader" }, this.header && index.h("span", { class: "header" }, this.header), usesHeaderSlot && index.h("slot", { name: "header" }), this.subheader && index.h("span", { class: "subheader" }, this.subheader), usesSubheaderSlot && index.h("slot", { name: "subheader" }))));
+    };
+    this.getCardContent = () => {
+      const usesBodySlot = utils.hasSlot('body', this.host);
+      const usesBodyImageSlot = utils.hasSlot('body-image', this.host);
+      const usesBottomSlot = utils.hasSlot('bottom', this.host);
+      return (index.h("div", null, this.imagePlacement === 'below-header' && this.getCardHeader(), index.h("div", { class: `card-body` }, usesBodyImageSlot && index.h("slot", { name: "body-image" }), this.bodyImg && index.h("img", { class: `card-body-img`, src: this.bodyImg, alt: this.bodyImgAlt }), this.imagePlacement === 'above-header' && this.getCardHeader(), this.bodyDivider && index.h("tds-divider", null), usesBodySlot && index.h("slot", { name: "body" })), usesBottomSlot && index.h("slot", { name: `bottom` })));
+    };
+    this.modeVariant = null;
+    this.imagePlacement = 'below-header';
+    this.header = undefined;
+    this.subheader = undefined;
+    this.bodyImg = undefined;
+    this.bodyImgAlt = undefined;
+    this.bodyDivider = false;
+    this.clickable = false;
+    this.cardId = utils.generateUniqueId();
+  }
+  render() {
+    return (index.h(index.Host, { class: this.modeVariant && `tds-mode-variant-${this.modeVariant}` }, this.clickable ? (index.h("button", { class: `card ${this.clickable ? 'clickable' : ''} ${this.imagePlacement}`, onClick: () => {
+        if (this.clickable) {
+          this.handleClick();
+        }
+      } }, this.getCardContent())) : (index.h("div", { class: `card ${this.clickable ? 'clickable' : ''} ${this.imagePlacement}` }, this.getCardContent()))));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsCard.style = cardCss;
+
+exports.tds_card = TdsCard;

package/dist/cjs/tds-checkbox.cjs.entry.js

@@ -0,0 +1,56 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ee36ffa1.js');
+const utils = require('./utils-41de5fb2.js');
+
+const checkboxCss = ".tds-checkbox.sc-tds-checkbox{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-checkbox-text);display:flex;align-items:center;margin-left:-4px}.tds-checkbox.sc-tds-checkbox *.sc-tds-checkbox{box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox{appearance:none;outline:none;margin:0;border:0;border-radius:2px;width:24px;height:24px;position:relative;cursor:pointer;flex-shrink:0;align-self:flex-start}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-checkbox-color);padding-left:var(--tds-spacing-element-4);padding-top:var(--tds-spacing-element-4);padding-bottom:var(--tds-spacing-element-4);cursor:pointer;display:flex;align-items:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{content:\"\";position:absolute;box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before{width:24px;height:24px;left:0;top:0;border-radius:4px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{border:1px solid var(--tds-checkbox-interaction-01);background-color:var(--tds-checkbox-interaction-02);width:16px;height:16px;left:4px;top:4px;border-radius:2px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:focus::before{background-color:var(--tds-checkbox-background-focus);opacity:var(--tds-checkbox-background-opacity-focus);transition:opacity 0.2s ease-in-out}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox{cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox::after{border-color:var(--tds-checkbox-border-color-disabled-after)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled+label.sc-tds-checkbox,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-grey-600);cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox:hover::before{display:none}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked::after{background-image:var(--tds-checkbox-background-img);background-color:var(--tds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::after{background-image:var(--tds-checkbox-background-img-disabled);background-color:var(--tds-checkbox-interaction-02);color:var(--tds-checkbox-color-disabled-after)}";
+
+const TdsCheckbox = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.tdsChange = index.createEvent(this, "tdsChange", 6);
+    this.tdsFocus = index.createEvent(this, "tdsFocus", 6);
+    this.tdsBlur = index.createEvent(this, "tdsBlur", 6);
+    this.handleChange = () => {
+      this.checked = !this.checked;
+      this.tdsChange.emit({
+        checkboxId: this.checkboxId,
+        checked: this.checked,
+        value: this.value,
+      });
+    };
+    this.name = undefined;
+    this.checkboxId = utils.generateUniqueId();
+    this.disabled = false;
+    this.required = false;
+    this.checked = false;
+    this.value = undefined;
+  }
+  /** Toggles the checked value of the component. */
+  async toggleCheckbox() {
+    this.checked = !this.checked;
+    return {
+      checkboxId: this.checkboxId,
+      checked: this.checked,
+    };
+  }
+  /** Set the input as focus when clicking the component */
+  handleFocus(event) {
+    this.tdsFocus.emit(event);
+  }
+  /** Set the input as blur when clicking outside the component */
+  handleBlur(event) {
+    this.tdsBlur.emit(event);
+  }
+  render() {
+    return (index.h("div", { class: "tds-checkbox" }, index.h("input", { "aria-checked": this.checked, "aria-required": this.required, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
+        this.handleChange();
+      } }), index.h("label", { htmlFor: this.checkboxId }, index.h("slot", { name: "label" }))));
+  }
+  get host() { return index.getElement(this); }
+};
+TdsCheckbox.style = checkboxCss;
+
+exports.tds_checkbox = TdsCheckbox;