@itcenteratunihelsinki/huds-lib 0.8.73 → 0.8.75

package/dist/esm/hy-link.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-link.entry.js","mappings":";;;AAAA,MAAM,OAAO,GAAG,khDAAkhD;;MCQrhD,IAAI;;;mBACiB,YAAY,CAAC,OAAO;uBACtB,EAAE;;;sBAGF,KAAK;;EAEnC,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IAClD,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;IAEpD,QACE,EAAC,IAAI,QACH,uBAAe,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,IAC1F,IAAI,CAAC,WAAW,CACf,CACC,EACP;GACH;;;;;;","names":[],"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"],"version":3}

package/dist/esm/hy-list-item.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-list-item.entry.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,gugBAAgugB;;ACsBtvgB,IAAI,IAAI,GAAG;EACT,KAAK,EAAE,OAAO;EACd,KAAK,EAAE,OAAO;CACf,CAAC;MAOW,UAAU;;;oCAEwB,KAAK;mBACd,gBAAgB,CAAC,OAAO;;;;;sBAK9B,KAAK;;;;uBAIJ,KAAK;;;;4BAKA,sBAAsB;;uBAG5B,QAAQ;;+BAGC,KAAK;yBACZ,GAAG;2BAEA,CAAC;0BACF,CAAC;;EAGnC,mBAAmB,CAAC,QAAgC;IAClD,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;KAC3C;SAAM;MACL,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC;KAC/B;GACF;EAGD,qBAAqB,CAAC,QAAmC;IACvD,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;KAC7C;SAAM;MACL,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC;KACjC;GACF;EAEmB,aAAa,CAAC,IAA4B;IAC5D,IAAI,CAAC,UAAU,GAAG,OAAO,IAAI,KAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;GACtE;EAED,sBAAsB,CAAC,MAAM;IAC3B,IAAI,eAAe,GAAG,yBAAyB,IAAI,CAAC,OAAO,yBAAyB,CAAC;IACrF,IAAI,iBAAiB,GAAG,6DAA6D,CAAC;IACtF,IAAI,cAAc,GAAG,QAAQ,CAAC,gBAAgB,CAAC,qBAAqB,MAAM,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAgB,CAAC;IACrG,IAAI,cAAc,EAAE;MAClB,IAAI,CAAC,IAAI,CAAC,wBAAwB,EAAE;QAClC,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,eAAe,WAAW,CAAC,CAAC;QAC5D,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,iBAAiB,WAAW,CAAC,CAAC;OACvD;WAAM;QACL,cAAc,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,eAAe,WAAW,CAAC,CAAC;QAC/D,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,iBAAiB,WAAW,CAAC,CAAC;OAC1D;MACD,IAAI,CAAC,wBAAwB,GAAG,CAAC,IAAI,CAAC,wBAAwB,CAAC;KAChE;GACF;EAGD,aAAa,CAAC,KAAoB;IAChC,MAAM,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC;IACvB,IAAI,MAAM,GAAG,KAAK,CAAC,MAA2B,CAAC;IAE/C,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;IACnD,MAAM,YAAY,GAAG,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAEjG,IACE,MAAM;MACN,YAAY;MACZ,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,kDAAkD,CAAC;MAC9E,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,EACtC;MACA,IAAI,aAAa,KAAK,QAAQ,EAAE;QAC9B,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,0BAA0B,IAAI,CAAC,OAAO,iCAAiC,CAAC,CAAC;OAClG;MACD,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;MACpC,KAAK,CAAC,cAAc,EAAE,CAAC;KACxB;GACF;EAGD,WAAW,CAAC,KAAK;IACf,IAAI,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;IACzC,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;IACnD,MAAM,YAAY,GAAG,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAEjG,IAAI,MAAM,IAAI,YAAY,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,kDAAkD,CAAC,EAAE;MAC5G,IAAI,aAAa,KAAK,QAAQ,EAAE;QAC9B,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,0BAA0B,IAAI,CAAC,OAAO,iCAAiC,CAAC,CAAC;OAClG;MACD,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;MACpC,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;KAClC;GACF;EAED,iBAAiB;IACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC5C,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAChD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GACpC;EAED,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;IACD,IAAI,IAAI,CAAC,OAAO,IAAI,gBAAgB,CAAC,eAAe,EAAE;MACpD,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,mDAAmD,CAAQ,CAAC;MAEjG,IAAI,KAAK,EAAE;QACT,KAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE;UAC7B,MAAM,sBAAsB,GAAG,CAAC,CAAC;UACjC,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC;UACxC,MAAM,UAAU,GAAG,KAAK,CAAC,YAAY,CAAC;UACtC,MAAM,qBAAqB,GAAG,UAAU,GAAG,WAAW,CAAC;UACvD,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC;UACjC,IAAI,CAAC,eAAe,GAAG,WAAW,CAAC;UACnC,IAAI,qBAAqB,GAAG,sBAAsB,EAAE;YAClD,IAAI,CAAC,cAAc,GAAG,WAAW,GAAG,sBAAsB,CAAC;WAC5D;eAAM,IAAI,qBAAqB,GAAG,sBAAsB,EAAE;YACzD,IAAI,CAAC,eAAe,GAAG,UAAU,GAAG,sBAAsB,CAAC;WAC5D;SACF,CAAC,CAAC;OACJ;KACF;GACF;EAED,MAAM;IACJ,MAAM,sBAAsB,GAAG;MAC7B,sBAAsB;MACtB,yBAAyB,IAAI,CAAC,OAAO,EAAE;MACvC,yBAAyB,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,WAAW,EAAE;KAC7D,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACZ,MAAM,eAAe,GAAG,CAAC,cAAc,EAAE,iBAAiB,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACpF,MAAM,4BAA4B,GAAG;MACnC,iBAAiB,IAAI,CAAC,OAAO,kBAAkB;MAC/C,iBAAiB,IAAI,CAAC,OAAO,qBAAqB,IAAI,CAAC,WAAW,EAAE;KACrE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;;;;;IAKZ,MAAM,wBAAwB,GAAG;MAC/B,iBAAiB,IAAI,CAAC,OAAO,0BAA0B;MACvD,iBAAiB,IAAI,CAAC,OAAO,6BAA6B,IAAI,CAAC,WAAW,EAAE;KAC7E,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACZ,MAAM,uBAAuB,GAAG;MAC9B,iBAAiB,IAAI,CAAC,OAAO,yBAAyB;MACtD,iBAAiB,IAAI,CAAC,OAAO,4BAA4B,IAAI,CAAC,WAAW,EAAE;KAC5E,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACZ,MAAM,6BAA6B,GAAG;MACpC,iBAAiB,IAAI,CAAC,OAAO,+BAA+B;MAC5D,iBAAiB,IAAI,CAAC,OAAO,kCAAkC,IAAI,CAAC,WAAW,EAAE;KAClF,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACZ,MAAM,+BAA+B,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,kCAAkC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACpH,MAAM,0BAA0B,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,8BAA8B,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC3G,MAAM,sBAAsB,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,wBAAwB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEjG,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;IAEpD,SAAS,QAAQ,CAAC,GAAG,EAAE,CAAC;MACtB,OAAO,GAAG,CAAC,MAAM,GAAG,CAAC,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC;KAC5D;IAED,QAAQ,IAAI,CAAC,OAAO;MAClB,KAAK,gBAAgB,CAAC,QAAQ,EAAE;QAC9B,MAAM,8BAA8B,GAAG;UACrC,iBAAiB,IAAI,CAAC,OAAO,iCAAiC;UAC9D,iBAAiB,IAAI,CAAC,OAAO,oCAAoC,IAAI,CAAC,WAAW,EAAE;SACpF,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACZ,QACE,WAAK,KAAK,EAAC,uBAAuB,IAChC,SAAG,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,gBAAc,IAAI,CAAC,OAAO,IACjF,WAAK,KAAK,EAAE,4BAA4B,IACtC,WAAK,KAAK,EAAE,wBAAwB,IAClC,WAAK,KAAK,EAAC,MAAM,IACf,eAAS,IAAI,EAAE,6BAA6B,EAAE,IAAI,EAAE,EAAE,GAAI,CACtD,EACL,IAAI,CAAC,QAAQ,CACV,EACN,WAAK,KAAK,EAAE,uBAAuB,IAAG,IAAI,CAAC,SAAS,CAAO,EAE1D,IAAI,CAAC,eAAe,KACnB,WACE,KAAK,EAAE,6BAA6B,EACpC,SAAS,EACP,IAAI,CAAC,mBAAmB;cACpB,QAAQ,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,aAAa,CAAC;cAClD,IAAI,CAAC,eAAe,GAErB,CACR,CACG,EACN,WAAK,KAAK,EAAE,8BAA8B,IACxC,YAAM,KAAK,EAAC,MAAM,IAChB,eAAS,IAAI,EAAE,cAAc,EAAE,IAAI,EAAE,EAAE,GAAY,CAC9C,EACP,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,gBAAgB,CAAQ,CAC9C,CACJ,CACA,EACN;OACH;MACD,KAAK,gBAAgB,CAAC,eAAe,EAAE;QACrC,MAAM,6BAA6B,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,mBAAmB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACnG,MAAM,wBAAwB,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,0BAA0B,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAErG,MAAM,0CAA0C,GAAG;UACjD,iBAAiB,IAAI,CAAC,OAAO,mCAAmC;UAChE,iBAAiB,IAAI,CAAC,OAAO,sCAAsC,IAAI,CAAC,WAAW,EAAE;SACtF,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAEZ,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,GAAG,EAAE,GAAG,WAAW,CAAC;QACtG,MAAM,oBAAoB,GAAG;UAC3B,iBAAiB,IAAI,CAAC,OAAO,oCAAoC;UACjE,kBAAkB;SACnB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACZ,MAAM,mBAAmB,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,mCAAmC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAEzG,MAAM,8BAA8B,GAAG;UACrC,iBAAiB,IAAI,CAAC,OAAO,iCAAiC;UAC9D,iBAAiB,IAAI,CAAC,OAAO,oCAAoC,IAAI,CAAC,WAAW,EAAE;SACpF,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACZ,MAAM,iCAAiC,GAAG;UACxC,iBAAiB,IAAI,CAAC,OAAO,uCAAuC;SACrE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAEZ,MAAM,yBAAyB,GAAG;UAChC,yBAAyB,IAAI,CAAC,OAAO,gBAAgB;UACrD,yBAAyB,IAAI,CAAC,OAAO,mBAAmB,IAAI,CAAC,WAAW,EAAE;SAC3E,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACZ,MAAM,uBAAuB,GAAG,CAAC,yBAAyB,IAAI,CAAC,OAAO,yBAAyB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC3G,MAAM,2BAA2B,GAAG,CAAC,yBAAyB,IAAI,CAAC,OAAO,+BAA+B,CAAC,CAAC,IAAI,CAC7G,GAAG,CACJ,CAAC;QACF,MAAM,6BAA6B,GAAG;UACpC,yBAAyB,IAAI,CAAC,OAAO,iCAAiC;SACvE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACZ,MAAM,2BAA2B,GAAG,CAAC,yBAAyB,IAAI,CAAC,OAAO,+BAA+B,CAAC,CAAC,IAAI,CAC7G,GAAG,CACJ,CAAC;QACF,MAAM,uBAAuB,GAAG,CAAC,yBAAyB,IAAI,CAAC,OAAO,yBAAyB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC3G,MAAM,oBAAoB,GAAG,CAAC,yBAAyB,IAAI,CAAC,OAAO,sBAAsB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAErG,MAAM,SAAS,GACb,IAAI,CAAC,sBAAsB,IAAI,IAAI,CAAC,sBAAsB,CAAC,MAAM,GAAG,CAAC;YACjE,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,sBAAsB,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;YACpF,EAAE,CAAC;QACT,MAAM,iBAAiB,GAAG,GAAG,GAAG,SAAS,GAAG,SAAS,CAAC;QAEtD,MAAM,iBAAiB,GACrB,IAAI,CAAC,sBAAsB,IAAI,IAAI,CAAC,sBAAsB,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,EAAE,CAAC;QAEzG,OAAO;UACL,eAAS,KAAK,EAAE,sBAAsB,IACpC,SAAG,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,gBAAc,IAAI,CAAC,OAAO,IACjF,WAAK,KAAK,EAAE,6BAA6B,IACvC,WAAK,KAAK,EAAE,wBAAwB,IACjC,IAAI,CAAC,UAAU,IACd,mBACG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,IAAI,MACxB,cACE,MAAM,EAAE,IAAI,CAAC,GAAG,EAChB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,EAAE,GACnC,CACH,CAAC,EACF,WACE,OAAO,EAAE,IAAI,CAAC,WAAW,GAAG,OAAO,GAAG,MAAM,iBAChC,MAAM,EAClB,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,KAAK,EAAE;cACL,aAAa,EAAE,GAAG,IAAI,CAAC,eAAe,IAAmB;cACzD,YAAY,EAAE,GAAG,IAAI,CAAC,cAAc,IAAkB;aACvD,GACD,CACM,KAEV,WACE,OAAO,EAAE,IAAI,CAAC,WAAW,GAAG,OAAO,GAAG,MAAM,iBAChC,MAAM,EAClB,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,KAAK,EAAE;cACL,aAAa,EAAE,GAAG,IAAI,CAAC,eAAe,IAAmB;cACzD,YAAY,EAAE,GAAG,IAAI,CAAC,cAAc,IAAkB;aACvD,GACD,CACH,CACG,EACL,IAAI,CAAC,UAAU,IAAI,gBAAO,IAAI,CAAC,UAAU,CAAQ,CAC9C,EACN,WAAK,KAAK,EAAE,4BAA4B,IACtC,WAAK,KAAK,EAAE,mBAAmB,IAC7B,WAAK,KAAK,EAAE,uBAAuB,IAAG,IAAI,CAAC,SAAS,CAAO,EAC1D,IAAI,CAAC,eAAe,KACnB,WAAK,KAAK,EAAE,6BAA6B,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,GAAQ,CACnF,CACG,EACN,WAAK,KAAK,EAAE,oBAAoB,IAC7B,IAAI,CAAC,eAAe,KACnB,WAAK,KAAK,EAAE,0CAA0C,IACnD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC;YAC1B,IAAI,oCAAoC,GAAG;cACzC,iBAAiB,IAAI,CAAC,OAAO,yCAAyC;cACtE,iBAAiB,IAAI,CAAC,OAAO,4CAA4C,IAAI,CAAC,WAAW,EAAE;cAC3F,GAAG,CAAC,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,MAAM,GAAG,QAAQ,GAAG,EAAE,EAAE;aACrD,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACZ,OAAO,WAAK,KAAK,EAAE,oCAAoC,IAAG,CAAC,CAAC,IAAI,CAAO,CAAC;WACzE,CAAC,CACE,CACP,EACD,WAAK,KAAK,EAAE,8BAA8B,IACxC,SACE,IAAI,EAAE,IAAI,CAAC,GAAG,EACd,MAAM,EAAE,MAAM,gBACF,IAAI,CAAC,OAAO,EACxB,KAAK,EAAE,iCAAiC,EACxC,QAAQ,EAAC,IAAI,IAEb,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,gBAAgB,CAAQ,EAClD,YAAM,KAAK,EAAC,cAAc,IACxB,WAAK,KAAK,EAAC,MAAM,IACf,eAAS,IAAI,EAAE,wBAAwB,EAAE,IAAI,EAAE,EAAE,GAAI,CACjD,CACD,CACL,CACA,CACF,CACF,CACJ,EACH,IAAI,CAAC,sBAAsB,KAC1B,WAAK,KAAK,EAAE,yBAAyB,IACnC,WAAK,KAAK,EAAE,uBAAuB,IACjC,SAAG,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,2BAA2B,EAAE,QAAQ,EAAC,IAAI,IAC3E,+BACgB,OAAO,mBACN,GAAG,SAAS,WAAW,EACtC,KAAK,EAAE,6BAA6B,EACpC,EAAE,EAAE,GAAG,SAAS,SAAS,IAEzB,YAAM,KAAK,EAAE,2BAA2B,IACtC,eAAS,IAAI,EAAE,oBAAoB,EAAE,IAAI,EAAE,EAAE,GAAI,CAC5C,EACN,IAAI,CAAC,sBAAsB,QAAI,iBAAiB,MAC1C,CACP,CACA,EACN,WACE,KAAK,EAAE,uBAAuB,qBACb,GAAG,SAAS,SAAS,EACtC,EAAE,EAAE,GAAG,SAAS,WAAW,EAC3B,IAAI,EAAC,QAAQ,iBACD,MAAM,IAEjB,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;YACxB,IAAI,iBAAiB,GAAG,CAAC,CAAC,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;YAC1D,QACE,SAAG,KAAK,EAAE,oBAAoB,EAAE,IAAI,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,gBAAc,iBAAiB,IACvF,CAAC,CAAC,KAAK,CACN,EACJ;WACH,CAAC,CACE,CACF,CACP,CACO;SACX,CAAC;OACH;MACD,SAAS;QACP,QACE,mBACE,SAAG,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,gBAAc,IAAI,CAAC,OAAO,IACjF,WAAK,KAAK,EAAE,4BAA4B,IACtC,WAAK,KAAK,EAAE,wBAAwB,IAAG,IAAI,CAAC,QAAQ,CAAO,EAC3D,WAAK,KAAK,EAAE,uBAAuB,IAAG,IAAI,CAAC,SAAS,CAAO,EAE3D,WAAK,KAAK,EAAE,+BAA+B,IACzC,YAAM,KAAK,EAAE,0BAA0B,IACrC,eAAS,IAAI,EAAE,cAAc,EAAE,IAAI,EAAE,EAAE,GAAI,CACtC,EACP,WAAK,KAAK,EAAE,sBAAsB,IAAG,IAAI,CAAC,GAAG,CAAO,CAChD,EAEL,IAAI,CAAC,eAAe,KACnB,WAAK,KAAK,EAAE,6BAA6B,EAAE,SAAS,EAAE,IAAI,CAAC,eAAe,GAAQ,CACnF,CACG,CACJ,CACI,EACV;OACH;KACF;GACF;;;;;;;;;;;;","names":[],"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          <div class=\"hy-list-item__wrapper\">\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          </div>\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"],"version":3}

