npm - @itcenteratunihelsinki/huds-lib - Versions diffs - 0.8.45 → 0.8.50 - Mend

@itcenteratunihelsinki/huds-lib 0.8.45 → 0.8.50

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 (787) hide show

package/components/hy-hero.js CHANGED Viewed

@@ -153,3 +153,5 @@ const HyHero = HyHero$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyHero, defineCustomElement };
+//# sourceMappingURL=hy-hero.js.map

package/components/hy-hero.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-hero.js","mappings":"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","names":["HyHero"],"sources":["./src/components/hy-hero/hy-hero.scss?tag=hy-hero","./src/components/hy-hero/hy-hero.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-hero {\n position: relative;\n padding-bottom: 0;\n\n @include breakpoint($wide) {\n margin-top: 32px;\n }\n\n &:not(.has-shortcuts) {\n @include breakpoint($wide) {\n margin-bottom: 32px;\n }\n }\n\n .without-sidebar & {\n @include breakpoint($extrawide) {\n max-width: 1216px;\n margin-right: auto;\n margin-left: auto;\n }\n }\n\n .with-sidebar & {\n @include breakpoint($extrawide) {\n padding-left: 32px;\n padding-right: 32px;\n }\n\n @include breakpoint($xlarge) {\n padding-right: 0;\n padding-left: 0;\n max-width: 1216px;\n margin-right: auto;\n margin-left: auto;\n }\n }\n\n &--white {\n @include breakpoint($wide) {\n margin-top: 0;\n }\n\n &:not(.has-shortcuts) {\n @include breakpoint($wide) {\n padding-bottom: 48px;\n }\n }\n\n &:not(.has-shortcuts):after {\n width: 100%;\n background-color: var(--grayscale-medium-dark);\n height: 1px;\n content: \"\";\n margin: 0 auto;\n display: block;\n\n @include breakpoint($wide) {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n }\n }\n\n &:not(.hy-hero--front_page):after {\n max-width: 1216px;\n }\n }\n}\n\n.hy-hero__container {\n position: relative;\n\n @include breakpoint($wide) {\n display: grid;\n position: relative;\n }\n\n .hy-hero--small & {\n @include breakpoint($wide) {\n grid-template-columns: 60% 1fr;\n }\n }\n\n .hy-hero--large & {\n @include breakpoint($wide) {\n grid-template-columns: repeat(2, 1fr);\n }\n }\n}\n\n.hy-hero__content-container {\n padding: 24px 1rem 40px;\n margin: 0 auto;\n width: 100%;\n\n @include breakpoint($narrow) {\n padding: 40px 2rem;\n }\n\n @include breakpoint($extrawide) {\n align-items: center;\n display: flex;\n padding: 40px 24px;\n }\n\n @include breakpoint($xlarge) {\n max-width: 1216px;\n }\n\n .hy-hero--black & {\n background-color: var(--grayscale-black);\n }\n\n .hy-hero--blue & {\n background-color: var(--brand-main);\n }\n\n .hy-hero--white & {\n background-color: var(--grayscale-white);\n\n @include breakpoint($extrawide) {\n padding: 40px 24px 40px 0;\n }\n }\n}\n\n.hy-hero__content {\n position: relative;\n}\n\nh2.hy-hero__title {\n hyphens: auto;\n display: flex;\n flex-grow: 1;\n flex-shrink: 0;\n max-width: 100%;\n width: auto;\n\n .hy-hero--blue & {\n color: var(--grayscale-white) !important;\n }\n\n .hy-hero--black & {\n color: var(--grayscale-white) !important;\n }\n\n .hy-hero--white & {\n color: var(--grayscale-black) !important;\n }\n\n &.hy-heading__hero {\n @include font-size(36px, 33px);\n @include font-weight($bold);\n color: var(--grayscale-black);\n font-family: var(--main-font-family);\n letter-spacing: -0.8px;\n margin-bottom: 0;\n text-transform: none;\n\n @include breakpoint(1024px) {\n @include font-size(36px, 40px);\n letter-spacing: -1.15px;\n }\n\n @include breakpoint($xlarge) {\n @include font-size(38px, 48px);\n letter-spacing: -1.3px;\n }\n }\n}\n\n.hy-hero__description {\n @include font-size(16px, 24px);\n font-family: var(--main-font-family);\n margin: 16px 0 0 0;\n padding: 0;\n position: relative;\n\n @include breakpoint($xlarge) {\n @include font-size(17px, 26px);\n }\n\n .hy-hero--black & {\n color: var(--grayscale-white);\n }\n\n .hy-hero--blue & {\n color: var(--grayscale-white);\n }\n\n .hy-hero--white & {\n color: var(--grayscale-black);\n }\n}\n\n.hy-hero__actions {\n margin-top: 24px;\n}\n\n.hy-hero__image-container {\n margin: 0;\n padding: 0;\n position: relative;\n\n figure {\n margin: 0;\n }\n\n @include breakpoint($wide) {\n order: 2;\n padding: 8px 0;\n }\n\n .hy-hero--front_page & {\n @include breakpoint($wide) {\n padding: 0;\n }\n }\n}\n\n.hy-image__image {\n display: block;\n height: 100%;\n min-height: 205px;\n object-fit: contain;\n width: 100%;\n\n .has-cover & {\n object-fit: cover;\n }\n}\n\n// Research group and generic with minor landing\n.hy-hero.hy-hero--group_landing.hy-hero--generic_site_group,\n.hy-hero.hy-hero--research_group {\n h2.hy-hero__title.hy-heading__hero {\n @include font-size(32px, 38px);\n @include font-weight($bold);\n color: var(--grayscale-black);\n font-family: var(--main-font-family);\n letter-spacing: -0.8px;\n margin-bottom: 0;\n text-transform: uppercase;\n\n @include breakpoint(1024px) {\n @include font-size(46px, 54px);\n letter-spacing: -1.15px;\n }\n\n @include breakpoint($xlarge) {\n @include font-size(52px, 60px);\n letter-spacing: -1.3px;\n }\n }\n}\n\n// FRONTPAGE VARIATION\n\n.hy-hero.hy-hero--front_page {\n &.hy-hero--white {\n @include breakpoint($wide) {\n padding-top: 40px;\n margin-top: 0;\n }\n }\n\n h2.hy-hero__title.hy-heading__hero {\n @include font-size(32px, 38px);\n @include font-weight($bold);\n color: var(--grayscale-black);\n font-family: var(--main-font-family);\n letter-spacing: -0.8px;\n margin-bottom: 0;\n text-transform: uppercase;\n\n @include breakpoint(1024px) {\n @include font-size(46px, 54px);\n letter-spacing: -1.15px;\n }\n\n @include breakpoint($xlarge) {\n @include font-size(52px, 60px);\n letter-spacing: -1.3px;\n }\n }\n\n @include breakpoint($extrawide) {\n margin-left: -32px;\n margin-right: -32px;\n max-width: none;\n }\n\n .hy-hero__container {\n position: relative;\n\n @include breakpoint($wide) {\n display: flex;\n position: relative;\n }\n }\n\n .hy-hero__content-container {\n padding: 24px 1rem 40px;\n margin: 0 auto;\n width: 100%;\n\n .hy-hero--black & {\n background-color: var(--grayscale-black);\n }\n\n .hy-hero--blue & {\n background-color: var(--brand-main);\n }\n\n .hy-hero--white & {\n background-color: var(--grayscale-white);\n }\n\n @include breakpoint($narrow) {\n padding: 24px 2rem 40px;\n }\n\n @include breakpoint($wide) {\n align-items: center;\n display: flex;\n min-height: 330px;\n padding: 56px 2rem;\n }\n\n @include breakpoint(1060px) {\n min-height: 373px;\n }\n\n @include breakpoint(1160px) {\n min-height: 480px;\n }\n\n @include breakpoint($extrawide) {\n padding-left: 32px;\n padding-right: 8px;\n }\n\n @include breakpoint(1260px) {\n min-height: 443px;\n }\n\n @include breakpoint(1280px) {\n max-width: 1216px;\n padding-left: 0;\n }\n\n @include breakpoint(1360px) {\n min-height: 478px;\n }\n\n @include breakpoint(1460px) {\n min-height: 513px;\n }\n\n @include breakpoint(1560px) {\n min-height: 548px;\n }\n\n @include breakpoint($xlarge) {\n padding-left: 0;\n }\n\n @include breakpoint(1660px) {\n min-height: 583px;\n }\n\n @include breakpoint(1760px) {\n min-height: 619px;\n }\n\n @include breakpoint(1860px) {\n min-height: 654px;\n }\n\n @include breakpoint(1920px) {\n min-height: 675px;\n }\n }\n\n &.hy-hero--small {\n .hy-hero__image-container {\n @include breakpoint($wide) {\n width: 40%;\n }\n }\n\n .hy-hero__content {\n @include breakpoint($wide) {\n max-width: 60%;\n }\n }\n }\n\n &.hy-hero--large {\n .hy-hero__image-container {\n @include breakpoint($wide) {\n width: 50%;\n }\n }\n\n .hy-hero__content {\n @include breakpoint($wide) {\n max-width: 50%;\n }\n }\n }\n\n .hy-hero__image-container {\n background-position: 50% 50%;\n background-size: cover;\n background: transparent;\n margin: 0;\n padding: 0;\n position: relative;\n\n figure {\n margin: 0;\n }\n\n @include breakpoint($wide) {\n background-color: var(--grayscale-white);\n bottom: 0;\n order: 2;\n padding: 8px 0;\n position: absolute;\n right: 0;\n top: 0;\n }\n }\n\n .hy-hero__content {\n position: relative;\n\n @include breakpoint($wide) {\n padding-right: 24px;\n }\n }\n\n .hy-image__image {\n display: block;\n height: 100%;\n min-height: 205px;\n object-fit: cover;\n width: 100%;\n }\n}\n\n.hy-hero__spacer-box {\n display: none;\n\n @include breakpoint($wide) {\n display: block;\n order: 1;\n position: absolute;\n inset: 0;\n }\n\n .hy-hero--small & {\n @include breakpoint($wide) {\n width: 60%;\n }\n }\n\n .hy-hero--large & {\n @include breakpoint($wide) {\n width: 50%;\n }\n }\n\n .hy-hero--black & {\n background-color: var(--grayscale-black);\n }\n\n .hy-hero--blue & {\n background-color: var(--brand-main);\n }\n\n .hy-hero--white & {\n background-color: var(--grayscale-white);\n }\n}\n","export interface ImageSrcSet {\n src: any;\n media: string;\n type: string;\n sizes: string | null;\n}\nlet timeout = null;\nlet delay = 250;\n\nimport {Component, Element, h, Host, Prop} from \"@stencil/core\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\nimport {\n CtaLinkButtonVariants,\n HeroColorVariant,\n HeroSizeVariant,\n HeroGroupTypeVariant,\n HeroTypeVariant,\n} from \"../../utils/utils\";\n\n@Component({\n tag: \"hy-hero\",\n styleUrl: \"hy-hero.scss\",\n shadow: false,\n})\nexport class HyHero {\n @Element() el: HTMLElement;\n @Prop() heroType: HeroTypeVariant = HeroTypeVariant.landing;\n @Prop() heroGroupType: HeroGroupTypeVariant = HeroGroupTypeVariant.default;\n @Prop() colorVariant: HeroColorVariant = HeroColorVariant.blue;\n @Prop() sizeVariant: HeroSizeVariant = HeroSizeVariant.large;\n @Prop() image: string;\n @Prop() imageAltText: string = \"\";\n @Prop() disableLazy: boolean = false;\n @Prop() hasShortcuts: boolean = false;\n @Prop() heading: string;\n @Prop() description: string;\n @Prop() url: string;\n @Prop() urlTitle: string;\n @Prop() scLabel?: string;\n @Prop() isExternal: boolean = false;\n private _sourceSet: ImageSrcSet[];\n @Prop() sourceSet: ImageSrcSet[] | string;\n\n async componentWillLoad() {\n this._sourceSet = await jsonParserWorker(this.sourceSet);\n }\n\n handleHeroImageObjectFitValue(heroSizeVariant, heroElement) {\n const heroContentContainerElement = heroElement.getElementsByClassName(\n \"hy-hero__content-container\"\n )[0] as HTMLElement;\n\n if (heroSizeVariant === \"small\") {\n if (heroContentContainerElement.offsetHeight >= 300) {\n heroElement.classList.add(\"has-cover\");\n } else {\n heroElement.classList.remove(\"has-cover\");\n }\n }\n\n if (heroSizeVariant === \"large\") {\n if (heroContentContainerElement.offsetHeight >= 344) {\n heroElement.classList.add(\"has-cover\");\n } else {\n heroElement.classList.remove(\"has-cover\");\n }\n }\n }\n\n render() {\n let variant = CtaLinkButtonVariants.heroWhite;\n let colorVariantValue = this.colorVariant;\n let heroTypeValue = this.heroType;\n\n if (this.heroType === \"minor_landing\") {\n colorVariantValue = HeroColorVariant.white;\n heroTypeValue = HeroTypeVariant.landing;\n }\n\n if (colorVariantValue === HeroColorVariant.blue) {\n variant = CtaLinkButtonVariants.heroBlue;\n }\n\n if (colorVariantValue === HeroColorVariant.black) {\n variant = CtaLinkButtonVariants.heroBlack;\n }\n\n if (!colorVariantValue || colorVariantValue === \"fp_white\") {\n colorVariantValue = HeroColorVariant.white;\n }\n\n const hyHeroClasses = [\n \"hy-hero\",\n `hy-hero--${heroTypeValue}`,\n `hy-hero--${this.heroGroupType}`,\n `hy-hero--${colorVariantValue}`,\n `hy-hero--${this.sizeVariant}`,\n ];\n\n const heroTitleClasses = [\"hy-hero__title\", \"hy-heading__hero\"].join(\" \");\n\n // If there is a Shortcuts block after hero, add the class 'shortcuts' to remove underline.\n if (this.hasShortcuts) {\n hyHeroClasses.push(\"has-shortcuts\");\n }\n\n const aspectRatioWidth = 16;\n const aspectRatioHeight = 10;\n const aspect = (aspectRatioHeight / aspectRatioWidth) * 100;\n const aspectRatio = {\n \"--aspectRatio\": `${aspect}%` as \"aspectRatio\",\n };\n\n window.onload = () => {\n const heroElement = document.getElementsByClassName(\"hy-hero\")[0] as HTMLElement;\n this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement);\n window.addEventListener(\"resize\", () => {\n clearTimeout(timeout);\n timeout = setTimeout(() => this.handleHeroImageObjectFitValue(this.sizeVariant, heroElement), delay);\n });\n };\n\n if (heroTypeValue === \"front_page\") {\n return (\n <Host>\n <div class={hyHeroClasses.join(\" \")}>\n <div class={`hy-hero__container`}>\n <div class={`hy-hero__image-container`} style={aspectRatio}>\n {this.image &&\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 alt={this.imageAltText}\n class={`hy-image__image`}\n src={this.image}\n />\n </picture>\n ) : (\n <img\n loading={this.disableLazy ? \"eager\" : \"lazy\"}\n alt={this.imageAltText}\n class={`hy-image__image`}\n src={this.image}\n />\n ))}\n </div>\n <div class={`hy-hero__spacer-box`}></div>\n <div class={`hy-hero__content-container`}>\n <div class={`hy-hero__content`}>\n <div class={`hy-hero__title-container`}>\n <h2 innerHTML={this.heading} class={heroTitleClasses}></h2>\n </div>\n {this.description && <p class={`hy-hero__description`}>{this.description}</p>}\n {this.url && (\n <div class={`hy-hero__actions`}>\n <hy-cta-button\n link-content={this.urlTitle}\n sc-label={this.scLabel}\n url={this.url}\n is-external={this.isExternal}\n variant={variant}\n />\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n <hy-box mb=\"2, 2, 1, 1\" />\n </Host>\n );\n }\n\n return (\n <Host>\n <div class={hyHeroClasses.join(\" \")}>\n <div class={`hy-hero__container`}>\n <div class={`hy-hero__image-container`} style={aspectRatio}>\n {this.image &&\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 alt={this.imageAltText}\n class={`hy-image__image`}\n src={this.image}\n />\n </picture>\n ) : (\n <img\n loading={this.disableLazy ? \"eager\" : \"lazy\"}\n alt={this.imageAltText}\n class={`hy-image__image`}\n src={this.image}\n />\n ))}\n </div>\n <div class={`hy-hero__content-container`}>\n <div class={`hy-hero__content`}>\n <div class={`hy-hero__title-container`}>\n <h2 innerHTML={this.heading} class={heroTitleClasses}></h2>\n </div>\n {this.description && <p class={`hy-hero__description`}>{this.description}</p>}\n {this.url && (\n <div class={`hy-hero__actions`}>\n <hy-cta-button\n link-content={this.urlTitle}\n sc-label={this.scLabel}\n url={this.url}\n is-external={this.isExternal}\n variant={variant}\n />\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n <hy-box mb=\"2, 2, 1, 1\" />\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-icon.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyIcon = Icon;
 const defineCustomElement = defineCustomElement$1;
 export { HyIcon, defineCustomElement };
+//# sourceMappingURL=hy-icon.js.map

package/components/hy-icon.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-icon.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-image.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyImage = Image;
 const defineCustomElement = defineCustomElement$1;
 export { HyImage, defineCustomElement };
+//# sourceMappingURL=hy-image.js.map

package/components/hy-image.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-image.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-ingress.js CHANGED Viewed

@@ -43,3 +43,5 @@ const HyIngress = Ingress;
 const defineCustomElement = defineCustomElement$1;
 export { HyIngress, defineCustomElement };
+//# sourceMappingURL=hy-ingress.js.map

package/components/hy-ingress.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-ingress.js","mappings":";;AAAA,MAAM,UAAU,GAAG,+nDAA+nD;;MCOroD,OAAO;;;;uBAEY,QAAQ;;EAEtC,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,YAAY,EAAE,eAAe,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACpF,QACE,EAAC,IAAI,QACH,SAAG,KAAK,EAAE,eAAe,IACvB,eAAa,CACX,CACC,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/ingress/ingress.scss?tag=hy-ingress","./src/components/ingress/ingress.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\np.hy-ingress {\n @include font-size(16px, 24px);\n color: var(--grayscale-black);\n font-family: var(--main-font-family);\n margin: 0 0 2rem;\n\n @include breakpoint($narrow) {\n @include font-size(18px, 28px);\n }\n\n @include breakpoint($wide) {\n margin: 0 0 2.25rem;\n }\n\n @include breakpoint($xlarge) {\n @include font-size(18px, 32px);\n margin: 0 0 3rem;\n }\n\n // No sidebar, large desktop styles\n &__large {\n @include breakpoint($extrawide) {\n @include font-size(18px, 32px);\n margin: 0 0 3rem;\n }\n }\n}\n","import {Component, Element, h, Host, Prop} from \"@stencil/core\";\n\n@Component({\n tag: \"hy-ingress\",\n styleUrl: \"ingress.scss\",\n shadow: false,\n})\nexport class Ingress {\n @Element() el: HTMLElement;\n @Prop() headerstyle: string = \"common\";\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-ingress\", `hy-ingress__${this.headerstyle}`].join(\" \");\n return (\n <Host>\n <p class={classAttributes}>\n <slot></slot>\n </p>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-introduction.js CHANGED Viewed

@@ -116,3 +116,5 @@ const HyIntroduction = HyIntroduction$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyIntroduction, defineCustomElement };
+//# sourceMappingURL=hy-introduction.js.map

package/components/hy-introduction.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-introduction.js","mappings":"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","names":["HyIntroduction"],"sources":["./src/components/hy-introduction/hy-introduction.scss?tag=hy-introduction","./src/components/hy-introduction/hy-introduction.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-introduction {\n &__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n\n &.hy-introduction__content--without-image.hy-introduction__content--limit-width {\n @include breakpoint($wide) {\n width: calc(50% - 16px);\n }\n }\n }\n\n &--reversed {\n .hy-introduction__outer-content {\n align-items: flex-end;\n flex-direction: column-reverse;\n\n @include breakpoint($wide) {\n align-items: stretch;\n flex-direction: row-reverse;\n }\n }\n }\n\n &--with-bg {\n width: auto;\n\n @include breakpoint($wide) {\n padding: 0;\n }\n\n @include breakpoint($xlarge) {\n //padding: 0 0 0 32px;\n }\n\n &__white {\n background: var(--grayscale-white);\n\n .hy-introduction__content--with-image {\n background: var(--grayscale-white);\n }\n\n .hy-introduction__title h2,\n .hy-introduction__description {\n color: var(--grayscale-black);\n }\n\n .hy-introduction__link {\n background: var(--brand-main-light);\n color: var(--grayscale-white);\n\n &__icon svg {\n fill: var(--grayscale-white);\n }\n\n &:hover {\n background: var(--brand-main-active);\n }\n }\n }\n }\n\n &__outer-content {\n display: flex;\n flex-direction: column-reverse;\n flex: 1 1 auto;\n justify-content: space-between;\n\n @include breakpoint($wide) {\n flex-direction: row;\n justify-content: space-between;\n padding-bottom: 0;\n\n @supports (gap: 32px) {\n gap: 32px;\n }\n }\n @include breakpoint($xlarge) {\n @supports (gap: 48px) {\n gap: 48px;\n }\n }\n }\n\n &__content--without-image {\n width: 100%;\n\n @include breakpoint($wide) {\n width: 91.46%;\n }\n @include breakpoint($extrawide) {\n width: 82.89%;\n }\n @include breakpoint($xlarge) {\n width: 74.2%;\n }\n }\n\n &__content--with-image {\n @include breakpoint($wide) {\n margin: 0;\n padding: 0;\n width: 50%;\n }\n }\n\n &__title {\n .hy-heading__container {\n @include breakpoint($wide) {\n padding-top: 0;\n }\n }\n }\n\n &__image {\n width: 100%;\n\n @include breakpoint($wide) {\n width: 50%;\n @supports not (gap: 32px) {\n width: calc(50% - 32px);\n }\n }\n\n img,\n .hy-image,\n .hy-image .hy-image__image-container {\n height: 100% !important;\n }\n }\n\n &__description {\n @include font-size(15px, 22px);\n @include font-weight($regular);\n color: var(--grayscale-black);\n font-family: var(--main-font-family);\n margin-bottom: 24px;\n margin-top: 0;\n\n @include breakpoint($narrow) {\n @include font-size(16px, 24px);\n }\n @include breakpoint($wide) {\n margin-bottom: 28px;\n }\n\n @include breakpoint($xlarge) {\n @include font-size(17px, 26px);\n }\n\n &__large {\n @include breakpoint($extrawide) {\n @include font-size(17px, 26px);\n margin-bottom: 28px;\n }\n }\n }\n\n &__link {\n @include font-size(16px, 20px);\n letter-spacing: -0.5px;\n\n background-color: var(--brand-main-light);\n box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);\n box-sizing: border-box;\n color: var(--grayscale-white);\n cursor: pointer;\n display: inline-block;\n font-family: var(--main-font-family);\n font-weight: 700;\n height: 100%;\n padding: 12px 60px 12px 12px;\n position: relative;\n text-decoration: none;\n\n @include breakpoint($narrow) {\n @include font-size(16px, 20px);\n letter-spacing: -0.6px;\n padding: 15px 62px 15px 16px;\n }\n\n @include breakpoint($wide) {\n @include font-size(18px, 20px);\n }\n\n @include breakpoint($extrawide) {\n @include font-size(20px, 20px);\n letter-spacing: -0.7px;\n padding: 16px 70px 16px 18px;\n }\n\n &__icon {\n position: absolute;\n right: 16px;\n top: 50%;\n transform: translateY(-50%);\n\n svg {\n fill: var(--grayscale-white);\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\";\nimport {IntroductionBgColors, HeadingVarians, HeadingSectionVariants} from \"../../utils/utils\";\n\n@Component({\n tag: \"hy-introduction\",\n styleUrl: \"hy-introduction.scss\",\n shadow: false,\n})\nexport class HyIntroduction {\n @Prop() variant: IntroductionBgColors = null;\n @Prop() reversed: boolean = false;\n @Prop() limitContentWidth: boolean = false;\n @Prop() textTitle?: string;\n @Prop() textDescription: string = null;\n @Prop() url?: string;\n @Prop() scLabel?: string;\n @Prop() urlTitle?: string;\n @Prop() imageUrl?: string;\n @Prop() imageAlt: string = \"\";\n @Prop() isExternal: boolean = false;\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 classAttributes = [\n \"hy-introduction\",\n `hy-introduction__${this.headerstyle}`,\n this.headerstyle,\n this.reversed ? \"hy-introduction--reversed\" : \"\",\n this.variant\n ? `hy-introduction--with-bg hy-introduction--with-bg__${this.variant}`\n : \"hy-introduction--without-bg\",\n ].join(\" \");\n\n const classTitle = [\"hy-introduction__title\", `hy-introduction__title__${this.headerstyle}`].join(\" \");\n const classDescription = [\"hy-introduction__description\", `hy-introduction__description__${this.headerstyle}`].join(\n \" \"\n );\n\n const contentWrapperClasses = [\n \"hy-introduction__content\",\n this.reversed ? \"hy-introduction__content--reversed\" : \"\",\n this.imageUrl ? \"hy-introduction__content--with-image\" : \"hy-introduction__content--without-image\",\n this.limitContentWidth ? \"hy-introduction__content--limit-width\" : \"\",\n ].join(\" \");\n\n const target = this.isExternal ? \"_blank\" : \"_self\";\n\n return (\n <Host>\n <hy-box pt=\"1.25, 1.25, 1.5, 2.5\" />\n <div class={classAttributes}>\n <hy-main-content-wrapper>\n <div class=\"hy-introduction__outer-content\">\n <div class={contentWrapperClasses}>\n <hy-heading\n class={classTitle}\n heading={HeadingVarians.h2}\n section={HeadingSectionVariants.introduction}\n >\n {this.textTitle}\n </hy-heading>\n <p class={classDescription}>{this.textDescription}</p>\n {this.url && (\n <div class=\"hy-introduction__link__container\">\n <a class=\"hy-introduction__link\" href={this.url} aria-label={this.scLabel} target={target}>\n {this.urlTitle}\n <span class=\"hy-introduction__link__icon\">\n <hy-icon icon={\"hy-icon-arrow-right\"} size={24} />\n </span>\n </a>\n </div>\n )}\n </div>\n {this.imageUrl &&\n (this.sourceSet ? (\n <div class=\"hy-introduction__image\">\n <hy-image\n source-set={this.sourceSet}\n image-url={this.imageUrl}\n aspectRatioWidth={16}\n aspectRatioHeight={10}\n image-alt={this.imageAlt}\n />\n </div>\n ) : (\n <div class=\"hy-introduction__image\">\n <hy-image\n image-url={this.imageUrl}\n aspectRatioWidth={16}\n aspectRatioHeight={10}\n image-alt={this.imageAlt}\n />\n </div>\n ))}\n </div>\n </hy-main-content-wrapper>\n </div>\n <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-key-figure-group.js CHANGED Viewed

@@ -104,3 +104,5 @@ const HyKeyFigureGroup = HyKeyFigureGroup$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyKeyFigureGroup, defineCustomElement };
+//# sourceMappingURL=hy-key-figure-group.js.map

package/components/hy-key-figure-group.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-key-figure-group.js","mappings":"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","names":["HyKeyFigureGroup"],"sources":["./src/components/hy-key-figure-group/hy-key-figure-group.scss?tag=hy-key-figure-group","./src/components/hy-key-figure-group/hy-key-figure-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-key-figure-group-container {\n margin: 20px 0 28px 0;\n\n @include breakpoint($wide) {\n margin: 24px 0 32px 0;\n }\n @include breakpoint($xlarge) {\n margin: 40px 0;\n }\n\n &__large {\n @include breakpoint($extrawide) {\n margin: 40px 0;\n }\n }\n}\n\n.hy-key-figure-group {\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 max-width: 100%;\n }\n\n @include breakpoint($wide) {\n justify-content: left;\n }\n\n &.hy-key-figure-group-centered {\n @include breakpoint($wide) {\n justify-content: center;\n }\n }\n\n .box-2,\n .box-3 {\n @include breakpoint($narrow) {\n flex-grow: 1;\n max-width: 33%;\n width: 33%;\n }\n }\n\n .box-4 {\n @include breakpoint($narrow) {\n flex-grow: 1;\n max-width: 49%;\n width: 49%;\n }\n @include breakpoint($wide) {\n max-width: 25%;\n width: 25%;\n }\n }\n}\n","export interface KeyFigureValue {\n heading: string;\n description: string;\n}\n\nimport {Component, ComponentInterface, Prop, h, Host, Element} from \"@stencil/core\";\nimport {KeyHighlightVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n tag: \"hy-key-figure-group\",\n styleUrl: \"hy-key-figure-group.scss\",\n shadow: false,\n})\nexport class HyKeyFigureGroup implements ComponentInterface {\n @Element() el: HTMLElement;\n private _dataItems: KeyFigureValue[];\n @Prop() dataItems: KeyFigureValue[] | string;\n @Prop() headerstyle: string = \"common\";\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 getBoxClassName(count) {\n let className = \"box\";\n\n if (count % 3 == 0) {\n className = \"box-3\";\n } else if (count % 4 == 0) {\n className = \"box-4\";\n } else if (count % 5 == 0) {\n className = \"box-5\";\n }\n\n return className;\n }\n\n render() {\n /*\n - Logic:\n - 3 items: big\n - 4 items: small\n - 5 items: big\n - 6 items: big\n * */\n const keyFiguresVariant = this._dataItems.length == 4 ? KeyHighlightVariants.small : KeyHighlightVariants.default;\n\n const classAttributes = [\n keyFiguresVariant,\n \"hy-key-figure-group-container\",\n `hy-key-figure-group-container__${this.headerstyle}`,\n ].join(\" \");\n const classRowAttributes = [\"hy-key-figure-group\"].join(\" \");\n const classRowCenteredAttributes = [\"hy-key-figure-group\", \"hy-key-figure-group-centered\"].join(\" \");\n\n if (this._dataItems.length % 5 == 0) {\n return (\n <Host>\n <div class={classAttributes}>\n <div class={classRowAttributes}>\n {this._dataItems.map((x, index) => {\n if (index < 3) {\n return (\n <hy-key-figure\n class=\"box-3\"\n variant={keyFiguresVariant}\n heading={x.heading}\n description={x.description}\n />\n );\n }\n })}\n </div>\n <div class={classRowCenteredAttributes}>\n {this._dataItems.map((x, index) => {\n if (index >= 3) {\n return (\n <hy-key-figure\n class=\"box-2\"\n variant={keyFiguresVariant}\n heading={x.heading}\n description={x.description}\n />\n );\n }\n })}\n </div>\n </div>\n <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n </Host>\n );\n } else {\n return (\n <Host>\n <div class={classAttributes}>\n <div class={classRowAttributes}>\n {this._dataItems.map((x) => {\n return (\n <hy-key-figure\n class={this.getBoxClassName(this._dataItems.length)}\n variant={keyFiguresVariant}\n heading={x.heading}\n description={x.description}\n />\n );\n })}\n </div>\n </div>\n <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n </Host>\n );\n }\n }\n}\n"],"version":3}

package/components/hy-key-figure.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyKeyFigure = HyKeyFigure$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyKeyFigure, defineCustomElement };
+//# sourceMappingURL=hy-key-figure.js.map

