npm - @itcenteratunihelsinki/huds-lib - Versions diffs - 0.8.61 → 0.8.63 - Mend

@itcenteratunihelsinki/huds-lib 0.8.61 → 0.8.63

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.

Files changed (44) hide show

package/dist/huds-lib/hy-menu-main-group.entry.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{r as e,c as i,h as o,H as n,g as a}from"./index-f84f2a7d.js";import{C as t,S as r}from"./utils-7438924c.js";import{j as l}from"./globalScript-5a4b7abf.js";const s=':root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}:host(.menu--main-group){-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;margin-left:28px}@media (min-width: 75.0625rem){:host(.menu--main-group){margin-right:auto}}.menu--main-group__toggle{font-size:0.875rem;line-height:16px;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--grayscale-black);border:0 none;color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;font-family:var(--main-font-family);letter-spacing:-0.44px;margin:0 -4px;padding:0;position:relative}.menu--main-group__toggle:focus{outline:none}.menu--main-group__toggle:hover{cursor:pointer}.menu--main-group__toggle:hover span{color:var(--grayscale-medium)}.menu--main-group__toggle:hover svg{fill:var(--grayscale-medium)}@media (min-width: 60rem){.menu--main-group__toggle .toggle__caret svg{height:15.27px;width:3px}}@media (min-width: 75.0625rem){.menu--main-group__toggle .toggle__caret svg{height:14px;width:3px}}@media (min-width: 60rem){.menu--main-group__toggle span{margin-left:17px}}.menu--main-group__toggle.is-open:after{border-bottom:3px solid white;bottom:-10px;content:" ";position:absolute;width:100%}@media (min-width: 60rem){.menu--main-group__toggle.is-open .toggle__close{height:15px;width:15px}.menu--main-group__toggle.is-open .toggle__close svg{height:15px;width:15px}}@media (min-width: 60rem){.menu--main-group__toggle.is-open span{margin-left:10px}}.menu--main-group__dropdown{display:none;visibility:hidden}.menu--main-group__dropdown.is-open{background-color:var(--grayscale-black);border-radius:0 0 5px 5px;-webkit-box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);left:0;margin:0;padding:6px 0 20px;position:absolute;top:0;visibility:visible;width:100%;z-index:511}.menu--main-group__dropdown.is-open .list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;justify-items:center;padding-top:14px;position:relative}.menu--main-group__dropdown.is-open .panel-toggle{background-color:transparent;border:none;position:absolute;right:0;top:0}@media (min-width: 60rem){.menu--main-group__dropdown.is-open .panel-toggle{padding:26px 32px}}.menu--main-group__dropdown.is-open .panel-toggle__label{font-size:1rem;line-height:20px;font-weight:700;color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);letter-spacing:-0.5px;text-transform:uppercase}.menu--main-group__dropdown.is-open .panel-toggle__label__title{padding-right:12px}.menu--main-group__dropdown.is-open .panel-toggle__label:hover{cursor:pointer}.menu--main-group__dropdown.is-open .panel-toggle__label:hover span{color:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .panel-toggle__label:hover svg{fill:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu-main-link{font-size:1rem;line-height:20px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin-bottom:20px;text-decoration:none}@media (min-width: 75.0625rem){.menu--main-group__dropdown.is-open .menu-main-link{font-size:0.875rem;line-height:18px}}.menu--main-group__dropdown.is-open .menu-main-link:hover span{color:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu-main-link:hover svg{fill:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu--main-group__label{color:var(--grayscale-white);margin-left:12px}:host(.menu--main-group--mobile){-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;position:relative}.menu--main-group__mobile-toggle{border:none;background:transparent;padding:15px 12px}.menu--main-group__mobile-toggle:hover{cursor:pointer}.menu--main-group__dropdown__top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:23px}.menu--main-group__dropdown__close{border:none;background-color:transparent;padding:0;margin:0}.menu--main-group__dropdown__close:hover{cursor:pointer}.menu--main-group__logo-container .hy-site-logo__label.group{max-width:250px}.menu--main-group__dropdown__items{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.menu--main-group__dropdown__items .menu-main-link{font-size:0.9375rem;line-height:20px;background-color:var(--grayscale-dark-text);color:var(--grayscale-white);font-family:var(--main-font-family);letter-spacing:-0.5px;margin-bottom:8px;padding:14px 20px;text-decoration:none;width:100%}.menu--main-group__dropdown__items .menu-main-link:hover{text-decoration:underline}.menu--main-group__dropdown__donate{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--grayscale-dark-text);position:fixed;bottom:0;margin-left:-20px;width:100%}.menu--main-group__dropdown__donate .hy-link__donate.group{font-size:1rem;line-height:16px;font-weight:600;display:-webkit-box;display:-ms-flexbox;display:flex;color:var(--grayscale-white);font-family:var(--main-font-family);margin:20px auto 16px auto;text-decoration:none}.menu--main-group__dropdown__donate .hy-link__donate.group .hy-link__donate__label{margin-left:6px}.menu--main-group__dropdown--mobile{-webkit-box-direction:normal;-webkit-box-orient:vertical;background-color:var(--grayscale-black);bottom:0px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;justify-items:space-between;max-width:400px;overflow:hidden;padding:0px;place-items:stretch;position:fixed;right:0px;top:0px;-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all 0.3s ease 0s;transition:all 0.3s ease 0s;visibility:hidden;width:0px}.menu--main-group__dropdown--mobile.is-open{padding:50px 20px 20px;-webkit-transform:translateX(0px);transform:translateX(0px);-webkit-transition:-webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:-webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:transform 0.3s cubic-bezier(0, 0, 0.3, 1), -webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);visibility:visible;width:90%;z-index:101}.menu--main-group__dropdown--mobile.is-open::after{opacity:1;visibility:visible}';let m={enter:"Enter"};const p=class{constructor(o){e(this,o);this.universityMainMenuToggled=i(this,"universityMainMenuToggled",7);this.mobileMenuTopToggle=i(this,"mobileMenuTopToggle",7);this.menuLabel="University main menu";this.menuLabelClose="Close";this.dataMainMenu=undefined;this.isMobile=false;this.logoUrl=undefined;this.logoLabel=undefined;this.siteLabel=undefined;this.siteUrl=undefined;this.donate=undefined;this.isMenuOpen=false}handleComponentClick(e){e.stopPropagation();this.emitEvent();this.isMenuOpen=!this.isMenuOpen;if(this.isMenuOpen){this.adjustMainMenuPosition(e.target)}}handleComponentKeyDown(e){e.stopPropagation();const i=e.code;let o=e.target;if(i==="Escape"&&this.isMenuOpen){this.isMenuOpen=false;this.emitEvent()}if(o&&[m.enter].includes(i)){this.isMenuOpen=!this.isMenuOpen;if(this.isMenuOpen){this.emitEvent();this.adjustMainMenuPosition(o)}}}emitEvent(){this.universityMainMenuToggled.emit();this.mobileMenuTopToggle.emit()}adjustMainMenuPosition(e){let i=this.el.closest(".hy-site-header__content-top");if(i&&!i.hasAttribute("is-mobile")){let o=e.shadowRoot.querySelector(".menu--main-group__toggle");let n=e.shadowRoot.querySelector(".menu--main-group__dropdown");let a=e.shadowRoot.querySelector(".list");if(n&&a&&o){let e=i.getBoundingClientRect();let t=o.getBoundingClientRect();n.style.top=`${e.height}px`;a.style.left=`${t.left}px`}let t=i.offsetHeight+270;this.showBackdropShadow("open",t)}}showBackdropShadow(e="close",i=0){let o=this.el.closest(".hy-site-header");let n=o.children[0];if(n){if(e==="open"){let e=window.outerHeight-i;n.style.height=`${e}px`;n.style.top=`${i}px`;n.style.position="absolute";n.classList.add("is-active")}else{n.removeAttribute("style");n.classList.remove("is-active")}}}async componentWillLoad(){this._dataMainMenu=await l(this.dataMainMenu)}handleTopMenuClose(e){this.isMenuOpen=false;this.mobileMenuTopToggle.emit();this.showBackdropShadow();e.stopPropagation()}handleOutsideMenuClick(e){if(this.isMenuOpen){this.isMenuOpen=false;this.handleTopMenuClose(e)}e.stopPropagation()}desktopMenuToggled(){this.isMenuOpen=false}searchPanelToggled(){this.isMenuOpen=false}languageMenuToggled(){this.isMenuOpen=false}render(){const e="var(--grayscale-white)";const i=this.isMobile?r.small:r.small;const a=t.white;return this.isMobile?o(n,{class:{"menu--main-group--mobile":true,"menu--main-group--mobile__is-open":this.isMenuOpen}},o("button",{"aria-label":this.menuLabel,class:{"menu--main-group__mobile-toggle":true,"is-open":this.isMenuOpen}},o("hy-icon",{icon:"hy-icon-slim-hamburger-menu",size:20,fill:e})),o("nav",{role:"navigation","aria-hidden":this.isMenuOpen?"false":"true",class:{"menu--main-group__dropdown--mobile":true,"is-open":this.isMenuOpen}},o("div",{class:"menu--main-group__dropdown__top"},o("div",{class:"menu--main-group__logo-container",id:"menu-logo"},o("hy-site-logo",{"is-group":true,size:i,color:a,url:this.siteUrl,label:this.siteLabel})),o("button",{"aria-label":`Close ${this.menuLabel}`,class:"menu--main-group__dropdown__close",onClick:e=>this.handleTopMenuClose(e)},o("hy-icon",{icon:"hy-icon-remove",size:20,fill:e}))),o("div",{class:"menu--main-group__dropdown__items"},this._dataMainMenu.map((e=>o("a",{href:e.url,class:{"menu-main-link":true}},o("span",{class:"menu--main-group__label"},e.label))))),o("div",{class:"menu--main-group__dropdown__donate"},this.donate&&this.donate.map((e=>o("a",{class:"menu--secondary__item hy-link__donate group",href:e.url},o("hy-icon",{icon:"hy-icon-heart-support",size:14,fill:a}),o("span",{class:"hy-link__donate__label group"},e.label))))))):o(n,{class:{"menu--main-group":true,"menu--main-group__is-open":this.isMenuOpen}},o("button",{class:{"menu--main-group__toggle":true,"is-open":this.isMenuOpen},"aria-expanded":this.isMenuOpen?"true":"false","aria-haspopup":"menu"},this.isMenuOpen?o("hy-icon",{class:"toggle__close",icon:"hy-icon-remove",size:8,fill:e}):o("hy-icon",{class:"toggle__caret",icon:"hy-icon-slim-hamburger-menu",size:8,fill:e}),o("span",null,this.menuLabel)),o("div",{class:{"menu--main-group__dropdown":true,"is-open":this.isMenuOpen}},o("div",{class:"list"},this._dataMainMenu.map((i=>o("a",{href:i.url,class:{"menu-main-link":true}},o("span",{class:"heading-icon"},o("hy-icon",{icon:"hy-icon-caret-right",size:10,fill:e})),o("span",{class:"menu--main-group__label"},i.label))))),o("button",{onClick:e=>this.handleComponentClick(e),class:{"panel-toggle":true},"aria-label":"Close menu"},o("span",{class:"panel-toggle__label"},o("span",{class:"panel-toggle__label__title"},this.menuLabelClose),o("hy-icon",{icon:"hy-icon-remove",size:20,fill:t.white})))))}get el(){return a(this)}};p.style=s;export{p as hy_menu_main_group};
+import{r as e,c as i,h as o,H as n,g as a}from"./index-f84f2a7d.js";import{C as t,S as r}from"./utils-7438924c.js";import{j as l}from"./globalScript-5a4b7abf.js";const s=':root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}:host(.menu--main-group){-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;margin-left:28px}@media (min-width: 75.0625rem){:host(.menu--main-group){margin-right:auto}}.menu--main-group__toggle{font-size:0.875rem;line-height:16px;font-weight:600;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--grayscale-black);border:0 none;color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;font-family:var(--main-font-family);letter-spacing:-0.44px;margin:0 -4px;padding:0;position:relative}.menu--main-group__toggle:focus{outline:none}.menu--main-group__toggle:hover{cursor:pointer}.menu--main-group__toggle:hover span{color:var(--grayscale-medium)}.menu--main-group__toggle:hover svg{fill:var(--grayscale-medium)}@media (min-width: 60rem){.menu--main-group__toggle .toggle__caret svg{height:15.27px;width:3px}}@media (min-width: 75.0625rem){.menu--main-group__toggle .toggle__caret svg{height:14px;width:3px}}@media (min-width: 60rem){.menu--main-group__toggle span{margin-left:17px}}.menu--main-group__toggle.is-open:after{border-bottom:3px solid white;bottom:-10px;content:" ";position:absolute;width:100%}@media (min-width: 60rem){.menu--main-group__toggle.is-open .toggle__close{height:15px;width:15px}.menu--main-group__toggle.is-open .toggle__close svg{height:15px;width:15px}}@media (min-width: 60rem){.menu--main-group__toggle.is-open span{margin-left:10px}}.menu--main-group__dropdown{display:none;visibility:hidden}.menu--main-group__dropdown.is-open{background-color:var(--grayscale-black);border-radius:0 0 5px 5px;-webkit-box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);left:0;margin:0;padding:6px 0 20px;position:absolute;top:0;visibility:visible;width:100%;z-index:511}.menu--main-group__dropdown.is-open .list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;justify-items:center;padding-top:14px;position:relative}.menu--main-group__dropdown.is-open .panel-toggle{background-color:transparent;border:none;position:absolute;right:0;top:0}@media (min-width: 60rem){.menu--main-group__dropdown.is-open .panel-toggle{padding:26px 32px}}.menu--main-group__dropdown.is-open .panel-toggle__label{font-size:1rem;line-height:20px;font-weight:700;color:var(--grayscale-white);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);letter-spacing:-0.5px;text-transform:uppercase}.menu--main-group__dropdown.is-open .panel-toggle__label__title{padding-right:12px}.menu--main-group__dropdown.is-open .panel-toggle__label:hover{cursor:pointer}.menu--main-group__dropdown.is-open .panel-toggle__label:hover span{color:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .panel-toggle__label:hover svg{fill:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu-main-link{font-size:1rem;line-height:20px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin-bottom:20px;text-decoration:none}@media (min-width: 75.0625rem){.menu--main-group__dropdown.is-open .menu-main-link{font-size:0.875rem;line-height:18px}}.menu--main-group__dropdown.is-open .menu-main-link:hover span{color:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu-main-link:hover svg{fill:var(--grayscale-medium)}.menu--main-group__dropdown.is-open .menu--main-group__label{color:var(--grayscale-white);margin-left:12px}:host(.menu--main-group--mobile){-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row;flex-flow:row;position:relative}.menu--main-group__mobile-toggle{border:none;background:transparent;padding:15px 12px}.menu--main-group__mobile-toggle:hover{cursor:pointer}.menu--main-group__dropdown__top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:23px}.menu--main-group__dropdown__close{border:none;background-color:transparent;padding:0;margin:0}.menu--main-group__dropdown__close:hover{cursor:pointer}.menu--main-group__logo-container .hy-site-logo__label.group{max-width:250px}.menu--main-group__dropdown__items{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.menu--main-group__dropdown__items .menu-main-link{font-size:0.9375rem;line-height:20px;background-color:var(--grayscale-dark-text);color:var(--grayscale-white);font-family:var(--main-font-family);letter-spacing:-0.5px;margin-bottom:8px;padding:14px 20px;text-decoration:none;width:100%}.menu--main-group__dropdown__items .menu-main-link:hover{text-decoration:underline}.menu--main-group__dropdown__donate{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--grayscale-dark-text);position:fixed;bottom:0;margin-left:-20px;width:100%}.menu--main-group__dropdown__donate .hy-link__donate.group{font-size:1rem;line-height:16px;font-weight:600;display:-webkit-box;display:-ms-flexbox;display:flex;color:var(--grayscale-white);font-family:var(--main-font-family);margin:20px auto 16px auto;text-decoration:none}.menu--main-group__dropdown__donate .hy-link__donate.group .hy-link__donate__label{margin-left:6px}.menu--main-group__dropdown--mobile{-webkit-box-direction:normal;-webkit-box-orient:vertical;background-color:var(--grayscale-black);bottom:0px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;justify-items:space-between;max-width:400px;overflow:hidden;padding:0px;place-items:stretch;position:fixed;right:0px;top:0px;-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all 0.3s ease 0s;transition:all 0.3s ease 0s;visibility:hidden;width:0px}.menu--main-group__dropdown--mobile.is-open{padding:50px 20px 20px;-webkit-transform:translateX(0px);transform:translateX(0px);-webkit-transition:-webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:-webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:transform 0.3s cubic-bezier(0, 0, 0.3, 1);transition:transform 0.3s cubic-bezier(0, 0, 0.3, 1), -webkit-transform 0.3s cubic-bezier(0, 0, 0.3, 1);visibility:visible;width:90%;z-index:101}.menu--main-group__dropdown--mobile.is-open::after{opacity:1;visibility:visible}';let m={enter:"Enter"};const p=class{constructor(o){e(this,o);this.universityMainMenuToggled=i(this,"universityMainMenuToggled",7);this.mobileMenuTopToggle=i(this,"mobileMenuTopToggle",7);this.menuLabel="University main menu";this.menuLabelClose="Close";this.dataMainMenu=undefined;this.isMobile=false;this.logoUrl=undefined;this.logoLabel=undefined;this.siteLabel=undefined;this.siteUrl=undefined;this.donate=undefined;this.isMenuOpen=false}async componentWillLoad(){this._dataMainMenu=await l(this.dataMainMenu)}handleComponentClick(e){this.isMenuOpen=!this.isMenuOpen;this.emitEvent();if(this.isMenuOpen){this.adjustMainMenuPosition(e.target)}if(!this.isMenuOpen){this.showBackdropShadow("close")}e.stopPropagation()}handleComponentKeyDown(e){e.stopPropagation();const i=e.code;let o=e.target;if(i==="Escape"&&this.isMenuOpen){this.isMenuOpen=false;this.emitEvent()}if(o&&[m.enter].includes(i)){this.isMenuOpen=!this.isMenuOpen;if(this.isMenuOpen){this.emitEvent();this.adjustMainMenuPosition(o)}}}handleOutsideMenuClick(e){if(this.isMenuOpen){this.isMenuOpen=false;this.handleTopMenuClose(e)}e.stopPropagation()}emitEvent(){this.universityMainMenuToggled.emit();this.mobileMenuTopToggle.emit()}adjustMainMenuPosition(e){let i=this.el.closest(".hy-site-header__content-top");if(i&&!i.hasAttribute("is-mobile")){let o=e.shadowRoot.querySelector(".menu--main-group__toggle");let n=e.shadowRoot.querySelector(".menu--main-group__dropdown");let a=e.shadowRoot.querySelector(".list");if(n&&a&&o){let e=i.getBoundingClientRect();let t=o.getBoundingClientRect();n.style.top=`${e.height}px`;a.style.left=`${t.left}px`}let t=i.offsetHeight+270;this.showBackdropShadow("open",t)}}showBackdropShadow(e="close",i=0){let o=this.el.closest(".hy-site-header");let n=o.children[0];if(n){if(e==="open"){let e=window.outerHeight-i;n.style.height=`${e}px`;n.style.top=`${i}px`;n.style.position="absolute";n.classList.add("is-active")}else{n.removeAttribute("style");n.classList.remove("is-active")}}}handleTopMenuClose(e){this.isMenuOpen=false;this.mobileMenuTopToggle.emit();this.showBackdropShadow("close");e.stopPropagation()}render(){const e="var(--grayscale-white)";const i=this.isMobile?r.small:r.small;const a=t.white;return this.isMobile?o(n,{class:{"menu--main-group--mobile":true,"menu--main-group--mobile__is-open":this.isMenuOpen}},o("button",{"aria-label":this.menuLabel,class:{"menu--main-group__mobile-toggle":true,"is-open":this.isMenuOpen}},o("hy-icon",{icon:"hy-icon-slim-hamburger-menu",size:20,fill:e})),o("nav",{role:"navigation","aria-hidden":this.isMenuOpen?"false":"true",class:{"menu--main-group__dropdown--mobile":true,"is-open":this.isMenuOpen}},o("div",{class:"menu--main-group__dropdown__top"},o("div",{class:"menu--main-group__logo-container",id:"menu-logo"},o("hy-site-logo",{"is-group":true,size:i,color:a,url:this.siteUrl,label:this.siteLabel})),o("button",{"aria-label":`Close ${this.menuLabel}`,class:"menu--main-group__dropdown__close",onClick:e=>this.handleTopMenuClose(e)},o("hy-icon",{icon:"hy-icon-remove",size:20,fill:e}))),o("div",{class:"menu--main-group__dropdown__items"},this._dataMainMenu.map((e=>o("a",{href:e.url,class:{"menu-main-link":true}},o("span",{class:"menu--main-group__label"},e.label))))),o("div",{class:"menu--main-group__dropdown__donate"},this.donate&&this.donate.map((e=>o("a",{class:"menu--secondary__item hy-link__donate group",href:e.url},o("hy-icon",{icon:"hy-icon-heart-support",size:14,fill:a}),o("span",{class:"hy-link__donate__label group"},e.label))))))):o(n,{class:{"menu--main-group":true,"menu--main-group__is-open":this.isMenuOpen}},o("button",{class:{"menu--main-group__toggle":true,"is-open":this.isMenuOpen},"aria-expanded":this.isMenuOpen?"true":"false","aria-haspopup":"menu"},this.isMenuOpen?o("hy-icon",{class:"toggle__close",icon:"hy-icon-remove",size:8,fill:e}):o("hy-icon",{class:"toggle__caret",icon:"hy-icon-slim-hamburger-menu",size:8,fill:e}),o("span",null,this.menuLabel)),o("div",{class:{"menu--main-group__dropdown":true,"is-open":this.isMenuOpen}},o("div",{class:"list"},this._dataMainMenu.map((i=>o("a",{href:i.url,class:{"menu-main-link":true}},o("span",{class:"heading-icon"},o("hy-icon",{icon:"hy-icon-caret-right",size:10,fill:e})),o("span",{class:"menu--main-group__label"},i.label))))),o("button",{onClick:e=>this.handleComponentClick(e),class:{"panel-toggle":true},"aria-label":"Close menu"},o("span",{class:"panel-toggle__label"},o("span",{class:"panel-toggle__label__title"},this.menuLabelClose),o("hy-icon",{icon:"hy-icon-remove",size:20,fill:t.white})))))}get el(){return a(this)}};p.style=s;export{p as hy_menu_main_group};
 //# sourceMappingURL=hy-menu-main-group.entry.js.map