package/dist/esm/hy-logo-grid_2.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-logo-grid.hy-logo-grid-item.entry.js","mappings":";;AAAA,MAAMA,eAAa,GAAG,g3FAAg3F;;MCOz3F,UAAU;;;;;;EAIrB,MAAM;IACJ,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;IAE3C,QACE,WAAK,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,eAAe,IAC3C,IAAI,CAAC,aAAa,IAAI,EAAC,cAAc,IAAC,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,aAAa,CAAkB,EACxG,WAAK,KAAK,EAAC,sBAAsB,IAC/B,eAAQ,CACJ,CACF,EACN;GACH;;;;ACtBH,MAAM,aAAa,GAAG,g3FAAg3F;;MCOz3F,cAAc;;;;;;EAIzB,MAAM;IACJ,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3C,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAE5D,OAAO,WAAW,CAAC,GAAG,CAAC,CAAC,EAAC,aAAa,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,EAAC;MACvF,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;MAE1C,MAAM,cAAc,IAClB,cAAQ,KAAK,EAAC,sBAAsB,IACjC,aAAa,KACZ,mBACG,aAAa,CAAC,GAAG,CAAC,CAAC,EAAC,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAC,MAC3C,cAAQ,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,GAAG,KAAK,GAAG,EAAE,GAAI,CAC7E,CAAC,EACF,WAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,GAAI,CAC5B,CACX,EACA,CAAC,aAAa,IAAI,WAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,GAAI,CAChD,CACV,CAAC;MAEF,IAAI,UAAU,EAAE;QACd,MAAM,EAAC,GAAG,EAAE,MAAM,EAAC,GAAG,UAAU,CAAC;QACjC,MAAM,WAAW,GAAG,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;QAE3D,QACE,SAAG,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAC,oBAAoB,IAC1D,cAAc,CACb,EACJ;OACH;MAED,OAAO,cAAc,CAAC;KACvB,CAAC,CAAC;GACJ;;;;;;","names":["hyLogoGridCss"],"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"],"version":3}

package/dist/esm/hy-main.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-main.entry.js","mappings":";;AAAA,MAAM,SAAS,GAAG,g9EAAg9E;;MCOr9E,MAAM;;;sBACa,KAAK;;EAEnC,MAAM;IACJ,MAAM,eAAe,GAAG;MACtB,SAAS;MACT,IAAI,CAAC,UAAU,GAAG,cAAc,GAAG,iBAAiB;MACpD,IAAI,CAAC,UAAU,GAAG,iBAAiB,GAAG,gBAAgB;KACvD,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,QACE,WAAK,KAAK,EAAE,eAAe,IACzB,eAAQ,CACJ,EACN;GACH;;;;;;","names":[],"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"],"version":3}

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

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

package/dist/esm/hy-opening-hours_2.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-opening-hours.hy-opening-hours-content.entry.js","mappings":"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","names":[],"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"],"version":3}

package/dist/esm/hy-pager_2.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-pager.hy-pager-item.entry.js","mappings":";;;AAAA,MAAM,UAAU,GAAG,+jDAA+jD;;MCOrkD,OAAO;;;;EAClB,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE/C,QACE,UAAI,KAAK,EAAE,eAAe,IACxB,eAAa,CACV,EACL;GACH;;;;AChBH,MAAM,cAAc,GAAG,m6GAAm6G;;MCQ76G,WAAW;;;mBACoB,sBAAsB,CAAC,OAAO;;;;;EAKxE,MAAM;IACJ,IAAI,eAAe,GAAG,CAAC,gBAAgB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACnD,QAAQ,IAAI,CAAC,OAAO;MAClB,KAAK,sBAAsB,CAAC,OAAO,EAAE;QACnC,eAAe,GAAG,CAAC,gBAAgB,EAAE,yBAAyB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC1E,QACE,UAAI,KAAK,EAAE,eAAe,IACxB,SAAG,IAAI,EAAE,IAAI,CAAC,OAAO,kBAAe,MAAM,IACvC,IAAI,CAAC,SAAS,CACb,CACD,EACL;OACH;MACD,KAAK,sBAAsB,CAAC,IAAI,EAAE;QAChC,eAAe,GAAG,CAAC,gBAAgB,EAAE,sBAAsB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACvE,MAAM,mBAAmB,GAAG,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACpD,QACE,UAAI,KAAK,EAAE,eAAe,IACxB,SAAG,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAc,IAAI,CAAC,WAAW,IAChD,IAAI,CAAC,SAAS,EACf,YAAM,KAAK,EAAE,iBAAiB,IAC5B,WAAK,KAAK,EAAE,mBAAmB,IAC7B,eAAS,IAAI,EAAE,wBAAwB,EAAE,IAAI,EAAE,EAAE,GAAI,CACjD,CACD,CACL,CACD,EACL;OACH;MACD,KAAK,sBAAsB,CAAC,QAAQ,EAAE;QACpC,eAAe,GAAG,CAAC,gBAAgB,EAAE,0BAA0B,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC3E,MAAM,mBAAmB,GAAG,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACpD,QACE,UAAI,KAAK,EAAE,eAAe,IACxB,SAAG,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAc,IAAI,CAAC,WAAW,IACjD,YAAM,KAAK,EAAE,iBAAiB,IAC5B,WAAK,KAAK,EAAE,mBAAmB,IAC7B,eAAS,IAAI,EAAE,oBAAoB,EAAE,IAAI,EAAE,EAAE,GAAI,CAC7C,CACD,EACN,IAAI,CAAC,SAAS,CACb,CACD,EACL;OACH;MACD,KAAK,sBAAsB,CAAC,QAAQ,EAAE;QACpC,eAAe,GAAG,CAAC,gBAAgB,EAAE,0BAA0B,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC3E,OAAO,UAAI,KAAK,EAAE,eAAe,UAAU,CAAC;OAC7C;MACD,SAAS;QACP,eAAe,GAAG,CAAC,gBAAgB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC/C,QACE,UAAI,KAAK,EAAE,eAAe,IACxB,SAAG,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAc,IAAI,CAAC,WAAW,IAChD,IAAI,CAAC,SAAS,CACb,CACD,EACL;OACH;KACF;GACF;;;;;;","names":[],"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"],"version":3}