package/components/hy-key-figure.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-key-figure.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-key-figure2.js CHANGED Viewed

@@ -37,3 +37,5 @@ function defineCustomElement() {
 }
 export { HyKeyFigure as H, defineCustomElement as d };
+//# sourceMappingURL=hy-key-figure2.js.map

package/components/hy-key-figure2.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-key-figure2.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,+sEAA+sE;;MCQztE,WAAW;;;;;mBACkB,oBAAoB,CAAC,OAAO;;;;EAIpE,MAAM;IACJ,MAAM,YAAY,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE/D,QACE,WAAK,KAAK,EAAE,YAAY,IACtB,WAAK,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,OAAO,CAAO,EACtD,WAAK,KAAK,EAAC,4BAA4B,IAAE,IAAI,CAAC,WAAW,CAAO,CAC5D,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/hy-key-figure/hy-key-figure.scss?tag=hy-key-figure&encapsulation=shadow","./src/components/hy-key-figure/hy-key-figure.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-key-figure {\n display: block;\n margin-bottom: 32px;\n text-align: center;\n width: 100%;\n\n @include breakpoint($narrow) {\n display: flex;\n flex-direction: column;\n width: 100%;\n }\n @include breakpoint($wide) {\n text-align: left;\n }\n\n &__title {\n @include font-size(40px, 60px);\n @include font-weight($bold);\n box-decoration-break: clone;\n color: var(--brand-main-light);\n display: inline;\n font-family: var(--main-font-family);\n letter-spacing: -2px;\n position: relative;\n z-index: 1;\n\n @include breakpoint($narrow) {\n @include font-size(40px, 30px);\n }\n\n @include breakpoint($extrawide) {\n @include font-size(80px, 70px);\n }\n }\n\n &__description {\n color: var(--grayscale-dark);\n font-family: var(--main-font-family);\n @include font-size(14px, 20px);\n letter-spacing: 0;\n line-height: 20px;\n margin-top: 8px;\n\n @include breakpoint($extrawide) {\n @include font-size(20px, 20px);\n }\n }\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\nimport {KeyHighlightVariants} from \"../../utils/utils\";\n\n@Component({\n tag: \"hy-key-figure\",\n styleUrl: \"hy-key-figure.scss\",\n shadow: true,\n})\nexport class HyKeyFigure implements ComponentInterface {\n @Prop() variant: KeyHighlightVariants = KeyHighlightVariants.default;\n @Prop() heading: string;\n @Prop() description: string;\n\n render() {\n const classVariant = [this.variant, \"hy-key-figure\"].join(\" \");\n\n return (\n <div class={classVariant}>\n <div class=\"hy-key-figure__title\">{this.heading}</div>\n <div class=\"hy-key-figure__description\">{this.description}</div>\n </div>\n );\n }\n}\n"],"version":3}