package/dist/huds-lib/hy-menu-main-group.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["hyMenuMainGroupCss","keys","enter","HyMenuMainGroup","handleComponentClick","event","stopPropagation","this","emitEvent","isMenuOpen","adjustMainMenuPosition","target","handleComponentKeyDown","key","code","includes","universityMainMenuToggled","emit","mobileMenuTopToggle","hyTopHeader","el","closest","hasAttribute","mainMenuToggle","shadowRoot","querySelector","mainMenuDropdown","mainMenuList","rectHeader","getBoundingClientRect","rectMenuToggle","style","top","height","left","headerHeight","offsetHeight","showBackdropShadow","state","hyHeader","hyBackdropDiv","children","me","window","outerHeight","position","classList","add","removeAttribute","remove","async","_dataMainMenu","jsonParserWorker","dataMainMenu","handleTopMenuClose","handleOutsideMenuClick","desktopMenuToggled","searchPanelToggled","languageMenuToggled","render","white","logoSizeGroup","isMobile","SiteLogoSize","small","logoColorGroup","ColorVariant","h","Host","class","menuLabel","icon","size","fill","role","id","color","url","siteUrl","label","siteLabel","onClick","e","map","item","href","donate","i","menuLabelClose"],"sources":["./src/components/hy-navigation/hy-menu-main-group/hy-menu-main-group.scss?tag=hy-menu-main-group&encapsulation=shadow","./src/components/hy-navigation/hy-menu-main-group/hy-menu-main-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n:host(.menu--main-group) {\n align-items: center;\n display: flex;\n flex-flow: row;\n margin-left: 28px;\n\n @include breakpoint($extrawide) {\n margin-right: auto;\n }\n}\n\n.menu--main-group__toggle {\n @include font-size(14px, 16px);\n @include font-weight($semibold);\n align-items: center;\n background: var(--grayscale-black);\n border: 0 none;\n color: var(--grayscale-white);\n display: flex;\n flex-flow: row;\n font-family: var(--main-font-family);\n letter-spacing: -0.44px;\n margin: 0 -4px;\n padding: 0;\n position: relative;\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n cursor: pointer;\n\n span {\n color: var(--grayscale-medium);\n }\n\n svg {\n fill: var(--grayscale-medium);\n }\n }\n\n .toggle__caret {\n svg {\n @include breakpoint($wide) {\n height: 15.27px;\n width: 3px;\n }\n @include breakpoint($extrawide) {\n height: 14px;\n width: 3px;\n }\n }\n }\n\n span {\n @include breakpoint($wide) {\n margin-left: 17px;\n }\n }\n\n &.is-open {\n &:after {\n border-bottom: 3px solid white;\n bottom: -10px;\n content: \" \";\n position: absolute;\n width: 100%;\n }\n\n .toggle__close {\n @include breakpoint($wide) {\n height: 15px;\n width: 15px;\n\n svg {\n height: 15px;\n width: 15px;\n }\n }\n }\n\n span {\n @include breakpoint($wide) {\n margin-left: 10px;\n }\n }\n }\n}\n\n.menu--main-group__dropdown {\n display: none;\n visibility: hidden;\n\n &.is-open {\n background-color: var(--grayscale-black);\n border-radius: 0 0 5px 5px;\n box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);\n color: var(--grayscale-white);\n display: flex;\n font-family: var(--main-font-family);\n left: 0;\n margin: 0;\n padding: 6px 0 20px;\n position: absolute;\n top: 0;\n visibility: visible;\n width: 100%;\n z-index: 511;\n\n .list {\n display: flex;\n flex-flow: column;\n justify-items: center;\n padding-top: 14px;\n position: relative;\n }\n\n .panel-toggle {\n background-color: transparent;\n border: none;\n position: absolute;\n right: 0;\n top: 0;\n\n @include breakpoint($wide) {\n padding: 26px 32px;\n }\n\n &__label {\n @include font-size(16px, 20px);\n @include font-weight($bold);\n color: var(--grayscale-white);\n display: flex;\n font-family: var(--main-font-family);\n letter-spacing: -0.5px;\n text-transform: uppercase;\n\n &__title {\n padding-right: 12px;\n }\n\n &:hover {\n cursor: pointer;\n span {\n color: var(--grayscale-medium);\n }\n svg {\n fill: var(--grayscale-medium);\n }\n }\n }\n }\n\n .menu-main-link {\n @include font-size(16px, 20px);\n align-items: center;\n display: flex;\n font-family: var(--main-font-family);\n flex-direction: row;\n margin-bottom: 20px;\n text-decoration: none;\n\n @include breakpoint($extrawide) {\n @include font-size(14px, 18px);\n }\n\n &:hover {\n span {\n color: var(--grayscale-medium);\n }\n svg {\n fill: var(--grayscale-medium);\n }\n }\n }\n .menu--main-group__label {\n color: var(--grayscale-white);\n margin-left: 12px;\n }\n }\n}\n\n:host(.menu--main-group--mobile) {\n align-items: center;\n display: flex;\n flex-flow: row;\n position: relative;\n}\n\n.menu--main-group__mobile-toggle {\n border: none;\n background: transparent;\n padding: 15px 12px;\n\n &:hover {\n cursor: pointer;\n }\n}\n\n.menu--main-group__dropdown__top {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n margin-bottom: 23px;\n}\n\n.menu--main-group__dropdown__close {\n border: none;\n background-color: transparent;\n padding: 0;\n margin: 0;\n\n &:hover {\n cursor: pointer;\n }\n}\n\n.menu--main-group__logo-container .hy-site-logo__label.group {\n max-width: 250px;\n}\n\n.menu--main-group__dropdown__items {\n display: flex;\n flex-direction: column;\n\n .menu-main-link {\n @include font-size(15px, 20px);\n\n background-color: var(--grayscale-dark-text);\n color: var(--grayscale-white);\n font-family: var(--main-font-family);\n letter-spacing: -0.5px;\n margin-bottom: 8px;\n padding: 14px 20px;\n text-decoration: none;\n width: 100%;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n.menu--main-group__dropdown__donate {\n display: flex;\n flex-direction: row;\n justify-content: center;\n background-color: var(--grayscale-dark-text);\n position: fixed;\n bottom: 0;\n margin-left: -20px;\n width: 100%;\n\n .hy-link__donate.group {\n @include font-size(16px, 16px);\n @include font-weight($semibold);\n\n display: flex;\n color: var(--grayscale-white);\n font-family: var(--main-font-family);\n margin: 20px auto 16px auto;\n text-decoration: none;\n\n .hy-link__donate__label {\n margin-left: 6px;\n }\n }\n}\n\n.menu--main-group__dropdown--mobile {\n -webkit-box-direction: normal;\n -webkit-box-orient: vertical;\n background-color: var(--grayscale-black);\n bottom: 0px;\n display: flex;\n flex-direction: column;\n justify-items: space-between;\n max-width: 400px;\n overflow: hidden;\n padding: 0px;\n place-items: stretch;\n position: fixed;\n right: 0px;\n top: 0px;\n transform: translateX(100%);\n transition: all 0.3s ease 0s;\n visibility: hidden;\n width: 0px;\n\n &.is-open {\n padding: 50px 20px 20px;\n transform: translateX(0px);\n transition: transform 0.3s cubic-bezier(0, 0, 0.3, 1);\n visibility: visible;\n width: 90%;\n z-index: 101;\n\n &::after {\n opacity: 1;\n visibility: visible;\n }\n }\n}\n","export interface MainMenu {\n label: string;\n url: string;\n menuLinkId: string;\n}\n\nexport interface DonateLink {\n url: string;\n label: string;\n}\n\nimport {Component, Host, h, Element, Prop, State, Listen, Event, EventEmitter} from \"@stencil/core\";\nimport {ColorVariant, SiteLogoSize} from \"../../../utils/utils\";\nimport {jsonParserWorker} from \"../../../global/globalScript\";\n\nlet keys = {\n enter: \"Enter\",\n};\n\n@Component({\n tag: \"hy-menu-main-group\",\n styleUrl: \"hy-menu-main-group.scss\",\n shadow: true,\n})\nexport class HyMenuMainGroup {\n @Element() el: HTMLElement;\n @Prop() menuLabel: string = \"University main menu\";\n @Prop() menuLabelClose: string = \"Close\";\n @Prop() dataMainMenu: MainMenu[] \| string;\n @Prop() isMobile: boolean = false;\n @Prop() logoUrl?: string;\n @Prop() logoLabel?: string;\n @Prop() siteLabel?: string;\n @Prop() siteUrl?: string;\n @Prop() donate: DonateLink[];\n @State() isMenuOpen: boolean = false;\n\n @Event() universityMainMenuToggled: EventEmitter;\n @Event() mobileMenuTopToggle: EventEmitter;\n\n private _dataMainMenu: MainMenu[];\n\n @Listen(\"click\", {capture: true})\n handleComponentClick(event) {\n event.stopPropagation();\n this.emitEvent();\n\n this.isMenuOpen = !this.isMenuOpen;\n if (this.isMenuOpen) {\n this.adjustMainMenuPosition(event.target);\n }\n }\n\n @Listen(\"keydown\")\n handleComponentKeyDown(event: KeyboardEvent) {\n event.stopPropagation();\n const key = event.code;\n let target = event.target as HTMLButtonElement;\n\n if (key === \"Escape\" && this.isMenuOpen) {\n this.isMenuOpen = false;\n this.emitEvent();\n }\n\n if (target && [keys.enter].includes(key)) {\n this.isMenuOpen = !this.isMenuOpen;\n\n if (this.isMenuOpen) {\n this.emitEvent();\n this.adjustMainMenuPosition(target);\n }\n }\n }\n\n emitEvent() {\n // Close other panels if they are open (lang menu, search, main menu, ..).\n this.universityMainMenuToggled.emit();\n this.mobileMenuTopToggle.emit();\n }\n\n adjustMainMenuPosition(target) {\n let hyTopHeader = this.el.closest(\".hy-site-header__content-top\") as HTMLElement;\n\n if (hyTopHeader && !hyTopHeader.hasAttribute(\"is-mobile\")) {\n let mainMenuToggle = target.shadowRoot.querySelector(\".menu--main-group__toggle\") as HTMLElement;\n let mainMenuDropdown = target.shadowRoot.querySelector(\".menu--main-group__dropdown\") as HTMLElement;\n let mainMenuList = target.shadowRoot.querySelector(\".list\") as HTMLElement;\n if (mainMenuDropdown && mainMenuList && mainMenuToggle) {\n let rectHeader = hyTopHeader.getBoundingClientRect();\n let rectMenuToggle = mainMenuToggle.getBoundingClientRect();\n mainMenuDropdown.style.top = `${rectHeader.height}px`;\n\n mainMenuList.style.left = `${rectMenuToggle.left}px`;\n }\n let headerHeight = hyTopHeader.offsetHeight + 270;\n\n this.showBackdropShadow(\"open\", headerHeight);\n }\n }\n\n showBackdropShadow(state = \"close\", top = 0) {\n let hyHeader = this.el.closest(\".hy-site-header\") as HTMLElement;\n let hyBackdropDiv = hyHeader.children[0] as HTMLElement;\n\n if (hyBackdropDiv) {\n if (state === \"open\") {\n let me = window.outerHeight - top;\n hyBackdropDiv.style.height = `${me}px`;\n hyBackdropDiv.style.top = `${top}px`;\n hyBackdropDiv.style.position = \"absolute\";\n hyBackdropDiv.classList.add(\"is-active\");\n } else {\n hyBackdropDiv.removeAttribute(\"style\");\n hyBackdropDiv.classList.remove(\"is-active\");\n }\n }\n }\n\n async componentWillLoad() {\n this._dataMainMenu = await jsonParserWorker(this.dataMainMenu);\n }\n\n handleTopMenuClose(event) {\n this.isMenuOpen = false;\n this.mobileMenuTopToggle.emit();\n this.showBackdropShadow();\n event.stopPropagation();\n }\n\n // Close the University main menu if user clicks anywhere outside the component.\n @Listen(\"click\", {target: \"window\"})\n @Listen(\"headerScrollDown\", {target: \"window\"})\n @Listen(\"headerScrollUp\", {target: \"window\"})\n handleOutsideMenuClick(event) {\n if (this.isMenuOpen) {\n this.isMenuOpen = false;\n this.handleTopMenuClose(event);\n }\n event.stopPropagation();\n }\n\n // CLose the University main menu if user opens the desktop menu panel.\n @Listen(\"menuDesktopToggled\", {target: \"document\"})\n desktopMenuToggled() {\n this.isMenuOpen = false;\n }\n\n // CLose the University main menu if user opens the search panel\n @Listen(\"searchPanelToggled\", {target: \"document\"})\n searchPanelToggled() {\n this.isMenuOpen = false;\n }\n\n // CLose the University main menu if user opens the language menu panel.\n @Listen(\"menuLanguageToggled\", {target: \"document\"})\n languageMenuToggled() {\n this.isMenuOpen = false;\n }\n\n render() {\n const white = \"var(--grayscale-white)\";\n const logoSizeGroup = this.isMobile ? SiteLogoSize.small : SiteLogoSize.small;\n const logoColorGroup = ColorVariant.white;\n\n return this.isMobile ? (\n <Host\n class={{\n \"menu--main-group--mobile\": true,\n \"menu--main-group--mobile__is-open\": this.isMenuOpen,\n }}\n >\n <button\n aria-label={this.menuLabel}\n class={{\n \"menu--main-group__mobile-toggle\": true,\n \"is-open\": this.isMenuOpen,\n }}\n >\n <hy-icon icon={\"hy-icon-slim-hamburger-menu\"} size={20} fill={white} />\n </button>\n <nav\n role=\"navigation\"\n aria-hidden={this.isMenuOpen ? \"false\" : \"true\"}\n class={{\n \"menu--main-group__dropdown--mobile\": true,\n \"is-open\": this.isMenuOpen,\n }}\n >\n <div class=\"menu--main-group__dropdown__top\">\n <div class={\"menu--main-group__logo-container\"} id={\"menu-logo\"}>\n <hy-site-logo\n is-group={true}\n size={logoSizeGroup}\n color={logoColorGroup}\n url={this.siteUrl}\n label={this.siteLabel}\n />\n </div>\n <button\n aria-label={`Close ${this.menuLabel}`}\n class=\"menu--main-group__dropdown__close\"\n onClick={(e) => this.handleTopMenuClose(e)}\n >\n <hy-icon icon={\"hy-icon-remove\"} size={20} fill={white} />\n </button>\n </div>\n <div class=\"menu--main-group__dropdown__items\">\n {this._dataMainMenu.map((item) => {\n return (\n <a href={item.url} class={{\"menu-main-link\": true}}>\n <span class={\"menu--main-group__label\"}>{item.label}</span>\n </a>\n );\n })}\n </div>\n <div class=\"menu--main-group__dropdown__donate\">\n {this.donate &&\n this.donate.map((i) => {\n return (\n <a class={\"menu--secondary__item hy-link__donate group\"} href={i.url}>\n <hy-icon icon={\"hy-icon-heart-support\"} size={14} fill={logoColorGroup} />\n <span class={\"hy-link__donate__label group\"}>{i.label}</span>\n </a>\n );\n })}\n </div>\n </nav>\n </Host>\n ) : (\n <Host\n class={{\n \"menu--main-group\": true,\n \"menu--main-group__is-open\": this.isMenuOpen,\n }}\n >\n <button\n class={{\n \"menu--main-group__toggle\": true,\n \"is-open\": this.isMenuOpen,\n }}\n aria-expanded={this.isMenuOpen ? \"true\" : \"false\"}\n aria-haspopup=\"menu\"\n //aria-label={this.isMenuOpen ? this._labels['close'] : this._labels['open']}\n >\n {this.isMenuOpen ? (\n <hy-icon class={\"toggle__close\"} icon={\"hy-icon-remove\"} size={8} fill={white} />\n ) : (\n <hy-icon class={\"toggle__caret\"} icon={\"hy-icon-slim-hamburger-menu\"} size={8} fill={white} />\n )}\n <span>{this.menuLabel}</span>\n </button>\n <div\n class={{\n \"menu--main-group__dropdown\": true,\n \"is-open\": this.isMenuOpen,\n }}\n >\n <div class=\"list\">\n {this._dataMainMenu.map((item) => {\n return (\n <a href={item.url} class={{\"menu-main-link\": true}}>\n <span class=\"heading-icon\">\n <hy-icon icon={\"hy-icon-caret-right\"} size={10} fill={white} />\n </span>\n <span class={\"menu--main-group__label\"}>{item.label}</span>\n </a>\n );\n })}\n </div>\n <button\n onClick={(e) => this.handleComponentClick(e)}\n class={{\n \"panel-toggle\": true,\n }}\n aria-label=\"Close menu\"\n >\n <span class=\"panel-toggle__label\">\n <span class=\"panel-toggle__label__title\">{this.menuLabelClose}</span>\n <hy-icon icon={\"hy-icon-remove\"} size={20} fill={ColorVariant.white} />\n </span>\n </button>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["hyMenuMainGroupCss","keys","enter","HyMenuMainGroup","async","this","_dataMainMenu","jsonParserWorker","dataMainMenu","handleComponentClick","event","isMenuOpen","emitEvent","adjustMainMenuPosition","target","showBackdropShadow","stopPropagation","handleComponentKeyDown","key","code","includes","handleOutsideMenuClick","handleTopMenuClose","universityMainMenuToggled","emit","mobileMenuTopToggle","hyTopHeader","el","closest","hasAttribute","mainMenuToggle","shadowRoot","querySelector","mainMenuDropdown","mainMenuList","rectHeader","getBoundingClientRect","rectMenuToggle","style","top","height","left","headerHeight","offsetHeight","state","hyHeader","hyBackdropDiv","children","me","window","outerHeight","position","classList","add","removeAttribute","remove","render","white","logoSizeGroup","isMobile","SiteLogoSize","small","logoColorGroup","ColorVariant","h","Host","class","menuLabel","icon","size","fill","role","id","color","url","siteUrl","label","siteLabel","onClick","e","map","item","href","donate","i","menuLabelClose"],"sources":["./src/components/hy-navigation/hy-menu-main-group/hy-menu-main-group.scss?tag=hy-menu-main-group&encapsulation=shadow","./src/components/hy-navigation/hy-menu-main-group/hy-menu-main-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n:host(.menu--main-group) {\n align-items: center;\n display: flex;\n flex-flow: row;\n margin-left: 28px;\n\n @include breakpoint($extrawide) {\n margin-right: auto;\n }\n}\n\n.menu--main-group__toggle {\n @include font-size(14px, 16px);\n @include font-weight($semibold);\n align-items: center;\n background: var(--grayscale-black);\n border: 0 none;\n color: var(--grayscale-white);\n display: flex;\n flex-flow: row;\n font-family: var(--main-font-family);\n letter-spacing: -0.44px;\n margin: 0 -4px;\n padding: 0;\n position: relative;\n\n &:focus {\n outline: none;\n }\n\n &:hover {\n cursor: pointer;\n\n span {\n color: var(--grayscale-medium);\n }\n\n svg {\n fill: var(--grayscale-medium);\n }\n }\n\n .toggle__caret {\n svg {\n @include breakpoint($wide) {\n height: 15.27px;\n width: 3px;\n }\n @include breakpoint($extrawide) {\n height: 14px;\n width: 3px;\n }\n }\n }\n\n span {\n @include breakpoint($wide) {\n margin-left: 17px;\n }\n }\n\n &.is-open {\n &:after {\n border-bottom: 3px solid white;\n bottom: -10px;\n content: \" \";\n position: absolute;\n width: 100%;\n }\n\n .toggle__close {\n @include breakpoint($wide) {\n height: 15px;\n width: 15px;\n\n svg {\n height: 15px;\n width: 15px;\n }\n }\n }\n\n span {\n @include breakpoint($wide) {\n margin-left: 10px;\n }\n }\n }\n}\n\n.menu--main-group__dropdown {\n display: none;\n visibility: hidden;\n\n &.is-open {\n background-color: var(--grayscale-black);\n border-radius: 0 0 5px 5px;\n box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);\n color: var(--grayscale-white);\n display: flex;\n font-family: var(--main-font-family);\n left: 0;\n margin: 0;\n padding: 6px 0 20px;\n position: absolute;\n top: 0;\n visibility: visible;\n width: 100%;\n z-index: 511;\n\n .list {\n display: flex;\n flex-flow: column;\n justify-items: center;\n padding-top: 14px;\n position: relative;\n }\n\n .panel-toggle {\n background-color: transparent;\n border: none;\n position: absolute;\n right: 0;\n top: 0;\n\n @include breakpoint($wide) {\n padding: 26px 32px;\n }\n\n &__label {\n @include font-size(16px, 20px);\n @include font-weight($bold);\n color: var(--grayscale-white);\n display: flex;\n font-family: var(--main-font-family);\n letter-spacing: -0.5px;\n text-transform: uppercase;\n\n &__title {\n padding-right: 12px;\n }\n\n &:hover {\n cursor: pointer;\n span {\n color: var(--grayscale-medium);\n }\n svg {\n fill: var(--grayscale-medium);\n }\n }\n }\n }\n\n .menu-main-link {\n @include font-size(16px, 20px);\n align-items: center;\n display: flex;\n font-family: var(--main-font-family);\n flex-direction: row;\n margin-bottom: 20px;\n text-decoration: none;\n\n @include breakpoint($extrawide) {\n @include font-size(14px, 18px);\n }\n\n &:hover {\n span {\n color: var(--grayscale-medium);\n }\n svg {\n fill: var(--grayscale-medium);\n }\n }\n }\n .menu--main-group__label {\n color: var(--grayscale-white);\n margin-left: 12px;\n }\n }\n}\n\n:host(.menu--main-group--mobile) {\n align-items: center;\n display: flex;\n flex-flow: row;\n position: relative;\n}\n\n.menu--main-group__mobile-toggle {\n border: none;\n background: transparent;\n padding: 15px 12px;\n\n &:hover {\n cursor: pointer;\n }\n}\n\n.menu--main-group__dropdown__top {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n margin-bottom: 23px;\n}\n\n.menu--main-group__dropdown__close {\n border: none;\n background-color: transparent;\n padding: 0;\n margin: 0;\n\n &:hover {\n cursor: pointer;\n }\n}\n\n.menu--main-group__logo-container .hy-site-logo__label.group {\n max-width: 250px;\n}\n\n.menu--main-group__dropdown__items {\n display: flex;\n flex-direction: column;\n\n .menu-main-link {\n @include font-size(15px, 20px);\n\n background-color: var(--grayscale-dark-text);\n color: var(--grayscale-white);\n font-family: var(--main-font-family);\n letter-spacing: -0.5px;\n margin-bottom: 8px;\n padding: 14px 20px;\n text-decoration: none;\n width: 100%;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n\n.menu--main-group__dropdown__donate {\n display: flex;\n flex-direction: row;\n justify-content: center;\n background-color: var(--grayscale-dark-text);\n position: fixed;\n bottom: 0;\n margin-left: -20px;\n width: 100%;\n\n .hy-link__donate.group {\n @include font-size(16px, 16px);\n @include font-weight($semibold);\n\n display: flex;\n color: var(--grayscale-white);\n font-family: var(--main-font-family);\n margin: 20px auto 16px auto;\n text-decoration: none;\n\n .hy-link__donate__label {\n margin-left: 6px;\n }\n }\n}\n\n.menu--main-group__dropdown--mobile {\n -webkit-box-direction: normal;\n -webkit-box-orient: vertical;\n background-color: var(--grayscale-black);\n bottom: 0px;\n display: flex;\n flex-direction: column;\n justify-items: space-between;\n max-width: 400px;\n overflow: hidden;\n padding: 0px;\n place-items: stretch;\n position: fixed;\n right: 0px;\n top: 0px;\n transform: translateX(100%);\n transition: all 0.3s ease 0s;\n visibility: hidden;\n width: 0px;\n\n &.is-open {\n padding: 50px 20px 20px;\n transform: translateX(0px);\n transition: transform 0.3s cubic-bezier(0, 0, 0.3, 1);\n visibility: visible;\n width: 90%;\n z-index: 101;\n\n &::after {\n opacity: 1;\n visibility: visible;\n }\n }\n}\n","export interface MainMenu {\n label: string;\n url: string;\n menuLinkId: string;\n}\n\nexport interface DonateLink {\n url: string;\n label: string;\n}\n\nimport {Component, Host, h, Element, Prop, State, Listen, Event, EventEmitter} from \"@stencil/core\";\nimport {ColorVariant, SiteLogoSize} from \"../../../utils/utils\";\nimport {jsonParserWorker} from \"../../../global/globalScript\";\n\nlet keys = {\n enter: \"Enter\",\n};\n\n@Component({\n tag: \"hy-menu-main-group\",\n styleUrl: \"hy-menu-main-group.scss\",\n shadow: true,\n})\nexport class HyMenuMainGroup {\n @Element() el: HTMLElement;\n @Prop() menuLabel: string = \"University main menu\";\n @Prop() menuLabelClose: string = \"Close\";\n @Prop() dataMainMenu: MainMenu[] \| string;\n @Prop() isMobile: boolean = false;\n @Prop() logoUrl?: string;\n @Prop() logoLabel?: string;\n @Prop() siteLabel?: string;\n @Prop() siteUrl?: string;\n @Prop() donate: DonateLink[];\n @State() isMenuOpen: boolean = false;\n\n @Event() universityMainMenuToggled: EventEmitter;\n @Event() mobileMenuTopToggle: EventEmitter;\n\n private _dataMainMenu: MainMenu[];\n\n async componentWillLoad() {\n this._dataMainMenu = await jsonParserWorker(this.dataMainMenu);\n }\n\n\n @Listen(\"click\", {capture: true})\n handleComponentClick(event) {\n this.isMenuOpen = !this.isMenuOpen;\n \n this.emitEvent();\n if (this.isMenuOpen) {\n this.adjustMainMenuPosition(event.target);\n }\n if (!this.isMenuOpen) {\n this.showBackdropShadow('close');\n }\n event.stopPropagation();\n }\n\n @Listen(\"keydown\")\n handleComponentKeyDown(event: KeyboardEvent) {\n event.stopPropagation();\n const key = event.code;\n let target = event.target as HTMLButtonElement;\n\n if (key === \"Escape\" && this.isMenuOpen) {\n this.isMenuOpen = false;\n this.emitEvent();\n }\n\n if (target && [keys.enter].includes(key)) {\n this.isMenuOpen = !this.isMenuOpen;\n\n if (this.isMenuOpen) {\n this.emitEvent();\n this.adjustMainMenuPosition(target);\n }\n }\n }\n\n // Handle events that should close the menu.\n @Listen(\"click\", {target: \"window\"})\n @Listen(\"headerScrollDown\", {target: \"window\"})\n @Listen(\"headerScrollUp\", {target: \"window\"})\n @Listen(\"menuLanguageToggled\", {target: \"document\"})\n @Listen(\"searchPanelToggled\", {target: \"document\"})\n @Listen(\"menuDesktopToggled\", {target: \"document\"})\n handleOutsideMenuClick(event) {\n if (this.isMenuOpen) {\n this.isMenuOpen = false;\n this.handleTopMenuClose(event);\n }\n event.stopPropagation();\n }\n\n emitEvent() {\n // Close other panels if they are open (lang menu, search, main menu, ..).\n this.universityMainMenuToggled.emit();\n this.mobileMenuTopToggle.emit();\n }\n\n // TODO: Cleanup this. Find cleaner way to do positioning.\n adjustMainMenuPosition(target) {\n let hyTopHeader = this.el.closest(\".hy-site-header__content-top\") as HTMLElement;\n\n if (hyTopHeader && !hyTopHeader.hasAttribute(\"is-mobile\")) {\n let mainMenuToggle = target.shadowRoot.querySelector(\".menu--main-group__toggle\") as HTMLElement;\n let mainMenuDropdown = target.shadowRoot.querySelector(\".menu--main-group__dropdown\") as HTMLElement;\n let mainMenuList = target.shadowRoot.querySelector(\".list\") as HTMLElement;\n if (mainMenuDropdown && mainMenuList && mainMenuToggle) {\n let rectHeader = hyTopHeader.getBoundingClientRect();\n let rectMenuToggle = mainMenuToggle.getBoundingClientRect();\n mainMenuDropdown.style.top = `${rectHeader.height}px`;\n\n mainMenuList.style.left = `${rectMenuToggle.left}px`;\n }\n let headerHeight = hyTopHeader.offsetHeight + 270;\n\n this.showBackdropShadow(\"open\", headerHeight);\n }\n }\n\n // TODO: Handle backdrop with CSS.\n showBackdropShadow(state = \"close\", top = 0) {\n let hyHeader = this.el.closest(\".hy-site-header\") as HTMLElement;\n let hyBackdropDiv = hyHeader.children[0] as HTMLElement;\n\n if (hyBackdropDiv) {\n if (state === \"open\") {\n let me = window.outerHeight - top;\n hyBackdropDiv.style.height = `${me}px`;\n hyBackdropDiv.style.top = `${top}px`;\n hyBackdropDiv.style.position = \"absolute\";\n hyBackdropDiv.classList.add(\"is-active\");\n } else {\n hyBackdropDiv.removeAttribute(\"style\");\n hyBackdropDiv.classList.remove(\"is-active\");\n }\n }\n }\n\n\n\n handleTopMenuClose(event) {\n this.isMenuOpen = false;\n this.mobileMenuTopToggle.emit();\n this.showBackdropShadow('close');\n event.stopPropagation();\n }\n\n\n render() {\n const white = \"var(--grayscale-white)\";\n const logoSizeGroup = this.isMobile ? SiteLogoSize.small : SiteLogoSize.small;\n const logoColorGroup = ColorVariant.white;\n\n return this.isMobile ? (\n <Host\n class={{\n \"menu--main-group--mobile\": true,\n \"menu--main-group--mobile__is-open\": this.isMenuOpen,\n }}\n >\n <button\n aria-label={this.menuLabel}\n class={{\n \"menu--main-group__mobile-toggle\": true,\n \"is-open\": this.isMenuOpen,\n }}\n >\n <hy-icon icon={\"hy-icon-slim-hamburger-menu\"} size={20} fill={white} />\n </button>\n <nav\n role=\"navigation\"\n aria-hidden={this.isMenuOpen ? \"false\" : \"true\"}\n class={{\n \"menu--main-group__dropdown--mobile\": true,\n \"is-open\": this.isMenuOpen,\n }}\n >\n <div class=\"menu--main-group__dropdown__top\">\n <div class={\"menu--main-group__logo-container\"} id={\"menu-logo\"}>\n <hy-site-logo\n is-group={true}\n size={logoSizeGroup}\n color={logoColorGroup}\n url={this.siteUrl}\n label={this.siteLabel}\n />\n </div>\n <button\n aria-label={`Close ${this.menuLabel}`}\n class=\"menu--main-group__dropdown__close\"\n onClick={(e) => this.handleTopMenuClose(e)}\n >\n <hy-icon icon={\"hy-icon-remove\"} size={20} fill={white} />\n </button>\n </div>\n <div class=\"menu--main-group__dropdown__items\">\n {this._dataMainMenu.map((item) => {\n return (\n <a href={item.url} class={{\"menu-main-link\": true}}>\n <span class={\"menu--main-group__label\"}>{item.label}</span>\n </a>\n );\n })}\n </div>\n <div class=\"menu--main-group__dropdown__donate\">\n {this.donate &&\n this.donate.map((i) => {\n return (\n <a class={\"menu--secondary__item hy-link__donate group\"} href={i.url}>\n <hy-icon icon={\"hy-icon-heart-support\"} size={14} fill={logoColorGroup} />\n <span class={\"hy-link__donate__label group\"}>{i.label}</span>\n </a>\n );\n })}\n </div>\n </nav>\n </Host>\n ) : (\n <Host\n class={{\n \"menu--main-group\": true,\n \"menu--main-group__is-open\": this.isMenuOpen,\n }}\n >\n <button\n class={{\n \"menu--main-group__toggle\": true,\n \"is-open\": this.isMenuOpen,\n }}\n aria-expanded={this.isMenuOpen ? \"true\" : \"false\"}\n aria-haspopup=\"menu\"\n //aria-label={this.isMenuOpen ? this._labels['close'] : this._labels['open']}\n >\n {this.isMenuOpen ? (\n <hy-icon class={\"toggle__close\"} icon={\"hy-icon-remove\"} size={8} fill={white} />\n ) : (\n <hy-icon class={\"toggle__caret\"} icon={\"hy-icon-slim-hamburger-menu\"} size={8} fill={white} />\n )}\n <span>{this.menuLabel}</span>\n </button>\n <div\n class={{\n \"menu--main-group__dropdown\": true,\n \"is-open\": this.isMenuOpen,\n }}\n >\n <div class=\"list\">\n {this._dataMainMenu.map((item) => {\n return (\n <a href={item.url} class={{\"menu-main-link\": true}}>\n <span class=\"heading-icon\">\n <hy-icon icon={\"hy-icon-caret-right\"} size={10} fill={white} />\n </span>\n <span class={\"menu--main-group__label\"}>{item.label}</span>\n </a>\n );\n })}\n </div>\n <button\n onClick={(e) => this.handleComponentClick(e)}\n class={{\n \"panel-toggle\": true,\n }}\n aria-label=\"Close menu\"\n >\n <span class=\"panel-toggle__label\">\n <span class=\"panel-toggle__label__title\">{this.menuLabelClose}</span>\n <hy-icon icon={\"hy-icon-remove\"} size={20} fill={ColorVariant.white} />\n </span>\n </button>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/types/components/hy-navigation/hy-menu-main-group/hy-menu-main-group.d.ts CHANGED Viewed

@@ -23,16 +23,13 @@ export declare class HyMenuMainGroup {
   universityMainMenuToggled: EventEmitter;
   mobileMenuTopToggle: EventEmitter;
   private _dataMainMenu;
+  componentWillLoad(): Promise<void>;
   handleComponentClick(event: any): void;
   handleComponentKeyDown(event: KeyboardEvent): void;
+  handleOutsideMenuClick(event: any): void;
   emitEvent(): void;
   adjustMainMenuPosition(target: any): void;
   showBackdropShadow(state?: string, top?: number): void;
-  componentWillLoad(): Promise<void>;
   handleTopMenuClose(event: any): void;
-  handleOutsideMenuClick(event: any): void;
-  desktopMenuToggled(): void;
-  searchPanelToggled(): void;
-  languageMenuToggled(): void;
   render(): any;
 }

package/dist/types/components/hy-site-header/site-search/site-search.d.ts CHANGED Viewed

@@ -40,14 +40,9 @@ export declare class SiteSearch {
   searchPanelToggled: EventEmitter;
   private _labels;
   componentWillLoad(): Promise<void>;
-  desktopMenuToggled(): void;
-  mobileMenuToggled(): void;
-  menuLanguageToggled(): void;
-  universityMainMenuPanelToggled(): void;
+  closePanelWhenOtherDropdownsTriggered(): void;
   handleWindowClick(event: any): void;
   closeSearchPanel(): void;
   handleSearchPanelToggle(event: any): void;
-  adjustPosition(target: any): void;
-  showBackdropShadow(state?: string, top?: number): void;
   render(): any;
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@itcenteratunihelsinki/huds-lib",
-  "version": "0.8.61",
+  "version": "0.8.63",
   "description": "Helsinki University Design System library",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -68,5 +68,5 @@
       "pre-commit": "pretty-quick --staged"
     }
   },
-  "gitHead": "bf356cf81d3f65db283f75deb6f2476fbf4c1e46"
+  "gitHead": "d57d075180be082af618146dc1f48fc44a4f4bb0"
 }