@scania/tegel 1.3.3 → 1.5.0

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

@@ -2,74 +2,74 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-705dca7c.js');
-const generateUniqueId = require('./generateUniqueId-56da4810.js');
+const index = require('./index-ae4fbf97.js');
+const generateUniqueId = require('./generateUniqueId-e3fc9863.js');
 const hasSlot = require('./hasSlot-1c90e9ba.js');
 
 const chipCss = ".sc-tds-chip-s>*{display:inline-flex;align-items:center}.sc-tds-chip-h.sc-tds-chip-s>[slot=label],.sc-tds-chip-h .sc-tds-chip-s>[slot=label]{padding-top:2px}.component.sc-tds-chip .tds-chip-component.sc-tds-chip{display:inline-flex}.component.sc-tds-chip .tds-chip-component.sc-tds-chip label.sc-tds-chip{background-color:var(--tds-chips-background);color:var(--tds-chips-color);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:inline-flex;align-items:center;border-radius:16px;cursor:pointer;white-space:nowrap}.component.sc-tds-chip .tds-chip-component.sc-tds-chip label.sc-tds-chip:hover{background-color:var(--tds-chips-background-hover)}.component.sc-tds-chip .tds-chip-component.lg.sc-tds-chip label.sc-tds-chip{height:32px;padding:0 16px;gap:8px}.component.sc-tds-chip .tds-chip-component.sm.sc-tds-chip label.sc-tds-chip{height:24px;padding:0 12px;gap:6px}.component.sc-tds-chip .tds-chip-component.sm.prefix.sc-tds-chip label.sc-tds-chip{padding:0 12px 0 6px}.component.sc-tds-chip .tds-chip-component.sm.suffix.sc-tds-chip label.sc-tds-chip{padding:0 6px 0 12px}.component.sc-tds-chip .tds-chip-component.lg.prefix.sc-tds-chip label.sc-tds-chip{padding:0 16px 0 8px}.component.sc-tds-chip .tds-chip-component.lg.suffix.sc-tds-chip label.sc-tds-chip{padding:0 8px 0 16px}.component.sc-tds-chip .tds-chip-component.lg.prefix.suffix.sc-tds-chip label.sc-tds-chip{padding:0 8px}.component.sc-tds-chip .tds-chip-component.sm.prefix.suffix.sc-tds-chip label.sc-tds-chip{padding:0 6px}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip{opacity:0;position:absolute;z-index:-1}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip:focus-visible+label.sc-tds-chip{outline:2px solid var(--tds-blue-400);outline-offset:-2px;background-color:var(--tds-chips-background-focus)}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip:checked+label.sc-tds-chip{background-color:var(--tds-chips-background-active);color:var(--tds-chips-color-active)}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip:checked+label.sc-tds-chip:hover{background-color:var(--tds-chips-background-active-hover)}";
 
 const TdsChip = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.tdsChange = index.createEvent(this, "tdsChange", 6);
