@itcenteratunihelsinki/huds-lib 0.8.57 → 0.8.59

package/dist/huds-lib/hy-paragraph-text.entry.js

@@ -0,0 +1,2 @@
+import{r as a,h as e,H as t,g as p}from"./index-f84f2a7d.js";const i=":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}.hy-paragraph-text.content_page.external,.hy-paragraph-text.field_of_science.external{margin-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page.external,.hy-paragraph-text.field_of_science.external{margin-top:16px}}@media (min-width: 60rem){.hy-paragraph-text.content_page.external,.hy-paragraph-text.field_of_science.external{margin-top:32px}}@media (min-width: 75.0625rem){.hy-paragraph-text.content_page.external.default,.hy-paragraph-text.field_of_science.external.default{margin-top:32px}}@media (min-width: 1601px){.hy-paragraph-text.content_page.external.default,.hy-paragraph-text.field_of_science.external.default{margin-top:40px}}@media (min-width: 75.0625rem){.hy-paragraph-text.content_page.external.large,.hy-paragraph-text.field_of_science.external.large{margin-top:40px}}@media (min-width: 1601px){.hy-paragraph-text.content_page.external.large,.hy-paragraph-text.field_of_science.external.large{margin-top:40px}}.hy-paragraph-text.content_page h3,.hy-paragraph-text.field_of_science h3{font-size:1.375rem;line-height:28px;letter-spacing:-0.7px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h3,.hy-paragraph-text.field_of_science h3{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h3,.hy-paragraph-text.field_of_science h3{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.content_page h4,.hy-paragraph-text.field_of_science h4{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h4,.hy-paragraph-text.field_of_science h4{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h4,.hy-paragraph-text.field_of_science h4{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.content_page h5,.hy-paragraph-text.field_of_science h5{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h5,.hy-paragraph-text.field_of_science h5{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h5,.hy-paragraph-text.field_of_science h5{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.content_page h6,.hy-paragraph-text.field_of_science h6{font-size:0.875rem;line-height:16px;letter-spacing:-0.44px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h6,.hy-paragraph-text.field_of_science h6{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h6,.hy-paragraph-text.field_of_science h6{padding-bottom:16px;padding-top:32px}}";const r=":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}.hy-paragraph-text.content_page.external,.hy-paragraph-text.field_of_science.external{margin-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page.external,.hy-paragraph-text.field_of_science.external{margin-top:16px}}@media (min-width: 60rem){.hy-paragraph-text.content_page.external,.hy-paragraph-text.field_of_science.external{margin-top:32px}}@media (min-width: 75.0625rem){.hy-paragraph-text.content_page.external.default,.hy-paragraph-text.field_of_science.external.default{margin-top:32px}}@media (min-width: 1601px){.hy-paragraph-text.content_page.external.default,.hy-paragraph-text.field_of_science.external.default{margin-top:40px}}@media (min-width: 75.0625rem){.hy-paragraph-text.content_page.external.large,.hy-paragraph-text.field_of_science.external.large{margin-top:40px}}@media (min-width: 1601px){.hy-paragraph-text.content_page.external.large,.hy-paragraph-text.field_of_science.external.large{margin-top:40px}}.hy-paragraph-text.content_page h3,.hy-paragraph-text.field_of_science h3{font-size:1.375rem;line-height:28px;letter-spacing:-0.7px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h3,.hy-paragraph-text.field_of_science h3{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h3,.hy-paragraph-text.field_of_science h3{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.content_page h4,.hy-paragraph-text.field_of_science h4{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h4,.hy-paragraph-text.field_of_science h4{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h4,.hy-paragraph-text.field_of_science h4{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.content_page h5,.hy-paragraph-text.field_of_science h5{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h5,.hy-paragraph-text.field_of_science h5{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h5,.hy-paragraph-text.field_of_science h5{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.content_page h6,.hy-paragraph-text.field_of_science h6{font-size:0.875rem;line-height:16px;letter-spacing:-0.44px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.content_page h6,.hy-paragraph-text.field_of_science h6{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:12px;padding-top:28px}}@media (min-width: 60rem){.hy-paragraph-text.content_page h6,.hy-paragraph-text.field_of_science h6{padding-bottom:16px;padding-top:32px}}.hy-paragraph-text.landing_page h3,.hy-paragraph-text.main_front_page h3{font-size:1.375rem;line-height:28px;letter-spacing:-0.7px;padding-bottom:12px;padding-top:32px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h3,.hy-paragraph-text.main_front_page h3{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;padding-bottom:16px;padding-top:40px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h3,.hy-paragraph-text.main_front_page h3{padding-bottom:16px;padding-top:48px}}.hy-paragraph-text.landing_page h4,.hy-paragraph-text.main_front_page h4{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h4,.hy-paragraph-text.main_front_page h4{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;padding-bottom:16px;padding-top:32px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h4,.hy-paragraph-text.main_front_page h4{padding-bottom:16px;padding-top:40px}}.hy-paragraph-text.landing_page h5,.hy-paragraph-text.main_front_page h5{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h5,.hy-paragraph-text.main_front_page h5{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:16px;padding-top:32px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h5,.hy-paragraph-text.main_front_page h5{padding-bottom:16px;padding-top:40px}}.hy-paragraph-text.landing_page h6,.hy-paragraph-text.main_front_page h6{font-size:0.875rem;line-height:16px;letter-spacing:-0.44px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h6,.hy-paragraph-text.main_front_page h6{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:16px;padding-top:32px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h6,.hy-paragraph-text.main_front_page h6{padding-bottom:16px;padding-top:40px}}:host{display:block}.hy-paragraph-text{font-size:0.9375rem;line-height:22px;color:var(--grayscale-dark-text);font-family:var(--main-font-family);letter-spacing:0;width:100%}@media (min-width: 30rem){.hy-paragraph-text{font-size:1rem;line-height:24px}}@media (min-width: 60rem){.hy-paragraph-text{width:91.46%}}@media (min-width: 1601px){.hy-paragraph-text{font-size:1.0625rem;line-height:26px;width:82.89%}}@media (min-width: 75.0625rem){.hy-paragraph-text__large{font-size:1.0625rem;line-height:26px;width:82.89%}}@media (min-width: 1601px){.hy-paragraph-text__large{width:74.17%}}@media (min-width: 60rem){.hy-paragraph-text.degree_programme_group{width:91.46%}}@media (min-width: 60rem){.hy-paragraph-text.main_front_page,.hy-paragraph-text.landing_page,.hy-paragraph-text.faculty,.hy-paragraph-text.generic_site_group,.hy-paragraph-text.degree_programme_group,.hy-paragraph-text.research_group{width:100%}}.hy-paragraph-text h1,.hy-paragraph-text h2,.hy-paragraph-text h3,.hy-paragraph-text h4,.hy-paragraph-text h5,.hy-paragraph-text h6{color:var(--grayscale-black);font-family:var(--main-font-family);font-weight:700;margin:0;width:100%}.hy-paragraph-text h1.negative,.hy-paragraph-text h2.negative,.hy-paragraph-text h3.negative,.hy-paragraph-text h4.negative,.hy-paragraph-text h5.negative,.hy-paragraph-text h6.negative{color:var(--grayscale-white)}.hy-paragraph-text a{font-size:0.875rem;line-height:20px;color:var(--link-blue);font-family:var(--main-font-family);font-weight:600}@media (min-width: 30rem){.hy-paragraph-text a{font-size:1rem;line-height:24px;letter-spacing:-0.1px}}@media (min-width: 1601px){.hy-paragraph-text a{font-size:1.0625rem;line-height:26px}}.hy-paragraph-text a:hover{color:var(--brand-main)}.hy-paragraph-text a[target=_blank]:after{display:inline-block;vertical-align:middle;width:12px;height:12px;margin-left:3px;background-size:contain;content:\"\";background-image:url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='rgb(4,121,165)'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");-webkit-transform:rotate(315deg);transform:rotate(315deg)}.hy-paragraph-text a[target=_blank]:after:hover{background-image:url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='pink'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\")}.hy-paragraph-text a[target=_blank]:hover:after{background-image:url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='rgb(14,104,139)'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\")}.hy-paragraph-text p{margin-top:0;padding-top:0}.hy-paragraph-text p:last-of-type{margin-bottom:0}.hy-paragraph-text:first-child{margin-top:0 !important}hy-paragraph-text+hy-link-list{display:block;margin-top:32px}";const n=":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}.hy-paragraph-text.landing_page h3,.hy-paragraph-text.main_front_page h3{font-size:1.375rem;line-height:28px;letter-spacing:-0.7px;padding-bottom:12px;padding-top:32px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h3,.hy-paragraph-text.main_front_page h3{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;padding-bottom:16px;padding-top:40px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h3,.hy-paragraph-text.main_front_page h3{padding-bottom:16px;padding-top:48px}}.hy-paragraph-text.landing_page h4,.hy-paragraph-text.main_front_page h4{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h4,.hy-paragraph-text.main_front_page h4{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;padding-bottom:16px;padding-top:32px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h4,.hy-paragraph-text.main_front_page h4{padding-bottom:16px;padding-top:40px}}.hy-paragraph-text.landing_page h5,.hy-paragraph-text.main_front_page h5{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h5,.hy-paragraph-text.main_front_page h5{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;padding-bottom:16px;padding-top:32px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h5,.hy-paragraph-text.main_front_page h5{padding-bottom:16px;padding-top:40px}}.hy-paragraph-text.landing_page h6,.hy-paragraph-text.main_front_page h6{font-size:0.875rem;line-height:16px;letter-spacing:-0.44px;padding-bottom:12px;padding-top:24px}@media (min-width: 30rem){.hy-paragraph-text.landing_page h6,.hy-paragraph-text.main_front_page h6{font-size:1rem;line-height:20px;letter-spacing:-0.5px;padding-bottom:16px;padding-top:32px}}@media (min-width: 60rem){.hy-paragraph-text.landing_page h6,.hy-paragraph-text.main_front_page h6{padding-bottom:16px;padding-top:40px}}";const h=class{constructor(e){a(this,e);this.variant=undefined;this.placement="internal";this.headerstyle="default"}componentDidLoad(){let a=this.el.closest(".hy-main");if(a){if(!a.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const a=["hy-paragraph-text",`hy-paragraph-text__${this.headerstyle}`,`${this.variant}`,`${this.placement}`,`${this.headerstyle}`].join(" ");return e(t,null,e("div",{class:a},e("slot",null)))}get el(){return p(this)}};h.style={content:i,default:r,landing:n};export{h as hy_paragraph_text};
+//# sourceMappingURL=hy-paragraph-text.entry.js.map

package/dist/huds-lib/hy-paragraph-text.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["paragraphTextContentCss","defaultParagraphTextCss","paragraphTextLandingCss","ParagraphText","componentDidLoad","hyMainDiv","this","el","closest","classList","contains","headerstyle","render","classAttributes","variant","placement","join","h","Host","class"],"sources":["./src/components/hy-paragraph-text/paragraph-text-content.scss?tag=hy-paragraph-text&mode=content","./src/components/hy-paragraph-text/paragraph-text.scss?tag=hy-paragraph-text&mode=default","./src/components/hy-paragraph-text/paragraph-text-landing.scss?tag=hy-paragraph-text&mode=landing","./src/components/hy-paragraph-text/paragraph-text.tsx"],"sourcesContent":["//overrides for Content pages\n\n/*\n* Common styles for text plus mobile & tablet & small desktop\n* in Content Pages and Field of science pages.\n*/\n.hy-paragraph-text.content_page.external,\n.hy-paragraph-text.field_of_science.external {\n  margin-top: 24px; //total gap between heading h2 and paragraph content is 48px\n\n  @include breakpoint($narrow) {\n    margin-top: 16px; //total gap 40px\n  }\n  @include breakpoint($wide) {\n    margin-top: 32px; //total gap 56px\n  }\n}\n\n// There is a sidebar on the Content page\n.hy-paragraph-text.content_page.external.default,\n.hy-paragraph-text.field_of_science.external.default {\n  @include breakpoint($extrawide) {\n    margin-top: 32px; //total gap 56px\n  }\n  @include breakpoint($xlarge) {\n    margin-top: 40px; //total gap 64px\n  }\n}\n\n// No sidebar on the Content page\n.hy-paragraph-text.content_page.external.large,\n.hy-paragraph-text.field_of_science.external.large {\n  @include breakpoint($extrawide) {\n    margin-top: 40px; //total gap 64px\n  }\n  @include breakpoint($xlarge) {\n    margin-top: 40px; //total gap 64px\n  }\n}\n\n.hy-paragraph-text.content_page,\n.hy-paragraph-text.field_of_science {\n  h3 {\n    // text H3 small\n    @include font-size(22px, 28px);\n    letter-spacing: -0.7px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H3 Medium size\n      @include font-size(26px, 32px);\n      letter-spacing: -0.8px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n\n  h4 {\n    // text H4 small\n    @include font-size(18px, 24px);\n    letter-spacing: -0.56px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H4 Medium size\n      @include font-size(22px, 28px);\n      letter-spacing: -0.69px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n\n  h5 {\n    // text H5 small\n    @include font-size(16px, 20px);\n    letter-spacing: -0.5px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H5 Medium size\n      @include font-size(18px, 24px);\n      letter-spacing: -0.56px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n\n  h6 {\n    // text H6 small\n    @include font-size(14px, 16px);\n    letter-spacing: -0.44px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H6 Medium size\n      @include font-size(16px, 20px);\n      letter-spacing: -0.5px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n}\n","@import \"./paragraph-text-content.scss\";\n@import \"./paragraph-text-landing.scss\";\n\n:host {\n  display: block;\n}\n\n// General styles for text paragraph\n.hy-paragraph-text {\n  @include font-size(15px, 22px); // Paragraph Small size\n  color: var(--grayscale-dark-text);\n  font-family: var(--main-font-family);\n  letter-spacing: 0;\n  width: 100%;\n\n  @include breakpoint($narrow) {\n    @include font-size(16px, 24px); // Paragraph Medium size\n  }\n  @include breakpoint($wide) {\n    width: 91.46%; // 11 col\n  }\n  @include breakpoint($xlarge) {\n    @include font-size(17px, 26px); // Paragraph Large size\n    width: 82.89%; // 10 col\n  }\n\n  &__large {\n    @include breakpoint($extrawide) {\n      @include font-size(17px, 26px); // Paragraph Large size\n      width: 82.89%; // 10 col\n    }\n    @include breakpoint($xlarge) {\n      width: 74.17%; // 9 col\n    }\n  }\n\n  &.degree_programme_group {\n    @include breakpoint($wide) {\n      width: 91.46%; // 11 col\n    }\n  }\n\n  &.main_front_page,\n  &.landing_page,\n  &.faculty,\n  &.generic_site_group,\n  &.degree_programme_group,\n  &.research_group {\n    @include breakpoint($wide) {\n      width: 100%;\n    }\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    font-weight: 700;\n    margin: 0;\n    width: 100%;\n\n    &.negative {\n      color: var(--grayscale-white);\n    }\n  }\n\n  // link within paragraph (Open sans semibold)\n  a {\n    @include font-size(14px, 20px); // Paragraph Small size\n    color: var(--link-blue);\n    font-family: var(--main-font-family);\n    font-weight: 600;\n\n    @include breakpoint($narrow) {\n      @include font-size(16px, 24px);\n      letter-spacing: -0.1px;\n    }\n\n    @include breakpoint($xlarge) {\n      @include font-size(17px, 26px); // Paragraph Large size\n    }\n\n    &:hover {\n      color: var(--brand-main);\n    }\n  }\n\n  a[target=\"_blank\"]:after {\n    display: inline-block;\n    vertical-align: middle;\n    width: 12px;\n    height: 12px;\n    margin-left: 3px;\n    background-size: contain;\n    content: \"\";\n    background-image: url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='rgb(4,121,165)'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");\n    transform: rotate(315deg);\n\n    &:hover {\n      background-image: url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='pink'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");\n    }\n  }\n\n  a[target=\"_blank\"]:hover {\n    &:after {\n      background-image: url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='rgb(14,104,139)'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");\n    }\n  }\n\n  p {\n    margin-top: 0;\n    padding-top: 0;\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n  }\n\n  // When hy-paragraph-text is the first child it will not add spacing to top. Will fix heading + text spacing issue.\n  &:first-child {\n    margin-top: 0 !important;\n  }\n}\n\nhy-paragraph-text + hy-link-list {\n  display: block;\n  margin-top: 32px;\n}\n","//overrides for Landing pages and Front page\n\n// Common styles for text plus mobile & tablet & small desktop in Landing Pages\n.hy-paragraph-text.landing_page,\n.hy-paragraph-text.main_front_page {\n  h3 {\n    // text H3 small\n    @include font-size(22px, 28px);\n    letter-spacing: -0.7px;\n\n    padding-bottom: 12px;\n    padding-top: 32px;\n\n    @include breakpoint($narrow) {\n      // text H3 Medium size\n      @include font-size(26px, 32px);\n      letter-spacing: -0.8px;\n\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 48px;\n    }\n  }\n\n  h4 {\n    // text H4 small\n    @include font-size(18px, 24px);\n    letter-spacing: -0.56px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H4 Medium size\n      @include font-size(22px, 28px);\n      letter-spacing: -0.69px;\n\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n  }\n\n  h5 {\n    // text H5 small\n    @include font-size(16px, 20px);\n    letter-spacing: -0.5px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H5 Medium size\n      @include font-size(18px, 24px);\n      letter-spacing: -0.56px;\n\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n  }\n\n  h6 {\n    // text H6 small\n    @include font-size(14px, 16px);\n    letter-spacing: -0.44px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H6 Medium size\n      @include font-size(16px, 20px);\n      letter-spacing: -0.5px;\n\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n  }\n}\n","import {Component, Element, h, Host, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-paragraph-text\",\n  styleUrls: {\n    default: \"paragraph-text.scss\",\n    content: \"paragraph-text-content.scss\",\n    landing: \"paragraph-text-landing.scss\",\n  },\n  shadow: false,\n})\nexport class ParagraphText {\n  @Prop() variant: string;\n  @Prop() placement: string = \"internal\";\n  @Prop() headerstyle: string = \"default\";\n  @Element() el: HTMLElement;\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const classAttributes = [\n      \"hy-paragraph-text\",\n      `hy-paragraph-text__${this.headerstyle}`,\n      `${this.variant}`,\n      `${this.placement}`,\n      `${this.headerstyle}`,\n    ].join(\" \");\n\n    return (\n      <Host>\n        <div class={classAttributes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6DAAA,MAAMA,EAA0B,0iICAhC,MAAMC,EAA0B,+wSCAhC,MAAMC,EAA0B,8mG,MCWnBC,EAAa,M,+DAEI,W,iBACE,S,CAG9BC,mBACE,IAAIC,EAAYC,KAAKC,GAAGC,QAAQ,YAChC,GAAIH,EAAW,CACb,IAAKA,EAAUI,UAAUC,SAAS,gBAAiB,CACjDJ,KAAKK,YAAc,O,GAKzBC,SACE,MAAMC,EAAkB,CACtB,oBACA,sBAAsBP,KAAKK,cAC3B,GAAGL,KAAKQ,UACR,GAAGR,KAAKS,YACR,GAAGT,KAAKK,eACRK,KAAK,KAEP,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAON,GACVI,EAAA,c"}

package/dist/huds-lib/hy-person-card.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as e}from"./index-f84f2a7d.js";import{q as n}from"./utils-7438924c.js";import{R as a}from"./index-ecc819ad.js";const t=":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}.hy-person-card-container{font-family:var(--main-font-family);margin-bottom:28px}@media (min-width: 60rem){.hy-person-card-container{margin-bottom:32px}}.hy-person-card-container__category-title{font-size:0.75rem;line-height:14px;color:var(--grayscale-dark);letter-spacing:0;margin-bottom:8px}@media (min-width: 30rem){.hy-person-card-container__category-title{font-size:0.875rem;line-height:18px}}@media (min-width: 120.0625rem){.hy-person-card-container__category-title{font-size:0.875rem;line-height:18px}}.hy-person-card-container__link{text-decoration:none}.hy-person-card-container__link.inactive{cursor:default;pointer-events:none}.hy-person-card{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-family:var(--main-font-family)}.hy-person-card__image-container{margin-right:12px;max-width:70px}@media (min-width: 30rem){.hy-person-card__image-container{margin-right:16px;max-width:112px}}@media (min-width: 120.0625rem){.hy-person-card__image-container{max-width:140px}}.hy-person-card__image-container__image{height:70px;width:70px}@media (min-width: 30rem){.hy-person-card__image-container__image{height:112px;width:112px}}@media (min-width: 120.0625rem){.hy-person-card__image-container__image{height:140px;width:140px}}.hy-person-card__image-container__image img{height:70px;width:70px;-o-object-fit:cover;object-fit:cover}@media (min-width: 30rem){.hy-person-card__image-container__image img{height:112px;width:112px}}@media (min-width: 120.0625rem){.hy-person-card__image-container__image img{height:140px;width:140px}}.hy-person-card__image-container__no-image{height:70px;width:70px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--brand-main-light);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (min-width: 30rem){.hy-person-card__image-container__no-image{height:112px;width:112px}}@media (min-width: 120.0625rem){.hy-person-card__image-container__no-image{height:140px;width:140px}}.hy-person-card__image-container__no-image__initials{font-size:1.125rem;line-height:24px;font-weight:700;color:var(--grayscale-white);letter-spacing:-0.56px}@media (min-width: 30rem){.hy-person-card__image-container__no-image__initials{font-size:2rem;line-height:32px;letter-spacing:0.96px}}.hy-person-card__info-container__full-name{font-size:1.125rem;line-height:24px;font-weight:700;color:var(--brand-main-light);letter-spacing:-0.56px;margin-bottom:4px;text-decoration:none}@media (min-width: 30rem){.hy-person-card__info-container__full-name{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;margin-bottom:3px}}@media (min-width: 120.0625rem){.hy-person-card__info-container__full-name{font-size:1.625rem;line-height:28px;letter-spacing:-0.81px;margin-bottom:5px}}.hy-person-card__info-container__full-name:hover,.hy-person-card__info-container__full-name:focus{color:var(--brand-main)}.hy-person-card__info-container__position-title{font-size:0.875rem;line-height:19px;font-weight:700;color:var(--brand-main-nearly-black);letter-spacing:0;margin-bottom:3px}@media (min-width: 30rem){.hy-person-card__info-container__position-title{font-size:1rem;line-height:20px;letter-spacing:-0.5px;margin-bottom:4px}}@media (min-width: 120.0625rem){.hy-person-card__info-container__position-title{font-size:1.125rem;line-height:24px;letter-spacing:-0.56px;margin-bottom:8px}}.hy-person-card__info-container__position-title__search-panel{font-weight:400}.hy-person-card__info-container__department{font-size:0.75rem;line-height:17px;color:var(--brand-main-nearly-black);letter-spacing:0;margin-bottom:3px;text-transform:uppercase}@media (min-width: 30rem){.hy-person-card__info-container__department{font-size:0.875rem;line-height:19px;margin-bottom:6px}}@media (min-width: 120.0625rem){.hy-person-card__info-container__department{font-size:0.875rem;line-height:16px;margin-bottom:9px}}.hy-person-card__info-container__field{font-size:0.75rem;line-height:17px;color:var(--brand-main-nearly-black);letter-spacing:0;margin-bottom:4px}@media (min-width: 30rem){.hy-person-card__info-container__field{font-size:0.875rem;line-height:19px;margin-bottom:6px}}@media (min-width: 120.0625rem){.hy-person-card__info-container__field{font-size:0.875rem;line-height:16px;margin-bottom:9px}}.hy-person-card__info-container__email-container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:4px}.hy-person-card__info-container__email{font-size:0.75rem;line-height:17px;color:var(--brand-main-nearly-black);letter-spacing:0;margin-left:11px}@media (min-width: 30rem){.hy-person-card__info-container__email{font-size:0.875rem;line-height:19px;margin-left:8px}}.hy-person-card__info-container__email__icon svg{height:15px;width:16px}@media (min-width: 30rem){.hy-person-card__info-container__email__icon svg{height:12px;width:16px}}.hy-person-card__info-container__phone-container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex}.hy-person-card__info-container__phone{font-size:0.75rem;line-height:17px;color:var(--brand-main-nearly-black);letter-spacing:0;margin-left:11px}@media (min-width: 30rem){.hy-person-card__info-container__phone{font-size:0.875rem;line-height:19px;margin-left:8px}}.hy-person-card__info-container__phone__icon svg{height:13px;width:13px}@media (min-width: 30rem){.hy-person-card__info-container__phone__icon svg{height:14px;width:14px}}.hy-person-card.search-panel{margin-bottom:12px}@media (min-width: 30rem){.hy-person-card.search-panel{margin-bottom:14px}}.hy-person-card.search-panel .hy-person-card__info-container__full-name{font-size:0.875rem;line-height:20px;font-weight:600;color:var(--grayscale-dark);letter-spacing:0;margin-bottom:0}@media (min-width: 30rem){.hy-person-card.search-panel .hy-person-card__info-container__full-name{letter-spacing:-0.3px}}@media (min-width: 120.0625rem){.hy-person-card.search-panel .hy-person-card__info-container__full-name{font-size:1rem;line-height:24px;letter-spacing:0}}.hy-person-card.search-panel .hy-person-card__info-container__position-title{font-size:0.75rem;line-height:16px;color:var(--grayscale-dark);letter-spacing:-0.07px;margin-bottom:0}.hy-person-card.search-panel .hy-person-card__image-container{margin-right:12px}.hy-person-card.search-panel .hy-person-card__image-container__image{height:60px;width:60px}.hy-person-card.search-panel .hy-person-card__image-container__image img{height:60px;width:60px}.hy-person-card.search-panel .hy-person-card__image-container__no-image{height:60px;width:60px}.hy-person-card.search-panel .hy-person-card__image-container__no-image__initials{color:var(--grayscale-white);font-size:1rem;line-height:32px;font-weight:700;letter-spacing:0.48px}.hy-person-card__extended-info-container{display:block;padding-top:8px}@media (min-width: 30rem){.hy-person-card__extended-info-container{padding-top:12px}}.hy-person-card__extended-info-container__about{font-size:0.75rem;line-height:17px;color:var(--grayscale-dark-text);font-family:var(--main-font-family);font-style:italic;letter-spacing:0}@media (min-width: 30rem){.hy-person-card__extended-info-container__about{font-size:0.75rem;line-height:16px}}@media (min-width: 1601px){.hy-person-card__extended-info-container__about{font-size:0.875rem;line-height:16px}}.hy-person-card__extended-info-container__about .label{font-weight:700;padding-right:3px}";const r=class{constructor(e){i(this,e);this.variant=n.default;this.categoryTitle=undefined;this.imageUrl=null;this.imageAlt=null;this.disableLazy=false;this.firstName=undefined;this.lastName=undefined;this.url=null;this.isExternal=false;this.scLabel=undefined;this.positionTitle=undefined;this.department=null;this.field=null;this.email=null;this.phone=null;this.aboutInfo=null;this.researchNetworks=undefined;this.studyProgramme=undefined;this.aboutInfoLabel=undefined;this.researchNetworksLabel=undefined;this.studyProgrammeLabel=undefined;this.isMobile=undefined}componentDidLoad(){this.ro=new a((i=>{for(const e of i){this.checkForMobile(e.contentRect.width)}}));this.ro.observe(document.body)}disconnectedCallback(){this.ro.disconnect()}checkForMobile(i){this.isMobile=i<=479?true:false}componentWillRender(){this._fullName=this.firstName&&this.lastName?`${this.firstName} ${this.lastName}`:"";this._initials=this.imageUrl&&this.firstName&&this.lastName?"":`${this.firstName.charAt(0)}${this.lastName.charAt(0)}`;if(!this.imageAlt){this.imageAlt=this._fullName}if(!this.scLabel){this.scLabel="Link to the person profile"}}render(){let i=["hy-person-card-container__link",this.variant].join(" ");let a=this.url&&this.url.length>0?"":" inactive";i=i.concat(a);const t=["hy-person-card",this.variant].join(" ");const r=["hy-person-card__info-container__position-title",`hy-person-card__info-container__position-title__${this.variant}`].join(" ");const o=this.isExternal?"_blank":"_self";return e("article",{class:"hy-person-card-container"},e("div",{class:i},this.categoryTitle&&this.variant==n.default&&e("div",{class:"hy-person-card-container__category-title"},this.categoryTitle),e("div",{class:t},e("div",{class:"hy-person-card__image-container"},this.imageUrl?e("a",{class:"hy-person-card__image-container__image",href:this.url,target:o},e("img",{loading:this.disableLazy?"eager":"lazy","aria-hidden":"true",src:this.imageUrl,alt:this.imageAlt})):e("div",{class:"hy-person-card__image-container__no-image"},e("div",{class:"hy-person-card__image-container__no-image__initials","aria-hidden":"true"},this._initials))),e("div",{class:"hy-person-card__info-container"},e("a",{class:"hy-person-card__info-container__full-name",href:this.url,target:o},this._fullName),this.positionTitle&&e("div",{class:r},this.positionTitle),this.department&&(this.variant==n.default||this.variant==n.extended&&!this.isMobile)&&e("div",{class:"hy-person-card__info-container__department"},this.department),this.field&&(this.variant==n.default||this.variant==n.extended&&!this.isMobile)&&e("div",{class:"hy-person-card__info-container__field"},this.field),this.email&&(this.variant==n.default||this.variant==n.extended&&!this.isMobile)&&[e("div",{class:"hy-person-card__info-container__email-container"},e("span",{class:"hy-person-card__info-container__email__icon"},e("hy-icon",{icon:"hy-icon-email",size:16})),e("span",{class:"hy-person-card__info-container__email"},this.email))],this.phone&&(this.variant==n.default||this.variant==n.extended&&!this.isMobile)&&[e("div",{class:"hy-person-card__info-container__phone-container"},e("span",{class:"hy-person-card__info-container__phone__icon"},e("hy-icon",{icon:"hy-icon-phone",size:14})),e("span",{class:"hy-person-card__info-container__phone"},this.phone))])),this.variant==n.extended&&e("div",{class:"hy-person-card hy-person-card__extended-info-container"},this.department&&this.isMobile&&e("div",{class:"hy-person-card__info-container__department"},this.department),this.field&&this.isMobile&&e("div",{class:"hy-person-card__info-container__field"},this.field),this.email&&this.isMobile&&[e("div",{class:"hy-person-card__info-container__email-container"},e("span",{class:"hy-person-card__info-container__email__icon"},e("hy-icon",{icon:"hy-icon-email",size:16})),e("span",{class:"hy-person-card__info-container__email"},this.email))],this.phone&&this.isMobile&&[e("div",{class:"hy-person-card__info-container__phone-container"},e("span",{class:"hy-person-card__info-container__phone__icon"},e("hy-icon",{icon:"hy-icon-phone",size:14})),e("span",{class:"hy-person-card__info-container__phone"},this.phone))],this.aboutInfo&&e("div",{class:"hy-person-card__extended-info-container__about"},e("span",{class:"label"},this.aboutInfoLabel,":"),e("span",null,this.aboutInfo)))))}};r.style=t;export{r as hy_person_card};
+//# sourceMappingURL=hy-person-card.entry.js.map

