@itcenteratunihelsinki/huds-lib 0.8.57 → 0.8.59

package/dist/huds-lib/hy-link-box_2.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as t,g as e,H as a}from"./index-f84f2a7d.js";import{l as n}from"./utils-7438924c.js";import{j as r}from"./globalScript-5a4b7abf.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}:host{height:100%}.hy-link-box-container{background:var(--grayscale-background-box);width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;height:100%;position:relative}.hy-link-box-container:focus-within{outline:auto}.hy-link-box-container:hover{cursor:pointer}.hy-link-box-container:hover .hy-link-box__text-container__title{color:var(--brand-main);text-decoration:underline}.hy-link-box-container:hover .hy-cta-link{text-decoration:underline}.hy-link-box-container:hover .hy-cta-link .hy-cta-link__icon{background-color:var(--brand-main)}.hy-link-box__image-container{margin:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:stretch;-ms-flex-pack:stretch;justify-content:stretch;min-height:10rem;position:relative}.hy-link-box__image-container:before{content:"";display:block;padding-top:62.5%;width:100%}.hy-link-box__image-container img{bottom:0;height:100%;left:0;-o-object-fit:cover;object-fit:cover;position:absolute;right:0;top:0;width:100%}.hy-link-box__image-container.is-image-missing svg{position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);left:50%;width:85px;height:auto;fill:#d2d2d2}.hy-link-box__text-container{padding:16px}.hy-link-box__text-container__title{font-size:1.3125rem;line-height:28px;font-weight:700;color:var(--brand-main-nearly-black);font-family:var(--main-font-family);letter-spacing:-0.42px;-ms-hyphens:auto;hyphens:auto;word-break:break-word;margin:0 0 16px}@media screen and (min-width: 1024px){.hy-link-box__text-container__title{font-size:1.5625rem;line-height:32px;letter-spacing:-0.5px}}.hy-link-box__text-container__description{font-size:0.9375rem;line-height:22px;color:var(--grayscale-black);font-family:var(--main-font-family);margin:0}@media screen and (min-width: 1024px){.hy-link-box__text-container__description{font-size:1.0625rem;line-height:26px}}.hy-cta-link{font-weight:600;font-size:1rem;line-height:24px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--brand-main);display:inline-grid;font-family:var(--main-font-family);gap:16px;grid-auto-flow:column;letter-spacing:-0.5px;overflow:hidden;text-decoration:none;margin:0 -8px 24px 0;align-self:flex-end}.hy-cta-link span[aria-hidden=true]{position:absolute;inset:0}.hy-cta-link:focus{outline:none}.hy-cta-link__icon{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--brand-main-light);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;height:40px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:40px}.hy-cta-link__icon svg{fill:var(--grayscale-white)}.hy-cta-link__icon--external svg{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}';const l=class{constructor(t){i(this,t);this.variant=n.default;this.imageUrl=null;this.imageAlt=null;this.disableLazy=false;this.useSlot=false;this.showLogo=false;this.textTitle=undefined;this.textDescription=null;this.url=undefined;this.isExternal=false;this.scLabel=undefined;this.readMoreLabel=undefined;this.headerstyle="common";this.sourceSet=undefined}srcSetWatcher(i){this._sourceSet=typeof i==="string"?JSON.parse(i):i}componentWillLoad(){this.srcSetWatcher(this.sourceSet)}componentDidLoad(){let i=this.el.closest(".hy-main");if(i){if(!i.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const i=["hy-link-box-container"].join(" ");const e=["hy-link-box",this.variant,`hy-link-box__${this.variant}`,this.headerstyle,`hy-link-box__${this.headerstyle}`,this.imageUrl?"hy-link-box--with-image":null].join(" ");const a=["hy-link-box__text-container",this.imageUrl?"hy-link-box--with-image":null].join(" ");const n=["hy-link-box__text-container__title",`hy-link-box__text-container__title__${this.variant}`,`hy-link-box__text-container__title__${this.headerstyle}`,this.imageUrl?"hy-link-box__text-container__title__image":"",this.imageUrl?"image":""].join(" ");const r=["hy-link-box__text-container__description",`hy-link-box__text-container__description__${this.variant}`,`hy-link-box__text-container__description__${this.headerstyle}`].join(" ");const o=this.isExternal?"_blank":"_self";const l=16;const s=10;const d=s/l*100;const h={"--aspectRatio":`${d}%`};return[t("article",{class:i},t("div",{class:e},this.imageUrl&&(this._sourceSet?t("figure",{class:"hy-link-box__image-container",style:h},t("picture",null,this._sourceSet.map((i=>t("source",{srcSet:i.src,media:i.media,type:i.type,sizes:i.sizes?i.sizes:""}))),t("img",{loading:this.disableLazy?"eager":"lazy","aria-hidden":"true",src:this.imageUrl,alt:this.imageAlt}))):t("figure",{class:"hy-link-box__image-container",style:h},t("img",{loading:this.disableLazy?"eager":"lazy","aria-hidden":"true",src:this.imageUrl,alt:this.imageAlt}))),!this.imageUrl&&this.showLogo&&t("div",{"aria-hidden":"true",class:"hy-link-box__image-container is-image-missing"},t("hy-icon",{class:{"hy-site-logo__icon":true},icon:"hy-icon-hy-logo"})),t("div",{class:a},t("h3",{class:n},this.textTitle),this.textDescription&&t("p",{class:r},this.textDescription.length>=141?this.textDescription.slice(0,140)+"...":this.textDescription))),t("a",{"aria-label":this.scLabel||`${this.readMoreLabel} - ${this.textTitle}`,title:this.scLabel||`${this.readMoreLabel} - ${this.textTitle}`,href:this.url,target:o,class:`hy-cta-link hy-cta-link--default`},t("span",{"aria-hidden":"true"}),t("span",null,this.readMoreLabel),t("span",{class:`hy-cta-link__icon ${this.isExternal?"hy-cta-link__icon--external":""}`},t("hy-icon",{icon:"hy-icon-arrow-to-right",size:24}))))]}get el(){return e(this)}static get watchers(){return{sourceSet:["srcSetWatcher"]}}};l.style=o;const s=":root{--brand-main:#0e688b;--brand-main-soft:#b1e7ff;--brand-main-bright:#48c5f8;--brand-main-light:#107eab;--brand-main-active:#005379;--brand-main-dark:#003146;--brand-main-nearly-black:#000222;--link-blue:#0479a4;--link-disabled:#767676;--grayscale-white:#fff;--grayscale-slightly-gray:#fefefe;--grayscale-light:#f8f8f8;--grayscale-medium:#d2d2d2;--grayscale-background-box:#f5f5f5;--grayscale-tabs-border:#e6e6e6;--grayscale-background-arrow:#dfdfdf;--grayscale-medium-dark:#979797;--grayscale-dark:#555555;--grayscale-dark-text:#222222;--grayscale-black:#000000;--additional-red-light:#e5053a;--additional-red-dark:#a31621;--additional-purple-light:#420039;--additional-yellow-light:#f9a21a;--additional-yellow:#c47f1b;--additional-skyblue:#48c5f8;--additional-orange:#d14600;--additional-green-light:#96ba3c;--additional-green-dark:#006400;--hover-gray:#eaeaea}*{-webkit-box-sizing:border-box;box-sizing:border-box}:root{--gutter-mobile:16px;--gutter-narrow:24px;--gutter-medium:24px;--gutter-wide:24px;--gutter-extrawide:32px}:root{--breakpoint-extrawide:75.0625rem;--breakpoint-max-width:75.0625rem;--breakpoint-medium:48rem;--breakpoint-narrow:30rem;--breakpoint-wide:60rem}:host{display:block}.hy-link-box-list{padding:0;margin:0;list-style:none;display:grid;gap:32px 0}@media screen and (min-width: 768px){.hy-link-box-list{grid-template-columns:repeat(2, 1fr);gap:32px 24px}}@media screen and (min-width: 1024px){.hy-link-box-list{grid-template-columns:repeat(3, 1fr)}}@media screen and (min-width: 1920px){.hy-link-box-list{gap:32px}}";const d=class{constructor(t){i(this,t);this.headerstyle="common";this.variant=n.default;this.readMoreLabel=undefined;this.dataItems=undefined}async componentWillLoad(){this._dataItems=await r(this.dataItems)}componentDidLoad(){let i=this.el.closest(".hy-main");if(i){if(!i.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const i=["hy-link-box-list",this.variant,`hy-link-box-list__${this.variant}`,`hy-link-box-list__${this.headerstyle}`].join(" ");const e=[this.variant,`hy-link-box__${this.variant}`].join(" ");return t(a,null,t("ul",{class:i},this._dataItems.map((i=>t("li",null,t("hy-link-box",{class:e,variant:this.variant,"source-set":i.imageSets,"image-url":i.imageUrl,"image-alt":i.imageAlt,"text-title":i.heading,"text-description":i.description,"show-logo":i.showLogo,url:i.boxUrl,"is-external":i.isExternal,"sc-label":i.ariaLabel,"read-more-label":this.readMoreLabel}))))),t("hy-box",{mb:"1.75, 1.75, 2, 2.5"}))}get el(){return e(this)}};d.style=s;export{l as hy_link_box,d as hy_link_box_list};
+//# sourceMappingURL=hy-link-box_2.entry.js.map

package/dist/huds-lib/hy-link-box_2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["linkBoxCss","LinkBox","LinkBoxVariants","default","srcSetWatcher","data","this","_sourceSet","JSON","parse","componentWillLoad","sourceSet","componentDidLoad","hyMainDiv","el","closest","classList","contains","headerstyle","render","classContainerAttributes","join","classAttributes","variant","imageUrl","classTextContainer","classTitle","classDescription","target","isExternal","aspectRatioWidth","aspectRatioHeight","aspect","aspectRatio","h","class","style","map","item","srcSet","src","media","type","sizes","loading","disableLazy","alt","imageAlt","showLogo","icon","textTitle","textDescription","length","slice","scLabel","readMoreLabel","title","href","url","size","linkBoxListCss","LinkBoxList","async","_dataItems","jsonParserWorker","dataItems","classItemAttributes","Host","x","imageSets","heading","description","boxUrl","ariaLabel","mb"],"sources":["./src/components/hy-link-box/link-box.scss?tag=hy-link-box","./src/components/hy-link-box/link-box.tsx","./src/components/hy-link-box-list/link-box-list.scss?tag=hy-link-box-list","./src/components/hy-link-box-list/link-box-list.tsx"],"sourcesContent":[":host {\n  height: 100%;\n}\n\n.hy-link-box-container {\n  background: var(--grayscale-background-box);\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  height: 100%;\n  position: relative;\n\n  &:focus-within {\n    outline: auto;\n  }\n\n  &:hover {\n    cursor: pointer;\n\n    .hy-link-box__text-container__title {\n      color: var(--brand-main);\n      text-decoration: underline;\n    }\n\n    .hy-cta-link {\n      text-decoration: underline;\n\n      .hy-cta-link__icon {\n        background-color: var(--brand-main);\n      }\n    }\n  }\n}\n\n.hy-link-box__image-container {\n  margin: 0;\n  display: flex;\n  justify-content: stretch;\n  min-height: 10rem;\n  position: relative;\n\n  &:before {\n    content: \"\";\n    display: block;\n    padding-top: calc(10 / 16) * 100%;\n    width: 100%;\n  }\n\n  img {\n    bottom: 0;\n    height: 100%;\n    left: 0;\n    object-fit: cover;\n    position: absolute;\n    right: 0;\n    top: 0;\n    width: 100%;\n  }\n\n  &.is-image-missing {\n    svg {\n      position: absolute;\n      top: 50%;\n      transform: translate(-50%, -50%);\n      left: 50%;\n      width: 85px;\n      height: auto;\n      fill: #d2d2d2;\n    }\n  }\n}\n\n.hy-link-box__text-container {\n  padding: 16px;\n}\n\n.hy-link-box__text-container__title {\n  @include font-size(21px, 28px);\n  @include font-weight($bold);\n  color: var(--brand-main-nearly-black);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.42px;\n  hyphens: auto;\n  word-break: break-word;\n  margin: 0 0 16px;\n\n  @media screen and (min-width: 1024px) {\n    @include font-size(25px, 32px);\n    letter-spacing: -0.5px;\n  }\n}\n\n.hy-link-box__text-container__description {\n  @include font-size(15px, 22px);\n  color: var(--grayscale-black);\n  font-family: var(--main-font-family);\n  margin: 0;\n\n  @media screen and (min-width: 1024px) {\n    @include font-size(17px, 26px);\n  }\n}\n\n.hy-cta-link {\n  @include font-weight($semibold);\n  @include font-size(16px, 24px);\n  align-items: center;\n  color: var(--brand-main);\n  display: inline-grid;\n  font-family: var(--main-font-family);\n  gap: 16px;\n  grid-auto-flow: column;\n  letter-spacing: -0.5px;\n  overflow: hidden;\n  text-decoration: none;\n  margin: 0 -8px 24px 0;\n  align-self: flex-end;\n\n  span[aria-hidden=\"true\"] {\n    position: absolute;\n    inset: 0;\n  }\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.hy-cta-link__icon {\n  align-items: center;\n  background-color: var(--brand-main-light);\n  display: inline-flex;\n  height: 40px;\n  justify-content: center;\n  width: 40px;\n\n  svg {\n    fill: var(--grayscale-white);\n  }\n\n  &--external {\n    svg {\n      transform: rotate(-45deg);\n    }\n  }\n}\n","export interface ImageSrcSet {\n  src: any;\n  media: string;\n  type: string;\n  sizes: string | null;\n}\n\nimport {Component, ComponentInterface, Element, Prop, h, Watch} from \"@stencil/core\";\nimport {LinkBoxVariants} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-link-box\",\n  styleUrl: \"link-box.scss\",\n  shadow: false,\n})\nexport class LinkBox implements ComponentInterface {\n  @Prop() variant: LinkBoxVariants = LinkBoxVariants.default;\n  @Prop() imageUrl: string = null;\n  @Prop() imageAlt: string = null;\n  @Prop() disableLazy: boolean = false;\n  @Prop() useSlot: boolean = false;\n  @Prop() showLogo: boolean = false;\n  @Prop() textTitle?: string;\n  @Prop() textDescription: string = null;\n  @Prop() url?: string;\n  @Prop() isExternal: boolean = false;\n  @Prop() scLabel?: string;\n  @Prop() readMoreLabel: string;\n  @Prop() headerstyle: string = \"common\";\n  private _sourceSet: ImageSrcSet[];\n  @Prop() sourceSet: ImageSrcSet[] | string;\n  @Element() el: HTMLElement;\n\n  @Watch(\"sourceSet\") srcSetWatcher(data: ImageSrcSet[] | string) {\n    this._sourceSet = typeof data === \"string\" ? JSON.parse(data) : data;\n  }\n\n  componentWillLoad() {\n    this.srcSetWatcher(this.sourceSet);\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 classContainerAttributes = [\"hy-link-box-container\"].join(\" \");\n    const classAttributes = [\n      \"hy-link-box\",\n      this.variant,\n      `hy-link-box__${this.variant}`,\n      this.headerstyle,\n      `hy-link-box__${this.headerstyle}`,\n      this.imageUrl ? \"hy-link-box--with-image\" : null,\n    ].join(\" \");\n\n    const classTextContainer = [\"hy-link-box__text-container\", this.imageUrl ? \"hy-link-box--with-image\" : null].join(\n      \" \"\n    );\n\n    const classTitle = [\n      \"hy-link-box__text-container__title\",\n      `hy-link-box__text-container__title__${this.variant}`,\n      `hy-link-box__text-container__title__${this.headerstyle}`,\n      this.imageUrl ? \"hy-link-box__text-container__title__image\" : \"\",\n      this.imageUrl ? \"image\" : \"\",\n    ].join(\" \");\n\n    const classDescription = [\n      \"hy-link-box__text-container__description\",\n      `hy-link-box__text-container__description__${this.variant}`,\n      `hy-link-box__text-container__description__${this.headerstyle}`,\n    ].join(\" \");\n\n    const target = this.isExternal ? \"_blank\" : \"_self\";\n\n    const aspectRatioWidth = 16;\n    const aspectRatioHeight = 10;\n    const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;\n    const aspectRatio = {\n      \"--aspectRatio\": `${aspect}%` as \"aspectRatio\",\n    };\n\n    return [\n      <article class={classContainerAttributes}>\n        <div class={classAttributes}>\n          {this.imageUrl &&\n            (this._sourceSet ? (\n              <figure class=\"hy-link-box__image-container\" style={aspectRatio}>\n                <picture>\n                  {this._sourceSet.map((item) => (\n                    <source\n                      srcSet={item.src}\n                      media={item.media}\n                      type={item.type}\n                      sizes={item.sizes ? item.sizes : \"\"}\n                    />\n                  ))}\n                  <img\n                    loading={this.disableLazy ? \"eager\" : \"lazy\"}\n                    aria-hidden=\"true\"\n                    src={this.imageUrl}\n                    alt={this.imageAlt}\n                  />\n                </picture>\n              </figure>\n            ) : (\n              <figure class=\"hy-link-box__image-container\" style={aspectRatio}>\n                <img\n                  loading={this.disableLazy ? \"eager\" : \"lazy\"}\n                  aria-hidden=\"true\"\n                  src={this.imageUrl}\n                  alt={this.imageAlt}\n                />\n              </figure>\n            ))}\n          {!this.imageUrl && this.showLogo && (\n            <div aria-hidden=\"true\" class=\"hy-link-box__image-container is-image-missing\">\n              <hy-icon class={{\"hy-site-logo__icon\": true}} icon={\"hy-icon-hy-logo\"} />\n            </div>\n          )}\n          <div class={classTextContainer}>\n            <h3 class={classTitle}>{this.textTitle}</h3>\n            {this.textDescription && (\n              <p class={classDescription}>\n                {this.textDescription.length >= 141 ? this.textDescription.slice(0, 140) + \"...\" : this.textDescription}\n              </p>\n            )}\n          </div>\n        </div>\n        <a\n          aria-label={this.scLabel || `${this.readMoreLabel} - ${this.textTitle}`}\n          title={this.scLabel || `${this.readMoreLabel} - ${this.textTitle}`}\n          href={this.url}\n          target={target}\n          class={`hy-cta-link hy-cta-link--default`}\n        >\n          <span aria-hidden=\"true\"></span>\n          <span>{this.readMoreLabel}</span>\n          <span class={`hy-cta-link__icon ${this.isExternal ? \"hy-cta-link__icon--external\" : \"\"}`}>\n            <hy-icon icon={\"hy-icon-arrow-to-right\"} size={24} />\n          </span>\n        </a>\n      </article>,\n    ];\n  }\n}\n",":host {\n  display: block;\n}\n\n.hy-link-box-list {\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  display: grid;\n  gap: 32px 0;\n\n  @media screen and (min-width: 768px) {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 32px 24px;\n  }\n\n  @media screen and (min-width: 1024px) {\n    grid-template-columns: repeat(3, 1fr);\n  }\n\n  @media screen and (min-width: 1920px) {\n    gap: 32px;\n  }\n}\n","export interface LinkBox {\n  heading: string;\n  description: string;\n  imageSets: string | null;\n  imageUrl: string;\n  imageAlt: string;\n  boxUrl: string;\n  isExternal: boolean;\n  showLogo: boolean;\n  ariaLabel: string;\n}\n\nimport {Component, ComponentInterface, Prop, h, Host, Element} from \"@stencil/core\";\nimport {LinkBoxVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n  tag: \"hy-link-box-list\",\n  styleUrl: \"link-box-list.scss\",\n  shadow: false,\n})\nexport class LinkBoxList implements ComponentInterface {\n  @Element() el: HTMLElement;\n  @Prop() headerstyle: string = \"common\";\n  @Prop() variant: LinkBoxVariants = LinkBoxVariants.default;\n  @Prop() readMoreLabel: string;\n\n  private _dataItems: LinkBox[];\n  @Prop() dataItems: LinkBox[] | 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    const classAttributes = [\n      \"hy-link-box-list\",\n      this.variant,\n      `hy-link-box-list__${this.variant}`,\n      `hy-link-box-list__${this.headerstyle}`,\n    ].join(\" \");\n\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 classItemAttributes = [this.variant, `hy-link-box__${this.variant}`].join(\" \");\n    return (\n      <Host>\n        <ul class={classAttributes}>\n          {this._dataItems.map((x) => {\n            return (\n              <li>\n                <hy-link-box\n                  class={classItemAttributes}\n                  variant={this.variant}\n                  source-set={x.imageSets}\n                  image-url={x.imageUrl}\n                  image-alt={x.imageAlt}\n                  text-title={x.heading}\n                  text-description={x.description}\n                  show-logo={x.showLogo}\n                  url={x.boxUrl}\n                  is-external={x.isExternal}\n                  sc-label={x.ariaLabel}\n                  read-more-label={this.readMoreLabel}\n                />\n              </li>\n            );\n          })}\n        </ul>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/huds-lib/hy-link-list.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as t,g as e}from"./index-f84f2a7d.js";import{h as l}from"./utils-7438924c.js";import{j as n}from"./globalScript-5a4b7abf.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-link-list{margin-bottom:32px}.hy-link-list__links{display:grid;gap:16px;list-style:none;margin:0;padding:0}@media (min-width: 30rem){.hy-link-list__links--grid{gap:16px 24px;grid-template-columns:repeat(2, 1fr)}}@media (min-width: 60rem){.without-sidebar .hy-link-list__links--grid.col-3{gap:16px 24px;grid-template-columns:repeat(3, 1fr)}}@media (min-width: 75.0625rem){.without-sidebar .hy-link-list__links--grid.col-3{gap:16px 32px}}@media (min-width: 60rem){.without-sidebar .hy-link-list__links--grid.col-4{gap:16px 24px;grid-template-columns:repeat(4, 1fr)}}@media (min-width: 75.0625rem){.without-sidebar .hy-link-list__links--grid.col-4{gap:16px 32px}}@media (min-width: 75.0625rem){.with-sidebar .hy-link-list__links--grid.col-3{gap:16px 24px;grid-template-columns:repeat(3, 1fr)}}@media (min-width: 1601px){.with-sidebar .hy-link-list__links--grid.col-3{gap:16px 32px}}@media (min-width: 75.0625rem){.with-sidebar .hy-link-list__links--grid.col-4{gap:16px 24px;grid-template-columns:repeat(4, 1fr)}}@media (min-width: 1601px){.with-sidebar .hy-link-list__links--grid.col-4{gap:16px 32px}}.hy-link-list__title{font-weight:700;font-family:var(--main-font-family);margin:0 0 32px;color:var(--brand-main-nearly-black)}.is-content-page h2.hy-link-list__title{font-size:1.625rem;line-height:32px;letter-spacing:-0.82px}@media (min-width: 30rem){.is-content-page h2.hy-link-list__title{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 75.0625rem){.without-sidebar .is-content-page h2.hy-link-list__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 1601px){.with-sidebar .is-content-page h2.hy-link-list__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}.is-front-page h2.hy-link-list__title,.is-landing-page h2.hy-link-list__title{font-size:1.75rem;line-height:32px;letter-spacing:-0.7px;text-transform:uppercase}@media (min-width: 30rem){.is-front-page h2.hy-link-list__title,.is-landing-page h2.hy-link-list__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px}}@media (min-width: 75.0625rem){.without-sidebar .is-front-page h2.hy-link-list__title,.without-sidebar .is-landing-page h2.hy-link-list__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}@media (min-width: 1601px){.with-sidebar .is-front-page h2.hy-link-list__title,.with-sidebar .is-landing-page h2.hy-link-list__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px}}.hy-two-columns h2.hy-link-list__title{font-size:1.125rem;line-height:22px;letter-spacing:-0.45px;margin-bottom:16px;text-transform:none}@media (min-width: 75.0625rem){.without-sidebar .hy-two-columns h2.hy-link-list__title{font-size:1.25rem;line-height:24px;letter-spacing:-0.5px}}@media (min-width: 1601px){.with-sidebar .hy-two-columns h2.hy-link-list__title{font-size:1.25rem;line-height:24px;letter-spacing:-0.5px}}.is-content-page h3.hy-link-list__title{font-size:1.3125rem;line-height:28px;letter-spacing:-0.42px}@media (min-width: 30rem){.is-content-page h3.hy-link-list__title{font-size:1.5625rem;line-height:32px;letter-spacing:-0.5px}}.is-front-page h3.hy-link-list__title,.is-landing-page h3.hy-link-list__title{font-size:1.625rem;line-height:32px;letter-spacing:-0.52px}@media (min-width: 30rem){.is-front-page h3.hy-link-list__title,.is-landing-page h3.hy-link-list__title{font-size:1.875rem;line-height:36px;letter-spacing:-0.6px}}@media (min-width: 75.0625rem){.without-sidebar .is-front-page h3.hy-link-list__title,.without-sidebar .is-landing-page h3.hy-link-list__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}@media (min-width: 1601px){.with-sidebar .is-front-page h3.hy-link-list__title,.with-sidebar .is-landing-page h3.hy-link-list__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.68px}}.hy-two-columns h3.hy-link-list__title{font-size:1.125rem;line-height:22px;letter-spacing:-0.45px;margin-bottom:16px;text-transform:none}@media (min-width: 75.0625rem){.without-sidebar .hy-two-columns h3.hy-link-list__title{font-size:1.25rem;line-height:24px;letter-spacing:-0.5px}}@media (min-width: 1601px){.with-sidebar .hy-two-columns h3.hy-link-list__title{font-size:1.25rem;line-height:24px;letter-spacing:-0.5px}}";const s=class{constructor(t){i(this,t);this.headerstyle="default";this.dataItems=undefined;this.listHeading="";this.variation=undefined;this.headingVariant="h2"}async componentWillLoad(){this._dataItems=await n(this.dataItems)}componentDidLoad(){let i=this.el.closest(".hy-main");if(i){if(!i.classList.contains("with-sidebar")){this.headerstyle="large"}}}render(){const i=l.linkList;const e=this.headingVariant.toLowerCase();let n="col-3";if(this._dataItems.length===7||this._dataItems.length%4===0){n="col-4"}return[t("section",{class:`hy-link-list hy-link-list__${this.headerstyle}`},this.listHeading.length>0&&t(e,{class:"hy-link-list__title"},this.listHeading),t("ul",{class:`hy-link-list__links hy-link-list__links--${this.variation} ${this.variation==="grid"?n:""}`},this._dataItems.map((({heading:e,ariaLabel:l,url:n,isExternal:a})=>t("li",{class:"hy-link-list__links-item"},t("hy-cta-link",{variant:i,"link-content":e,"sc-label":l,url:n,"is-external":a}))))))]}get el(){return e(this)}};s.style=a;export{s as hy_link_list};
+//# sourceMappingURL=hy-link-list.entry.js.map