-    this.tdsClick = index.createEvent(this, "tdsClick", 6);
-    this.handleChange = () => {
-      if (this.type === 'checkbox') {
-        // Toggle the prop on click
-        this.checked = !this.checked;
-      }
-      else if (this.type === 'radio') {
-        // Always set it to true to enforce visual update for selected state
-        this.checked = true;
-      }
-      else {
-        console.error('Unsupported type in Chip component!');
-      }
-      this.tdsChange.emit({
-        chipId: this.chipId,
-        checked: this.checked,
-        value: this.value,
-      });
-    };
-    this.handleClick = () => {
-      this.tdsClick.emit({
-        chipId: this.chipId,
-      });
-    };
-    this.type = 'button';
-    this.size = 'lg';
-    this.chipId = generateUniqueId.generateUniqueId();
-    this.checked = false;
-    this.name = undefined;
-    this.value = undefined;
-  }
-  renderInputAttributes() {
-    if (this.type !== 'button') {
-      return {
-        value: this.value,
-        checked: this.checked,
-        name: this.name,
-        onChange: () => this.handleChange(),
-      };
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.tdsChange = index.createEvent(this, "tdsChange", 6);
+        this.tdsClick = index.createEvent(this, "tdsClick", 6);
+        this.handleChange = () => {
+            if (this.type === 'checkbox') {
+                // Toggle the prop on click
+                this.checked = !this.checked;
+            }
+            else if (this.type === 'radio') {
+                // Always set it to true to enforce visual update for selected state
+                this.checked = true;
+            }
+            else {
+                console.error('Unsupported type in Chip component!');
+            }
+            this.tdsChange.emit({
+                chipId: this.chipId,
+                checked: this.checked,
+                value: this.value,
+            });
+        };
+        this.handleClick = () => {
+            this.tdsClick.emit({
+                chipId: this.chipId,
+            });
+        };
+        this.type = 'button';
+        this.size = 'lg';
+        this.chipId = generateUniqueId.generateUniqueId();
+        this.checked = false;
+        this.name = undefined;
+        this.value = undefined;
     }
-    return {
-      onClick: () => this.handleClick(),
-    };
-  }
-  render() {
-    const inputAttributes = this.renderInputAttributes();
-    const hasPrefixSlot = hasSlot.hasSlot('prefix', this.host);
-    const hasLabelSlot = hasSlot.hasSlot('label', this.host);
-    const hasSuffixSlot = hasSlot.hasSlot('suffix', this.host);
-    return (index.h(index.Host, null, index.h("div", { class: "component" }, index.h("div", { class: {
-        'tds-chip-component': true,
-        'sm': this.size === 'sm',
-        'lg': this.size === 'lg',
-        'prefix': hasPrefixSlot,
-        'suffix': hasSuffixSlot,
-      } }, index.h("input", Object.assign({ type: this.type, id: this.chipId }, inputAttributes)), index.h("label", { onClick: (event) => event.stopPropagation(), htmlFor: this.chipId }, hasPrefixSlot && index.h("slot", { name: "prefix" }), hasLabelSlot && index.h("slot", { name: "label" }), hasSuffixSlot && index.h("slot", { name: "suffix" }))))));
-  }
-  get host() { return index.getElement(this); }
+    renderInputAttributes() {
+        if (this.type !== 'button') {
+            return {
+                value: this.value,
+                checked: this.checked,
+                name: this.name,
+                onChange: () => this.handleChange(),
+            };
+        }
+        return {
+            onClick: () => this.handleClick(),
+        };
+    }
+    render() {
+        const inputAttributes = this.renderInputAttributes();
+        const hasPrefixSlot = hasSlot.hasSlot('prefix', this.host);
+        const hasLabelSlot = hasSlot.hasSlot('label', this.host);
+        const hasSuffixSlot = hasSlot.hasSlot('suffix', this.host);
+        return (index.h(index.Host, null, index.h("div", { class: "component" }, index.h("div", { class: {
+                'tds-chip-component': true,
+                'sm': this.size === 'sm',
+                'lg': this.size === 'lg',
+                'prefix': hasPrefixSlot,
+                'suffix': hasSuffixSlot,
+            } }, index.h("input", Object.assign({ type: this.type, id: this.chipId }, inputAttributes)), index.h("label", { onClick: (event) => event.stopPropagation(), htmlFor: this.chipId }, hasPrefixSlot && index.h("slot", { name: "prefix" }), hasLabelSlot && index.h("slot", { name: "label" }), hasSuffixSlot && index.h("slot", { name: "suffix" }))))));
+    }
+    get host() { return index.getElement(this); }
 };
 TdsChip.style = chipCss;
 

package/dist/cjs/tds-core-header-item_2.cjs.entry.js

@@ -2,64 +2,64 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-705dca7c.js');
-const dfs = require('./dfs-babd18a6.js');
+const index = require('./index-ae4fbf97.js');
+const dfs = require('./dfs-84f7f63e.js');
 
 const coreHeaderItemCss = ":host{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-header-nav-item-color)}:host .item{all:unset;box-sizing:border-box;display:flex;justify-content:center;align-items:center;min-width:var(--tds-header-height);height:var(--tds-header-height);margin:0}:host .item *{box-sizing:border-box}:host slot{white-space:nowrap}:host ::slotted(svg){font-size:20px}";
 
 const TdsCoreHeaderItem = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("div", { class: "item" }, index.h("slot", null))));
