1import{r as i,L as s,x as c}from"./main-DdEGjCiE.js";import{e as u}from"./query-D1pSaKds.js";import{i as p}from"./is-mobile-D5iCr1X9.js";import{a as f}from"./light-dom-styles-BIHJ4wFY.js";const h=`/*------------------------------------*\\ 2 #RESET 3\\*------------------------------------*/ 4/** 5 * Border-Box http:/paulirish.com/2012/box-sizing-border-box-ftw/ 6 */ 7*, 8::slotted(*), 9*:before, 10*:after { 11 box-sizing: border-box; 12} 13 14:host *, 15:host *::before, 16:host *::after { 17 box-sizing: inherit; 18} 19 20[hidden] { 21 display: none !important; 22} 23 24:host { 25 border-bottom: var(--leaf-border-width-button-default) solid transparent; 26 display: inline-block; 27 margin: 0; 28 min-height: calc(var(--leaf-spacing-80) + var(--leaf-spacing-4)); 29 position: relative; 30} 31:host ::slotted([slot=nav-item]) { 32 align-items: center; 33 background-color: transparent; 34 border: 0; 35 color: var(--leaf-color-header-menu-content-default); 36 display: flex; 37 font-family: var(--leaf-typography-body-default-font-family); 38 font-size: var(--leaf-font-size-2); 39 font-weight: var(--leafdcws-font-weight-semibold); 40 height: 100%; 41 margin-inline: 0; 42 margin-top: 0; 43 padding: var(--leaf-spacing-12) var(--leaf-spacing-16); 44 text-decoration: none; 45} 46:host ::slotted([slot=nav-item]:focus) { 47 background: var(--leaf-color-header-menu-content-default); 48 color: var(--leaf-color-header-bg-default); 49 outline: none; 50} 51:host ::slotted([slot=nav-item]:active) { 52 background: var(--leaf-color-header-submenu-bg-pressed); 53 color: var(--leaf-color-header-menu-content-default); 54} 55:host [name=menu] { 56 visibility: hidden; 57 display: block; 58 position: absolute; 59 top: calc(100% + var(--leaf-border-width-button-default)); 60} 61:host [name=menu].dropdown-loaded { 62 display: none; 63 visibility: visible; 64} 65:host [name=menu]:hover, :host [name=menu]:focus, :host [name=menu].active { 66 display: block; 67 position: absolute; 68 top: calc(100% + var(--leaf-border-width-button-default)); 69} 70:host leaf-icon { 71 color: var(--leaf-color-header-menu-content-default); 72} 73 74:host(:hover) [name=menu], 75:host(:focus) [name=menu] { 76 display: block; 77 position: absolute; 78 top: calc(100% + var(--leaf-border-width-button-default)); 79} 80:host(:hover) [name=menu].left-menu-position, 81:host(:focus) [name=menu].left-menu-position { 82 right: 0; 83} 84 85:host(:hover), 86:host(.active) { 87 background: var(--leaf-color-header-submenu-bg-hover); 88 border-bottom: var(--leaf-border-width-button-default) solid var(--leaf-color-header-menu-content-default); 89}`,v=`tcg-header-dropdown:hover leaf-icon[name=keyboard-arrow-more], tcg-header-dropdown.active leaf-icon[name=keyboard-arrow-more] { 90 transform: rotate(180deg); 91} 92tcg-header-dropdown ul { 93 background: var(--leaf-color-header-bg-default); 94 border: var(--leaf-border-width-default) solid var(--leafdcws-header-dropdown-border-color); 95 border-radius: var(--leaf-spacing-8); 96 box-shadow: var(--leaf-shadow-default); 97 display: inline-block; 98 list-style: none; 99 margin: 0; 100 padding: 0; 101} 102tcg-header-dropdown ul li { 103 background: var(--leaf-color-header-bg-default); 104 display: block; 105 float: left; 106 font-size: var(--leaf-font-size-2); 107 margin: 0; 108 position: relative; 109 width: 100%; 110} 111tcg-header-dropdown ul li:first-child { 112 border-top-left-radius: var(--leaf-spacing-8); 113 border-top-right-radius: var(--leaf-spacing-8); 114 padding-top: var(--leaf-spacing-8); 115} 116tcg-header-dropdown ul li:last-child { 117 border-bottom-left-radius: var(--leaf-spacing-8); 118 border-bottom-right-radius: var(--leaf-spacing-8); 119 padding-bottom: var(--leaf-spacing-8); 120} 121tcg-header-dropdown ul li:hover > ul { 122 display: block; 123 left: 100%; 124 position: absolute; 125 top: calc(var(--leaf-spacing-8) * -1); 126} 127tcg-header-dropdown ul li:hover > ul.left-menu-position { 128 left: auto; 129 right: 100%; 130} 131tcg-header-dropdown ul li:hover li { 132 float: none; 133} 134tcg-header-dropdown ul li a:hover, tcg-header-dropdown ul li a.active, 135tcg-header-dropdown ul li button:hover, 136tcg-header-dropdown ul li button.active { 137 background: var(--leaf-color-header-submenu-bg-hover); 138} 139tcg-header-dropdown ul li a:focus, 140tcg-header-dropdown ul li button:focus { 141 background: var(--leaf-color-header-menu-content-default); 142 color: var(--leaf-color-header-bg-default); 143 outline: none; 144} 145tcg-header-dropdown ul li a:active, 146tcg-header-dropdown ul li button:active { 147 background: var(--leaf-color-header-submenu-bg-pressed); 148 color: var(--leaf-color-header-menu-content-default); 149} 150tcg-header-dropdown ul li button { 151 align-items: center; 152 display: flex; 153 gap: var(--leaf-spacing-8); 154} 155tcg-header-dropdown ul li ul { 156 visibility: hidden; 157 display: block; 158 left: 100%; 159 position: absolute; 160 top: calc(var(--leaf-spacing-8) * -1); 161} 162tcg-header-dropdown ul li ul.dropdown-loaded { 163 display: none; 164 visibility: visible; 165} 166tcg-header-dropdown ul li > ul.active:not([slot=menu]) { 167 display: block; 168 left: 100%; 169 position: absolute; 170 top: calc(var(--leaf-spacing-8) * -1); 171} 172tcg-header-dropdown ul li > ul.active:not([slot=menu]).left-menu-position { 173 left: auto; 174 right: 100%; 175} 176tcg-header-dropdown ul li:hover > ul { 177 display: block; 178 left: 100%; 179 position: absolute; 180 top: calc(var(--leaf-spacing-8) * -1); 181} 182tcg-header-dropdown ul li:hover > ul.left-menu-position { 183 left: auto; 184 right: 100%; 185} 186tcg-header-dropdown ul li:hover li { 187 float: none; 188} 189tcg-header-dropdown ul a, 190tcg-header-dropdown ul button { 191 background-color: transparent; 192 border: 0; 193 color: var(--leaf-color-header-menu-content-default); 194 display: block; 195 font-family: var(--leaf-typography-body-default-font-family); 196 font-size: var(--leaf-font-size-1); 197 font-weight: var(--leafdcws-font-weight-semibold); 198 padding: var(--leaf-spacing-8) var(--leaf-spacing-16); 199 text-align: left; 200 text-decoration: none; 201 white-space: nowrap; 202 width: 100%; 203}`;var g=Object.defineProperty,b=(t,e,o,m)=>{for(var n=void 0,a=t.length-1,r;a>=0;a--)(r=t[a])&&(n=r(e,o,n)||n);return n&&g(e,o,n),n};const d=class extends s{get dropdownSecondLevelMenuButtons(){return this.querySelectorAll('[slot="menu"] button')}get dropdownSecondLevelMenus(){return this.querySelectorAll('[slot="menu"] button + ul')}get dropdownButton(){return this.querySelector('button[slot="nav-item"]')}constructor(){super(),f("tcg-header-dropdown-styles",v)}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.openDropdownMenu),this.dropdownSecondLevelMenuButtons.forEach(e
203=>e.addEventListener("click",this.openDropdownSecondLevelMenu)),this.addEventListener("keydown",e=>{e.key==="Escape"&&(e.preventDefault(),this.resetDropdownMenu())}),window.addEventListener("resize",()=>this.requestUpdate())}resetDropdownMenuPosition(){this.dropdownMainMenu.classList.remove("left-menu-position"),this.dropdownMainMenu.classList.remove("dropdown-loaded"),this.dropdownSecondLevelMenus.forEach(e=>{e.classList.remove("left-menu-position"),e.classList.remove("dropdown-loaded"),setTimeout(()=>{window.innerWidth-e.getBoundingClientRect().right<=0&&e.classList.add("left-menu-position"),e.classList.add("dropdown-loaded")},100)}),setTimeout(()=>{window.innerWidth-this.dropdownMainMenu.getBoundingClientRect().right<=0&&this.dropdownMainMenu.classList.add("left-menu-position"),this.dropdownMainMenu.classList.add("dropdown-loaded")},100)}async updated(){await this.updateComplete,p("lg")||this.resetDropdownMenuPosition()}resetDropdownMenu(){this.classList.contains("active")&&(this.querySelectorAll(".active").forEach(e=>e.classList.remove("active")),this.querySelectorAll("[aria-expanded]").forEach(e=>e.setAttribute("aria-expanded","false")),this.dropdownMainMenu.classList.remove("active"),this.classList.remove("active"),this.dropdownButton.focus())}openDropdownMenu(){event&&event.target===this.dropdownButton&&(this.dropdownButton.setAttribute("aria-expanded","true"),this.dropdownMainMenu.classList.toggle("active"),this.classList.toggle("active"))}openDropdownSecondLevelMenu(){if(event&&event.target){const e=event.target,o=e.nextElementSibling;o&&e&&(e.setAttribute("aria-expanded","true"),e.classList.toggle("active"),o.classList.toggle("active"))}}render(){return c` 204 <slot name="nav-item"></slot> 205 <slot name="menu"></slot> 206 `}};d.styles=i(h);let l=d;b([u('slot[name="menu"]')],l.prototype,"dropdownMainMenu");customElements.define("tcg-header-dropdown",l);export{l as TCGHeaderDropdown}; 207//# sourceMappingURL=header-dropdown-DIwFjAp_.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.