package/dist/huds-lib/hy-person-card.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyPersonCardCss","HyPersonCard","PersonCardVariants","default","componentDidLoad","this","ro","ResizeObserver","entries","entry","checkForMobile","contentRect","width","observe","document","body","disconnectedCallback","disconnect","size","isMobile","componentWillRender","_fullName","firstName","lastName","_initials","imageUrl","charAt","imageAlt","scLabel","render","classLinkAttributes","variant","join","classIsActive","url","length","concat","classAttributes","classPositionTitle","target","isExternal","h","class","categoryTitle","href","loading","disableLazy","src","alt","positionTitle","department","extended","field","email","icon","phone","aboutInfo","aboutInfoLabel"],"sources":["./src/components/hy-person-card/hy-person-card.scss?tag=hy-person-card","./src/components/hy-person-card/hy-person-card.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-person-card-container {\n  font-family: var(--main-font-family);\n  margin-bottom: 28px;\n\n  @include breakpoint($wide) {\n    margin-bottom: 32px;\n  }\n\n  &__category-title {\n    @include font-size(12px, 14px);\n    color: var(--grayscale-dark);\n    letter-spacing: 0;\n    margin-bottom: 8px;\n\n    @include breakpoint($narrow) {\n      @include font-size(14px, 18px);\n    }\n\n    @include breakpoint($fullhd) {\n      @include font-size(14px, 18px); //>1920 desktop\n    }\n  }\n\n  &__link {\n    text-decoration: none;\n\n    &.inactive {\n      cursor: default;\n      pointer-events: none;\n    }\n  }\n}\n\n.hy-person-card {\n  display: flex;\n  flex-direction: row;\n  font-family: var(--main-font-family);\n\n  &__image-container {\n    margin-right: 12px;\n    max-width: 70px;\n\n    @include breakpoint($narrow) {\n      margin-right: 16px;\n      max-width: 112px;\n    }\n\n    @include breakpoint($fullhd) {\n      max-width: 140px;\n    }\n\n    &__image {\n      height: 70px;\n      width: 70px;\n\n      @include breakpoint($narrow) {\n        height: 112px;\n        width: 112px;\n      }\n\n      @include breakpoint($fullhd) {\n        //1920\n        height: 140px;\n        width: 140px;\n      }\n      img {\n        height: 70px;\n        width: 70px;\n        object-fit: cover;\n\n        @include breakpoint($narrow) {\n          height: 112px;\n          width: 112px;\n        }\n\n        @include breakpoint($fullhd) {\n          height: 140px;\n          width: 140px;\n        }\n      }\n    }\n    &__no-image {\n      height: 70px;\n      width: 70px;\n\n      align-items: center;\n      background-color: var(--brand-main-light);\n      display: flex;\n      justify-content: center;\n\n      @include breakpoint($narrow) {\n        height: 112px;\n        width: 112px;\n      }\n\n      @include breakpoint($fullhd) {\n        height: 140px;\n        width: 140px;\n      }\n\n      &__initials {\n        @include font-size(18px, 24px);\n        @include font-weight($bold);\n        color: var(--grayscale-white);\n        letter-spacing: -0.56px;\n\n        @include breakpoint($narrow) {\n          @include font-size(32px, 32px);\n          letter-spacing: 0.96px;\n        }\n      }\n    }\n  }\n\n  &__info-container {\n    &__full-name {\n      @include font-size(18px, 24px);\n      @include font-weight($bold);\n\n      color: var(--brand-main-light);\n      letter-spacing: -0.56px;\n      margin-bottom: 4px;\n      text-decoration: none;\n\n      @include breakpoint($narrow) {\n        @include font-size(22px, 28px);\n        letter-spacing: -0.69px;\n        margin-bottom: 3px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(26px, 28px);\n        letter-spacing: -0.81px;\n        margin-bottom: 5px;\n      }\n\n      &:hover,\n      &:focus {\n        color: var(--brand-main);\n      }\n    }\n\n    &__position-title {\n      @include font-size(14px, 19px);\n      @include font-weight($bold);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-bottom: 3px;\n\n      @include breakpoint($narrow) {\n        @include font-size(16px, 20px);\n        letter-spacing: -0.5px;\n        margin-bottom: 4px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(18px, 24px);\n        letter-spacing: -0.56px;\n        margin-bottom: 8px;\n      }\n\n      &__search-panel {\n        @include font-weight($regular);\n      }\n    }\n\n    &__department {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-bottom: 3px;\n      text-transform: uppercase;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-bottom: 6px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(14px, 16px);\n        margin-bottom: 9px;\n      }\n    }\n\n    &__field {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-bottom: 4px;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-bottom: 6px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(14px, 16px);\n        margin-bottom: 9px;\n      }\n    }\n\n    &__email-container {\n      align-items: center;\n      display: flex;\n      margin-bottom: 4px;\n    }\n    &__email {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-left: 11px;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-left: 8px;\n      }\n\n      &__icon {\n        svg {\n          height: 15px;\n          width: 16px;\n\n          @include breakpoint($narrow) {\n            height: 12px;\n            width: 16px;\n          }\n        }\n      }\n    }\n\n    &__phone-container {\n      align-items: center;\n      display: flex;\n    }\n    &__phone {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-left: 11px;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-left: 8px;\n      }\n\n      &__icon {\n        svg {\n          height: 13px;\n          width: 13px;\n\n          @include breakpoint($narrow) {\n            height: 14px;\n            width: 14px;\n          }\n        }\n      }\n    }\n  }\n\n  &.search-panel {\n    margin-bottom: 12px;\n\n    @include breakpoint($narrow) {\n      margin-bottom: 14px;\n    }\n\n    .hy-person-card__info-container__full-name {\n      @include font-size(14px, 20px);\n      @include font-weight($semibold);\n      color: var(--grayscale-dark);\n      letter-spacing: 0;\n      margin-bottom: 0;\n\n      @include breakpoint($narrow) {\n        letter-spacing: -0.3px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(16px, 24px);\n        letter-spacing: 0;\n      }\n    }\n\n    .hy-person-card__info-container__position-title {\n      @include font-size(12px, 16px);\n      color: var(--grayscale-dark);\n      letter-spacing: -0.07px;\n      margin-bottom: 0;\n    }\n\n    .hy-person-card__image-container {\n      margin-right: 12px;\n\n      &__image {\n        height: 60px;\n        width: 60px;\n        img {\n          height: 60px;\n          width: 60px;\n        }\n      }\n      &__no-image {\n        height: 60px;\n        width: 60px;\n\n        &__initials {\n          color: var(--grayscale-white);\n          @include font-size(16px, 32px);\n          @include font-weight($bold);\n          letter-spacing: 0.48px;\n        }\n      }\n    }\n  }\n}\n\n.hy-person-card__extended-info-container {\n  display: block;\n  padding-top: 8px;\n\n  @include breakpoint($narrow) {\n    padding-top: 12px;\n  }\n\n  &__about {\n    @include font-size(12px, 17px);\n    color: var(--grayscale-dark-text);\n    font-family: var(--main-font-family);\n    font-style: italic;\n    letter-spacing: 0;\n\n    @include breakpoint($narrow) {\n      @include font-size(12px, 16px);\n    }\n    @include breakpoint($xlarge) {\n      @include font-size(14px, 16px);\n    }\n\n    .label {\n      @include font-weight($bold);\n      padding-right: 3px;\n    }\n  }\n}\n","import {Component, h, Prop, State} from \"@stencil/core\";\nimport {PersonCardVariants} from \"../../utils/utils\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\n@Component({\n  tag: \"hy-person-card\",\n  styleUrl: \"hy-person-card.scss\",\n  shadow: false,\n})\nexport class HyPersonCard {\n  @Prop() variant: PersonCardVariants = PersonCardVariants.default;\n  @Prop() categoryTitle?: string;\n  @Prop() imageUrl: string = null;\n  @Prop() imageAlt: string = null;\n  @Prop() disableLazy: boolean = false;\n  @Prop() firstName?: string;\n  @Prop() lastName?: string;\n  @Prop() url: string = null;\n  @Prop() isExternal: boolean = false;\n  @Prop() scLabel?: string;\n  @Prop() positionTitle?: string;\n  @Prop() department: string = null;\n  @Prop() field: string = null;\n  @Prop() email: string = null;\n  @Prop() phone: string = null;\n  @Prop() aboutInfo: string = null;\n  @Prop() researchNetworks?: string;\n  @Prop() studyProgramme?: string;\n  @Prop() aboutInfoLabel?: string;\n  @Prop() researchNetworksLabel?: string;\n  @Prop() studyProgrammeLabel?: string;\n\n  private _fullName: string;\n  private _initials: string;\n\n  @State() isMobile: boolean;\n\n  private ro: ResizeObserver;\n  componentDidLoad() {\n    this.ro = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        this.checkForMobile(entry.contentRect.width);\n      }\n    });\n    this.ro.observe(document.body);\n  }\n\n  disconnectedCallback() {\n    this.ro.disconnect();\n  }\n\n  checkForMobile(size: number) {\n    this.isMobile = size <= 479 ? true : false;\n  }\n\n  componentWillRender() {\n    this._fullName = this.firstName && this.lastName ? `${this.firstName} ${this.lastName}` : \"\";\n    this._initials =\n      this.imageUrl && this.firstName && this.lastName ? \"\" : `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`;\n    if (!this.imageAlt) {\n      this.imageAlt = this._fullName;\n    }\n    if (!this.scLabel) {\n      this.scLabel = \"Link to the person profile\";\n    }\n  }\n\n  render() {\n    let classLinkAttributes = [\"hy-person-card-container__link\", this.variant].join(\" \");\n    let classIsActive = this.url && this.url.length > 0 ? \"\" : \" inactive\";\n    classLinkAttributes = classLinkAttributes.concat(classIsActive);\n\n    const classAttributes = [\"hy-person-card\", this.variant].join(\" \");\n    const classPositionTitle = [\n      \"hy-person-card__info-container__position-title\",\n      `hy-person-card__info-container__position-title__${this.variant}`,\n    ].join(\" \");\n    const target = this.isExternal ? \"_blank\" : \"_self\";\n\n    return (\n      <article class=\"hy-person-card-container\">\n        <div class={classLinkAttributes}>\n          {this.categoryTitle && this.variant == PersonCardVariants.default && (\n            <div class=\"hy-person-card-container__category-title\">{this.categoryTitle}</div>\n          )}\n          <div class={classAttributes}>\n            <div class=\"hy-person-card__image-container\">\n              {this.imageUrl ? (\n                <a class=\"hy-person-card__image-container__image\" href={this.url} target={target}>\n                  <img\n                    loading={this.disableLazy ? \"eager\" : \"lazy\"}\n                    aria-hidden=\"true\"\n                    src={this.imageUrl}\n                    alt={this.imageAlt}\n                  />\n                </a>\n              ) : (\n                <div class=\"hy-person-card__image-container__no-image\">\n                  <div class=\"hy-person-card__image-container__no-image__initials\" aria-hidden=\"true\">\n                    {this._initials}\n                  </div>\n                </div>\n              )}\n            </div>\n            <div class=\"hy-person-card__info-container\">\n              <a class=\"hy-person-card__info-container__full-name\" href={this.url} target={target}>\n                {this._fullName}\n              </a>\n              {this.positionTitle && <div class={classPositionTitle}>{this.positionTitle}</div>}\n              {this.department &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && (\n                  <div class=\"hy-person-card__info-container__department\">{this.department}</div>\n                )}\n              {this.field &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && (\n                  <div class=\"hy-person-card__info-container__field\">{this.field}</div>\n                )}\n              {this.email &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && [\n                  <div class=\"hy-person-card__info-container__email-container\">\n                    <span class=\"hy-person-card__info-container__email__icon\">\n                      <hy-icon icon={\"hy-icon-email\"} size={16} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__email\">{this.email}</span>\n                  </div>,\n                ]}\n              {this.phone &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && [\n                  <div class=\"hy-person-card__info-container__phone-container\">\n                    <span class=\"hy-person-card__info-container__phone__icon\">\n                      <hy-icon icon={\"hy-icon-phone\"} size={14} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__phone\">{this.phone}</span>\n                  </div>,\n                ]}\n            </div>\n          </div>\n          {this.variant == PersonCardVariants.extended && (\n            <div class=\"hy-person-card hy-person-card__extended-info-container\">\n              {this.department && this.isMobile && (\n                <div class=\"hy-person-card__info-container__department\">{this.department}</div>\n              )}\n              {this.field && this.isMobile && <div class=\"hy-person-card__info-container__field\">{this.field}</div>}\n              {this.email &&\n                this.isMobile && [\n                  <div class=\"hy-person-card__info-container__email-container\">\n                    <span class=\"hy-person-card__info-container__email__icon\">\n                      <hy-icon icon={\"hy-icon-email\"} size={16} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__email\">{this.email}</span>\n                  </div>,\n                ]}\n              {this.phone &&\n                this.isMobile && [\n                  <div class=\"hy-person-card__info-container__phone-container\">\n                    <span class=\"hy-person-card__info-container__phone__icon\">\n                      <hy-icon icon={\"hy-icon-phone\"} size={14} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__phone\">{this.phone}</span>\n                  </div>,\n                ]}\n              {this.aboutInfo && (\n                <div class=\"hy-person-card__extended-info-container__about\">\n                  <span class=\"label\">{this.aboutInfoLabel}:</span>\n                  <span>{this.aboutInfo}</span>\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </article>\n    );\n  }\n}\n"],"mappings":"+HAAA,MAAMA,EAAkB,8lR,MCSXC,EAAY,M,sCACeC,EAAmBC,Q,2CAE9B,K,cACA,K,iBACI,M,0DAGT,K,gBACQ,M,oEAGD,K,WACL,K,WACA,K,WACA,K,eACI,K,4LAa5BC,mBACEC,KAAKC,GAAK,IAAIC,GAAgBC,IAC5B,IAAK,MAAMC,KAASD,EAAS,CAC3BH,KAAKK,eAAeD,EAAME,YAAYC,M,KAG1CP,KAAKC,GAAGO,QAAQC,SAASC,K,CAG3BC,uBACEX,KAAKC,GAAGW,Y,CAGVP,eAAeQ,GACbb,KAAKc,SAAWD,GAAQ,IAAM,KAAO,K,CAGvCE,sBACEf,KAAKgB,UAAYhB,KAAKiB,WAAajB,KAAKkB,SAAW,GAAGlB,KAAKiB,aAAajB,KAAKkB,WAAa,GAC1FlB,KAAKmB,UACHnB,KAAKoB,UAAYpB,KAAKiB,WAAajB,KAAKkB,SAAW,GAAK,GAAGlB,KAAKiB,UAAUI,OAAO,KAAKrB,KAAKkB,SAASG,OAAO,KAC7G,IAAKrB,KAAKsB,SAAU,CAClBtB,KAAKsB,SAAWtB,KAAKgB,S,CAEvB,IAAKhB,KAAKuB,QAAS,CACjBvB,KAAKuB,QAAU,4B,EAInBC,SACE,IAAIC,EAAsB,CAAC,iCAAkCzB,KAAK0B,SAASC,KAAK,KAChF,IAAIC,EAAgB5B,KAAK6B,KAAO7B,KAAK6B,IAAIC,OAAS,EAAI,GAAK,YAC3DL,EAAsBA,EAAoBM,OAAOH,GAEjD,MAAMI,EAAkB,CAAC,iBAAkBhC,KAAK0B,SAASC,KAAK,KAC9D,MAAMM,EAAqB,CACzB,iDACA,mDAAmDjC,KAAK0B,WACxDC,KAAK,KACP,MAAMO,EAASlC,KAAKmC,WAAa,SAAW,QAE5C,OACEC,EAAA,WAASC,MAAM,4BACbD,EAAA,OAAKC,MAAOZ,GACTzB,KAAKsC,eAAiBtC,KAAK0B,SAAW7B,EAAmBC,SACxDsC,EAAA,OAAKC,MAAM,4CAA4CrC,KAAKsC,eAE9DF,EAAA,OAAKC,MAAOL,GACVI,EAAA,OAAKC,MAAM,mCACRrC,KAAKoB,SACJgB,EAAA,KAAGC,MAAM,yCAAyCE,KAAMvC,KAAK6B,IAAKK,OAAQA,GACxEE,EAAA,OACEI,QAASxC,KAAKyC,YAAc,QAAU,OAAM,cAChC,OACZC,IAAK1C,KAAKoB,SACVuB,IAAK3C,KAAKsB,YAIdc,EAAA,OAAKC,MAAM,6CACTD,EAAA,OAAKC,MAAM,sDAAqD,cAAa,QAC1ErC,KAAKmB,aAKdiB,EAAA,OAAKC,MAAM,kCACTD,EAAA,KAAGC,MAAM,4CAA4CE,KAAMvC,KAAK6B,IAAKK,OAAQA,GAC1ElC,KAAKgB,WAEPhB,KAAK4C,eAAiBR,EAAA,OAAKC,MAAOJ,GAAqBjC,KAAK4C,eAC5D5C,KAAK6C,aACH7C,KAAK0B,SAAW7B,EAAmBC,SACjCE,KAAK0B,SAAW7B,EAAmBiD,WAAa9C,KAAKc,WACtDsB,EAAA,OAAKC,MAAM,8CAA8CrC,KAAK6C,YAEjE7C,KAAK+C,QACH/C,KAAK0B,SAAW7B,EAAmBC,SACjCE,KAAK0B,SAAW7B,EAAmBiD,WAAa9C,KAAKc,WACtDsB,EAAA,OAAKC,MAAM,yCAAyCrC,KAAK+C,OAE5D/C,KAAKgD,QACHhD,KAAK0B,SAAW7B,EAAmBC,SACjCE,KAAK0B,SAAW7B,EAAmBiD,WAAa9C,KAAKc,WAAc,CACpEsB,EAAA,OAAKC,MAAM,mDACTD,EAAA,QAAMC,MAAM,+CACVD,EAAA,WAASa,KAAM,gBAAiBpC,KAAM,MAExCuB,EAAA,QAAMC,MAAM,yCAAyCrC,KAAKgD,SAG/DhD,KAAKkD,QACHlD,KAAK0B,SAAW7B,EAAmBC,SACjCE,KAAK0B,SAAW7B,EAAmBiD,WAAa9C,KAAKc,WAAc,CACpEsB,EAAA,OAAKC,MAAM,mDACTD,EAAA,QAAMC,MAAM,+CACVD,EAAA,WAASa,KAAM,gBAAiBpC,KAAM,MAExCuB,EAAA,QAAMC,MAAM,yCAAyCrC,KAAKkD,WAKnElD,KAAK0B,SAAW7B,EAAmBiD,UAClCV,EAAA,OAAKC,MAAM,0DACRrC,KAAK6C,YAAc7C,KAAKc,UACvBsB,EAAA,OAAKC,MAAM,8CAA8CrC,KAAK6C,YAE/D7C,KAAK+C,OAAS/C,KAAKc,UAAYsB,EAAA,OAAKC,MAAM,yCAAyCrC,KAAK+C,OACxF/C,KAAKgD,OACJhD,KAAKc,UAAY,CACfsB,EAAA,OAAKC,MAAM,mDACTD,EAAA,QAAMC,MAAM,+CACVD,EAAA,WAASa,KAAM,gBAAiBpC,KAAM,MAExCuB,EAAA,QAAMC,MAAM,yCAAyCrC,KAAKgD,SAG/DhD,KAAKkD,OACJlD,KAAKc,UAAY,CACfsB,EAAA,OAAKC,MAAM,mDACTD,EAAA,QAAMC,MAAM,+CACVD,EAAA,WAASa,KAAM,gBAAiBpC,KAAM,MAExCuB,EAAA,QAAMC,MAAM,yCAAyCrC,KAAKkD,SAG/DlD,KAAKmD,WACJf,EAAA,OAAKC,MAAM,kDACTD,EAAA,QAAMC,MAAM,SAASrC,KAAKoD,eAAc,KACxChB,EAAA,YAAOpC,KAAKmD,c"}

package/dist/huds-lib/hy-person-profile-listing.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as e,H as n}from"./index-f84f2a7d.js";const l=":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}.hy-person-profile-listing{font-family:var(--main-font-family);padding:0;margin:0;list-style:none;display:grid;gap:24px}@media (min-width: 48rem){.hy-person-profile-listing{gap:2px 24px}}@media (min-width: 120.0625rem){.hy-person-profile-listing.col-2{grid-template-columns:repeat(2, 50%)}}.hy-person-profile-listing.col-4{gap:32px 24px}@media (min-width: 48rem){.hy-person-profile-listing.col-4{grid-template-columns:repeat(2, 50%)}}@media (min-width: 60rem){.hy-person-profile-listing.col-4{grid-template-columns:repeat(3, 33.3333333333%)}}@media (min-width: 120.0625rem){.hy-person-profile-listing.col-4{grid-template-columns:repeat(4, 25%)}}.hy-person-profile-listing__label{font-size:0.9375rem;line-height:18px;font-weight:700;letter-spacing:-0.28px;color:var(--grayscale-black);margin:0 0 8px}@media (min-width: 48rem){.hy-person-profile-listing__label{font-size:1.0625rem;line-height:20px;letter-spacing:-0.32px}}.hy-person-profile-listing__items{margin:0;padding:0;list-style:none;display:grid;gap:8px}.is-inline .hy-person-profile-listing__items{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:0}.text-tight .hy-person-profile-listing__items{gap:0}.hy-person-profile-listing__item{font-size:0.9375rem;line-height:22px;font-weight:400;color:var(--grayscale-black);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}@media (min-width: 48rem){.hy-person-profile-listing__item{font-size:1.0625rem;line-height:26px}}.hy-person-profile-listing__item a{text-decoration:none;color:var(--link-blue)}.hy-person-profile-listing__item a:hover{text-decoration:underline}.hy-person-profile-listing__item hy-icon{display:none !important;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:28px;width:28px}@media (min-width: 48rem){.hy-person-profile-listing__item hy-icon{display:-webkit-inline-box !important;display:-ms-inline-flexbox !important;display:inline-flex !important}}.without-icons .hy-person-profile-listing__item hy-icon{display:none !important}";const t=class{constructor(e){i(this,e);this.items=undefined;this.col="col-2";this.inline=undefined;this.withoutIcons=undefined;this.textSpacingTight=undefined;this.isResearch=false}render(){return e(n,null,e("ul",{class:`hy-person-profile-listing ${this.col} ${this.inline?"is-inline":""} ${this.withoutIcons?"without-icons":""} ${this.textSpacingTight?"text-tight":""}`},this.isResearch&&e("h3",{class:"hy-person-profile-listing__label"},this.items[0].label),this.items.map((({label:i,items:n})=>{if(n.filter((({label:i})=>i!=="")).length>0){return e("li",null,!this.isResearch&&e("h3",{class:"hy-person-profile-listing__label"},i),e("ul",{class:"hy-person-profile-listing__items"},n.map((({label:i,url:n},l)=>{if(n){return e("li",{class:"hy-person-profile-listing__item"},e("a",{href:n},l!==0&&e("hy-icon",{icon:"hy-icon-caret-right",size:10}),e("span",null,i)))}return e("li",{class:"hy-person-profile-listing__item"},l!==0&&e("hy-icon",{icon:"hy-icon-caret-right",size:10}),e("span",null,i))}))))}}))))}};t.style=l;export{t as hy_person_profile_listing};
+//# sourceMappingURL=hy-person-profile-listing.entry.js.map

package/dist/huds-lib/hy-person-profile-listing.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["personProfileListingCss","PersonProfile","render","h","Host","class","this","col","inline","withoutIcons","textSpacingTight","isResearch","items","label","map","filter","length","url","index","href","icon","size"],"sources":["./src/components/hy-person-profile/person-profile-listing/person-profile-listing.scss?tag=hy-person-profile-listing","./src/components/hy-person-profile/person-profile-listing/person-profile.listing.tsx"],"sourcesContent":[".hy-person-profile-listing {\n  font-family: var(--main-font-family);\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  display: grid;\n  gap: 24px;\n\n  @include breakpoint($medium) {\n    gap: 2px 24px;\n  }\n\n  &.col-2 {\n    @include breakpoint($fullhd) {\n      grid-template-columns: repeat(2, 50%);\n    }\n  }\n\n  &.col-4 {\n    gap: 32px 24px;\n\n    @include breakpoint($medium) {\n      grid-template-columns: repeat(2, 50%);\n    }\n\n    @include breakpoint($wide) {\n      grid-template-columns: repeat(3, calc(100% / 3));\n    }\n\n    @include breakpoint($fullhd) {\n      grid-template-columns: repeat(4, 25%);\n    }\n  }\n}\n\n.hy-person-profile-listing__label {\n  @include font-size(15px, 18px);\n  @include font-weight($bold);\n  letter-spacing: -0.28px;\n  color: var(--grayscale-black);\n  margin: 0 0 8px;\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 20px);\n    letter-spacing: -0.32px;\n  }\n}\n\n.hy-person-profile-listing__items {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: grid;\n  gap: 8px;\n\n  .is-inline & {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: 0;\n  }\n\n  .text-tight & {\n    gap: 0;\n  }\n}\n\n.hy-person-profile-listing__item {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  color: var(--grayscale-black);\n  display: inline-flex;\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 26px);\n  }\n\n  a {\n    text-decoration: none;\n    color: var(--link-blue);\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  hy-icon {\n    display: none !important;\n    justify-content: center;\n    align-items: center;\n    height: 28px;\n    width: 28px;\n\n    @include breakpoint($medium) {\n      display: inline-flex !important;\n    }\n\n    .without-icons & {\n      display: none !important;\n    }\n  }\n}\n","import {Component, Host, h, Prop} from \"@stencil/core\";\n\nexport type personProfileListingItems = [\n  {\n    label: string;\n    items: string[];\n  }\n];\n\n@Component({\n  tag: \"hy-person-profile-listing\",\n  shadow: false,\n  styleUrl: \"person-profile-listing.scss\",\n})\nexport class PersonProfile {\n  @Prop() items: personProfileListingItems;\n  @Prop() col?: \"col-1\" | \"col-2\" | \"col-4\" = \"col-2\";\n  @Prop() inline?: boolean;\n  @Prop() withoutIcons?: boolean;\n  @Prop() textSpacingTight?: boolean;\n  @Prop() isResearch: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <ul\n          class={`hy-person-profile-listing ${this.col} ${this.inline ? \"is-inline\" : \"\"} ${\n            this.withoutIcons ? \"without-icons\" : \"\"\n          } ${this.textSpacingTight ? \"text-tight\" : \"\"}`}\n        >\n          {this.isResearch && <h3 class=\"hy-person-profile-listing__label\">{this.items[0].label}</h3>}\n          {this.items.map(({label, items}) => {\n            if ((items as any).filter(({label}) => label !== \"\").length > 0) {\n              return (\n                <li>\n                  {!this.isResearch && <h3 class=\"hy-person-profile-listing__label\">{label}</h3>}\n\n                  <ul class=\"hy-person-profile-listing__items\">\n                    {(items as any).map(({label, url}, index) => {\n                      if (url) {\n                        return (\n                          <li class=\"hy-person-profile-listing__item\">\n                            <a href={url}>\n                              {index !== 0 && <hy-icon icon={\"hy-icon-caret-right\"} size={10} />}\n                              <span>{label}</span>\n                            </a>\n                          </li>\n                        );\n                      }\n\n                      return (\n                        <li class=\"hy-person-profile-listing__item\">\n                          {index !== 0 && <hy-icon icon={\"hy-icon-caret-right\"} size={10} />}\n                          <span>{label}</span>\n                        </li>\n                      );\n                    })}\n                  </ul>\n                </li>\n              );\n            }\n          })}\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sDAAA,MAAMA,EAA0B,ovG,MCcnBC,EAAa,M,uDAEoB,Q,kGAId,K,CAE9BC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,MACEE,MAAO,6BAA6BC,KAAKC,OAAOD,KAAKE,OAAS,YAAc,MAC1EF,KAAKG,aAAe,gBAAkB,MACpCH,KAAKI,iBAAmB,aAAe,MAE1CJ,KAAKK,YAAcR,EAAA,MAAIE,MAAM,oCAAoCC,KAAKM,MAAM,GAAGC,OAC/EP,KAAKM,MAAME,KAAI,EAAED,QAAOD,YACvB,GAAKA,EAAcG,QAAO,EAAEF,WAAWA,IAAU,KAAIG,OAAS,EAAG,CAC/D,OACEb,EAAA,WACIG,KAAKK,YAAcR,EAAA,MAAIE,MAAM,oCAAoCQ,GAEnEV,EAAA,MAAIE,MAAM,oCACNO,EAAcE,KAAI,EAAED,QAAOI,OAAMC,KACjC,GAAID,EAAK,CACP,OACEd,EAAA,MAAIE,MAAM,mCACRF,EAAA,KAAGgB,KAAMF,GACNC,IAAU,GAAKf,EAAA,WAASiB,KAAM,sBAAuBC,KAAM,KAC5DlB,EAAA,YAAOU,I,CAMf,OACEV,EAAA,MAAIE,MAAM,mCACPa,IAAU,GAAKf,EAAA,WAASiB,KAAM,sBAAuBC,KAAM,KAC5DlB,EAAA,YAAOU,GACJ,K"}

package/dist/huds-lib/hy-person-profile.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i,F as a,H as t}from"./index-f84f2a7d.js";import{d as n}from"./utils-7438924c.js";const o=":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}.hy-profile-page__back-button{font-size:1rem;line-height:20px;font-weight:600;font-family:var(--main-font-family);letter-spacing:-0.5px;color:var(--brand-main-light);padding:12px 10px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;text-decoration:none;margin-left:-10px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:16px}@media (min-width: 48rem){.hy-profile-page__back-button{margin-bottom:24px}}.hy-profile-page__back-button hy-icon{margin-right:16px}.hy-profile-page__back-button hy-icon svg{fill:var(--brand-main-light)}.hy-profile-page__section{padding:32px 0}.hy-profile-page__section:first-of-type{padding:0 0 32px}.hy-profile-page__section:not(:first-of-type){border-top:1px solid var(--grayscale-medium)}.hy-profile-page__section__research_title>h2,.hy-profile-page__section>h2{font-size:1.625rem;line-height:32px;font-weight:700;font-family:var(--main-font-family);letter-spacing:-0.52px;color:var(--grayscale-black);margin:0 0 32px}@media (min-width: 48rem){.hy-profile-page__section__research_title>h2,.hy-profile-page__section>h2{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}.hy-profile-page__section__research_title{display:block;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (min-width: 48rem){.hy-profile-page__section__research_title{display:-webkit-box;display:-ms-flexbox;display:flex}}.hy-profile-page__section__research_title>hy-cta-button{margin:0 0 32px 0}@media (min-width: 48rem){.hy-profile-page__section__research_title>hy-cta-button{margin:0 0 32px auto}}.hy-profile-page__organization-units-section{font-family:var(--main-font-family);padding:0;margin:0;list-style:none}.hy-profile-page__organization-units-section h3{font-size:0.9375rem;line-height:18px;font-weight:700;letter-spacing:-0.28px;color:var(--grayscale-black);margin:0 0 8px}@media (min-width: 48rem){.hy-profile-page__organization-units-section h3{font-size:1.0625rem;line-height:20px;letter-spacing:-0.32px}}.hy-profile-page__organization-units-section{margin-top:24px}@media (min-width: 48rem){.hy-profile-page__organization-units-section{margin-top:32px}}.hy-profile-page__organization-units-section a{text-decoration:none;color:var(--link-blue)}.hy-profile-page__organization-units-section a:hover{text-decoration:underline}.hy-profile-page__organizations,.hy-profile-page__organizations ul,.hy-profile-page__research-organizations,.hy-profile-page__research-organizations ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.hy-profile-page__organizations li,.hy-profile-page__research-organizations li{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.hy-profile-page__organizations li span,.hy-profile-page__research-organizations li span{font-size:0.9375rem;line-height:22px;font-weight:400;color:var(--grayscale-black)}@media (min-width: 48rem){.hy-profile-page__organizations li span,.hy-profile-page__research-organizations li span{font-size:1.0625rem;line-height:26px}}.hy-profile-page__organizations li>span,.hy-profile-page__research-organizations li>span{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.hy-profile-page__organizations li hy-icon,.hy-profile-page__research-organizations li hy-icon{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:22px;width:28px}@media (min-width: 48rem){.hy-profile-page__organizations li hy-icon,.hy-profile-page__research-organizations li hy-icon{height:26px}}.hy-profile-page__person-about-text{font-size:0.9375rem;line-height:22px;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-black)}@media (min-width: 48rem){.hy-profile-page__person-about-text{font-size:1.0625rem;line-height:26px}}.hy-profile-page__person-about-text-toggle{font-size:0.9375rem;line-height:22px;font-weight:400;font-family:var(--main-font-family);color:var(--link-blue);background-color:transparent;border:0;padding:0;margin:0}@media (min-width: 48rem){.hy-profile-page__person-about-text-toggle{font-size:1.0625rem;line-height:26px}}.hy-profile-page__person-about-text-toggle:hover{cursor:pointer}.hy-profile-page__person-information{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px;margin-bottom:24px}@media (min-width: 48rem){.hy-profile-page__person-information{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:40px;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}}.hy-profile-page__image{aspect-ratio:328/425;width:100%;max-width:328px;-o-object-fit:cover;object-fit:cover;background-color:var(--grayscale-background-box)}@media (min-width: 48rem){.hy-profile-page__image{max-width:194px}}.hy-profile-page__contact-information>h2{font-size:1.625rem;line-height:32px;font-weight:700;font-family:var(--main-font-family);letter-spacing:-0.52px;color:var(--grayscale-black);margin:0 0 32px}@media (min-width: 48rem){.hy-profile-page__contact-information>h2{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}.hy-profile-page__name{font-size:2rem;line-height:38px;font-weight:700;font-family:var(--main-font-family);letter-spacing:-0.8px;color:var(--grayscale-black);margin:0 0 4px;text-transform:uppercase}@media (min-width: 60rem){.hy-profile-page__name{font-size:2.875rem;line-height:54px;letter-spacing:-1.15px;margin:0 0 8px}}@media (min-width: 120.0625rem){.hy-profile-page__name{font-size:3.25rem;line-height:60px;letter-spacing:-1.3px}}.hy-profile-page__job-title{font-size:1rem;line-height:20px;font-weight:700;font-family:var(--main-font-family);letter-spacing:-0.32px;color:var(--grayscale-black);margin:0 0 4px;text-transform:capitalize}@media (min-width: 60rem){.hy-profile-page__job-title{font-size:1.125rem;line-height:24px;letter-spacing:-0.36px}}.hy-profile-page__additional-information{font-size:0.9375rem;line-height:22px;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-dark-text);margin:0}@media (min-width: 60rem){.hy-profile-page__additional-information{font-size:1.0625rem;line-height:26px}}.hy-profile-page__person-content-container{display:none;margin-top:32px}@media (min-width: 48rem){.hy-profile-page__person-content-container{margin-top:44px}}.hy-profile-page__person-content-listing{display:grid;gap:32px;list-style:none;padding:0;margin:0}.hy-profile-page__person-content>h2{margin:0 0 8px}.hy-profile-page__person-content>h2 a{font-size:1.125rem;line-height:24px;font-weight:700;font-family:var(--main-font-family);letter-spacing:-0.36px;color:var(--link-blue);text-decoration:none}@media (min-width: 48rem){.hy-profile-page__person-content>h2 a{font-size:1.375rem;line-height:28px;letter-spacing:-0.44px}}.hy-profile-page__person-content>span,.hy-profile-page__person-content>p{font-size:0.9375rem;line-height:22px;font-weight:400;font-family:var(--main-font-family);color:var(--grayscale-dark-text)}@media (min-width: 48rem){.hy-profile-page__person-content>span,.hy-profile-page__person-content>p{font-size:1.0625rem;line-height:26px;letter-spacing:-0.44px}}.hy-profile-page__person-content>p{margin:8px 0 0}.hy-profile-page__loader{display:inline-block;position:relative;width:80px;height:80px;margin-top:32px}.hy-profile-page__loader.visible{display:block}.hy-profile-page__loader.hidden{display:none}@media (min-width: 48rem){.hy-profile-page__loader{margin-top:44px}}.hy-profile-page__loader div{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;position:absolute;width:64px;height:64px;margin:8px;border:6px solid #fff;border-radius:50%;-webkit-animation:loader-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;animation:loader-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;border-color:var(--brand-main-light) transparent transparent transparent}.hy-profile-page__loader div:nth-child(1){-webkit-animation-delay:-0.45s;animation-delay:-0.45s}.hy-profile-page__loader div:nth-child(2){-webkit-animation-delay:-0.3s;animation-delay:-0.3s}.hy-profile-page__loader div:nth-child(3){-webkit-animation-delay:-0.15s;animation-delay:-0.15s}@-webkit-keyframes loader-ring{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loader-ring{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.hidden{display:none;visibility:hidden}";let r;const l=class{constructor(i){e(this,i);this.personDataJson=undefined;this.showFullAboutText=undefined;this.hideFullAboutText=undefined;this.organizationItemsLabelText=undefined;this.peopleFinderReturnLink=undefined;this.peopleFinderReturnLabel=undefined;this.isFullAboutTextHidden=false;this.viewportSize=undefined}componentWillLoad(){this.viewportSize=window.innerWidth}toggleShowFullAboutText(){this.isFullAboutTextHidden=!this.isFullAboutTextHidden}disconnectedCallback(){clearTimeout(r)}render(){const{name:e,job_title:o,additional_information:l,image_url:p,contact_information:s,organization_units:g,about:h,research:c,person_content:d}=JSON.parse(this.personDataJson);const{organizations:f,research_organizations:m}=g.items;const _=h.description;const y=_.length;let b="";if(y>650){if(this.isFullAboutTextHidden){const e=_+"...";b=e}else{const e=_.substring(0,650)+"...";b=e}}window.addEventListener("resize",(()=>{clearTimeout(r);r=setTimeout((()=>{this.viewportSize=window.innerWidth}),250)}));const x=`${c.research_portal_label}: ${e}`;return i(t,null,i("section",{class:"hy-profile-page"},i("a",{href:this.peopleFinderReturnLink,class:"hy-profile-page__back-button"},i("hy-icon",{icon:"hy-icon-arrow-left",size:24}),i("span",null,this.peopleFinderReturnLabel)),i("section",{class:"hy-profile-page__section"},i("div",{class:"hy-profile-page__person-information"},i("div",null,i("h1",{class:"hy-profile-page__name"},e),o&&i("p",{class:"hy-profile-page__job-title"},o),l&&i("p",{class:"hy-profile-page__additional-information"},l)),p?i("img",{src:p,alt:"",class:"hy-profile-page__image"}):i("div",{class:"hy-profile-page__image","aria-hidden":"true"})),s&&i("div",{class:"hy-profile-page__contact-information"},s.label&&i("h2",null,s.label),s.items&&i("hy-person-profile-listing",{items:s.items,col:"col-4",withoutIcons:true,textSpacingTight:true}))),(f.items.length>0||Object.keys(m.items).length>0)&&i("section",{class:"hy-profile-page__section"},g.label&&i("h2",null,g.label),f.items.length>0&&i("section",{class:"hy-profile-page__organization-units-section"},i("h3",null,f.label),i("ul",{class:"hy-profile-page__organizations"},i("li",null,f.items.map(((e,a)=>i("span",null,a>1&&i("hy-icon",{icon:"hy-icon-caret-right",size:10}),a!==0&&i("span",null,i("a",{href:g.people_finder_path[g.lang]+"?researchOrganizations.id[]="+e.id,target:"_blank"},e.name[g.lang])))))))),Object.keys(m.items).length>0&&i("section",{class:"hy-profile-page__organization-units-section"},i("h3",null,m.label),i("ul",{class:"hy-profile-page__research-organizations"},Object.values(m.items).map((([...e])=>i("li",null,e.map(((e,t)=>i(a,null,t>1&&i("ul",null,i("li",null,i("span",null,i("hy-icon",{icon:"hy-icon-caret-right",size:10}),i("span",null,i("a",{href:g.people_finder_path[g.lang]+"?researchOrganizations.id[]="+e.id,target:"_blank"},e.name[g.lang]))))),t==1&&i("span",null,i("a",{href:g.people_finder_path[g.lang]+"?researchOrganizations.id[]="+e.id,target:"_blank"},e.name[g.lang]))))))))))),h&&y!==0&&i("section",{class:"hy-profile-page__section"},h.description&&i(a,null,i("h2",null,h.label),i("div",{class:"hy-profile-page__person-about-text",innerHTML:!this.isFullAboutTextHidden&&y>650?b:h.description})),y>650&&i("button",{class:"hy-profile-page__person-about-text-toggle",onClick:()=>this.toggleShowFullAboutText(),"aria-expanded":`${this.isFullAboutTextHidden?"true":"false"}`},this.isFullAboutTextHidden?this.hideFullAboutText:this.showFullAboutText)),(c&&c.items.length>0||d&&d.research_url.length>0)&&i("section",{class:"hy-profile-page__section"},i("div",{class:"hy-profile-page__section__research_title"},c.label&&i("h2",null,c.label),c.label&&d.research_url.length>0&&i("hy-cta-button",{"link-content":x,"sc-label":x,url:d.research_url,"is-external":"true",variant:n.onWhiteBkgd})),c.items&&i("hy-person-profile-listing",{items:c.items,col:"col-1",textSpacingTight:true,"is-research":true,inline:true}),d.research_url.length>0&&i("div",{class:"hy-profile-page__loader",role:"presentation"},i("div",null),i("div",null),i("div",null),i("div",null)),d.research_url.length>0&&this.viewportSize<768&&i("div",{class:"hy-profile-page__person-content-container"},i("hy-accordion-container",{accordionid:"accordion-container-person-content"},d.publications&&i("hy-accordion-item",{"data-accordion-id":"publications",accordiontitle:d.publications.label}),d.projects&&i("hy-accordion-item",{"data-accordion-id":"projects",accordiontitle:d.projects.label}),d.activities&&i("hy-accordion-item",{"data-accordion-id":"activities",accordiontitle:d.activities.label}))),d.research_url.length>0&&this.viewportSize>=768&&i("div",{class:"hy-profile-page__person-content-container"},i("hy-tabs",{"tab-id":"tabs-container-person-content"},d.publications&&i("hy-tabs-item",{"data-tab-id":"publications","tab-title":d.publications.label}),d.projects&&i("hy-tabs-item",{"data-tab-id":"projects","tab-title":d.projects.label}),d.activities&&i("hy-tabs-item",{"data-tab-id":"activities","tab-title":d.activities.label}))))))}};l.style=o;export{l as hy_person_profile};
+//# sourceMappingURL=hy-person-profile.entry.js.map

package/dist/huds-lib/hy-person-profile.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["personProfileCss","timer","PersonProfile","componentWillLoad","this","viewportSize","window","innerWidth","toggleShowFullAboutText","isFullAboutTextHidden","disconnectedCallback","clearTimeout","render","name","job_title","additional_information","image_url","contact_information","organization_units","about","research","person_content","JSON","parse","personDataJson","organizations","research_organizations","items","aboutDescriptionTextDestructured","description","aboutDescriptionLength","length","trimmedAboutDescription","ellipsisTextArray","substring","addEventListener","setTimeout","research_portal_title","research_portal_label","h","Host","class","href","peopleFinderReturnLink","icon","size","peopleFinderReturnLabel","src","alt","label","col","withoutIcons","textSpacingTight","Object","keys","map","item","index","people_finder_path","lang","id","target","values","Fragment","innerHTML","onClick","hideFullAboutText","showFullAboutText","research_url","url","variant","CtaLinkButtonVariants","onWhiteBkgd","inline","role","accordionid","publications","accordiontitle","projects","activities"],"sources":["./src/components/hy-person-profile/person-profile.scss?tag=hy-person-profile","./src/components/hy-person-profile/person-profile.tsx"],"sourcesContent":[".hy-profile-page__back-button {\n  @include font-size(16px, 20px);\n  @include font-weight($semibold);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.5px;\n  color: var(--brand-main-light);\n  padding: 12px 10px;\n  display: inline-flex;\n  text-decoration: none;\n  margin-left: -10px;\n  align-items: center;\n  margin-bottom: 16px;\n\n  @include breakpoint($medium) {\n    margin-bottom: 24px;\n  }\n\n  hy-icon {\n    margin-right: 16px;\n\n    svg {\n      fill: var(--brand-main-light);\n    }\n  }\n}\n\n.hy-profile-page__section {\n  padding: 32px 0;\n\n  &:first-of-type {\n    padding: 0 0 32px;\n  }\n\n  &:not(:first-of-type) {\n    border-top: 1px solid var(--grayscale-medium);\n  }\n\n  &__research_title > h2,\n  > h2 {\n    @include font-size(26px, 32px);\n    @include font-weight($bold);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.52px;\n    color: var(--grayscale-black);\n    margin: 0 0 32px;\n\n    @include breakpoint($medium) {\n      @include font-size(34px, 40px);\n      letter-spacing: -0.68px;\n    }\n  }\n\n  &__research_title {\n    display: block;\n    align-items: center;\n    @include breakpoint($medium) {\n      display: flex;\n    }\n\n    > hy-cta-button {\n      margin: 0 0 32px 0;\n      @include breakpoint($medium) {\n        margin: 0 0 32px auto;\n      }\n    }\n  }\n}\n\n.hy-profile-page__organization-units-section {\n  font-family: var(--main-font-family);\n  padding: 0;\n  margin: 0;\n  list-style: none;\n\n  h3 {\n    @include font-size(15px, 18px);\n    @include font-weight($bold);\n    letter-spacing: -0.28px;\n    color: var(--grayscale-black);\n    margin: 0 0 8px;\n\n    @include breakpoint($medium) {\n      @include font-size(17px, 20px);\n      letter-spacing: -0.32px;\n    }\n  }\n}\n\n.hy-profile-page__organization-units-section {\n  margin-top: 24px;\n\n  @include breakpoint($medium) {\n    margin-top: 32px;\n  }\n\n  a {\n    text-decoration: none;\n    color: var(--link-blue);\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n}\n\n.hy-profile-page__organizations,\n.hy-profile-page__research-organizations {\n  &,\n  ul {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    display: grid;\n    gap: 8px;\n  }\n\n  li {\n    display: inline-flex;\n    flex-wrap: wrap;\n\n    span {\n      @include font-size(15px, 22px);\n      @include font-weight($regular);\n      color: var(--grayscale-black);\n\n      @include breakpoint($medium) {\n        @include font-size(17px, 26px);\n      }\n    }\n\n    > span {\n      display: inline-flex;\n    }\n\n    hy-icon {\n      justify-content: center;\n      align-items: center;\n      height: 22px;\n      width: 28px;\n\n      @include breakpoint($medium) {\n        height: 26px;\n      }\n    }\n  }\n}\n\n.hy-profile-page__person-about-text {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  font-family: var(--main-font-family);\n  color: var(--grayscale-black);\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 26px);\n  }\n}\n\n.hy-profile-page__person-about-text-toggle {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  font-family: var(--main-font-family);\n  color: var(--link-blue);\n  background-color: transparent;\n  border: 0;\n  padding: 0;\n  margin: 0;\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 26px);\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n.hy-profile-page__person-information {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  margin-bottom: 24px;\n\n  @include breakpoint($medium) {\n    flex-direction: row-reverse;\n    align-items: center;\n    margin-bottom: 40px;\n    justify-content: flex-end;\n  }\n}\n\n.hy-profile-page__image {\n  aspect-ratio: 328 / 425;\n  width: 100%;\n  max-width: 328px;\n  object-fit: cover;\n  background-color: var(--grayscale-background-box);\n\n  @include breakpoint($medium) {\n    max-width: 194px;\n  }\n}\n\n.hy-profile-page__contact-information {\n  > h2 {\n    @include font-size(26px, 32px);\n    @include font-weight($bold);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.52px;\n    color: var(--grayscale-black);\n    margin: 0 0 32px;\n\n    @include breakpoint($medium) {\n      @include font-size(34px, 40px);\n      letter-spacing: -0.68px;\n    }\n  }\n}\n\n.hy-profile-page__name {\n  @include font-size(32px, 38px);\n  @include font-weight($bold);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.8px;\n  color: var(--grayscale-black);\n  margin: 0 0 4px;\n  text-transform: uppercase;\n\n  @include breakpoint($wide) {\n    @include font-size(46px, 54px);\n    letter-spacing: -1.15px;\n    margin: 0 0 8px;\n  }\n\n  @include breakpoint($fullhd) {\n    @include font-size(52px, 60px);\n    letter-spacing: -1.3px;\n  }\n}\n\n.hy-profile-page__job-title {\n  @include font-size(16px, 20px);\n  @include font-weight($bold);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.32px;\n  color: var(--grayscale-black);\n  margin: 0 0 4px;\n  text-transform: capitalize;\n\n  @include breakpoint($wide) {\n    @include font-size(18px, 24px);\n    letter-spacing: -0.36px;\n  }\n}\n\n.hy-profile-page__additional-information {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  font-family: var(--main-font-family);\n  color: var(--grayscale-dark-text);\n  margin: 0;\n\n  @include breakpoint($wide) {\n    @include font-size(17px, 26px);\n  }\n}\n\n.hy-profile-page__person-content-container {\n  display: none;\n  margin-top: 32px;\n\n  @include breakpoint($medium) {\n    margin-top: 44px;\n  }\n}\n\n.hy-profile-page__person-content-listing {\n  display: grid;\n  gap: 32px;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n\n.hy-profile-page__person-content {\n  > h2 {\n    margin: 0 0 8px;\n\n    a {\n      @include font-size(18px, 24px);\n      @include font-weight($bold);\n      font-family: var(--main-font-family);\n      letter-spacing: -0.36px;\n      color: var(--link-blue);\n      text-decoration: none;\n\n      @include breakpoint($medium) {\n        @include font-size(22px, 28px);\n        letter-spacing: -0.44px;\n      }\n    }\n  }\n\n  > span,\n  > p {\n    @include font-size(15px, 22px);\n    @include font-weight($regular);\n    font-family: var(--main-font-family);\n    color: var(--grayscale-dark-text);\n\n    @include breakpoint($medium) {\n      @include font-size(17px, 26px);\n      letter-spacing: -0.44px;\n    }\n  }\n\n  > p {\n    margin: 8px 0 0;\n  }\n}\n\n.hy-profile-page__loader {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n  margin-top: 32px;\n\n  &.visible {\n    display: block;\n  }\n\n  &.hidden {\n    display: none;\n  }\n\n  @include breakpoint($medium) {\n    margin-top: 44px;\n  }\n\n  div {\n    box-sizing: border-box;\n    display: block;\n    position: absolute;\n    width: 64px;\n    height: 64px;\n    margin: 8px;\n    border: 6px solid #fff;\n    border-radius: 50%;\n    animation: loader-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n    border-color: var(--brand-main-light) transparent transparent transparent;\n\n    &:nth-child(1) {\n      animation-delay: -0.45s;\n    }\n\n    &:nth-child(2) {\n      animation-delay: -0.3s;\n    }\n\n    &:nth-child(3) {\n      animation-delay: -0.15s;\n    }\n  }\n}\n\n@keyframes loader-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.hidden {\n  display: none;\n  visibility: hidden;\n}\n","import {Component, Host, h, Prop, State, Fragment} from \"@stencil/core\";\nimport {CtaLinkButtonVariants} from \"../../utils/utils\";\n\nlet timer;\n@Component({\n  tag: \"hy-person-profile\",\n  shadow: false,\n  styleUrl: \"person-profile.scss\",\n})\nexport class PersonProfile {\n  @Prop() personDataJson: string;\n  @Prop() showFullAboutText: string;\n  @Prop() hideFullAboutText: string;\n  @Prop() organizationItemsLabelText: string;\n  @Prop() peopleFinderReturnLink: string;\n  @Prop() peopleFinderReturnLabel: string;\n\n  @State() isFullAboutTextHidden: boolean = false;\n  @State() viewportSize: number;\n\n  componentWillLoad() {\n    this.viewportSize = window.innerWidth;\n  }\n\n  toggleShowFullAboutText() {\n    this.isFullAboutTextHidden = !this.isFullAboutTextHidden;\n  }\n\n  disconnectedCallback() {\n    clearTimeout(timer);\n  }\n\n  render() {\n    const {\n      name,\n      job_title,\n      additional_information,\n      image_url,\n      contact_information,\n      organization_units,\n      about,\n      research,\n      person_content,\n    } = JSON.parse(this.personDataJson);\n\n    const {organizations, research_organizations} = organization_units.items;\n\n    const aboutDescriptionTextDestructured = about.description;\n\n    const aboutDescriptionLength = aboutDescriptionTextDestructured.length;\n\n    let trimmedAboutDescription = \"\";\n\n    if (aboutDescriptionLength > 650) {\n      if (this.isFullAboutTextHidden) {\n        const ellipsisTextArray = aboutDescriptionTextDestructured + \"...\";\n\n        trimmedAboutDescription = ellipsisTextArray;\n      } else {\n        const ellipsisTextArray = aboutDescriptionTextDestructured.substring(0, 650) + \"...\";\n\n        trimmedAboutDescription = ellipsisTextArray;\n      }\n    }\n\n    window.addEventListener(\"resize\", () => {\n      clearTimeout(timer);\n      timer = setTimeout(() => {\n        this.viewportSize = window.innerWidth;\n      }, 250);\n    });\n\n    const research_portal_title = `${research.research_portal_label}: ${name}`;\n    return (\n      <Host>\n        <section class=\"hy-profile-page\">\n          <a href={this.peopleFinderReturnLink} class=\"hy-profile-page__back-button\">\n            <hy-icon icon={\"hy-icon-arrow-left\"} size={24} />\n            <span>{this.peopleFinderReturnLabel}</span>\n          </a>\n          <section class=\"hy-profile-page__section\">\n            <div class=\"hy-profile-page__person-information\">\n              <div>\n                <h1 class=\"hy-profile-page__name\">{name}</h1>\n                {job_title && <p class=\"hy-profile-page__job-title\">{job_title}</p>}\n                {additional_information && (\n                  <p class=\"hy-profile-page__additional-information\">{additional_information}</p>\n                )}\n              </div>\n              {image_url ? (\n                <img src={image_url} alt=\"\" class=\"hy-profile-page__image\" />\n              ) : (\n                <div class=\"hy-profile-page__image\" aria-hidden=\"true\" />\n              )}\n            </div>\n            {contact_information && (\n              <div class=\"hy-profile-page__contact-information\">\n                {contact_information.label && <h2>{contact_information.label}</h2>}\n                {contact_information.items && (\n                  <hy-person-profile-listing\n                    items={contact_information.items}\n                    col=\"col-4\"\n                    withoutIcons\n                    textSpacingTight\n                  ></hy-person-profile-listing>\n                )}\n              </div>\n            )}\n          </section>\n          {(organizations.items.length > 0 || Object.keys(research_organizations.items).length > 0) && (\n            <section class=\"hy-profile-page__section\">\n              {organization_units.label && <h2>{organization_units.label}</h2>}\n              {organizations.items.length > 0 && (\n                <section class=\"hy-profile-page__organization-units-section\">\n                  <h3>{organizations.label}</h3>\n                  <ul class=\"hy-profile-page__organizations\">\n                    <li>\n                      {organizations.items.map((item, index) => {\n                        return (\n                          <span>\n                            {index > 1 && <hy-icon icon={\"hy-icon-caret-right\"} size={10} />}\n                            {index !== 0 && (\n                              <span>\n                                <a\n                                  href={\n                                    organization_units.people_finder_path[organization_units.lang] +\n                                    \"?researchOrganizations.id[]=\" +\n                                    item.id\n                                  }\n                                  target={\"_blank\"}\n                                >\n                                  {item.name[organization_units.lang]}\n                                </a>\n                              </span>\n                            )}\n                          </span>\n                        );\n                      })}\n                    </li>\n                  </ul>\n                </section>\n              )}\n              {Object.keys(research_organizations.items).length > 0 && (\n                <section class=\"hy-profile-page__organization-units-section\">\n                  <h3>{research_organizations.label}</h3>\n                  <ul class=\"hy-profile-page__research-organizations\">\n                    {Object.values(research_organizations.items).map(([...item]) => (\n                      <li>\n                        {item.map((item, index) => {\n                          return (\n                            <Fragment>\n                              {index > 1 && (\n                                <ul>\n                                  <li>\n                                    <span>\n                                      <hy-icon icon={\"hy-icon-caret-right\"} size={10} />\n                                      <span>\n                                        <a\n                                          href={\n                                            organization_units.people_finder_path[organization_units.lang] +\n                                            \"?researchOrganizations.id[]=\" +\n                                            item.id\n                                          }\n                                          target={\"_blank\"}\n                                        >\n                                          {item.name[organization_units.lang]}\n                                        </a>\n                                      </span>\n                                    </span>\n                                  </li>\n                                </ul>\n                              )}\n                              {index == 1 && (\n                                <span>\n                                  <a\n                                    href={\n                                      organization_units.people_finder_path[organization_units.lang] +\n                                      \"?researchOrganizations.id[]=\" +\n                                      item.id\n                                    }\n                                    target={\"_blank\"}\n                                  >\n                                    {item.name[organization_units.lang]}\n                                  </a>\n                                </span>\n                              )}\n                            </Fragment>\n                          );\n                        })}\n                      </li>\n                    ))}\n                  </ul>\n                </section>\n              )}\n            </section>\n          )}\n          {about && aboutDescriptionLength !== 0 && (\n            <section class=\"hy-profile-page__section\">\n              {about.description && (\n                <Fragment>\n                  <h2>{about.label}</h2>\n                  <div\n                    class=\"hy-profile-page__person-about-text\"\n                    innerHTML={\n                      !this.isFullAboutTextHidden && aboutDescriptionLength > 650\n                        ? trimmedAboutDescription\n                        : about.description\n                    }\n                  ></div>\n                </Fragment>\n              )}\n              {aboutDescriptionLength > 650 && (\n                <button\n                  class=\"hy-profile-page__person-about-text-toggle\"\n                  onClick={() => this.toggleShowFullAboutText()}\n                  aria-expanded={`${this.isFullAboutTextHidden ? \"true\" : \"false\"}`}\n                >\n                  {this.isFullAboutTextHidden ? this.hideFullAboutText : this.showFullAboutText}\n                </button>\n              )}\n            </section>\n          )}\n          {((research && research.items.length > 0) || (person_content && person_content.research_url.length > 0)) && (\n            <section class=\"hy-profile-page__section\">\n              <div class=\"hy-profile-page__section__research_title\">\n                {research.label && <h2>{research.label}</h2>}\n                {research.label && person_content.research_url.length > 0 && (\n                  <hy-cta-button\n                    link-content={research_portal_title}\n                    sc-label={research_portal_title}\n                    url={person_content.research_url}\n                    is-external=\"true\"\n                    variant={CtaLinkButtonVariants.onWhiteBkgd}\n                  ></hy-cta-button>\n                )}\n              </div>\n\n              {research.items && (\n                <hy-person-profile-listing\n                  items={research.items}\n                  col=\"col-1\"\n                  textSpacingTight\n                  is-research\n                  inline\n                ></hy-person-profile-listing>\n              )}\n\n              {person_content.research_url.length > 0 && (\n                <div class=\"hy-profile-page__loader\" role=\"presentation\">\n                  <div></div>\n                  <div></div>\n                  <div></div>\n                  <div></div>\n                </div>\n              )}\n\n              {person_content.research_url.length > 0 && this.viewportSize < 768 && (\n                <div class=\"hy-profile-page__person-content-container\">\n                  <hy-accordion-container accordionid=\"accordion-container-person-content\">\n                    {person_content.publications && (\n                      <hy-accordion-item\n                        data-accordion-id={\"publications\"}\n                        accordiontitle={person_content.publications.label}\n                      ></hy-accordion-item>\n                    )}\n                    {person_content.projects && (\n                      <hy-accordion-item\n                        data-accordion-id={\"projects\"}\n                        accordiontitle={person_content.projects.label}\n                      ></hy-accordion-item>\n                    )}\n                    {person_content.activities && (\n                      <hy-accordion-item\n                        data-accordion-id={\"activities\"}\n                        accordiontitle={person_content.activities.label}\n                      ></hy-accordion-item>\n                    )}\n                  </hy-accordion-container>\n                </div>\n              )}\n              {person_content.research_url.length > 0 && this.viewportSize >= 768 && (\n                <div class=\"hy-profile-page__person-content-container\">\n                  <hy-tabs tab-id=\"tabs-container-person-content\">\n                    {person_content.publications && (\n                      <hy-tabs-item\n                        data-tab-id={\"publications\"}\n                        tab-title={person_content.publications.label}\n                      ></hy-tabs-item>\n                    )}\n                    {person_content.projects && (\n                      <hy-tabs-item data-tab-id={\"projects\"} tab-title={person_content.projects.label}></hy-tabs-item>\n                    )}\n                    {person_content.activities && (\n                      <hy-tabs-item\n                        data-tab-id={\"activities\"}\n                        tab-title={person_content.activities.label}\n                      ></hy-tabs-item>\n                    )}\n                  </hy-tabs>\n                </div>\n              )}\n            </section>\n          )}\n        </section>\n      </Host>\n    );\n  }\n}\n"],"mappings":"qGAAA,MAAMA,EAAmB,ooTCGzB,IAAIC,E,MAMSC,EAAa,M,2QAQkB,M,4BAG1CC,oBACEC,KAAKC,aAAeC,OAAOC,U,CAG7BC,0BACEJ,KAAKK,uBAAyBL,KAAKK,qB,CAGrCC,uBACEC,aAAaV,E,CAGfW,SACE,MAAMC,KACJA,EAAIC,UACJA,EAASC,uBACTA,EAAsBC,UACtBA,EAASC,oBACTA,EAAmBC,mBACnBA,EAAkBC,MAClBA,EAAKC,SACLA,EAAQC,eACRA,GACEC,KAAKC,MAAMnB,KAAKoB,gBAEpB,MAAMC,cAACA,EAAaC,uBAAEA,GAA0BR,EAAmBS,MAEnE,MAAMC,EAAmCT,EAAMU,YAE/C,MAAMC,EAAyBF,EAAiCG,OAEhE,IAAIC,EAA0B,GAE9B,GAAIF,EAAyB,IAAK,CAChC,GAAI1B,KAAKK,sBAAuB,CAC9B,MAAMwB,EAAoBL,EAAmC,MAE7DI,EAA0BC,C,KACrB,CACL,MAAMA,EAAoBL,EAAiCM,UAAU,EAAG,KAAO,MAE/EF,EAA0BC,C,EAI9B3B,OAAO6B,iBAAiB,UAAU,KAChCxB,aAAaV,GACbA,EAAQmC,YAAW,KACjBhC,KAAKC,aAAeC,OAAOC,UAAU,GACpC,IAAI,IAGT,MAAM8B,EAAwB,GAAGjB,EAASkB,0BAA0BzB,IACpE,OACE0B,EAACC,EAAI,KACHD,EAAA,WAASE,MAAM,mBACbF,EAAA,KAAGG,KAAMtC,KAAKuC,uBAAwBF,MAAM,gCAC1CF,EAAA,WAASK,KAAM,qBAAsBC,KAAM,KAC3CN,EAAA,YAAOnC,KAAK0C,0BAEdP,EAAA,WAASE,MAAM,4BACbF,EAAA,OAAKE,MAAM,uCACTF,EAAA,WACEA,EAAA,MAAIE,MAAM,yBAAyB5B,GAClCC,GAAayB,EAAA,KAAGE,MAAM,8BAA8B3B,GACpDC,GACCwB,EAAA,KAAGE,MAAM,2CAA2C1B,IAGvDC,EACCuB,EAAA,OAAKQ,IAAK/B,EAAWgC,IAAI,GAAGP,MAAM,2BAElCF,EAAA,OAAKE,MAAM,yBAAwB,cAAa,UAGnDxB,GACCsB,EAAA,OAAKE,MAAM,wCACRxB,EAAoBgC,OAASV,EAAA,UAAKtB,EAAoBgC,OACtDhC,EAAoBU,OACnBY,EAAA,6BACEZ,MAAOV,EAAoBU,MAC3BuB,IAAI,QACJC,aAAY,KACZC,iBAAgB,UAMxB3B,EAAcE,MAAMI,OAAS,GAAKsB,OAAOC,KAAK5B,EAAuBC,OAAOI,OAAS,IACrFQ,EAAA,WAASE,MAAM,4BACZvB,EAAmB+B,OAASV,EAAA,UAAKrB,EAAmB+B,OACpDxB,EAAcE,MAAMI,OAAS,GAC5BQ,EAAA,WAASE,MAAM,+CACbF,EAAA,UAAKd,EAAcwB,OACnBV,EAAA,MAAIE,MAAM,kCACRF,EAAA,UACGd,EAAcE,MAAM4B,KAAI,CAACC,EAAMC,IAE5BlB,EAAA,YACGkB,EAAQ,GAAKlB,EAAA,WAASK,KAAM,sBAAuBC,KAAM,KACzDY,IAAU,GACTlB,EAAA,YACEA,EAAA,KACEG,KACExB,EAAmBwC,mBAAmBxC,EAAmByC,MACzD,+BACAH,EAAKI,GAEPC,OAAQ,UAEPL,EAAK3C,KAAKK,EAAmByC,cAWjDN,OAAOC,KAAK5B,EAAuBC,OAAOI,OAAS,GAClDQ,EAAA,WAASE,MAAM,+CACbF,EAAA,UAAKb,EAAuBuB,OAC5BV,EAAA,MAAIE,MAAM,2CACPY,OAAOS,OAAOpC,EAAuBC,OAAO4B,KAAI,KAAKC,KACpDjB,EAAA,UACGiB,EAAKD,KAAI,CAACC,EAAMC,IAEblB,EAACwB,EAAQ,KACNN,EAAQ,GACPlB,EAAA,UACEA,EAAA,UACEA,EAAA,YACEA,EAAA,WAASK,KAAM,sBAAuBC,KAAM,KAC5CN,EAAA,YACEA,EAAA,KACEG,KACExB,EAAmBwC,mBAAmBxC,EAAmByC,MACzD,+BACAH,EAAKI,GAEPC,OAAQ,UAEPL,EAAK3C,KAAKK,EAAmByC,WAOzCF,GAAS,GACRlB,EAAA,YACEA,EAAA,KACEG,KACExB,EAAmBwC,mBAAmBxC,EAAmByC,MACzD,+BACAH,EAAKI,GAEPC,OAAQ,UAEPL,EAAK3C,KAAKK,EAAmByC,iBAcvDxC,GAASW,IAA2B,GACnCS,EAAA,WAASE,MAAM,4BACZtB,EAAMU,aACLU,EAACwB,EAAQ,KACPxB,EAAA,UAAKpB,EAAM8B,OACXV,EAAA,OACEE,MAAM,qCACNuB,WACG5D,KAAKK,uBAAyBqB,EAAyB,IACpDE,EACAb,EAAMU,eAKjBC,EAAyB,KACxBS,EAAA,UACEE,MAAM,4CACNwB,QAAS,IAAM7D,KAAKI,0BAAyB,gBAC9B,GAAGJ,KAAKK,sBAAwB,OAAS,WAEvDL,KAAKK,sBAAwBL,KAAK8D,kBAAoB9D,KAAK+D,qBAKjE/C,GAAYA,EAASO,MAAMI,OAAS,GAAOV,GAAkBA,EAAe+C,aAAarC,OAAS,IACnGQ,EAAA,WAASE,MAAM,4BACbF,EAAA,OAAKE,MAAM,4CACRrB,EAAS6B,OAASV,EAAA,UAAKnB,EAAS6B,OAChC7B,EAAS6B,OAAS5B,EAAe+C,aAAarC,OAAS,GACtDQ,EAAA,gCACgBF,EAAqB,WACzBA,EACVgC,IAAKhD,EAAe+C,aAAY,cACpB,OACZE,QAASC,EAAsBC,eAKpCpD,EAASO,OACRY,EAAA,6BACEZ,MAAOP,EAASO,MAChBuB,IAAI,QACJE,iBAAgB,wBAEhBqB,OAAM,OAITpD,EAAe+C,aAAarC,OAAS,GACpCQ,EAAA,OAAKE,MAAM,0BAA0BiC,KAAK,gBACxCnC,EAAA,YACAA,EAAA,YACAA,EAAA,YACAA,EAAA,aAIHlB,EAAe+C,aAAarC,OAAS,GAAK3B,KAAKC,aAAe,KAC7DkC,EAAA,OAAKE,MAAM,6CACTF,EAAA,0BAAwBoC,YAAY,sCACjCtD,EAAeuD,cACdrC,EAAA,yCACqB,eACnBsC,eAAgBxD,EAAeuD,aAAa3B,QAG/C5B,EAAeyD,UACdvC,EAAA,yCACqB,WACnBsC,eAAgBxD,EAAeyD,SAAS7B,QAG3C5B,EAAe0D,YACdxC,EAAA,yCACqB,aACnBsC,eAAgBxD,EAAe0D,WAAW9B,UAMnD5B,EAAe+C,aAAarC,OAAS,GAAK3B,KAAKC,cAAgB,KAC9DkC,EAAA,OAAKE,MAAM,6CACTF,EAAA,oBAAgB,iCACblB,EAAeuD,cACdrC,EAAA,8BACe,eAAc,YAChBlB,EAAeuD,aAAa3B,QAG1C5B,EAAeyD,UACdvC,EAAA,8BAA2B,WAAU,YAAalB,EAAeyD,SAAS7B,QAE3E5B,EAAe0D,YACdxC,EAAA,8BACe,aAAY,YACdlB,EAAe0D,WAAW9B,Y"}