package/dist/esm/hy-paragraph-text.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-paragraph-text.entry.js","mappings":";;AAAA,MAAM,uBAAuB,GAAG,yiIAAyiI;;ACAzkI,MAAM,uBAAuB,GAAG,+xSAA+xS;;ACA/zS,MAAM,uBAAuB,GAAG,6mGAA6mG;;MCWhoG,aAAa;;;;qBAEI,UAAU;uBACR,SAAS;;EAGvC,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,eAAe,GAAG;MACtB,mBAAmB;MACnB,sBAAsB,IAAI,CAAC,WAAW,EAAE;MACxC,GAAG,IAAI,CAAC,OAAO,EAAE;MACjB,GAAG,IAAI,CAAC,SAAS,EAAE;MACnB,GAAG,IAAI,CAAC,WAAW,EAAE;KACtB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,eAAe,IACzB,eAAa,CACT,CACD,EACP;GACH;;;;;;;;;;;","names":[],"sources":["./src/components/hy-paragraph-text/paragraph-text-content.scss?tag=hy-paragraph-text&mode=content","./src/components/hy-paragraph-text/paragraph-text.scss?tag=hy-paragraph-text&mode=default","./src/components/hy-paragraph-text/paragraph-text-landing.scss?tag=hy-paragraph-text&mode=landing","./src/components/hy-paragraph-text/paragraph-text.tsx"],"sourcesContent":["//overrides for Content pages\n\n/*\n* Common styles for text plus mobile & tablet & small desktop\n* in Content Pages and Field of science pages.\n*/\n.hy-paragraph-text.content_page.external,\n.hy-paragraph-text.field_of_science.external {\n  margin-top: 24px; //total gap between heading h2 and paragraph content is 48px\n\n  @include breakpoint($narrow) {\n    margin-top: 16px; //total gap 40px\n  }\n  @include breakpoint($wide) {\n    margin-top: 32px; //total gap 56px\n  }\n}\n\n// There is a sidebar on the Content page\n.hy-paragraph-text.content_page.external.default,\n.hy-paragraph-text.field_of_science.external.default {\n  @include breakpoint($extrawide) {\n    margin-top: 32px; //total gap 56px\n  }\n  @include breakpoint($xlarge) {\n    margin-top: 40px; //total gap 64px\n  }\n}\n\n// No sidebar on the Content page\n.hy-paragraph-text.content_page.external.large,\n.hy-paragraph-text.field_of_science.external.large {\n  @include breakpoint($extrawide) {\n    margin-top: 40px; //total gap 64px\n  }\n  @include breakpoint($xlarge) {\n    margin-top: 40px; //total gap 64px\n  }\n}\n\n.hy-paragraph-text.content_page,\n.hy-paragraph-text.field_of_science {\n  h3 {\n    // text H3 small\n    @include font-size(22px, 28px);\n    letter-spacing: -0.7px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H3 Medium size\n      @include font-size(26px, 32px);\n      letter-spacing: -0.8px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n\n  h4 {\n    // text H4 small\n    @include font-size(18px, 24px);\n    letter-spacing: -0.56px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H4 Medium size\n      @include font-size(22px, 28px);\n      letter-spacing: -0.69px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n\n  h5 {\n    // text H5 small\n    @include font-size(16px, 20px);\n    letter-spacing: -0.5px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H5 Medium size\n      @include font-size(18px, 24px);\n      letter-spacing: -0.56px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n\n  h6 {\n    // text H6 small\n    @include font-size(14px, 16px);\n    letter-spacing: -0.44px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H6 Medium size\n      @include font-size(16px, 20px);\n      letter-spacing: -0.5px;\n\n      padding-bottom: 12px;\n      padding-top: 28px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n  }\n}\n","@import \"./paragraph-text-content.scss\";\n@import \"./paragraph-text-landing.scss\";\n\n:host {\n  display: block;\n}\n\n// General styles for text paragraph\n.hy-paragraph-text {\n  @include font-size(15px, 22px); // Paragraph Small size\n  color: var(--grayscale-dark-text);\n  font-family: var(--main-font-family);\n  letter-spacing: 0;\n  text-wrap: pretty;\n  width: 100%;\n\n  @include breakpoint($narrow) {\n    @include font-size(16px, 24px); // Paragraph Medium size\n  }\n  @include breakpoint($wide) {\n    width: 91.46%; // 11 col\n  }\n  @include breakpoint($xlarge) {\n    @include font-size(17px, 26px); // Paragraph Large size\n    width: 82.89%; // 10 col\n  }\n\n  &__large {\n    @include breakpoint($extrawide) {\n      @include font-size(17px, 26px); // Paragraph Large size\n      width: 82.89%; // 10 col\n    }\n    @include breakpoint($xlarge) {\n      width: 74.17%; // 9 col\n    }\n  }\n\n  &.degree_programme_group {\n    @include breakpoint($wide) {\n      width: 91.46%; // 11 col\n    }\n  }\n\n  &.main_front_page,\n  &.landing_page,\n  &.faculty,\n  &.generic_site_group,\n  &.degree_programme_group,\n  &.research_group {\n    @include breakpoint($wide) {\n      width: 100%;\n    }\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    font-weight: 700;\n    margin: 0;\n    width: 100%;\n\n    &.negative {\n      color: var(--grayscale-white);\n    }\n  }\n\n  // link within paragraph (Open sans semibold)\n  a {\n    @include font-size(14px, 20px); // Paragraph Small size\n    color: var(--link-blue);\n    font-family: var(--main-font-family);\n    font-weight: 600;\n\n    @include breakpoint($narrow) {\n      @include font-size(16px, 24px);\n      letter-spacing: -0.1px;\n    }\n\n    @include breakpoint($xlarge) {\n      @include font-size(17px, 26px); // Paragraph Large size\n    }\n\n    &:hover {\n      color: var(--brand-main);\n    }\n  }\n\n  a[target=\"_blank\"]:after {\n    display: inline-block;\n    vertical-align: middle;\n    width: 12px;\n    height: 12px;\n    margin-left: 3px;\n    background-size: contain;\n    content: \"\";\n    background-image: url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='rgb(4,121,165)'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");\n    transform: rotate(315deg);\n\n    &:hover {\n      background-image: url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='pink'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");\n    }\n  }\n\n  a[target=\"_blank\"]:hover {\n    &:after {\n      background-image: url(\"data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 30 29' fill='rgb(14,104,139)'> <polygon points='29.207 13.783 14.756 .717 14.055 0 11.402 3.118 10.732 3.835 19.665 11.974 0 11.974 0 17.026 19.756 17.026 11.494 24.447 10.823 25.071 11.402 25.882 13.476 28.189 14.055 29 30 14.594' /> </svg>\");\n    }\n  }\n\n  p {\n    margin-top: 0;\n    padding-top: 0;\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n  }\n\n  // When hy-paragraph-text is the first child it will not add spacing to top. Will fix heading + text spacing issue.\n  &:first-child {\n    margin-top: 0 !important;\n  }\n}\n\nhy-paragraph-text + hy-link-list {\n  display: block;\n  margin-top: 32px;\n}\n","//overrides for Landing pages and Front page\n\n// Common styles for text plus mobile & tablet & small desktop in Landing Pages\n.hy-paragraph-text.landing_page,\n.hy-paragraph-text.main_front_page {\n  h3 {\n    // text H3 small\n    @include font-size(22px, 28px);\n    letter-spacing: -0.7px;\n\n    padding-bottom: 12px;\n    padding-top: 32px;\n\n    @include breakpoint($narrow) {\n      // text H3 Medium size\n      @include font-size(26px, 32px);\n      letter-spacing: -0.8px;\n\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 48px;\n    }\n  }\n\n  h4 {\n    // text H4 small\n    @include font-size(18px, 24px);\n    letter-spacing: -0.56px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H4 Medium size\n      @include font-size(22px, 28px);\n      letter-spacing: -0.69px;\n\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n  }\n\n  h5 {\n    // text H5 small\n    @include font-size(16px, 20px);\n    letter-spacing: -0.5px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H5 Medium size\n      @include font-size(18px, 24px);\n      letter-spacing: -0.56px;\n\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n  }\n\n  h6 {\n    // text H6 small\n    @include font-size(14px, 16px);\n    letter-spacing: -0.44px;\n\n    padding-bottom: 12px;\n    padding-top: 24px;\n\n    @include breakpoint($narrow) {\n      // text H6 Medium size\n      @include font-size(16px, 20px);\n      letter-spacing: -0.5px;\n\n      padding-bottom: 16px;\n      padding-top: 32px;\n    }\n\n    @include breakpoint($wide) {\n      padding-bottom: 16px;\n      padding-top: 40px;\n    }\n  }\n}\n","import {Component, Element, h, Host, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-paragraph-text\",\n  styleUrls: {\n    default: \"paragraph-text.scss\",\n    content: \"paragraph-text-content.scss\",\n    landing: \"paragraph-text-landing.scss\",\n  },\n  shadow: false,\n})\nexport class ParagraphText {\n  @Prop() variant: string;\n  @Prop() placement: string = \"internal\";\n  @Prop() headerstyle: string = \"default\";\n  @Element() el: HTMLElement;\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const classAttributes = [\n      \"hy-paragraph-text\",\n      `hy-paragraph-text__${this.headerstyle}`,\n      `${this.variant}`,\n      `${this.placement}`,\n      `${this.headerstyle}`,\n    ].join(\" \");\n\n    return (\n      <Host>\n        <div class={classAttributes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-person-card.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-person-card.entry.js","mappings":"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","names":[],"sources":["./src/components/hy-person-card/hy-person-card.scss?tag=hy-person-card","./src/components/hy-person-card/hy-person-card.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-person-card-container {\n  font-family: var(--main-font-family);\n  margin-bottom: 28px;\n\n  @include breakpoint($wide) {\n    margin-bottom: 32px;\n  }\n\n  &__category-title {\n    @include font-size(12px, 14px);\n    color: var(--grayscale-dark);\n    letter-spacing: 0;\n    margin-bottom: 8px;\n\n    @include breakpoint($narrow) {\n      @include font-size(14px, 18px);\n    }\n\n    @include breakpoint($fullhd) {\n      @include font-size(14px, 18px); //>1920 desktop\n    }\n  }\n\n  &__link {\n    text-decoration: none;\n\n    &.inactive {\n      cursor: default;\n      pointer-events: none;\n    }\n  }\n}\n\n.hy-person-card {\n  display: flex;\n  flex-direction: row;\n  font-family: var(--main-font-family);\n\n  &__image-container {\n    margin-right: 12px;\n    max-width: 70px;\n\n    @include breakpoint($narrow) {\n      margin-right: 16px;\n      max-width: 112px;\n    }\n\n    @include breakpoint($fullhd) {\n      max-width: 140px;\n    }\n\n    &__image {\n      height: 70px;\n      width: 70px;\n\n      @include breakpoint($narrow) {\n        height: 112px;\n        width: 112px;\n      }\n\n      @include breakpoint($fullhd) {\n        //1920\n        height: 140px;\n        width: 140px;\n      }\n      img {\n        height: 70px;\n        width: 70px;\n        object-fit: cover;\n\n        @include breakpoint($narrow) {\n          height: 112px;\n          width: 112px;\n        }\n\n        @include breakpoint($fullhd) {\n          height: 140px;\n          width: 140px;\n        }\n      }\n    }\n    &__no-image {\n      height: 70px;\n      width: 70px;\n\n      align-items: center;\n      background-color: var(--brand-main-light);\n      display: flex;\n      justify-content: center;\n\n      @include breakpoint($narrow) {\n        height: 112px;\n        width: 112px;\n      }\n\n      @include breakpoint($fullhd) {\n        height: 140px;\n        width: 140px;\n      }\n\n      &__initials {\n        @include font-size(18px, 24px);\n        @include font-weight($bold);\n        color: var(--grayscale-white);\n        letter-spacing: -0.56px;\n\n        @include breakpoint($narrow) {\n          @include font-size(32px, 32px);\n          letter-spacing: 0.96px;\n        }\n      }\n    }\n  }\n\n  &__info-container {\n    &__full-name {\n      @include font-size(18px, 24px);\n      @include font-weight($bold);\n\n      color: var(--brand-main-light);\n      letter-spacing: -0.56px;\n      margin-bottom: 4px;\n      text-decoration: none;\n\n      @include breakpoint($narrow) {\n        @include font-size(22px, 28px);\n        letter-spacing: -0.69px;\n        margin-bottom: 3px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(26px, 28px);\n        letter-spacing: -0.81px;\n        margin-bottom: 5px;\n      }\n\n      &:hover,\n      &:focus {\n        color: var(--brand-main);\n      }\n    }\n\n    &__position-title {\n      @include font-size(14px, 19px);\n      @include font-weight($bold);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-bottom: 3px;\n\n      @include breakpoint($narrow) {\n        @include font-size(16px, 20px);\n        letter-spacing: -0.5px;\n        margin-bottom: 4px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(18px, 24px);\n        letter-spacing: -0.56px;\n        margin-bottom: 8px;\n      }\n\n      &__search-panel {\n        @include font-weight($regular);\n      }\n    }\n\n    &__department {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-bottom: 3px;\n      text-transform: uppercase;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-bottom: 6px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(14px, 16px);\n        margin-bottom: 9px;\n      }\n    }\n\n    &__field {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-bottom: 4px;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-bottom: 6px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(14px, 16px);\n        margin-bottom: 9px;\n      }\n    }\n\n    &__email-container {\n      align-items: center;\n      display: flex;\n      margin-bottom: 4px;\n    }\n    &__email {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-left: 11px;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-left: 8px;\n      }\n\n      &__icon {\n        svg {\n          height: 15px;\n          width: 16px;\n\n          @include breakpoint($narrow) {\n            height: 12px;\n            width: 16px;\n          }\n        }\n      }\n    }\n\n    &__phone-container {\n      align-items: center;\n      display: flex;\n    }\n    &__phone {\n      @include font-size(12px, 17px);\n      color: var(--brand-main-nearly-black);\n      letter-spacing: 0;\n      margin-left: 11px;\n\n      @include breakpoint($narrow) {\n        @include font-size(14px, 19px);\n        margin-left: 8px;\n      }\n\n      &__icon {\n        svg {\n          height: 13px;\n          width: 13px;\n\n          @include breakpoint($narrow) {\n            height: 14px;\n            width: 14px;\n          }\n        }\n      }\n    }\n  }\n\n  &.search-panel {\n    margin-bottom: 12px;\n\n    @include breakpoint($narrow) {\n      margin-bottom: 14px;\n    }\n\n    .hy-person-card__info-container__full-name {\n      @include font-size(14px, 20px);\n      @include font-weight($semibold);\n      color: var(--grayscale-dark);\n      letter-spacing: 0;\n      margin-bottom: 0;\n\n      @include breakpoint($narrow) {\n        letter-spacing: -0.3px;\n      }\n\n      @include breakpoint($fullhd) {\n        @include font-size(16px, 24px);\n        letter-spacing: 0;\n      }\n    }\n\n    .hy-person-card__info-container__position-title {\n      @include font-size(12px, 16px);\n      color: var(--grayscale-dark);\n      letter-spacing: -0.07px;\n      margin-bottom: 0;\n    }\n\n    .hy-person-card__image-container {\n      margin-right: 12px;\n\n      &__image {\n        height: 60px;\n        width: 60px;\n        img {\n          height: 60px;\n          width: 60px;\n        }\n      }\n      &__no-image {\n        height: 60px;\n        width: 60px;\n\n        &__initials {\n          color: var(--grayscale-white);\n          @include font-size(16px, 32px);\n          @include font-weight($bold);\n          letter-spacing: 0.48px;\n        }\n      }\n    }\n  }\n}\n\n.hy-person-card__extended-info-container {\n  display: block;\n  padding-top: 8px;\n\n  @include breakpoint($narrow) {\n    padding-top: 12px;\n  }\n\n  &__about {\n    @include font-size(12px, 17px);\n    color: var(--grayscale-dark-text);\n    font-family: var(--main-font-family);\n    font-style: italic;\n    letter-spacing: 0;\n\n    @include breakpoint($narrow) {\n      @include font-size(12px, 16px);\n    }\n    @include breakpoint($xlarge) {\n      @include font-size(14px, 16px);\n    }\n\n    .label {\n      @include font-weight($bold);\n      padding-right: 3px;\n    }\n  }\n}\n","import {Component, h, Prop, State} from \"@stencil/core\";\nimport {PersonCardVariants} from \"../../utils/utils\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\n@Component({\n  tag: \"hy-person-card\",\n  styleUrl: \"hy-person-card.scss\",\n  shadow: false,\n})\nexport class HyPersonCard {\n  @Prop() variant: PersonCardVariants = PersonCardVariants.default;\n  @Prop() categoryTitle?: string;\n  @Prop() imageUrl: string = null;\n  @Prop() imageAlt: string = null;\n  @Prop() disableLazy: boolean = false;\n  @Prop() firstName?: string;\n  @Prop() lastName?: string;\n  @Prop() url: string = null;\n  @Prop() isExternal: boolean = false;\n  @Prop() scLabel?: string;\n  @Prop() positionTitle?: string;\n  @Prop() department: string = null;\n  @Prop() field: string = null;\n  @Prop() email: string = null;\n  @Prop() phone: string = null;\n  @Prop() aboutInfo: string = null;\n  @Prop() researchNetworks?: string;\n  @Prop() studyProgramme?: string;\n  @Prop() aboutInfoLabel?: string;\n  @Prop() researchNetworksLabel?: string;\n  @Prop() studyProgrammeLabel?: string;\n\n  private _fullName: string;\n  private _initials: string;\n\n  @State() isMobile: boolean;\n\n  private ro: ResizeObserver;\n  componentDidLoad() {\n    this.ro = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        this.checkForMobile(entry.contentRect.width);\n      }\n    });\n    this.ro.observe(document.body);\n  }\n\n  disconnectedCallback() {\n    this.ro.disconnect();\n  }\n\n  checkForMobile(size: number) {\n    this.isMobile = size <= 479 ? true : false;\n  }\n\n  componentWillRender() {\n    this._fullName = this.firstName && this.lastName ? `${this.firstName} ${this.lastName}` : \"\";\n    this._initials =\n      this.imageUrl && this.firstName && this.lastName ? \"\" : `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`;\n    if (!this.imageAlt) {\n      this.imageAlt = this._fullName;\n    }\n    if (!this.scLabel) {\n      this.scLabel = \"Link to the person profile\";\n    }\n  }\n\n  render() {\n    let classLinkAttributes = [\"hy-person-card-container__link\", this.variant].join(\" \");\n    let classIsActive = this.url && this.url.length > 0 ? \"\" : \" inactive\";\n    classLinkAttributes = classLinkAttributes.concat(classIsActive);\n\n    const classAttributes = [\"hy-person-card\", this.variant].join(\" \");\n    const classPositionTitle = [\n      \"hy-person-card__info-container__position-title\",\n      `hy-person-card__info-container__position-title__${this.variant}`,\n    ].join(\" \");\n    const target = this.isExternal ? \"_blank\" : \"_self\";\n\n    return (\n      <article class=\"hy-person-card-container\">\n        <div class={classLinkAttributes}>\n          {this.categoryTitle && this.variant == PersonCardVariants.default && (\n            <div class=\"hy-person-card-container__category-title\">{this.categoryTitle}</div>\n          )}\n          <div class={classAttributes}>\n            <div class=\"hy-person-card__image-container\">\n              {this.imageUrl ? (\n                <a class=\"hy-person-card__image-container__image\" href={this.url} target={target}>\n                  <img\n                    loading={this.disableLazy ? \"eager\" : \"lazy\"}\n                    src={this.imageUrl}\n                    alt={this.imageAlt}\n                  />\n                </a>\n              ) : (\n                <div class=\"hy-person-card__image-container__no-image\">\n                  <div class=\"hy-person-card__image-container__no-image__initials\" aria-hidden=\"true\">\n                    {this._initials}\n                  </div>\n                </div>\n              )}\n            </div>\n            <div class=\"hy-person-card__info-container\">\n              <a class=\"hy-person-card__info-container__full-name\" href={this.url} target={target}>\n                {this._fullName}\n              </a>\n              {this.positionTitle && <div class={classPositionTitle}>{this.positionTitle}</div>}\n              {this.department &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && (\n                  <div class=\"hy-person-card__info-container__department\">{this.department}</div>\n                )}\n              {this.field &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && (\n                  <div class=\"hy-person-card__info-container__field\">{this.field}</div>\n                )}\n              {this.email &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && [\n                  <div class=\"hy-person-card__info-container__email-container\">\n                    <span class=\"hy-person-card__info-container__email__icon\">\n                      <hy-icon icon={\"hy-icon-email\"} size={16} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__email\">{this.email}</span>\n                  </div>,\n                ]}\n              {this.phone &&\n                (this.variant == PersonCardVariants.default ||\n                  (this.variant == PersonCardVariants.extended && !this.isMobile)) && [\n                  <div class=\"hy-person-card__info-container__phone-container\">\n                    <span class=\"hy-person-card__info-container__phone__icon\">\n                      <hy-icon icon={\"hy-icon-phone\"} size={14} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__phone\">{this.phone}</span>\n                  </div>,\n                ]}\n            </div>\n          </div>\n          {this.variant == PersonCardVariants.extended && (\n            <div class=\"hy-person-card hy-person-card__extended-info-container\">\n              {this.department && this.isMobile && (\n                <div class=\"hy-person-card__info-container__department\">{this.department}</div>\n              )}\n              {this.field && this.isMobile && <div class=\"hy-person-card__info-container__field\">{this.field}</div>}\n              {this.email &&\n                this.isMobile && [\n                  <div class=\"hy-person-card__info-container__email-container\">\n                    <span class=\"hy-person-card__info-container__email__icon\">\n                      <hy-icon icon={\"hy-icon-email\"} size={16} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__email\">{this.email}</span>\n                  </div>,\n                ]}\n              {this.phone &&\n                this.isMobile && [\n                  <div class=\"hy-person-card__info-container__phone-container\">\n                    <span class=\"hy-person-card__info-container__phone__icon\">\n                      <hy-icon icon={\"hy-icon-phone\"} size={14} />\n                    </span>\n                    <span class=\"hy-person-card__info-container__phone\">{this.phone}</span>\n                  </div>,\n                ]}\n              {this.aboutInfo && (\n                <div class=\"hy-person-card__extended-info-container__about\">\n                  <span class=\"label\">{this.aboutInfoLabel}:</span>\n                  <span>{this.aboutInfo}</span>\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </article>\n    );\n  }\n}\n"],"version":3}

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

