npm - @itcenteratunihelsinki/huds-lib - Versions diffs - 0.8.72 → 0.8.74 - Mend

@itcenteratunihelsinki/huds-lib 0.8.72 → 0.8.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1322) hide show

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

- {"version":3,"names":["hyListItemCss","keys","enter","space","HyListItem","ListItemVariants","default","relatedLinksWatcher","newValue","this","_relatedLinks","JSON","parse","additionalInfoWatcher","_additionalInfo","srcSetWatcher","data","_sourceSet","expandRelatedInfoPanel","target","contentSelector","variant","targetButtonClass","contentSection","document","querySelectorAll","id","isExpandedRelatedContent","classList","add","remove","handleKeyDown","event","key","code","targetElement","tagName","toLowerCase","possibleTags","some","r","indexOf","contains","includes","closest","preventDefault","handleClick","stopImmediatePropagation","componentWillLoad","relatedLinks","additionalInfo","sourceSet","componentDidLoad","hyMainDiv","el","headerstyle","degreeProgramme","image","querySelector","addEventListener","outputImageAspectRatio","imageHeight","naturalHeight","imageWidth","naturalWidth","inputImageAspectRatio","_imageMinWidth","_imageMinHeight","render","classWrapperAttributes","join","classAttributes","classInfoContainerAttributes","classInfoContainerHeader","classInfoContainerTitle","classInfoContainerDescription","classInfoContainerLinkContainer","classInfoContainerLinkIcon","classInfoContainerLink","isExternal","truncate","str","n","length","substr","position","classInfoContainerOutgoingLink","h","class","href","url","scLabel","icon","size","itemType","itemTitle","itemDescription","innerHTML","truncateDescription","truncateLimit","outGoingUrlLabel","classImageContainerAttributes","classImageContainerImage","classInfoContainerAdditionalInfoAttributes","withAdditionalInfo","classMetadataWrapper","classContentWrapper","classInfoContainerOutgoingLinkUrl","classRelatedInfoContainer","classRelatedInfoHeading","classRelatedInfoHeadingLink","classRelatedInfoHeadingButton","classRelatedInfoHeadingIcon","classRelatedInfoContent","classRelatedInfoLink","titleAsId","relatedLinksBlockTitle","replace","accordionItemHref","relatedLinksCount","map","item","srcSet","src","media","type","sizes","loading","disableLazy","itemImageUrl","alt","itemImageAlt","style","imageLabel","x","classInfoContainerAdditionalInfoItem","isActive","toString","text","tabindex","role","relatedLinkTarget","label"],"sources":["./src/components/hy-list-item/hy-list-item.scss?tag=hy-list-item","./src/components/hy-list-item/hy-list-item.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-list-item {\n display: flex;\n font-family: var(--main-font-family);\n text-decoration: none;\n\n &__default {\n margin-bottom: 28px;\n @include breakpoint($wide) {\n margin-bottom: 32px;\n }\n\n &__info-container {\n &__header {\n @include font-size(12px, 14px);\n color: var(--grayscale-dark);\n letter-spacing: 0;\n margin-bottom: 4px;\n\n @include breakpoint($narrow) {\n @include font-size(14px, 18px);\n margin-bottom: 2px;\n }\n }\n\n &__title {\n @include font-size(18px, 22px);\n @include font-weight($bold);\n color: var(--brand-main-light);\n letter-spacing: -0.56px;\n margin-bottom: 6px;\n\n @include breakpoint($narrow) {\n @include font-size(22px, 28px);\n letter-spacing: -0.69px;\n margin-bottom: 10px;\n }\n @include breakpoint($xlarge) {\n @include font-size(26px, 32px);\n letter-spacing: -0.8px;\n margin-bottom: 8px;\n }\n\n &__large {\n // >1200 no sidebar;\n @include breakpoint($extrawide) {\n @include font-size(26px, 32px);\n letter-spacing: -0.8px;\n margin-bottom: 8px;\n }\n }\n }\n\n &__link-container {\n align-items: center;\n display: flex;\n margin-bottom: 6px;\n\n @include breakpoint($narrow) {\n margin-bottom: 8px;\n }\n }\n\n &__link {\n @include font-size(12px, 16px);\n color: var(--grayscale-dark);\n letter-spacing: -0.07px;\n margin-left: 4px;\n\n @include breakpoint($narrow) {\n margin-left: 5px;\n }\n\n &__icon {\n svg {\n fill: var(--grayscale-dark);\n }\n }\n }\n\n &__description {\n @include font-size(14px, 20px);\n color: var(--grayscale-black);\n letter-spacing: 0;\n\n @include breakpoint($narrow) {\n @include font-size(16px, 24px);\n }\n }\n }\n }\n\n // Opem position\n &__position {\n background: radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);\n flex-direction: column;\n @include breakpoint($narrow) {\n flex-direction: row;\n }\n\n &__info-container {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n margin: 0;\n padding: 12px;\n position: relative;\n\n // 960-1600 with Sidebar;\n @include breakpoint($wide) {\n padding: 12px 16px;\n }\n // >1600 with sidebar same as >1200 without sidebar\n @include breakpoint($xlarge) {\n padding: 20px 24px;\n }\n\n &__header {\n display: flex;\n align-items: center;\n flex-direction: row;\n color: var(--brand-main);\n font-family: var(--main-font-family);\n font-size: 14px;\n font-weight: 600;\n letter-spacing: -0.2px;\n line-height: 14px;\n margin-bottom: 14px;\n\n .icon {\n margin-right: 0.75rem;\n\n svg {\n fill: var(--brand-main);\n }\n }\n }\n\n // >1200 no sidebar;\n &__large {\n @include breakpoint($extrawide) {\n padding: 20px 24px;\n }\n }\n\n &__data {\n display: flex;\n flex-direction: column;\n }\n\n &__title {\n @include font-size(18px, 20px);\n @include font-weight($bold);\n font-family: var(--main-font-family);\n color: var(--grayscale-black);\n margin-bottom: 12px;\n letter-spacing: -0.45px;\n line-height: 22px;\n\n @include breakpoint($narrow) {\n letter-spacing: -0.5px;\n }\n }\n\n &__description {\n @include font-size(14px);\n color: var(--grayscale-dark-text);\n display: none;\n font-family: var(--main-font-family);\n letter-spacing: 0.8px;\n margin-bottom: 14px;\n line-height: 20px;\n\n @include breakpoint($narrow) {\n display: block;\n }\n }\n\n &__outgoing-link {\n align-items: flex-end;\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n position: relative;\n padding: 0 24px 24px 12px;\n\n @include breakpoint($narrow) {\n justify-content: center;\n padding: 0 24px 24px 0;\n }\n\n .label {\n color: var(--link-blue);\n font-family: var(--main-font-family);\n font-size: 16px;\n font-weight: 600;\n letter-spacing: -0.3px;\n line-height: 20px;\n }\n\n .icon {\n margin-right: 4px;\n margin-bottom: 2px;\n\n svg {\n fill: var(--link-blue);\n }\n }\n }\n }\n }\n\n // Degree programmes.\n &__degree {\n background: radial-gradient(circle, var(--grayscale-light) 0%, var(--grayscale-background-box) 100%);\n flex-direction: column;\n @include breakpoint($narrow) {\n flex-direction: row;\n }\n\n &__image-container {\n display: block;\n position: relative;\n flex: 1;\n\n @include breakpoint($narrow) {\n flex: 0 0 24%;\n }\n\n &__image {\n vertical-align: bottom;\n max-width: 100%;\n height: 100%;\n\n img {\n object-fit: cover;\n width: 100%;\n height: 100%;\n }\n }\n\n span {\n @include font-weight($semibold);\n @include font-size(12px, 14px);\n background-color: var(--additional-yellow);\n box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);\n color: var(--grayscale-black);\n left: -4px;\n letter-spacing: -0.07px;\n padding: 5px 8px;\n position: absolute;\n top: 16px;\n text-transform: uppercase;\n\n @include breakpoint($narrow) {\n left: -8px;\n }\n @include breakpoint($wide) {\n top: 22px;\n }\n }\n }\n\n &__info-container {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n margin: 0;\n padding: 12px;\n position: relative;\n\n // 960-1600 with Sidebar;\n @include breakpoint($wide) {\n padding: 12px 16px;\n }\n // >1600 with sidebar same as >1200 without sidebar\n @include breakpoint($xlarge) {\n padding: 20px 24px;\n }\n\n // >1200 no sidebar;\n &__large {\n @include breakpoint($extrawide) {\n padding: 20px 24px;\n }\n }\n\n &__data {\n display: flex;\n flex-direction: column;\n }\n\n &__title {\n @include font-size(18px, 22px);\n @include font-weight($bold);\n color: var(--link-blue);\n letter-spacing: -0.54px;\n margin-bottom: 8px;\n\n // 960-1600 with Sidebar;\n @include breakpoint($wide) {\n @include font-size(18px, 24px);\n letter-spacing: -0.5px;\n }\n\n // >1600 with sidebar same as >1200 without sidebar\n @include breakpoint($xlarge) {\n @include font-size(20px, 26px);\n letter-spacing: -0.6px;\n }\n\n &__large {\n // >1200 no sidebar;\n @include breakpoint($extrawide) {\n @include font-size(20px, 26px);\n letter-spacing: -0.6px;\n }\n }\n }\n\n &__description {\n @include font-size(14px, 18px);\n color: var(--grayscale-dark);\n letter-spacing: 0;\n margin-bottom: 16px;\n\n // 960-1600 with Sidebar;\n @include breakpoint($wide) {\n letter-spacing: -0.2;\n }\n // >1600 with sidebar same as >1200 without sidebar\n @include breakpoint($xlarge) {\n @include font-size(16px, 20px);\n letter-spacing: -0.25px;\n }\n\n &__large {\n // >1200 no sidebar;\n @include breakpoint($extrawide) {\n @include font-size(16px, 20px);\n letter-spacing: -0.25px;\n }\n }\n }\n\n &__metadata-wrapper {\n display: flex;\n flex-direction: column;\n margin-top: 16px;\n width: 100%;\n\n @include breakpoint($narrow) {\n align-items: center;\n flex-direction: row;\n justify-content: space-between;\n }\n\n &.link-only {\n justify-content: flex-end;\n }\n }\n\n &__additional-info {\n width: 100%;\n\n &__item {\n @include font-size(12px, 16px);\n @include font-weight($light);\n align-items: center;\n color: var(--grayscale-black);\n display: flex;\n flex-direction: row;\n letter-spacing: -0.2px;\n\n @include breakpoint($xlarge) {\n @include font-size(14px, 16px);\n }\n // >1200 no sidebar;\n &__large {\n @include breakpoint($extrawide) {\n @include font-size(14px, 16px);\n }\n }\n }\n &__item.active::before {\n content: \" \";\n box-sizing: border-box;\n height: 14px;\n width: 14px;\n border: 3px solid #ffffff;\n border-radius: 50%;\n background-color: #f9a21a;\n left: -7px;\n position: absolute;\n\n @include breakpoint($narrow) {\n border: none;\n height: 8px;\n margin-right: 6px;\n width: 8px;\n left: 0;\n position: relative;\n }\n }\n }\n\n &__outgoing-link {\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n position: relative;\n width: 100%;\n\n a {\n align-items: center;\n bottom: 0;\n top: 0;\n display: flex;\n flex-direction: row;\n position: relative;\n right: -18px;\n text-decoration: none;\n\n @include breakpoint($wide) {\n right: -22px;\n }\n @include breakpoint($xlarge) {\n right: -30px;\n }\n\n .label {\n @include font-size(14px, 16px);\n @include font-weight($bold);\n color: var(--link-blue);\n letter-spacing: -0.5px;\n margin-right: 8px;\n text-align: right;\n }\n\n .icon-wrapper {\n background-color: var(--brand-main-light);\n z-index: 10;\n\n .icon {\n position: relative;\n overflow: hidden;\n\n svg {\n background-color: transparent;\n box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);\n fill: var(--grayscale-white);\n padding: 6.4px;\n\n @include breakpoint($xlarge) {\n height: 36px;\n width: 36px;\n padding: 7.2px;\n }\n }\n }\n }\n }\n\n // >1200 no sidebar;\n &__large {\n svg {\n @include breakpoint($extrawide) {\n height: 36px;\n width: 36px;\n padding: 7.2px;\n }\n }\n }\n }\n }\n }\n}\n\n.hy-list-item-wrapper {\n font-family: var(--main-font-family);\n\n &__degree {\n margin-bottom: 16px;\n @include breakpoint($narrow) {\n flex-direction: row;\n margin-bottom: 24px;\n }\n @include breakpoint($wide) {\n margin-bottom: 28px;\n }\n @include breakpoint($xlarge) {\n margin-bottom: 32px;\n }\n // >1200 no sidebar;\n &__large {\n @include breakpoint($extrawide) {\n margin-bottom: 32px;\n }\n }\n\n &__related-info {\n background: radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);\n margin-top: 4px;\n padding: 0 12px 0 16px;\n\n @include breakpoint($narrow) {\n padding: 0 24px 0 16px;\n }\n @include breakpoint($wide) {\n margin-top: 6px;\n padding: 0 24px 0 24px;\n }\n @include breakpoint($xlarge) {\n margin-top: 8px;\n }\n // >1200 no sidebar;\n &__large {\n @include breakpoint($extrawide) {\n margin-top: 8px;\n }\n }\n\n &__heading {\n &__link {\n text-decoration: none;\n }\n\n &__button {\n @include font-size(12px, 16px);\n align-items: center;\n background: radial-gradient(circle, #f8f8f8 0%, #f5f5f5 100%);\n border: none;\n color: var(--grayscale-black);\n display: flex;\n flex-direction: row;\n font-family: var(--main-font-family);\n letter-spacing: -0.2px;\n height: 100%;\n padding: 8px 0;\n text-align: left;\n width: 100%;\n\n @include breakpoint($narrow) {\n @include font-size(12px, 20px);\n padding: 14px 0;\n }\n @include breakpoint($wide) {\n @include font-size(14px, 20px);\n letter-spacing: -0.4px;\n padding: 18px 0;\n }\n\n &:hover {\n cursor: pointer;\n }\n\n &__is-open {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n\n &__icon {\n margin-right: 0.5rem;\n z-index: 0;\n\n @include breakpoint($wide) {\n margin-right: 12px;\n }\n\n svg {\n fill: var(--brand-main);\n height: 14px;\n width: 14px;\n\n @include breakpoint($wide) {\n height: 18px;\n width: 18px;\n }\n }\n }\n }\n\n &__content {\n display: none;\n\n &__is-open {\n border-top: 1px solid #d2d2d2;\n display: flex;\n flex-direction: column;\n padding: 20px 8px 5px 8px;\n\n @include breakpoint($wide) {\n padding: 20px 0 14px 0;\n }\n }\n }\n\n &__link {\n @include font-size(14px, 16px);\n @include font-weight($bold);\n color: var(--link-blue);\n letter-spacing: -0.4px;\n margin-bottom: 16px;\n text-decoration: none;\n }\n }\n }\n}\n","export interface RelatedLink {\n label: string;\n url: string;\n isExternal: boolean;\n scLabel: string;\n}\n\nexport interface AdditionalInfo {\n text: string;\n isActive: boolean;\n}\n\nexport interface ImageSrcSet {\n src: any;\n media: string;\n type: string;\n sizes: string | null;\n}\n\nimport {Component, h, Prop, Watch, State, Listen, Element} from \"@stencil/core\";\nimport {ListItemVariants} from \"../../utils/utils\";\n\nlet keys = {\n enter: \"Enter\",\n space: \"Space\",\n};\n\n@Component({\n tag: \"hy-list-item\",\n styleUrl: \"hy-list-item.scss\",\n shadow: false,\n})\nexport class HyListItem {\n @Element() el: HTMLElement;\n @State() isExpandedRelatedContent: boolean = false;\n @Prop() variant: ListItemVariants = ListItemVariants.default;\n @Prop() itemType?: string;\n @Prop() itemTitle?: string;\n @Prop() itemDescription?: any;\n @Prop() url?: string;\n @Prop() isExternal: boolean = false;\n @Prop() scLabel?: string;\n @Prop() itemImageUrl?: string;\n @Prop() itemImageAlt?: string;\n @Prop() disableLazy: boolean = false;\n @Prop() relatedLinksBlockTitle?: string;\n private _relatedLinks: RelatedLink[];\n @Prop() relatedLinks?: RelatedLink[] | string;\n @Prop() imageLabel?: string;\n @Prop() outGoingUrlLabel?: string = \"Go to programme page\";\n private _additionalInfo: AdditionalInfo[];\n @Prop() additionalInfo?: AdditionalInfo[] | string;\n @Prop() headerstyle: string = \"common\";\n private _sourceSet: ImageSrcSet[];\n @Prop() sourceSet: ImageSrcSet[] | string;\n @Prop() truncateDescription: boolean = false;\n @Prop() truncateLimit: number = 140;\n\n @State() _imageMinHeight: number = 0;\n @State() _imageMinWidth: number = 0;\n\n @Watch(\"relatedLinks\")\n relatedLinksWatcher(newValue: RelatedLink[] | string) {\n if (typeof newValue === \"string\") {\n this._relatedLinks = JSON.parse(newValue);\n } else {\n this._relatedLinks = newValue;\n }\n }\n\n @Watch(\"additionalInfo\")\n additionalInfoWatcher(newValue: AdditionalInfo[] | string) {\n if (typeof newValue === \"string\") {\n this._additionalInfo = JSON.parse(newValue);\n } else {\n this._additionalInfo = newValue;\n }\n }\n\n @Watch(\"sourceSet\") srcSetWatcher(data: ImageSrcSet[] | string) {\n this._sourceSet = typeof data === \"string\" ? JSON.parse(data) : data;\n }\n\n expandRelatedInfoPanel(target) {\n let contentSelector = `hy-list-item-wrapper__${this.variant}__related-info__content`;\n let targetButtonClass = \"hy-list-item-wrapper__degree__related-info__heading__button\";\n let contentSection = document.querySelectorAll(`[aria-labelledBy=\"${target.id}\"]`)[0] as HTMLElement;\n if (contentSection) {\n if (!this.isExpandedRelatedContent) {\n contentSection.classList.add(`${contentSelector}__is-open`);\n target.classList.add(`${targetButtonClass}__is-open`);\n } else {\n contentSection.classList.remove(`${contentSelector}__is-open`);\n target.classList.remove(`${targetButtonClass}__is-open`);\n }\n this.isExpandedRelatedContent = !this.isExpandedRelatedContent;\n }\n }\n\n @Listen(\"keydown\")\n handleKeyDown(event: KeyboardEvent) {\n const key = event.code;\n let target = event.target as HTMLButtonElement;\n\n const targetElement = target.tagName.toLowerCase();\n const possibleTags = [targetElement].some((r) => [\"svg\", \"path\", \"button\", \"a\"].indexOf(r) >= 0);\n\n if (\n target &&\n possibleTags &&\n !target.classList.contains(\"hy-list-item-wrapper__degree__related-info__link\") &&\n [keys.enter, keys.space].includes(key)\n ) {\n if (targetElement !== \"button\") {\n target = target.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`);\n }\n this.expandRelatedInfoPanel(target);\n event.preventDefault();\n }\n }\n\n @Listen(\"click\")\n handleClick(event) {\n let target = event.target as HTMLElement;\n const targetElement = target.tagName.toLowerCase();\n const possibleTags = [targetElement].some((r) => [\"svg\", \"path\", \"button\", \"a\"].indexOf(r) >= 0);\n\n if (target && possibleTags && !target.classList.contains(\"hy-list-item-wrapper__degree__related-info__link\")) {\n if (targetElement !== \"button\") {\n target = target.closest(`.hy-list-item-wrapper__${this.variant}__related-info__heading__button`);\n }\n this.expandRelatedInfoPanel(target);\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n }\n\n componentWillLoad() {\n this.relatedLinksWatcher(this.relatedLinks);\n this.additionalInfoWatcher(this.additionalInfo);\n this.srcSetWatcher(this.sourceSet);\n }\n\n componentDidLoad() {\n let hyMainDiv = this.el.closest(\".hy-main\");\n if (hyMainDiv) {\n if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n this.headerstyle = \"large\";\n }\n }\n if (this.variant == ListItemVariants.degreeProgramme) {\n const image = document.querySelector(\".hy-list-item__degree__image-container__image img\") as any;\n\n if (image) {\n image.addEventListener(\"load\", function () {\n const outputImageAspectRatio = 1;\n const imageHeight = image.naturalHeight;\n const imageWidth = image.naturalWidth;\n const inputImageAspectRatio = imageWidth / imageHeight;\n this._imageMinWidth = imageWidth;\n this._imageMinHeight = imageHeight;\n if (inputImageAspectRatio > outputImageAspectRatio) {\n this._imageMinWidth = imageHeight * outputImageAspectRatio;\n } else if (inputImageAspectRatio < outputImageAspectRatio) {\n this._imageMinHeight = imageWidth / outputImageAspectRatio;\n }\n });\n }\n }\n }\n\n render() {\n const classWrapperAttributes = [\n \"hy-list-item-wrapper\",\n `hy-list-item-wrapper__${this.variant}`,\n `hy-list-item-wrapper__${this.variant}__${this.headerstyle}`,\n ].join(\" \");\n const classAttributes = [\"hy-list-item\", `hy-list-item__${this.variant}`].join(\" \");\n const classInfoContainerAttributes = [\n `hy-list-item__${this.variant}__info-container`,\n `hy-list-item__${this.variant}__info-container__${this.headerstyle}`,\n ].join(\" \");\n /*const classInfoContainerDataAttributes = [\n `hy-list-item__${this.variant}__info-container__data`,\n `hy-list-item__${this.variant}__info-container__data__${this.headerstyle}`,\n ].join(' ');*/\n const classInfoContainerHeader = [\n `hy-list-item__${this.variant}__info-container__header`,\n `hy-list-item__${this.variant}__info-container__header__${this.headerstyle}`,\n ].join(\" \");\n const classInfoContainerTitle = [\n `hy-list-item__${this.variant}__info-container__title`,\n `hy-list-item__${this.variant}__info-container__title__${this.headerstyle}`,\n ].join(\" \");\n const classInfoContainerDescription = [\n `hy-list-item__${this.variant}__info-container__description`,\n `hy-list-item__${this.variant}__info-container__description__${this.headerstyle}`,\n ].join(\" \");\n const classInfoContainerLinkContainer = [`hy-list-item__${this.variant}__info-container__link-container`].join(\" \");\n const classInfoContainerLinkIcon = [`hy-list-item__${this.variant}__info-container__link__icon`].join(\" \");\n const classInfoContainerLink = [`hy-list-item__${this.variant}__info-container__link`].join(\" \");\n\n const target = this.isExternal ? \"_blank\" : \"_self\";\n\n function truncate(str, n) {\n return str.length > n ? str.substr(0, n - 1) + \"...\" : str;\n }\n\n switch (this.variant) {\n case ListItemVariants.position: {\n const classInfoContainerOutgoingLink = [\n `hy-list-item__${this.variant}__info-container__outgoing-link`,\n `hy-list-item__${this.variant}__info-container__outgoing-link__${this.headerstyle}`,\n ].join(\" \");\n return (\n <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"],"mappings":"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"}

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