-  }
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    render() {
+        return (index.h(index.Host, null, index.h("div", { class: "item" }, index.h("slot", null))));
+    }
 };
 TdsCoreHeaderItem.style = coreHeaderItemCss;
 
 const headerItemCss = ":host ::slotted(button),:host ::slotted(a){all:unset;box-sizing:border-box;background-color:var(--tds-header-background);border-right:1px solid var(--tds-header--basic-element-border);width:100%;height:100%;cursor:pointer;padding:0 24px;display:flex;align-items:center;gap:8px}:host ::slotted(button) *,:host ::slotted(a) *{box-sizing:border-box}:host ::slotted(button:hover),:host ::slotted(a:hover){background-color:var(--tds-header-item-hover)}:host ::slotted(button:focus-visible),:host ::slotted(a:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .component-active ::slotted(button),:host .component-active ::slotted(a){background-color:var(--tds-header--basic-element-background-open);color:var(--tds-header-nav-item-dropdown-opened-color);border-color:var(--tds-header--basic-element-border-open)}:host .component-selected:not(.component-active) ::slotted(button),:host .component-selected:not(.component-active) ::slotted(a){background-color:var(--tds-header--basic-element-background-selected);padding-top:4px;border-bottom-style:solid;border-bottom-width:4px;border-bottom-color:var(--tds-nav-item-border-color-active)}";
 
 const TdsHeaderItem = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.active = false;
-    this.selected = false;
-  }
-  updateSlotted(searchPredicate, mutationCallback) {
-    const assignedElements = this.slotEl.assignedElements({ flatten: true });
-    const firstSlottedElement = assignedElements[0];
-    if (firstSlottedElement) {
-      const foundElement = dfs.dfs(firstSlottedElement, searchPredicate);
-      if (foundElement) {
-        mutationCallback(foundElement);
-      }
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.active = false;
+        this.selected = false;
+    }
+    updateSlotted(searchPredicate, mutationCallback) {
+        const assignedElements = this.slotEl.assignedElements({ flatten: true });
+        const firstSlottedElement = assignedElements[0];
+        if (firstSlottedElement) {
+            const foundElement = dfs.dfs(firstSlottedElement, searchPredicate);
+            if (foundElement) {
+                mutationCallback(foundElement);
+            }
+        }
+    }
+    /**
+     * This function is needed because we can't use CSS selectors to style something in the light dom
+     */
+    updateSlottedElements() {
+        if (this.slotEl) {
+            const isIconOrSvg = (element) => element.tagName.toLowerCase() === 'tds-icon' || element.tagName.toLowerCase() === 'svg';
+            const addIconClass = (element) => element.classList.add('__tds-header-item-icon');
+            this.updateSlotted(isIconOrSvg, addIconClass);
+            const isImage = (element) => element.tagName.toLowerCase() === 'img';
+            const addImageClass = (element) => element.classList.add('__tds-header-item-image');
+            this.updateSlotted(isImage, addImageClass);
+        }
+    }
+    componentDidLoad() {
+        this.slotEl = this.host.shadowRoot.querySelector('slot');
+        this.updateSlottedElements();
+        this.slotEl.addEventListener('slotchange', this.updateSlottedElements);
     }
-  }
-  /**
-   * This function is needed because we can't use CSS selectors to style something in the light dom
-   */
-  updateSlottedElements() {
-    if (this.slotEl) {
-      const isIconOrSvg = (element) => element.tagName.toLowerCase() === 'tds-icon' || element.tagName.toLowerCase() === 'svg';
-      const addIconClass = (element) => element.classList.add('__tds-header-item-icon');
-      this.updateSlotted(isIconOrSvg, addIconClass);
-      const isImage = (element) => element.tagName.toLowerCase() === 'img';
-      const addImageClass = (element) => element.classList.add('__tds-header-item-image');
-      this.updateSlotted(isImage, addImageClass);
+    render() {
+        return (index.h(index.Host, null, index.h("tds-core-header-item", { class: {
+                'component-active': this.active,
+                'component-selected': this.selected,
+            } }, index.h("slot", null))));
     }
-  }
-  componentDidLoad() {
-    this.slotEl = this.host.shadowRoot.querySelector('slot');
-    this.updateSlottedElements();
-    this.slotEl.addEventListener('slotchange', this.updateSlottedElements);
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("tds-core-header-item", { class: {
-        'component-active': this.active,
-        'component-selected': this.selected,
-      } }, index.h("slot", null))));
-  }
-  get host() { return index.getElement(this); }
+    get host() { return index.getElement(this); }
 };
 TdsHeaderItem.style = headerItemCss;
 

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

