@scania/tegel
Version:
Tegel Design System
1 lines • 3.28 kB
JavaScript
import{t,p as e,H as s,h as o,a as n}from"./index.js";import{d as i}from"./p-CIt4YhvL.js";const a=["compactDesign"],r=e(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.showIcon=!0,this.renderSlot=!0,this.inputFocused=!1,this.compactDesign=!1,this.tableId=""}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>a.includes(t))).forEach((e=>{if(void 0===this[e])throw console.error("Table prop is not supported: "+e),Error("Table prop is not supported: "+e);this[e]=t.detail[e]}))}connectedCallback(){const t=this.host.closest("tds-table");t?this.tableId=t.getAttribute("table-id"):console.error("Failed to find parent tds-table element.")}componentWillLoad(){const t=this.host.closest("tds-table");t?a.forEach((e=>{this[e]=t[e]})):console.error("Failed to find parent tds-table element.")}handleSlotChange(){this.validateSlot()}validateSlot(){const t=Array.from(this.host.children).filter((t=>"INPUT"===t.tagName));if(1!==t.length)console.warn("TABLE-HEADER-INPUT-WRAPPER: Wrapper only accepts input as children."),this.renderSlot=!1;else{this.renderSlot||(this.renderSlot=!0);const e=t[0];e.addEventListener("focus",(()=>{this.inputFocused=!0})),e.addEventListener("blur",(()=>{this.inputFocused=!1}))}}render(){return o(n,{key:"84cc720addbfd6252297b0fd67114f7dfa920cc9",class:{"focused-input-wrapper":this.inputFocused,"show-icon":this.showIcon,"tds-table__compact":this.compactDesign}},this.renderSlot?o("slot",{onSlotchange:()=>this.handleSlotChange()}):null,this.showIcon?o("tds-icon",{svgTitle:"search",class:"search-icon",slot:"icon",size:"16px",name:"search"}):null)}get host(){return this}static get style(){return":host{position:relative}:host(:hover) tds-icon{display:inline-block}:host(.focused-input-wrapper) tds-icon{display:inline-block}:host(.focused-input-wrapper) ::slotted(input:not(:focus)){background-color:var(--tds-table-input-background-hover)}:host(.show-icon) ::slotted(input){padding-left:35px}tds-icon.search-icon{color:var(--tds-table-input-header-icon);position:absolute;left:15px;top:1px}::slotted(input){box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-table-color);padding-left:var(--tds-spacing-element-16);padding-right:var(--tds-spacing-element-16);height:48px;border-radius:0;background-color:transparent;border:0;border-bottom:2px solid transparent}::slotted(input)::placeholder{color:var(--tds-table-input-header-placeholder)}::slotted(input:focus){outline:none;background-color:var(--tds-table-input-header-background-focus);border-bottom:2px solid var(--tds-text-field-bar)}:host(.tds-table__compact) ::slotted(input){height:32px;}"}},[257,"tds-table-header-input-wrapper",{showIcon:[4,"show-icon"],compactDesign:[4,"compact-design"],renderSlot:[32],inputFocused:[32],tableId:[32]},[[16,"internalTdsTablePropChange","internalTdsPropChangeListener"]]]);function d(){"undefined"!=typeof customElements&&["tds-table-header-input-wrapper","tds-icon"].forEach((e=>{switch(e){case"tds-table-header-input-wrapper":customElements.get(t(e))||customElements.define(t(e),r);break;case"tds-icon":customElements.get(t(e))||i()}}))}d();const l=r,c=d;export{l as TdsTableHeaderInputWrapper,c as defineCustomElement}