@scania/tegel 1.14.0 → 1.15.0-table-issue-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/tds-card.cjs.entry.js +5 -4
- package/dist/cjs/tds-inline-tab.cjs.entry.js +1 -1
- package/dist/cjs/tds-inline-tabs.cjs.entry.js +10 -3
- package/dist/cjs/tds-navigation-tab.cjs.entry.js +1 -1
- package/dist/cjs/tds-navigation-tabs.cjs.entry.js +14 -5
- package/dist/cjs/tds-table-body.cjs.entry.js +5 -2
- package/dist/cjs/tds-table-footer.cjs.entry.js +9 -2
- package/dist/cjs/tds-table-toolbar.cjs.entry.js +9 -2
- package/dist/cjs/tds-table.cjs.entry.js +10 -3
- package/dist/cjs/tegel.cjs.js +1 -1
- package/dist/collection/components/card/card.css +24 -0
- package/dist/collection/components/card/card.js +22 -3
- package/dist/collection/components/side-menu/side-menu.js +3 -3
- package/dist/collection/components/stepper/stepper.js +1 -1
- package/dist/collection/components/table/table/table.js +11 -4
- package/dist/collection/components/table/table-body/table-body.js +5 -2
- package/dist/collection/components/table/table-footer/table-footer.js +9 -2
- package/dist/collection/components/table/table-toolbar/table-toolbar.js +9 -2
- package/dist/collection/components/tabs/inline-tabs/inline-tab/inline-tab.css +0 -4
- package/dist/collection/components/tabs/inline-tabs/inline-tabs.css +1 -0
- package/dist/collection/components/tabs/inline-tabs/inline-tabs.js +27 -2
- package/dist/collection/components/tabs/navigation-tabs/navigation-tab/navigation-tab.css +0 -4
- package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.css +1 -0
- package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.js +31 -4
- package/dist/components/tds-card.js +6 -4
- package/dist/components/tds-inline-tab.js +1 -1
- package/dist/components/tds-inline-tabs.js +11 -3
- package/dist/components/tds-navigation-tab.js +1 -1
- package/dist/components/tds-navigation-tabs.js +15 -5
- package/dist/components/tds-table-body.js +5 -2
- package/dist/components/tds-table-footer.js +9 -2
- package/dist/components/tds-table-toolbar.js +9 -2
- package/dist/components/tds-table.js +10 -3
- package/dist/esm/loader.js +1 -1
- package/dist/esm/tds-card.entry.js +5 -4
- package/dist/esm/tds-inline-tab.entry.js +1 -1
- package/dist/esm/tds-inline-tabs.entry.js +10 -3
- package/dist/esm/tds-navigation-tab.entry.js +1 -1
- package/dist/esm/tds-navigation-tabs.entry.js +14 -5
- package/dist/esm/tds-table-body.entry.js +5 -2
- package/dist/esm/tds-table-footer.entry.js +9 -2
- package/dist/esm/tds-table-toolbar.entry.js +9 -2
- package/dist/esm/tds-table.entry.js +10 -3
- package/dist/esm/tegel.js +1 -1
- package/dist/tegel/p-08642415.entry.js +1 -0
- package/dist/tegel/p-6b04a919.entry.js +1 -0
- package/dist/tegel/{p-80edba0f.entry.js → p-7c75d8d3.entry.js} +1 -1
- package/dist/tegel/p-c1f8f523.entry.js +1 -0
- package/dist/tegel/{p-a2548553.entry.js → p-c7b2773d.entry.js} +1 -1
- package/dist/tegel/p-d1cbe5be.entry.js +1 -0
- package/dist/tegel/p-e1842d99.entry.js +1 -0
- package/dist/tegel/p-e7fac8ad.entry.js +1 -0
- package/dist/tegel/{p-56dfd78a.entry.js → p-f3f1f357.entry.js} +1 -1
- package/dist/tegel/tegel.esm.js +1 -1
- package/dist/types/components/card/card.d.ts +1 -0
- package/dist/types/components/table/table/table.d.ts +1 -0
- package/dist/types/components/table/table-footer/table-footer.d.ts +1 -0
- package/dist/types/components/table/table-toolbar/table-toolbar.d.ts +1 -0
- package/dist/types/components/tabs/inline-tabs/inline-tabs.d.ts +3 -0
- package/dist/types/components/tabs/navigation-tabs/navigation-tabs.d.ts +3 -0
- package/dist/types/components.d.ts +18 -0
- package/package.json +1 -9
- package/dist/tegel/p-631dde03.entry.js +0 -1
- package/dist/tegel/p-ac09f8d4.entry.js +0 -1
- package/dist/tegel/p-ada411aa.entry.js +0 -1
- package/dist/tegel/p-b8593b29.entry.js +0 -1
- package/dist/tegel/p-c22c761c.entry.js +0 -1
- package/dist/tegel/p-e6a5dda4.entry.js +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as a,h as e,H as s,g as r}from"./p-2049fab2.js";const o=["compactDesign","noMinWidth","verticalDividers","horizontalScrollWidth"],i=class{constructor(e){t(this,e),this.tdsFilter=a(this,"tdsFilter",7),this.tableTitle="",this.filter=!1,this.verticalDividers=!1,this.compactDesign=!1,this.noMinWidth=!1,this.whiteBackground=!1,this.tableId="",this.horizontalScrollWidth=null}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>o.includes(t))).forEach((a=>{if(void 0===this[a])throw new Error(`Table prop is not supported: ${a}`);this[a]=t.detail[a]}))}connectedCallback(){this.tableEl=this.host.closest("tds-table"),this.tableId=this.tableEl.tableId}componentWillLoad(){o.forEach((t=>{this[t]=this.tableEl[t]}))}handleSearch(t){const a=t.currentTarget.value.toLowerCase(),e=t.currentTarget.parentElement;this.tdsFilter.emit({tableId:this.tableId,query:a}),a.length>0?e.classList.add("tds-table__searchbar--active"):e.classList.remove("tds-table__searchbar--active")}render(){return e(s,{key:"9c864dc219ed17a50a4d84881c676e05b3e0ef92",class:{"tds-table--compact":this.compactDesign,"toolbar__horizontal-scroll":!!this.horizontalScrollWidth},style:this.horizontalScrollWidth?{width:this.horizontalScrollWidth}:{}},e("div",{key:"035b5a5396344e3d682fb5370a4e1c0484045579",class:"tds-table__upper-bar-flex"},e("caption",{key:"f1f5ba362eda8a0ae25fb63c89a25fe3606365c9",class:"tds-table__title"},this.tableTitle),e("div",{key:"b94a83cf81e1aaa06d1b29a4e9207c99bccbbbbc",class:"tds-table__actionbar"},this.filter&&e("div",{key:"358798e484d1892acb6a4e7e3b30702002ba860d",class:"tds-table__searchbar"},e("input",{key:"f062bf19e13e312ee9089324bdfc6d4e2e9a1db4",class:"tds-table__searchbar-input",type:"text",onKeyUp:t=>this.handleSearch(t)}),e("span",{key:"9e874b39910b2d32b0a3193b14e01ed5f681b928",class:"tds-table__searchbar-icon"},e("tds-icon",{key:"38d5a1b800d849b66a0c35d01d496fc4708f53c2",name:"search",size:"20px"}))),e("slot",{key:"f362385a5719c51dbce2b213774b6397ede8714b",name:"end"}))))}get host(){return r(this)}};i.style=':host{box-sizing:border-box;display:table-caption;position:relative;background-color:var(--tds-table-toolbar-background);color:var(--tds-table-color);padding:0 var(--tds-spacing-element-16);height:64px;border-top-left-radius:4px;border-top-right-radius:4px}:host *{box-sizing:border-box}:host .tds-table__upper-bar-flex{width:100%;height:100%;display:flex;justify-content:space-between}:host .tds-table__title{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);padding-top:var(--tds-spacing-element-16);text-align:left}:host .tds-table__actionbar,:host slot[name=end]::slotted(*){display:flex;align-self:center}:host .tds-table__searchbar{display:flex;align-self:center;position:relative;height:40px;width:40px;border-radius:4px 4px 0 0;transition:background-color 250ms ease, width 250ms ease;overflow:hidden;background-color:transparent}:host .tds-table__searchbar::after{content:"";width:100%;height:2px;position:absolute;bottom:0;background-color:var(--tds-blue-400);transform:scaleX(0);transition:transform 150ms ease}:host .tds-table__searchbar:focus-within::after{transform:scaleX(100%)}:host .tds-table__searchbar:focus-within,:host .tds-table__searchbar.tds-table__searchbar--active{width:208px;background-color:var(--tds-table-toolbar-searchbar-background)}:host .tds-table__searchbar:focus-within:hover,:host .tds-table__searchbar.tds-table__searchbar--active:hover{background-color:var(--tds-table-toolbar-searchbar-background)}:host .tds-table__searchbar .tds-table__searchbar-input{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-table-color);z-index:1;width:100%;height:100%;border:none;padding:0 36px 0 16px;background-color:transparent;outline:none;cursor:pointer}:host .tds-table__searchbar .tds-table__searchbar-input :focus{background-color:var(--tds-table-toolbar-searchbar-background)}:host .tds-table__searchbar:hover{background-color:var(--tds-table-toolbar-searchbar-background-hover)}:host .tds-table__searchbar .tds-table__searchbar-icon{z-index:0;position:absolute;right:9px;top:9px;width:20px;height:20px}:host(.toolbar__horizontal-scroll){position:absolute;top:var(--tds-spacing-element-16)}:host(.tds-table--compact){height:56px}';export{i as tds_table_toolbar}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as a,H as s,g as o}from"./p-2049fab2.js";const i=["compactDesign","horizontalScrollWidth"];function l(t){t.target.classList.remove("tds-table__page-selector-input--shake")}const r=class{constructor(a){t(this,a),this.tdsPagination=e(this,"tdsPagination",7),this.previousPage=()=>{this.paginationValue>=2&&this.paginationValue--,this.tdsPagination.emit({tableId:this.tableId,paginationValue:Number(this.paginationValue)}),this.storeLastCorrectValue(this.paginationValue)},this.nextPage=()=>{this.paginationValue<=this.pages&&this.paginationValue++,this.tdsPagination.emit({tableId:this.tableId,paginationValue:Number(this.paginationValue)}),this.storeLastCorrectValue(this.paginationValue)},this.pagination=!1,this.paginationValue=1,this.pages=null,this.cols=null,this.columnsNumber=0,this.compactDesign=!1,this.lastCorrectValue=void 0,this.tableId="",this.horizontalScrollWidth=null}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>i.includes(t))).forEach((e=>{if(void 0===this[e])throw new Error(`Table prop is not supported: ${e}`);this[e]=t.detail[e]}))}connectedCallback(){this.tableEl=this.host.closest("tds-table"),this.tableId=this.tableEl.tableId}componentWillLoad(){i.forEach((t=>{this[t]=this.tableEl[t]})),this.storeLastCorrectValue(this.paginationValue);const t=this.host.parentElement.querySelector("tds-table-header").childElementCount;this.columnsNumber=this.cols?this.cols:t}storeLastCorrectValue(t){this.lastCorrectValue=t}paginationInputChange(t){const e=Number(t.target.value);e>t.target.max||e<t.target.min?(t.target.classList.add("tds-table__page-selector-input--shake"),this.inputElement.value=String(this.lastCorrectValue),this.paginationValue=Number(this.inputElement.value)):this.paginationValue=e,this.tdsPagination.emit({tableId:this.tableId,paginationValue:Number(this.paginationValue)}),this.storeLastCorrectValue(this.paginationValue)}render(){return a(s,{key:"fe6221e5dd2ec57e63afefc5e45c0b3f5ad85d8f",class:{"tds-table--compact":this.compactDesign,"footer__horizontal-scroll":!!this.horizontalScrollWidth},style:this.horizontalScrollWidth?{width:this.horizontalScrollWidth}:{}},a("tr",{key:"6f6bfca5e7719084b2c4564b86806f6eb7867601",class:"tds-table__footer-row"},a("td",{key:"2c4389dfa2c028798246a5c4d8b9bdcc05a780f2",class:"tds-table__footer-cell",colSpan:this.columnsNumber},this.pagination&&a("div",{key:"0831e596963e20222feee940fb7d7d489f832b5e",class:"tds-table__pagination"},a("div",{key:"1129e67d9b69b06a1fadde589f9ad37a1bd9fcca",class:"tds-table__row-selector"}),a("div",{key:"81e685df813d615027470d4c84c468bb2c5fccca",class:"tds-table__page-selector"},a("input",{key:"4b116837ae02fcbf6b51b940587ae6159d40f5cb",ref:t=>this.inputElement=t,class:"tds-table__page-selector-input",type:"number",min:"1",max:this.pages,value:this.paginationValue,pattern:"[0-9]+",dir:"ltr",onChange:t=>this.paginationInputChange(t),onAnimationEnd:l}),a("p",{key:"927af4715b33f50679aef3ec5eccc5fd4044add7",class:"tds-table__footer-text"},"of ",a("span",{key:"2d89421fbbbb0828623465f39edc506b9bfa82da"},this.pages)," pages"),a("button",{key:"37916d812b7b4510b088b382f48b2d9f04d212b2",type:"button",class:"tds-table__footer-btn",disabled:this.paginationValue<=1,onClick:()=>this.previousPage()},a("tds-icon",{key:"d89ac980f4c48fe6c14610f27ccc05e43994631e",name:"chevron_left",size:"20px"})),a("button",{key:"246b17fc6ff26e3830d5a359a4a5de844bc93a1b",type:"button",class:"tds-table__footer-btn",disabled:this.paginationValue>=this.pages,onClick:()=>this.nextPage()},a("tds-icon",{key:"6fa3441ed75b484974e50ee41ea1444bea7c30e2",name:"chevron_right",size:"20px"})))))))}get host(){return o(this)}};r.style=":host{box-sizing:border-box;display:table-footer-group;height:48px}:host *{box-sizing:border-box}:host .tds-table__footer-row{background-color:var(--tds-table-footer-background);color:var(--tds-table-color)}:host .tds-table__footer-cell{padding:0 16px}:host .tds-table__footer-cell .tds-table__pagination{height:48px;display:flex;align-items:center;justify-content:space-between}:host .tds-table__footer-cell .tds-table__pagination .tds-table__row-selector,:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector{display:flex;align-items:center}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);background-color:var(--tds-table-footer-page-selector-input-background);color:var(--tds-table-color);width:54px;height:30px;border:none;border-radius:4px;transition:background-color 250ms ease;margin-right:4px;padding-left:16px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:hover{background-color:var(--tds-table-footer-page-selector-input-background-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:disabled{color:var(--tds-table-footer-page-selector-input-color-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input--shake{animation:tds-shake-animation 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;transform:translate3d(0, 0, 0);backface-visibility:hidden;perspective:1000px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-text{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:1px 8px 0 0}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{display:flex;justify-content:center;align-items:center;border:none;background-color:transparent;cursor:pointer;height:32px;width:32px;border-radius:4px;transition:background-color 250ms ease;color:var(--tds-table-footer-page-selector-icon)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:hover{background-color:var(--tds-table-footer-btn-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled{cursor:default;color:var(--tds-table-footer-page-selector-icon-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled:hover{background-color:transparent}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn-svg{height:20px;width:20px;fill:var(--tds-table-color)}:host(.tds-table--compact){height:32px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination{height:32px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{height:24px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{height:28px;width:28px}:host(.footer__horizontal-scroll){display:inline-table;position:absolute;margin-top:10px}@keyframes tds-shake-animation{10%,90%{transform:translate3d(-1px, 0, 0)}20%,80%{transform:translate3d(2px, 0, 0)}30%,50%,70%{transform:translate3d(-4px, 0, 0)}40%,60%{transform:translate3d(4px, 0, 0)}}";export{r as tds_table_footer}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as s,h as o,H as l,g as r}from"./p-2049fab2.js";import{g as a}from"./p-11648030.js";const e=class{constructor(o){t(this,o),this.internalTdsTablePropChange=s(this,"internalTdsTablePropChange",6),this.verticalDividers=!1,this.compactDesign=!1,this.noMinWidth=void 0,this.multiselect=!1,this.expandableRows=!1,this.responsive=!1,this.modeVariant=null,this.horizontalScrollWidth=null,this.tableId=a(),this.enableHorizontalScrollToolbarDesign=!1,this.enableHorizontalScrollFooterDesign=!1}emitInternalTdsPropChange(t,s){this.internalTdsTablePropChange.emit({tableId:this.tableId,changed:[t],[t]:s})}async getSelectedRows(){let t=[];const s=this.host.querySelector("tds-table-body");return Array.from(s.querySelectorAll("tds-table-body-row")).filter((t=>t.selected)).forEach((s=>{let o=[];Array.from(s.getElementsByTagName("tds-body-cell")).forEach((t=>{var s;const l={cellKey:null,cellValue:null};l.cellKey=t.cellKey,l.cellValue=null!==(s=t.cellValue)&&void 0!==s?s:t.innerText,o=[...o,l]})),t=[...t,o]})),t}multiselectChanged(t){this.emitInternalTdsPropChange("multiselect",t)}enableExpandableRowsChanged(t){this.emitInternalTdsPropChange("expandableRows",t)}compactDesignChanged(t){this.emitInternalTdsPropChange("compactDesign",t)}verticalDividersChanged(t){this.emitInternalTdsPropChange("verticalDividers",t)}noMinWidthChanged(t){this.emitInternalTdsPropChange("noMinWidth",t)}modeVariantChanged(t){this.emitInternalTdsPropChange("modeVariant",t)}widthChanged(t){this.emitInternalTdsPropChange("horizontalScrollWidth",t)}componentWillRender(){this.horizontalScrollWidth&&(this.enableHorizontalScrollToolbarDesign=this.host.closest("tds-table").getElementsByTagName("tds-table-toolbar").length>=1,this.enableHorizontalScrollFooterDesign=this.host.closest("tds-table").getElementsByTagName("tds-table-footer").length>=1)}render(){return o(l,{key:"da929268a984ca0e81843132b2fafd6c79bec3b3",class:{"tds-table--responsive":this.responsive,"tds-mode-variant-primary":"primary"===this.modeVariant,"tds-mode-variant-secondary":"secondary"===this.modeVariant}},o("table",{key:"2ba662d97bc834a7a0d6d71338fc7c322bc15741",style:this.horizontalScrollWidth?{width:this.horizontalScrollWidth}:{},class:{"tds-table":!0,"tds-table--compact":this.compactDesign,"tds-table--divider":this.verticalDividers,"tds-table--no-min-width":this.noMinWidth,"tds-table--responsive":this.responsive,"tds-table--horizontal-scroll":!!this.horizontalScrollWidth,"tds-table--horizontal-scroll-toolbar":this.enableHorizontalScrollToolbarDesign&&!this.compactDesign,"tds-table--horizontal-scroll-toolbar-compact":this.enableHorizontalScrollToolbarDesign&&this.compactDesign,"tds-table--horizontal-scroll-footer":this.enableHorizontalScrollFooterDesign&&!this.compactDesign,"tds-table--horizontal-scroll-footer-compact":this.enableHorizontalScrollFooterDesign&&this.compactDesign}},o("slot",{key:"c95e71aeaac2f4378d440bb23ff890c9c4a76fdf"})))}get host(){return r(this)}static get watchers(){return{multiselect:["multiselectChanged"],expandableRows:["enableExpandableRowsChanged"],compactDesign:["compactDesignChanged"],verticalDividers:["verticalDividersChanged"],noMinWidth:["noMinWidthChanged"],modeVariant:["modeVariantChanged"],horizontalScrollWidth:["widthChanged"]}}};e.style=":host{--tds-scrollbar-width-standard:thin;--tds-scrollbar-width:10px;--tds-scrollbar-height:10px;--tds-scrollbar-thumb-border-width:3px;--tds-scrollbar-thumb-border-hover-width:2px}body{scrollbar-width:thin}:host,.tds-table{border-collapse:collapse;display:table;box-sizing:border-box}:host *,.tds-table *{box-sizing:border-box}:host(.tds-table--responsive),.tds-table--responsive{width:100%}.tds-table--horizontal-scroll{display:block;overflow-x:scroll;white-space:nowrap}.tds-table--horizontal-scroll:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background:var(--tds-scrollbar-hover-thumb-color);background-clip:padding-box}.tds-table--horizontal-scroll::-webkit-scrollbar{height:var(--tds-scrollbar-height)}.tds-table--horizontal-scroll::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}.tds-table--horizontal-scroll::-webkit-scrollbar-thumb{border-radius:40px;background:var(--tds-scrollbar-thumb-color);border:var(--tds-scrollbar-thumb-border-width) solid transparent;background-clip:padding-box}.tds-table--horizontal-scroll::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){.tds-table--horizontal-scroll{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}.tds-table--horizontal-scroll-toolbar{margin-top:64px}.tds-table--horizontal-scroll-toolbar-compact{margin-top:56px}.tds-table--horizontal-scroll-footer{margin-bottom:49px}.tds-table--horizontal-scroll-footer-compact{margin-bottom:33px}";export{e as tds_table}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as s,h as i,H as o,g as e}from"./p-2049fab2.js";const h=class{constructor(i){t(this,i),this.tdsChange=s(this,"tdsChange",7),this.navWrapperElement=null,this.componentWidth=0,this.buttonsWidth=0,this.scrollWidth=0,this.clickHandlers=new WeakMap,this.addResizeObserver=()=>{new ResizeObserver((t=>{t.forEach((t=>{const s=t.contentRect.width;let i=0;Array.from(this.host.children).forEach((t=>{const s=window.getComputedStyle(t);i+=t.clientWidth+parseFloat(s.marginLeft)+parseFloat(s.marginRight)})),this.componentWidth=s,this.buttonsWidth=i,this.scrollWidth=i-s,this.updateScrollButtons()}))})).observe(this.navWrapperElement)},this.addEventListenerToTabs=()=>{this.children=Array.from(this.host.children),this.children.map(((t,s)=>{const i=()=>{t.disabled||this.tdsChange.emit({selectedTabIndex:this.children.indexOf(t)}).defaultPrevented||(this.children.forEach((t=>t.setSelected(!1))),t.setSelected(!0),this.selectedIndex=s)};return t.addEventListener("click",i),this.clickHandlers.set(t,i),t}))},this.removeEventListenerFromTabs=()=>{this.children.forEach((t=>{const s=this.clickHandlers.get(t);s&&(t.removeEventListener("click",s),this.clickHandlers.delete(t))}))},this.modeVariant="primary",this.defaultSelectedIndex=0,this.selectedIndex=void 0,this.showLeftScroll=!1,this.showRightScroll=!1}async selectTab(t){if(t<0||t>=this.children.length)throw new Error("Tab index out of bounds");return this.children=Array.from(this.host.children),this.children[t].disabled||(this.children.forEach((t=>t.setSelected(!1))),this.children=this.children.map(((s,i)=>(i===t&&(s.setSelected(!0),this.selectedIndex=t),s)))),{selectedTabIndex:this.selectedIndex}}async reinitialize(){this.handleSlotChange()}handleSelectedIndexUpdate(){this.children=Array.from(this.host.children).map((t=>(t.setSelected(!1),t))),this.children[this.selectedIndex].setSelected(!0)}scrollRight(){this.navWrapperElement.scrollLeft=this.navWrapperElement.scrollLeft+this.buttonsWidth,this.evaluateScrollButtons()}scrollLeft(){this.navWrapperElement.scrollLeft=this.navWrapperElement.scrollLeft-this.buttonsWidth,this.evaluateScrollButtons()}evaluateScrollButtons(){const t=this.navWrapperElement.scrollLeft;this.showRightScroll=t<=this.scrollWidth,this.showLeftScroll=t>0}initializeTabs(){this.children=Array.from(this.host.children),this.children.forEach((t=>{t.classList.remove("last"),t.classList.remove("first")})),this.children[0].classList.add("first"),this.children[this.children.length-1].classList.add("last")}initializeSelectedTab(){void 0===this.selectedIndex?(this.addEventListenerToTabs(),this.children[this.defaultSelectedIndex].setSelected(!0),this.selectedIndex=this.defaultSelectedIndex):this.children[this.selectedIndex].setSelected(!0),this.tdsChange.emit({selectedTabIndex:this.selectedIndex})}updateScrollButtons(){this.buttonsWidth>this.componentWidth?this.evaluateScrollButtons():(this.showLeftScroll=!1,this.showRightScroll=!1)}handleSlotChange(){this.initializeTabs(),this.addEventListenerToTabs(),this.initializeSelectedTab(),this.updateScrollButtons(),this.addResizeObserver()}connectedCallback(){this.initializeTabs()}componentDidLoad(){this.initializeSelectedTab()}componentDidRender(){this.updateScrollButtons(),this.addResizeObserver()}disconnectedCallback(){this.removeEventListenerFromTabs()}render(){return i(o,{key:"fdf1cc28637a8bd207c84aba91f60d145acd10c9",role:"list",class:this.modeVariant?`tds-mode-variant-${this.modeVariant}`:""},i("div",{key:"068e21bac127323f56d858abf59c1f905a4ee315",class:"wrapper",ref:t=>{this.navWrapperElement=t}},i("button",{key:"646917420741478a9492cec16c066833d3e3266e",class:"scroll-left-button "+(this.showLeftScroll?"show":""),onClick:()=>this.scrollLeft(),disabled:!this.showLeftScroll},i("tds-icon",{key:"939eb79ed238163057dcc8316f6efdec89262ff8",name:"chevron_left",size:"20px"})),i("slot",{key:"f3306035cce33e3efb3e89ab4650c3781703f9e5",onSlotchange:()=>this.handleSlotChange()}),i("button",{key:"6b2023939d94eb9f9822e25fd4facce715fdf227",class:"scroll-right-button "+(this.showRightScroll?"show":""),onClick:()=>this.scrollRight(),disabled:!this.showRightScroll},i("tds-icon",{key:"0b2626c78903ce14239891aa667a61ed913097ac",name:"chevron_right",size:"20px"}))))}get host(){return e(this)}static get watchers(){return{selectedIndex:["handleSelectedIndexUpdate"]}}};h.style=':host{box-sizing:border-box;display:flex;background-color:var(--tds-inline-tabs-background);position:relative}:host *{box-sizing:border-box}:host::after{content:" ";display:block;border-bottom:1px solid var(--tds-inline-tabs-horizontal-divider-background);opacity:var(--tds-inline-tabs-horizontal-divider-opacity);left:0;right:0;bottom:0;position:absolute}:host .wrapper{display:flex;flex-wrap:nowrap;white-space:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{right:0;z-index:1}:host .scroll-left-button{left:0;z-index:1}:host .scroll-right-button,:host .scroll-left-button{color:var(--tds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--tds-inline-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--tds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--tds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--tds-folder-tabs-scroll-btn-color)}';export{h as tds_inline_tabs}
|