{"version":3,"names":["sewWsCareerCss","SewWsCareer","constructor","hostRef","this","noGrid","noMargin","inViewPort","activeSlide","handleScroll","top","element","getBoundingClientRect","componentWillLoad","slides","Array","from","el","querySelectorAll","setActiveSlide","forEach","slide","active","length","slideWidthToCssVar","style","setProperty","clientWidth","toString","componentDidUpdate","slideInterval","setInterval","clearInterval","render","h","Host","key","class","ref","innerHTML","headline","name","subline"],"sources":["src/components/website-components/sew-ws-career/sew-ws-career.scss?tag=sew-ws-career&encapsulation=shadow","src/components/website-components/sew-ws-career/sew-ws-career.tsx"],"sourcesContent":["@include component-spacing-and-grid;\n\n:host {\n display: block;\n\n .headline {\n @include typo-ws-h2;\n\n margin: 0;\n grid-row: 1;\n grid-column: 2 / span 7;\n }\n\n .content {\n grid-column: 2 / span 7;\n grid-row: 2;\n }\n\n slot[name='buttons'] {\n display: block;\n grid-column: 2 / span 12;\n grid-row: 3;\n }\n\n .image-wrapper {\n display: block;\n grid-column: 9 / -1;\n grid-row: 1 / 4;\n overflow: hidden;\n padding-top: 56%;\n position: relative;\n align-self: flex-start;\n }\n\n slot[name='picture'] {\n display: block;\n width: 100%;\n height: 100%;\n left: 0;\n position: absolute;\n top: 0;\n }\n\n ::slotted(sew-picture) {\n width: 100%;\n height: 100%;\n }\n\n ::slotted(sew-ws-richtext) {\n margin: 32px 0 0;\n }\n\n .subline {\n @include typo-ws-h4;\n\n margin: 48px 0 32px;\n }\n\n ::slotted(sew-ws-button:first-of-type) {\n margin-right: 20px;\n }\n}\n\n@include mq-4-min {\n :host {\n .image-wrapper {\n grid-area: 1 / 9 / 4 / -2;\n }\n }\n}\n\n@include mq-1 {\n :host {\n .headline {\n grid-column: 2 / -2;\n }\n\n .content {\n grid-column: 2 / -2;\n grid-row: 3;\n }\n\n slot[name='buttons'] {\n grid-column: 2 / -2;\n grid-row: 4;\n }\n\n ::slotted(sew-ws-richtext) {\n margin-top: 24px;\n }\n\n .image-wrapper {\n grid-column: 2 / -2;\n grid-row: 2;\n position: relative;\n margin-top: 24px;\n }\n\n .subline {\n margin: 40px 0 32px;\n }\n\n ::slotted(sew-ws-button) {\n margin-bottom: 0;\n margin-top: 24px;\n }\n\n ::slotted(sew-ws-button:first-of-type) {\n margin: 0;\n }\n }\n}\n","import { Component, h, Listen, Prop, State, Host, Element } from '@stencil/core';\n\n@Component({\n tag: 'sew-ws-career',\n styleUrl: 'sew-ws-career.scss',\n shadow: true,\n})\nexport class SewWsCareer {\n @Element() el: HTMLSewWsCareerElement;\n @Prop({ reflect: true }) noGrid = false;\n @Prop({ reflect: true }) noMargin = false;\n @Prop() headline: string;\n @Prop() text: string;\n @Prop() subline: string;\n\n @State() inViewPort = false;\n\n @Listen('scroll', { target: 'window' })\n public handleScroll(): void {\n const top = this.element.getBoundingClientRect().top;\n\n if (top <= 350) {\n this.inViewPort = true;\n }\n }\n\n private element: HTMLElement;\n private slides: HTMLSewWsCareerSlideElement[];\n private activeSlide = 0;\n\n componentWillLoad(): void {\n this.slides = Array.from(\n this.el.querySelectorAll('sew-ws-career-slide')\n );\n }\n\n private setActiveSlide() {\n this.slides.forEach(slide => {\n slide.active = false;\n });\n\n if (this.activeSlide === this.slides.length) return;\n\n this.slides[this.activeSlide].active = true;\n }\n\n private slideWidthToCssVar() {\n this.el.style.setProperty('--slide-width', this.slides[0].clientWidth.toString());\n }\n\n public componentDidUpdate(): void {\n if (this.activeSlide === 0 && this.inViewPort) {\n this.slideWidthToCssVar();\n this.setActiveSlide();\n const slideInterval = setInterval(() => {\n this.activeSlide++;\n this.setActiveSlide();\n\n if (this.activeSlide === this.slides.length) {\n clearInterval(slideInterval);\n }\n }, 3900);\n }\n }\n\n render() {\n return (\n (this.element = el)}>\n

\n
\n \n

{this.subline}

\n
\n
\n {this.inViewPort && }\n \n
\n\n \n
\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,6oE,MCOVC,EAAW,MALxB,WAAAC,CAAAC,G,UAO6BC,KAAMC,OAAG,MACTD,KAAQE,SAAG,MAK3BF,KAAUG,WAAG,MAadH,KAAWI,YAAG,CAsDzB,CAhEU,YAAAC,GACH,MAAMC,EAAMN,KAAKO,QAAQC,wBAAwBF,IAEjD,GAAIA,GAAO,IAAK,CACZN,KAAKG,WAAa,I,EAQ1B,iBAAAM,GACIT,KAAKU,OAASC,MAAMC,KAChBZ,KAAKa,GAAGC,iBAA8C,uB,CAItD,cAAAC,GACJf,KAAKU,OAAOM,SAAQC,IAChBA,EAAMC,OAAS,KAAK,IAGxB,GAAIlB,KAAKI,cAAgBJ,KAAKU,OAAOS,OAAQ,OAE7CnB,KAAKU,OAAOV,KAAKI,aAAac,OAAS,I,CAGnC,kBAAAE,GACJpB,KAAKa,GAAGQ,MAAMC,YAAY,gBAAiBtB,KAAKU,OAAO,GAAGa,YAAYC,W,CAGnE,kBAAAC,GACH,GAAIzB,KAAKI,cAAgB,GAAKJ,KAAKG,WAAY,CAC3CH,KAAKoB,qBACLpB,KAAKe,iBACL,MAAMW,EAAgBC,aAAY,KAC9B3B,KAAKI,cACLJ,KAAKe,iBAEL,GAAIf,KAAKI,cAAgBJ,KAAKU,OAAOS,OAAQ,CACzCS,cAAcF,E,IAEnB,K,EAIX,MAAAG,GACI,OACIC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,gBAAgBC,IAAKrB,GAAOb,KAAKO,QAAUM,GACnDiB,EAAI,MAAAE,IAAA,2CAAAC,MAAM,WAAWE,UAAWnC,KAAKoC,WACrCN,EAAK,OAAAE,IAAA,2CAAAC,MAAM,WACPH,EAAM,QAAAE,IAAA,2CAAAK,KAAK,SACXP,EAAG,KAAAE,IAAA,2CAAAC,MAAM,WAAWjC,KAAKsC,UAE7BR,EAAK,OAAAE,IAAA,2CAAAC,MAAM,iBACNjC,KAAKG,YAAc2B,EAAA,QAAAE,IAAA,2CAAMK,KAAK,UAC/BP,EAAA,QAAAE,IAAA,2CAAMK,KAAK,aAGfP,EAAA,QAAAE,IAAA,2CAAMK,KAAK,Y","ignoreList":[]}