package/dist/huds-lib/hy-link-list.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyLinkListCss","HyLinkList","async","this","_dataItems","jsonParserWorker","dataItems","componentDidLoad","hyMainDiv","el","closest","classList","contains","headerstyle","render","linkVariant","CtaLinkVariants","linkList","HeadingVariant","headingVariant","toLowerCase","columnType","length","h","class","listHeading","variation","map","heading","ariaLabel","url","isExternal","variant"],"sources":["./src/components/hy-link-list/hy-link-list.scss?tag=hy-link-list","./src/components/hy-link-list/hy-link-list.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-link-list {\n  margin-bottom: 32px;\n}\n\n.hy-link-list__links {\n  display: grid;\n  gap: 16px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  &--grid {\n    @include breakpoint($narrow) {\n      gap: 16px 24px;\n      grid-template-columns: repeat(2, 1fr);\n    }\n\n    .without-sidebar & {\n      &.col-3 {\n        @include breakpoint($wide) {\n          gap: 16px 24px;\n          grid-template-columns: repeat(3, 1fr);\n        }\n\n        @include breakpoint($extrawide) {\n          gap: 16px 32px;\n        }\n      }\n\n      &.col-4 {\n        @include breakpoint($wide) {\n          gap: 16px 24px;\n          grid-template-columns: repeat(4, 1fr);\n        }\n\n        @include breakpoint($extrawide) {\n          gap: 16px 32px;\n        }\n      }\n    }\n\n    .with-sidebar & {\n      &.col-3 {\n        @include breakpoint($extrawide) {\n          gap: 16px 24px;\n          grid-template-columns: repeat(3, 1fr);\n        }\n\n        @include breakpoint($xlarge) {\n          gap: 16px 32px;\n        }\n      }\n\n      &.col-4 {\n        @include breakpoint($extrawide) {\n          gap: 16px 24px;\n          grid-template-columns: repeat(4, 1fr);\n        }\n\n        @include breakpoint($xlarge) {\n          gap: 16px 32px;\n        }\n      }\n    }\n  }\n}\n\n.hy-link-list__title {\n  font-weight: $bold;\n  font-family: var(--main-font-family);\n  margin: 0 0 32px;\n  color: var(--brand-main-nearly-black);\n}\n\nh2.hy-link-list__title {\n  .is-content-page & {\n    @include font-size(26px, 32px);\n    letter-spacing: -0.82px;\n\n    @include breakpoint($narrow) {\n      @include font-size(30px, 36px);\n      letter-spacing: -0.6px;\n    }\n\n    .without-sidebar & {\n      @include breakpoint($extrawide) {\n        @include font-size(34px, 40px);\n        letter-spacing: -0.68px;\n      }\n    }\n\n    .with-sidebar & {\n      @include breakpoint($xlarge) {\n        @include font-size(34px, 40px);\n        letter-spacing: -0.68px;\n      }\n    }\n  }\n\n  .is-front-page &,\n  .is-landing-page & {\n    @include font-size(28px, 32px);\n    letter-spacing: -0.7px;\n    text-transform: uppercase;\n\n    @include breakpoint($narrow) {\n      @include font-size(34px, 40px);\n      letter-spacing: -0.85px;\n    }\n\n    .without-sidebar & {\n      @include breakpoint($extrawide) {\n        @include font-size(42px, 48px);\n        letter-spacing: -1.05px;\n      }\n    }\n\n    .with-sidebar & {\n      @include breakpoint($xlarge) {\n        @include font-size(42px, 48px);\n        letter-spacing: -1.05px;\n      }\n    }\n  }\n\n  .hy-two-columns & {\n    @include font-size(18px, 22px);\n    letter-spacing: -0.45px;\n    margin-bottom: 16px;\n    text-transform: none;\n\n    .without-sidebar & {\n      @include breakpoint($extrawide) {\n        @include font-size(20px, 24px);\n        letter-spacing: -0.5px;\n      }\n    }\n\n    .with-sidebar & {\n      @include breakpoint($xlarge) {\n        @include font-size(20px, 24px);\n        letter-spacing: -0.5px;\n      }\n    }\n  }\n}\n\nh3.hy-link-list__title {\n  .is-content-page & {\n    @include font-size(21px, 28px);\n    letter-spacing: -0.42px;\n\n    @include breakpoint($narrow) {\n      @include font-size(25px, 32px);\n      letter-spacing: -0.5px;\n    }\n  }\n\n  .is-front-page &,\n  .is-landing-page & {\n    @include font-size(26px, 32px);\n    letter-spacing: -0.52px;\n\n    @include breakpoint($narrow) {\n      @include font-size(30px, 36px);\n      letter-spacing: -0.6px;\n    }\n\n    .without-sidebar & {\n      @include breakpoint($extrawide) {\n        @include font-size(34px, 40px);\n        letter-spacing: -0.68px;\n      }\n    }\n\n    .with-sidebar & {\n      @include breakpoint($xlarge) {\n        @include font-size(34px, 40px);\n        letter-spacing: -0.68px;\n      }\n    }\n  }\n\n  .hy-two-columns & {\n    @include font-size(18px, 22px);\n    letter-spacing: -0.45px;\n    margin-bottom: 16px;\n    text-transform: none;\n\n    .without-sidebar & {\n      @include breakpoint($extrawide) {\n        @include font-size(20px, 24px);\n        letter-spacing: -0.5px;\n      }\n    }\n\n    .with-sidebar & {\n      @include breakpoint($xlarge) {\n        @include font-size(20px, 24px);\n        letter-spacing: -0.5px;\n      }\n    }\n  }\n}\n","export interface CtaLinkValue {\n  heading: string;\n  variation: string;\n  ariaLabel: string;\n  url: string;\n  isExternal: boolean;\n}\n\nimport {Component, ComponentInterface, Element, h, Prop} from \"@stencil/core\";\nimport {CtaLinkVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n  tag: \"hy-link-list\",\n  styleUrl: \"hy-link-list.scss\",\n  shadow: false,\n})\nexport class HyLinkList implements ComponentInterface {\n  @Element() el: HTMLElement;\n  @Prop() headerstyle: string = \"default\";\n  private _dataItems: CtaLinkValue[];\n  @Prop() dataItems: CtaLinkValue[] | string;\n  @Prop() listHeading: string = \"\";\n  @Prop() variation: string;\n  @Prop() headingVariant: string = \"h2\";\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    const linkVariant = CtaLinkVariants.linkList;\n    const HeadingVariant = this.headingVariant.toLowerCase();\n    let columnType = \"col-3\";\n\n    if (this._dataItems.length === 7 || this._dataItems.length % 4 === 0) {\n      columnType = \"col-4\";\n    }\n\n    return [\n      <section class={`hy-link-list hy-link-list__${this.headerstyle}`}>\n        {this.listHeading.length > 0 && (\n          <HeadingVariant class={\"hy-link-list__title\"}>{this.listHeading}</HeadingVariant>\n        )}\n        <ul\n          class={`hy-link-list__links hy-link-list__links--${this.variation} ${\n            this.variation === \"grid\" ? columnType : \"\"\n          }`}\n        >\n          {this._dataItems.map(({heading, ariaLabel, url, isExternal}) => (\n            <li class=\"hy-link-list__links-item\">\n              <hy-cta-link\n                variant={linkVariant}\n                link-content={heading}\n                sc-label={ariaLabel}\n                url={url}\n                is-external={isExternal}\n              />\n            </li>\n          ))}\n        </ul>\n      </section>,\n    ];\n  }\n}\n"],"mappings":"6IAAA,MAAMA,EAAgB,qzK,MCiBTC,EAAU,M,0CAES,U,0CAGA,G,6CAEG,I,CAEjCC,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,SACE,MAAMC,EAAcC,EAAgBC,SACpC,MAAMC,EAAiBf,KAAKgB,eAAeC,cAC3C,IAAIC,EAAa,QAEjB,GAAIlB,KAAKC,WAAWkB,SAAW,GAAKnB,KAAKC,WAAWkB,OAAS,IAAM,EAAG,CACpED,EAAa,O,CAGf,MAAO,CACLE,EAAA,WAASC,MAAO,8BAA8BrB,KAAKU,eAChDV,KAAKsB,YAAYH,OAAS,GACzBC,EAACL,EAAc,CAACM,MAAO,uBAAwBrB,KAAKsB,aAEtDF,EAAA,MACEC,MAAO,4CAA4CrB,KAAKuB,aACtDvB,KAAKuB,YAAc,OAASL,EAAa,MAG1ClB,KAAKC,WAAWuB,KAAI,EAAEC,UAASC,YAAWC,MAAKC,gBAC9CR,EAAA,MAAIC,MAAM,4BACRD,EAAA,eACES,QAASjB,EAAW,eACNa,EAAO,WACXC,EACVC,IAAKA,EAAG,cACKC,S"}

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

@@ -0,0 +1,2 @@
+import{r as a,h as i,H as e}from"./index-f84f2a7d.js";import{i as r}from"./utils-7438924c.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-link{color:var(--brand-main);font-family:var(--main-font-family);font-weight:600;font-size:14px;letter-spacing:-0.47px;margin:theme("spacing.8");line-height:16px;text-decoration:none}.hy-link.within-paragraph{color:var(--brand-main);font-family:var(--main-font-family);font-weight:400;font-size:14px;line-height:20px;text-decoration:underline}';const n=class{constructor(i){a(this,i);this.variant=r.default;this.linkContent="";this.url=undefined;this.scLabel=undefined;this.isExternal=false}render(){const a=["hy-link",this.variant];const r=this.isExternal?"_blank":"_self";return i(e,null,i("a",{"aria-label":this.scLabel,class:a.join(" "),href:this.url,target:r},this.linkContent))}};n.style=t;export{n as hy_link};
+//# sourceMappingURL=hy-link.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["linkCss","Link","LinkVariants","default","render","classAttributes","this","variant","target","isExternal","h","Host","scLabel","class","join","href","url","linkContent"],"sources":["./src/components/hy-link/link.scss?tag=hy-link","./src/components/hy-link/link.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-link {\n  color: var(--brand-main);\n  font-family: var(--main-font-family);\n  font-weight: 600;\n  font-size: 14px;\n  letter-spacing: -0.47px;\n  margin: theme(\"spacing.8\");\n  line-height: 16px;\n  text-decoration: none;\n\n  &.within-paragraph {\n    color: var(--brand-main);\n    font-family: var(--main-font-family);\n    font-weight: 400;\n    font-size: 14px;\n    line-height: 20px;\n    text-decoration: underline;\n  }\n}\n","import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {LinkVariants} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-link\",\n  styleUrl: \"link.scss\",\n  shadow: false,\n})\nexport class Link {\n  @Prop() variant: LinkVariants = LinkVariants.default;\n  @Prop() linkContent: string = \"\";\n  @Prop() url?: string;\n  @Prop() scLabel?: string;\n  @Prop() isExternal: boolean = false;\n\n  render() {\n    const classAttributes = [\"hy-link\", this.variant];\n    const target = this.isExternal ? \"_blank\" : \"_self\";\n\n    return (\n      <Host>\n        <a aria-label={this.scLabel} class={classAttributes.join(\" \")} href={this.url} target={target}>\n          {this.linkContent}\n        </a>\n      </Host>\n    );\n  }\n}\n"],"mappings":"8FAAA,MAAMA,EAAU,ihD,MCQHC,EAAI,M,sCACiBC,EAAaC,Q,iBACf,G,0DAGA,K,CAE9BC,SACE,MAAMC,EAAkB,CAAC,UAAWC,KAAKC,SACzC,MAAMC,EAASF,KAAKG,WAAa,SAAW,QAE5C,OACEC,EAACC,EAAI,KACHD,EAAA,kBAAeJ,KAAKM,QAASC,MAAOR,EAAgBS,KAAK,KAAMC,KAAMT,KAAKU,IAAKR,OAAQA,GACpFF,KAAKW,a"}