package/components/hy-key-highlight-group.js CHANGED Viewed

@@ -67,3 +67,5 @@ const HyKeyHighlightGroup = HyKeyHighlightGroup$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyKeyHighlightGroup, defineCustomElement };
+//# sourceMappingURL=hy-key-highlight-group.js.map

package/components/hy-key-highlight-group.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-key-highlight-group.js","mappings":";;;;;AAAA,MAAM,sBAAsB,GAAG,o1EAAo1E;;MCct2EA,qBAAmB;;;;;mBAEU,oBAAoB,CAAC,OAAO;;uBAGtC,QAAQ;;EAEtC,MAAM,iBAAiB;IACrB,IAAI,CAAC,UAAU,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GAC1D;EAED,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,eAAe,GAAG;MACtB,IAAI,CAAC,OAAO;MACZ,wBAAwB;MACxB,2BAA2B,IAAI,CAAC,WAAW,EAAE;KAC9C,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC;IAC7C,MAAM,SAAS,GAAG,aAAa,GAAG,CAAC,IAAI,CAAC,GAAG,OAAO,GAAG,KAAK,CAAC;IAE3D,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,eAAe,IACxB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;MACrB,QACE,wBACE,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,CAAC,CAAC,OAAO,EAClB,WAAW,EAAE,CAAC,CAAC,WAAW,GAC1B,EACF;KACH,CAAC,CACE,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HyKeyHighlightGroup"],"sources":["./src/components/hy-key-highlight-group/hy-key-highlight-group.scss?tag=hy-key-highlight-group&encapsulation=shadow","./src/components/hy-key-highlight-group/hy-key-highlight-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-key-highlight-group-container {\n overflow: hidden;\n}\n\n.hy-key-highlight-group {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n\n @include breakpoint($narrow) {\n flex-direction: row;\n margin: 0 calc(-1 * var(--gutter-medium));\n }\n\n @include breakpoint($wide) {\n margin: 0 calc(-1 * var(--gutter-wide));\n }\n\n .box,\n .box-4 {\n padding: 0 50px 0 20px;\n\n @include breakpoint($narrow) {\n padding: 0 var(--gutter-medium);\n }\n @include breakpoint($wide) {\n padding: 0 var(--gutter-wide);\n }\n }\n\n // 3 key highlights in a row\n .box {\n width: 100%;\n @include breakpoint($narrow) {\n width: 33.33%;\n max-width: 33.33%;\n }\n }\n\n // 4 key highlights in a row\n .box-4 {\n width: 100%;\n @include breakpoint($narrow) {\n width: 50%;\n max-width: 50%;\n }\n @include breakpoint($wide) {\n width: 25%;\n }\n }\n}\n","export interface KeyHighlightValue {\n heading: string;\n description: string;\n}\n\nimport {Component, ComponentInterface, Prop, h, Host, Element} from \"@stencil/core\";\nimport {KeyHighlightVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n tag: \"hy-key-highlight-group\",\n styleUrl: \"hy-key-highlight-group.scss\",\n shadow: true,\n})\nexport class HyKeyHighlightGroup implements ComponentInterface {\n @Element() el: HTMLElement;\n @Prop() variant: KeyHighlightVariants = KeyHighlightVariants.default;\n private _dataItems: KeyHighlightValue[];\n @Prop() dataItems: KeyHighlightValue[] | string;\n @Prop() headerstyle: string = \"common\";\n\n async componentWillLoad() {\n this._dataItems = await jsonParserWorker(this.dataItems);\n }\n\n componentDidLoad() {\n let hyMainDiv = this.el.closest(\".hy-main\");\n if (hyMainDiv) {\n if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n this.headerstyle = \"large\";\n }\n }\n }\n\n render() {\n const classAttributes = [\n this.variant,\n \"hy-key-highlight-group\",\n `hy-key-highlight-group__${this.headerstyle}`,\n ].join(\" \");\n\n const dataItemCount = this._dataItems.length;\n const classItem = dataItemCount % 4 == 0 ? \"box-4\" : \"box\";\n\n return (\n <Host>\n <div class={classAttributes}>\n {this._dataItems.map((x) => {\n return (\n <hy-key-highlight\n class={classItem}\n variant={this.variant}\n heading={x.heading}\n description={x.description}\n />\n );\n })}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-key-highlight.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyKeyHighlight = HyKeyHighlight$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyKeyHighlight, defineCustomElement };
+//# sourceMappingURL=hy-key-highlight.js.map

package/components/hy-key-highlight.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-key-highlight.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-key-highlight2.js CHANGED Viewed

@@ -37,3 +37,5 @@ function defineCustomElement() {
 }
 export { HyKeyHighlight as H, defineCustomElement as d };
+//# sourceMappingURL=hy-key-highlight2.js.map

package/components/hy-key-highlight2.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-key-highlight2.js","mappings":";;;AAAA,MAAM,iBAAiB,GAAG,w7FAAw7F;;MCQr8F,cAAc;;;;;mBACe,oBAAoB,CAAC,OAAO;;;;EAIpE,MAAM;IACJ,MAAM,YAAY,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAElE,QACE,WAAK,KAAK,EAAE,YAAY,IACtB,WAAK,KAAK,EAAC,oCAAoC,IAC7C,WAAK,KAAK,EAAC,yBAAyB,EAAC,SAAS,EAAE,IAAI,CAAC,OAAO,GAAQ,CAChE,EACN,WAAK,KAAK,EAAC,+BAA+B,IAAE,IAAI,CAAC,WAAW,CAAO,CAC/D,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/hy-key-highlight/hy-key-highlight.scss?tag=hy-key-highlight&encapsulation=shadow","./src/components/hy-key-highlight/hy-key-highlight.tsx"],"sourcesContent":[":host {\n}\n\n.hy-key-highlight {\n display: block;\n margin-bottom: 20px;\n width: 100%;\n\n @include breakpoint($narrow) {\n width: 100%;\n }\n\n &__title__container {\n display: inline-block;\n position: relative;\n text-align: center;\n margin-bottom: 1rem;\n\n @include breakpoint($narrow) {\n text-align: left;\n }\n }\n &__title__container::after {\n clear: both;\n }\n\n &__title {\n @include font-weight($bold);\n background-color: var(--brand-main-light);\n box-shadow: -5px 0px 0 0px var(--brand-main-light), 5px 0px 0 0px var(--brand-main-light),\n 0 0 0 0px var(--brand-main-light);\n box-decoration-break: clone;\n color: var(--grayscale-white);\n display: inline;\n font-family: var(--main-font-family);\n hyphens: auto;\n letter-spacing: -0.75px;\n padding: 0 5px;\n position: relative;\n text-transform: uppercase;\n word-break: break-word;\n }\n\n &__description {\n color: var(--grayscale-dark);\n font-family: var(--main-font-family);\n letter-spacing: 0;\n margin-top: 8px;\n text-align: center;\n\n @include breakpoint($narrow) {\n text-align: left;\n }\n }\n\n &.small {\n .hy-key-highlight__title__container {\n @include font-size(24px, 29px);\n }\n .hy-key-highlight__description {\n @include font-size(14px, 19px);\n }\n }\n\n &.big {\n .hy-key-highlight__title__container {\n @include font-size(24px, 29px);\n\n @include breakpoint($narrow) {\n @include font-size(40px, 45px);\n }\n }\n\n .hy-key-highlight__description {\n @include font-size(14px, 20px);\n\n @include breakpoint($narrow) {\n @include font-size(20px, 20px);\n }\n }\n }\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\nimport {KeyHighlightVariants} from \"../../utils/utils\";\n\n@Component({\n tag: \"hy-key-highlight\",\n styleUrl: \"hy-key-highlight.scss\",\n shadow: true,\n})\nexport class HyKeyHighlight implements ComponentInterface {\n @Prop() variant: KeyHighlightVariants = KeyHighlightVariants.default;\n @Prop() heading: string;\n @Prop() description: string;\n\n render() {\n const classVariant = [this.variant, \"hy-key-highlight\"].join(\" \");\n\n return (\n <div class={classVariant}>\n <div class=\"hy-key-highlight__title__container\">\n <div class=\"hy-key-highlight__title\" innerHTML={this.heading}></div>\n </div>\n <div class=\"hy-key-highlight__description\">{this.description}</div>\n </div>\n );\n }\n}\n"],"version":3}