@@ -1 +0,0 @@
-{"file":"hy-person-profile-listing.entry.js","mappings":";;AAAA,MAAM,uBAAuB,GAAG,mvGAAmvG;;MCctwG,aAAa;;;;eAEoB,OAAO;;;;sBAIrB,KAAK;;EAEnC,MAAM;IACJ,QACE,EAAC,IAAI,QACH,UACE,KAAK,EAAE,6BAA6B,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,MAAM,GAAG,WAAW,GAAG,EAAE,IAC5E,IAAI,CAAC,YAAY,GAAG,eAAe,GAAG,EACxC,IAAI,IAAI,CAAC,gBAAgB,GAAG,YAAY,GAAG,EAAE,EAAE,IAE9C,IAAI,CAAC,UAAU,IAAI,UAAI,KAAK,EAAC,kCAAkC,IAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAM,EAC1F,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAC,KAAK,EAAE,KAAK,EAAC;MAC7B,IAAK,KAAa,CAAC,MAAM,CAAC,CAAC,EAAC,KAAK,EAAC,KAAK,KAAK,KAAK,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;QAC/D,QACE,cACG,CAAC,IAAI,CAAC,UAAU,IAAI,UAAI,KAAK,EAAC,kCAAkC,IAAE,KAAK,CAAM,EAE9E,UAAI,KAAK,EAAC,kCAAkC,IACxC,KAAa,CAAC,GAAG,CAAC,CAAC,EAAC,KAAK,EAAE,GAAG,EAAC,EAAE,KAAK;UACtC,IAAI,GAAG,EAAE;YACP,QACE,UAAI,KAAK,EAAC,iCAAiC,IACzC,SAAG,IAAI,EAAE,GAAG,IACT,KAAK,KAAK,CAAC,IAAI,eAAS,IAAI,EAAE,qBAAqB,EAAE,IAAI,EAAE,EAAE,GAAI,EAClE,gBAAO,KAAK,CAAQ,CAClB,CACD,EACL;WACH;UAED,QACE,UAAI,KAAK,EAAC,iCAAiC,IACxC,KAAK,KAAK,CAAC,IAAI,eAAS,IAAI,EAAE,qBAAqB,EAAE,IAAI,EAAE,EAAE,GAAI,EAClE,gBAAO,KAAK,CAAQ,CACjB,EACL;SACH,CAAC,CACC,CACF,EACL;OACH;KACF,CAAC,CACC,CACA,EACP;GACH;;;;;;","names":[],"sources":["./src/components/hy-person-profile/person-profile-listing/person-profile-listing.scss?tag=hy-person-profile-listing","./src/components/hy-person-profile/person-profile-listing/person-profile.listing.tsx"],"sourcesContent":[".hy-person-profile-listing {\n  font-family: var(--main-font-family);\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  display: grid;\n  gap: 24px;\n\n  @include breakpoint($medium) {\n    gap: 2px 24px;\n  }\n\n  &.col-2 {\n    @include breakpoint($fullhd) {\n      grid-template-columns: repeat(2, 50%);\n    }\n  }\n\n  &.col-4 {\n    gap: 32px 24px;\n\n    @include breakpoint($medium) {\n      grid-template-columns: repeat(2, 50%);\n    }\n\n    @include breakpoint($wide) {\n      grid-template-columns: repeat(3, calc(100% / 3));\n    }\n\n    @include breakpoint($fullhd) {\n      grid-template-columns: repeat(4, 25%);\n    }\n  }\n}\n\n.hy-person-profile-listing__label {\n  @include font-size(15px, 18px);\n  @include font-weight($bold);\n  letter-spacing: -0.28px;\n  color: var(--grayscale-black);\n  margin: 0 0 8px;\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 20px);\n    letter-spacing: -0.32px;\n  }\n}\n\n.hy-person-profile-listing__items {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: grid;\n  gap: 8px;\n\n  .is-inline & {\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: 0;\n  }\n\n  .text-tight & {\n    gap: 0;\n  }\n}\n\n.hy-person-profile-listing__item {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  color: var(--grayscale-black);\n  display: inline-flex;\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 26px);\n  }\n\n  a {\n    text-decoration: none;\n    color: var(--link-blue);\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  hy-icon {\n    display: none !important;\n    justify-content: center;\n    align-items: center;\n    height: 28px;\n    width: 28px;\n\n    @include breakpoint($medium) {\n      display: inline-flex !important;\n    }\n\n    .without-icons & {\n      display: none !important;\n    }\n  }\n}\n","import {Component, Host, h, Prop} from \"@stencil/core\";\n\nexport type personProfileListingItems = [\n  {\n    label: string;\n    items: string[];\n  }\n];\n\n@Component({\n  tag: \"hy-person-profile-listing\",\n  shadow: false,\n  styleUrl: \"person-profile-listing.scss\",\n})\nexport class PersonProfile {\n  @Prop() items: personProfileListingItems;\n  @Prop() col?: \"col-1\" | \"col-2\" | \"col-4\" = \"col-2\";\n  @Prop() inline?: boolean;\n  @Prop() withoutIcons?: boolean;\n  @Prop() textSpacingTight?: boolean;\n  @Prop() isResearch: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <ul\n          class={`hy-person-profile-listing ${this.col} ${this.inline ? \"is-inline\" : \"\"} ${\n            this.withoutIcons ? \"without-icons\" : \"\"\n          } ${this.textSpacingTight ? \"text-tight\" : \"\"}`}\n        >\n          {this.isResearch && <h3 class=\"hy-person-profile-listing__label\">{this.items[0].label}</h3>}\n          {this.items.map(({label, items}) => {\n            if ((items as any).filter(({label}) => label !== \"\").length > 0) {\n              return (\n                <li>\n                  {!this.isResearch && <h3 class=\"hy-person-profile-listing__label\">{label}</h3>}\n\n                  <ul class=\"hy-person-profile-listing__items\">\n                    {(items as any).map(({label, url}, index) => {\n                      if (url) {\n                        return (\n                          <li class=\"hy-person-profile-listing__item\">\n                            <a href={url}>\n                              {index !== 0 && <hy-icon icon={\"hy-icon-caret-right\"} size={10} />}\n                              <span>{label}</span>\n                            </a>\n                          </li>\n                        );\n                      }\n\n                      return (\n                        <li class=\"hy-person-profile-listing__item\">\n                          {index !== 0 && <hy-icon icon={\"hy-icon-caret-right\"} size={10} />}\n                          <span>{label}</span>\n                        </li>\n                      );\n                    })}\n                  </ul>\n                </li>\n              );\n            }\n          })}\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-person-profile.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-person-profile.entry.js","mappings":"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","names":[],"sources":["./src/components/hy-person-profile/person-profile.scss?tag=hy-person-profile","./src/components/hy-person-profile/person-profile.tsx"],"sourcesContent":[".hy-profile-page__back-button {\n  @include font-size(16px, 20px);\n  @include font-weight($semibold);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.5px;\n  color: var(--brand-main-light);\n  padding: 12px 10px;\n  display: inline-flex;\n  text-decoration: none;\n  margin-left: -10px;\n  align-items: center;\n  margin-bottom: 16px;\n\n  @include breakpoint($medium) {\n    margin-bottom: 24px;\n  }\n\n  hy-icon {\n    margin-right: 16px;\n\n    svg {\n      fill: var(--brand-main-light);\n    }\n  }\n}\n\n.hy-profile-page__section {\n  padding: 32px 0;\n\n  &:first-of-type {\n    padding: 0 0 32px;\n  }\n\n  &:not(:first-of-type) {\n    border-top: 1px solid var(--grayscale-medium);\n  }\n\n  &__research_title > h2,\n  > h2 {\n    @include font-size(26px, 32px);\n    @include font-weight($bold);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.52px;\n    color: var(--grayscale-black);\n    margin: 0 0 32px;\n\n    @include breakpoint($medium) {\n      @include font-size(34px, 40px);\n      letter-spacing: -0.68px;\n    }\n  }\n\n  &__research_title {\n    display: block;\n    align-items: center;\n    @include breakpoint($medium) {\n      display: flex;\n    }\n\n    > hy-cta-button {\n      margin: 0 0 32px 0;\n      @include breakpoint($medium) {\n        margin: 0 0 32px auto;\n      }\n    }\n  }\n}\n\n.hy-profile-page__organization-units-section {\n  font-family: var(--main-font-family);\n  padding: 0;\n  margin: 0;\n  list-style: none;\n\n  h3 {\n    @include font-size(15px, 18px);\n    @include font-weight($bold);\n    letter-spacing: -0.28px;\n    color: var(--grayscale-black);\n    margin: 0 0 8px;\n\n    @include breakpoint($medium) {\n      @include font-size(17px, 20px);\n      letter-spacing: -0.32px;\n    }\n  }\n}\n\n.hy-profile-page__organization-units-section {\n  margin-top: 24px;\n\n  @include breakpoint($medium) {\n    margin-top: 32px;\n  }\n\n  a {\n    text-decoration: none;\n    color: var(--link-blue);\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n}\n\n.hy-profile-page__organizations,\n.hy-profile-page__research-organizations {\n  &,\n  ul {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    display: grid;\n    gap: 8px;\n  }\n\n  li {\n    display: inline-flex;\n    flex-wrap: wrap;\n\n    span {\n      @include font-size(15px, 22px);\n      @include font-weight($regular);\n      color: var(--grayscale-black);\n\n      @include breakpoint($medium) {\n        @include font-size(17px, 26px);\n      }\n    }\n\n    > span {\n      display: inline-flex;\n    }\n\n    hy-icon {\n      justify-content: center;\n      align-items: center;\n      height: 22px;\n      width: 28px;\n\n      @include breakpoint($medium) {\n        height: 26px;\n      }\n    }\n  }\n}\n\n.hy-profile-page__person-about-text {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  font-family: var(--main-font-family);\n  color: var(--grayscale-black);\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 26px);\n  }\n}\n\n.hy-profile-page__person-about-text-toggle {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  font-family: var(--main-font-family);\n  color: var(--link-blue);\n  background-color: transparent;\n  border: 0;\n  padding: 0;\n  margin: 0;\n\n  @include breakpoint($medium) {\n    @include font-size(17px, 26px);\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n.hy-profile-page__person-information {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  margin-bottom: 24px;\n\n  @include breakpoint($medium) {\n    flex-direction: row-reverse;\n    align-items: center;\n    margin-bottom: 40px;\n    justify-content: flex-end;\n  }\n}\n\n.hy-profile-page__image {\n  aspect-ratio: 328 / 425;\n  width: 100%;\n  max-width: 328px;\n  object-fit: cover;\n  background-color: var(--grayscale-background-box);\n\n  @include breakpoint($medium) {\n    max-width: 194px;\n  }\n}\n\n.hy-profile-page__contact-information {\n  > h2 {\n    @include font-size(26px, 32px);\n    @include font-weight($bold);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.52px;\n    color: var(--grayscale-black);\n    margin: 0 0 32px;\n\n    @include breakpoint($medium) {\n      @include font-size(34px, 40px);\n      letter-spacing: -0.68px;\n    }\n  }\n}\n\n.hy-profile-page__name {\n  @include font-size(32px, 38px);\n  @include font-weight($bold);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.8px;\n  color: var(--grayscale-black);\n  margin: 0 0 4px;\n  text-transform: uppercase;\n\n  @include breakpoint($wide) {\n    @include font-size(46px, 54px);\n    letter-spacing: -1.15px;\n    margin: 0 0 8px;\n  }\n\n  @include breakpoint($fullhd) {\n    @include font-size(52px, 60px);\n    letter-spacing: -1.3px;\n  }\n}\n\n.hy-profile-page__job-title {\n  @include font-size(16px, 20px);\n  @include font-weight($bold);\n  font-family: var(--main-font-family);\n  letter-spacing: -0.32px;\n  color: var(--grayscale-black);\n  margin: 0 0 4px;\n  text-transform: capitalize;\n\n  @include breakpoint($wide) {\n    @include font-size(18px, 24px);\n    letter-spacing: -0.36px;\n  }\n}\n\n.hy-profile-page__additional-information {\n  @include font-size(15px, 22px);\n  @include font-weight($regular);\n  font-family: var(--main-font-family);\n  color: var(--grayscale-dark-text);\n  margin: 0;\n\n  @include breakpoint($wide) {\n    @include font-size(17px, 26px);\n  }\n}\n\n.hy-profile-page__person-content-container {\n  display: none;\n  margin-top: 32px;\n\n  @include breakpoint($medium) {\n    margin-top: 44px;\n  }\n}\n\n.hy-profile-page__person-content-listing {\n  display: grid;\n  gap: 32px;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n\n.hy-profile-page__person-content {\n  > h2 {\n    margin: 0 0 8px;\n\n    a {\n      @include font-size(18px, 24px);\n      @include font-weight($bold);\n      font-family: var(--main-font-family);\n      letter-spacing: -0.36px;\n      color: var(--link-blue);\n      text-decoration: none;\n\n      @include breakpoint($medium) {\n        @include font-size(22px, 28px);\n        letter-spacing: -0.44px;\n      }\n    }\n  }\n\n  > span,\n  > p {\n    @include font-size(15px, 22px);\n    @include font-weight($regular);\n    font-family: var(--main-font-family);\n    color: var(--grayscale-dark-text);\n\n    @include breakpoint($medium) {\n      @include font-size(17px, 26px);\n      letter-spacing: -0.44px;\n    }\n  }\n\n  > p {\n    margin: 8px 0 0;\n  }\n}\n\n.hy-profile-page__loader {\n  display: inline-block;\n  position: relative;\n  width: 80px;\n  height: 80px;\n  margin-top: 32px;\n\n  &.visible {\n    display: block;\n  }\n\n  &.hidden {\n    display: none;\n  }\n\n  @include breakpoint($medium) {\n    margin-top: 44px;\n  }\n\n  div {\n    box-sizing: border-box;\n    display: block;\n    position: absolute;\n    width: 64px;\n    height: 64px;\n    margin: 8px;\n    border: 6px solid #fff;\n    border-radius: 50%;\n    animation: loader-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n    border-color: var(--brand-main-light) transparent transparent transparent;\n\n    &:nth-child(1) {\n      animation-delay: -0.45s;\n    }\n\n    &:nth-child(2) {\n      animation-delay: -0.3s;\n    }\n\n    &:nth-child(3) {\n      animation-delay: -0.15s;\n    }\n  }\n}\n\n@keyframes loader-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n.hidden {\n  display: none;\n  visibility: hidden;\n}\n","import {Component, Host, h, Prop, State, Fragment} from \"@stencil/core\";\nimport {CtaLinkButtonVariants} from \"../../utils/utils\";\n\nlet timer;\n@Component({\n  tag: \"hy-person-profile\",\n  shadow: false,\n  styleUrl: \"person-profile.scss\",\n})\nexport class PersonProfile {\n  @Prop() personDataJson: string;\n  @Prop() showFullAboutText: string;\n  @Prop() hideFullAboutText: string;\n  @Prop() organizationItemsLabelText: string;\n  @Prop() peopleFinderReturnLink: string;\n  @Prop() peopleFinderReturnLabel: string;\n\n  @State() isFullAboutTextHidden: boolean = false;\n  @State() viewportSize: number;\n\n  componentWillLoad() {\n    this.viewportSize = window.innerWidth;\n  }\n\n  toggleShowFullAboutText() {\n    this.isFullAboutTextHidden = !this.isFullAboutTextHidden;\n  }\n\n  disconnectedCallback() {\n    clearTimeout(timer);\n  }\n\n  render() {\n    const {\n      name,\n      job_title,\n      additional_information,\n      image_url,\n      contact_information,\n      organization_units,\n      about,\n      research,\n      person_content,\n    } = JSON.parse(this.personDataJson);\n\n    const {organizations, research_organizations} = organization_units.items;\n\n    const aboutDescriptionTextDestructured = about.description;\n\n    const aboutDescriptionLength = aboutDescriptionTextDestructured.length;\n\n    let trimmedAboutDescription = \"\";\n\n    if (aboutDescriptionLength > 650) {\n      if (this.isFullAboutTextHidden) {\n        const ellipsisTextArray = aboutDescriptionTextDestructured + \"...\";\n\n        trimmedAboutDescription = ellipsisTextArray;\n      } else {\n        const ellipsisTextArray = aboutDescriptionTextDestructured.substring(0, 650) + \"...\";\n\n        trimmedAboutDescription = ellipsisTextArray;\n      }\n    }\n\n    window.addEventListener(\"resize\", () => {\n      clearTimeout(timer);\n      timer = setTimeout(() => {\n        this.viewportSize = window.innerWidth;\n      }, 250);\n    });\n\n    const research_portal_title = `${research.research_portal_label}: ${name}`;\n    return (\n      <Host>\n        <section class=\"hy-profile-page\">\n          <a href={this.peopleFinderReturnLink} class=\"hy-profile-page__back-button\">\n            <hy-icon icon={\"hy-icon-arrow-left\"} size={24} />\n            <span>{this.peopleFinderReturnLabel}</span>\n          </a>\n          <section class=\"hy-profile-page__section\">\n            <div class=\"hy-profile-page__person-information\">\n              <div>\n                <h1 class=\"hy-profile-page__name\">{name}</h1>\n                {job_title && <p class=\"hy-profile-page__job-title\">{job_title}</p>}\n                {additional_information && (\n                  <p class=\"hy-profile-page__additional-information\">{additional_information}</p>\n                )}\n              </div>\n              {image_url ? (\n                <img src={image_url} alt=\"\" class=\"hy-profile-page__image\" />\n              ) : (\n                <div class=\"hy-profile-page__image\" aria-hidden=\"true\" />\n              )}\n            </div>\n            {contact_information && (\n              <div class=\"hy-profile-page__contact-information\">\n                {contact_information.label && <h2>{contact_information.label}</h2>}\n                {contact_information.items && (\n                  <hy-person-profile-listing\n                    items={contact_information.items}\n                    col=\"col-4\"\n                    withoutIcons\n                    textSpacingTight\n                  ></hy-person-profile-listing>\n                )}\n              </div>\n            )}\n          </section>\n          {(organizations.items.length > 0 || Object.keys(research_organizations.items).length > 0) && (\n            <section class=\"hy-profile-page__section\">\n              {organization_units.label && <h2>{organization_units.label}</h2>}\n              {organizations.items.length > 0 && (\n                <section class=\"hy-profile-page__organization-units-section\">\n                  <h3>{organizations.label}</h3>\n                  <ul class=\"hy-profile-page__organizations\">\n                    <li>\n                      {organizations.items.map((item, index) => {\n                        return (\n                          <span>\n                            {index > 1 && <hy-icon icon={\"hy-icon-caret-right\"} size={10} />}\n                            {index !== 0 && (\n                              <span>\n                                <a\n                                  href={\n                                    organization_units.people_finder_path[organization_units.lang] +\n                                    \"?researchOrganizations.id[]=\" +\n                                    item.id\n                                  }\n                                  target={\"_blank\"}\n                                >\n                                  {item.name[organization_units.lang]}\n                                </a>\n                              </span>\n                            )}\n                          </span>\n                        );\n                      })}\n                    </li>\n                  </ul>\n                </section>\n              )}\n              {Object.keys(research_organizations.items).length > 0 && (\n                <section class=\"hy-profile-page__organization-units-section\">\n                  <h3>{research_organizations.label}</h3>\n                  <ul class=\"hy-profile-page__research-organizations\">\n                    {Object.values(research_organizations.items).map(([...item]) => (\n                      <li>\n                        {item.map((item, index) => {\n                          return (\n                            <Fragment>\n                              {index > 1 && (\n                                <ul>\n                                  <li>\n                                    <span>\n                                      <hy-icon icon={\"hy-icon-caret-right\"} size={10} />\n                                      <span>\n                                        <a\n                                          href={\n                                            organization_units.people_finder_path[organization_units.lang] +\n                                            \"?researchOrganizations.id[]=\" +\n                                            item.id\n                                          }\n                                          target={\"_blank\"}\n                                        >\n                                          {item.name[organization_units.lang]}\n                                        </a>\n                                      </span>\n                                    </span>\n                                  </li>\n                                </ul>\n                              )}\n                              {index == 1 && (\n                                <span>\n                                  <a\n                                    href={\n                                      organization_units.people_finder_path[organization_units.lang] +\n                                      \"?researchOrganizations.id[]=\" +\n                                      item.id\n                                    }\n                                    target={\"_blank\"}\n                                  >\n                                    {item.name[organization_units.lang]}\n                                  </a>\n                                </span>\n                              )}\n                            </Fragment>\n                          );\n                        })}\n                      </li>\n                    ))}\n                  </ul>\n                </section>\n              )}\n            </section>\n          )}\n          {about && aboutDescriptionLength !== 0 && (\n            <section class=\"hy-profile-page__section\">\n              {about.description && (\n                <Fragment>\n                  <h2>{about.label}</h2>\n                  <div\n                    class=\"hy-profile-page__person-about-text\"\n                    innerHTML={\n                      !this.isFullAboutTextHidden && aboutDescriptionLength > 650\n                        ? trimmedAboutDescription\n                        : about.description\n                    }\n                  ></div>\n                </Fragment>\n              )}\n              {aboutDescriptionLength > 650 && (\n                <button\n                  class=\"hy-profile-page__person-about-text-toggle\"\n                  onClick={() => this.toggleShowFullAboutText()}\n                  aria-expanded={`${this.isFullAboutTextHidden ? \"true\" : \"false\"}`}\n                >\n                  {this.isFullAboutTextHidden ? this.hideFullAboutText : this.showFullAboutText}\n                </button>\n              )}\n            </section>\n          )}\n          {((research && research.items.length > 0) || (person_content && person_content.research_url.length > 0)) && (\n            <section class=\"hy-profile-page__section\">\n              <div class=\"hy-profile-page__section__research_title\">\n                {research.label && <h2>{research.label}</h2>}\n                {research.label && person_content.research_url.length > 0 && (\n                  <hy-cta-button\n                    link-content={research_portal_title}\n                    sc-label={research_portal_title}\n                    url={person_content.research_url}\n                    is-external=\"true\"\n                    variant={CtaLinkButtonVariants.onWhiteBkgd}\n                  ></hy-cta-button>\n                )}\n              </div>\n\n              {research.items && (\n                <hy-person-profile-listing\n                  items={research.items}\n                  col=\"col-1\"\n                  textSpacingTight\n                  is-research\n                  inline\n                ></hy-person-profile-listing>\n              )}\n\n              {person_content.research_url.length > 0 && (\n                <div class=\"hy-profile-page__loader\" role=\"presentation\">\n                  <div></div>\n                  <div></div>\n                  <div></div>\n                  <div></div>\n                </div>\n              )}\n\n              {person_content.research_url.length > 0 && this.viewportSize < 768 && (\n                <div class=\"hy-profile-page__person-content-container\">\n                  <hy-accordion-container accordionid=\"accordion-container-person-content\">\n                    {person_content.publications && (\n                      <hy-accordion-item\n                        data-accordion-id={\"publications\"}\n                        accordiontitle={person_content.publications.label}\n                      ></hy-accordion-item>\n                    )}\n                    {person_content.projects && (\n                      <hy-accordion-item\n                        data-accordion-id={\"projects\"}\n                        accordiontitle={person_content.projects.label}\n                      ></hy-accordion-item>\n                    )}\n                    {person_content.activities && (\n                      <hy-accordion-item\n                        data-accordion-id={\"activities\"}\n                        accordiontitle={person_content.activities.label}\n                      ></hy-accordion-item>\n                    )}\n                  </hy-accordion-container>\n                </div>\n              )}\n              {person_content.research_url.length > 0 && this.viewportSize >= 768 && (\n                <div class=\"hy-profile-page__person-content-container\">\n                  <hy-tabs tab-id=\"tabs-container-person-content\">\n                    {person_content.publications && (\n                      <hy-tabs-item\n                        data-tab-id={\"publications\"}\n                        tab-title={person_content.publications.label}\n                      ></hy-tabs-item>\n                    )}\n                    {person_content.projects && (\n                      <hy-tabs-item data-tab-id={\"projects\"} tab-title={person_content.projects.label}></hy-tabs-item>\n                    )}\n                    {person_content.activities && (\n                      <hy-tabs-item\n                        data-tab-id={\"activities\"}\n                        tab-title={person_content.activities.label}\n                      ></hy-tabs-item>\n                    )}\n                  </hy-tabs>\n                </div>\n              )}\n            </section>\n          )}\n        </section>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-process_2.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-process.hy-process-flow-box.entry.js","mappings":"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","names":[],"sources":["./src/components/hy-process/process.scss?tag=hy-process&encapsulation=shadow","./src/components/hy-process/process.tsx","./src/components/hy-process-flow-box/process-flow-box.scss?tag=hy-process-flow-box&encapsulation=shadow","./src/components/hy-process-flow-box/process-flow-box.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-process {\n  display: block;\n  justify-content: center;\n  max-width: 30rem;\n  margin-right: auto;\n  margin-left: auto;\n  width: 100%;\n\n  @include breakpoint($narrow) {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: left;\n    max-width: 60rem;\n    width: 100%;\n  }\n  @include breakpoint($wide) {\n    max-width: 75rem;\n  }\n}\n\n.hy-process.small {\n  .box {\n    display: block;\n    margin: 1%;\n    @include breakpoint($narrow) {\n      flex-grow: 1;\n      max-width: 48%;\n      padding-bottom: 10px;\n      width: 48%;\n    }\n    @include breakpoint($wide) {\n      flex-grow: 1;\n      max-width: 23%;\n      width: 23%;\n    }\n  }\n}\n\n.hy-process.big {\n  .box {\n    display: block;\n    margin: 1%;\n    @include breakpoint($narrow) {\n      flex-grow: 1;\n      max-width: 48%;\n      padding-bottom: 10px;\n      width: 48%;\n    }\n    @include breakpoint($wide) {\n      flex-grow: 1;\n      max-width: 31%;\n      width: 31%;\n    }\n  }\n}\n\n.hy-process::after {\n  clear: both;\n}\n","export interface ProcessFlowBoxValue {\n  heading: string;\n  description: string;\n  step: string;\n}\n\nimport {Component, ComponentInterface, Prop, h, Element} from \"@stencil/core\";\nimport {ProcessFlowBoxVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n  tag: \"hy-process\",\n  styleUrl: \"process.scss\",\n  shadow: true,\n})\nexport class Process implements ComponentInterface {\n  @Element() el: HTMLElement;\n  @Prop() headerstyle: string = \"common\";\n  @Prop() numberTerm: string;\n  private _dataItems: ProcessFlowBoxValue[];\n  @Prop() dataItems: ProcessFlowBoxValue[] | string;\n\n  async componentWillLoad() {\n    this._dataItems = await jsonParserWorker(this.dataItems);\n  }\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    /*\n    - Logic:\n    - 3 items: big\n    - 4 items: small\n    - 5 items: big\n    - 6 items: big\n    - 7 items: small\n    - 8 items: small\n    - 9 items: big\n    * */\n    const bigVariants = [3, 5, 6, 9];\n    const processVariant = bigVariants.includes(this._dataItems.length)\n      ? ProcessFlowBoxVariants.default\n      : ProcessFlowBoxVariants.small;\n\n    const itemsPerRow = processVariant == ProcessFlowBoxVariants.small ? 4 : 3;\n    const classAttributes = [processVariant, \"hy-process\", `hy-process__${this.headerstyle}`].join(\" \");\n    const classItem = \"box\";\n    var stepState;\n\n    return [\n      <div class={classAttributes}>\n        {this._dataItems.map((x, index) => {\n          index % itemsPerRow == 0 ? (stepState = \"first\") : (stepState = \"default\");\n          return (\n            <hy-process-flow-box\n              class={classItem}\n              variant={processVariant}\n              box-number={index + 1}\n              box-title={x.heading}\n              box-description={x.description}\n              intermediate-step-title={x.step}\n              step-state={stepState}\n              number-term={this.numberTerm}\n            />\n          );\n        })}\n      </div>,\n    ];\n  }\n}\n",":host {\n  display: block;\n}\n\n.hy-process-flow-box {\n  height: calc(100% - 32px);\n  position: relative;\n\n  &__step__container {\n    bottom: unset;\n    display: grid;\n    height: 82px;\n    place-items: center;\n    position: absolute;\n    top: -35px;\n    width: 138px;\n    z-index: 1;\n\n    @include breakpoint($narrow) {\n      bottom: -62px;\n      display: grid;\n      height: 60px;\n      top: unset;\n      width: 210px;\n    }\n\n    svg polygon {\n      fill: var(--grayscale-background-arrow);\n    }\n\n    svg.mobile {\n      display: block;\n\n      @include breakpoint($narrow) {\n        display: none;\n      }\n    }\n\n    svg.desktop {\n      display: none;\n\n      @include breakpoint($narrow) {\n        display: block;\n      }\n    }\n  }\n\n  .first.even.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: -90px;\n    }\n\n    @include breakpoint($wide) {\n      left: 0;\n    }\n  }\n\n  .first.odd.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: 0;\n    }\n  }\n\n  :not(.first).even.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: -90px;\n    }\n  }\n\n  :not(.first).odd.hy-process-flow-box__step__container {\n    left: calc(50% - 69px + 16px);\n\n    @include breakpoint($narrow) {\n      left: 0;\n    }\n\n    @include breakpoint($wide) {\n      left: -90px;\n    }\n  }\n\n  &__step {\n    background-color: transparent;\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    font-size: 16px;\n    font-weight: 600;\n    hyphens: auto;\n    letter-spacing: 0;\n    line-height: 22px;\n    padding: 19px 17px;\n    position: absolute;\n    text-align: center;\n    word-break: break-word;\n    z-index: 11;\n\n    @include breakpoint($narrow) {\n      left: 0;\n      max-width: 175px;\n      padding: 8px 23px 8px 14px;\n    }\n  }\n\n  &__number__container {\n    display: grid;\n    height: 64px;\n    place-items: center;\n    position: relative;\n    width: 64px;\n    z-index: 2;\n  }\n\n  &__number {\n    background-color: var(--brand-main-light);\n    color: var(--grayscale-white);\n    display: grid;\n    font-family: var(--main-font-family);\n    font-size: 36px;\n    font-weight: 600;\n    height: 48px;\n    letter-spacing: 0;\n    line-height: 49px;\n    margin: 0;\n    padding: 0;\n    place-items: center;\n    position: relative;\n    width: 48px;\n\n    &::after {\n      content: \"\";\n      height: 48px;\n      left: -6px;\n      position: absolute;\n      width: 48px;\n    }\n  }\n\n  &__content.small {\n    padding: 16px 32px;\n    padding-bottom: 64px;\n\n    @include breakpoint($wide) {\n      padding: 20px;\n      padding-bottom: 64px;\n    }\n  }\n\n  &__content.big {\n    padding: 24px 32px;\n    padding-bottom: 64px;\n  }\n\n  &__content {\n    background-color: var(--grayscale-background-box);\n    height: 100%;\n    margin-left: 32px;\n    margin-top: -32px;\n    position: relative;\n  }\n\n  &__title {\n    color: var(--brand-main-nearly-black);\n    font-family: var(--main-font-family);\n    font-size: 26px;\n    font-weight: 600;\n    letter-spacing: -0.82px;\n    line-height: 32px;\n    hyphens: auto;\n    margin-bottom: 16px;\n    margin-top: 0;\n    word-break: break-word;\n  }\n\n  &__description {\n    color: var(--grayscale-dark);\n    font-family: var(--main-font-family);\n    font-size: 16px;\n    letter-spacing: 0;\n    line-height: 24px;\n  }\n}\n\n.small.hy-process-flow-box {\n  .small.hy-process-flow-box__number__container {\n    height: 56px;\n    width: 56px;\n\n    .hy-process-flow-box__number {\n      font-size: 28px;\n      height: 40px;\n      line-height: 40px;\n      width: 40px;\n    }\n  }\n}\n","import {Component, ComponentInterface, Prop, h, Host} from \"@stencil/core\";\nimport {ProcessFlowBoxVariants} from \"../../utils/utils\";\nimport {ProcessFlowBoxStepStates} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-process-flow-box\",\n  styleUrl: \"process-flow-box.scss\",\n  shadow: true,\n})\nexport class ProcessFlowBox implements ComponentInterface {\n  @Prop() variant: ProcessFlowBoxVariants = ProcessFlowBoxVariants.default;\n  @Prop() boxNumber: string;\n  @Prop() boxTitle: string;\n  @Prop() boxDescription: string;\n  @Prop() intermediateStepTitle: string = \"\";\n  @Prop() stepState: ProcessFlowBoxStepStates = \"default\";\n  @Prop() numberTerm: string;\n  render() {\n    const classVariant = [this.variant, \"hy-process-flow-box\"].join(\" \");\n    const classContentVariant = [this.variant, \"hy-process-flow-box__content\"].join(\" \");\n\n    const classIsEven = parseInt(this.boxNumber) % 2 == 0 ? \"even\" : \"odd\";\n\n    const classNumberVariant = [this.variant, \"hy-process-flow-box__number__container\"].join(\" \");\n    const classStepVariant = [this.variant, this.stepState, classIsEven, \"hy-process-flow-box__step__container\"].join(\n      \" \"\n    );\n\n    return (\n      <Host>\n        <div class={classVariant}>\n          {this.intermediateStepTitle && (\n            <div class={classStepVariant}>\n              <svg class=\"desktop\" width=\"210\" height=\"60\">\n                <polygon points=\"0 0, 0 60, 190 60, 210 30, 190 0, 0 0\" />\n              </svg>\n              <svg class=\"mobile\" width=\"138\" height=\"82\">\n                <polygon points=\"0 0, 69 15, 138 0, 138 50, 69 82, 0 50\" />\n              </svg>\n              <h2 class=\"hy-process-flow-box__step\">{this.intermediateStepTitle}</h2>\n            </div>\n          )}\n          <div class={classNumberVariant}>\n            <h2\n              class=\"hy-process-flow-box__number\"\n              aria-label={`${this.numberTerm && this.numberTerm} ${this.boxNumber}`}\n            >\n              <div class=\"hy-process-flow-box__number-title\">{this.boxNumber}</div>\n            </h2>\n          </div>\n          <div class={classContentVariant}>\n            <h3 class=\"hy-process-flow-box__title\" innerHTML={this.boxTitle}></h3>\n            <div class=\"hy-process-flow-box__description\" innerHTML={this.boxDescription}></div>\n          </div>\n        </div>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-prominent-image.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-prominent-image.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,0sEAA0sE;;MCcztE,gBAAgB;;;;;oBAGA,EAAE;uBACC,QAAQ;;;EAItC,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,mBAAmB,GAAG;MAC1B,oBAAoB;MACpB,IAAI,CAAC,WAAW;MAChB,uBAAuB,IAAI,CAAC,WAAW,EAAE;KAC1C,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,MAAM,kBAAkB,GAAG,CAAC,0BAA0B,EAAE,6BAA6B,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEnH,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,mBAAmB,IAC7B,WAAK,KAAK,EAAC,2BAA2B,IACpC,8BACc,IAAI,CAAC,SAAS,eACf,IAAI,CAAC,QAAQ,eACb,IAAI,CAAC,QAAQ,EACxB,gBAAgB,EAAE,CAAC,EACnB,iBAAiB,EAAE,CAAC,GACpB,CACE,EACL,IAAI,CAAC,SAAS,IAAI,WAAK,KAAK,EAAE,kBAAkB,IAAG,IAAI,CAAC,SAAS,CAAO,CACrE,CACD,EACP;GACH;;;;;;;","names":[],"sources":["./src/components/hy-prominent-image/hy-prominent-image.scss?tag=hy-prominent-image&encapsulation=shadow","./src/components/hy-prominent-image/hy-prominent-image.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-prominent-image {\n  position: relative;\n\n  &__text {\n    // font: h5 small size\n    @include font-size(16px, 20px);\n    background-color: var(--grayscale-black);\n    bottom: 12px;\n    color: var(--grayscale-white);\n    font-family: var(--main-font-family);\n    font-weight: bold;\n    left: -8px;\n    letter-spacing: -0.5px;\n    max-width: 46%; // 5.5 columns\n    padding: 6px 12px;\n    position: absolute;\n    text-transform: uppercase;\n\n    @include breakpoint($narrow) {\n      // font: h4 small size\n      @include font-size(18px, 24px);\n      bottom: 20px;\n      left: -16px;\n      letter-spacing: -0.56px;\n      max-width: 58%; // 7 columns\n      padding: 12px 24px;\n      position: absolute;\n    }\n\n    @include breakpoint($wide) {\n      // font: h4 medium size\n      @include font-size(22px, 28px);\n      bottom: 24px;\n      left: -16px;\n      letter-spacing: -0.69px;\n      padding: 16px 24px;\n      position: absolute;\n    }\n    @include breakpoint($xlarge) {\n      // font: h3 medium size\n      @include font-size(26px, 32px);\n      bottom: 28px;\n      left: -16px;\n      letter-spacing: -0.8px;\n      padding: 20px 24px;\n      position: absolute;\n    }\n\n    &__large {\n      @include breakpoint($extrawide) {\n        // font: h3 medium size\n        @include font-size(26px, 32px);\n        bottom: 28px;\n        left: -16px;\n        letter-spacing: -0.8px;\n        padding: 20px 24px;\n        position: absolute;\n      }\n    }\n  }\n}\n","export interface ImageSrcSet {\n  src: any;\n  media: string;\n  type: string;\n  sizes: string | null;\n}\n\nimport {Component, Element, Host, h, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-prominent-image\",\n  styleUrl: \"hy-prominent-image.scss\",\n  shadow: true,\n})\nexport class HyProminentImage {\n  @Prop() textTitle?: string;\n  @Prop() imageUrl?: string;\n  @Prop() imageAlt: string = \"\";\n  @Prop() headerstyle: string = \"common\";\n  @Prop() sourceSet: ImageSrcSet[] | string;\n  @Element() el: HTMLElement;\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const prominentImageClass = [\n      \"hy-prominent-image\",\n      this.headerstyle,\n      `hy-prominent-image__${this.headerstyle}`,\n    ].join(\" \");\n\n    const prominentImageText = [\"hy-prominent-image__text\", `hy-prominent-image__text__${this.headerstyle}`].join(\" \");\n\n    return (\n      <Host>\n        <div class={prominentImageClass}>\n          <div class=\"hy-prominent-image__image\">\n            <hy-image\n              source-set={this.sourceSet}\n              image-url={this.imageUrl}\n              image-alt={this.imageAlt}\n              aspectRatioWidth={2}\n              aspectRatioHeight={1}\n            />\n          </div>\n          {this.textTitle && <div class={prominentImageText}>{this.textTitle}</div>}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-quote.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-quote.entry.js","mappings":";;AAAA,MAAM,UAAU,GAAG,+2FAA+2F;;MCOr3F,OAAO;;;;uBAEY,QAAQ;;EAGtC,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,UAAU,GAAG,CAAC,UAAU,EAAE,IAAI,CAAC,WAAW,EAAE,aAAa,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC7F,QACE,WAAK,KAAK,EAAE,UAAU,IACpB,YAAM,KAAK,EAAC,wBAAwB,IAClC,WAAK,KAAK,EAAC,gBAAgB,IACzB,eAAS,IAAI,EAAE,eAAe,EAAE,IAAI,EAAE,EAAE,GAAI,CACxC,CACD,EACP,WAAK,KAAK,EAAC,uBAAuB,IAChC,WAAK,KAAK,EAAC,gBAAgB,IACzB,eAAa,CACT,EACL,IAAI,CAAC,cAAc,IAAI,WAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,cAAc,CAAO,CAChF,CACF,EACN;GACH;;;;;;;","names":[],"sources":["./src/components/hy-quote/hy-quote.scss?tag=hy-quote&encapsulation=shadow","./src/components/hy-quote/hy-quote.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-quote {\n  display: flex;\n  flex-direction: row;\n  padding: 0 8px;\n\n  @include breakpoint($narrow) {\n    flex-direction: column;\n    padding: 0;\n  }\n\n  @include breakpoint($wide) {\n    flex-direction: row;\n  }\n\n  &__icon-wrapper {\n    margin-right: 20px;\n\n    @include breakpoint($narrow) {\n      margin-right: 0;\n    }\n\n    @include breakpoint($wide) {\n      margin-right: 24px;\n    }\n\n    @include breakpoint($xlarge) {\n      margin-right: 32px;\n    }\n  }\n\n  &__icon {\n    svg {\n      fill: var(--brand-main-light);\n      height: 32px;\n      width: 32px;\n\n      @include breakpoint($wide) {\n        height: 40px;\n        width: 40px;\n      }\n      @include breakpoint($xlarge) {\n        height: 48px;\n        width: 48px;\n      }\n    }\n  }\n\n  &__text {\n    @include font-size(16px, 24px);\n\n    color: var(--grayscale-black);\n    font-family: var(--main-font-family);\n    font-weight: 600;\n    letter-spacing: -0.1px;\n    padding-bottom: 16px;\n    padding-top: 0;\n\n    @include breakpoint($narrow) {\n      @include font-size(18px, 28px);\n      padding-top: 16px;\n    }\n\n    @include breakpoint($extrawide) {\n      @include font-size(20px, 32px);\n      padding-top: 0;\n    }\n  }\n\n  &__signature:before {\n    @include font-size(14px, 20px);\n    display: inline-block;\n    color: var(--grayscale-dark);\n    content: \"-\";\n    font-family: var(--main-font-family);\n    letter-spacing: 0;\n    padding-right: 3px;\n  }\n\n  &__signature {\n    @include font-size(14px, 20px);\n    color: var(--grayscale-dark);\n    font-family: var(--main-font-family);\n    letter-spacing: 0;\n\n    @include breakpoint($narrow) {\n      @include font-size(16px, 24px);\n    }\n  }\n}\n","import {Component, Element, h, Prop} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-quote\",\n  styleUrl: \"hy-quote.scss\",\n  shadow: true,\n})\nexport class HyQuote {\n  @Prop() quoteSignature?: string;\n  @Prop() headerstyle: string = \"common\";\n  @Element() el: HTMLElement;\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const quoteClass = [\"hy-quote\", this.headerstyle, `hy-quote__${this.headerstyle}`].join(\" \");\n    return (\n      <div class={quoteClass}>\n        <span class=\"hy-quote__icon-wrapper\">\n          <div class=\"hy-quote__icon\">\n            <hy-icon icon={\"hy-icon-quote\"} size={48} />\n          </div>\n        </span>\n        <div class=\"hy-quote-text-wrapper\">\n          <div class=\"hy-quote__text\">\n            <slot></slot>\n          </div>\n          {this.quoteSignature && <div class=\"hy-quote__signature\">{this.quoteSignature}</div>}\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-row.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-row.entry.js","mappings":";;;AAAA,MAAM,MAAM,GAAG,2BAA2B;;ACG1C,MAAM,SAAS,GAAG,CAAC,OAAe,EAAE,KAAa,EAAE,MAAc;EAC/D,OAAO,GAAG,CAAA;;uBAEW,OAAO;mBACX,KAAK;;qBAEH,MAAM;;GAExB,CAAC;AACJ,CAAC,CAAC;MAOW,GAAG;;;mBAIY,SAAS;iBAIX,QAAQ;kBAIP,CAAC;;EAC1B,MAAM;IACJ,QACE,WAAK,KAAK,EAAE,SAAS,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,IAC1D,eAAa,CACT,EACN;GACH;;;;;;","names":[],"sources":["./src/components/hy-row/row.css?tag=hy-row","./src/components/hy-row/row.tsx"],"sourcesContent":["div.hy-row {\n  display: block;\n}\n","import {Component, h, Prop} from \"@stencil/core\";\nimport {css} from \"emotion\";\n\nconst createCss = (justify: string, align: string, margin: number) => {\n  return css`\n    display: flex;\n    justify-content: ${justify};\n    align-items: ${align};\n    > * + * {\n      margin-left: ${margin}rem;\n    }\n  `;\n};\n\n@Component({\n  tag: \"hy-row\",\n  styleUrl: \"row.css\",\n  shadow: false,\n})\nexport class Row {\n  /**\n   * justify-content property.\n   */\n  @Prop() justify: string = \"stretch\";\n  /**\n   * justify-content property.\n   */\n  @Prop() align: string = \"center\";\n  /**\n   * Left margin to be added to adjacent items.\n   */\n  @Prop() margin: number = 1;\n  render() {\n    return (\n      <div class={createCss(this.justify, this.align, this.margin)}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-section-container.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-section-container.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,ohDAAohD;;MCOniD,gBAAgB;;;;EAC3B,MAAM;IACJ,QACE,WAAK,KAAK,EAAC,uBAAuB,IAChC,eAAQ,CACJ,EACN;GACH;;;;;;","names":[],"sources":["./src/components/hy-section-container/section-container.scss?tag=hy-section-container","./src/components/hy-section-container/section-container.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-section--container {\n  display: block;\n  width: 100%;\n  margin-left: auto;\n  margin-right: auto;\n\n  @media only screen and (min-width: $narrow) {\n    width: 100%;\n  }\n\n  @media only screen and (min-width: $wide) {\n    width: 100%;\n    max-width: 60rem;\n  }\n\n  @media only screen and (min-width: $extrawide) {\n    width: 100%;\n    max-width: 75rem;\n  }\n}\n","import {Component, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-section-container\",\n  styleUrl: \"section-container.scss\",\n  shadow: false,\n})\nexport class SectionContainer {\n  render() {\n    return (\n      <div class=\"hy-section--container\">\n        <slot />\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-shortcuts.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-shortcuts.entry.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,onJAAonJ;;MCe9nJ,WAAW;;;;uBAIQ,EAAE;uBACF,SAAS;;EAGvC,gBAAgB,CAAC,QAAsC;IACrD,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;KACxC;SAAM;MACL,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC;KAC5B;GACF;EACD,iBAAiB;IACf,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GACvC;EAED,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,cAAc,EAAE,iBAAiB,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACxF,MAAM,mBAAmB,GAAG,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC/C,MAAM,mBAAmB,GAAG,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEpD,IAAI,SAAS,GAAG,CAAC,uBAAuB,EAAE,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,GAAG,OAAO,GAAG,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEzG,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,eAAe,IACxB,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,KAC1B,kBAAY,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,cAAc,CAAC,EAAE,IACtD,IAAI,CAAC,WAAW,CACN,CACd,EACD,WAAK,KAAK,EAAC,yBAAyB,IACjC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK;MAC5B,IAAI,WAAW,GAAG,EAAE,CAAC;MACrB,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,EAAE;QACnC,WAAW,GAAG,KAAK,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,GAAG,OAAO,GAAG,EAAE,CAAC;OACvD;WAAM;QACL,WAAW,GAAG,KAAK,IAAI,CAAC,GAAG,OAAO,GAAG,EAAE,CAAC;OACzC;MACD,IAAI,gBAAgB,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;MAC1D,IAAI,MAAM,GAAG,CAAC,CAAC,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;MAE/C,QACE,WAAK,KAAK,EAAE,gBAAgB,IAC1B,uBAAe,CAAC,CAAC,SAAS,EAAE,KAAK,EAAC,eAAe,EAAC,IAAI,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,IAC3E,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,OAAO,CAAQ,EACpD,YAAM,KAAK,EAAE,mBAAmB,IAC9B,eAAS,IAAI,EAAE,qBAAqB,EAAE,IAAI,EAAE,EAAE,GAAI,CAC7C,CACL,CACA,EACN;KACH,CAAC,CACE,CACF,EACN,cAAQ,EAAE,EAAC,oBAAoB,GAAG,CAC7B,EACP;GACH;;;;;;;;;;","names":[],"sources":["./src/components/hy-shortcuts/hy-shortcuts.scss?tag=hy-shortcuts","./src/components/hy-shortcuts/hy-shortcuts.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.hy-shortcuts {\n  overflow: hidden;\n\n  .shortcut-link-container {\n    display: flex;\n    flex-wrap: wrap;\n    margin: 0 calc(#{var(--gutter-mobile)}* -1);\n\n    @include breakpoint($narrow) {\n      margin: 0 calc(#{var(--gutter-narrow)}* -1);\n    }\n    @include breakpoint($wide) {\n      margin: 0 calc(#{var(--gutter-wide)}* -1);\n    }\n\n    .shortcut-link-wrapper {\n      min-height: 62px;\n      padding: 0 var(--gutter-mobile);\n\n      @include breakpoint($narrow) {\n        min-height: 70px;\n        padding: 0 var(--gutter-narrow);\n      }\n      @include breakpoint($wide) {\n        min-height: 82px;\n        padding: 0 var(--gutter-wide);\n      }\n    }\n\n    .shortcut-link-wrapper.box-3 {\n      width: 100%;\n\n      @include breakpoint($narrow) {\n        width: 33.33%;\n      }\n    }\n\n    .shortcut-link-wrapper.box-4 {\n      width: 50%;\n\n      @include breakpoint($narrow) {\n        width: 25%;\n      }\n    }\n\n    .shortcut-link-wrapper.box-3.first a.shortcut-link,\n    .shortcut-link-wrapper.box-4.first a.shortcut-link {\n      // mobile\n      border-top: 2.5px solid var(--brand-main-nearly-black);\n\n      @include breakpoint($narrow) {\n        // tablet\n        border-top: 3px solid var(--brand-main-nearly-black);\n      }\n    }\n\n    a.shortcut-link {\n      align-items: center;\n      background-color: transparent;\n      // mobile\n      border-bottom: 2.5px solid var(--brand-main-nearly-black);\n      color: var(--brand-main-nearly-black);\n      cursor: pointer;\n      display: flex;\n      font-family: var(--main-font-family);\n      font-size: 14px;\n      font-weight: 600;\n      hyphens: auto;\n      justify-content: space-between;\n      height: 100%;\n      letter-spacing: -0.44px;\n      line-height: 18px;\n      min-height: 70px;\n      position: relative;\n      text-decoration: none;\n      word-break: break-word;\n\n      @include breakpoint($narrow) {\n        // tablet\n        border-bottom: 3px solid var(--brand-main-nearly-black);\n        border-top: 3px solid var(--brand-main-nearly-black);\n        font-size: 16px;\n        letter-spacing: -0.5px;\n        line-height: 18px;\n        min-height: 70px;\n      }\n      @include breakpoint($wide) {\n        font-size: 16px;\n        letter-spacing: -0.5px;\n        line-height: 22px;\n        min-height: 82px;\n      }\n\n      .link-icon {\n        padding: 0 0 0 8px;\n        @include breakpoint($narrow) {\n          padding: 0 0 0 12px;\n        }\n        @include breakpoint($wide) {\n          padding: 0 4px 0 22px;\n        }\n\n        svg {\n          height: 20px;\n          fill: var(--brand-main-light);\n          width: 20px;\n          @include breakpoint($narrow) {\n            height: 24px;\n            width: 24px;\n          }\n          @include breakpoint($wide) {\n            height: 28px;\n            width: 28px;\n          }\n        }\n      }\n\n      &:hover {\n        color: var(--brand-main);\n        svg {\n          fill: var(--brand-main);\n        }\n      }\n    }\n  }\n}\n","export interface ShortcutLinkValue {\n  heading: string;\n  url: string;\n  isExternal: boolean;\n  ariaLabel: string;\n}\n\nimport {Component, ComponentInterface, Element, h, Host, Prop, Watch} from \"@stencil/core\";\nimport {HeadingVarians} from \"../../utils/utils\";\n\n@Component({\n  tag: \"hy-shortcuts\",\n  styleUrl: \"hy-shortcuts.scss\",\n  shadow: false,\n})\nexport class HyShortcuts implements ComponentInterface {\n  @Element() el: HTMLElement;\n  private _dataItems: ShortcutLinkValue[];\n  @Prop() dataItems: ShortcutLinkValue[] | string;\n  @Prop() listHeading: string = \"\";\n  @Prop() headerstyle: string = \"default\";\n\n  @Watch(\"dataItems\")\n  arrayDataWatcher(newValue: ShortcutLinkValue[] | string) {\n    if (typeof newValue === \"string\") {\n      this._dataItems = JSON.parse(newValue);\n    } else {\n      this._dataItems = newValue;\n    }\n  }\n  componentWillLoad() {\n    this.arrayDataWatcher(this.dataItems);\n  }\n\n  componentDidLoad() {\n    let hyMainDiv = this.el.closest(\".hy-main\");\n    if (hyMainDiv) {\n      if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n        this.headerstyle = \"large\";\n      }\n    }\n  }\n\n  render() {\n    const classAttributes = [\"hy-shortcuts\", `hy-shortcuts__${this.headerstyle}`].join(\" \");\n    const textClassAttributes = [\"text\"].join(\" \");\n    const iconClassAttributes = [\"link-icon\"].join(\" \");\n\n    let classItem = [\"shortcut-link-wrapper\", this._dataItems.length % 4 == 0 ? \"box-4\" : \"box-3\"].join(\" \");\n\n    return (\n      <Host>\n        <div class={classAttributes}>\n          {this.listHeading.length > 0 && (\n            <hy-heading class=\"list-title\" heading={HeadingVarians.h2}>\n              {this.listHeading}\n            </hy-heading>\n          )}\n          <div class=\"shortcut-link-container\">\n            {this._dataItems.map((x, index) => {\n              let isFirstLine = \"\";\n              if (this._dataItems.length % 4 == 0) {\n                isFirstLine = index == 0 || index == 1 ? \"first\" : \"\";\n              } else {\n                isFirstLine = index == 0 ? \"first\" : \"\";\n              }\n              let classLinkWrapper = classItem.concat(\" \", isFirstLine);\n              let target = x.isExternal ? \"_blank\" : \"_self\";\n\n              return (\n                <div class={classLinkWrapper}>\n                  <a aria-label={x.ariaLabel} class=\"shortcut-link\" href={x.url} target={target}>\n                    <span class={textClassAttributes}>{x.heading}</span>\n                    <span class={iconClassAttributes}>\n                      <hy-icon icon={\"hy-icon-arrow-right\"} size={28} />\n                    </span>\n                  </a>\n                </div>\n              );\n            })}\n          </div>\n        </div>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/hy-table-container.entry.js.map

@@ -1 +0,0 @@
-{"file":"hy-table-container.entry.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,g8IAAg8I;;MCO/8I,gBAAgB;;;;EAC3B,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEzD,QACE,EAAC,IAAI,IAAC,KAAK,EAAE,eAAe,IAC1B,eAAa,EACb,cAAQ,EAAE,EAAC,oBAAoB,GAAG,CAC7B,EACP;GACH;;;;;;","names":[],"sources":["./src/components/hy-table-container/hy-table-container.scss?tag=hy-table-container","./src/components/hy-table-container/hy-table-container.tsx"],"sourcesContent":[".hy-table-container {\n  @include font-size(14px, 18px);\n  display: block;\n  position: relative;\n  overflow: scroll;\n  white-space: nowrap;\n\n  @include breakpoint($narrow) {\n    @include font-size(16px, 20px);\n  }\n\n  table {\n    border-collapse: collapse;\n    border: 1px solid var(--grayscale-dark);\n    text-indent: initial;\n    width: 100%;\n  }\n\n  thead {\n    border-bottom: 1px solid var(--grayscale-dark);\n    border-left: 1px solid var(--grayscale-dark);\n    border-right: 1px solid var(--grayscale-dark);\n\n    th {\n      @include font-size(14px, 20px);\n      border-left: 1px solid black;\n      background-color: var(--grayscale-light);\n      text-transform: uppercase;\n\n      @include breakpoint($narrow) {\n        @include font-size(16px, 20px);\n      }\n    }\n  }\n\n  td,\n  th {\n    border: 1px solid var(--grayscale-dark);\n    background-clip: padding-box;\n    color: var(--grayscale-dark);\n    font-family: var(--main-font-family);\n    letter-spacing: -0.5px;\n    padding: 0.7em 0.9em;\n    text-align: left;\n    vertical-align: top;\n    word-wrap: break-word;\n\n    a {\n      text-decoration: none;\n\n      &:hover {\n        cursor: pointer;\n        text-decoration: underline;\n      }\n    }\n\n    p {\n      font-size: inherit;\n    }\n\n    &:first-child {\n      @include font-weight($bold);\n      border-collapse: separate;\n      border-right: none;\n      //border-left: none;\n      left: 0;\n      max-width: 180px;\n      min-width: 180px;\n      position: sticky;\n      white-space: normal;\n      width: 180px;\n      z-index: 2;\n\n      @include breakpoint($wide) {\n        border-right: 1px solid var(--grayscale-dark);\n      }\n\n      &::after {\n        content: \"\";\n        display: block;\n        position: absolute;\n        right: -10px;\n        bottom: 0;\n        width: 10px;\n        top: 0;\n        height: 100%;\n        background: linear-gradient(90deg, rgba(000, 000, 000, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n\n        @include breakpoint($wide) {\n          display: none;\n        }\n      }\n\n      &::before {\n        border-left: 1px solid black;\n        content: \"\";\n        display: block;\n        position: absolute;\n        left: -1px;\n        bottom: 0;\n        width: 1px;\n        top: 0;\n        height: 100%;\n\n        @include breakpoint($wide) {\n          display: none;\n        }\n      }\n\n      @include breakpoint($narrow) {\n        max-width: 220px;\n        min-width: 220px;\n        width: 220px;\n      }\n\n      @include breakpoint($medium) {\n        max-width: 300px;\n        min-width: 300px;\n        width: 300px;\n      }\n\n      @include breakpoint($wide) {\n        max-width: 40%;\n        min-width: 40%;\n        width: 40%;\n      }\n\n      &:only-child {\n        border: 1px solid var(--grayscale-dark);\n        &::after,\n        &::before {\n          display: none;\n        }\n      }\n    }\n  }\n\n  td {\n    background-color: var(--grayscale-white);\n    word-wrap: break-word;\n    white-space: normal;\n  }\n\n  caption {\n    margin-bottom: 1rem;\n  }\n}\n","import {Component, Host, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"hy-table-container\",\n  styleUrl: \"hy-table-container.scss\",\n  shadow: false,\n})\nexport class HyTableContainer {\n  render() {\n    const classAttributes = [\"hy-table-container\"].join(\" \");\n\n    return (\n      <Host class={classAttributes}>\n        <slot></slot>\n        <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n      </Host>\n    );\n  }\n}\n"],"version":3}