package/dist/huds-lib/hy-list-item.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as e,g as t}from"./index-f84f2a7d.js";import{L 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}:host{display:block}.hy-list-item{display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--main-font-family);text-decoration:none}.hy-list-item__default{margin-bottom:28px}@media (min-width: 60rem){.hy-list-item__default{margin-bottom:32px}}.hy-list-item__default__info-container__header{font-size:0.75rem;line-height:14px;color:var(--grayscale-dark);letter-spacing:0;margin-bottom:4px}@media (min-width: 30rem){.hy-list-item__default__info-container__header{font-size:0.875rem;line-height:18px;margin-bottom:2px}}.hy-list-item__default__info-container__title{font-size:1.125rem;line-height:22px;font-weight:700;color:var(--brand-main-light);letter-spacing:-0.56px;margin-bottom:6px}@media (min-width: 30rem){.hy-list-item__default__info-container__title{font-size:1.375rem;line-height:28px;letter-spacing:-0.69px;margin-bottom:10px}}@media (min-width: 1601px){.hy-list-item__default__info-container__title{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;margin-bottom:8px}}@media (min-width: 75.0625rem){.hy-list-item__default__info-container__title__large{font-size:1.625rem;line-height:32px;letter-spacing:-0.8px;margin-bottom:8px}}.hy-list-item__default__info-container__link-container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:6px}@media (min-width: 30rem){.hy-list-item__default__info-container__link-container{margin-bottom:8px}}.hy-list-item__default__info-container__link{font-size:0.75rem;line-height:16px;color:var(--grayscale-dark);letter-spacing:-0.07px;margin-left:4px}@media (min-width: 30rem){.hy-list-item__default__info-container__link{margin-left:5px}}.hy-list-item__default__info-container__link__icon svg{fill:var(--grayscale-dark)}.hy-list-item__default__info-container__description{font-size:0.875rem;line-height:20px;color:var(--grayscale-black);letter-spacing:0}@media (min-width: 30rem){.hy-list-item__default__info-container__description{font-size:1rem;line-height:24px}}.hy-list-item__position{background:radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width: 30rem){.hy-list-item__position{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-list-item__position__info-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin:0;padding:12px;position:relative}@media (min-width: 60rem){.hy-list-item__position__info-container{padding:12px 16px}}@media (min-width: 1601px){.hy-list-item__position__info-container{padding:20px 24px}}.hy-list-item__position__info-container__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;color:var(--brand-main);font-family:var(--main-font-family);font-size:14px;font-weight:600;letter-spacing:-0.2px;line-height:14px;margin-bottom:14px}.hy-list-item__position__info-container__header .icon{margin-right:0.75rem}.hy-list-item__position__info-container__header .icon svg{fill:var(--brand-main)}@media (min-width: 75.0625rem){.hy-list-item__position__info-container__large{padding:20px 24px}}.hy-list-item__position__info-container__data{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.hy-list-item__position__info-container__title{font-size:1.125rem;line-height:20px;font-weight:700;font-family:var(--main-font-family);color:var(--grayscale-black);margin-bottom:12px;letter-spacing:-0.45px;line-height:22px}@media (min-width: 30rem){.hy-list-item__position__info-container__title{letter-spacing:-0.5px}}.hy-list-item__position__info-container__description{font-size:0.875rem;color:var(--grayscale-dark-text);display:none;font-family:var(--main-font-family);letter-spacing:0.8px;margin-bottom:14px;line-height:20px}@media (min-width: 30rem){.hy-list-item__position__info-container__description{display:block}}.hy-list-item__position__info-container__outgoing-link{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;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:start;-ms-flex-pack:start;justify-content:flex-start;position:relative;padding:0 24px 24px 12px}@media (min-width: 30rem){.hy-list-item__position__info-container__outgoing-link{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0 24px 24px 0}}.hy-list-item__position__info-container__outgoing-link .label{color:var(--link-blue);font-family:var(--main-font-family);font-size:16px;font-weight:600;letter-spacing:-0.3px;line-height:20px}.hy-list-item__position__info-container__outgoing-link .icon{margin-right:4px;margin-bottom:2px}.hy-list-item__position__info-container__outgoing-link .icon svg{fill:var(--link-blue)}.hy-list-item__degree{background:radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width: 30rem){.hy-list-item__degree{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.hy-list-item__degree__image-container{display:block;position:relative;-webkit-box-flex:1;-ms-flex:1;flex:1}@media (min-width: 30rem){.hy-list-item__degree__image-container{-webkit-box-flex:0;-ms-flex:0 0 24%;flex:0 0 24%}}.hy-list-item__degree__image-container__image{vertical-align:bottom;max-width:100%;height:100%}.hy-list-item__degree__image-container__image img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.hy-list-item__degree__image-container span{font-weight:600;font-size:0.75rem;line-height:14px;background-color:var(--additional-yellow);-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.05);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.05);color:var(--grayscale-black);left:-4px;letter-spacing:-0.07px;padding:5px 8px;position:absolute;top:16px;text-transform:uppercase}@media (min-width: 30rem){.hy-list-item__degree__image-container span{left:-8px}}@media (min-width: 60rem){.hy-list-item__degree__image-container span{top:22px}}.hy-list-item__degree__info-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin:0;padding:12px;position:relative}@media (min-width: 60rem){.hy-list-item__degree__info-container{padding:12px 16px}}@media (min-width: 1601px){.hy-list-item__degree__info-container{padding:20px 24px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__large{padding:20px 24px}}.hy-list-item__degree__info-container__data{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.hy-list-item__degree__info-container__title{font-size:1.125rem;line-height:22px;font-weight:700;color:var(--link-blue);letter-spacing:-0.54px;margin-bottom:8px}@media (min-width: 60rem){.hy-list-item__degree__info-container__title{font-size:1.125rem;line-height:24px;letter-spacing:-0.5px}}@media (min-width: 1601px){.hy-list-item__degree__info-container__title{font-size:1.25rem;line-height:26px;letter-spacing:-0.6px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__title__large{font-size:1.25rem;line-height:26px;letter-spacing:-0.6px}}.hy-list-item__degree__info-container__description{font-size:0.875rem;line-height:18px;color:var(--grayscale-dark);letter-spacing:0;margin-bottom:16px}@media (min-width: 60rem){.hy-list-item__degree__info-container__description{letter-spacing:-0.2}}@media (min-width: 1601px){.hy-list-item__degree__info-container__description{font-size:1rem;line-height:20px;letter-spacing:-0.25px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__description__large{font-size:1rem;line-height:20px;letter-spacing:-0.25px}}.hy-list-item__degree__info-container__metadata-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top:16px;width:100%}@media (min-width: 30rem){.hy-list-item__degree__info-container__metadata-wrapper{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}}.hy-list-item__degree__info-container__metadata-wrapper.link-only{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.hy-list-item__degree__info-container__additional-info{width:100%}.hy-list-item__degree__info-container__additional-info__item{font-size:0.75rem;line-height:16px;font-weight:300;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--grayscale-black);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;letter-spacing:-0.2px}@media (min-width: 1601px){.hy-list-item__degree__info-container__additional-info__item{font-size:0.875rem;line-height:16px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__additional-info__item__large{font-size:0.875rem;line-height:16px}}.hy-list-item__degree__info-container__additional-info__item.active::before{content:" ";-webkit-box-sizing:border-box;box-sizing:border-box;height:14px;width:14px;border:3px solid #ffffff;border-radius:50%;background-color:#f9a21a;left:-7px;position:absolute}@media (min-width: 30rem){.hy-list-item__degree__info-container__additional-info__item.active::before{border:none;height:8px;margin-right:6px;width:8px;left:0;position:relative}}.hy-list-item__degree__info-container__outgoing-link{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:end;-ms-flex-pack:end;justify-content:flex-end;position:relative;width:100%}.hy-list-item__degree__info-container__outgoing-link a{-webkit-box-align:center;-ms-flex-align:center;align-items:center;bottom:0;top:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;position:relative;right:-18px;text-decoration:none}@media (min-width: 60rem){.hy-list-item__degree__info-container__outgoing-link a{right:-22px}}@media (min-width: 1601px){.hy-list-item__degree__info-container__outgoing-link a{right:-30px}}.hy-list-item__degree__info-container__outgoing-link a .label{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--link-blue);letter-spacing:-0.5px;margin-right:8px;text-align:right}.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper{background-color:var(--brand-main-light);z-index:10}.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper .icon{position:relative;overflow:hidden}.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper .icon svg{background-color:transparent;-webkit-box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);box-shadow:0 2px 8px 0 rgba(0, 0, 0, 0.1);fill:var(--grayscale-white);padding:6.4px}@media (min-width: 1601px){.hy-list-item__degree__info-container__outgoing-link a .icon-wrapper .icon svg{height:36px;width:36px;padding:7.2px}}@media (min-width: 75.0625rem){.hy-list-item__degree__info-container__outgoing-link__large svg{height:36px;width:36px;padding:7.2px}}.hy-list-item-wrapper{font-family:var(--main-font-family)}.hy-list-item-wrapper__degree{margin-bottom:16px}@media (min-width: 30rem){.hy-list-item-wrapper__degree{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;margin-bottom:24px}}@media (min-width: 60rem){.hy-list-item-wrapper__degree{margin-bottom:28px}}@media (min-width: 1601px){.hy-list-item-wrapper__degree{margin-bottom:32px}}@media (min-width: 75.0625rem){.hy-list-item-wrapper__degree__large{margin-bottom:32px}}.hy-list-item-wrapper__degree__related-info{background:radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);margin-top:4px;padding:0 12px 0 16px}@media (min-width: 30rem){.hy-list-item-wrapper__degree__related-info{padding:0 24px 0 16px}}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info{margin-top:6px;padding:0 24px 0 24px}}@media (min-width: 1601px){.hy-list-item-wrapper__degree__related-info{margin-top:8px}}@media (min-width: 75.0625rem){.hy-list-item-wrapper__degree__related-info__large{margin-top:8px}}.hy-list-item-wrapper__degree__related-info__heading__link{text-decoration:none}.hy-list-item-wrapper__degree__related-info__heading__button{font-size:0.75rem;line-height:16px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);border:none;color:var(--grayscale-black);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);letter-spacing:-0.2px;height:100%;padding:8px 0;text-align:left;width:100%}@media (min-width: 30rem){.hy-list-item-wrapper__degree__related-info__heading__button{font-size:0.75rem;line-height:20px;padding:14px 0}}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__heading__button{font-size:0.875rem;line-height:20px;letter-spacing:-0.4px;padding:18px 0}}.hy-list-item-wrapper__degree__related-info__heading__button:hover{cursor:pointer}.hy-list-item-wrapper__degree__related-info__heading__button__is-open svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.hy-list-item-wrapper__degree__related-info__heading__icon{margin-right:0.5rem;z-index:0}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__heading__icon{margin-right:12px}}.hy-list-item-wrapper__degree__related-info__heading__icon svg{fill:var(--brand-main);height:14px;width:14px}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__heading__icon svg{height:18px;width:18px}}.hy-list-item-wrapper__degree__related-info__content{display:none}.hy-list-item-wrapper__degree__related-info__content__is-open{border-top:1px solid #d2d2d2;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:20px 8px 5px 8px}@media (min-width: 60rem){.hy-list-item-wrapper__degree__related-info__content__is-open{padding:20px 0 14px 0}}.hy-list-item-wrapper__degree__related-info__link{font-size:0.875rem;line-height:16px;font-weight:700;color:var(--link-blue);letter-spacing:-0.4px;margin-bottom:16px;text-decoration:none}';let a={enter:"Enter",space:"Space"};const r=class{constructor(e){i(this,e);this.isExpandedRelatedContent=false;this.variant=n.default;this.itemType=undefined;this.itemTitle=undefined;this.itemDescription=undefined;this.url=undefined;this.isExternal=false;this.scLabel=undefined;this.itemImageUrl=undefined;this.itemImageAlt=undefined;this.disableLazy=false;this.relatedLinksBlockTitle=undefined;this.relatedLinks=undefined;this.imageLabel=undefined;this.outGoingUrlLabel="Go to programme page";this.additionalInfo=undefined;this.headerstyle="common";this.sourceSet=undefined;this.truncateDescription=false;this.truncateLimit=140;this._imageMinHeight=0;this._imageMinWidth=0}relatedLinksWatcher(i){if(typeof i==="string"){this._relatedLinks=JSON.parse(i)}else{this._relatedLinks=i}}additionalInfoWatcher(i){if(typeof i==="string"){this._additionalInfo=JSON.parse(i)}else{this._additionalInfo=i}}srcSetWatcher(i){this._sourceSet=typeof i==="string"?JSON.parse(i):i}expandRelatedInfoPanel(i){let e=`hy-list-item-wrapper__${this.variant}__related-info__content`;let t="hy-list-item-wrapper__degree__related-info__heading__button";let n=document.querySelectorAll(`[aria-labelledBy="${i.id}"]`)[0];if(n){if(!this.isExpandedRelatedContent){n.classList.add(`${e}__is-open`);i.classList.add(`${t}__is-open`)}else{n.classList.remove(`${e}__is-open`);i.classList.remove(`${t}__is-open`)}this.isExpandedRelatedContent=!this.isExpandedRelatedContent}}handleKeyDown(i){const e=i.code;let t=i.target;const n=t.tagName.toLowerCase();const o=[n].some((i=>["svg","path","button","a"].indexOf(i)>=0));if(t&&o&&!t.classList.contains("hy-list-item-wrapper__degree__related-info__link")&&[a.enter,a.space].includes(e)){if(n!=="button"){t=t.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`)}this.expandRelatedInfoPanel(t);i.preventDefault()}}handleClick(i){let e=i.target;const t=e.tagName.toLowerCase();const n=[t].some((i=>["svg","path","button","a"].indexOf(i)>=0));if(e&&n&&!e.classList.contains("hy-list-item-wrapper__degree__related-info__link")){if(t!=="button"){e=e.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`)}this.expandRelatedInfoPanel(e);i.preventDefault();i.stopImmediatePropagation()}}componentWillLoad(){this.relatedLinksWatcher(this.relatedLinks);this.additionalInfoWatcher(this.additionalInfo);this.srcSetWatcher(this.sourceSet)}componentDidLoad(){let i=this.el.closest(".hy-main");if(i){if(!i.classList.contains("with-sidebar")){this.headerstyle="large"}}if(this.variant==n.degreeProgramme){const i=document.querySelector(".hy-list-item__degree__image-container__image img");if(i){i.addEventListener("load",(function(){const e=1;const t=i.naturalHeight;const n=i.naturalWidth;const o=n/t;this._imageMinWidth=n;this._imageMinHeight=t;if(o>e){this._imageMinWidth=t*e}else if(o<e){this._imageMinHeight=n/e}}))}}}render(){const i=["hy-list-item-wrapper",`hy-list-item-wrapper__${this.variant}`,`hy-list-item-wrapper__${this.variant}__${this.headerstyle}`].join(" ");const t=["hy-list-item",`hy-list-item__${this.variant}`].join(" ");const o=[`hy-list-item__${this.variant}__info-container`,`hy-list-item__${this.variant}__info-container__${this.headerstyle}`].join(" ");const a=[`hy-list-item__${this.variant}__info-container__header`,`hy-list-item__${this.variant}__info-container__header__${this.headerstyle}`].join(" ");const r=[`hy-list-item__${this.variant}__info-container__title`,`hy-list-item__${this.variant}__info-container__title__${this.headerstyle}`].join(" ");const _=[`hy-list-item__${this.variant}__info-container__description`,`hy-list-item__${this.variant}__info-container__description__${this.headerstyle}`].join(" ");const l=[`hy-list-item__${this.variant}__info-container__link-container`].join(" ");const s=[`hy-list-item__${this.variant}__info-container__link__icon`].join(" ");const d=[`hy-list-item__${this.variant}__info-container__link`].join(" ");const m=this.isExternal?"_blank":"_self";function h(i,e){return i.length>e?i.substr(0,e-1)+"...":i}switch(this.variant){case n.position:{const i=[`hy-list-item__${this.variant}__info-container__outgoing-link`,`hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`].join(" ");return e("article",null,e("a",{class:t,href:this.url,target:m,"aria-label":this.scLabel},e("div",{class:o},e("div",{class:a},e("div",{class:"icon"},e("hy-icon",{icon:"hy-icon-units-and-faculties",size:18})),this.itemType),e("div",{class:r},this.itemTitle),this.itemDescription&&e("div",{class:_,innerHTML:this.truncateDescription?h(this.itemDescription,this.truncateLimit):this.itemDescription})),e("div",{class:i},e("span",{class:"icon"},e("hy-icon",{icon:"hy-icon-done",size:14})),e("span",{class:"label"},this.outGoingUrlLabel))))}case n.degreeProgramme:{const n=[`hy-list-item__${this.variant}__image-container`].join(" ");const a=[`hy-list-item__${this.variant}__image-container__image`].join(" ");const l=[`hy-list-item__${this.variant}__info-container__additional-info`,`hy-list-item__${this.variant}__info-container__additional-info__${this.headerstyle}`].join(" ");const s=this._additionalInfo&&this._additionalInfo.length>0?"":"link-only";const d=[`hy-list-item__${this.variant}__info-container__metadata-wrapper`,s].join(" ");const h=[`hy-list-item__${this.variant}__info-container__content-wrapper`].join(" ");const c=[`hy-list-item__${this.variant}__info-container__outgoing-link`,`hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`].join(" ");const p=[`hy-list-item__${this.variant}__info-container__outgoing-link__link`].join(" ");const f=[`hy-list-item-wrapper__${this.variant}__related-info`,`hy-list-item-wrapper__${this.variant}__related-info__${this.headerstyle}`].join(" ");const g=[`hy-list-item-wrapper__${this.variant}__related-info__heading`].join(" ");const x=[`hy-list-item-wrapper__${this.variant}__related-info__heading__link`].join(" ");const b=[`hy-list-item-wrapper__${this.variant}__related-info__heading__button`].join(" ");const y=[`hy-list-item-wrapper__${this.variant}__related-info__heading__icon`].join(" ");const w=[`hy-list-item-wrapper__${this.variant}__related-info__content`].join(" ");const k=[`hy-list-item-wrapper__${this.variant}__related-info__link`].join(" ");const u=this.relatedLinksBlockTitle&&this.relatedLinksBlockTitle.length>0?`${this.itemTitle}-${this.relatedLinksBlockTitle}`.toLowerCase().replace(/\W/g,"-"):"";const v="#"+u+"--title";const $=this.relatedLinksBlockTitle&&this.relatedLinksBlockTitle.length>0?this._relatedLinks.length:"";return[e("article",{class:i},e("a",{class:t,href:this.url,target:m,"aria-label":this.scLabel},e("div",{class:n},e("div",{class:a},this._sourceSet?e("picture",null,this._sourceSet.map((i=>e("source",{srcSet:i.src,media:i.media,type:i.type,sizes:i.sizes?i.sizes:""}))),e("img",{loading:this.disableLazy?"eager":"lazy","aria-hidden":"true",src:this.itemImageUrl,alt:this.itemImageAlt,style:{"--minheight":`${this._imageMinHeight}px`,"--minwidth":`${this._imageMinWidth}px`}})):e("img",{loading:this.disableLazy?"eager":"lazy","aria-hidden":"true",src:this.itemImageUrl,alt:this.itemImageAlt,style:{"--minheight":`${this._imageMinHeight}px`,"--minwidth":`${this._imageMinWidth}px`}})),this.imageLabel&&e("span",null,this.imageLabel)),e("div",{class:o},e("div",{class:h},e("div",{class:r},this.itemTitle),this.itemDescription&&e("div",{class:_,innerHTML:this.itemDescription})),e("div",{class:d},this._additionalInfo&&e("div",{class:l},this._additionalInfo.map((i=>{let t=[`hy-list-item__${this.variant}__info-container__additional-info__item`,`hy-list-item__${this.variant}__info-container__additional-info__item__${this.headerstyle}`,`${i.isActive.toString()=="true"?"active":""}`].join(" ");return e("div",{class:t},i.text)}))),e("div",{class:c},e("a",{href:this.url,target:m,"aria-label":this.scLabel,class:p,tabindex:"-1"},e("span",{class:"label"},this.outGoingUrlLabel),e("span",{class:"icon-wrapper"},e("div",{class:"icon"},e("hy-icon",{icon:"hy-icon-arrow-to-right",size:32})))))))),this.relatedLinksBlockTitle&&e("div",{class:f},e("div",{class:g},e("a",{href:v,class:x,tabindex:"-1"},e("button",{"aria-expanded":"false","aria-controls":`${u}--content`,class:b,id:`${u}--title`},e("span",{class:y},e("hy-icon",{icon:"hy-icon-caret-down",size:14})),this.relatedLinksBlockTitle," (",$,")"))),e("div",{class:w,"aria-labelledBy":`${u}--title`,id:`${u}--content`,role:"region","aria-hidden":"true"},this._relatedLinks.map((i=>{let t=i.isExternal?"_blank":"_self";return e("a",{class:k,href:i.url,target:m,"aria-label":t},i.label)})))))]}default:{return e("article",null,e("a",{class:t,href:this.url,target:m,"aria-label":this.scLabel},e("div",{class:o},e("div",{class:a},this.itemType),e("div",{class:r},this.itemTitle),e("div",{class:l},e("span",{class:s},e("hy-icon",{icon:"hy-icon-link",size:15})),e("div",{class:d},this.url)),this.itemDescription&&e("div",{class:_,innerHTML:this.itemDescription}))))}}}get el(){return t(this)}static get watchers(){return{relatedLinks:["relatedLinksWatcher"],additionalInfo:["additionalInfoWatcher"],sourceSet:["srcSetWatcher"]}}};r.style=o;export{r as hy_list_item};
+//# sourceMappingURL=hy-list-item.entry.js.map

package/dist/huds-lib/hy-list-item.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyListItemCss","keys","enter","space","HyListItem","ListItemVariants","default","relatedLinksWatcher","newValue","this","_relatedLinks","JSON","parse","additionalInfoWatcher","_additionalInfo","srcSetWatcher","data","_sourceSet","expandRelatedInfoPanel","target","contentSelector","variant","targetButtonClass","contentSection","document","querySelectorAll","id","isExpandedRelatedContent","classList","add","remove","handleKeyDown","event","key","code","targetElement","tagName","toLowerCase","possibleTags","some","r","indexOf","contains","includes","closest","preventDefault","handleClick","stopImmediatePropagation","componentWillLoad","relatedLinks","additionalInfo","sourceSet","componentDidLoad","hyMainDiv","el","headerstyle","degreeProgramme","image","querySelector","addEventListener","outputImageAspectRatio","imageHeight","naturalHeight","imageWidth","naturalWidth","inputImageAspectRatio","_imageMinWidth","_imageMinHeight","render","classWrapperAttributes","join","classAttributes","classInfoContainerAttributes","classInfoContainerHeader","classInfoContainerTitle","classInfoContainerDescription","classInfoContainerLinkContainer","classInfoContainerLinkIcon","classInfoContainerLink","isExternal","truncate","str","n","length","substr","position","classInfoContainerOutgoingLink","h","class","href","url","scLabel","icon","size","itemType","itemTitle","itemDescription","innerHTML","truncateDescription","truncateLimit","outGoingUrlLabel","classImageContainerAttributes","classImageContainerImage","classInfoContainerAdditionalInfoAttributes","withAdditionalInfo","classMetadataWrapper","classContentWrapper","classInfoContainerOutgoingLinkUrl","classRelatedInfoContainer","classRelatedInfoHeading","classRelatedInfoHeadingLink","classRelatedInfoHeadingButton","classRelatedInfoHeadingIcon","classRelatedInfoContent","classRelatedInfoLink","titleAsId","relatedLinksBlockTitle","replace","accordionItemHref","relatedLinksCount","map","item","srcSet","src","media","type","sizes","loading","disableLazy","itemImageUrl","alt","itemImageAlt","style","imageLabel","x","classInfoContainerAdditionalInfoItem","isActive","toString","text","tabindex","role","relatedLinkTarget","label"],"sources":["./src/components/hy-list-item/hy-list-item.scss?tag=hy-list-item","./src/components/hy-list-item/hy-list-item.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-list-item {\n  display: flex;\n  font-family: var(--main-font-family);\n  text-decoration: none;\n\n  &__default {\n    margin-bottom: 28px;\n    @include breakpoint($wide) {\n      margin-bottom: 32px;\n    }\n\n    &__info-container {\n      &__header {\n        @include font-size(12px, 14px);\n        color: var(--grayscale-dark);\n        letter-spacing: 0;\n        margin-bottom: 4px;\n\n        @include breakpoint($narrow) {\n          @include font-size(14px, 18px);\n          margin-bottom: 2px;\n        }\n      }\n\n      &__title {\n        @include font-size(18px, 22px);\n        @include font-weight($bold);\n        color: var(--brand-main-light);\n        letter-spacing: -0.56px;\n        margin-bottom: 6px;\n\n        @include breakpoint($narrow) {\n          @include font-size(22px, 28px);\n          letter-spacing: -0.69px;\n          margin-bottom: 10px;\n        }\n        @include breakpoint($xlarge) {\n          @include font-size(26px, 32px);\n          letter-spacing: -0.8px;\n          margin-bottom: 8px;\n        }\n\n        &__large {\n          // >1200 no sidebar;\n          @include breakpoint($extrawide) {\n            @include font-size(26px, 32px);\n            letter-spacing: -0.8px;\n            margin-bottom: 8px;\n          }\n        }\n      }\n\n      &__link-container {\n        align-items: center;\n        display: flex;\n        margin-bottom: 6px;\n\n        @include breakpoint($narrow) {\n          margin-bottom: 8px;\n        }\n      }\n\n      &__link {\n        @include font-size(12px, 16px);\n        color: var(--grayscale-dark);\n        letter-spacing: -0.07px;\n        margin-left: 4px;\n\n        @include breakpoint($narrow) {\n          margin-left: 5px;\n        }\n\n        &__icon {\n          svg {\n            fill: var(--grayscale-dark);\n          }\n        }\n      }\n\n      &__description {\n        @include font-size(14px, 20px);\n        color: var(--grayscale-black);\n        letter-spacing: 0;\n\n        @include breakpoint($narrow) {\n          @include font-size(16px, 24px);\n        }\n      }\n    }\n  }\n\n  // Opem position\n  &__position {\n    background: radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);\n    flex-direction: column;\n    @include breakpoint($narrow) {\n      flex-direction: row;\n    }\n\n    &__info-container {\n      display: flex;\n      flex: 1;\n      flex-direction: column;\n      justify-content: space-between;\n      margin: 0;\n      padding: 12px;\n      position: relative;\n\n      // 960-1600 with Sidebar;\n      @include breakpoint($wide) {\n        padding: 12px 16px;\n      }\n      // >1600 with sidebar same as >1200 without sidebar\n      @include breakpoint($xlarge) {\n        padding: 20px 24px;\n      }\n\n      &__header {\n        display: flex;\n        align-items: center;\n        flex-direction: row;\n        color: var(--brand-main);\n        font-family: var(--main-font-family);\n        font-size: 14px;\n        font-weight: 600;\n        letter-spacing: -0.2px;\n        line-height: 14px;\n        margin-bottom: 14px;\n\n        .icon {\n          margin-right: 0.75rem;\n\n          svg {\n            fill: var(--brand-main);\n          }\n        }\n      }\n\n      // >1200 no sidebar;\n      &__large {\n        @include breakpoint($extrawide) {\n          padding: 20px 24px;\n        }\n      }\n\n      &__data {\n        display: flex;\n        flex-direction: column;\n      }\n\n      &__title {\n        @include font-size(18px, 20px);\n        @include font-weight($bold);\n        font-family: var(--main-font-family);\n        color: var(--grayscale-black);\n        margin-bottom: 12px;\n        letter-spacing: -0.45px;\n        line-height: 22px;\n\n        @include breakpoint($narrow) {\n          letter-spacing: -0.5px;\n        }\n      }\n\n      &__description {\n        @include font-size(14px);\n        color: var(--grayscale-dark-text);\n        display: none;\n        font-family: var(--main-font-family);\n        letter-spacing: 0.8px;\n        margin-bottom: 14px;\n        line-height: 20px;\n\n        @include breakpoint($narrow) {\n          display: block;\n        }\n      }\n\n      &__outgoing-link {\n        align-items: flex-end;\n        display: flex;\n        flex-direction: row;\n        justify-content: flex-start;\n        position: relative;\n        padding: 0 24px 24px 12px;\n\n        @include breakpoint($narrow) {\n          justify-content: center;\n          padding: 0 24px 24px 0;\n        }\n\n        .label {\n          color: var(--link-blue);\n          font-family: var(--main-font-family);\n          font-size: 16px;\n          font-weight: 600;\n          letter-spacing: -0.3px;\n          line-height: 20px;\n        }\n\n        .icon {\n          margin-right: 4px;\n          margin-bottom: 2px;\n\n          svg {\n            fill: var(--link-blue);\n          }\n        }\n      }\n    }\n  }\n\n  // Degree programmes.\n  &__degree {\n    background: radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);\n    flex-direction: column;\n    @include breakpoint($narrow) {\n      flex-direction: row;\n    }\n\n    &__image-container {\n      display: block;\n      position: relative;\n      flex: 1;\n\n      @include breakpoint($narrow) {\n        flex: 0 0 24%;\n      }\n\n      &__image {\n        vertical-align: bottom;\n        max-width: 100%;\n        height: 100%;\n\n        img {\n          object-fit: cover;\n          width: 100%;\n          height: 100%;\n        }\n      }\n\n      span {\n        @include font-weight($semibold);\n        @include font-size(12px, 14px);\n        background-color: var(--additional-yellow);\n        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);\n        color: var(--grayscale-black);\n        left: -4px;\n        letter-spacing: -0.07px;\n        padding: 5px 8px;\n        position: absolute;\n        top: 16px;\n        text-transform: uppercase;\n\n        @include breakpoint($narrow) {\n          left: -8px;\n        }\n        @include breakpoint($wide) {\n          top: 22px;\n        }\n      }\n    }\n\n    &__info-container {\n      display: flex;\n      flex: 1;\n      flex-direction: column;\n      justify-content: space-between;\n      margin: 0;\n      padding: 12px;\n      position: relative;\n\n      // 960-1600 with Sidebar;\n      @include breakpoint($wide) {\n        padding: 12px 16px;\n      }\n      // >1600 with sidebar same as >1200 without sidebar\n      @include breakpoint($xlarge) {\n        padding: 20px 24px;\n      }\n\n      // >1200 no sidebar;\n      &__large {\n        @include breakpoint($extrawide) {\n          padding: 20px 24px;\n        }\n      }\n\n      &__data {\n        display: flex;\n        flex-direction: column;\n      }\n\n      &__title {\n        @include font-size(18px, 22px);\n        @include font-weight($bold);\n        color: var(--link-blue);\n        letter-spacing: -0.54px;\n        margin-bottom: 8px;\n\n        // 960-1600 with Sidebar;\n        @include breakpoint($wide) {\n          @include font-size(18px, 24px);\n          letter-spacing: -0.5px;\n        }\n\n        // >1600 with sidebar same as >1200 without sidebar\n        @include breakpoint($xlarge) {\n          @include font-size(20px, 26px);\n          letter-spacing: -0.6px;\n        }\n\n        &__large {\n          // >1200 no sidebar;\n          @include breakpoint($extrawide) {\n            @include font-size(20px, 26px);\n            letter-spacing: -0.6px;\n          }\n        }\n      }\n\n      &__description {\n        @include font-size(14px, 18px);\n        color: var(--grayscale-dark);\n        letter-spacing: 0;\n        margin-bottom: 16px;\n\n        // 960-1600 with Sidebar;\n        @include breakpoint($wide) {\n          letter-spacing: -0.2;\n        }\n        // >1600 with sidebar same as >1200 without sidebar\n        @include breakpoint($xlarge) {\n          @include font-size(16px, 20px);\n          letter-spacing: -0.25px;\n        }\n\n        &__large {\n          // >1200 no sidebar;\n          @include breakpoint($extrawide) {\n            @include font-size(16px, 20px);\n            letter-spacing: -0.25px;\n          }\n        }\n      }\n\n      &__metadata-wrapper {\n        display: flex;\n        flex-direction: column;\n        margin-top: 16px;\n        width: 100%;\n\n        @include breakpoint($narrow) {\n          align-items: center;\n          flex-direction: row;\n          justify-content: space-between;\n        }\n\n        &.link-only {\n          justify-content: flex-end;\n        }\n      }\n\n      &__additional-info {\n        width: 100%;\n\n        &__item {\n          @include font-size(12px, 16px);\n          @include font-weight($light);\n          align-items: center;\n          color: var(--grayscale-black);\n          display: flex;\n          flex-direction: row;\n          letter-spacing: -0.2px;\n\n          @include breakpoint($xlarge) {\n            @include font-size(14px, 16px);\n          }\n          // >1200 no sidebar;\n          &__large {\n            @include breakpoint($extrawide) {\n              @include font-size(14px, 16px);\n            }\n          }\n        }\n        &__item.active::before {\n          content: \" \";\n          box-sizing: border-box;\n          height: 14px;\n          width: 14px;\n          border: 3px solid #ffffff;\n          border-radius: 50%;\n          background-color: #f9a21a;\n          left: -7px;\n          position: absolute;\n\n          @include breakpoint($narrow) {\n            border: none;\n            height: 8px;\n            margin-right: 6px;\n            width: 8px;\n            left: 0;\n            position: relative;\n          }\n        }\n      }\n\n      &__outgoing-link {\n        display: flex;\n        flex-direction: row;\n        justify-content: flex-end;\n        position: relative;\n        width: 100%;\n\n        a {\n          align-items: center;\n          bottom: 0;\n          top: 0;\n          display: flex;\n          flex-direction: row;\n          position: relative;\n          right: -18px;\n          text-decoration: none;\n\n          @include breakpoint($wide) {\n            right: -22px;\n          }\n          @include breakpoint($xlarge) {\n            right: -30px;\n          }\n\n          .label {\n            @include font-size(14px, 16px);\n            @include font-weight($bold);\n            color: var(--link-blue);\n            letter-spacing: -0.5px;\n            margin-right: 8px;\n            text-align: right;\n          }\n\n          .icon-wrapper {\n            background-color: var(--brand-main-light);\n            z-index: 10;\n\n            .icon {\n              position: relative;\n              overflow: hidden;\n\n              svg {\n                background-color: transparent;\n                box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);\n                fill: var(--grayscale-white);\n                padding: 6.4px;\n\n                @include breakpoint($xlarge) {\n                  height: 36px;\n                  width: 36px;\n                  padding: 7.2px;\n                }\n              }\n            }\n          }\n        }\n\n        // >1200 no sidebar;\n        &__large {\n          svg {\n            @include breakpoint($extrawide) {\n              height: 36px;\n              width: 36px;\n              padding: 7.2px;\n            }\n          }\n        }\n      }\n    }\n  }\n}\n\n.hy-list-item-wrapper {\n  font-family: var(--main-font-family);\n\n  &__degree {\n    margin-bottom: 16px;\n    @include breakpoint($narrow) {\n      flex-direction: row;\n      margin-bottom: 24px;\n    }\n    @include breakpoint($wide) {\n      margin-bottom: 28px;\n    }\n    @include breakpoint($xlarge) {\n      margin-bottom: 32px;\n    }\n    // >1200 no sidebar;\n    &__large {\n      @include breakpoint($extrawide) {\n        margin-bottom: 32px;\n      }\n    }\n\n    &__related-info {\n      background: radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);\n      margin-top: 4px;\n      padding: 0 12px 0 16px;\n\n      @include breakpoint($narrow) {\n        padding: 0 24px 0 16px;\n      }\n      @include breakpoint($wide) {\n        margin-top: 6px;\n        padding: 0 24px 0 24px;\n      }\n      @include breakpoint($xlarge) {\n        margin-top: 8px;\n      }\n      // >1200 no sidebar;\n      &__large {\n        @include breakpoint($extrawide) {\n          margin-top: 8px;\n        }\n      }\n\n      &__heading {\n        &__link {\n          text-decoration: none;\n        }\n\n        &__button {\n          @include font-size(12px, 16px);\n          align-items: center;\n          background: radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);\n          border: none;\n          color: var(--grayscale-black);\n          display: flex;\n          flex-direction: row;\n          font-family: var(--main-font-family);\n          letter-spacing: -0.2px;\n          height: 100%;\n          padding: 8px 0;\n          text-align: left;\n          width: 100%;\n\n          @include breakpoint($narrow) {\n            @include font-size(12px, 20px);\n            padding: 14px 0;\n          }\n          @include breakpoint($wide) {\n            @include font-size(14px, 20px);\n            letter-spacing: -0.4px;\n            padding: 18px 0;\n          }\n\n          &:hover {\n            cursor: pointer;\n          }\n\n          &__is-open {\n            svg {\n              transform: rotate(180deg);\n            }\n          }\n        }\n\n        &__icon {\n          margin-right: 0.5rem;\n          z-index: 0;\n\n          @include breakpoint($wide) {\n            margin-right: 12px;\n          }\n\n          svg {\n            fill: var(--brand-main);\n            height: 14px;\n            width: 14px;\n\n            @include breakpoint($wide) {\n              height: 18px;\n              width: 18px;\n            }\n          }\n        }\n      }\n\n      &__content {\n        display: none;\n\n        &__is-open {\n          border-top: 1px solid #d2d2d2;\n          display: flex;\n          flex-direction: column;\n          padding: 20px 8px 5px 8px;\n\n          @include breakpoint($wide) {\n            padding: 20px 0 14px 0;\n          }\n        }\n      }\n\n      &__link {\n        @include font-size(14px, 16px);\n        @include font-weight($bold);\n        color: var(--link-blue);\n        letter-spacing: -0.4px;\n        margin-bottom: 16px;\n        text-decoration: none;\n      }\n    }\n  }\n}\n","export interface RelatedLink {\n  label: string;\n  url: string;\n  isExternal: boolean;\n  scLabel: string;\n}\n\nexport interface AdditionalInfo {\n  text: string;\n  isActive: boolean;\n}\n\nexport interface ImageSrcSet {\n  src: any;\n  media: string;\n  type: string;\n  sizes: string | null;\n}\n\nimport {Component, h, Prop, Watch, State, Listen, Element} from \"@stencil/core\";\nimport {ListItemVariants} from \"../../utils/utils\";\n\nlet keys = {\n  enter: \"Enter\",\n  space: \"Space\",\n};\n\n@Component({\n  tag: \"hy-list-item\",\n  styleUrl: \"hy-list-item.scss\",\n  shadow: false,\n})\nexport class HyListItem {\n  @Element() el: HTMLElement;\n  @State() isExpandedRelatedContent: boolean = false;\n  @Prop() variant: ListItemVariants = ListItemVariants.default;\n  @Prop() itemType?: string;\n  @Prop() itemTitle?: string;\n  @Prop() itemDescription?: any;\n  @Prop() url?: string;\n  @Prop() isExternal: boolean = false;\n  @Prop() scLabel?: string;\n  @Prop() itemImageUrl?: string;\n  @Prop() itemImageAlt?: string;\n  @Prop() disableLazy: boolean = false;\n  @Prop() relatedLinksBlockTitle?: string;\n  private _relatedLinks: RelatedLink[];\n  @Prop() relatedLinks?: RelatedLink[] | string;\n  @Prop() imageLabel?: string;\n  @Prop() outGoingUrlLabel?: string = \"Go to programme page\";\n  private _additionalInfo: AdditionalInfo[];\n  @Prop() additionalInfo?: AdditionalInfo[] | string;\n  @Prop() headerstyle: string = \"common\";\n  private _sourceSet: ImageSrcSet[];\n  @Prop() sourceSet: ImageSrcSet[] | string;\n  @Prop() truncateDescription: boolean = false;\n  @Prop() truncateLimit: number = 140;\n\n  @State() _imageMinHeight: number = 0;\n  @State() _imageMinWidth: number = 0;\n\n  @Watch(\"relatedLinks\")\n  relatedLinksWatcher(newValue: RelatedLink[] | string) {\n    if (typeof newValue === \"string\") {\n      this._relatedLinks = JSON.parse(newValue);\n    } else {\n      this._relatedLinks = newValue;\n    }\n  }\n\n  @Watch(\"additionalInfo\")\n  additionalInfoWatcher(newValue: AdditionalInfo[] | string) {\n    if (typeof newValue === \"string\") {\n      this._additionalInfo = JSON.parse(newValue);\n    } else {\n      this._additionalInfo = newValue;\n    }\n  }\n\n  @Watch(\"sourceSet\") srcSetWatcher(data: ImageSrcSet[] | string) {\n    this._sourceSet = typeof data === \"string\" ? JSON.parse(data) : data;\n  }\n\n  expandRelatedInfoPanel(target) {\n    let contentSelector = `hy-list-item-wrapper__${this.variant}__related-info__content`;\n    let targetButtonClass = \"hy-list-item-wrapper__degree__related-info__heading__button\";\n    let contentSection = document.querySelectorAll(`[aria-labelledBy=\"${target.id}\"]`)[0] as HTMLElement;\n    if (contentSection) {\n      if (!this.isExpandedRelatedContent) {\n        contentSection.classList.add(`${contentSelector}__is-open`);\n        target.classList.add(`${targetButtonClass}__is-open`);\n      } else {\n        contentSection.classList.remove(`${contentSelector}__is-open`);\n        target.classList.remove(`${targetButtonClass}__is-open`);\n      }\n      this.isExpandedRelatedContent = !this.isExpandedRelatedContent;\n    }\n  }\n\n  @Listen(\"keydown\")\n  handleKeyDown(event: KeyboardEvent) {\n    const key = event.code;\n    let target = event.target as HTMLButtonElement;\n\n    const targetElement = target.tagName.toLowerCase();\n    const possibleTags = [targetElement].some((r) => [\"svg\", \"path\", \"button\", \"a\"].indexOf(r) >= 0);\n\n    if (\n      target &&\n      possibleTags &&\n      !target.classList.contains(\"hy-list-item-wrapper__degree__related-info__link\") &&\n      [keys.enter, keys.space].includes(key)\n    ) {\n      if (targetElement !== \"button\") {\n        target = target.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`);\n      }\n      this.expandRelatedInfoPanel(target);\n      event.preventDefault();\n    }\n  }\n\n  @Listen(\"click\")\n  handleClick(event) {\n    let target = event.target as HTMLElement;\n    const targetElement = target.tagName.toLowerCase();\n    const possibleTags = [targetElement].some((r) => [\"svg\", \"path\", \"button\", \"a\"].indexOf(r) >= 0);\n\n    if (target && possibleTags && !target.classList.contains(\"hy-list-item-wrapper__degree__related-info__link\")) {\n      if (targetElement !== \"button\") {\n        target = target.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`);\n      }\n      this.expandRelatedInfoPanel(target);\n      event.preventDefault();\n      event.stopImmediatePropagation();\n    }\n  }\n\n  componentWillLoad() {\n    this.relatedLinksWatcher(this.relatedLinks);\n    this.additionalInfoWatcher(this.additionalInfo);\n    this.srcSetWatcher(this.sourceSet);\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    if (this.variant == ListItemVariants.degreeProgramme) {\n      const image = document.querySelector(\".hy-list-item__degree__image-container__image img\") as any;\n\n      if (image) {\n        image.addEventListener(\"load\", function () {\n          const outputImageAspectRatio = 1;\n          const imageHeight = image.naturalHeight;\n          const imageWidth = image.naturalWidth;\n          const inputImageAspectRatio = imageWidth / imageHeight;\n          this._imageMinWidth = imageWidth;\n          this._imageMinHeight = imageHeight;\n          if (inputImageAspectRatio > outputImageAspectRatio) {\n            this._imageMinWidth = imageHeight * outputImageAspectRatio;\n          } else if (inputImageAspectRatio < outputImageAspectRatio) {\n            this._imageMinHeight = imageWidth / outputImageAspectRatio;\n          }\n        });\n      }\n    }\n  }\n\n  render() {\n    const classWrapperAttributes = [\n      \"hy-list-item-wrapper\",\n      `hy-list-item-wrapper__${this.variant}`,\n      `hy-list-item-wrapper__${this.variant}__${this.headerstyle}`,\n    ].join(\" \");\n    const classAttributes = [\"hy-list-item\", `hy-list-item__${this.variant}`].join(\" \");\n    const classInfoContainerAttributes = [\n      `hy-list-item__${this.variant}__info-container`,\n      `hy-list-item__${this.variant}__info-container__${this.headerstyle}`,\n    ].join(\" \");\n    /*const classInfoContainerDataAttributes = [\n      `hy-list-item__${this.variant}__info-container__data`,\n      `hy-list-item__${this.variant}__info-container__data__${this.headerstyle}`,\n    ].join(' ');*/\n    const classInfoContainerHeader = [\n      `hy-list-item__${this.variant}__info-container__header`,\n      `hy-list-item__${this.variant}__info-container__header__${this.headerstyle}`,\n    ].join(\" \");\n    const classInfoContainerTitle = [\n      `hy-list-item__${this.variant}__info-container__title`,\n      `hy-list-item__${this.variant}__info-container__title__${this.headerstyle}`,\n    ].join(\" \");\n    const classInfoContainerDescription = [\n      `hy-list-item__${this.variant}__info-container__description`,\n      `hy-list-item__${this.variant}__info-container__description__${this.headerstyle}`,\n    ].join(\" \");\n    const classInfoContainerLinkContainer = [`hy-list-item__${this.variant}__info-container__link-container`].join(\" \");\n    const classInfoContainerLinkIcon = [`hy-list-item__${this.variant}__info-container__link__icon`].join(\" \");\n    const classInfoContainerLink = [`hy-list-item__${this.variant}__info-container__link`].join(\" \");\n\n    const target = this.isExternal ? \"_blank\" : \"_self\";\n\n    function truncate(str, n) {\n      return str.length > n ? str.substr(0, n - 1) + \"...\" : str;\n    }\n\n    switch (this.variant) {\n      case ListItemVariants.position: {\n        const classInfoContainerOutgoingLink = [\n          `hy-list-item__${this.variant}__info-container__outgoing-link`,\n          `hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`,\n        ].join(\" \");\n        return (\n          <article>\n            <a class={classAttributes} href={this.url} target={target} aria-label={this.scLabel}>\n              <div class={classInfoContainerAttributes}>\n                <div class={classInfoContainerHeader}>\n                  <div class=\"icon\">\n                    <hy-icon icon={\"hy-icon-units-and-faculties\"} size={18} />\n                  </div>\n                  {this.itemType}\n                </div>\n                <div class={classInfoContainerTitle}>{this.itemTitle}</div>\n\n                {this.itemDescription && (\n                  <div\n                    class={classInfoContainerDescription}\n                    innerHTML={\n                      this.truncateDescription\n                        ? truncate(this.itemDescription, this.truncateLimit)\n                        : this.itemDescription\n                    }\n                  ></div>\n                )}\n              </div>\n              <div class={classInfoContainerOutgoingLink}>\n                <span class=\"icon\">\n                  <hy-icon icon={\"hy-icon-done\"} size={14}></hy-icon>\n                </span>\n                <span class=\"label\">{this.outGoingUrlLabel}</span>\n              </div>\n            </a>\n          </article>\n        );\n      }\n      case ListItemVariants.degreeProgramme: {\n        const classImageContainerAttributes = [`hy-list-item__${this.variant}__image-container`].join(\" \");\n        const classImageContainerImage = [`hy-list-item__${this.variant}__image-container__image`].join(\" \");\n\n        const classInfoContainerAdditionalInfoAttributes = [\n          `hy-list-item__${this.variant}__info-container__additional-info`,\n          `hy-list-item__${this.variant}__info-container__additional-info__${this.headerstyle}`,\n        ].join(\" \");\n\n        const withAdditionalInfo = this._additionalInfo && this._additionalInfo.length > 0 ? \"\" : \"link-only\";\n        const classMetadataWrapper = [\n          `hy-list-item__${this.variant}__info-container__metadata-wrapper`,\n          withAdditionalInfo,\n        ].join(\" \");\n        const classContentWrapper = [`hy-list-item__${this.variant}__info-container__content-wrapper`].join(\" \");\n\n        const classInfoContainerOutgoingLink = [\n          `hy-list-item__${this.variant}__info-container__outgoing-link`,\n          `hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`,\n        ].join(\" \");\n        const classInfoContainerOutgoingLinkUrl = [\n          `hy-list-item__${this.variant}__info-container__outgoing-link__link`,\n        ].join(\" \");\n\n        const classRelatedInfoContainer = [\n          `hy-list-item-wrapper__${this.variant}__related-info`,\n          `hy-list-item-wrapper__${this.variant}__related-info__${this.headerstyle}`,\n        ].join(\" \");\n        const classRelatedInfoHeading = [`hy-list-item-wrapper__${this.variant}__related-info__heading`].join(\" \");\n        const classRelatedInfoHeadingLink = [`hy-list-item-wrapper__${this.variant}__related-info__heading__link`].join(\n          \" \"\n        );\n        const classRelatedInfoHeadingButton = [\n          `hy-list-item-wrapper__${this.variant}__related-info__heading__button`,\n        ].join(\" \");\n        const classRelatedInfoHeadingIcon = [`hy-list-item-wrapper__${this.variant}__related-info__heading__icon`].join(\n          \" \"\n        );\n        const classRelatedInfoContent = [`hy-list-item-wrapper__${this.variant}__related-info__content`].join(\" \");\n        const classRelatedInfoLink = [`hy-list-item-wrapper__${this.variant}__related-info__link`].join(\" \");\n\n        const titleAsId =\n          this.relatedLinksBlockTitle && this.relatedLinksBlockTitle.length > 0\n            ? `${this.itemTitle}-${this.relatedLinksBlockTitle}`.toLowerCase().replace(/\\W/g, \"-\")\n            : \"\";\n        const accordionItemHref = \"#\" + titleAsId + \"--title\";\n\n        const relatedLinksCount =\n          this.relatedLinksBlockTitle && this.relatedLinksBlockTitle.length > 0 ? this._relatedLinks.length : \"\";\n\n        return [\n          <article class={classWrapperAttributes}>\n            <a class={classAttributes} href={this.url} target={target} aria-label={this.scLabel}>\n              <div class={classImageContainerAttributes}>\n                <div class={classImageContainerImage}>\n                  {this._sourceSet ? (\n                    <picture>\n                      {this._sourceSet.map((item) => (\n                        <source\n                          srcSet={item.src}\n                          media={item.media}\n                          type={item.type}\n                          sizes={item.sizes ? item.sizes : \"\"}\n                        />\n                      ))}\n                      <img\n                        loading={this.disableLazy ? \"eager\" : \"lazy\"}\n                        aria-hidden=\"true\"\n                        src={this.itemImageUrl}\n                        alt={this.itemImageAlt}\n                        style={{\n                          \"--minheight\": `${this._imageMinHeight}px` as \"minHeight\",\n                          \"--minwidth\": `${this._imageMinWidth}px` as \"minWidth\",\n                        }}\n                      />\n                    </picture>\n                  ) : (\n                    <img\n                      loading={this.disableLazy ? \"eager\" : \"lazy\"}\n                      aria-hidden=\"true\"\n                      src={this.itemImageUrl}\n                      alt={this.itemImageAlt}\n                      style={{\n                        \"--minheight\": `${this._imageMinHeight}px` as \"minHeight\",\n                        \"--minwidth\": `${this._imageMinWidth}px` as \"minWidth\",\n                      }}\n                    />\n                  )}\n                </div>\n                {this.imageLabel && <span>{this.imageLabel}</span>}\n              </div>\n              <div class={classInfoContainerAttributes}>\n                <div class={classContentWrapper}>\n                  <div class={classInfoContainerTitle}>{this.itemTitle}</div>\n                  {this.itemDescription && (\n                    <div class={classInfoContainerDescription} innerHTML={this.itemDescription}></div>\n                  )}\n                </div>\n                <div class={classMetadataWrapper}>\n                  {this._additionalInfo && (\n                    <div class={classInfoContainerAdditionalInfoAttributes}>\n                      {this._additionalInfo.map((x) => {\n                        let classInfoContainerAdditionalInfoItem = [\n                          `hy-list-item__${this.variant}__info-container__additional-info__item`,\n                          `hy-list-item__${this.variant}__info-container__additional-info__item__${this.headerstyle}`,\n                          `${x.isActive.toString() == \"true\" ? \"active\" : \"\"}`,\n                        ].join(\" \");\n                        return <div class={classInfoContainerAdditionalInfoItem}>{x.text}</div>;\n                      })}\n                    </div>\n                  )}\n                  <div class={classInfoContainerOutgoingLink}>\n                    <a\n                      href={this.url}\n                      target={target}\n                      aria-label={this.scLabel}\n                      class={classInfoContainerOutgoingLinkUrl}\n                      tabindex=\"-1\"\n                    >\n                      <span class=\"label\">{this.outGoingUrlLabel}</span>\n                      <span class=\"icon-wrapper\">\n                        <div class=\"icon\">\n                          <hy-icon icon={\"hy-icon-arrow-to-right\"} size={32} />\n                        </div>\n                      </span>\n                    </a>\n                  </div>\n                </div>\n              </div>\n            </a>\n            {this.relatedLinksBlockTitle && (\n              <div class={classRelatedInfoContainer}>\n                <div class={classRelatedInfoHeading}>\n                  <a href={accordionItemHref} class={classRelatedInfoHeadingLink} tabindex=\"-1\">\n                    <button\n                      aria-expanded=\"false\"\n                      aria-controls={`${titleAsId}--content`}\n                      class={classRelatedInfoHeadingButton}\n                      id={`${titleAsId}--title`}\n                    >\n                      <span class={classRelatedInfoHeadingIcon}>\n                        <hy-icon icon={\"hy-icon-caret-down\"} size={14} />\n                      </span>\n                      {this.relatedLinksBlockTitle} ({relatedLinksCount})\n                    </button>\n                  </a>\n                </div>\n                <div\n                  class={classRelatedInfoContent}\n                  aria-labelledBy={`${titleAsId}--title`}\n                  id={`${titleAsId}--content`}\n                  role=\"region\"\n                  aria-hidden=\"true\"\n                >\n                  {this._relatedLinks.map((x) => {\n                    let relatedLinkTarget = x.isExternal ? \"_blank\" : \"_self\";\n                    return (\n                      <a class={classRelatedInfoLink} href={x.url} target={target} aria-label={relatedLinkTarget}>\n                        {x.label}\n                      </a>\n                    );\n                  })}\n                </div>\n              </div>\n            )}\n          </article>,\n        ];\n      }\n      default: {\n        return (\n          <article>\n            <a class={classAttributes} href={this.url} target={target} aria-label={this.scLabel}>\n              <div class={classInfoContainerAttributes}>\n                <div class={classInfoContainerHeader}>{this.itemType}</div>\n                <div class={classInfoContainerTitle}>{this.itemTitle}</div>\n\n                <div class={classInfoContainerLinkContainer}>\n                  <span class={classInfoContainerLinkIcon}>\n                    <hy-icon icon={\"hy-icon-link\"} size={15} />\n                  </span>\n                  <div class={classInfoContainerLink}>{this.url}</div>\n                </div>\n\n                {this.itemDescription && (\n                  <div class={classInfoContainerDescription} innerHTML={this.itemDescription}></div>\n                )}\n              </div>\n            </a>\n          </article>\n        );\n      }\n    }\n  }\n}\n"],"mappings":"8FAAA,MAAMA,EAAgB,+tgBCsBtB,IAAIC,EAAO,CACTC,MAAO,QACPC,MAAO,S,MAQIC,EAAU,M,uDAEwB,M,aACTC,EAAiBC,Q,mHAKvB,M,gGAIC,M,kHAKK,uB,+CAGN,S,kDAGS,M,mBACP,I,qBAEG,E,oBACD,C,CAGlCC,oBAAoBC,GAClB,UAAWA,IAAa,SAAU,CAChCC,KAAKC,cAAgBC,KAAKC,MAAMJ,E,KAC3B,CACLC,KAAKC,cAAgBF,C,EAKzBK,sBAAsBL,GACpB,UAAWA,IAAa,SAAU,CAChCC,KAAKK,gBAAkBH,KAAKC,MAAMJ,E,KAC7B,CACLC,KAAKK,gBAAkBN,C,EAIPO,cAAcC,GAChCP,KAAKQ,kBAAoBD,IAAS,SAAWL,KAAKC,MAAMI,GAAQA,C,CAGlEE,uBAAuBC,GACrB,IAAIC,EAAkB,yBAAyBX,KAAKY,iCACpD,IAAIC,EAAoB,8DACxB,IAAIC,EAAiBC,SAASC,iBAAiB,qBAAqBN,EAAOO,QAAQ,GACnF,GAAIH,EAAgB,CAClB,IAAKd,KAAKkB,yBAA0B,CAClCJ,EAAeK,UAAUC,IAAI,GAAGT,cAChCD,EAAOS,UAAUC,IAAI,GAAGP,a,KACnB,CACLC,EAAeK,UAAUE,OAAO,GAAGV,cACnCD,EAAOS,UAAUE,OAAO,GAAGR,a,CAE7Bb,KAAKkB,0BAA4BlB,KAAKkB,wB,EAK1CI,cAAcC,GACZ,MAAMC,EAAMD,EAAME,KAClB,IAAIf,EAASa,EAAMb,OAEnB,MAAMgB,EAAgBhB,EAAOiB,QAAQC,cACrC,MAAMC,EAAe,CAACH,GAAeI,MAAMC,GAAM,CAAC,MAAO,OAAQ,SAAU,KAAKC,QAAQD,IAAM,IAE9F,GACErB,GACAmB,IACCnB,EAAOS,UAAUc,SAAS,qDAC3B,CAACzC,EAAKC,MAAOD,EAAKE,OAAOwC,SAASV,GAClC,CACA,GAAIE,IAAkB,SAAU,CAC9BhB,EAASA,EAAOyB,QAAQ,0BAA0BnC,KAAKY,yC,CAEzDZ,KAAKS,uBAAuBC,GAC5Ba,EAAMa,gB,EAKVC,YAAYd,GACV,IAAIb,EAASa,EAAMb,OACnB,MAAMgB,EAAgBhB,EAAOiB,QAAQC,cACrC,MAAMC,EAAe,CAACH,GAAeI,MAAMC,GAAM,CAAC,MAAO,OAAQ,SAAU,KAAKC,QAAQD,IAAM,IAE9F,GAAIrB,GAAUmB,IAAiBnB,EAAOS,UAAUc,SAAS,oDAAqD,CAC5G,GAAIP,IAAkB,SAAU,CAC9BhB,EAASA,EAAOyB,QAAQ,0BAA0BnC,KAAKY,yC,CAEzDZ,KAAKS,uBAAuBC,GAC5Ba,EAAMa,iBACNb,EAAMe,0B,EAIVC,oBACEvC,KAAKF,oBAAoBE,KAAKwC,cAC9BxC,KAAKI,sBAAsBJ,KAAKyC,gBAChCzC,KAAKM,cAAcN,KAAK0C,U,CAG1BC,mBACE,IAAIC,EAAY5C,KAAK6C,GAAGV,QAAQ,YAChC,GAAIS,EAAW,CACb,IAAKA,EAAUzB,UAAUc,SAAS,gBAAiB,CACjDjC,KAAK8C,YAAc,O,EAGvB,GAAI9C,KAAKY,SAAWhB,EAAiBmD,gBAAiB,CACpD,MAAMC,EAAQjC,SAASkC,cAAc,qDAErC,GAAID,EAAO,CACTA,EAAME,iBAAiB,QAAQ,WAC7B,MAAMC,EAAyB,EAC/B,MAAMC,EAAcJ,EAAMK,cAC1B,MAAMC,EAAaN,EAAMO,aACzB,MAAMC,EAAwBF,EAAaF,EAC3CpD,KAAKyD,eAAiBH,EACtBtD,KAAK0D,gBAAkBN,EACvB,GAAII,EAAwBL,EAAwB,CAClDnD,KAAKyD,eAAiBL,EAAcD,C,MAC/B,GAAIK,EAAwBL,EAAwB,CACzDnD,KAAK0D,gBAAkBJ,EAAaH,C,OAO9CQ,SACE,MAAMC,EAAyB,CAC7B,uBACA,yBAAyB5D,KAAKY,UAC9B,yBAAyBZ,KAAKY,YAAYZ,KAAK8C,eAC/Ce,KAAK,KACP,MAAMC,EAAkB,CAAC,eAAgB,iBAAiB9D,KAAKY,WAAWiD,KAAK,KAC/E,MAAME,EAA+B,CACnC,iBAAiB/D,KAAKY,0BACtB,iBAAiBZ,KAAKY,4BAA4BZ,KAAK8C,eACvDe,KAAK,KAKP,MAAMG,EAA2B,CAC/B,iBAAiBhE,KAAKY,kCACtB,iBAAiBZ,KAAKY,oCAAoCZ,KAAK8C,eAC/De,KAAK,KACP,MAAMI,EAA0B,CAC9B,iBAAiBjE,KAAKY,iCACtB,iBAAiBZ,KAAKY,mCAAmCZ,KAAK8C,eAC9De,KAAK,KACP,MAAMK,EAAgC,CACpC,iBAAiBlE,KAAKY,uCACtB,iBAAiBZ,KAAKY,yCAAyCZ,KAAK8C,eACpEe,KAAK,KACP,MAAMM,EAAkC,CAAC,iBAAiBnE,KAAKY,2CAA2CiD,KAAK,KAC/G,MAAMO,EAA6B,CAAC,iBAAiBpE,KAAKY,uCAAuCiD,KAAK,KACtG,MAAMQ,EAAyB,CAAC,iBAAiBrE,KAAKY,iCAAiCiD,KAAK,KAE5F,MAAMnD,EAASV,KAAKsE,WAAa,SAAW,QAE5C,SAASC,EAASC,EAAKC,GACrB,OAAOD,EAAIE,OAASD,EAAID,EAAIG,OAAO,EAAGF,EAAI,GAAK,MAAQD,C,CAGzD,OAAQxE,KAAKY,SACX,KAAKhB,EAAiBgF,SAAU,CAC9B,MAAMC,EAAiC,CACrC,iBAAiB7E,KAAKY,yCACtB,iBAAiBZ,KAAKY,2CAA2CZ,KAAK8C,eACtEe,KAAK,KACP,OACEiB,EAAA,eACEA,EAAA,KAAGC,MAAOjB,EAAiBkB,KAAMhF,KAAKiF,IAAKvE,OAAQA,EAAM,aAAcV,KAAKkF,SAC1EJ,EAAA,OAAKC,MAAOhB,GACVe,EAAA,OAAKC,MAAOf,GACVc,EAAA,OAAKC,MAAM,QACTD,EAAA,WAASK,KAAM,8BAA+BC,KAAM,MAErDpF,KAAKqF,UAERP,EAAA,OAAKC,MAAOd,GAA0BjE,KAAKsF,WAE1CtF,KAAKuF,iBACJT,EAAA,OACEC,MAAOb,EACPsB,UACExF,KAAKyF,oBACDlB,EAASvE,KAAKuF,gBAAiBvF,KAAK0F,eACpC1F,KAAKuF,mBAKjBT,EAAA,OAAKC,MAAOF,GACVC,EAAA,QAAMC,MAAM,QACVD,EAAA,WAASK,KAAM,eAAgBC,KAAM,MAEvCN,EAAA,QAAMC,MAAM,SAAS/E,KAAK2F,oB,CAMpC,KAAK/F,EAAiBmD,gBAAiB,CACrC,MAAM6C,EAAgC,CAAC,iBAAiB5F,KAAKY,4BAA4BiD,KAAK,KAC9F,MAAMgC,EAA2B,CAAC,iBAAiB7F,KAAKY,mCAAmCiD,KAAK,KAEhG,MAAMiC,EAA6C,CACjD,iBAAiB9F,KAAKY,2CACtB,iBAAiBZ,KAAKY,6CAA6CZ,KAAK8C,eACxEe,KAAK,KAEP,MAAMkC,EAAqB/F,KAAKK,iBAAmBL,KAAKK,gBAAgBqE,OAAS,EAAI,GAAK,YAC1F,MAAMsB,EAAuB,CAC3B,iBAAiBhG,KAAKY,4CACtBmF,GACAlC,KAAK,KACP,MAAMoC,EAAsB,CAAC,iBAAiBjG,KAAKY,4CAA4CiD,KAAK,KAEpG,MAAMgB,EAAiC,CACrC,iBAAiB7E,KAAKY,yCACtB,iBAAiBZ,KAAKY,2CAA2CZ,KAAK8C,eACtEe,KAAK,KACP,MAAMqC,EAAoC,CACxC,iBAAiBlG,KAAKY,gDACtBiD,KAAK,KAEP,MAAMsC,EAA4B,CAChC,yBAAyBnG,KAAKY,wBAC9B,yBAAyBZ,KAAKY,0BAA0BZ,KAAK8C,eAC7De,KAAK,KACP,MAAMuC,EAA0B,CAAC,yBAAyBpG,KAAKY,kCAAkCiD,KAAK,KACtG,MAAMwC,EAA8B,CAAC,yBAAyBrG,KAAKY,wCAAwCiD,KACzG,KAEF,MAAMyC,EAAgC,CACpC,yBAAyBtG,KAAKY,0CAC9BiD,KAAK,KACP,MAAM0C,EAA8B,CAAC,yBAAyBvG,KAAKY,wCAAwCiD,KACzG,KAEF,MAAM2C,EAA0B,CAAC,yBAAyBxG,KAAKY,kCAAkCiD,KAAK,KACtG,MAAM4C,EAAuB,CAAC,yBAAyBzG,KAAKY,+BAA+BiD,KAAK,KAEhG,MAAM6C,EACJ1G,KAAK2G,wBAA0B3G,KAAK2G,uBAAuBjC,OAAS,EAChE,GAAG1E,KAAKsF,aAAatF,KAAK2G,yBAAyB/E,cAAcgF,QAAQ,MAAO,KAChF,GACN,MAAMC,EAAoB,IAAMH,EAAY,UAE5C,MAAMI,EACJ9G,KAAK2G,wBAA0B3G,KAAK2G,uBAAuBjC,OAAS,EAAI1E,KAAKC,cAAcyE,OAAS,GAEtG,MAAO,CACLI,EAAA,WAASC,MAAOnB,GACdkB,EAAA,KAAGC,MAAOjB,EAAiBkB,KAAMhF,KAAKiF,IAAKvE,OAAQA,EAAM,aAAcV,KAAKkF,SAC1EJ,EAAA,OAAKC,MAAOa,GACVd,EAAA,OAAKC,MAAOc,GACT7F,KAAKQ,WACJsE,EAAA,eACG9E,KAAKQ,WAAWuG,KAAKC,GACpBlC,EAAA,UACEmC,OAAQD,EAAKE,IACbC,MAAOH,EAAKG,MACZC,KAAMJ,EAAKI,KACXC,MAAOL,EAAKK,MAAQL,EAAKK,MAAQ,OAGrCvC,EAAA,OACEwC,QAAStH,KAAKuH,YAAc,QAAU,OAAM,cAChC,OACZL,IAAKlH,KAAKwH,aACVC,IAAKzH,KAAK0H,aACVC,MAAO,CACL,cAAe,GAAG3H,KAAK0D,oBACvB,aAAc,GAAG1D,KAAKyD,uBAK5BqB,EAAA,OACEwC,QAAStH,KAAKuH,YAAc,QAAU,OAAM,cAChC,OACZL,IAAKlH,KAAKwH,aACVC,IAAKzH,KAAK0H,aACVC,MAAO,CACL,cAAe,GAAG3H,KAAK0D,oBACvB,aAAc,GAAG1D,KAAKyD,uBAK7BzD,KAAK4H,YAAc9C,EAAA,YAAO9E,KAAK4H,aAElC9C,EAAA,OAAKC,MAAOhB,GACVe,EAAA,OAAKC,MAAOkB,GACVnB,EAAA,OAAKC,MAAOd,GAA0BjE,KAAKsF,WAC1CtF,KAAKuF,iBACJT,EAAA,OAAKC,MAAOb,EAA+BsB,UAAWxF,KAAKuF,mBAG/DT,EAAA,OAAKC,MAAOiB,GACThG,KAAKK,iBACJyE,EAAA,OAAKC,MAAOe,GACT9F,KAAKK,gBAAgB0G,KAAKc,IACzB,IAAIC,EAAuC,CACzC,iBAAiB9H,KAAKY,iDACtB,iBAAiBZ,KAAKY,mDAAmDZ,KAAK8C,cAC9E,GAAG+E,EAAEE,SAASC,YAAc,OAAS,SAAW,MAChDnE,KAAK,KACP,OAAOiB,EAAA,OAAKC,MAAO+C,GAAuCD,EAAEI,KAAW,KAI7EnD,EAAA,OAAKC,MAAOF,GACVC,EAAA,KACEE,KAAMhF,KAAKiF,IACXvE,OAAQA,EAAM,aACFV,KAAKkF,QACjBH,MAAOmB,EACPgC,SAAS,MAETpD,EAAA,QAAMC,MAAM,SAAS/E,KAAK2F,kBAC1Bb,EAAA,QAAMC,MAAM,gBACVD,EAAA,OAAKC,MAAM,QACTD,EAAA,WAASK,KAAM,yBAA0BC,KAAM,YAQ5DpF,KAAK2G,wBACJ7B,EAAA,OAAKC,MAAOoB,GACVrB,EAAA,OAAKC,MAAOqB,GACVtB,EAAA,KAAGE,KAAM6B,EAAmB9B,MAAOsB,EAA6B6B,SAAS,MACvEpD,EAAA,0BACgB,QAAO,gBACN,GAAG4B,aAClB3B,MAAOuB,EACPrF,GAAI,GAAGyF,YAEP5B,EAAA,QAAMC,MAAOwB,GACXzB,EAAA,WAASK,KAAM,qBAAsBC,KAAM,MAE5CpF,KAAK2G,uBAAsB,KAAIG,EAAiB,OAIvDhC,EAAA,OACEC,MAAOyB,EAAuB,kBACb,GAAGE,WACpBzF,GAAI,GAAGyF,aACPyB,KAAK,SAAQ,cACD,QAEXnI,KAAKC,cAAc8G,KAAKc,IACvB,IAAIO,EAAoBP,EAAEvD,WAAa,SAAW,QAClD,OACEQ,EAAA,KAAGC,MAAO0B,EAAsBzB,KAAM6C,EAAE5C,IAAKvE,OAAQA,EAAM,aAAc0H,GACtEP,EAAEQ,MACD,O,CASpB,QAAS,CACP,OACEvD,EAAA,eACEA,EAAA,KAAGC,MAAOjB,EAAiBkB,KAAMhF,KAAKiF,IAAKvE,OAAQA,EAAM,aAAcV,KAAKkF,SAC1EJ,EAAA,OAAKC,MAAOhB,GACVe,EAAA,OAAKC,MAAOf,GAA2BhE,KAAKqF,UAC5CP,EAAA,OAAKC,MAAOd,GAA0BjE,KAAKsF,WAE3CR,EAAA,OAAKC,MAAOZ,GACVW,EAAA,QAAMC,MAAOX,GACXU,EAAA,WAASK,KAAM,eAAgBC,KAAM,MAEvCN,EAAA,OAAKC,MAAOV,GAAyBrE,KAAKiF,MAG3CjF,KAAKuF,iBACJT,EAAA,OAAKC,MAAOb,EAA+BsB,UAAWxF,KAAKuF,oB"}

package/dist/huds-lib/hy-logo-grid_2.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i}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}.hy-logo-grid{padding:78px 0 92px}.hy-logo-grid__title{font-size:1.75rem;line-height:32px;letter-spacing:-0.7px;font-family:var(--main-font-family);margin:0 0 24px;text-transform:uppercase}@media (min-width: 30rem){.hy-logo-grid__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px;margin:0 0 32px}}@media (min-width: 1601px){.without-sidebar .hy-logo-grid__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px;margin:0 0 40px}}@media (min-width: 75.0625rem){.with-sidebar .hy-logo-grid__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px;margin:0 0 40px}}.hy-logo-grid__images{display:grid;gap:24px 36px;grid-template-columns:repeat(2, 1fr);padding:0 8px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}@media (min-width: 30rem){.hy-logo-grid__images{grid-template-columns:repeat(3, 25%);padding:0;gap:28px 0}}@media (min-width: 60rem){.without-sidebar .hy-logo-grid__images{grid-template-columns:repeat(4, 20%);gap:32px 0}}@media (min-width: 75.0625rem){.without-sidebar .hy-logo-grid__images{gap:40px 0}}@media (min-width: 75.0625rem){.with-sidebar .hy-logo-grid__images{grid-template-columns:repeat(4, 20%);gap:32px 0}}@media (min-width: 1601px){.with-sidebar .hy-logo-grid__images{gap:40px 0}}.hy-logo-grid__figure{margin:0;padding:0;position:relative}.hy-logo-grid__figure:after{content:"";display:block;padding-bottom:100%}.hy-logo-grid__figure picture{position:absolute;inset:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;display:-webkit-box;display:-ms-flexbox;display:flex}.hy-logo-grid__figure img{max-width:100%;-o-object-fit:scale-down;object-fit:scale-down;height:100%}';const t=class{constructor(i){e(this,i);this.headingVariant=undefined;this.logoGridTitle=undefined}render(){const e=this.headingVariant;return i("div",{class:"hy-logo-grid",role:"complementary"},this.logoGridTitle&&i(e,{class:"hy-logo-grid__title"},this.logoGridTitle),i("div",{class:"hy-logo-grid__images"},i("slot",null)))}};t.style=a;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-logo-grid{padding:78px 0 92px}.hy-logo-grid__title{font-size:1.75rem;line-height:32px;letter-spacing:-0.7px;font-family:var(--main-font-family);margin:0 0 24px;text-transform:uppercase}@media (min-width: 30rem){.hy-logo-grid__title{font-size:2.125rem;line-height:40px;letter-spacing:-0.85px;margin:0 0 32px}}@media (min-width: 1601px){.without-sidebar .hy-logo-grid__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px;margin:0 0 40px}}@media (min-width: 75.0625rem){.with-sidebar .hy-logo-grid__title{font-size:2.625rem;line-height:48px;letter-spacing:-1.05px;margin:0 0 40px}}.hy-logo-grid__images{display:grid;gap:24px 36px;grid-template-columns:repeat(2, 1fr);padding:0 8px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}@media (min-width: 30rem){.hy-logo-grid__images{grid-template-columns:repeat(3, 25%);padding:0;gap:28px 0}}@media (min-width: 60rem){.without-sidebar .hy-logo-grid__images{grid-template-columns:repeat(4, 20%);gap:32px 0}}@media (min-width: 75.0625rem){.without-sidebar .hy-logo-grid__images{gap:40px 0}}@media (min-width: 75.0625rem){.with-sidebar .hy-logo-grid__images{grid-template-columns:repeat(4, 20%);gap:32px 0}}@media (min-width: 1601px){.with-sidebar .hy-logo-grid__images{gap:40px 0}}.hy-logo-grid__figure{margin:0;padding:0;position:relative}.hy-logo-grid__figure:after{content:"";display:block;padding-bottom:100%}.hy-logo-grid__figure picture{position:absolute;inset:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;display:-webkit-box;display:-ms-flexbox;display:flex}.hy-logo-grid__figure img{max-width:100%;-o-object-fit:scale-down;object-fit:scale-down;height:100%}';const d=class{constructor(i){e(this,i);this.link=undefined;this.image=undefined}render(){const e=JSON.parse(this.image);const a=this.link?JSON.parse(this.link):null;return e.map((({image_sources:e,image_url:t,image_alt:r})=>{const d=JSON.parse(e);const o=i("figure",{class:"hy-logo-grid__figure"},d&&i("picture",null,d.map((({src:e,media:a,type:t,sizes:r})=>i("source",{srcSet:e,media:a,type:t,sizes:r?r:""}))),i("img",{alt:r,src:t})),!d&&i("img",{alt:r,src:t}));if(a){const{url:e,target:t}=a;const r=t==="_blank"?t:"_self";return i("a",{href:e,target:r,class:"hy-logo-grid__link"},o)}return o}))}};d.style=r;export{t as hy_logo_grid,d as hy_logo_grid_item};
+//# sourceMappingURL=hy-logo-grid_2.entry.js.map

package/dist/huds-lib/hy-logo-grid_2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyLogoGridCss","HyLogoGrid","render","HeadingVariant","this","headingVariant","h","class","role","logoGridTitle","HyLogoGridItem","parsedImage","JSON","parse","image","parsedLink","link","map","image_sources","sources","image_url","fallback_url","image_alt","alt","parsedSources","elementContent","src","media","type","sizes","srcSet","url","target","targetValue","href"],"sources":["./src/components/hy-logo-grid/hy-logo-grid.scss?tag=hy-logo-grid","./src/components/hy-logo-grid/hy-logo-grid.tsx","./src/components/hy-logo-grid/hy-logo-grid.scss?tag=hy-logo-grid-item","./src/components/hy-logo-grid/hy-logo-grid.item.tsx"],"sourcesContent":[".hy-logo-grid {\n  padding: 78px 0 92px;\n}\n\n.hy-logo-grid__title {\n  @include font-size(28px, 32px);\n  letter-spacing: -0.7px;\n  font-family: var(--main-font-family);\n  margin: 0 0 24px;\n  text-transform: uppercase;\n\n  @include breakpoint($narrow) {\n    @include font-size(34px, 40px);\n    letter-spacing: -0.85px;\n    margin: 0 0 32px;\n  }\n\n  .without-sidebar & {\n    @include breakpoint($xlarge) {\n      @include font-size(42px, 48px);\n      letter-spacing: -1.05px;\n      margin: 0 0 40px;\n    }\n  }\n\n  .with-sidebar & {\n    @include breakpoint($extrawide) {\n      @include font-size(42px, 48px);\n      letter-spacing: -1.05px;\n      margin: 0 0 40px;\n    }\n  }\n}\n\n.hy-logo-grid__images {\n  display: grid;\n  gap: 24px 36px;\n  grid-template-columns: repeat(2, 1fr);\n  padding: 0 8px;\n  justify-content: space-between;\n\n  @include breakpoint($narrow) {\n    grid-template-columns: repeat(3, 25%);\n    padding: 0;\n    gap: 28px 0;\n  }\n\n  .without-sidebar & {\n    @include breakpoint($wide) {\n      grid-template-columns: repeat(4, 20%);\n      gap: 32px 0;\n    }\n\n    @include breakpoint($extrawide) {\n      gap: 40px 0;\n    }\n  }\n\n  .with-sidebar & {\n    @include breakpoint($extrawide) {\n      grid-template-columns: repeat(4, 20%);\n      gap: 32px 0;\n    }\n\n    @include breakpoint($xlarge) {\n      gap: 40px 0;\n    }\n  }\n}\n\n.hy-logo-grid__figure {\n  margin: 0;\n  padding: 0;\n  position: relative;\n\n  &:after {\n    content: \"\";\n    display: block;\n    padding-bottom: 100%;\n  }\n\n  picture {\n    position: absolute;\n    inset: 0;\n    align-items: center;\n    justify-content: center;\n    display: flex;\n  }\n\n  img {\n    max-width: 100%;\n    object-fit: scale-down;\n    height: 100%;\n  }\n}\n","import {Component, h, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-logo-grid\",\n  styleUrl: \"hy-logo-grid.scss\",\n  shadow: false,\n})\nexport class HyLogoGrid {\n  @Prop() headingVariant?: string;\n  @Prop() logoGridTitle?: string;\n\n  render() {\n    const HeadingVariant = this.headingVariant;\n\n    return (\n      <div class=\"hy-logo-grid\" role=\"complementary\">\n        {this.logoGridTitle && <HeadingVariant class=\"hy-logo-grid__title\">{this.logoGridTitle}</HeadingVariant>}\n        <div class=\"hy-logo-grid__images\">\n          <slot />\n        </div>\n      </div>\n    );\n  }\n}\n",".hy-logo-grid {\n  padding: 78px 0 92px;\n}\n\n.hy-logo-grid__title {\n  @include font-size(28px, 32px);\n  letter-spacing: -0.7px;\n  font-family: var(--main-font-family);\n  margin: 0 0 24px;\n  text-transform: uppercase;\n\n  @include breakpoint($narrow) {\n    @include font-size(34px, 40px);\n    letter-spacing: -0.85px;\n    margin: 0 0 32px;\n  }\n\n  .without-sidebar & {\n    @include breakpoint($xlarge) {\n      @include font-size(42px, 48px);\n      letter-spacing: -1.05px;\n      margin: 0 0 40px;\n    }\n  }\n\n  .with-sidebar & {\n    @include breakpoint($extrawide) {\n      @include font-size(42px, 48px);\n      letter-spacing: -1.05px;\n      margin: 0 0 40px;\n    }\n  }\n}\n\n.hy-logo-grid__images {\n  display: grid;\n  gap: 24px 36px;\n  grid-template-columns: repeat(2, 1fr);\n  padding: 0 8px;\n  justify-content: space-between;\n\n  @include breakpoint($narrow) {\n    grid-template-columns: repeat(3, 25%);\n    padding: 0;\n    gap: 28px 0;\n  }\n\n  .without-sidebar & {\n    @include breakpoint($wide) {\n      grid-template-columns: repeat(4, 20%);\n      gap: 32px 0;\n    }\n\n    @include breakpoint($extrawide) {\n      gap: 40px 0;\n    }\n  }\n\n  .with-sidebar & {\n    @include breakpoint($extrawide) {\n      grid-template-columns: repeat(4, 20%);\n      gap: 32px 0;\n    }\n\n    @include breakpoint($xlarge) {\n      gap: 40px 0;\n    }\n  }\n}\n\n.hy-logo-grid__figure {\n  margin: 0;\n  padding: 0;\n  position: relative;\n\n  &:after {\n    content: \"\";\n    display: block;\n    padding-bottom: 100%;\n  }\n\n  picture {\n    position: absolute;\n    inset: 0;\n    align-items: center;\n    justify-content: center;\n    display: flex;\n  }\n\n  img {\n    max-width: 100%;\n    object-fit: scale-down;\n    height: 100%;\n  }\n}\n","import {Component, h, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-logo-grid-item\",\n  styleUrl: \"hy-logo-grid.scss\",\n  shadow: false,\n})\nexport class HyLogoGridItem {\n  @Prop() link?: string;\n  @Prop() image: string;\n\n  render() {\n    const parsedImage = JSON.parse(this.image);\n    const parsedLink = this.link ? JSON.parse(this.link) : null;\n\n    return parsedImage.map(({image_sources: sources, image_url: fallback_url, image_alt: alt}) => {\n      const parsedSources = JSON.parse(sources);\n\n      const elementContent = (\n        <figure class=\"hy-logo-grid__figure\">\n          {parsedSources && (\n            <picture>\n              {parsedSources.map(({src, media, type, sizes}) => (\n                <source srcSet={src} media={media} type={type} sizes={sizes ? sizes : \"\"} />\n              ))}\n              <img alt={alt} src={fallback_url} />\n            </picture>\n          )}\n          {!parsedSources && <img alt={alt} src={fallback_url} />}\n        </figure>\n      );\n\n      if (parsedLink) {\n        const {url, target} = parsedLink;\n        const targetValue = target === \"_blank\" ? target : \"_self\";\n\n        return (\n          <a href={url} target={targetValue} class=\"hy-logo-grid__link\">\n            {elementContent}\n          </a>\n        );\n      }\n\n      return elementContent;\n    });\n  }\n}\n"],"mappings":"+CAAA,MAAMA,EAAgB,+2F,MCOTC,EAAU,M,oFAIrBC,SACE,MAAMC,EAAiBC,KAAKC,eAE5B,OACEC,EAAA,OAAKC,MAAM,eAAeC,KAAK,iBAC5BJ,KAAKK,eAAiBH,EAACH,EAAc,CAACI,MAAM,uBAAuBH,KAAKK,eACzEH,EAAA,OAAKC,MAAM,wBACTD,EAAA,c,aClBV,MAAMN,EAAgB,+2F,MCOTU,EAAc,M,kEAIzBR,SACE,MAAMS,EAAcC,KAAKC,MAAMT,KAAKU,OACpC,MAAMC,EAAaX,KAAKY,KAAOJ,KAAKC,MAAMT,KAAKY,MAAQ,KAEvD,OAAOL,EAAYM,KAAI,EAAEC,cAAeC,EAASC,UAAWC,EAAcC,UAAWC,MACnF,MAAMC,EAAgBZ,KAAKC,MAAMM,GAEjC,MAAMM,EACJnB,EAAA,UAAQC,MAAM,wBACXiB,GACClB,EAAA,eACGkB,EAAcP,KAAI,EAAES,MAAKC,QAAOC,OAAMC,WACrCvB,EAAA,UAAQwB,OAAQJ,EAAKC,MAAOA,EAAOC,KAAMA,EAAMC,MAAOA,EAAQA,EAAQ,OAExEvB,EAAA,OAAKiB,IAAKA,EAAKG,IAAKL,MAGtBG,GAAiBlB,EAAA,OAAKiB,IAAKA,EAAKG,IAAKL,KAI3C,GAAIN,EAAY,CACd,MAAMgB,IAACA,EAAGC,OAAEA,GAAUjB,EACtB,MAAMkB,EAAcD,IAAW,SAAWA,EAAS,QAEnD,OACE1B,EAAA,KAAG4B,KAAMH,EAAKC,OAAQC,EAAa1B,MAAM,sBACtCkB,E,CAKP,OAAOA,CAAc,G"}

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

@@ -0,0 +1,2 @@
+import{r as a,h as i}from"./index-f84f2a7d.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}.hy-main{display:-webkit-box;display:-ms-flexbox;display:flex;margin:0 auto;max-width:120.0625rem;padding:0;width:100%}.hy-main .layout-content{padding:0;width:100%}.hy-main .layout-user-login-page{padding:0 var(--gutter-medium);width:100%}.hy-main .layout-user-login-page div[id^=block-breadcrumbs]{display:none}.hy-main__common{position:relative}@media (min-width: 30rem){.hy-main__common .layout-content{margin:0 auto;width:100%}}@media (min-width: 75.0625rem){.hy-main__common .layout-content{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;width:80%}}@media (min-width: 1601px){.hy-main__common .layout-content{padding:0 2rem}}.hy-main__common .layout-sidebar-first{display:none}@media (min-width: 75.0625rem){.hy-main__common .layout-sidebar-first{background:var(--grayscale-white);border-top:1px solid var(--grayscale-black);border-right:1px solid var(--grayscale-medium);display:block;max-width:320px;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;padding:var(--gutter-extrawide) 13px;width:20%;height:auto}.hy-main__common .layout-sidebar-first.menu-is-open{background:var(--grayscale-white);min-height:100vh;overflow:auto}}.hy-main__large .layout-content{padding:0;width:100%}@media (min-width: 75.0625rem){.hy-main__large .layout-content{padding:0 2rem}}";const r=class{constructor(i){a(this,i);this.hasSidebar=false}render(){const a=["hy-main",this.hasSidebar?"with-sidebar":"without-sidebar",this.hasSidebar?"hy-main__common":"hy-main__large"].join(" ");return i("div",{class:a},i("slot",null))}};r.style=e;export{r as hy_main};
+//# sourceMappingURL=hy-main.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["hyMainCss","HyMain","render","classAttributes","this","hasSidebar","join","h","class"],"sources":["./src/components/hy-main/hy-main.scss?tag=hy-main","./src/components/hy-main/hy-main.tsx"],"sourcesContent":[".hy-main {\n  display: flex;\n  margin: 0 auto;\n  max-width: $fullhd;\n  padding: 0;\n  width: 100%;\n\n  .layout-content {\n    padding: 0;\n    width: 100%;\n  }\n\n  .layout-user-login-page {\n    padding: 0 var(--gutter-medium);\n    width: 100%;\n\n    div[id^=\"block-breadcrumbs\"] {\n      display: none;\n    }\n  }\n\n  &__common {\n    position: relative;\n    .layout-content {\n      @include breakpoint($narrow) {\n        margin: 0 auto;\n        width: 100%;\n      }\n      @include breakpoint($extrawide) {\n        flex-grow: 1;\n        order: 2;\n        width: 80%;\n      }\n      @include breakpoint($xlarge) {\n        padding: 0 2rem;\n      }\n    }\n\n    .layout-sidebar-first {\n      display: none;\n\n      @include breakpoint($extrawide) {\n        background: var(--grayscale-white);\n        border-top: 1px solid var(--grayscale-black);\n        border-right: 1px solid var(--grayscale-medium);\n        display: block;\n        max-width: 320px;\n        order: 1;\n        padding: var(--gutter-extrawide) 13px;\n        width: 20%;\n        height: auto;\n\n        &.menu-is-open {\n          background: var(--grayscale-white);\n          min-height: 100vh;\n          overflow: auto;\n        }\n      }\n    }\n  }\n\n  &__large {\n    .layout-content {\n      padding: 0;\n      width: 100%;\n      @include breakpoint($extrawide) {\n        padding: 0 2rem;\n      }\n    }\n  }\n}\n","import {Component, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-main\",\n  styleUrl: \"hy-main.scss\",\n  shadow: false,\n})\nexport class HyMain {\n  @Prop() hasSidebar: boolean = false;\n\n  render() {\n    const classAttributes = [\n      \"hy-main\",\n      this.hasSidebar ? \"with-sidebar\" : \"without-sidebar\",\n      this.hasSidebar ? \"hy-main__common\" : \"hy-main__large\",\n    ].join(\" \");\n\n    return (\n      <div class={classAttributes}>\n        <slot />\n      </div>\n    );\n  }\n}\n"],"mappings":"+CAAA,MAAMA,EAAY,i9E,MCOLC,EAAM,M,yCACa,K,CAE9BC,SACE,MAAMC,EAAkB,CACtB,UACAC,KAAKC,WAAa,eAAiB,kBACnCD,KAAKC,WAAa,kBAAoB,kBACtCC,KAAK,KAEP,OACEC,EAAA,OAAKC,MAAOL,GACVI,EAAA,a"}

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

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

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

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

package/dist/huds-lib/hy-opening-hours_2.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as a}from"./index-f84f2a7d.js";import{h as r}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}:host{display:block}.hy-open-hours--container{font-family:var(--main-font-family);max-width:50rem;overflow:hidden}.hy-open-hours--container--exceptional{max-width:100%}.open-hours__title{text-transform:uppercase;margin-bottom:0.75rem}.open-hours__date-change{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--grayscale-background-box);color:var(--brand-main);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.open-hours__date-change--title{font-size:1.25rem;line-height:24px;font-weight:700;color:var(--grayscale-black);font-family:var(--main-font-family);letter-spacing:-0.5px;text-align:center;text-transform:uppercase}.open-hours__date-change .open-hours__prev-date,.open-hours__date-change .open-hours__next-date{background:none;border:0;color:var(--brand-main);display:-webkit-box;display:-ms-flexbox;display:flex;height:44px;outline:5px solid var(--grayscale-white);position:relative;width:44px}.open-hours__date-change .open-hours__prev-date:hover,.open-hours__date-change .open-hours__next-date:hover{background-color:var(--hover-gray);color:var(--brand-main-active);cursor:pointer}.open-hours__date-change .open-hours__prev-date:focus,.open-hours__date-change .open-hours__next-date:focus{background-color:var(--hover-gray);color:var(--brand-main-active)}.open-hours__date-change .open-hours__prev-date:disabled,.open-hours__date-change .open-hours__next-date:disabled{cursor:none}.open-hours__date-change .open-hours__prev-date hy-icon,.open-hours__date-change .open-hours__next-date hy-icon{color:var(--link-blue);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.open-hours__date-change .open-hours__prev-date svg,.open-hours__date-change .open-hours__next-date svg{fill:currentColor;height:20px;width:20px}.open-hours__date-change .open-hours__prev-date{border-right:1px solid var(--link-blue)}.open-hours__date-change .open-hours__next-date{border-left:1px solid var(--link-blue)}.open-hours__content__top{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-size:0.9rem;font-weight:700;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:0.5rem 0}.open-hours__content__top-label{margin:0.5rem 0 0.5rem 0;text-align:left;width:33.3333333333vw;word-break:break-word}.open-hours__content__top-label:first-child(){margin-right:1rem}.open-hours__content__top-label.luomus{width:50vw}.open-hours__content__top-label.building.luomus{text-align:center}.open-hours__content{position:relative}.open-hours__content.open-hours__loading:after{-webkit-animation-duration:1s;animation-duration:1s;font-size:3.2rem;position:absolute;left:45%;top:35%;z-index:2}.open-hours__content.slide-left{-webkit-animation:slide-left 0.2s ease-in-out both;animation:slide-left 0.2s ease-in-out both}.open-hours__content.slide-left-reverse{-webkit-animation:slide-left-reverse 0.2s ease-in-out reverse both;animation:slide-left-reverse 0.2s ease-in-out reverse both}.open-hours__content.slide-right{-webkit-animation:slide-right 0.2s ease-in-out both;animation:slide-right 0.2s ease-in-out both}.open-hours__content.slide-right-reverse{-webkit-animation:slide-right-reverse 0.2s ease-in-out reverse both;animation:slide-right-reverse 0.2s ease-in-out reverse both}.open-hours__links{margin:1.5rem 0 1rem 0}.open-hours__links .open-hours__link .hy-cta-link{width:100% !important;-webkit-box-pack:start !important;-ms-flex-pack:start !important;justify-content:flex-start !important}.open-hours__links .open-hours__link .hy-cta-link .text{width:100% !important}@-webkit-keyframes slide-right{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(200px);transform:translateX(200px);opacity:0}}@keyframes slide-right{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(200px);transform:translateX(200px);opacity:0}}@-webkit-keyframes slide-right-reverse{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(200px);transform:translateX(200px);opacity:0}}@keyframes slide-right-reverse{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(200px);transform:translateX(200px);opacity:0}}@-webkit-keyframes slide-left{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(-200px);transform:translateX(-200px);opacity:0}}@keyframes slide-left{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(-200px);transform:translateX(-200px);opacity:0}}@-webkit-keyframes slide-left-reverse{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(-200px);transform:translateX(-200px);opacity:0}}@keyframes slide-left-reverse{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}100%{-webkit-transform:translateX(-200px);transform:translateX(-200px);opacity:0}}";const i=class{constructor(t){e(this,t);this.blockTitle=null;this.language=undefined;this.venueType="libraries";this.blockId=undefined;this.nextLabel=undefined;this.prevLabel=undefined;this.listLabel=undefined;this.buildingLabel=undefined;this.customerServiceLabel=undefined;this.date=null;this.dateTitle=null;this.dateType="day";this.multiple=false;this.customLinkTitle=null;this.customLink=null;this.exceptional=false}render(){const e=["hy-open-hours--container",this.exceptional?"hy-open-hours--container--exceptional":""].join(" ");const o=["open-hours__content__top-label",this.venueType].join(" ");const i=["open-hours__content__top-label building",this.venueType].join(" ");return t(a,null,t("div",{class:e,"data-lang":this.language,"data-id":this.blockId,"data-date":this.date,"data-type":this.dateType,"data-multiple":this.multiple},this.blockTitle&&t("h3",{class:"open-hours__title"},this.blockTitle),!this.exceptional&&t("div",{class:"open-hours__date-change"},t("button",{"aria-label":this.prevLabel,class:"icon--arrow-left open-hours__prev-date"},t("hy-icon",{icon:"hy-icon-caret-left",size:18})),t("span",{class:"open-hours__date-change--title"},this.dateTitle),t("button",{"aria-label":this.nextLabel,class:"icon--arrow-right open-hours__next-date"},t("hy-icon",{icon:"hy-icon-caret-right",size:18}))),t("div",{class:"open-hours__content__top"},t("span",{class:o},this.listLabel),t("span",{class:i},this.buildingLabel),this.customerServiceLabel&&t("span",{class:o},this.customerServiceLabel)),t("div",{class:"open-hours__content"},t("slot",null)),this.customLink&&t("div",{class:"open-hours__links"},t("hy-cta-link",{"full-width":true,"link-content":this.customLinkTitle,"sc-label":this.customLinkTitle,url:this.customLink,variant:r.linkList}))),t("hy-box",{mb:"1.75, 1.75, 2, 2.5"}))}};i.style=o;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}:host{display:block}.open-hours__list-item{border-top:1px solid var(--grayscale-medium);color:var(--grayscale-dark-text);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;font-size:0.875rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:0.5rem 0;font-family:var(--main-font-family);text-align:start}.open-hours__list-item--today{background-color:var(--grayscale-light)}.open-hours__list-item--today span:first-child{margin-left:4px;padding-left:4px;margin-right:-8px;font-weight:bold;border-left:2px solid var(--grayscale-black)}.open-hours__list-item>span:not(.luomus){text-align:left;width:33.3333333333vw}.open-hours__list-item>span.luomus{width:50vw}.open-hours__list-item--date{margin-right:1rem}.open-hours__list-item--hours{margin-right:0.2rem}.open-hours__list-item--hours.luomus{text-align:center}";const s=class{constructor(t){e(this,t);this.multiple=false;this.selfServiceLabel=null;this.venueType="libraries";this.dataItems=undefined}dataItemsWatcher(e){this._dataItems=typeof e==="string"?JSON.parse(e):e}componentWillLoad(){this.dataItemsWatcher(this.dataItems)}render(){return t(a,null,this._dataItems.map((e=>{if(!e.service)return;const a=["open-hours__list-item",e.today?"open-hours__list-item--today":""].join(" ");return t("div",{class:a},t("span",{class:"open-hours__list-item--office"},e.today?e.today:e.dateLibrary),t("span",{class:"open-hours__list-item--hours"},e.building),t("span",{class:"open-hours__list-item--service"},e.service))})),this.selfServiceLabel&&t("div",{class:"open-hours__content__top"},t("span",{class:"open-hours__content__top-label"},this.selfServiceLabel)),this._dataItems.map((e=>{if(e.service)return;const a=["open-hours__list-item",e.today?"open-hours__list-item--today":""].join(" ");const r=["open-hours__list-item--hours",this.venueType].join(" ");const o=["open-hours__list-item--office",this.venueType].join(" ");return t("div",{class:a},t("span",{class:o},e.today?e.today:e.dateLibrary),t("span",{class:r},e.building),this.venueType!=="luomus"&&t("span",{class:"open-hours__list-item--service"},"-"))})))}static get watchers(){return{dataItems:["dataItemsWatcher"]}}};s.style=n;export{i as hy_opening_hours,s as hy_opening_hours_content};
+//# sourceMappingURL=hy-opening-hours_2.entry.js.map

