@scania/tegel/dist/tegel/p-34acf548.entry.js

Tegel Design System

import{r as t,h as o,H as r,a as s}from"./p-9xxNGlso.js";import{g as e}from"./p-Cn4f8w1e.js";const a=class{constructor(o){t(this,o),this.noDropdownIcon=!1,this.selected=!1,this.open=!1,this.uuid=e(),this.handleSlottedItemClick=t=>{const o=t.target.tagName.toLowerCase();["a","button"].includes(o)&&(this.open=!1)}}onAnyClick(t){!t.composedPath().includes(this.host)&&(this.open=!1)}handleKeyDown(t){var o;"Escape"===t.key&&this.open&&(this.open=!1,null===(o=this.buttonEl)||void 0===o||o.focus())}toggleDropdown(){this.open=!this.open,this.open&&requestAnimationFrame((()=>{var t;const o="a, [tabindex='0']",r=(null===(t=this.host.shadowRoot)||void 0===t?void 0:t.querySelector(o))||this.host.querySelector(o);r instanceof HTMLElement&&r.focus()}))}render(){return o(r,{key:"81c477e45d3f6a4614c3928797f900fb9b64ffcc"},o("div",{key:"2b4a3509254a827fa6d300793b699e57ac36cd9a",class:{"state-open":this.open}},o("tds-header-item",{key:"4847e06a7b5fdf61642234f7179b01103e34fb38",class:"button",active:this.open,selected:this.selected},o("button",{key:"8cc7fed2a05c68f0026ef7d4c17400d85d6a40af",ref:t=>{this.buttonEl=t},"aria-expanded":`${this.open}`,"aria-controls":`launcher-${this.uuid}`,"aria-current":this.selected?"location":"false",onClick:()=>{this.toggleDropdown()},"aria-label":this.tdsAriaLabel},o("slot",{key:"8254bfb1f48d193bc0c58363df96fad41b61aad6",name:"icon"}),this.label,o("slot",{key:"5722ecd4748ad029b5b803bb4ff731cca119fc7b",name:"label"}),!this.noDropdownIcon&&o("tds-icon",{key:"c0c9c51b4705226891b21383ce27c0680113af7c",class:"dropdown-icon",name:"chevron_down",size:"16px",svgTitle:"Dropdown icon"}))),this.buttonEl&&o("tds-popover-canvas",{key:"52e127dbe4eef7082e62f3421d338fa0b44ab919",id:`tds-dropdown-${this.uuid}`,class:"menu",referenceEl:this.buttonEl,placement:"bottom-start",show:this.open,offsetDistance:0,modifiers:[{name:"flip",options:{fallbackPlacements:[]}}]},this.open?o("span",{onClick:t=>this.handleSlottedItemClick(t),onKeyDown:t=>"Enter"===t.key&&this.handleSlottedItemClick(t)},o("slot",null)):null)))}get host(){return s(this)}};a.style=":host,:root{--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{height:var(--tds-header-height);position:relative}:host .menu{flex-direction:column;overflow-y:auto;max-height:calc(100vh - var(--tds-header-height));box-shadow:var(--tds-nav-dropdown-menu-box);background-color:var(--tds-header-app-launcher-menu-background);border-top-right-radius:0;border-top-left-radius:0}:host .menu:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background-clip:padding-box}:host .menu::-webkit-scrollbar{width:var(--tds-scrollbar-width)}:host .menu::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}:host .menu::-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}:host .menu::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){:host .menu{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}:host .state-open .dropdown-icon{transform:rotate(180deg)}:host .state-open .button{position:relative;z-index:901}:host .state-open tds-header-item button:hover,:host .state-open tds-header-item a:hover{background-color:var(--tds-nav-item-background-hover);box-shadow:none}";export{a as tds_header_dropdown}