package/components/hy-large-process-flow-phase.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyLargeProcessFlowPhase = HyLargeProcessFlowPhase$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyLargeProcessFlowPhase, defineCustomElement };
+//# sourceMappingURL=hy-large-process-flow-phase.js.map

package/components/hy-large-process-flow-phase.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-large-process-flow-phase.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-large-process-flow-phase2.js CHANGED Viewed

@@ -61,3 +61,5 @@ function defineCustomElement() {
 }
 export { HyLargeProcessFlowPhase as H, defineCustomElement as d };
+//# sourceMappingURL=hy-large-process-flow-phase2.js.map

package/components/hy-large-process-flow-phase2.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-large-process-flow-phase2.js","mappings":";;;;;AAAA,MAAM,0BAA0B,GAAG,ozJAAozJ;;MCqB10J,uBAAuB;;;;;;;EAIlC,MAAM,iBAAiB;IACrB,IAAI,CAAC,UAAU,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GAC1D;EAED,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,wCAAwC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE7E,QACE,WAAK,KAAK,EAAE,eAAe,IACxB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK;MAC5B,IAAI,KAAK,CAAC;MACV,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;QACjC,IAAI,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC;QACxB,IAAI,cAAc,GAAG,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC;QACpC,KAAK,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK;UAChC,IAAI,UAAU,GAAG,KAAK,IAAI,cAAc,GAAG,CAAC,GAAG,iBAAiB,GAAG,YAAY,CAAC;UAChF,OAAO,IAAI,IACT,mBACE,KAAK,EAAE,UAAU,kBACH,IAAI,CAAC,KAAK,cACd,IAAI,CAAC,SAAS,iBACX,IAAI,CAAC,UAAU,EAC5B,GAAG,EAAE,IAAI,CAAC,GAAG,GACb,IACA,IAAI,CAAC;SACV,CAAC,CAAC;OACJ;MAED,OAAO;QACL,WAAK,KAAK,EAAC,+CAA+C,IACxD,WAAK,KAAK,EAAC,uDAAuD,IAChE,UAAI,KAAK,EAAC,+DAA+D,IACvE,WAAK,KAAK,EAAC,8DAA8D,IAAE,KAAK,GAAG,CAAC,CAAO,CACxF,CACD,EACN,WAAK,KAAK,EAAC,wDAAwD,IACjE,WAAK,KAAK,EAAC,iEAAiE,IAAE,CAAC,CAAC,OAAO,CAAO,EAC9F,WACE,KAAK,EAAC,qEAAqE,EAC3E,SAAS,EAAE,CAAC,CAAC,WAAW,GACnB,EACP,WAAK,KAAK,EAAC,+DAA+D,IAAE,KAAK,CAAO,CACpF,CACF;OACP,CAAC;KACH,CAAC,CACE,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/hy-large-process-flow-phase/hy-large-process-flow-phase.scss?tag=hy-large-process-flow-phase&encapsulation=shadow","./src/components/hy-large-process-flow-phase/hy-large-process-flow-phase.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-large-process-flow__phase-container {\n padding-left: 0;\n position: relative;\n max-width: 100%;\n width: 100%;\n\n @include breakpoint($narrow) {\n //tablet\n padding-left: calc(100% / 8 + var(--gutter-narrow)); // 1 column padding\n }\n @include breakpoint($wide) {\n //mid desktop\n padding-left: calc(100% / 12 + var(--gutter-wide)); // 1 column padding\n }\n @include breakpoint($extrawide) {\n //large desktop\n padding-left: calc(100% / 12 + var(--gutter-extrawide)); // 1 column padding\n }\n\n &__phase {\n position: relative;\n\n &:after {\n background-color: var(--grayscale-background-arrow);\n bottom: 0;\n content: \" \";\n display: inline-block;\n height: 24px;\n left: 26.5px;\n position: absolute;\n width: 8px;\n\n @include breakpoint($narrow) {\n display: inline-block;\n height: 100%;\n }\n }\n\n &:last-child:after {\n display: none;\n\n @include breakpoint($narrow) {\n display: inline-block;\n }\n }\n\n &:last-child &__content {\n top: 0;\n margin-top: -24px;\n }\n\n &__number {\n display: grid;\n place-items: center;\n position: relative;\n width: 64px;\n z-index: 2;\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 @include font-size(32px, 36px);\n @include font-weight(700);\n height: 48px;\n letter-spacing: 0;\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 @include breakpoint($narrow) {\n @include font-size(36px, 40px);\n height: 64px;\n width: 64px;\n\n &::after {\n content: \"\";\n height: 64px;\n left: -6px;\n position: absolute;\n width: 64px;\n }\n }\n }\n }\n\n &__content {\n background-color: var(--grayscale-background-box);\n margin: 0 -56px;\n padding: 48px 0 24px 0;\n position: relative;\n top: -24px;\n\n @include breakpoint($narrow) {\n //margin-bottom: -8px;\n //margin-left: 32px;\n margin: 0 0 -8px 32px;\n padding: 32px 0;\n top: -32px;\n }\n\n &__heading {\n color: var(--brand-main-nearly-black);\n font-family: var(--main-font-family);\n\n @include font-size(20px, 30px);\n @include font-weight(600);\n letter-spacing: -0.5px;\n margin-bottom: 24px;\n //padding: 0 16px;\n padding: 0 56px;\n\n @include breakpoint($narrow) {\n @include font-size(26px, 30px);\n @include font-weight(700);\n letter-spacing: -0.65px;\n padding: 0 44px;\n }\n }\n\n &__description {\n color: var(--grayscale-dark);\n font-family: var(--main-font-family);\n\n @include font-size(16px, 24px);\n letter-spacing: 0;\n margin-bottom: 24px;\n //padding: 0 16px;\n padding: 0 56px;\n\n @include breakpoint($narrow) {\n padding: 0 44px;\n }\n }\n\n &__links {\n align-items: flex-end;\n display: flex;\n flex-direction: column;\n margin-right: 0;\n padding: 0 56px;\n\n @include breakpoint($narrow) {\n margin-right: -6px;\n padding: 0;\n }\n\n .phase-link {\n margin-bottom: 8px;\n }\n .phase-link.last {\n margin-bottom: 0;\n }\n }\n }\n }\n}\n","export interface PhaseValue {\n heading: string;\n description: string;\n links: ProcessBoxLinkValue[];\n}\n\nexport interface ProcessBoxLinkValue {\n label: string;\n url: string;\n isExternal: boolean;\n ariaLabel: string;\n}\n\nimport {Component, ComponentInterface, h, Prop} from \"@stencil/core\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n tag: \"hy-large-process-flow-phase\",\n styleUrl: \"hy-large-process-flow-phase.scss\",\n shadow: true,\n})\nexport class HyLargeProcessFlowPhase implements ComponentInterface {\n private _dataItems: PhaseValue[];\n @Prop() dataItems: PhaseValue[] | string;\n\n async componentWillLoad() {\n this._dataItems = await jsonParserWorker(this.dataItems);\n }\n\n render() {\n const classAttributes = [\"hy-large-process-flow__phase-container\"].join(\" \");\n\n return (\n <div class={classAttributes}>\n {this._dataItems.map((x, index) => {\n var items;\n if (x.links && x.links.length > 0) {\n let linkItems = x.links;\n let linkItemsCount = x.links.length;\n items = linkItems.map((item, index) => {\n let classLinks = index == linkItemsCount - 1 ? \"phase-link last\" : \"phase-link\";\n return item ? (\n <hy-cta-link\n class={classLinks}\n link-content={item.label}\n sc-label={item.ariaLabel}\n is-external={item.isExternal}\n url={item.url}\n />\n ) : null;\n });\n }\n\n return [\n <div class=\"hy-large-process-flow__phase-container__phase\">\n <div class=\"hy-large-process-flow__phase-container__phase__number\">\n <h2 class=\"hy-large-process-flow__phase-container__phase__number__number\">\n <div class=\"hy-large-process-flow__phase-container__phase__number__title\">{index + 1}</div>\n </h2>\n </div>\n <div class=\"hy-large-process-flow__phase-container__phase__content\">\n <div class=\"hy-large-process-flow__phase-container__phase__content__heading\">{x.heading}</div>\n <div\n class=\"hy-large-process-flow__phase-container__phase__content__description\"\n innerHTML={x.description}\n ></div>\n <div class=\"hy-large-process-flow__phase-container__phase__content__links\">{items}</div>\n </div>\n </div>,\n ];\n })}\n </div>\n );\n }\n}\n"],"version":3}

package/components/hy-large-process-flow.js CHANGED Viewed

@@ -84,3 +84,5 @@ const HyLargeProcessFlow = HyLargeProcessFlow$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyLargeProcessFlow, defineCustomElement };
+//# sourceMappingURL=hy-large-process-flow.js.map

package/components/hy-large-process-flow.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-large-process-flow.js","mappings":";;;;;;;;AAAA,MAAM,qBAAqB,GAAG,yyFAAyyF;;MCc1zFA,oBAAkB;;;;;uBAEC,QAAQ;;;EAKtC,MAAM,iBAAiB;IACrB,IAAI,CAAC,UAAU,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GAC1D;EAED,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,uBAAuB,EAAE,0BAA0B,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE1G,OAAO;MACL,WAAK,KAAK,EAAE,eAAe,IACxB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK;QAC5B,IAAI,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;QACrC,MAAM,cAAc,GAClB,KAAK,KAAK,CAAC,GAAG,0CAA0C,GAAG,oCAAoC,CAAC;QAElG,OAAO;UACL,kBAAY,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,cAAc,CAAC,EAAE,IAC1D,CAAC,CAAC,UAAU,CACF;UACb,iDAAyC,MAAM,GAAI;SACpD,CAAC;OACH,CAAC,CACE;KACP,CAAC;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HyLargeProcessFlow"],"sources":["./src/components/hy-large-process-flow/hy-large-process-flow.scss?tag=hy-large-process-flow&encapsulation=shadow","./src/components/hy-large-process-flow/hy-large-process-flow.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-large-process-flow {\n max-width: 100%;\n padding-top: 8px;\n width: 100%;\n\n @include breakpoint($narrow) {\n max-width: calc(100% / 8 * 7 + var(--gutter-narrow)); // 7 columns out of 8\n padding-top: 0;\n }\n @include breakpoint($wide) {\n max-width: calc(100% / 12 * 8 + var(--gutter-wide)); // 8 columns out of 12\n }\n @include breakpoint($extrawide) {\n max-width: calc(100% / 12 * 8 + var(--gutter-extrawide)); // 8 columns out of 12\n }\n\n h3.hy-heading {\n font-size: 20px;\n @include breakpoint($narrow) {\n font-size: 32px;\n }\n }\n\n &__first-phase {\n h3.hy-heading {\n margin-bottom: 8px;\n padding: 24px 0 !important; //48 32\n\n @include breakpoint($narrow) {\n margin-bottom: 24px;\n margin-top: 16px; //64 48\n }\n }\n }\n\n &__multi-phase-title {\n position: relative;\n\n &:after {\n background-color: var(--grayscale-background-arrow);\n bottom: 0;\n content: \" \";\n display: inline-block;\n height: 100%;\n left: 26.5px;\n position: absolute;\n width: 8px;\n z-index: -1;\n\n @include breakpoint($narrow) {\n left: calc(100% / 8 + var(--gutter-narrow) + 26.5px);\n }\n\n @include breakpoint($wide) {\n left: calc(100% / 12 + var(--gutter-wide) + 26.5px);\n }\n\n @include breakpoint($extrawide) {\n left: calc(100% / 12 + var(--gutter-extrawide) + 26.5px);\n }\n }\n\n h3.hy-heading {\n background-color: var(--grayscale-white);\n margin: 1.5rem 0 1.5rem;\n padding: 8px 0 !important;\n\n @include breakpoint($narrow) {\n margin: 48px 0;\n padding: 16px 0 !important;\n }\n }\n }\n}\n","export interface ProcessFlowValue {\n phaseTitle: string;\n boxes: string;\n}\n\nimport {Component, ComponentInterface, Element, h, Prop} from \"@stencil/core\";\nimport {HeadingVarians} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n tag: \"hy-large-process-flow\",\n styleUrl: \"hy-large-process-flow.scss\",\n shadow: true,\n})\nexport class HyLargeProcessFlow implements ComponentInterface {\n @Element() el: HTMLElement;\n @Prop() headerstyle: string = \"common\";\n\n private _dataItems: ProcessFlowValue[];\n @Prop() dataItems: ProcessFlowValue[] | string;\n\n async componentWillLoad() {\n this._dataItems = await jsonParserWorker(this.dataItems);\n }\n\n componentDidLoad() {\n let hyMainDiv = this.el.closest(\".hy-main\");\n if (hyMainDiv) {\n if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n this.headerstyle = \"large\";\n }\n }\n }\n\n render() {\n const classAttributes = [\"hy-large-process-flow\", `hy-large-process-flow__${this.headerstyle}`].join(\" \");\n\n return [\n <div class={classAttributes}>\n {this._dataItems.map((x, index) => {\n let phases = JSON.stringify(x.boxes);\n const headingClasses =\n index !== 0 ? \"hy-large-process-flow__multi-phase-title\" : \"hy-large-process-flow__first-phase\";\n\n return [\n <hy-heading class={headingClasses} heading={HeadingVarians.h3}>\n {x.phaseTitle}\n </hy-heading>,\n <hy-large-process-flow-phase data-items={phases} />,\n ];\n })}\n </div>,\n ];\n }\n}\n"],"version":3}

package/components/hy-link-box-list.js CHANGED Viewed

@@ -90,3 +90,5 @@ const HyLinkBoxList = LinkBoxList;
 const defineCustomElement = defineCustomElement$1;
 export { HyLinkBoxList, defineCustomElement };
+//# sourceMappingURL=hy-link-box-list.js.map

package/components/hy-link-box-list.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-link-box-list.js","mappings":";;;;;;;AAAA,MAAM,cAAc,GAAG,6gDAA6gD;;MCqBvhD,WAAW;;;;uBAEQ,QAAQ;mBACH,eAAe,CAAC,OAAO;;;;EAM1D,MAAM,iBAAiB;IACrB,IAAI,CAAC,UAAU,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GAC1D;EAED,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,eAAe,GAAG;MACtB,kBAAkB;MAClB,IAAI,CAAC,OAAO;MACZ,qBAAqB,IAAI,CAAC,OAAO,EAAE;MACnC,qBAAqB,IAAI,CAAC,WAAW,EAAE;KACxC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;;;;;;;;;;;IAYZ,MAAM,mBAAmB,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,gBAAgB,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACrF,QACE,EAAC,IAAI,QACH,UAAI,KAAK,EAAE,eAAe,IACvB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;MACrB,QACE,cACE,mBACE,KAAK,EAAE,mBAAmB,EAC1B,OAAO,EAAE,IAAI,CAAC,OAAO,gBACT,CAAC,CAAC,SAAS,eACZ,CAAC,CAAC,QAAQ,eACV,CAAC,CAAC,QAAQ,gBACT,CAAC,CAAC,OAAO,sBACH,CAAC,CAAC,WAAW,eACpB,CAAC,CAAC,QAAQ,EACrB,GAAG,EAAE,CAAC,CAAC,MAAM,iBACA,CAAC,CAAC,UAAU,cACf,CAAC,CAAC,SAAS,qBACJ,IAAI,CAAC,aAAa,GACnC,CACC,EACL;KACH,CAAC,CACC,EACL,cAAQ,EAAE,EAAC,oBAAoB,GAAG,CAC7B,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/link-box-list/link-box-list.scss?tag=hy-link-box-list","./src/components/link-box-list/link-box-list.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-link-box-list {\n padding: 0;\n margin: 0;\n list-style: none;\n display: grid;\n gap: 32px 0;\n\n @media screen and (min-width: 768px) {\n grid-template-columns: repeat(2, 1fr);\n gap: 32px 24px;\n }\n\n @media screen and (min-width: 1024px) {\n grid-template-columns: repeat(3, 1fr);\n }\n\n @media screen and (min-width: 1920px) {\n gap: 32px;\n }\n}\n","export interface LinkBox {\n heading: string;\n description: string;\n imageSets: string | null;\n imageUrl: string;\n imageAlt: string;\n boxUrl: string;\n isExternal: boolean;\n showLogo: boolean;\n ariaLabel: string;\n}\n\nimport {Component, ComponentInterface, Prop, h, Host, Element} from \"@stencil/core\";\nimport {LinkBoxVariants} from \"../../utils/utils\";\nimport {jsonParserWorker} from \"../../global/globalScript\";\n\n@Component({\n tag: \"hy-link-box-list\",\n styleUrl: \"link-box-list.scss\",\n shadow: false,\n})\nexport class LinkBoxList implements ComponentInterface {\n @Element() el: HTMLElement;\n @Prop() headerstyle: string = \"common\";\n @Prop() variant: LinkBoxVariants = LinkBoxVariants.default;\n @Prop() readMoreLabel: string;\n\n private _dataItems: LinkBox[];\n @Prop() dataItems: LinkBox[] | string;\n\n async componentWillLoad() {\n this._dataItems = await jsonParserWorker(this.dataItems);\n }\n\n componentDidLoad() {\n let hyMainDiv = this.el.closest(\".hy-main\");\n if (hyMainDiv) {\n if (!hyMainDiv.classList.contains(\"with-sidebar\")) {\n this.headerstyle = \"large\";\n }\n }\n }\n\n render() {\n const classAttributes = [\n \"hy-link-box-list\",\n this.variant,\n `hy-link-box-list__${this.variant}`,\n `hy-link-box-list__${this.headerstyle}`,\n ].join(\" \");\n\n /*\n - Logic:\n - 3 items: big\n - 4 items: small\n - 5 items: big\n - 6 items: big\n - 7 items: small\n - 8 items: small\n - 9 items: big\n * */\n const classItemAttributes = [this.variant, `hy-link-box__${this.variant}`].join(\" \");\n return (\n <Host>\n <ul class={classAttributes}>\n {this._dataItems.map((x) => {\n return (\n <li>\n <hy-link-box\n class={classItemAttributes}\n variant={this.variant}\n source-set={x.imageSets}\n image-url={x.imageUrl}\n image-alt={x.imageAlt}\n text-title={x.heading}\n text-description={x.description}\n show-logo={x.showLogo}\n url={x.boxUrl}\n is-external={x.isExternal}\n sc-label={x.ariaLabel}\n read-more-label={this.readMoreLabel}\n />\n </li>\n );\n })}\n </ul>\n <hy-box mb=\"1.75, 1.75, 2, 2.5\" />\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-link-box.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyLinkBox = LinkBox;
 const defineCustomElement = defineCustomElement$1;
 export { HyLinkBox, defineCustomElement };
+//# sourceMappingURL=hy-link-box.js.map

package/components/hy-link-box.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-link-box.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-link-list.js CHANGED Viewed

@@ -75,3 +75,5 @@ const HyLinkList = HyLinkList$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyLinkList, defineCustomElement };
+//# sourceMappingURL=hy-link-list.js.map

package/components/hy-link-list.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-link-list.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,ozKAAozK;;MCiB7zKA,YAAU;;;;uBAES,SAAS;;uBAGT,EAAE;;0BAEC,IAAI;;EAErC,MAAM,iBAAiB;IACrB,IAAI,CAAC,UAAU,GAAG,MAAM,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;GAC1D;EAED,gBAAgB;IACd,IAAI,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAC5C,IAAI,SAAS,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE;QACjD,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC;OAC5B;KACF;GACF;EAED,MAAM;IACJ,MAAM,WAAW,GAAG,eAAe,CAAC,QAAQ,CAAC;IAC7C,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,WAAW,EAAE,CAAC;IACzD,IAAI,UAAU,GAAG,OAAO,CAAC;IAEzB,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,EAAE;MACpE,UAAU,GAAG,OAAO,CAAC;KACtB;IAED,OAAO;MACL,eAAS,KAAK,EAAE,8BAA8B,IAAI,CAAC,WAAW,EAAE,IAC7D,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,KAC1B,EAAC,cAAc,IAAC,KAAK,EAAE,qBAAqB,IAAG,IAAI,CAAC,WAAW,CAAkB,CAClF,EACD,UACE,KAAK,EAAE,4CAA4C,IAAI,CAAC,SAAS,IAC/D,IAAI,CAAC,SAAS,KAAK,MAAM,GAAG,UAAU,GAAG,EAC3C,EAAE,IAED,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAC,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,UAAU,EAAC,MACzD,UAAI,KAAK,EAAC,0BAA0B,IAClC,mBACE,OAAO,EAAE,WAAW,kBACN,OAAO,cACX,SAAS,EACnB,GAAG,EAAE,GAAG,iBACK,UAAU,GACvB,CACC,CACN,CAAC,CACC,CACG;KACX,CAAC;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HyLinkList"],"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"],"version":3}

package/components/hy-link.js CHANGED Viewed

@@ -44,3 +44,5 @@ const HyLink = Link;
 const defineCustomElement = defineCustomElement$1;
 export { HyLink, defineCustomElement };
+//# sourceMappingURL=hy-link.js.map

package/components/hy-link.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-link.js","mappings":";;;AAAA,MAAM,OAAO,GAAG,khDAAkhD;;MCQrhD,IAAI;;;;mBACiB,YAAY,CAAC,OAAO;uBACtB,EAAE;;;sBAGF,KAAK;;EAEnC,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IAClD,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;IAEpD,QACE,EAAC,IAAI,QACH,uBAAe,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,IAC1F,IAAI,CAAC,WAAW,CACf,CACC,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/link/link.scss?tag=hy-link","./src/components/link/link.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.hy-link {\n color: var(--brand-main);\n font-family: var(--main-font-family);\n font-weight: 600;\n font-size: 14px;\n letter-spacing: -0.47px;\n margin: theme(\"spacing.8\");\n line-height: 16px;\n text-decoration: none;\n\n &.within-paragraph {\n color: var(--brand-main);\n font-family: var(--main-font-family);\n font-weight: 400;\n font-size: 14px;\n line-height: 20px;\n text-decoration: underline;\n }\n}\n","import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {LinkVariants} from \"../../utils/utils\";\n\n@Component({\n tag: \"hy-link\",\n styleUrl: \"link.scss\",\n shadow: false,\n})\nexport class Link {\n @Prop() variant: LinkVariants = LinkVariants.default;\n @Prop() linkContent: string = \"\";\n @Prop() url?: string;\n @Prop() scLabel?: string;\n @Prop() isExternal: boolean = false;\n\n render() {\n const classAttributes = [\"hy-link\", this.variant];\n const target = this.isExternal ? \"_blank\" : \"_self\";\n\n return (\n <Host>\n <a aria-label={this.scLabel} class={classAttributes.join(\" \")} href={this.url} target={target}>\n {this.linkContent}\n </a>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-list-item.js CHANGED Viewed

@@ -291,3 +291,5 @@ const HyListItem = HyListItem$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyListItem, defineCustomElement };
+//# sourceMappingURL=hy-list-item.js.map

package/components/hy-list-item.js.map ADDED Viewed

@@ -0,0 +1 @@

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

package/components/hy-logo-grid-item.js CHANGED Viewed

@@ -46,3 +46,5 @@ const HyLogoGridItem = HyLogoGridItem$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyLogoGridItem, defineCustomElement };
+//# sourceMappingURL=hy-logo-grid-item.js.map

package/components/hy-logo-grid-item.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-logo-grid-item.js","mappings":";;AAAA,MAAM,aAAa,GAAG,g3FAAg3F;;MCOz3FA,gBAAc;;;;;;;EAIzB,MAAM;IACJ,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3C,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAE5D,OAAO,WAAW,CAAC,GAAG,CAAC,CAAC,EAAC,aAAa,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,EAAC;MACvF,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;MAE1C,MAAM,cAAc,IAClB,cAAQ,KAAK,EAAC,sBAAsB,IACjC,aAAa,KACZ,mBACG,aAAa,CAAC,GAAG,CAAC,CAAC,EAAC,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAC,MAC3C,cAAQ,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,GAAG,KAAK,GAAG,EAAE,GAAI,CAC7E,CAAC,EACF,WAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,GAAI,CAC5B,CACX,EACA,CAAC,aAAa,IAAI,WAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,GAAI,CAChD,CACV,CAAC;MAEF,IAAI,UAAU,EAAE;QACd,MAAM,EAAC,GAAG,EAAE,MAAM,EAAC,GAAG,UAAU,CAAC;QACjC,MAAM,WAAW,GAAG,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;QAE3D,QACE,SAAG,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAC,oBAAoB,IAC1D,cAAc,CACb,EACJ;OACH;MAED,OAAO,cAAc,CAAC;KACvB,CAAC,CAAC;GACJ;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HyLogoGridItem"],"sources":["./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-item\",\n styleUrl: \"hy-logo-grid.scss\",\n shadow: false,\n})\nexport class HyLogoGridItem {\n @Prop() link?: string;\n @Prop() image: string;\n\n render() {\n const parsedImage = JSON.parse(this.image);\n const parsedLink = this.link ? JSON.parse(this.link) : null;\n\n return parsedImage.map(({image_sources: sources, image_url: fallback_url, image_alt: alt}) => {\n const parsedSources = JSON.parse(sources);\n\n const elementContent = (\n <figure class=\"hy-logo-grid__figure\">\n {parsedSources && (\n <picture>\n {parsedSources.map(({src, media, type, sizes}) => (\n <source srcSet={src} media={media} type={type} sizes={sizes ? sizes : \"\"} />\n ))}\n <img alt={alt} src={fallback_url} />\n </picture>\n )}\n {!parsedSources && <img alt={alt} src={fallback_url} />}\n </figure>\n );\n\n if (parsedLink) {\n const {url, target} = parsedLink;\n const targetValue = target === \"_blank\" ? target : \"_self\";\n\n return (\n <a href={url} target={targetValue} class=\"hy-logo-grid__link\">\n {elementContent}\n </a>\n );\n }\n\n return elementContent;\n });\n }\n}\n"],"version":3}