package/dist/huds-lib/hy-process_2.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as o,g as i,H as t}from"./index-f84f2a7d.js";import{m as a}from"./utils-7438924c.js";import{j as s}from"./globalScript-5a4b7abf.js";const r=":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}.hy-process{display:block;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;max-width:30rem;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 30rem){.hy-process{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:left;-ms-flex-pack:left;justify-content:left;max-width:60rem;width:100%}}@media (min-width: 60rem){.hy-process{max-width:75rem}}.hy-process.small .box{display:block;margin:1%}@media (min-width: 30rem){.hy-process.small .box{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:48%;padding-bottom:10px;width:48%}}@media (min-width: 60rem){.hy-process.small .box{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:23%;width:23%}}.hy-process.big .box{display:block;margin:1%}@media (min-width: 30rem){.hy-process.big .box{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:48%;padding-bottom:10px;width:48%}}@media (min-width: 60rem){.hy-process.big .box{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;max-width:31%;width:31%}}.hy-process::after{clear:both}";const n=class{constructor(o){e(this,o);this.headerstyle="common";this.numberTerm=undefined;this.dataItems=undefined}async componentWillLoad(){this._dataItems=await s(this.dataItems)}componentDidLoad(){let e=this.el.closest(".hy-main");if(e){if(!e.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const e=[3,5,6,9];const i=e.includes(this._dataItems.length)?a.default:a.small;const t=i==a.small?4:3;const s=[i,"hy-process",`hy-process__${this.headerstyle}`].join(" ");const r="box";var n;return[o("div",{class:s},this._dataItems.map(((e,a)=>{a%t==0?n="first":n="default";return o("hy-process-flow-box",{class:r,variant:i,"box-number":a+1,"box-title":e.heading,"box-description":e.description,"intermediate-step-title":e.step,"step-state":n,"number-term":this.numberTerm})})))]}get el(){return i(this)}};n.style=r;const l=':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}.hy-process-flow-box{height:calc(100% - 32px);position:relative}.hy-process-flow-box__step__container{bottom:unset;display:grid;height:82px;place-items:center;position:absolute;top:-35px;width:138px;z-index:1}@media (min-width: 30rem){.hy-process-flow-box__step__container{bottom:-62px;display:grid;height:60px;top:unset;width:210px}}.hy-process-flow-box__step__container svg polygon{fill:var(--grayscale-background-arrow)}.hy-process-flow-box__step__container svg.mobile{display:block}@media (min-width: 30rem){.hy-process-flow-box__step__container svg.mobile{display:none}}.hy-process-flow-box__step__container svg.desktop{display:none}@media (min-width: 30rem){.hy-process-flow-box__step__container svg.desktop{display:block}}.hy-process-flow-box .first.even.hy-process-flow-box__step__container{left:calc(50% - 69px + 16px)}@media (min-width: 30rem){.hy-process-flow-box .first.even.hy-process-flow-box__step__container{left:-90px}}@media (min-width: 60rem){.hy-process-flow-box .first.even.hy-process-flow-box__step__container{left:0}}.hy-process-flow-box .first.odd.hy-process-flow-box__step__container{left:calc(50% - 69px + 16px)}@media (min-width: 30rem){.hy-process-flow-box .first.odd.hy-process-flow-box__step__container{left:0}}.hy-process-flow-box :not(.first).even.hy-process-flow-box__step__container{left:calc(50% - 69px + 16px)}@media (min-width: 30rem){.hy-process-flow-box :not(.first).even.hy-process-flow-box__step__container{left:-90px}}.hy-process-flow-box :not(.first).odd.hy-process-flow-box__step__container{left:calc(50% - 69px + 16px)}@media (min-width: 30rem){.hy-process-flow-box :not(.first).odd.hy-process-flow-box__step__container{left:0}}@media (min-width: 60rem){.hy-process-flow-box :not(.first).odd.hy-process-flow-box__step__container{left:-90px}}.hy-process-flow-box__step{background-color:transparent;color:var(--grayscale-black);font-family:var(--main-font-family);font-size:16px;font-weight:600;-ms-hyphens:auto;hyphens:auto;letter-spacing:0;line-height:22px;padding:19px 17px;position:absolute;text-align:center;word-break:break-word;z-index:11}@media (min-width: 30rem){.hy-process-flow-box__step{left:0;max-width:175px;padding:8px 23px 8px 14px}}.hy-process-flow-box__number__container{display:grid;height:64px;place-items:center;position:relative;width:64px;z-index:2}.hy-process-flow-box__number{background-color:var(--brand-main-light);color:var(--grayscale-white);display:grid;font-family:var(--main-font-family);font-size:36px;font-weight:600;height:48px;letter-spacing:0;line-height:49px;margin:0;padding:0;place-items:center;position:relative;width:48px}.hy-process-flow-box__number::after{content:"";height:48px;left:-6px;position:absolute;width:48px}.hy-process-flow-box__content.small{padding:16px 32px;padding-bottom:64px}@media (min-width: 60rem){.hy-process-flow-box__content.small{padding:20px;padding-bottom:64px}}.hy-process-flow-box__content.big{padding:24px 32px;padding-bottom:64px}.hy-process-flow-box__content{background-color:var(--grayscale-background-box);height:100%;margin-left:32px;margin-top:-32px;position:relative}.hy-process-flow-box__title{color:var(--brand-main-nearly-black);font-family:var(--main-font-family);font-size:26px;font-weight:600;letter-spacing:-0.82px;line-height:32px;-ms-hyphens:auto;hyphens:auto;margin-bottom:16px;margin-top:0;word-break:break-word}.hy-process-flow-box__description{color:var(--grayscale-dark);font-family:var(--main-font-family);font-size:16px;letter-spacing:0;line-height:24px}.small.hy-process-flow-box .small.hy-process-flow-box__number__container{height:56px;width:56px}.small.hy-process-flow-box .small.hy-process-flow-box__number__container .hy-process-flow-box__number{font-size:28px;height:40px;line-height:40px;width:40px}';const d=class{constructor(o){e(this,o);this.variant=a.default;this.boxNumber=undefined;this.boxTitle=undefined;this.boxDescription=undefined;this.intermediateStepTitle="";this.stepState="default";this.numberTerm=undefined}render(){const e=[this.variant,"hy-process-flow-box"].join(" ");const i=[this.variant,"hy-process-flow-box__content"].join(" ");const a=parseInt(this.boxNumber)%2==0?"even":"odd";const s=[this.variant,"hy-process-flow-box__number__container"].join(" ");const r=[this.variant,this.stepState,a,"hy-process-flow-box__step__container"].join(" ");return o(t,null,o("div",{class:e},this.intermediateStepTitle&&o("div",{class:r},o("svg",{class:"desktop",width:"210",height:"60"},o("polygon",{points:"0 0, 0 60, 190 60, 210 30, 190 0, 0 0"})),o("svg",{class:"mobile",width:"138",height:"82"},o("polygon",{points:"0 0, 69 15, 138 0, 138 50, 69 82, 0 50"})),o("h2",{class:"hy-process-flow-box__step"},this.intermediateStepTitle)),o("div",{class:s},o("h2",{class:"hy-process-flow-box__number","aria-label":`${this.numberTerm&&this.numberTerm} ${this.boxNumber}`},o("div",{class:"hy-process-flow-box__number-title"},this.boxNumber))),o("div",{class:i},o("h3",{class:"hy-process-flow-box__title",innerHTML:this.boxTitle}),o("div",{class:"hy-process-flow-box__description",innerHTML:this.boxDescription}))),o("hy-box",{mb:"1.75, 1.75, 2, 2.5"}))}};d.style=l;export{n as hy_process,d as hy_process_flow_box};
+//# sourceMappingURL=hy-process_2.entry.js.map

package/dist/huds-lib/hy-process_2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["processCss","Process","async","this","_dataItems","jsonParserWorker","dataItems","componentDidLoad","hyMainDiv","el","closest","classList","contains","headerstyle","render","bigVariants","processVariant","includes","length","ProcessFlowBoxVariants","default","small","itemsPerRow","classAttributes","join","classItem","stepState","h","class","map","x","index","variant","heading","description","step","numberTerm","processFlowBoxCss","ProcessFlowBox","classVariant","classContentVariant","classIsEven","parseInt","boxNumber","classNumberVariant","classStepVariant","Host","intermediateStepTitle","width","height","points","innerHTML","boxTitle","boxDescription","mb"],"sources":["./src/components/hy-process/process.scss?tag=hy-process&encapsulation=shadow","./src/components/hy-process/process.tsx","./src/components/hy-process-flow-box/process-flow-box.scss?tag=hy-process-flow-box&encapsulation=shadow","./src/components/hy-process-flow-box/process-flow-box.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-process {\n  display: block;\n  justify-content: center;\n  max-width: 30rem;\n  margin-right: auto;\n  margin-left: auto;\n  width: 100%;\n\n  @include breakpoint($narrow) {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: left;\n    max-width: 60rem;\n    width: 100%;\n  }\n  @include breakpoint($wide) {\n    max-width: 75rem;\n  }\n}\n\n.hy-process.small {\n  .box {\n    display: block;\n    margin: 1%;\n    @include breakpoint($narrow) {\n      flex-grow: 1;\n      max-width: 48%;\n      padding-bottom: 10px;\n      width: 48%;\n    }\n    @include breakpoint($wide) {\n      flex-grow: 1;\n      max-width: 23%;\n      width: 23%;\n    }\n  }\n}\n\n.hy-process.big {\n  .box {\n    display: block;\n    margin: 1%;\n    @include breakpoint($narrow) {\n      flex-grow: 1;\n      max-width: 48%;\n      padding-bottom: 10px;\n      width: 48%;\n    }\n    @include breakpoint($wide) {\n      flex-grow: 1;\n      max-width: 31%;\n      width: 31%;\n    }\n  }\n}\n\n.hy-process::after {\n  clear: both;\n}\n","export interface ProcessFlowBoxValue {\n  heading: string;\n  description: string;\n  step: string;\n}\n\nimport {Component, ComponentInterface, Prop, h, Element} from \"@stencil/core\";\nimport {ProcessFlowBoxVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n  tag: \"hy-process\",\n  styleUrl: \"process.scss\",\n  shadow: true,\n})\nexport class Process implements ComponentInterface {\n  @Element() el: HTMLElement;\n  @Prop() headerstyle: string = \"common\";\n  @Prop() numberTerm: string;\n  private _dataItems: ProcessFlowBoxValue[];\n  @Prop() dataItems: ProcessFlowBoxValue[] | string;\n\n  async componentWillLoad() {\n    this._dataItems = await jsonParserWorker(this.dataItems);\n  }\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    /*\n    - Logic:\n    - 3 items: big\n    - 4 items: small\n    - 5 items: big\n    - 6 items: big\n    - 7 items: small\n    - 8 items: small\n    - 9 items: big\n    * */\n    const bigVariants = [3, 5, 6, 9];\n    const processVariant = bigVariants.includes(this._dataItems.length)\n      ? ProcessFlowBoxVariants.default\n      : ProcessFlowBoxVariants.small;\n\n    const itemsPerRow = processVariant == ProcessFlowBoxVariants.small ? 4 : 3;\n    const classAttributes = [processVariant, \"hy-process\", `hy-process__${this.headerstyle}`].join(\" \");\n    const classItem = \"box\";\n    var stepState;\n\n    return [\n      <div class={classAttributes}>\n        {this._dataItems.map((x, index) => {\n          index % itemsPerRow == 0 ? (stepState = \"first\") : (stepState = \"default\");\n          return (\n            <hy-process-flow-box\n              class={classItem}\n              variant={processVariant}\n              box-number={index + 1}\n              box-title={x.heading}\n              box-description={x.description}\n              intermediate-step-title={x.step}\n              step-state={stepState}\n              number-term={this.numberTerm}\n            />\n          );\n        })}\n      </div>,\n    ];\n  }\n}\n",":host {\n  display: block;\n}\n\n.hy-process-flow-box {\n  height: calc(100% - 32px);\n  position: relative;\n\n  &__step__container {\n    bottom: unset;\n    display: grid;\n    height: 82px;\n    place-items: center;\n    position: absolute;\n    top: -35px;\n    width: 138px;\n    z-index: 1;\n\n    @include breakpoint($narrow) {\n      bottom: -62px;\n      display: grid;\n      height: 60px;\n      top: unset;\n      width: 210px;\n    }\n\n    svg polygon {\n      fill: var(--grayscale-background-arrow);\n    }\n\n    svg.mobile {\n      display: block;\n\n      @include breakpoint($narrow) {\n        display: none;\n      }\n    }\n\n    svg.desktop {\n      display: none;\n\n      @include breakpoint($narrow) {\n        display: block;\n      }\n    }\n  }\n\n  .first.even.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: -90px;\n    }\n\n    @include breakpoint($wide) {\n      left: 0;\n    }\n  }\n\n  .first.odd.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: 0;\n    }\n  }\n\n  :not(.first).even.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: -90px;\n    }\n  }\n\n  :not(.first).odd.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: 0;\n    }\n\n    @include breakpoint($wide) {\n      left: -90px;\n    }\n  }\n\n  &__step {\n    background-color: transparent;\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    font-size: 16px;\n    font-weight: 600;\n    hyphens: auto;\n    letter-spacing: 0;\n    line-height: 22px;\n    padding: 19px 17px;\n    position: absolute;\n    text-align: center;\n    word-break: break-word;\n    z-index: 11;\n\n    @include breakpoint($narrow) {\n      left: 0;\n      max-width: 175px;\n      padding: 8px 23px 8px 14px;\n    }\n  }\n\n  &__number__container {\n    display: grid;\n    height: 64px;\n    place-items: center;\n    position: relative;\n    width: 64px;\n    z-index: 2;\n  }\n\n  &__number {\n    background-color: var(--brand-main-light);\n    color: var(--grayscale-white);\n    display: grid;\n    font-family: var(--main-font-family);\n    font-size: 36px;\n    font-weight: 600;\n    height: 48px;\n    letter-spacing: 0;\n    line-height: 49px;\n    margin: 0;\n    padding: 0;\n    place-items: center;\n    position: relative;\n    width: 48px;\n\n    &::after {\n      content: \"\";\n      height: 48px;\n      left: -6px;\n      position: absolute;\n      width: 48px;\n    }\n  }\n\n  &__content.small {\n    padding: 16px 32px;\n    padding-bottom: 64px;\n\n    @include breakpoint($wide) {\n      padding: 20px;\n      padding-bottom: 64px;\n    }\n  }\n\n  &__content.big {\n    padding: 24px 32px;\n    padding-bottom: 64px;\n  }\n\n  &__content {\n    background-color: var(--grayscale-background-box);\n    height: 100%;\n    margin-left: 32px;\n    margin-top: -32px;\n    position: relative;\n  }\n\n  &__title {\n    color: var(--brand-main-nearly-black);\n    font-family: var(--main-font-family);\n    font-size: 26px;\n    font-weight: 600;\n    letter-spacing: -0.82px;\n    line-height: 32px;\n    hyphens: auto;\n    margin-bottom: 16px;\n    margin-top: 0;\n    word-break: break-word;\n  }\n\n  &__description {\n    color: var(--grayscale-dark);\n    font-family: var(--main-font-family);\n    font-size: 16px;\n    letter-spacing: 0;\n    line-height: 24px;\n  }\n}\n\n.small.hy-process-flow-box {\n  .small.hy-process-flow-box__number__container {\n    height: 56px;\n    width: 56px;\n\n    .hy-process-flow-box__number {\n      font-size: 28px;\n      height: 40px;\n      line-height: 40px;\n      width: 40px;\n    }\n  }\n}\n","import {Component, ComponentInterface, Prop, h, Host} from \"@stencil/core\";\nimport {ProcessFlowBoxVariants} from \"../../utils/utils\";\nimport {ProcessFlowBoxStepStates} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-process-flow-box\",\n  styleUrl: \"process-flow-box.scss\",\n  shadow: true,\n})\nexport class ProcessFlowBox implements ComponentInterface {\n  @Prop() variant: ProcessFlowBoxVariants = ProcessFlowBoxVariants.default;\n  @Prop() boxNumber: string;\n  @Prop() boxTitle: string;\n  @Prop() boxDescription: string;\n  @Prop() intermediateStepTitle: string = \"\";\n  @Prop() stepState: ProcessFlowBoxStepStates = \"default\";\n  @Prop() numberTerm: string;\n  render() {\n    const classVariant = [this.variant, \"hy-process-flow-box\"].join(\" \");\n    const classContentVariant = [this.variant, \"hy-process-flow-box__content\"].join(\" \");\n\n    const classIsEven = parseInt(this.boxNumber) % 2 == 0 ? \"even\" : \"odd\";\n\n    const classNumberVariant = [this.variant, \"hy-process-flow-box__number__container\"].join(\" \");\n    const classStepVariant = [this.variant, this.stepState, classIsEven, \"hy-process-flow-box__step__container\"].join(\n      \" \"\n    );\n\n    return (\n      <Host>\n        <div class={classVariant}>\n          {this.intermediateStepTitle && (\n            <div class={classStepVariant}>\n              <svg class=\"desktop\" width=\"210\" height=\"60\">\n                <polygon points=\"0 0, 0 60, 190 60, 210 30, 190 0, 0 0\" />\n              </svg>\n              <svg class=\"mobile\" width=\"138\" height=\"82\">\n                <polygon points=\"0 0, 69 15, 138 0, 138 50, 69 82, 0 50\" />\n              </svg>\n              <h2 class=\"hy-process-flow-box__step\">{this.intermediateStepTitle}</h2>\n            </div>\n          )}\n          <div class={classNumberVariant}>\n            <h2\n              class=\"hy-process-flow-box__number\"\n              aria-label={`${this.numberTerm && this.numberTerm} ${this.boxNumber}`}\n            >\n              <div class=\"hy-process-flow-box__number-title\">{this.boxNumber}</div>\n            </h2>\n          </div>\n          <div class={classContentVariant}>\n            <h3 class=\"hy-process-flow-box__title\" innerHTML={this.boxTitle}></h3>\n            <div class=\"hy-process-flow-box__description\" innerHTML={this.boxDescription}></div>\n          </div>\n        </div>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"oJAAA,MAAMA,EAAa,kvE,MCeNC,EAAO,M,0CAEY,S,mDAK9BC,0BACEC,KAAKC,iBAAmBC,EAAiBF,KAAKG,U,CAGhDC,mBACE,IAAIC,EAAYL,KAAKM,GAAGC,QAAQ,YAChC,GAAIF,EAAW,CACb,IAAKA,EAAUG,UAAUC,SAAS,gBAAiB,CACjDT,KAAKU,YAAc,O,GAKzBC,SAWE,MAAMC,EAAc,CAAC,EAAG,EAAG,EAAG,GAC9B,MAAMC,EAAiBD,EAAYE,SAASd,KAAKC,WAAWc,QACxDC,EAAuBC,QACvBD,EAAuBE,MAE3B,MAAMC,EAAcN,GAAkBG,EAAuBE,MAAQ,EAAI,EACzE,MAAME,EAAkB,CAACP,EAAgB,aAAc,eAAeb,KAAKU,eAAeW,KAAK,KAC/F,MAAMC,EAAY,MAClB,IAAIC,EAEJ,MAAO,CACLC,EAAA,OAAKC,MAAOL,GACTpB,KAAKC,WAAWyB,KAAI,CAACC,EAAGC,KACvBA,EAAQT,GAAe,EAAKI,EAAY,QAAYA,EAAY,UAChE,OACEC,EAAA,uBACEC,MAAOH,EACPO,QAAShB,EAAc,aACXe,EAAQ,EAAC,YACVD,EAAEG,QAAO,kBACHH,EAAEI,YAAW,0BACLJ,EAAEK,KAAI,aACnBT,EAAS,cACRvB,KAAKiC,YAClB,K,qCCtEd,MAAMC,EAAoB,w1J,MCSbC,EAAc,M,sCACiBnB,EAAuBC,Q,0GAIzB,G,eACM,U,0BAE9CN,SACE,MAAMyB,EAAe,CAACpC,KAAK6B,QAAS,uBAAuBR,KAAK,KAChE,MAAMgB,EAAsB,CAACrC,KAAK6B,QAAS,gCAAgCR,KAAK,KAEhF,MAAMiB,EAAcC,SAASvC,KAAKwC,WAAa,GAAK,EAAI,OAAS,MAEjE,MAAMC,EAAqB,CAACzC,KAAK6B,QAAS,0CAA0CR,KAAK,KACzF,MAAMqB,EAAmB,CAAC1C,KAAK6B,QAAS7B,KAAKuB,UAAWe,EAAa,wCAAwCjB,KAC3G,KAGF,OACEG,EAACmB,EAAI,KACHnB,EAAA,OAAKC,MAAOW,GACTpC,KAAK4C,uBACJpB,EAAA,OAAKC,MAAOiB,GACVlB,EAAA,OAAKC,MAAM,UAAUoB,MAAM,MAAMC,OAAO,MACtCtB,EAAA,WAASuB,OAAO,2CAElBvB,EAAA,OAAKC,MAAM,SAASoB,MAAM,MAAMC,OAAO,MACrCtB,EAAA,WAASuB,OAAO,4CAElBvB,EAAA,MAAIC,MAAM,6BAA6BzB,KAAK4C,wBAGhDpB,EAAA,OAAKC,MAAOgB,GACVjB,EAAA,MACEC,MAAM,8BAA6B,aACvB,GAAGzB,KAAKiC,YAAcjC,KAAKiC,cAAcjC,KAAKwC,aAE1DhB,EAAA,OAAKC,MAAM,qCAAqCzB,KAAKwC,aAGzDhB,EAAA,OAAKC,MAAOY,GACVb,EAAA,MAAIC,MAAM,6BAA6BuB,UAAWhD,KAAKiD,WACvDzB,EAAA,OAAKC,MAAM,mCAAmCuB,UAAWhD,KAAKkD,mBAGlE1B,EAAA,UAAQ2B,GAAG,uB"}

package/dist/huds-lib/hy-prominent-image.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i,H as t,g as a}from"./index-f84f2a7d.js";const r=":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}.hy-prominent-image{position:relative}.hy-prominent-image__text{font-size:1rem;line-height:20px;background-color:var(--grayscale-black);bottom:12px;color:var(--grayscale-white);font-family:var(--main-font-family);font-weight:bold;left:-8px;letter-spacing:-0.5px;max-width:46%;padding:6px 12px;position:absolute;text-transform:uppercase}@media (min-width: 30rem){.hy-prominent-image__text{font-size:1.125rem;line-height:24px;bottom:20px;left:-16px;letter-spacing:-0.56px;max-width:58%;padding:12px 24px;position:absolute}}@media (min-width: 60rem){.hy-prominent-image__text{font-size:1.375rem;line-height:28px;bottom:24px;left:-16px;letter-spacing:-0.69px;padding:16px 24px;position:absolute}}@media (min-width: 1601px){.hy-prominent-image__text{font-size:1.625rem;line-height:32px;bottom:28px;left:-16px;letter-spacing:-0.8px;padding:20px 24px;position:absolute}}@media (min-width: 75.0625rem){.hy-prominent-image__text__large{font-size:1.625rem;line-height:32px;bottom:28px;left:-16px;letter-spacing:-0.8px;padding:20px 24px;position:absolute}}";const n=class{constructor(i){e(this,i);this.textTitle=undefined;this.imageUrl=undefined;this.imageAlt="";this.headerstyle="common";this.sourceSet=undefined}componentDidLoad(){let e=this.el.closest(".hy-main");if(e){if(!e.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const e=["hy-prominent-image",this.headerstyle,`hy-prominent-image__${this.headerstyle}`].join(" ");const a=["hy-prominent-image__text",`hy-prominent-image__text__${this.headerstyle}`].join(" ");return i(t,null,i("div",{class:e},i("div",{class:"hy-prominent-image__image"},i("hy-image",{"source-set":this.sourceSet,"image-url":this.imageUrl,"image-alt":this.imageAlt,aspectRatioWidth:2,aspectRatioHeight:1})),this.textTitle&&i("div",{class:a},this.textTitle)))}get el(){return a(this)}};n.style=r;export{n as hy_prominent_image};
+//# sourceMappingURL=hy-prominent-image.entry.js.map

package/dist/huds-lib/hy-prominent-image.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyProminentImageCss","HyProminentImage","componentDidLoad","hyMainDiv","this","el","closest","classList","contains","headerstyle","render","prominentImageClass","join","prominentImageText","h","Host","class","sourceSet","imageUrl","imageAlt","aspectRatioWidth","aspectRatioHeight","textTitle"],"sources":["./src/components/hy-prominent-image/hy-prominent-image.scss?tag=hy-prominent-image&encapsulation=shadow","./src/components/hy-prominent-image/hy-prominent-image.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-prominent-image {\n  position: relative;\n\n  &__text {\n    // font: h5 small size\n    @include font-size(16px, 20px);\n    background-color: var(--grayscale-black);\n    bottom: 12px;\n    color: var(--grayscale-white);\n    font-family: var(--main-font-family);\n    font-weight: bold;\n    left: -8px;\n    letter-spacing: -0.5px;\n    max-width: 46%; // 5.5 columns\n    padding: 6px 12px;\n    position: absolute;\n    text-transform: uppercase;\n\n    @include breakpoint($narrow) {\n      // font: h4 small size\n      @include font-size(18px, 24px);\n      bottom: 20px;\n      left: -16px;\n      letter-spacing: -0.56px;\n      max-width: 58%; // 7 columns\n      padding: 12px 24px;\n      position: absolute;\n    }\n\n    @include breakpoint($wide) {\n      // font: h4 medium size\n      @include font-size(22px, 28px);\n      bottom: 24px;\n      left: -16px;\n      letter-spacing: -0.69px;\n      padding: 16px 24px;\n      position: absolute;\n    }\n    @include breakpoint($xlarge) {\n      // font: h3 medium size\n      @include font-size(26px, 32px);\n      bottom: 28px;\n      left: -16px;\n      letter-spacing: -0.8px;\n      padding: 20px 24px;\n      position: absolute;\n    }\n\n    &__large {\n      @include breakpoint($extrawide) {\n        // font: h3 medium size\n        @include font-size(26px, 32px);\n        bottom: 28px;\n        left: -16px;\n        letter-spacing: -0.8px;\n        padding: 20px 24px;\n        position: absolute;\n      }\n    }\n  }\n}\n","export interface ImageSrcSet {\n  src: any;\n  media: string;\n  type: string;\n  sizes: string | null;\n}\n\nimport {Component, Element, Host, h, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-prominent-image\",\n  styleUrl: \"hy-prominent-image.scss\",\n  shadow: true,\n})\nexport class HyProminentImage {\n  @Prop() textTitle?: string;\n  @Prop() imageUrl?: string;\n  @Prop() imageAlt: string = \"\";\n  @Prop() headerstyle: string = \"common\";\n  @Prop() sourceSet: ImageSrcSet[] | string;\n  @Element() el: HTMLElement;\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const prominentImageClass = [\n      \"hy-prominent-image\",\n      this.headerstyle,\n      `hy-prominent-image__${this.headerstyle}`,\n    ].join(\" \");\n\n    const prominentImageText = [\"hy-prominent-image__text\", `hy-prominent-image__text__${this.headerstyle}`].join(\" \");\n\n    return (\n      <Host>\n        <div class={prominentImageClass}>\n          <div class=\"hy-prominent-image__image\">\n            <hy-image\n              source-set={this.sourceSet}\n              image-url={this.imageUrl}\n              image-alt={this.imageAlt}\n              aspectRatioWidth={2}\n              aspectRatioHeight={1}\n            />\n          </div>\n          {this.textTitle && <div class={prominentImageText}>{this.textTitle}</div>}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6DAAA,MAAMA,EAAsB,2sE,MCcfC,EAAgB,M,wFAGA,G,iBACG,S,yBAI9BC,mBACE,IAAIC,EAAYC,KAAKC,GAAGC,QAAQ,YAChC,GAAIH,EAAW,CACb,IAAKA,EAAUI,UAAUC,SAAS,gBAAiB,CACjDJ,KAAKK,YAAc,O,GAKzBC,SACE,MAAMC,EAAsB,CAC1B,qBACAP,KAAKK,YACL,uBAAuBL,KAAKK,eAC5BG,KAAK,KAEP,MAAMC,EAAqB,CAAC,2BAA4B,6BAA6BT,KAAKK,eAAeG,KAAK,KAE9G,OACEE,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAOL,GACVG,EAAA,OAAKE,MAAM,6BACTF,EAAA,yBACcV,KAAKa,UAAS,YACfb,KAAKc,SAAQ,YACbd,KAAKe,SAChBC,iBAAkB,EAClBC,kBAAmB,KAGtBjB,KAAKkB,WAAaR,EAAA,OAAKE,MAAOH,GAAqBT,KAAKkB,Y"}

package/dist/huds-lib/hy-quote.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as e,g as t}from"./index-f84f2a7d.js";const a=':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}.hy-quote{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;padding:0 8px}@media (min-width: 30rem){.hy-quote{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:0}}@media (min-width: 60rem){.hy-quote{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-quote__icon-wrapper{margin-right:20px}@media (min-width: 30rem){.hy-quote__icon-wrapper{margin-right:0}}@media (min-width: 60rem){.hy-quote__icon-wrapper{margin-right:24px}}@media (min-width: 1601px){.hy-quote__icon-wrapper{margin-right:32px}}.hy-quote__icon svg{fill:var(--brand-main-light);height:32px;width:32px}@media (min-width: 60rem){.hy-quote__icon svg{height:40px;width:40px}}@media (min-width: 1601px){.hy-quote__icon svg{height:48px;width:48px}}.hy-quote__text{font-size:1rem;line-height:24px;color:var(--grayscale-black);font-family:var(--main-font-family);font-weight:600;letter-spacing:-0.1px;padding-bottom:16px;padding-top:0}@media (min-width: 30rem){.hy-quote__text{font-size:1.125rem;line-height:28px;padding-top:16px}}@media (min-width: 75.0625rem){.hy-quote__text{font-size:1.25rem;line-height:32px;padding-top:0}}.hy-quote__signature:before{font-size:0.875rem;line-height:20px;display:inline-block;color:var(--grayscale-dark);content:"-";font-family:var(--main-font-family);letter-spacing:0;padding-right:3px}.hy-quote__signature{font-size:0.875rem;line-height:20px;color:var(--grayscale-dark);font-family:var(--main-font-family);letter-spacing:0}@media (min-width: 30rem){.hy-quote__signature{font-size:1rem;line-height:24px}}';const r=class{constructor(e){i(this,e);this.quoteSignature=undefined;this.headerstyle="common"}componentDidLoad(){let i=this.el.closest(".hy-main");if(i){if(!i.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const i=["hy-quote",this.headerstyle,`hy-quote__${this.headerstyle}`].join(" ");return e("div",{class:i},e("span",{class:"hy-quote__icon-wrapper"},e("div",{class:"hy-quote__icon"},e("hy-icon",{icon:"hy-icon-quote",size:48}))),e("div",{class:"hy-quote-text-wrapper"},e("div",{class:"hy-quote__text"},e("slot",null)),this.quoteSignature&&e("div",{class:"hy-quote__signature"},this.quoteSignature)))}get el(){return t(this)}};r.style=a;export{r as hy_quote};
+//# sourceMappingURL=hy-quote.entry.js.map

package/dist/huds-lib/hy-quote.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyQuoteCss","HyQuote","componentDidLoad","hyMainDiv","this","el","closest","classList","contains","headerstyle","render","quoteClass","join","h","class","icon","size","quoteSignature"],"sources":["./src/components/hy-quote/hy-quote.scss?tag=hy-quote&encapsulation=shadow","./src/components/hy-quote/hy-quote.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-quote {\n  display: flex;\n  flex-direction: row;\n  padding: 0 8px;\n\n  @include breakpoint($narrow) {\n    flex-direction: column;\n    padding: 0;\n  }\n\n  @include breakpoint($wide) {\n    flex-direction: row;\n  }\n\n  &__icon-wrapper {\n    margin-right: 20px;\n\n    @include breakpoint($narrow) {\n      margin-right: 0;\n    }\n\n    @include breakpoint($wide) {\n      margin-right: 24px;\n    }\n\n    @include breakpoint($xlarge) {\n      margin-right: 32px;\n    }\n  }\n\n  &__icon {\n    svg {\n      fill: var(--brand-main-light);\n      height: 32px;\n      width: 32px;\n\n      @include breakpoint($wide) {\n        height: 40px;\n        width: 40px;\n      }\n      @include breakpoint($xlarge) {\n        height: 48px;\n        width: 48px;\n      }\n    }\n  }\n\n  &__text {\n    @include font-size(16px, 24px);\n\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    font-weight: 600;\n    letter-spacing: -0.1px;\n    padding-bottom: 16px;\n    padding-top: 0;\n\n    @include breakpoint($narrow) {\n      @include font-size(18px, 28px);\n      padding-top: 16px;\n    }\n\n    @include breakpoint($extrawide) {\n      @include font-size(20px, 32px);\n      padding-top: 0;\n    }\n  }\n\n  &__signature:before {\n    @include font-size(14px, 20px);\n    display: inline-block;\n    color: var(--grayscale-dark);\n    content: \"-\";\n    font-family: var(--main-font-family);\n    letter-spacing: 0;\n    padding-right: 3px;\n  }\n\n  &__signature {\n    @include font-size(14px, 20px);\n    color: var(--grayscale-dark);\n    font-family: var(--main-font-family);\n    letter-spacing: 0;\n\n    @include breakpoint($narrow) {\n      @include font-size(16px, 24px);\n    }\n  }\n}\n","import {Component, Element, h, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-quote\",\n  styleUrl: \"hy-quote.scss\",\n  shadow: true,\n})\nexport class HyQuote {\n  @Prop() quoteSignature?: string;\n  @Prop() headerstyle: string = \"common\";\n  @Element() el: HTMLElement;\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const quoteClass = [\"hy-quote\", this.headerstyle, `hy-quote__${this.headerstyle}`].join(\" \");\n    return (\n      <div class={quoteClass}>\n        <span class=\"hy-quote__icon-wrapper\">\n          <div class=\"hy-quote__icon\">\n            <hy-icon icon={\"hy-icon-quote\"} size={48} />\n          </div>\n        </span>\n        <div class=\"hy-quote-text-wrapper\">\n          <div class=\"hy-quote__text\">\n            <slot></slot>\n          </div>\n          {this.quoteSignature && <div class=\"hy-quote__signature\">{this.quoteSignature}</div>}\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"sDAAA,MAAMA,EAAa,82F,MCONC,EAAO,M,wEAEY,Q,CAG9BC,mBACE,IAAIC,EAAYC,KAAKC,GAAGC,QAAQ,YAChC,GAAIH,EAAW,CACb,IAAKA,EAAUI,UAAUC,SAAS,gBAAiB,CACjDJ,KAAKK,YAAc,O,GAKzBC,SACE,MAAMC,EAAa,CAAC,WAAYP,KAAKK,YAAa,aAAaL,KAAKK,eAAeG,KAAK,KACxF,OACEC,EAAA,OAAKC,MAAOH,GACVE,EAAA,QAAMC,MAAM,0BACVD,EAAA,OAAKC,MAAM,kBACTD,EAAA,WAASE,KAAM,gBAAiBC,KAAM,OAG1CH,EAAA,OAAKC,MAAM,yBACTD,EAAA,OAAKC,MAAM,kBACTD,EAAA,cAEDT,KAAKa,gBAAkBJ,EAAA,OAAKC,MAAM,uBAAuBV,KAAKa,iB"}

package/dist/huds-lib/hy-row.entry.js

@@ -0,0 +1,9 @@
+import{r as s,h as t}from"./index-f84f2a7d.js";import{c as i}from"./emotion.esm-e0a633a4.js";const r="div.hy-row{display:block}";const o=(s,t,r)=>i`
+    display: flex;
+    justify-content: ${s};
+    align-items: ${t};
+    > * + * {
+      margin-left: ${r}rem;
+    }
+  `;const e=class{constructor(t){s(this,t);this.justify="stretch";this.align="center";this.margin=1}render(){return t("div",{class:o(this.justify,this.align,this.margin)},t("slot",null))}};e.style=r;export{e as hy_row};
+//# sourceMappingURL=hy-row.entry.js.map

package/dist/huds-lib/hy-row.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["rowCss","createCss","justify","align","margin","css","Row","render","h","class","this"],"sources":["./src/components/hy-row/row.css?tag=hy-row","./src/components/hy-row/row.tsx"],"sourcesContent":["div.hy-row {\n  display: block;\n}\n","import {Component, h, Prop} from \"@stencil/core\";\nimport {css} from \"emotion\";\n\nconst createCss = (justify: string, align: string, margin: number) => {\n  return css`\n    display: flex;\n    justify-content: ${justify};\n    align-items: ${align};\n    > * + * {\n      margin-left: ${margin}rem;\n    }\n  `;\n};\n\n@Component({\n  tag: \"hy-row\",\n  styleUrl: \"row.css\",\n  shadow: false,\n})\nexport class Row {\n  /**\n   * justify-content property.\n   */\n  @Prop() justify: string = \"stretch\";\n  /**\n   * justify-content property.\n   */\n  @Prop() align: string = \"center\";\n  /**\n   * Left margin to be added to adjacent items.\n   */\n  @Prop() margin: number = 1;\n  render() {\n    return (\n      <div class={createCss(this.justify, this.align, this.margin)}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAS,4BCGf,MAAMC,EAAY,CAACC,EAAiBC,EAAeC,IAC1CC,CAAG;;uBAEWH;mBACJC;;qBAEEC;;UAURE,EAAG,M,sCAIY,U,WAIF,S,YAIC,C,CACzBC,SACE,OACEC,EAAA,OAAKC,MAAOR,EAAUS,KAAKR,QAASQ,KAAKP,MAAOO,KAAKN,SACnDI,EAAA,a"}

package/dist/huds-lib/hy-section-container.entry.js

@@ -0,0 +1,2 @@
+import{r as a,h as e}from"./index-f84f2a7d.js";const r=":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}.hy-section--container{display:block;width:100%;margin-left:auto;margin-right:auto}@media only screen and (min-width: 30rem){.hy-section--container{width:100%}}@media only screen and (min-width: 60rem){.hy-section--container{width:100%;max-width:60rem}}@media only screen and (min-width: 75.0625rem){.hy-section--container{width:100%;max-width:75rem}}";const i=class{constructor(e){a(this,e)}render(){return e("div",{class:"hy-section--container"},e("slot",null))}};i.style=r;export{i as hy_section_container};
+//# sourceMappingURL=hy-section-container.entry.js.map

package/dist/huds-lib/hy-section-container.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sectionContainerCss","SectionContainer","render","h","class"],"sources":["./src/components/hy-section-container/section-container.scss?tag=hy-section-container","./src/components/hy-section-container/section-container.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-section--container {\n  display: block;\n  width: 100%;\n  margin-left: auto;\n  margin-right: auto;\n\n  @media only screen and (min-width: $narrow) {\n    width: 100%;\n  }\n\n  @media only screen and (min-width: $wide) {\n    width: 100%;\n    max-width: 60rem;\n  }\n\n  @media only screen and (min-width: $extrawide) {\n    width: 100%;\n    max-width: 75rem;\n  }\n}\n","import {Component, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-section-container\",\n  styleUrl: \"section-container.scss\",\n  shadow: false,\n})\nexport class SectionContainer {\n  render() {\n    return (\n      <div class=\"hy-section--container\">\n        <slot />\n      </div>\n    );\n  }\n}\n"],"mappings":"+CAAA,MAAMA,EAAsB,qhD,MCOfC,EAAgB,M,yBAC3BC,SACE,OACEC,EAAA,OAAKC,MAAM,yBACTD,EAAA,a"}

package/dist/huds-lib/hy-shortcuts.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as r,H as i,g as a}from"./index-f84f2a7d.js";import{f as n}from"./utils-7438924c.js";const e=":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}.hy-shortcuts{overflow:hidden}.hy-shortcuts .shortcut-link-container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:0 calc(var(--gutter-mobile)* -1)}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container{margin:0 calc(var(--gutter-narrow)* -1)}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container{margin:0 calc(var(--gutter-wide)* -1)}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper{min-height:62px;padding:0 var(--gutter-mobile)}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper{min-height:70px;padding:0 var(--gutter-narrow)}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper{min-height:82px;padding:0 var(--gutter-wide)}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3{width:100%}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3{width:33.33%}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4{width:50%}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4{width:25%}}.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3.first a.shortcut-link,.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4.first a.shortcut-link{border-top:2.5px solid var(--brand-main-nearly-black)}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-3.first a.shortcut-link,.hy-shortcuts .shortcut-link-container .shortcut-link-wrapper.box-4.first a.shortcut-link{border-top:3px solid var(--brand-main-nearly-black)}}.hy-shortcuts .shortcut-link-container a.shortcut-link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:transparent;border-bottom:2.5px solid var(--brand-main-nearly-black);color:var(--brand-main-nearly-black);cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);font-size:14px;font-weight:600;-ms-hyphens:auto;hyphens:auto;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;height:100%;letter-spacing:-0.44px;line-height:18px;min-height:70px;position:relative;text-decoration:none;word-break:break-word}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container a.shortcut-link{border-bottom:3px solid var(--brand-main-nearly-black);border-top:3px solid var(--brand-main-nearly-black);font-size:16px;letter-spacing:-0.5px;line-height:18px;min-height:70px}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container a.shortcut-link{font-size:16px;letter-spacing:-0.5px;line-height:22px;min-height:82px}}.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon{padding:0 0 0 8px}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon{padding:0 0 0 12px}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon{padding:0 4px 0 22px}}.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon svg{height:20px;fill:var(--brand-main-light);width:20px}@media (min-width: 30rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon svg{height:24px;width:24px}}@media (min-width: 60rem){.hy-shortcuts .shortcut-link-container a.shortcut-link .link-icon svg{height:28px;width:28px}}.hy-shortcuts .shortcut-link-container a.shortcut-link:hover{color:var(--brand-main)}.hy-shortcuts .shortcut-link-container a.shortcut-link:hover svg{fill:var(--brand-main)}";const o=class{constructor(r){t(this,r);this.dataItems=undefined;this.listHeading="";this.headerstyle="default"}arrayDataWatcher(t){if(typeof t==="string"){this._dataItems=JSON.parse(t)}else{this._dataItems=t}}componentWillLoad(){this.arrayDataWatcher(this.dataItems)}componentDidLoad(){let t=this.el.closest(".hy-main");if(t){if(!t.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const t=["hy-shortcuts",`hy-shortcuts__${this.headerstyle}`].join(" ");const a=["text"].join(" ");const e=["link-icon"].join(" ");let o=["shortcut-link-wrapper",this._dataItems.length%4==0?"box-4":"box-3"].join(" ");return r(i,null,r("div",{class:t},this.listHeading.length>0&&r("hy-heading",{class:"list-title",heading:n.h2},this.listHeading),r("div",{class:"shortcut-link-container"},this._dataItems.map(((t,i)=>{let n="";if(this._dataItems.length%4==0){n=i==0||i==1?"first":""}else{n=i==0?"first":""}let s=o.concat(" ",n);let h=t.isExternal?"_blank":"_self";return r("div",{class:s},r("a",{"aria-label":t.ariaLabel,class:"shortcut-link",href:t.url,target:h},r("span",{class:a},t.heading),r("span",{class:e},r("hy-icon",{icon:"hy-icon-arrow-right",size:28}))))})))),r("hy-box",{mb:"1.75, 1.75, 2, 2.5"}))}get el(){return a(this)}static get watchers(){return{dataItems:["arrayDataWatcher"]}}};o.style=e;export{o as hy_shortcuts};
+//# sourceMappingURL=hy-shortcuts.entry.js.map

package/dist/huds-lib/hy-shortcuts.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyShortcutsCss","HyShortcuts","arrayDataWatcher","newValue","this","_dataItems","JSON","parse","componentWillLoad","dataItems","componentDidLoad","hyMainDiv","el","closest","classList","contains","headerstyle","render","classAttributes","join","textClassAttributes","iconClassAttributes","classItem","length","h","Host","class","listHeading","heading","HeadingVarians","h2","map","x","index","isFirstLine","classLinkWrapper","concat","target","isExternal","ariaLabel","href","url","icon","size","mb"],"sources":["./src/components/hy-shortcuts/hy-shortcuts.scss?tag=hy-shortcuts","./src/components/hy-shortcuts/hy-shortcuts.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-shortcuts {\n  overflow: hidden;\n\n  .shortcut-link-container {\n    display: flex;\n    flex-wrap: wrap;\n    margin: 0 calc(#{var(--gutter-mobile)}* -1);\n\n    @include breakpoint($narrow) {\n      margin: 0 calc(#{var(--gutter-narrow)}* -1);\n    }\n    @include breakpoint($wide) {\n      margin: 0 calc(#{var(--gutter-wide)}* -1);\n    }\n\n    .shortcut-link-wrapper {\n      min-height: 62px;\n      padding: 0 var(--gutter-mobile);\n\n      @include breakpoint($narrow) {\n        min-height: 70px;\n        padding: 0 var(--gutter-narrow);\n      }\n      @include breakpoint($wide) {\n        min-height: 82px;\n        padding: 0 var(--gutter-wide);\n      }\n    }\n\n    .shortcut-link-wrapper.box-3 {\n      width: 100%;\n\n      @include breakpoint($narrow) {\n        width: 33.33%;\n      }\n    }\n\n    .shortcut-link-wrapper.box-4 {\n      width: 50%;\n\n      @include breakpoint($narrow) {\n        width: 25%;\n      }\n    }\n\n    .shortcut-link-wrapper.box-3.first a.shortcut-link,\n    .shortcut-link-wrapper.box-4.first a.shortcut-link {\n      // mobile\n      border-top: 2.5px solid var(--brand-main-nearly-black);\n\n      @include breakpoint($narrow) {\n        // tablet\n        border-top: 3px solid var(--brand-main-nearly-black);\n      }\n    }\n\n    a.shortcut-link {\n      align-items: center;\n      background-color: transparent;\n      // mobile\n      border-bottom: 2.5px solid var(--brand-main-nearly-black);\n      color: var(--brand-main-nearly-black);\n      cursor: pointer;\n      display: flex;\n      font-family: var(--main-font-family);\n      font-size: 14px;\n      font-weight: 600;\n      hyphens: auto;\n      justify-content: space-between;\n      height: 100%;\n      letter-spacing: -0.44px;\n      line-height: 18px;\n      min-height: 70px;\n      position: relative;\n      text-decoration: none;\n      word-break: break-word;\n\n      @include breakpoint($narrow) {\n        // tablet\n        border-bottom: 3px solid var(--brand-main-nearly-black);\n        border-top: 3px solid var(--brand-main-nearly-black);\n        font-size: 16px;\n        letter-spacing: -0.5px;\n        line-height: 18px;\n        min-height: 70px;\n      }\n      @include breakpoint($wide) {\n        font-size: 16px;\n        letter-spacing: -0.5px;\n        line-height: 22px;\n        min-height: 82px;\n      }\n\n      .link-icon {\n        padding: 0 0 0 8px;\n        @include breakpoint($narrow) {\n          padding: 0 0 0 12px;\n        }\n        @include breakpoint($wide) {\n          padding: 0 4px 0 22px;\n        }\n\n        svg {\n          height: 20px;\n          fill: var(--brand-main-light);\n          width: 20px;\n          @include breakpoint($narrow) {\n            height: 24px;\n            width: 24px;\n          }\n          @include breakpoint($wide) {\n            height: 28px;\n            width: 28px;\n          }\n        }\n      }\n\n      &:hover {\n        color: var(--brand-main);\n        svg {\n          fill: var(--brand-main);\n        }\n      }\n    }\n  }\n}\n","export interface ShortcutLinkValue {\n  heading: string;\n  url: string;\n  isExternal: boolean;\n  ariaLabel: string;\n}\n\nimport {Component, ComponentInterface, Element, h, Host, Prop, Watch} from \"@stencil/core\";\nimport {HeadingVarians} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-shortcuts\",\n  styleUrl: \"hy-shortcuts.scss\",\n  shadow: false,\n})\nexport class HyShortcuts implements ComponentInterface {\n  @Element() el: HTMLElement;\n  private _dataItems: ShortcutLinkValue[];\n  @Prop() dataItems: ShortcutLinkValue[] | string;\n  @Prop() listHeading: string = \"\";\n  @Prop() headerstyle: string = \"default\";\n\n  @Watch(\"dataItems\")\n  arrayDataWatcher(newValue: ShortcutLinkValue[] | string) {\n    if (typeof newValue === \"string\") {\n      this._dataItems = JSON.parse(newValue);\n    } else {\n      this._dataItems = newValue;\n    }\n  }\n  componentWillLoad() {\n    this.arrayDataWatcher(this.dataItems);\n  }\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const classAttributes = [\"hy-shortcuts\", `hy-shortcuts__${this.headerstyle}`].join(\" \");\n    const textClassAttributes = [\"text\"].join(\" \");\n    const iconClassAttributes = [\"link-icon\"].join(\" \");\n\n    let classItem = [\"shortcut-link-wrapper\", this._dataItems.length % 4 == 0 ? \"box-4\" : \"box-3\"].join(\" \");\n\n    return (\n      <Host>\n        <div class={classAttributes}>\n          {this.listHeading.length > 0 && (\n            <hy-heading class=\"list-title\" heading={HeadingVarians.h2}>\n              {this.listHeading}\n            </hy-heading>\n          )}\n          <div class=\"shortcut-link-container\">\n            {this._dataItems.map((x, index) => {\n              let isFirstLine = \"\";\n              if (this._dataItems.length % 4 == 0) {\n                isFirstLine = index == 0 || index == 1 ? \"first\" : \"\";\n              } else {\n                isFirstLine = index == 0 ? \"first\" : \"\";\n              }\n              let classLinkWrapper = classItem.concat(\" \", isFirstLine);\n              let target = x.isExternal ? \"_blank\" : \"_self\";\n\n              return (\n                <div class={classLinkWrapper}>\n                  <a aria-label={x.ariaLabel} class=\"shortcut-link\" href={x.url} target={target}>\n                    <span class={textClassAttributes}>{x.heading}</span>\n                    <span class={iconClassAttributes}>\n                      <hy-icon icon={\"hy-icon-arrow-right\"} size={28} />\n                    </span>\n                  </a>\n                </div>\n              );\n            })}\n          </div>\n        </div>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"qGAAA,MAAMA,EAAiB,qnJ,MCeVC,EAAW,M,mEAIQ,G,iBACA,S,CAG9BC,iBAAiBC,GACf,UAAWA,IAAa,SAAU,CAChCC,KAAKC,WAAaC,KAAKC,MAAMJ,E,KACxB,CACLC,KAAKC,WAAaF,C,EAGtBK,oBACEJ,KAAKF,iBAAiBE,KAAKK,U,CAG7BC,mBACE,IAAIC,EAAYP,KAAKQ,GAAGC,QAAQ,YAChC,GAAIF,EAAW,CACb,IAAKA,EAAUG,UAAUC,SAAS,gBAAiB,CACjDX,KAAKY,YAAc,O,GAKzBC,SACE,MAAMC,EAAkB,CAAC,eAAgB,iBAAiBd,KAAKY,eAAeG,KAAK,KACnF,MAAMC,EAAsB,CAAC,QAAQD,KAAK,KAC1C,MAAME,EAAsB,CAAC,aAAaF,KAAK,KAE/C,IAAIG,EAAY,CAAC,wBAAyBlB,KAAKC,WAAWkB,OAAS,GAAK,EAAI,QAAU,SAASJ,KAAK,KAEpG,OACEK,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAOR,GACTd,KAAKuB,YAAYJ,OAAS,GACzBC,EAAA,cAAYE,MAAM,aAAaE,QAASC,EAAeC,IACpD1B,KAAKuB,aAGVH,EAAA,OAAKE,MAAM,2BACRtB,KAAKC,WAAW0B,KAAI,CAACC,EAAGC,KACvB,IAAIC,EAAc,GAClB,GAAI9B,KAAKC,WAAWkB,OAAS,GAAK,EAAG,CACnCW,EAAcD,GAAS,GAAKA,GAAS,EAAI,QAAU,E,KAC9C,CACLC,EAAcD,GAAS,EAAI,QAAU,E,CAEvC,IAAIE,EAAmBb,EAAUc,OAAO,IAAKF,GAC7C,IAAIG,EAASL,EAAEM,WAAa,SAAW,QAEvC,OACEd,EAAA,OAAKE,MAAOS,GACVX,EAAA,kBAAeQ,EAAEO,UAAWb,MAAM,gBAAgBc,KAAMR,EAAES,IAAKJ,OAAQA,GACrEb,EAAA,QAAME,MAAON,GAAsBY,EAAEJ,SACrCJ,EAAA,QAAME,MAAOL,GACXG,EAAA,WAASkB,KAAM,sBAAuBC,KAAM,OAG5C,MAKdnB,EAAA,UAAQoB,GAAG,uB"}

package/dist/huds-lib/hy-table-container.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as a}from"./index-f84f2a7d.js";const i=':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}.hy-table-container{font-size:0.875rem;line-height:18px;display:block;position:relative;overflow:scroll;white-space:nowrap}@media (min-width: 30rem){.hy-table-container{font-size:1rem;line-height:20px}}.hy-table-container table{border-collapse:collapse;border:1px solid var(--grayscale-dark);text-indent:initial;width:100%}.hy-table-container thead{border-bottom:1px solid var(--grayscale-dark);border-left:1px solid var(--grayscale-dark);border-right:1px solid var(--grayscale-dark)}.hy-table-container thead th{font-size:0.875rem;line-height:20px;border-left:1px solid black;background-color:var(--grayscale-light);text-transform:uppercase}@media (min-width: 30rem){.hy-table-container thead th{font-size:1rem;line-height:20px}}.hy-table-container td,.hy-table-container th{border:1px solid var(--grayscale-dark);background-clip:padding-box;color:var(--grayscale-dark);font-family:var(--main-font-family);letter-spacing:-0.5px;padding:0.7em 0.9em;text-align:left;vertical-align:top;word-wrap:break-word}.hy-table-container td a,.hy-table-container th a{text-decoration:none}.hy-table-container td a:hover,.hy-table-container th a:hover{cursor:pointer;text-decoration:underline}.hy-table-container td p,.hy-table-container th p{font-size:inherit}.hy-table-container td:first-child,.hy-table-container th:first-child{font-weight:700;border-collapse:separate;border-right:none;left:0;max-width:180px;min-width:180px;position:sticky;white-space:normal;width:180px;z-index:2}@media (min-width: 60rem){.hy-table-container td:first-child,.hy-table-container th:first-child{border-right:1px solid var(--grayscale-dark)}}.hy-table-container td:first-child::after,.hy-table-container th:first-child::after{content:"";display:block;position:absolute;right:-10px;bottom:0;width:10px;top:0;height:100%;background:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0)));background:linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%)}@media (min-width: 60rem){.hy-table-container td:first-child::after,.hy-table-container th:first-child::after{display:none}}.hy-table-container td:first-child::before,.hy-table-container th:first-child::before{border-left:1px solid black;content:"";display:block;position:absolute;left:-1px;bottom:0;width:1px;top:0;height:100%}@media (min-width: 60rem){.hy-table-container td:first-child::before,.hy-table-container th:first-child::before{display:none}}@media (min-width: 30rem){.hy-table-container td:first-child,.hy-table-container th:first-child{max-width:220px;min-width:220px;width:220px}}@media (min-width: 48rem){.hy-table-container td:first-child,.hy-table-container th:first-child{max-width:300px;min-width:300px;width:300px}}@media (min-width: 60rem){.hy-table-container td:first-child,.hy-table-container th:first-child{max-width:40%;min-width:40%;width:40%}}.hy-table-container td:first-child:only-child,.hy-table-container th:first-child:only-child{border:1px solid var(--grayscale-dark)}.hy-table-container td:first-child:only-child::after,.hy-table-container td:first-child:only-child::before,.hy-table-container th:first-child:only-child::after,.hy-table-container th:first-child:only-child::before{display:none}.hy-table-container td{background-color:var(--grayscale-white);word-wrap:break-word;white-space:normal}.hy-table-container caption{margin-bottom:1rem}';const r=class{constructor(e){t(this,e)}render(){const t=["hy-table-container"].join(" ");return e(a,{class:t},e("slot",null),e("hy-box",{mb:"1.75, 1.75, 2, 2.5"}))}};r.style=i;export{r as hy_table_container};
+//# sourceMappingURL=hy-table-container.entry.js.map

package/dist/huds-lib/hy-table-container.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyTableContainerCss","HyTableContainer","render","classAttributes","join","h","Host","class","mb"],"sources":["./src/components/hy-table-container/hy-table-container.scss?tag=hy-table-container","./src/components/hy-table-container/hy-table-container.tsx"],"sourcesContent":[".hy-table-container {\n  @include font-size(14px, 18px);\n  display: block;\n  position: relative;\n  overflow: scroll;\n  white-space: nowrap;\n\n  @include breakpoint($narrow) {\n    @include font-size(16px, 20px);\n  }\n\n  table {\n    border-collapse: collapse;\n    border: 1px solid var(--grayscale-dark);\n    text-indent: initial;\n    width: 100%;\n  }\n\n  thead {\n    border-bottom: 1px solid var(--grayscale-dark);\n    border-left: 1px solid var(--grayscale-dark);\n    border-right: 1px solid var(--grayscale-dark);\n\n    th {\n      @include font-size(14px, 20px);\n      border-left: 1px solid black;\n      background-color: var(--grayscale-light);\n      text-transform: uppercase;\n\n      @include breakpoint($narrow) {\n        @include font-size(16px, 20px);\n      }\n    }\n  }\n\n  td,\n  th {\n    border: 1px solid var(--grayscale-dark);\n    background-clip: padding-box;\n    color: var(--grayscale-dark);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.5px;\n    padding: 0.7em 0.9em;\n    text-align: left;\n    vertical-align: top;\n    word-wrap: break-word;\n\n    a {\n      text-decoration: none;\n\n      &:hover {\n        cursor: pointer;\n        text-decoration: underline;\n      }\n    }\n\n    p {\n      font-size: inherit;\n    }\n\n    &:first-child {\n      @include font-weight($bold);\n      border-collapse: separate;\n      border-right: none;\n      //border-left: none;\n      left: 0;\n      max-width: 180px;\n      min-width: 180px;\n      position: sticky;\n      white-space: normal;\n      width: 180px;\n      z-index: 2;\n\n      @include breakpoint($wide) {\n        border-right: 1px solid var(--grayscale-dark);\n      }\n\n      &::after {\n        content: \"\";\n        display: block;\n        position: absolute;\n        right: -10px;\n        bottom: 0;\n        width: 10px;\n        top: 0;\n        height: 100%;\n        background: linear-gradient(90deg, rgba(000, 000, 000, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n\n        @include breakpoint($wide) {\n          display: none;\n        }\n      }\n\n      &::before {\n        border-left: 1px solid black;\n        content: \"\";\n        display: block;\n        position: absolute;\n        left: -1px;\n        bottom: 0;\n        width: 1px;\n        top: 0;\n        height: 100%;\n\n        @include breakpoint($wide) {\n          display: none;\n        }\n      }\n\n      @include breakpoint($narrow) {\n        max-width: 220px;\n        min-width: 220px;\n        width: 220px;\n      }\n\n      @include breakpoint($medium) {\n        max-width: 300px;\n        min-width: 300px;\n        width: 300px;\n      }\n\n      @include breakpoint($wide) {\n        max-width: 40%;\n        min-width: 40%;\n        width: 40%;\n      }\n\n      &:only-child {\n        border: 1px solid var(--grayscale-dark);\n        &::after,\n        &::before {\n          display: none;\n        }\n      }\n    }\n  }\n\n  td {\n    background-color: var(--grayscale-white);\n    word-wrap: break-word;\n    white-space: normal;\n  }\n\n  caption {\n    margin-bottom: 1rem;\n  }\n}\n","import {Component, Host, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-table-container\",\n  styleUrl: \"hy-table-container.scss\",\n  shadow: false,\n})\nexport class HyTableContainer {\n  render() {\n    const classAttributes = [\"hy-table-container\"].join(\" \");\n\n    return (\n      <Host class={classAttributes}>\n        <slot></slot>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"sDAAA,MAAMA,EAAsB,67I,MCOfC,EAAgB,M,yBAC3BC,SACE,MAAMC,EAAkB,CAAC,sBAAsBC,KAAK,KAEpD,OACEC,EAACC,EAAI,CAACC,MAAOJ,GACXE,EAAA,aACAA,EAAA,UAAQG,GAAG,uB"}

package/dist/huds-lib/hy-tabs_2.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,g as a}from"./index-f84f2a7d.js";const i=':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}.hy-tabs__container .hy-tablist-container{border-bottom:1px solid var(--grayscale-tabs-border);position:relative}.hy-tabs__container .hy-tab-scroll{background-color:rgba(255, 255, 255, 0.8);border:0;height:100%;margin:0;padding:0;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:4}.hy-tabs__container .hy-tab-scroll.is-hidden{display:none;visibility:hidden}.hy-tabs__container .hy-tab-scroll.is-disabled{background-color:var(--grayscale-medium)}.hy-tabs__container .hy-tab-scroll.is-disabled:hover{cursor:none}.hy-tabs__container .hy-tab-scroll:focus,.hy-tabs__container .hy-tab-scroll:hover{outline:none;cursor:pointer}.hy-tabs__container .hy-tab-scroll span{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-black);border-radius:100%;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;height:32px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:32px}.hy-tabs__container .hy-tab-scroll span svg{fill:var(--grayscale-white);height:16px;width:16px}.hy-tabs__container .hy-tab-scroll__left{left:0;padding-right:8px}.hy-tabs__container .hy-tab-scroll__left svg{-webkit-transform:translateX(-1px);transform:translateX(-1px)}.hy-tabs__container .hy-tab-scroll__right{padding-left:8px;right:0}.hy-tabs__container .hy-tab-scroll__right svg{-webkit-transform:translateX(1px);transform:translateX(1px)}.hy-tabs__container [role=tablist]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin:0 0 -0.1em;overflow:scroll;position:relative;scrollbar-width:none;white-space:nowrap}.hy-tabs__container [role=tablist]::-webkit-scrollbar{display:none}.hy-tabs__container [role=tablist] a{display:-webkit-box;display:-ms-flexbox;display:flex;max-width:47.56%;text-decoration:none;-ms-flex-negative:0;flex-shrink:0}.hy-tabs__container [role=tablist] a:not(:first-of-type){margin-left:6px}@media (min-width: 30rem){.hy-tabs__container [role=tablist] a{max-width:35.37%}}@media (min-width: 60rem){.hy-tabs__container [role=tablist] a{max-width:23.13%}}@media (min-width: 75.0625rem){.hy-tabs__container [role=tablist] a{max-width:23.03%}}.hy-tabs__container [role=tab]{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;background-color:transparent;border:0;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;margin-bottom:6px;padding:0}.hy-tabs__container [role=tab]>span{font-size:0.875rem;line-height:14px;font-weight:700;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-background-box);border:0;color:var(--link-blue);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);-ms-hyphens:auto;hyphens:auto;letter-spacing:-0.5px;padding:8px 8px 7px;pointer-events:none;position:relative;text-align:left;white-space:normal;word-break:break-word;overflow-wrap:break-word;overflow-wrap:break-word}@media (min-width: 30rem){.hy-tabs__container [role=tab]>span{font-size:1rem;line-height:18px;padding:16px 12px 10px}}@media (min-width: 75.0625rem){.hy-tabs__container [role=tab]>span{font-size:1.125rem;line-height:20px;letter-spacing:-0.6px;padding:16px 16px 14px}}@supports (overflow-wrap: anywhere){.hy-tabs__container [role=tab]>span{overflow-wrap:anywhere}}@supports (overflow-wrap: anywhere){.hy-tabs__container [role=tab]>span{overflow-wrap:anywhere}}@media (min-width: 75.0625rem){.hy-tabs__container [role=tab].large{margin:0 12px 0 0}}.hy-tabs__container [role=tab][aria-selected=true]{border-bottom-width:0;border:1px solid var(--grayscale-dark);margin-bottom:0;z-index:3}.hy-tabs__container [role=tab][aria-selected=true]>span{background-color:var(--grayscale-white);color:var(--grayscale-black);padding-bottom:13px}@media (min-width: 30rem){.hy-tabs__container [role=tab][aria-selected=true]>span{padding-bottom:16px}}@media (min-width: 75.0625rem){.hy-tabs__container [role=tab][aria-selected=true]>span{padding-bottom:20px}}.hy-tabs__container [role=tab][aria-selected=true]>span:before{background-color:var(--grayscale-white);bottom:0;content:"";height:4px;left:0;position:absolute;right:0;-webkit-transform:translateY(50%);transform:translateY(50%)}.hy-tabs__container [role=tab][aria-selected=true]>span:after{background-color:var(--grayscale-black);bottom:0;content:"";height:4px;left:8px;position:absolute;right:8px}.hy-tabs__container [role=tab]:hover{border-radius:0;color:inherit;cursor:pointer;text-decoration:none}.hy-tabs__container [role=tab]:hover span{background-color:var(--hover-gray);color:var(--brand-main-active)}.hy-tabs__container [role=tabpanel]{border:1px solid var(--grayscale-dark);padding:28px 12px;position:relative;z-index:2}@media (min-width: 30rem){.hy-tabs__container [role=tabpanel]{padding:38px 15px}}@media (min-width: 60rem){.hy-tabs__container [role=tabpanel]{padding:40px 20px}}.hy-tabs__container [role=tabpanel]:focus{outline:1px solid var(--brand-main-active)}';let r={end:35,home:36,left:37,up:38,right:39,down:40,delete:46};let n={37:-1,38:-1,39:1,40:1};let o;let s;let l;const d=class{constructor(e){t(this,e);this.tabId=undefined;this.tabListLabel="";this.focusTimeoutCleared=true;this.tabButtonTitles=undefined;this.tabPanelsState=undefined;this.tabButtons=undefined;this.tabList=undefined;this.headerstyle="common"}componentWillLoad(){const t=this.el.querySelectorAll("hy-tabs-item");if(t){this.tabButtonTitles=Array.from(t).map((t=>({title:t.getAttribute("tab-title"),id:t.getAttribute("tab-title").toLowerCase().replace(/\W/g,"-")})))}}componentDidLoad(){let t=this.el.closest(".hy-main");if(t){if(!t.classList.contains("with-sidebar")){this.headerstyle="large"}}const e=this.el.querySelector(".hy-tabs__container");if(e){this.generateArrays(e);const t=this.el.querySelectorAll(".hy-tab-scroll__left")[0];const a=this.el.querySelectorAll(".hy-tab-scroll__right")[0];const i=this.tabList;this.checkScrollHidden(i,t,a);i.addEventListener("scroll",(()=>{l=setTimeout((()=>{window.clearTimeout(l);this.checkScrollHidden(i,t,a)}),250)}),false);if(i.offSetWidth<=document.body.scrollWidth){t.classList.add("is-hidden");a.classList.add("is-hidden")}const r=250;a.addEventListener("click",(e=>{e.preventDefault();a.classList.add("is-disabled");i.scrollBy({top:0,left:+r,behavior:"smooth"});o=window.setTimeout((()=>{window.clearTimeout(o);this.checkScrollHidden(i,t,a);a.classList.remove("is-disabled")}),250)}));t.addEventListener("click",(e=>{e.preventDefault();t.classList.add("is-disabled");i.scrollBy({top:0,left:-r,behavior:"smooth"});o=window.setTimeout((()=>{window.clearTimeout(o);this.checkScrollHidden(i,t,a);t.classList.remove("is-disabled")}),250)}))}}generateArrays(t){this.tabList=t.querySelectorAll('[role="tablist"]')[0];this.tabButtons=t.querySelectorAll('[role="tab"]');this.tabPanelsState=[t.querySelectorAll('[role="tabpanel"]')];if(this.tabButtons.length>0){this.addListeners(this.tabButtons,1);this.activateTab(this.tabButtons[0],true)}}addListeners(t,e){if(t.length>1){for(let a=0;a<t.length;++a){t[e].addEventListener("click",this.clickEventListener);t[e].addEventListener("keydown",this.keydownEventListener);t[e].index=e}}}checkScrollHidden(t,e,a){if(t.scrollLeft===0){e.classList.add("is-hidden")}else{e.classList.remove("is-hidden")}if(t.scrollLeft+t.clientWidth>=t.scrollWidth-1){a.classList.add("is-hidden")}else{a.classList.remove("is-hidden")}}clickEventListener(t){if(t){const e=t.target;const a=this.tabButtonTitles;if(a){a.forEach((t=>{const a=Object.values(t)[1];if(a===e.id){this.activateTab(e,true)}}));t.stopPropagation();t.stopImmediatePropagation()}}}keydownEventListener(t){const e=t.keyCode;const a=this.tabButtonTitles;switch(e){case r.end:t.preventDefault();this.activateTab(a[a.length-1],true);break;case r.home:t.preventDefault();this.activateTab(a[0],true);break;case r.up:case r.down:if(this.focusTimeoutCleared){this.determineOrientation(t)}break}}keyupEventListener(t){const e=t.keyCode;switch(e){case r.left:case r.right:if(t.target.role==="tab"){t.preventDefault();if(this.focusTimeoutCleared){this.determineOrientation(t)}}break}t.stopPropagation();t.stopImmediatePropagation()}determineOrientation(t){const e=this.el.querySelectorAll(".hy-tab-scroll__left")[0];const a=this.el.querySelectorAll(".hy-tab-scroll__right")[0];const i=this.tabList;this.checkScrollHidden(i,e,a);const n=t.keyCode;const o=i.getAttribute("aria-orientation")=="vertical";let s=false;if(o){if(n===r.up||n===r.down){t.preventDefault();s=true}}else{if(n===r.left||n===r.right){s=true}}if(s){this.switchTabOnArrowPress(t)}}switchTabOnArrowPress(t){const e=t.keyCode;if(n[e]){const a=t.target;const i=this.tabButtons;for(let t=0;t<i.length;t++){if(i[t].id===a.id){if(t>0){if(n[e]===-1){i[t-1].focus();this.focusEventHandler(i[t-1]);break}}if(t<i.length-1){if(n[e]===1){i[t+1].focus();this.focusEventHandler(i[t+1]);break}}}}}}activateTab(t,e){e=e||true;this.deactivateTabs(this.tabButtons);t.removeAttribute("tabindex");t.setAttribute("aria-selected","true");const a=t.getAttribute("aria-controls");this.el.querySelector(`#${a}`).removeAttribute("hidden");if(e){t.focus()}}deactivateTabs(t){for(let e=0;e<t.length;e++){t[e].setAttribute("tabindex","-1");t[e].setAttribute("aria-selected","false");t[e].removeEventListener("focus",this.focusEventHandler)}const e=this.tabPanelsState[0];for(let t=0;t<e.length;t++){e[t].setAttribute("hidden","hidden")}}focusEventHandler(t){const e=t;this.focusTimeoutCleared=false;s=window.setTimeout((()=>{window.clearTimeout(s);this.focusTimeoutCleared=true;const t=document.activeElement;if(e===t){this.activateTab(e,false)}}),250)}render(){const t=["hy-tabs__container",`hy-tabs__container__${this.headerstyle}`].join(" ");const a=this.tabId.toLowerCase().replace(/\W/g,"-");if(window.location.hash){const t=window.location.hash.substring(1);const e=this.tabButtonTitles.some((e=>e["id"]===t));if(e){const e=document.getElementById(t);if(e){this.activateTab(e,true);const t=e.getBoundingClientRect();window.scrollTo({top:window.scrollY+t.top-200,behavior:"smooth"})}}}return[e("hy-box",{pt:"1.25, 1.25, 1.5, 2.5"}),e("div",{id:a,class:t},e("div",{class:"hy-tablist-container"},e("button",{tabindex:"-1",class:"hy-tab-scroll hy-tab-scroll__left is-hidden","aria-hidden":"true"},e("span",null,e("hy-icon",{icon:"hy-icon-caret-left",size:16}))),e("div",{role:"tablist","aria-label":this.tabListLabel},this.tabButtonTitles&&this.tabButtonTitles.map((t=>{const a=Object.values(t)[0];const i=a.toLowerCase().replace(/\W/g,"-");const r=a.toLowerCase().replace(/\W/g,"-");const n="#"+r;return e("a",{href:n,tabindex:"-1"},e("button",{"aria-selected":"false","aria-controls":`${i}-tab`,class:this.headerstyle,role:"tab",id:i},e("span",null,a)))}))),e("button",{tabindex:"-1",class:"hy-tab-scroll hy-tab-scroll__right","aria-hidden":"true"},e("span",null,e("hy-icon",{icon:"hy-icon-caret-right",size:16})))),e("slot",null)),e("hy-box",{mb:"1.75, 1.75, 2, 2.5"})]}get el(){return a(this)}};d.style=i;const b=":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}";const c=class{constructor(e){t(this,e);this.tabTitle=undefined}render(){const t=this.tabTitle.toLowerCase().replace(/\W/g,"-");return e("div",{tabindex:"0",role:"tabpanel",id:`${t}-tab`,"aria-labelledby":t,hidden:true},e("slot",null))}};c.style=b;export{d as hy_tabs,c as hy_tabs_item};
+//# sourceMappingURL=hy-tabs_2.entry.js.map