@@ -2,92 +2,92 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-705dca7c.js');
+const index = require('./index-ae4fbf97.js');
 
 const datetimeCss = ".tds-datetime-input[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-md[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-sm[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime{display:none}.tds-datetime-input.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-20) var(--tds-spacing-element-16)}.tds-datetime-input.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input.sc-tds-datetime::placeholder{opacity:1;color:var(--tds-datetime-placeholder)}.tds-datetime-input.sc-tds-datetime:focus::placeholder{color:var(--tds-datetime-placeholder-color-focus)}.tds-datetime-input.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input.sc-tds-datetime:disabled::placeholder{color:var(--tds-datetime-placeholder-disabled)}.tds-datetime-input.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-md.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-md.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-md.sc-tds-datetime::placeholder{opacity:1;color:var(--tds-datetime-placeholder)}.tds-datetime-input-md.sc-tds-datetime:focus::placeholder{color:var(--tds-datetime-placeholder-color-focus)}.tds-datetime-input-md.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-md.sc-tds-datetime:disabled::placeholder{color:var(--tds-datetime-placeholder-disabled)}.tds-datetime-input-md.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-sm.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-sm.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-sm.sc-tds-datetime::placeholder{opacity:1;color:var(--tds-datetime-placeholder)}.tds-datetime-input-sm.sc-tds-datetime:focus::placeholder{color:var(--tds-datetime-placeholder-color-focus)}.tds-datetime-input-sm.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-sm.sc-tds-datetime:disabled::placeholder{color:var(--tds-datetime-placeholder-disabled)}.tds-datetime-input-sm.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-container.sc-tds-datetime{border-radius:4px 4px 0 0;display:flex;position:relative;height:56px;box-sizing:border-box;background-color:var(--tds-datetime-background);border-bottom:1px solid var(--tds-datetime-border-bottom);transition:border-bottom-color 200ms ease}.tds-datetime-container.sc-tds-datetime:hover{border-bottom-color:var(--tds-datetime-border-bottom-hover)}.tds-form-datetime-md.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:48px}.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:40px}.tds-datetime-input-container.sc-tds-datetime{position:relative;width:100%}.tds-datetime-input-container.sc-tds-datetime .datetime-icon.sc-tds-datetime{height:20px;width:20px;position:absolute;top:50%;transform:translateY(-50%);right:18px;pointer-events:none;color:var(--tds-datetime-icon)}.tds-datetime-label.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;margin-bottom:var(--tds-spacing-element-8);color:var(--tds-datetime-label-color)}.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);position:absolute;pointer-events:none;color:var(--tds-datetime-label-inside-color);left:16px}.tds-form-datetime.sc-tds-datetime{display:block;min-width:208px;background:unset}.tds-form-datetime-nomin.sc-tds-datetime{min-width:auto}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime{padding-top:var(--tds-spacing-element-24);padding-bottom:15px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:20px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime .sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime:focus::placeholder{transition:color 0.35s ease;color:var(--tds-datetime-placeholder-color-focus)}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime .sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime:focus::placeholder{transition:color 0.35s ease;color:var(--tds-datetime-placeholder-color-focus)}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime .sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime:focus::placeholder{transition:color 0.35s ease;color:var(--tds-datetime-placeholder-color-focus)}.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime,.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-data.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime,.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-data.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-focus.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime,.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-data.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:12px}.tds-datetime-bar.sc-tds-datetime{position:absolute;width:100%}.tds-datetime-bar.sc-tds-datetime::before,.tds-datetime-bar.sc-tds-datetime::after{content:\"\";height:2px;top:54px;width:0;position:absolute;background:var(--tds-datetime-bar);transition:0.35s ease all}.tds-form-datetime-md.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-md.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{top:46px}.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{top:40px}.tds-datetime-bar.sc-tds-datetime::before{left:50%}.tds-datetime-bar.sc-tds-datetime::after{right:50%}.tds-datetime-focus.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-datetime-focus.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{width:50%}.tds-datetime-helper.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;flex-basis:100%;padding-top:var(--tds-spacing-element-4);color:var(--tds-datetime-helper)}.tds-datetime-helper.sc-tds-datetime .tds-helper.sc-tds-datetime{display:inline-flex;gap:8px}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:transparent}.tds-form-datetime-disabled.sc-tds-datetime .datetime-icon.sc-tds-datetime tds-icon.sc-tds-datetime{color:var(--tds-datetime-icon-disabled)}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-label.sc-tds-datetime{color:var(--tds-datetime-label-disabled);cursor:not-allowed}.tds-form-datetime-success.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-success);color:var(--tds-datetime-color-success)}.tds-form-datetime-success.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-success.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{background:var(--tds-datetime-bar-sucess)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-helper.sc-tds-datetime{color:var(--tds-datetime-helper-error)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-error)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-error.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{background:var(--tds-datetime-bar-error)}.tds-form-datetime-error.sc-tds-datetime .datetime-icon.sc-tds-datetime tds-icon.sc-tds-datetime{color:var(--tds-datetime-icon-error)}.tds-datetime-textcounter.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter);float:right}.tds-datetime-textcounter.sc-tds-datetime .tds-datetime-textcounter-divider.sc-tds-datetime{letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter-divider)}input[type=datetime-local].sc-tds-datetime::-webkit-inner-spin-button,input[type=datetime-local].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=date].sc-tds-datetime::-webkit-inner-spin-button,input[type=date].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=time].sc-tds-datetime::-webkit-inner-spin-button,input[type=time].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}";
 
 const TdsDatetime = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.tdsChange = index.createEvent(this, "tdsChange", 6);