package/components/hy-logo-grid.js CHANGED Viewed

@@ -36,3 +36,5 @@ const HyLogoGrid = HyLogoGrid$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyLogoGrid, defineCustomElement };
+//# sourceMappingURL=hy-logo-grid.js.map

package/components/hy-logo-grid.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-logo-grid.js","mappings":";;AAAA,MAAM,aAAa,GAAG,g3FAAg3F;;MCOz3FA,YAAU;;;;;;;EAIrB,MAAM;IACJ,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;IAE3C,QACE,WAAK,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,eAAe,IAC3C,IAAI,CAAC,aAAa,IAAI,EAAC,cAAc,IAAC,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,aAAa,CAAkB,EACxG,WAAK,KAAK,EAAC,sBAAsB,IAC/B,eAAQ,CACJ,CACF,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HyLogoGrid"],"sources":["./src/components/hy-logo-grid/hy-logo-grid.scss?tag=hy-logo-grid","./src/components/hy-logo-grid/hy-logo-grid.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"],"version":3}

package/components/hy-main-content-wrapper.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyMainContentWrapper = HyMainContentWrapper$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyMainContentWrapper, defineCustomElement };
+//# sourceMappingURL=hy-main-content-wrapper.js.map

package/components/hy-main-content-wrapper.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-main-content-wrapper.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/hy-main-content-wrapper2.js CHANGED Viewed