package/dist/huds-lib/hy-opening-hours_2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hyOpeningHoursCss","HyOpeningHours","render","containerClasses","this","exceptional","join","listClasses","venueType","buildingClasses","h","Host","class","language","blockId","date","dateType","multiple","blockTitle","prevLabel","icon","size","dateTitle","nextLabel","listLabel","buildingLabel","customerServiceLabel","customLink","customLinkTitle","url","variant","CtaLinkVariants","linkList","mb","hyOpeningHoursContentCss","HyOpeningHoursContent","dataItemsWatcher","data","_dataItems","JSON","parse","componentWillLoad","dataItems","map","item","service","itemClasses","today","dateLibrary","building","selfServiceLabel","hoursClasses","officeClasses"],"sources":["./src/components/hy-opening-hours/hy-opening-hours.scss?tag=hy-opening-hours","./src/components/hy-opening-hours/hy-opening-hours.tsx","./src/components/hy-opening-hours-content/hy-opening-hours-content.scss?tag=hy-opening-hours-content","./src/components/hy-opening-hours-content/hy-opening-hours-content.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-open-hours--container {\n  font-family: var(--main-font-family);\n  max-width: 50rem;\n  overflow: hidden;\n\n  &--exceptional {\n    max-width: 100%;\n  }\n}\n\n.open-hours__title {\n  text-transform: uppercase;\n  margin-bottom: .75rem;\n}\n\n.open-hours__date-change {\n  align-items: center;\n  background-color: var(--grayscale-background-box);\n  color: var(--brand-main);\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n\n  &--title {\n    @include font-size(20px, 24px);\n    @include font-weight($bold);\n\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.5px;\n    text-align: center;\n    text-transform: uppercase;\n  }\n\n  .open-hours__prev-date,\n  .open-hours__next-date {\n    background: none;\n    border: 0;\n    color: var(--brand-main);\n    display: flex;\n    height: 44px;\n    outline: 5px solid var(--grayscale-white);\n    position: relative;\n    width: 44px;\n\n    &:hover {\n      background-color: var(--hover-gray);\n      color: var(--brand-main-active);\n      cursor: pointer;\n    }\n\n    &:focus {\n      background-color: var(--hover-gray);\n      color: var(--brand-main-active);\n    }\n\n    &:disabled {\n      cursor: none;\n    }\n\n    hy-icon {\n      color: var(--link-blue);\n      left: 50%;\n      position: absolute;\n      top: 50%;\n      transform: translate(-50%, -50%);\n    }\n\n    svg {\n      fill: currentColor;\n      height: 20px;\n      width: 20px;\n    }\n  }\n  .open-hours__prev-date {\n    border-right: 1px solid var(--link-blue);\n  }\n  .open-hours__next-date {\n    border-left: 1px solid var(--link-blue);\n  }\n}\n\n.open-hours__content__top {\n  display: flex;\n  flex-direction: row;\n  font-size: 0.9rem;\n  font-weight: 700;\n  justify-content: space-between;\n  padding: 0.5rem 0;\n}\n\n.open-hours__content__top-label {\n  margin: 0.5rem 0 0.5rem 0;\n  text-align: left;\n  width: calc(100vw / 3);\n  word-break: break-word;\n\n  &:first-child() {\n    margin-right: 1rem;\n  }\n}\n\n.open-hours__content__top-label.luomus {\n  width: calc(100vw / 2);\n}\n.open-hours__content__top-label.building.luomus {\n  text-align: center;\n}\n\n.open-hours__content {\n  position: relative;\n\n  &.open-hours__loading {\n    &:after {\n      animation-duration: 1s;\n      font-size: 3.2rem;\n      position: absolute;\n      left: 45%;\n      top: 35%;\n      z-index: 2;\n    }\n  }\n\n  $animation-duraction: 0.2s;\n\n  &.slide-left {\n    -webkit-animation: slide-left $animation-duraction ease-in-out both;\n    animation: slide-left $animation-duraction ease-in-out both;\n  }\n\n  &.slide-left-reverse {\n    -webkit-animation: slide-left-reverse $animation-duraction ease-in-out reverse both;\n    animation: slide-left-reverse $animation-duraction ease-in-out reverse both;\n  }\n\n  &.slide-right {\n    -webkit-animation: slide-right $animation-duraction ease-in-out both;\n    animation: slide-right $animation-duraction ease-in-out both;\n  }\n\n  &.slide-right-reverse {\n    -webkit-animation: slide-right-reverse $animation-duraction ease-in-out reverse both;\n    animation: slide-right-reverse $animation-duraction ease-in-out reverse both;\n  }\n}\n\n.open-hours__links {\n  margin: 1.5rem 0 1rem 0;\n\n  .open-hours__link .hy-cta-link {\n    width: 100% !important;\n    justify-content: flex-start !important;\n\n    .text {\n      width: 100% !important;\n    }\n  }\n}\n\n@-webkit-keyframes slide-right {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(200px);\n    transform: translateX(200px);\n    opacity: 0;\n  }\n}\n@keyframes slide-right {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(200px);\n    transform: translateX(200px);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes slide-right-reverse {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(200px);\n    transform: translateX(200px);\n    opacity: 0;\n  }\n}\n@keyframes slide-right-reverse {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(200px);\n    transform: translateX(200px);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes slide-left {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(-200px);\n    transform: translateX(-200px);\n    opacity: 0;\n  }\n}\n@keyframes slide-left {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(-200px);\n    transform: translateX(-200px);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes slide-left-reverse {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(-200px);\n    transform: translateX(-200px);\n    opacity: 0;\n  }\n}\n@keyframes slide-left-reverse {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n    opacity: 1;\n  }\n  100% {\n    -webkit-transform: translateX(-200px);\n    transform: translateX(-200px);\n    opacity: 0;\n  }\n}\n","import {Component, Host, h, Prop} from \"@stencil/core\";\nimport {CtaLinkVariants} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-opening-hours\",\n  styleUrl: \"hy-opening-hours.scss\",\n  shadow: false,\n})\nexport class HyOpeningHours {\n  @Prop() blockTitle: string = null;\n  @Prop() language?: string;\n  @Prop() venueType: string = \"libraries\";\n  @Prop() blockId?: string;\n  @Prop() nextLabel?: string;\n  @Prop() prevLabel?: string;\n  @Prop() listLabel?: string;\n  @Prop() buildingLabel?: string;\n  @Prop() customerServiceLabel?: string;\n  @Prop() date: string = null;\n  @Prop() dateTitle: string = null;\n  @Prop() dateType: string = \"day\";\n  @Prop() multiple: boolean = false;\n  @Prop() customLinkTitle: string = null;\n  @Prop() customLink: string = null;\n  @Prop() exceptional: boolean = false;\n\n  render() {\n    const containerClasses = [\n      \"hy-open-hours--container\",\n      this.exceptional ? \"hy-open-hours--container--exceptional\" : \"\",\n    ].join(\" \");\n\n    const listClasses = [\"open-hours__content__top-label\", this.venueType].join(\" \");\n    const buildingClasses = [\"open-hours__content__top-label building\", this.venueType].join(\" \");\n    return (\n      <Host>\n        <div\n          class={containerClasses}\n          data-lang={this.language}\n          data-id={this.blockId}\n          data-date={this.date}\n          data-type={this.dateType}\n          data-multiple={this.multiple}\n        >\n          {this.blockTitle && <h3 class=\"open-hours__title\">{this.blockTitle}</h3>}\n          {!this.exceptional && (\n            <div class=\"open-hours__date-change\">\n              <button aria-label={this.prevLabel} class=\"icon--arrow-left open-hours__prev-date\">\n                <hy-icon icon={\"hy-icon-caret-left\"} size={18} />\n              </button>\n              <span class=\"open-hours__date-change--title\">{this.dateTitle}</span>\n              <button aria-label={this.nextLabel} class=\"icon--arrow-right open-hours__next-date\">\n                <hy-icon icon={\"hy-icon-caret-right\"} size={18} />\n              </button>\n            </div>\n          )}\n          <div class=\"open-hours__content__top\">\n            <span class={listClasses}>{this.listLabel}</span>\n            <span class={buildingClasses}>{this.buildingLabel}</span>\n            {this.customerServiceLabel && <span class={listClasses}>{this.customerServiceLabel}</span>}\n          </div>\n          <div class=\"open-hours__content\">\n            <slot />\n          </div>\n          {this.customLink && (\n            <div class=\"open-hours__links\">\n              <hy-cta-link\n                full-width\n                link-content={this.customLinkTitle}\n                sc-label={this.customLinkTitle}\n                url={this.customLink}\n                variant={CtaLinkVariants.linkList}\n              >\n              </hy-cta-link>\n            </div>\n          )}\n        </div>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n",":host {\n  display: block;\n}\n\n.open-hours__list-item {\n  border-top: 1px solid var(--grayscale-medium);\n  color: var(--grayscale-dark-text);\n  display: flex;\n  flex-direction: row;\n  font-size: 0.875rem;\n  justify-content: space-between;\n  padding: 0.5rem 0;\n  font-family: var(--main-font-family);\n  text-align: start;\n\n  &--today {\n    background-color: var(--grayscale-light);\n\n    span:first-child {\n      margin-left: 4px;\n      padding-left: 4px;\n      margin-right: -8px;\n      font-weight: bold;\n      border-left: 2px solid var(--grayscale-black);\n    }\n  }\n\n  & > span:not(.luomus) {\n    text-align: left;\n    width: calc(100vw / 3);\n  }\n  & > span.luomus {\n    width: calc(100vw / 2);\n  }\n\n  &--date {\n    margin-right: 1rem;\n  }\n\n  &--hours {\n    margin-right: 0.2rem;\n  }\n\n  &--hours.luomus {\n    text-align: center;\n  }\n}\n","export interface items {\n  dateLibrary: string;\n  building: string;\n  service: string;\n  today: string;\n}\n\nimport {Component, Host, h, Prop, Watch} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-opening-hours-content\",\n  styleUrl: \"hy-opening-hours-content.scss\",\n  shadow: false,\n})\nexport class HyOpeningHoursContent {\n  @Prop() multiple: boolean = false;\n  @Prop() selfServiceLabel: string = null;\n  @Prop() venueType: string = \"libraries\";\n\n  private _dataItems: items[];\n\n  @Prop() dataItems: items[] | string;\n\n  @Watch(\"dataItems\") dataItemsWatcher(data: items[] | string) {\n    this._dataItems = typeof data === \"string\" ? JSON.parse(data) : data;\n  }\n\n  componentWillLoad() {\n    this.dataItemsWatcher(this.dataItems);\n  }\n\n  render() {\n    return (\n      <Host>\n        {this._dataItems.map((item) => {\n          if (!item.service) return;\n          const itemClasses = [\"open-hours__list-item\", item.today ? \"open-hours__list-item--today\" : \"\"].join(\" \");\n          return (\n            <div class={itemClasses}>\n              <span class=\"open-hours__list-item--office\">{item.today ? item.today : item.dateLibrary}</span>\n              <span class=\"open-hours__list-item--hours\">{item.building}</span>\n              <span class=\"open-hours__list-item--service\">{item.service}</span>\n            </div>\n          );\n        })}\n        {this.selfServiceLabel && (\n          <div class=\"open-hours__content__top\">\n            <span class=\"open-hours__content__top-label\">{this.selfServiceLabel}</span>\n          </div>\n        )}\n        {this._dataItems.map((item) => {\n          if (item.service) return;\n          const itemClasses = [\"open-hours__list-item\", item.today ? \"open-hours__list-item--today\" : \"\"].join(\" \");\n\n          const hoursClasses = [\"open-hours__list-item--hours\", this.venueType].join(\" \");\n          const officeClasses = [\"open-hours__list-item--office\", this.venueType].join(\" \");\n          return (\n            <div class={itemClasses}>\n              <span class={officeClasses}>{item.today ? item.today : item.dateLibrary}</span>\n              <span class={hoursClasses}>{item.building}</span>\n              {this.venueType !== \"luomus\" && <span class=\"open-hours__list-item--service\">-</span>}\n            </div>\n          );\n        })}\n      </Host>\n    );\n  }\n}\n"],"mappings":"8FAAA,MAAMA,EAAoB,41M,MCQbC,EAAc,M,yCACI,K,uCAED,Y,6KAOL,K,eACK,K,cACD,M,cACC,M,qBACM,K,gBACL,K,iBACE,K,CAE/BC,SACE,MAAMC,EAAmB,CACvB,2BACAC,KAAKC,YAAc,wCAA0C,IAC7DC,KAAK,KAEP,MAAMC,EAAc,CAAC,iCAAkCH,KAAKI,WAAWF,KAAK,KAC5E,MAAMG,EAAkB,CAAC,0CAA2CL,KAAKI,WAAWF,KAAK,KACzF,OACEI,EAACC,EAAI,KACHD,EAAA,OACEE,MAAOT,EAAgB,YACZC,KAAKS,SAAQ,UACfT,KAAKU,QAAO,YACVV,KAAKW,KAAI,YACTX,KAAKY,SAAQ,gBACTZ,KAAKa,UAEnBb,KAAKc,YAAcR,EAAA,MAAIE,MAAM,qBAAqBR,KAAKc,aACtDd,KAAKC,aACLK,EAAA,OAAKE,MAAM,2BACTF,EAAA,uBAAoBN,KAAKe,UAAWP,MAAM,0CACxCF,EAAA,WAASU,KAAM,qBAAsBC,KAAM,MAE7CX,EAAA,QAAME,MAAM,kCAAkCR,KAAKkB,WACnDZ,EAAA,uBAAoBN,KAAKmB,UAAWX,MAAM,2CACxCF,EAAA,WAASU,KAAM,sBAAuBC,KAAM,OAIlDX,EAAA,OAAKE,MAAM,4BACTF,EAAA,QAAME,MAAOL,GAAcH,KAAKoB,WAChCd,EAAA,QAAME,MAAOH,GAAkBL,KAAKqB,eACnCrB,KAAKsB,sBAAwBhB,EAAA,QAAME,MAAOL,GAAcH,KAAKsB,uBAEhEhB,EAAA,OAAKE,MAAM,uBACTF,EAAA,cAEDN,KAAKuB,YACJjB,EAAA,OAAKE,MAAM,qBACTF,EAAA,gDAEgBN,KAAKwB,gBAAe,WACxBxB,KAAKwB,gBACfC,IAAKzB,KAAKuB,WACVG,QAASC,EAAgBC,aAMjCtB,EAAA,UAAQuB,GAAG,uB,aC7EnB,MAAMC,EAA2B,slE,MCcpBC,EAAqB,M,uCACJ,M,sBACO,K,eACP,Y,yBAMRC,iBAAiBC,GACnCjC,KAAKkC,kBAAoBD,IAAS,SAAWE,KAAKC,MAAMH,GAAQA,C,CAGlEI,oBACErC,KAAKgC,iBAAiBhC,KAAKsC,U,CAG7BxC,SACE,OACEQ,EAACC,EAAI,KACFP,KAAKkC,WAAWK,KAAKC,IACpB,IAAKA,EAAKC,QAAS,OACnB,MAAMC,EAAc,CAAC,wBAAyBF,EAAKG,MAAQ,+BAAiC,IAAIzC,KAAK,KACrG,OACEI,EAAA,OAAKE,MAAOkC,GACVpC,EAAA,QAAME,MAAM,iCAAiCgC,EAAKG,MAAQH,EAAKG,MAAQH,EAAKI,aAC5EtC,EAAA,QAAME,MAAM,gCAAgCgC,EAAKK,UACjDvC,EAAA,QAAME,MAAM,kCAAkCgC,EAAKC,SAC/C,IAGTzC,KAAK8C,kBACJxC,EAAA,OAAKE,MAAM,4BACTF,EAAA,QAAME,MAAM,kCAAkCR,KAAK8C,mBAGtD9C,KAAKkC,WAAWK,KAAKC,IACpB,GAAIA,EAAKC,QAAS,OAClB,MAAMC,EAAc,CAAC,wBAAyBF,EAAKG,MAAQ,+BAAiC,IAAIzC,KAAK,KAErG,MAAM6C,EAAe,CAAC,+BAAgC/C,KAAKI,WAAWF,KAAK,KAC3E,MAAM8C,EAAgB,CAAC,gCAAiChD,KAAKI,WAAWF,KAAK,KAC7E,OACEI,EAAA,OAAKE,MAAOkC,GACVpC,EAAA,QAAME,MAAOwC,GAAgBR,EAAKG,MAAQH,EAAKG,MAAQH,EAAKI,aAC5DtC,EAAA,QAAME,MAAOuC,GAAeP,EAAKK,UAChC7C,KAAKI,YAAc,UAAYE,EAAA,QAAME,MAAM,kCAAgC,KACxE,I"}

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