-    this.tdsBlur = index.createEvent(this, "tdsBlur", 6);
-    this.tdsFocus = index.createEvent(this, "tdsFocus", 6);
-    this.getDefaultValue = () => {
-      const dateTimeObj = {
-        year: this.defaultValue.slice(0, 4),
-        month: this.defaultValue.slice(5, 7),
-        day: this.defaultValue.slice(8, 10),
-        hours: this.defaultValue.slice(11, 13),
-        minutes: this.defaultValue.slice(14, 16),
-      };
-      switch (this.type) {
-        case 'datetime-local':
-          return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}T${dateTimeObj.hours}:${dateTimeObj.minutes}`;
-        case 'date':
-          return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}`;
-        case 'time':
-          return `${this.defaultValue.slice(0, 2)}:${this.defaultValue.slice(3, 5)}`;
-        default:
-          throw new Error('Invalid type.');
-      }
-    };
-    this.type = 'datetime-local';
-    this.value = '';
-    this.min = undefined;
-    this.max = undefined;
-    this.defaultValue = 'none';
-    this.disabled = false;
-    this.size = 'lg';
-    this.noMinWidth = false;
-    this.modeVariant = null;
-    this.name = '';
-    this.state = undefined;
-    this.autofocus = false;
-    this.label = '';
-    this.helper = '';
-    this.focusInput = undefined;
-  }
-  componentWillLoad() {
-    if (this.defaultValue !== 'none') {
-      this.value = this.getDefaultValue();
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.tdsChange = index.createEvent(this, "tdsChange", 6);
+        this.tdsBlur = index.createEvent(this, "tdsBlur", 6);
+        this.tdsFocus = index.createEvent(this, "tdsFocus", 6);
+        this.getDefaultValue = () => {
+            const dateTimeObj = {
+                year: this.defaultValue.slice(0, 4),
+                month: this.defaultValue.slice(5, 7),
+                day: this.defaultValue.slice(8, 10),
+                hours: this.defaultValue.slice(11, 13),
+                minutes: this.defaultValue.slice(14, 16),
+            };
+            switch (this.type) {
+                case 'datetime-local':
+                    return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}T${dateTimeObj.hours}:${dateTimeObj.minutes}`;
+                case 'date':
+                    return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}`;
+                case 'time':
+                    return `${this.defaultValue.slice(0, 2)}:${this.defaultValue.slice(3, 5)}`;
+                default:
+                    throw new Error('Invalid type.');
+            }
+        };
+        this.type = 'datetime-local';
+        this.value = '';
+        this.min = undefined;
+        this.max = undefined;
+        this.defaultValue = 'none';
+        this.disabled = false;
+        this.size = 'lg';
+        this.noMinWidth = false;
+        this.modeVariant = null;
+        this.name = '';
+        this.state = undefined;
+        this.autofocus = false;
+        this.label = '';
+        this.helper = '';
+        this.focusInput = undefined;
     }