@@ -28,3 +28,5 @@ function defineCustomElement() {
 }
 export { HyMainContentWrapper as H, defineCustomElement as d };
+//# sourceMappingURL=hy-main-content-wrapper2.js.map

package/components/hy-main-content-wrapper2.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-main-content-wrapper2.js","mappings":";;AAAA,MAAM,uBAAuB,GAAG,0uDAA0uD;;MCO7vD,oBAAoB;;;;;EAC/B,MAAM;IACJ,MAAM,eAAe,GAAG,CAAC,yBAAyB,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE9D,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,eAAe,IACzB,eAAQ,CACJ,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/hy-main-content-wrapper/hy-main-content-wrapper.scss?tag=hy-main-content-wrapper","./src/components/hy-main-content-wrapper/hy-main-content-wrapper.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.with-sidebar {\n .hy-main-content-wrapper {\n // Layout Mobile 320-479px\n margin: 0 auto;\n max-width: 100%;\n padding: 0 1rem;\n position: relative;\n\n // Layout Tablet 480-959px\n // Side navigation disappears to hamburger when width < 1200.\n @include breakpoint($narrow) {\n // the rule is applied to screens >=480px: width 100% - side margins (32px)\n padding: 0 2rem;\n }\n\n // Large desktop Layout >1600px\n @include breakpoint($xlarge) {\n max-width: 1216px;\n padding: 0;\n }\n }\n}\n\n.without-sidebar {\n .hy-main-content-wrapper {\n // Layout Mobile 320-479px\n margin: 0 auto;\n max-width: 100%;\n padding: 0 1rem;\n position: relative;\n\n // Layout Tablet 480-959px\n @include breakpoint($narrow) {\n padding: 0 2rem;\n }\n\n // Large desktop Layout >1200px\n @include breakpoint($extrawide) {\n max-width: 1216px;\n padding: 0;\n }\n }\n}\n","import {Component, h, Host} from \"@stencil/core\";\n\n@Component({\n tag: \"hy-main-content-wrapper\",\n styleUrl: \"hy-main-content-wrapper.scss\",\n shadow: false,\n})\nexport class HyMainContentWrapper {\n render() {\n const classAttributes = [\"hy-main-content-wrapper\"].join(\" \");\n\n return (\n <Host>\n <div class={classAttributes}>\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/hy-main.js CHANGED Viewed

@@ -38,3 +38,5 @@ const HyMain = HyMain$1;
 const defineCustomElement = defineCustomElement$1;
 export { HyMain, defineCustomElement };
+//# sourceMappingURL=hy-main.js.map

package/components/hy-main.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"hy-main.js","mappings":";;AAAA,MAAM,SAAS,GAAG,g9EAAg9E;;MCOr9EA,QAAM;;;;sBACa,KAAK;;EAEnC,MAAM;IACJ,MAAM,eAAe,GAAG;MACtB,SAAS;MACT,IAAI,CAAC,UAAU,GAAG,cAAc,GAAG,iBAAiB;MACpD,IAAI,CAAC,UAAU,GAAG,iBAAiB,GAAG,gBAAgB;KACvD,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,QACE,WAAK,KAAK,EAAE,eAAe,IACzB,eAAQ,CACJ,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;;","names":["HyMain"],"sources":["./src/components/hy-main/hy-main.scss?tag=hy-main","./src/components/hy-main/hy-main.tsx"],"sourcesContent":[".hy-main {\n display: flex;\n margin: 0 auto;\n max-width: $fullhd;\n padding: 0;\n width: 100%;\n\n .layout-content {\n padding: 0;\n width: 100%;\n }\n\n .layout-user-login-page {\n padding: 0 var(--gutter-medium);\n width: 100%;\n\n div[id^=\"block-breadcrumbs\"] {\n display: none;\n }\n }\n\n &__common {\n position: relative;\n .layout-content {\n @include breakpoint($narrow) {\n margin: 0 auto;\n width: 100%;\n }\n @include breakpoint($extrawide) {\n flex-grow: 1;\n order: 2;\n width: 80%;\n }\n @include breakpoint($xlarge) {\n padding: 0 2rem;\n }\n }\n\n .layout-sidebar-first {\n display: none;\n\n @include breakpoint($extrawide) {\n background: var(--grayscale-white);\n border-top: 1px solid var(--grayscale-black);\n border-right: 1px solid var(--grayscale-medium);\n display: block;\n max-width: 320px;\n order: 1;\n padding: var(--gutter-extrawide) 13px;\n width: 20%;\n height: auto;\n\n &.menu-is-open {\n background: var(--grayscale-white);\n min-height: 100vh;\n overflow: auto;\n }\n }\n }\n }\n\n &__large {\n .layout-content {\n padding: 0;\n width: 100%;\n @include breakpoint($extrawide) {\n padding: 0 2rem;\n }\n }\n }\n}\n","import {Component, Prop, h} from \"@stencil/core\";\n\n@Component({\n tag: \"hy-main\",\n styleUrl: \"hy-main.scss\",\n shadow: false,\n})\nexport class HyMain {\n @Prop() hasSidebar: boolean = false;\n\n render() {\n const classAttributes = [\n \"hy-main\",\n this.hasSidebar ? \"with-sidebar\" : \"without-sidebar\",\n this.hasSidebar ? \"hy-main__common\" : \"hy-main__large\",\n ].join(\" \");\n\n return (\n <div class={classAttributes}>\n <slot />\n </div>\n );\n }\n}\n"],"version":3}

package/components/hy-menu-language-item.js CHANGED Viewed

@@ -4,3 +4,5 @@ const HyMenuLanguageItem = SiteLanguage;
 const defineCustomElement = defineCustomElement$1;
 export { HyMenuLanguageItem, defineCustomElement };
+//# sourceMappingURL=hy-menu-language-item.js.map

package/components/hy-menu-language-item.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"hy-menu-language-item.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}