@@ -0,0 +1,2 @@
+import{r as e,h as a}from"./index-f84f2a7d.js";import{P as i}from"./utils-7438924c.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-pager{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;font-family:var(--main-font-family);list-style:none;padding:0}";const t=class{constructor(a){e(this,a)}render(){const e=["hy-pager"].join(" ");return a("ul",{class:e},a("slot",null))}};t.style=r;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}:host{display:block}.hy-pager__item{font-size:0.875rem;line-height:24px;font-weight:700;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--brand-main-light);color:var(--grayscale-white);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);-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;letter-spacing:-0.4px;margin-bottom:4px;margin-right:4px;min-height:36px;min-width:36px;text-align:center}@media (min-width: 60rem){.hy-pager__item{margin-right:6px;min-height:40px;min-width:40px}}.hy-pager__item a{font-size:0.875rem;line-height:24px;font-weight:700;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--grayscale-white);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;letter-spacing:-0.4px;min-height:36px;min-width:36px;text-decoration:none}@media (min-width: 60rem){.hy-pager__item a{font-size:1rem;line-height:24px;letter-spacing:-0.5px;min-height:40px;min-width:40px}}.hy-pager__item a:not([aria-current=true]):hover{background-color:var(--brand-main);cursor:pointer}.hy-pager__item__current{background-color:var(--grayscale-white);-webkit-box-sizing:border-box;box-sizing:border-box;border:2px solid var(--grayscale-black)}.hy-pager__item__current a{color:var(--brand-main-nearly-black)}.hy-pager__item__current a:hover{background-color:var(--grayscale-white)}.hy-pager__item__ellipsis{background-color:var(--grayscale-white);color:var(--brand-main-nearly-black);min-width:auto;min-height:auto}.hy-pager__item__next a,.hy-pager__item__previous a{padding:7px 12px 5px 12px}@media (min-width: 60rem){.hy-pager__item__next a,.hy-pager__item__previous a{padding:8px 12px}}.hy-pager__item__next .hy-icon-wrapper,.hy-pager__item__previous .hy-icon-wrapper{margin:0 4px}@media (min-width: 60rem){.hy-pager__item__next .hy-icon-wrapper,.hy-pager__item__previous .hy-icon-wrapper{margin:0 6px}}.hy-pager__item__next .hy-icon-wrapper svg,.hy-pager__item__previous .hy-icon-wrapper svg{fill:var(--grayscale-white)}";const o=class{constructor(a){e(this,a);this.variant=i.default;this.itemLabel=undefined;this.itemUrl=undefined;this.scAriaLabel=undefined}render(){let e=["hy-pager__item"].join(" ");switch(this.variant){case i.current:{e=["hy-pager__item","hy-pager__item__current"].join(" ");return a("li",{class:e},a("a",{href:this.itemUrl,"aria-current":"true"},this.itemLabel))}case i.next:{e=["hy-pager__item","hy-pager__item__next"].join(" ");const i=["link-icon"].join(" ");return a("li",{class:e},a("a",{href:this.itemUrl,"aria-label":this.scAriaLabel},this.itemLabel,a("span",{class:"hy-icon-wrapper"},a("div",{class:i},a("hy-icon",{icon:"hy-icon-arrow-to-right",size:12})))))}case i.previous:{e=["hy-pager__item","hy-pager__item__previous"].join(" ");const i=["link-icon"].join(" ");return a("li",{class:e},a("a",{href:this.itemUrl,"aria-label":this.scAriaLabel},a("span",{class:"hy-icon-wrapper"},a("div",{class:i},a("hy-icon",{icon:"hy-icon-arrow-left",size:12}))),this.itemLabel))}case i.ellipsis:{e=["hy-pager__item","hy-pager__item__ellipsis"].join(" ");return a("li",{class:e},"...")}default:{e=["hy-pager__item"].join(" ");return a("li",{class:e},a("a",{href:this.itemUrl,"aria-label":this.scAriaLabel},this.itemLabel))}}}};o.style=n;export{t as hy_pager,o as hy_pager_item};
+//# sourceMappingURL=hy-pager_2.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["hyPagerCss","HyPager","render","classAttributes","join","h","class","hyPagerItemCss","HyPagerItem","PaginationItemVariants","default","this","variant","current","href","itemUrl","itemLabel","next","iconClassAttributes","scAriaLabel","icon","size","previous","ellipsis"],"sources":["./src/components/hy-pagination/hy-pager/hy-pager.scss?tag=hy-pager&encapsulation=shadow","./src/components/hy-pagination/hy-pager/hy-pager.tsx","./src/components/hy-pagination/hy-pager-item/hy-pager-item.scss?tag=hy-pager-item&encapsulation=shadow","./src/components/hy-pagination/hy-pager-item/hy-pager-item.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-pager {\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  flex-direction: row;\n  flex-wrap: wrap;\n  font-family: var(--main-font-family);\n  list-style: none;\n  padding: 0;\n}\n","import {Component, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-pager\",\n  styleUrl: \"hy-pager.scss\",\n  shadow: true,\n})\nexport class HyPager {\n  render() {\n    const classAttributes = [\"hy-pager\"].join(\" \");\n\n    return (\n      <ul class={classAttributes}>\n        <slot></slot>\n      </ul>\n    );\n  }\n}\n",":host {\n  display: block;\n}\n\n.hy-pager__item {\n  @include font-size(14px, 24px);\n  @include font-weight($bold);\n  align-items: center;\n  background-color: var(--brand-main-light);\n  color: var(--grayscale-white);\n  display: flex;\n  flex-direction: row;\n  font-family: var(--main-font-family);\n  justify-content: center;\n  letter-spacing: -0.4px;\n  margin-bottom: 4px;\n  margin-right: 4px;\n  min-height: 36px;\n  min-width: 36px;\n  text-align: center;\n\n  @include breakpoint($wide) {\n    margin-right: 6px;\n    min-height: 40px;\n    min-width: 40px;\n  }\n\n  a {\n    @include font-size(14px, 24px);\n    @include font-weight($bold);\n    align-items: center;\n    color: var(--grayscale-white);\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    letter-spacing: -0.4px;\n    min-height: 36px;\n    min-width: 36px;\n    text-decoration: none;\n\n    @include breakpoint($wide) {\n      @include font-size(16px, 24px);\n      letter-spacing: -0.5px;\n      min-height: 40px;\n      min-width: 40px;\n    }\n\n    &:not([aria-current=\"true\"]):hover {\n      background-color: var(--brand-main);\n      cursor: pointer;\n    }\n  }\n\n  &__current {\n    background-color: var(--grayscale-white);\n    box-sizing: border-box;\n    border: 2px solid var(--grayscale-black);\n    a {\n      color: var(--brand-main-nearly-black);\n      &:hover {\n        background-color: var(--grayscale-white);\n      }\n    }\n  }\n\n  &__ellipsis {\n    background-color: var(--grayscale-white);\n    color: var(--brand-main-nearly-black);\n    min-width: auto;\n    min-height: auto;\n  }\n\n  &__next,\n  &__previous {\n    a {\n      padding: 7px 12px 5px 12px;\n\n      @include breakpoint($wide) {\n        padding: 8px 12px;\n      }\n    }\n\n    .hy-icon-wrapper {\n      margin: 0 4px;\n      @include breakpoint($wide) {\n        margin: 0 6px;\n      }\n\n      svg {\n        fill: var(--grayscale-white);\n      }\n    }\n  }\n}\n","import {Component, h, Prop} from \"@stencil/core\";\nimport {PaginationItemVariants} from \"../../../utils/utils\";\n\n@Component({\n  tag: \"hy-pager-item\",\n  styleUrl: \"hy-pager-item.scss\",\n  shadow: true,\n})\nexport class HyPagerItem {\n  @Prop() variant: PaginationItemVariants = PaginationItemVariants.default;\n  @Prop() itemLabel?: string;\n  @Prop() itemUrl?: string;\n  @Prop() scAriaLabel?: string;\n\n  render() {\n    let classAttributes = [\"hy-pager__item\"].join(\" \");\n    switch (this.variant) {\n      case PaginationItemVariants.current: {\n        classAttributes = [\"hy-pager__item\", \"hy-pager__item__current\"].join(\" \");\n        return (\n          <li class={classAttributes}>\n            <a href={this.itemUrl} aria-current=\"true\">\n              {this.itemLabel}\n            </a>\n          </li>\n        );\n      }\n      case PaginationItemVariants.next: {\n        classAttributes = [\"hy-pager__item\", \"hy-pager__item__next\"].join(\" \");\n        const iconClassAttributes = [\"link-icon\"].join(\" \");\n        return (\n          <li class={classAttributes}>\n            <a href={this.itemUrl} aria-label={this.scAriaLabel}>\n              {this.itemLabel}\n              <span class={\"hy-icon-wrapper\"}>\n                <div class={iconClassAttributes}>\n                  <hy-icon icon={\"hy-icon-arrow-to-right\"} size={12} />\n                </div>\n              </span>\n            </a>\n          </li>\n        );\n      }\n      case PaginationItemVariants.previous: {\n        classAttributes = [\"hy-pager__item\", \"hy-pager__item__previous\"].join(\" \");\n        const iconClassAttributes = [\"link-icon\"].join(\" \");\n        return (\n          <li class={classAttributes}>\n            <a href={this.itemUrl} aria-label={this.scAriaLabel}>\n              <span class={\"hy-icon-wrapper\"}>\n                <div class={iconClassAttributes}>\n                  <hy-icon icon={\"hy-icon-arrow-left\"} size={12} />\n                </div>\n              </span>\n              {this.itemLabel}\n            </a>\n          </li>\n        );\n      }\n      case PaginationItemVariants.ellipsis: {\n        classAttributes = [\"hy-pager__item\", \"hy-pager__item__ellipsis\"].join(\" \");\n        return <li class={classAttributes}>...</li>;\n      }\n      default: {\n        classAttributes = [\"hy-pager__item\"].join(\" \");\n        return (\n          <li class={classAttributes}>\n            <a href={this.itemUrl} aria-label={this.scAriaLabel}>\n              {this.itemLabel}\n            </a>\n          </li>\n        );\n      }\n    }\n  }\n}\n"],"mappings":"uFAAA,MAAMA,EAAa,gkD,MCONC,EAAO,M,yBAClBC,SACE,MAAMC,EAAkB,CAAC,YAAYC,KAAK,KAE1C,OACEC,EAAA,MAAIC,MAAOH,GACTE,EAAA,a,aCbR,MAAME,EAAiB,o6G,MCQVC,EAAW,M,sCACoBC,EAAuBC,Q,2EAKjER,SACE,IAAIC,EAAkB,CAAC,kBAAkBC,KAAK,KAC9C,OAAQO,KAAKC,SACX,KAAKH,EAAuBI,QAAS,CACnCV,EAAkB,CAAC,iBAAkB,2BAA2BC,KAAK,KACrE,OACEC,EAAA,MAAIC,MAAOH,GACTE,EAAA,KAAGS,KAAMH,KAAKI,QAAO,eAAe,QACjCJ,KAAKK,W,CAKd,KAAKP,EAAuBQ,KAAM,CAChCd,EAAkB,CAAC,iBAAkB,wBAAwBC,KAAK,KAClE,MAAMc,EAAsB,CAAC,aAAad,KAAK,KAC/C,OACEC,EAAA,MAAIC,MAAOH,GACTE,EAAA,KAAGS,KAAMH,KAAKI,QAAO,aAAcJ,KAAKQ,aACrCR,KAAKK,UACNX,EAAA,QAAMC,MAAO,mBACXD,EAAA,OAAKC,MAAOY,GACVb,EAAA,WAASe,KAAM,yBAA0BC,KAAM,Q,CAO3D,KAAKZ,EAAuBa,SAAU,CACpCnB,EAAkB,CAAC,iBAAkB,4BAA4BC,KAAK,KACtE,MAAMc,EAAsB,CAAC,aAAad,KAAK,KAC/C,OACEC,EAAA,MAAIC,MAAOH,GACTE,EAAA,KAAGS,KAAMH,KAAKI,QAAO,aAAcJ,KAAKQ,aACtCd,EAAA,QAAMC,MAAO,mBACXD,EAAA,OAAKC,MAAOY,GACVb,EAAA,WAASe,KAAM,qBAAsBC,KAAM,OAG9CV,KAAKK,W,CAKd,KAAKP,EAAuBc,SAAU,CACpCpB,EAAkB,CAAC,iBAAkB,4BAA4BC,KAAK,KACtE,OAAOC,EAAA,MAAIC,MAAOH,GAAe,M,CAEnC,QAAS,CACPA,EAAkB,CAAC,kBAAkBC,KAAK,KAC1C,OACEC,EAAA,MAAIC,MAAOH,GACTE,EAAA,KAAGS,KAAMH,KAAKI,QAAO,aAAcJ,KAAKQ,aACrCR,KAAKK,W"}