- {"version":3,"names":["paragraphTextContentCss","defaultParagraphTextCss","paragraphTextLandingCss","ParagraphText","componentDidLoad","hyMainDiv","this","el","closest","classList","contains","headerstyle","render","classAttributes","variant","placement","join","h","Host","class"],"sources":["./src/components/hy-paragraph-text/paragraph-text-content.scss?tag=hy-paragraph-text&mode=content","./src/components/hy-paragraph-text/paragraph-text.scss?tag=hy-paragraph-text&mode=default","./src/components/hy-paragraph-text/paragraph-text-landing.scss?tag=hy-paragraph-text&mode=landing","./src/components/hy-paragraph-text/paragraph-text.tsx"],"sourcesContent":["//overrides for Content pages\n\n/*\n* Common styles for text plus mobile & tablet & small desktop\n* in Content Pages and Field of science pages.\n*/\n.hy-paragraph-text.content_page.external,\n.hy-paragraph-text.field_of_science.external {\n margin-top: 24px; //total gap between heading h2 and paragraph content is 48px\n\n @include breakpoint($narrow) {\n margin-top: 16px; //total gap 40px\n }\n @include breakpoint($wide) {\n margin-top: 32px; //total gap 56px\n }\n}\n\n// There is a sidebar on the Content page\n.hy-paragraph-text.content_page.external.default,\n.hy-paragraph-text.field_of_science.external.default {\n @include breakpoint($extrawide) {\n margin-top: 32px; //total gap 56px\n }\n @include breakpoint($xlarge) {\n margin-top: 40px; //total gap 64px\n }\n}\n\n// No sidebar on the Content page\n.hy-paragraph-text.content_page.external.large,\n.hy-paragraph-text.field_of_science.external.large {\n @include breakpoint($extrawide) {\n margin-top: 40px; //total gap 64px\n }\n @include breakpoint($xlarge) {\n margin-top: 40px; //total gap 64px\n }\n}\n\n.hy-paragraph-text.content_page,\n.hy-paragraph-text.field_of_science {\n h3 {\n // text H3 small\n @include font-size(22px, 28px);\n letter-spacing: -0.7px;\n\n padding-bottom: 12px;\n padding-top: 24px;\n\n @include breakpoint($narrow) {\n // text H3 Medium size\n @include font-size(26px, 32px);\n letter-spacing: -0.8px;\n\n padding-bottom: 12px;\n padding-top: 28px;\n }\n\n @include breakpoint($wide) {\n padding-bottom: 16px;\n padding-top: 32px;\n }\n }\n\n h4 {\n // text H4 small\n @include font-size(18px, 24px);\n letter-spacing: -0.56px;\n\n padding-bottom: 12px;\n padding-top: 24px;\n\n @include breakpoint($narrow) {\n // text H4 Medium size\n @include font-size(22px, 28px);\n letter-spacing: -0.69px;\n\n padding-bottom: 12px;\n padding-top: 28px;\n }\n\n @include breakpoint($wide) {\n padding-bottom: 16px;\n padding-top: 32px;\n }\n }\n\n h5 {\n // text H5 small\n @include font-size(16px, 20px);\n letter-spacing: -0.5px;\n\n padding-bottom: 12px;\n padding-top: 24px;\n\n @include breakpoint($narrow) {\n // text H5 Medium size\n @include font-size(18px, 24px);\n letter-spacing: -0.56px;\n\n padding-bottom: 12px;\n padding-top: 28px;\n }\n\n @include breakpoint($wide) {\n padding-bottom: 16px;\n padding-top: 32px;\n }\n }\n\n h6 {\n // text H6 small\n @include font-size(14px, 16px);\n letter-spacing: -0.44px;\n\n padding-bottom: 12px;\n padding-top: 24px;\n\n @include breakpoint($narrow) {\n // text H6 Medium size\n @include font-size(16px, 20px);\n letter-spacing: -0.5px;\n\n padding-bottom: 12px;\n padding-top: 28px;\n }\n\n @include breakpoint($wide) {\n padding-bottom: 16px;\n padding-top: 32px;\n }\n }\n}\n","@import \"./paragraph-text-content.scss\";\n@import \"./paragraph-text-landing.scss\";\n\n:host {\n display: block;\n}\n\n// General styles for text paragraph\n.hy-paragraph-text {\n @include font-size(15px, 22px); // Paragraph Small size\n color: var(--grayscale-dark-text);\n font-family: var(--main-font-family);\n letter-spacing: 0;\n 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"],"mappings":"6DAAA,MAAMA,EAA0B,0iICAhC,MAAMC,EAA0B,gySCAhC,MAAMC,EAA0B,8mG,MCWnBC,EAAa,M,+DAEI,W,iBACE,S,CAG9BC,mBACE,IAAIC,EAAYC,KAAKC,GAAGC,QAAQ,YAChC,GAAIH,EAAW,CACb,IAAKA,EAAUI,UAAUC,SAAS,gBAAiB,CACjDJ,KAAKK,YAAc,O,GAKzBC,SACE,MAAMC,EAAkB,CACtB,oBACA,sBAAsBP,KAAKK,cAC3B,GAAGL,KAAKQ,UACR,GAAGR,KAAKS,YACR,GAAGT,KAAKK,eACRK,KAAK,KAEP,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAON,GACVI,EAAA,c"}

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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

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

@@ -1 +0,0 @@

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