-  }
-  // Listener if input enters focus state
-  handleFocusIn() {
-    this.focusInput = true;
-  }
-  // Listener if input leaves focus state
-  handleFocusOut() {
-    this.focusInput = false;
-  }
-  // Data input event in value prop
-  handleInput(e) {
-    this.value = e.target.value;
-    this.tdsChange.emit(e);
-  }
-  // Change event isn't a composed:true by default in for input
-  handleChange(e) {
-    this.tdsChange.emit(e);
-  }
-  /** Set the input as focus when clicking the whole Datetime with suffix/prefix */
-  handleFocusClick(e) {
-    this.textInput.focus();
-    this.tdsFocus.emit(e);
-  }
-  /** Set the input as focus when clicking the whole Datetime with suffix/prefix */
-  handleBlur(e) {
-    this.textInput.blur();
-    this.tdsBlur.emit(e);
-  }
-  render() {
-    let className = ' tds-datetime-input';
-    if (this.size === 'md') {
-      className += `${className}-md`;
+    componentWillLoad() {
+        if (this.defaultValue !== 'none') {
+            this.value = this.getDefaultValue();
+        }
     }
-    if (this.size === 'sm') {
-      className += `${className}-sm`;
+    // Listener if input enters focus state
+    handleFocusIn() {
+        this.focusInput = true;
     }
-    return (index.h("div", { class: `
+    // Listener if input leaves focus state
+    handleFocusOut() {
+        this.focusInput = false;
+    }
+    // Data input event in value prop
+    handleInput(e) {
+        this.value = e.target.value;
+        this.tdsChange.emit(e);
+    }
+    // Change event isn't a composed:true by default in for input
+    handleChange(e) {
+        this.tdsChange.emit(e);
+    }
+    /** Set the input as focus when clicking the whole Datetime with suffix/prefix */
+    handleFocusClick(e) {
+        this.textInput.focus();
+        this.tdsFocus.emit(e);
+    }
+    /** Set the input as focus when clicking the whole Datetime with suffix/prefix */
+    handleBlur(e) {
+        this.textInput.blur();
+        this.tdsBlur.emit(e);
+    }
+    render() {
+        let className = ' tds-datetime-input';
+        if (this.size === 'md') {
+            className += `${className}-md`;
+        }
+        if (this.size === 'sm') {
+            className += `${className}-sm`;
+        }
+        return (index.h("div", { class: `
         ${this.noMinWidth ? 'tds-form-datetime-nomin' : ''}
         ${this.focusInput ? 'tds-form-datetime tds-datetime-focus' : ' tds-form-datetime'}
         ${this.value.length > 0 ? 'tds-datetime-data' : ''}
@@ -95,10 +95,10 @@ const TdsDatetime = class {
         ${this.size === 'md' ? 'tds-form-datetime-md' : ''}
         ${this.size === 'sm' ? 'tds-form-datetime-sm' : ''}
         ${this.state === 'error' || this.state === 'success'
-        ? `tds-form-datetime-${this.state}`
-        : ''}
+                ? `tds-form-datetime-${this.state}`
+                : ''}
         ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && (index.h("label", { htmlFor: this.name, class: "tds-datetime-label" }, this.label)), index.h("div", { onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, index.h("div", { class: "tds-datetime-input-container" }, index.h("input", { ref: (inputEl) => (this.textInput = inputEl), class: className, type: this.type, disabled: this.disabled, value: this.value, min: this.min, max: this.max, autofocus: this.autofocus, name: this.name, onInput: (e) => this.handleInput(e), onBlur: (e) => this.handleBlur(e), onChange: (e) => this.handleChange(e) }), index.h("div", { class: "datetime-icon icon-datetime-local" }, index.h("tds-icon", { size: "20px", name: "calendar" })), index.h("div", { class: "datetime-icon icon-time" }, index.h("tds-icon", { size: "20px", name: "clock" }))), index.h("div", { class: "tds-datetime-bar" })), this.helper && (index.h("div", { class: "tds-datetime-helper" }, index.h("div", { class: "tds-helper" }, this.state === 'error' && index.h("tds-icon", { name: "error", size: "16px" }), this.helper)))));
-  }
+    }
 };
 TdsDatetime.style = datetimeCss;
 

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

@@ -2,18 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-705dca7c.js');
+const index = require('./index-ae4fbf97.js');
 
 const dividerCss = ".divider{box-sizing:border-box}.divider *{box-sizing:border-box}.divider.horizontal{background-color:var(--tds-divider-background);width:100%;height:1px}.divider.vertical{background-color:var(--tds-divider-background);height:100%;width:1px}";
 
 const Divider = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.orientation = 'horizontal';
-  }
-  render() {
-    return (index.h(index.Host, { role: "separator", "aria-orientation": this.orientation === 'vertical' ? 'vertical' : undefined }, index.h("div", { class: `divider ${this.orientation}` })));
-  }
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.orientation = 'horizontal';
+    }
+    render() {
+        return (index.h(index.Host, { role: "separator", "aria-orientation": this.orientation === 'vertical' ? 'vertical' : undefined }, index.h("div", { class: `divider ${this.orientation}` })));
+    }
 };
 Divider.style = dividerCss;