npm - @postnord/pn-marketweb-components - Versions diffs - 4.0.3 → 4.0.4-test - Mend

@postnord/pn-marketweb-components 4.0.3 → 4.0.4-test

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

package/dist/cjs/pn-proxio-pricegroup.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-proxio-pricegroup.entry.cjs.js","mappings":"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","names":["translations","FetchHelper","MarketWebContextService","h","Host","arrow_left","index","arrow_right"],"sources":["src/components/widgets/pn-proxio-pricegroup/pn-proxio-pricegroup.scss?tag=pn-proxio-pricegroup","src/components/widgets/pn-proxio-pricegroup/pn-proxio-pricegroup.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n@import './pn-proxio-pricegroup-common.scss';\n\npn-proxio-pricegroup {\n div.proxio-pricegroup-container {\n max-width: 99.4rem;\n }\n\n div.weightcontainer {\n margin: 2.8rem 0;\n }\n\n div.weightvaluecontainer {\n display: flex;\n flex-direction: row;\n align-content: center;\n justify-content: space-between;\n align-items: flex-start;\n\n pn-button {\n transform: translateY(-0.4rem);\n\n button::before {\n display: none;\n }\n }\n }\n\n div.weightradios {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n flex-wrap: wrap;\n color: $blue700;\n width: 80%;\n margin: 0 3.6rem;\n position: relative;\n width: 0%;\n\n &[data-carousel-container-position='end50'] {\n width: 45%;\n margin-left: auto;\n margin-right: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n width: 40%;\n }\n }\n\n &[data-carousel-container-position='end75'] {\n width: 65%;\n margin-left: auto;\n margin-right: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin-right: auto;\n }\n }\n\n &[data-carousel-container-position='start50'] {\n width: 45%;\n margin-right: auto;\n margin-left: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n width: 40%;\n }\n }\n\n &[data-carousel-container-position='start75'] {\n width: 65%;\n margin-right: auto;\n margin-left: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin-left: auto;\n }\n }\n\n &[data-carousel-container-position='default'] {\n flex: 0 0 auto;\n width: 80%;\n\n @media screen and (max-width: $productcard-media-tablet) {\n width: 65%;\n }\n }\n }\n\n div.weightdata {\n display: flex;\n flex-direction: column;\n align-items: center;\n align-content: center;\n flex-wrap: wrap;\n justify-content: space-between;\n gap: 1.2rem;\n min-width: 4rem;\n cursor: pointer;\n\n label {\n font-size: 1.4rem;\n cursor: pointer;\n }\n\n &[data-carousel-position='0'] {\n font-size: 2rem;\n font-weight: 700;\n }\n\n &[data-carousel-position='2'],\n &[data-carousel-position='-2'] {\n @media screen and (max-width: $productcard-media-tablet) {\n display: none;\n }\n }\n\n &[data-carousel-position='outside'] {\n display: none;\n }\n\n input[type='radio'] {\n -webkit-appearance: none;\n -moz-appearance: none;\n width: 1.2rem;\n height: 1.2rem;\n background-color: $blue700;\n border-radius: 50%;\n margin: 0;\n cursor: pointer;\n }\n\n input[type='radio']:checked {\n z-index: 1;\n transform: translateY(-0.1rem);\n height: 1.4rem;\n width: 1.4rem;\n box-shadow:\n 0 0 0 0.3rem $white,\n 0 0 0 0.4rem $blue700;\n }\n }\n\n div.weightline {\n width: 100%;\n background-color: $gray50;\n z-index: -1;\n height: 0.8rem;\n -webkit-transform: translateX(2.1rem) translateY(1.32rem);\n transform: translateX(2.1rem) translateY(1rem);\n border-radius: 2rem;\n margin-right: 3.5rem;\n }\n\n pn-button {\n &[disabled='disabled'] {\n opacity: 0.2;\n\n button {\n cursor: default;\n\n &.pn-button-light .pn-button-bg:after {\n background-color: $white;\n }\n\n &[data-tooltip-open]:before {\n display: none;\n }\n }\n }\n\n button div.button-tooltip {\n display: none;\n }\n\n button:focus .pn-button-bg {\n box-shadow: none;\n }\n }\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\nimport { FetchHelper } from '../../../globals/FetchHelper';\nimport { MarketWebContextService } from '../../../globals/MarketWebContextService';\nimport { translations } from './translations';\nimport { ProductGenericItem, ProxioPriceGroupi18n, ProxioPriceListGroupResponse, ProxioProduct, ProductWeightGroupListItem } from './types';\nimport { arrow_left, arrow_right } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-proxio-pricegroup',\n styleUrl: 'pn-proxio-pricegroup.scss',\n})\nexport class PnProxioPricegroup {\n /** Specifies which endpoint domain we should load from */\n @Prop({ mutable: true }) endpoint: string = null;\n //@Prop() culture: string = \"sv-SE\";\n @Prop() language: string = 'sv';\n @Prop() market: string = 'se';\n @Prop() tariffid: string = '';\n @Prop() cache: boolean = true;\n\n @State() activeWeightIndex: number = 0;\n @State() data: ProxioPriceListGroupResponse = null;\n @State() i18n: ProxioPriceGroupi18n = translations['sv'];\n\n fetchHelper = new FetchHelper('proxiopricegroup');\n\n componentWillLoad() {\n this.setInitialValues().then(() => {\n this.init();\n });\n }\n\n async setInitialValues(href = window.location.href) {\n const marketWebContextService = new MarketWebContextService(href);\n const environment = await marketWebContextService.getEnvironmentName();\n\n if (!this.endpoint && environment?.indexOf('local') === -1) {\n const market = await marketWebContextService.getMarket();\n this.endpoint = await marketWebContextService.getEndpoint(environment, market);\n }\n\n if (!this.endpoint) {\n this.endpoint = '';\n }\n }\n\n init() {\n this.setLanguage();\n this.fetchData();\n }\n\n async fetchData() {\n if (!this.market \|\| !this.language \|\| !this.tariffid) {\n return;\n }\n const endpoint = this.endpoint.lastIndexOf('/') === this.endpoint.length - 1 ? this.endpoint.substring(0, this.endpoint.length - 1) : this.endpoint;\n const fetchUrl = `${endpoint}/api/proxio/price-list-group?tariffId=${this.tariffid}&market=${this.market}&language=${this.language}&cached=${this.cache}`;\n //const fetchUrl = `https://localhost:51547/api/proxio/price-list-group?tariffId=${this.tariffid}&market=${this.market}&language=${this.language}&cached=${this.cache}`;\n const data = (await this.fetchHelper.fetchJson(\n fetchUrl,\n {\n mode: 'cors',\n },\n this.cache,\n this.onFetchData.bind(this),\n )) as any;\n\n if (data?.proxioProduct) {\n this.data = data;\n }\n }\n\n onFetchData(data) {\n this.data = data;\n }\n\n @Listen('activeWeightIndex')\n setActiveWeightIndex(weightIndex: number) {\n let minIndex = 0;\n let maxIndex = this.data.proxioProduct?.weightAndPriceList?.length - 1 ?? minIndex;\n weightIndex = weightIndex > maxIndex ? maxIndex : weightIndex;\n weightIndex = weightIndex < minIndex ? minIndex : weightIndex;\n this.activeWeightIndex = weightIndex;\n }\n\n @Listen('language')\n setLanguage() {\n if (translations[this.language]) {\n this.i18n = translations[this.language] as ProxioPriceGroupi18n;\n }\n }\n\n getPriceString(product: ProxioProduct) {\n let price = product.weightAndPriceList ? product?.weightAndPriceList[this.activeWeightIndex]?.item2 : '';\n return price ? this.i18n.from + price : '';\n }\n\n getProductLink(product: ProxioProduct, productWeightGroupList: ProductWeightGroupListItem[]) {\n let productId = productWeightGroupList[this.activeWeightIndex]?.item2;\n let productLink = product.productLink ? product?.productLink : '';\n return productLink ? productLink + (productId ? '?productId=' + productId : '') : '';\n }\n\n isActive(index: number) {\n return index === this.activeWeightIndex;\n }\n\n getCarouselPosition(index: number) {\n switch (index) {\n case this.activeWeightIndex - 2: {\n return -2;\n }\n case this.activeWeightIndex - 1: {\n return -1;\n }\n case this.activeWeightIndex: {\n return 0;\n }\n case this.activeWeightIndex + 1: {\n return 1;\n }\n case this.activeWeightIndex + 2: {\n return 2;\n }\n default:\n return 'outside';\n }\n }\n\n getContainerPosition() {\n let maxIndex = this.data.proxioProduct.weightAndPriceList.length - 1;\n switch (this.activeWeightIndex) {\n case 0: {\n return 'end50';\n }\n case 1: {\n return 'end75';\n }\n case maxIndex - 1: {\n return 'start75';\n }\n case maxIndex: {\n return 'start50';\n }\n default: {\n return 'default';\n }\n }\n }\n\n render() {\n return (\n <Host>\n {this.data?.proxioProduct ? (\n <div class=\"proxio-pricegroup-container\">\n <div class=\"weightcontainer\">\n {this.data.proxioProduct.weightAndPriceList ? (\n <div class=\"weightvaluecontainer\">\n <pn-button\n disabled={this.activeWeightIndex === 0 ? 'disabled' : null}\n icon={arrow_left}\n appearance=\"light\"\n small=\"true\"\n onClick={() => this.setActiveWeightIndex(this.activeWeightIndex - 1)}\n ></pn-button>\n <div class=\"weightradios \" data-carousel-container-position={this.getContainerPosition()}>\n <div class=\"weightline\"></div>\n {this.data.proxioProduct.weightAndPriceList.map((weightItem, index) =>\n this.getCarouselPosition(index) !== null ? (\n <div class=\"weightdata\" data-carousel-position={this.getCarouselPosition(index)} onClick={() => this.setActiveWeightIndex(index)}>\n <input type=\"radio\" id={'weightradio' + index} name=\"weightradio\" value={index} checked={this.isActive(index)} />\n <label htmlFor={'weightradio' + index}>{weightItem.item1}</label>\n </div>\n ) : null,\n )}\n </div>\n <pn-button\n disabled={this.activeWeightIndex === this.data.proxioProduct?.weightAndPriceList?.length - 1 ? 'disabled' : null}\n icon={arrow_right}\n appearance=\"light\"\n small=\"true\"\n onClick={() => this.setActiveWeightIndex(this.activeWeightIndex + 1)}\n ></pn-button>\n </div>\n ) : null}\n </div>\n <pn-proxio-productcard>\n <pn-illustration slot=\"illustrationmobile\" illustration={this.data.proxioProduct.productIcon}></pn-illustration>\n <h2 slot=\"title\">{this.data.proxioProduct.productTitle}</h2>\n <pn-proxio-productcard-description\n slot=\"description\"\n heading={this.data.proxioProduct.productPreamble}\n highlight={this.data.proxioProduct.deliveryDateInformation}\n list={this.data.proxioProduct.productDescriptionBulletListItems}\n ></pn-proxio-productcard-description>\n <div slot=\"information\">\n <pn-proxio-productcard-information\n label={this.i18n.labelMaxDimensions}\n information={this.data.proxioProduct.productPackageDimensionsList as ProductGenericItem[]}\n ></pn-proxio-productcard-information>\n <pn-proxio-productcard-information\n label={this.i18n.labelMaxDimensionsRoll}\n information={this.data.proxioProduct.productRollDimensionsList as ProductGenericItem[]}\n ></pn-proxio-productcard-information>\n </div>\n <div slot=\"bottomtags\">\n {this.data.proxioProduct.usp1 ? <pn-titletag color=\"gray50\">{this.data.proxioProduct.usp1}</pn-titletag> : null}\n {this.data.proxioProduct.usp2 ? <pn-titletag color=\"gray50\">{this.data.proxioProduct.usp2}</pn-titletag> : null}\n {this.data.proxioProduct.usp3 ? <pn-titletag color=\"gray50\">{this.data.proxioProduct.usp3}</pn-titletag> : null}\n </div>\n <pn-illustration slot=\"illustration\" illustration={this.data.proxioProduct.productIcon}></pn-illustration>\n <div slot=\"pricelink\">\n <pn-proxio-productcard-pricelink\n price={this.getPriceString(this.data.proxioProduct)}\n link={this.getProductLink(this.data.proxioProduct, this.data.proxioProduct.productWeightGroupList)}\n linktext={this.data.proxioProduct.productLinkText}\n ></pn-proxio-productcard-pricelink>\n {this.data.relatedProxioProducts\n ? this.data.relatedProxioProducts.map(product => (\n <pn-proxio-productcard-pricelink\n price={this.getPriceString(product)}\n link={product.productLink}\n linktext={product.productLinkText}\n ></pn-proxio-productcard-pricelink>\n ))\n : null}\n </div>\n </pn-proxio-productcard>\n </div>\n ) : null}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-proxio-pricegroup.entry.cjs.js","mappings":";;;;;;;;;;AAAA,MAAM,qBAAqB,GAAG,6oHAA6oH,CAAC;AAC5qH,iCAAe,qBAAqB;;MCUvB,kBAAkB;;;wBAEe,IAAI;wBAErB,IAAI;sBACN,IAAI;wBACF,EAAE;qBACJ,IAAI;iCAEQ,CAAC;oBACQ,IAAI;oBACZA,yBAAY,CAAC,IAAI,CAAC;;IAExD,WAAW,GAAG,IAAIC,uBAAW,CAAC,kBAAkB,CAAC,CAAC;IAElD,iBAAiB;QACf,IAAI,CAAC,gBAAgB,EAAE,CAAC,IAAI,CAAC;YAC3B,IAAI,CAAC,IAAI,EAAE,CAAC;SACb,CAAC,CAAC;KACJ;IAED,MAAM,gBAAgB,CAAC,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI;QAChD,MAAM,uBAAuB,GAAG,IAAIC,mCAAuB,CAAC,IAAI,CAAC,CAAC;QAClE,MAAM,WAAW,GAAG,MAAM,uBAAuB,CAAC,kBAAkB,EAAE,CAAC;QAEvE,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,WAAW,EAAE,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE;YAC1D,MAAM,MAAM,GAAG,MAAM,uBAAuB,CAAC,SAAS,EAAE,CAAC;YACzD,IAAI,CAAC,QAAQ,GAAG,MAAM,uBAAuB,CAAC,WAAW,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;SAChF;QAED,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;SACpB;KACF;IAED,IAAI;QACF,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,MAAM,SAAS;QACb,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YACpD,OAAO;SACR;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpJ,MAAM,QAAQ,GAAG,GAAG,QAAQ,yCAAyC,IAAI,CAAC,QAAQ,WAAW,IAAI,CAAC,MAAM,aAAa,IAAI,CAAC,QAAQ,WAAW,IAAI,CAAC,KAAK,EAAE,CAAC;;QAE1J,MAAM,IAAI,IAAI,MAAM,IAAI,CAAC,WAAW,CAAC,SAAS,CAC5C,QAAQ,EACR;YACE,IAAI,EAAE,MAAM;SACb,EACD,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAC5B,CAAQ,CAAC;QAEV,IAAI,IAAI,EAAE,aAAa,EAAE;YACvB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;SAClB;KACF;IAED,WAAW,CAAC,IAAI;QACd,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;KAClB;IAGD,oBAAoB,CAAC,WAAmB;QACtC,IAAI,QAAQ,GAAG,CAAC,CAAC;QACjB,IAAI,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,kBAAkB,EAAE,MAAM,GAAG,CAAC,IAAI,QAAQ,CAAC;QACnF,WAAW,GAAG,WAAW,GAAG,QAAQ,GAAG,QAAQ,GAAG,WAAW,CAAC;QAC9D,WAAW,GAAG,WAAW,GAAG,QAAQ,GAAG,QAAQ,GAAG,WAAW,CAAC;QAC9D,IAAI,CAAC,iBAAiB,GAAG,WAAW,CAAC;KACtC;IAGD,WAAW;QACT,IAAIF,yBAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YAC/B,IAAI,CAAC,IAAI,GAAGA,yBAAY,CAAC,IAAI,CAAC,QAAQ,CAAyB,CAAC;SACjE;KACF;IAED,cAAc,CAAC,OAAsB;QACnC,IAAI,KAAK,GAAG,OAAO,CAAC,kBAAkB,GAAG,OAAO,EAAE,kBAAkB,CAAC,IAAI,CAAC,iBAAiB,CAAC,EAAE,KAAK,GAAG,EAAE,CAAC;QACzG,OAAO,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,KAAK,GAAG,EAAE,CAAC;KAC5C;IAED,cAAc,CAAC,OAAsB,EAAE,sBAAoD;QACzF,IAAI,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC,iBAAiB,CAAC,EAAE,KAAK,CAAC;QACtE,IAAI,WAAW,GAAG,OAAO,CAAC,WAAW,GAAG,OAAO,EAAE,WAAW,GAAG,EAAE,CAAC;QAClE,OAAO,WAAW,GAAG,WAAW,IAAI,SAAS,GAAG,aAAa,GAAG,SAAS,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC;KACtF;IAED,QAAQ,CAAC,KAAa;QACpB,OAAO,KAAK,KAAK,IAAI,CAAC,iBAAiB,CAAC;KACzC;IAED,mBAAmB,CAAC,KAAa;QAC/B,QAAQ,KAAK;YACX,KAAK,IAAI,CAAC,iBAAiB,GAAG,CAAC,EAAE;gBAC/B,OAAO,CAAC,CAAC,CAAC;aACX;YACD,KAAK,IAAI,CAAC,iBAAiB,GAAG,CAAC,EAAE;gBAC/B,OAAO,CAAC,CAAC,CAAC;aACX;YACD,KAAK,IAAI,CAAC,iBAAiB,EAAE;gBAC3B,OAAO,CAAC,CAAC;aACV;YACD,KAAK,IAAI,CAAC,iBAAiB,GAAG,CAAC,EAAE;gBAC/B,OAAO,CAAC,CAAC;aACV;YACD,KAAK,IAAI,CAAC,iBAAiB,GAAG,CAAC,EAAE;gBAC/B,OAAO,CAAC,CAAC;aACV;YACD;gBACE,OAAO,SAAS,CAAC;SACpB;KACF;IAED,oBAAoB;QAClB,IAAI,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC,MAAM,GAAG,CAAC,CAAC;QACrE,QAAQ,IAAI,CAAC,iBAAiB;YAC5B,KAAK,CAAC,EAAE;gBACN,OAAO,OAAO,CAAC;aAChB;YACD,KAAK,CAAC,EAAE;gBACN,OAAO,OAAO,CAAC;aAChB;YACD,KAAK,QAAQ,GAAG,CAAC,EAAE;gBACjB,OAAO,SAAS,CAAC;aAClB;YACD,KAAK,QAAQ,EAAE;gBACb,OAAO,SAAS,CAAC;aAClB;YACD,SAAS;gBACP,OAAO,SAAS,CAAC;aAClB;SACF;KACF;IAED,MAAM;QACJ,QACEG,QAACC,UAAI,uDACF,IAAI,CAAC,IAAI,EAAE,aAAa,IACvBD,iBAAK,KAAK,EAAC,6BAA6B,IACtCA,iBAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,IACzCA,iBAAK,KAAK,EAAC,sBAAsB,IAC/BA,uBACE,QAAQ,EAAE,IAAI,CAAC,iBAAiB,KAAK,CAAC,GAAG,UAAU,GAAG,IAAI,EAC1D,IAAI,EAAEE,qBAAU,EAChB,UAAU,EAAC,OAAO,EAClB,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,MAAM,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,GACzD,EACbF,iBAAK,KAAK,EAAC,eAAe,sCAAmC,IAAI,CAAC,oBAAoB,EAAE,IACtFA,iBAAK,KAAK,EAAC,YAAY,GAAO,EAC7B,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC,UAAU,EAAEG,OAAK,KAChE,IAAI,CAAC,mBAAmB,CAACA,OAAK,CAAC,KAAK,IAAI,IACtCH,iBAAK,KAAK,EAAC,YAAY,4BAAyB,IAAI,CAAC,mBAAmB,CAACG,OAAK,CAAC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,oBAAoB,CAACA,OAAK,CAAC,IAC9HH,mBAAO,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,aAAa,GAAGG,OAAK,EAAE,IAAI,EAAC,aAAa,EAAC,KAAK,EAAEA,OAAK,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,CAACA,OAAK,CAAC,GAAI,EACjHH,mBAAO,OAAO,EAAE,aAAa,GAAGG,OAAK,IAAG,UAAU,CAAC,KAAK,CAAS,CAC7D,IACJ,IAAI,CACT,CACG,EACNH,uBACE,QAAQ,EAAE,IAAI,CAAC,iBAAiB,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,kBAAkB,EAAE,MAAM,GAAG,CAAC,GAAG,UAAU,GAAG,IAAI,EAChH,IAAI,EAAEI,uBAAW,EACjB,UAAU,EAAC,OAAO,EAClB,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,MAAM,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,GACzD,CACT,IACJ,IAAI,CACJ,EACNJ,uCACEA,6BAAiB,IAAI,EAAC,oBAAoB,EAAC,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,WAAW,GAAoB,EAChHA,gBAAI,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,YAAY,CAAM,EAC5DA,+CACE,IAAI,EAAC,aAAa,EAClB,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,EAChD,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,EAC1D,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,iCAAiC,GAC5B,EACrCA,iBAAK,IAAI,EAAC,aAAa,IACrBA,+CACE,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,kBAAkB,EACnC,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,4BAAoD,GACtD,EACrCA,+CACE,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,sBAAsB,EACvC,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,yBAAiD,GACnD,CACjC,EACNA,iBAAK,IAAI,EAAC,YAAY,IACnB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,GAAGA,yBAAa,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAe,GAAG,IAAI,EAC9G,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,GAAGA,yBAAa,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAe,GAAG,IAAI,EAC9G,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,GAAGA,yBAAa,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAe,GAAG,IAAI,CAC3G,EACNA,6BAAiB,IAAI,EAAC,cAAc,EAAC,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,WAAW,GAAoB,EAC1GA,iBAAK,IAAI,EAAC,WAAW,IACnBA,6CACE,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,EACnD,IAAI,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,sBAAsB,CAAC,EAClG,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,GAChB,EAClC,IAAI,CAAC,IAAI,CAAC,qBAAqB;cAC5B,IAAI,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,CAAC,OAAO,KACzCA,6CACE,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EACnC,IAAI,EAAE,OAAO,CAAC,WAAW,EACzB,QAAQ,EAAE,OAAO,CAAC,eAAe,GACA,CACpC,CAAC;cACF,IAAI,CACJ,CACgB,CACpB,IACJ,IAAI,CACH,EACP;KACH;;;;;;","names":["translations","FetchHelper","MarketWebContextService","h","Host","arrow_left","index","arrow_right"],"sources":["src/components/widgets/pn-proxio-pricegroup/pn-proxio-pricegroup.scss?tag=pn-proxio-pricegroup","src/components/widgets/pn-proxio-pricegroup/pn-proxio-pricegroup.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n@import './pn-proxio-pricegroup-common.scss';\n\npn-proxio-pricegroup {\n div.proxio-pricegroup-container {\n max-width: 99.4rem;\n }\n\n div.weightcontainer {\n margin: 2.8rem 0;\n }\n\n div.weightvaluecontainer {\n display: flex;\n flex-direction: row;\n align-content: center;\n justify-content: space-between;\n align-items: flex-start;\n\n pn-button {\n transform: translateY(-0.4rem);\n\n button::before {\n display: none;\n }\n }\n }\n\n div.weightradios {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n flex-wrap: wrap;\n color: $blue700;\n width: 80%;\n margin: 0 3.6rem;\n position: relative;\n width: 0%;\n\n &[data-carousel-container-position='end50'] {\n width: 45%;\n margin-left: auto;\n margin-right: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n width: 40%;\n }\n }\n\n &[data-carousel-container-position='end75'] {\n width: 65%;\n margin-left: auto;\n margin-right: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin-right: auto;\n }\n }\n\n &[data-carousel-container-position='start50'] {\n width: 45%;\n margin-right: auto;\n margin-left: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n width: 40%;\n }\n }\n\n &[data-carousel-container-position='start75'] {\n width: 65%;\n margin-right: auto;\n margin-left: 3.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin-left: auto;\n }\n }\n\n &[data-carousel-container-position='default'] {\n flex: 0 0 auto;\n width: 80%;\n\n @media screen and (max-width: $productcard-media-tablet) {\n width: 65%;\n }\n }\n }\n\n div.weightdata {\n display: flex;\n flex-direction: column;\n align-items: center;\n align-content: center;\n flex-wrap: wrap;\n justify-content: space-between;\n gap: 1.2rem;\n min-width: 4rem;\n cursor: pointer;\n\n label {\n font-size: 1.4rem;\n cursor: pointer;\n }\n\n &[data-carousel-position='0'] {\n font-size: 2rem;\n font-weight: 700;\n }\n\n &[data-carousel-position='2'],\n &[data-carousel-position='-2'] {\n @media screen and (max-width: $productcard-media-tablet) {\n display: none;\n }\n }\n\n &[data-carousel-position='outside'] {\n display: none;\n }\n\n input[type='radio'] {\n -webkit-appearance: none;\n -moz-appearance: none;\n width: 1.2rem;\n height: 1.2rem;\n background-color: $blue700;\n border-radius: 50%;\n margin: 0;\n cursor: pointer;\n }\n\n input[type='radio']:checked {\n z-index: 1;\n transform: translateY(-0.1rem);\n height: 1.4rem;\n width: 1.4rem;\n box-shadow:\n 0 0 0 0.3rem $white,\n 0 0 0 0.4rem $blue700;\n }\n }\n\n div.weightline {\n width: 100%;\n background-color: $gray50;\n z-index: -1;\n height: 0.8rem;\n -webkit-transform: translateX(2.1rem) translateY(1.32rem);\n transform: translateX(2.1rem) translateY(1rem);\n border-radius: 2rem;\n margin-right: 3.5rem;\n }\n\n pn-button {\n &[disabled='disabled'] {\n opacity: 0.2;\n\n button {\n cursor: default;\n\n &.pn-button-light .pn-button-bg:after {\n background-color: $white;\n }\n\n &[data-tooltip-open]:before {\n display: none;\n }\n }\n }\n\n button div.button-tooltip {\n display: none;\n }\n\n button:focus .pn-button-bg {\n box-shadow: none;\n }\n }\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\nimport { FetchHelper } from '../../../globals/FetchHelper';\nimport { MarketWebContextService } from '../../../globals/MarketWebContextService';\nimport { translations } from './translations';\nimport { ProductGenericItem, ProxioPriceGroupi18n, ProxioPriceListGroupResponse, ProxioProduct, ProductWeightGroupListItem } from './types';\nimport { arrow_left, arrow_right } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-proxio-pricegroup',\n styleUrl: 'pn-proxio-pricegroup.scss',\n})\nexport class PnProxioPricegroup {\n /** Specifies which endpoint domain we should load from */\n @Prop({ mutable: true }) endpoint: string = null;\n //@Prop() culture: string = \"sv-SE\";\n @Prop() language: string = 'sv';\n @Prop() market: string = 'se';\n @Prop() tariffid: string = '';\n @Prop() cache: boolean = true;\n\n @State() activeWeightIndex: number = 0;\n @State() data: ProxioPriceListGroupResponse = null;\n @State() i18n: ProxioPriceGroupi18n = translations['sv'];\n\n fetchHelper = new FetchHelper('proxiopricegroup');\n\n componentWillLoad() {\n this.setInitialValues().then(() => {\n this.init();\n });\n }\n\n async setInitialValues(href = window.location.href) {\n const marketWebContextService = new MarketWebContextService(href);\n const environment = await marketWebContextService.getEnvironmentName();\n\n if (!this.endpoint && environment?.indexOf('local') === -1) {\n const market = await marketWebContextService.getMarket();\n this.endpoint = await marketWebContextService.getEndpoint(environment, market);\n }\n\n if (!this.endpoint) {\n this.endpoint = '';\n }\n }\n\n init() {\n this.setLanguage();\n this.fetchData();\n }\n\n async fetchData() {\n if (!this.market \|\| !this.language \|\| !this.tariffid) {\n return;\n }\n const endpoint = this.endpoint.lastIndexOf('/') === this.endpoint.length - 1 ? this.endpoint.substring(0, this.endpoint.length - 1) : this.endpoint;\n const fetchUrl = `${endpoint}/api/proxio/price-list-group?tariffId=${this.tariffid}&market=${this.market}&language=${this.language}&cached=${this.cache}`;\n //const fetchUrl = `https://localhost:51547/api/proxio/price-list-group?tariffId=${this.tariffid}&market=${this.market}&language=${this.language}&cached=${this.cache}`;\n const data = (await this.fetchHelper.fetchJson(\n fetchUrl,\n {\n mode: 'cors',\n },\n this.cache,\n this.onFetchData.bind(this),\n )) as any;\n\n if (data?.proxioProduct) {\n this.data = data;\n }\n }\n\n onFetchData(data) {\n this.data = data;\n }\n\n @Listen('activeWeightIndex')\n setActiveWeightIndex(weightIndex: number) {\n let minIndex = 0;\n let maxIndex = this.data.proxioProduct?.weightAndPriceList?.length - 1 ?? minIndex;\n weightIndex = weightIndex > maxIndex ? maxIndex : weightIndex;\n weightIndex = weightIndex < minIndex ? minIndex : weightIndex;\n this.activeWeightIndex = weightIndex;\n }\n\n @Listen('language')\n setLanguage() {\n if (translations[this.language]) {\n this.i18n = translations[this.language] as ProxioPriceGroupi18n;\n }\n }\n\n getPriceString(product: ProxioProduct) {\n let price = product.weightAndPriceList ? product?.weightAndPriceList[this.activeWeightIndex]?.item2 : '';\n return price ? this.i18n.from + price : '';\n }\n\n getProductLink(product: ProxioProduct, productWeightGroupList: ProductWeightGroupListItem[]) {\n let productId = productWeightGroupList[this.activeWeightIndex]?.item2;\n let productLink = product.productLink ? product?.productLink : '';\n return productLink ? productLink + (productId ? '?productId=' + productId : '') : '';\n }\n\n isActive(index: number) {\n return index === this.activeWeightIndex;\n }\n\n getCarouselPosition(index: number) {\n switch (index) {\n case this.activeWeightIndex - 2: {\n return -2;\n }\n case this.activeWeightIndex - 1: {\n return -1;\n }\n case this.activeWeightIndex: {\n return 0;\n }\n case this.activeWeightIndex + 1: {\n return 1;\n }\n case this.activeWeightIndex + 2: {\n return 2;\n }\n default:\n return 'outside';\n }\n }\n\n getContainerPosition() {\n let maxIndex = this.data.proxioProduct.weightAndPriceList.length - 1;\n switch (this.activeWeightIndex) {\n case 0: {\n return 'end50';\n }\n case 1: {\n return 'end75';\n }\n case maxIndex - 1: {\n return 'start75';\n }\n case maxIndex: {\n return 'start50';\n }\n default: {\n return 'default';\n }\n }\n }\n\n render() {\n return (\n <Host>\n {this.data?.proxioProduct ? (\n <div class=\"proxio-pricegroup-container\">\n <div class=\"weightcontainer\">\n {this.data.proxioProduct.weightAndPriceList ? (\n <div class=\"weightvaluecontainer\">\n <pn-button\n disabled={this.activeWeightIndex === 0 ? 'disabled' : null}\n icon={arrow_left}\n appearance=\"light\"\n small=\"true\"\n onClick={() => this.setActiveWeightIndex(this.activeWeightIndex - 1)}\n ></pn-button>\n <div class=\"weightradios \" data-carousel-container-position={this.getContainerPosition()}>\n <div class=\"weightline\"></div>\n {this.data.proxioProduct.weightAndPriceList.map((weightItem, index) =>\n this.getCarouselPosition(index) !== null ? (\n <div class=\"weightdata\" data-carousel-position={this.getCarouselPosition(index)} onClick={() => this.setActiveWeightIndex(index)}>\n <input type=\"radio\" id={'weightradio' + index} name=\"weightradio\" value={index} checked={this.isActive(index)} />\n <label htmlFor={'weightradio' + index}>{weightItem.item1}</label>\n </div>\n ) : null,\n )}\n </div>\n <pn-button\n disabled={this.activeWeightIndex === this.data.proxioProduct?.weightAndPriceList?.length - 1 ? 'disabled' : null}\n icon={arrow_right}\n appearance=\"light\"\n small=\"true\"\n onClick={() => this.setActiveWeightIndex(this.activeWeightIndex + 1)}\n ></pn-button>\n </div>\n ) : null}\n </div>\n <pn-proxio-productcard>\n <pn-illustration slot=\"illustrationmobile\" illustration={this.data.proxioProduct.productIcon}></pn-illustration>\n <h2 slot=\"title\">{this.data.proxioProduct.productTitle}</h2>\n <pn-proxio-productcard-description\n slot=\"description\"\n heading={this.data.proxioProduct.productPreamble}\n highlight={this.data.proxioProduct.deliveryDateInformation}\n list={this.data.proxioProduct.productDescriptionBulletListItems}\n ></pn-proxio-productcard-description>\n <div slot=\"information\">\n <pn-proxio-productcard-information\n label={this.i18n.labelMaxDimensions}\n information={this.data.proxioProduct.productPackageDimensionsList as ProductGenericItem[]}\n ></pn-proxio-productcard-information>\n <pn-proxio-productcard-information\n label={this.i18n.labelMaxDimensionsRoll}\n information={this.data.proxioProduct.productRollDimensionsList as ProductGenericItem[]}\n ></pn-proxio-productcard-information>\n </div>\n <div slot=\"bottomtags\">\n {this.data.proxioProduct.usp1 ? <pn-titletag color=\"gray50\">{this.data.proxioProduct.usp1}</pn-titletag> : null}\n {this.data.proxioProduct.usp2 ? <pn-titletag color=\"gray50\">{this.data.proxioProduct.usp2}</pn-titletag> : null}\n {this.data.proxioProduct.usp3 ? <pn-titletag color=\"gray50\">{this.data.proxioProduct.usp3}</pn-titletag> : null}\n </div>\n <pn-illustration slot=\"illustration\" illustration={this.data.proxioProduct.productIcon}></pn-illustration>\n <div slot=\"pricelink\">\n <pn-proxio-productcard-pricelink\n price={this.getPriceString(this.data.proxioProduct)}\n link={this.getProductLink(this.data.proxioProduct, this.data.proxioProduct.productWeightGroupList)}\n linktext={this.data.proxioProduct.productLinkText}\n ></pn-proxio-productcard-pricelink>\n {this.data.relatedProxioProducts\n ? this.data.relatedProxioProducts.map(product => (\n <pn-proxio-productcard-pricelink\n price={this.getPriceString(product)}\n link={product.productLink}\n linktext={product.productLinkText}\n ></pn-proxio-productcard-pricelink>\n ))\n : null}\n </div>\n </pn-proxio-productcard>\n </div>\n ) : null}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/pn-proxio-productcard_4.cjs.entry.js CHANGED Viewed

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b02670c2.js');
+const index = require('./index-34e1c673.js');
 const arrow_right = require('./arrow_right-66958158.js');
-const pnProxioProductcardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-proxio-productcard .cardcontent{display:flex;flex-direction:row;border:solid 0.1rem #f9f8f8;border-radius:0.8rem;overflow:hidden;margin-left:auto;margin-right:auto;margin-bottom:1.6rem}@media screen and (max-width: 48em){pn-proxio-productcard .cardcontent{flex-direction:column}}pn-proxio-productcard .carddetails{min-width:70%;padding:2.4rem 4.8rem;display:flex;gap:0.8rem;flex-direction:column}@media screen and (max-width: 48em){pn-proxio-productcard .carddetails{gap:1.6rem;margin-bottom:0.8rem}}pn-proxio-productcard .carddetails pn-illustration[slot=illustrationmobile]{display:none}@media screen and (max-width: 48em){pn-proxio-productcard .carddetails pn-illustration[slot=illustrationmobile]{margin-top:1.6rem;display:block}pn-proxio-productcard .carddetails pn-illustration[slot=illustrationmobile] .pn-illustration{max-width:8rem;height:8rem;margin-left:auto;margin-right:auto}}pn-proxio-productcard .cardcalltoactions{min-width:30%;background-color:#effbff}pn-proxio-productcard .cardcalltoactions pn-illustration[slot=illustration]{display:flex;flex-direction:column;justify-content:center;align-content:center;max-width:12rem;margin-left:auto;margin-right:auto;margin-top:4rem}@media screen and (max-width: 48em){pn-proxio-productcard .cardcalltoactions pn-illustration[slot=illustration]{display:none}}pn-proxio-productcard [slot=information]{display:flex;gap:1rem}@media screen and (max-width: 48em){pn-proxio-productcard [slot=information]{flex-direction:column;gap:1.6rem}}pn-proxio-productcard [slot=uppertags]{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2rem}pn-proxio-productcard [slot=bottomtags]{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2rem;margin:0.8rem 0}pn-proxio-productcard .heading{display:flex;justify-content:space-between;flex-direction:row}pn-proxio-productcard [slot=title]{text-decoration:underline}@media screen and (max-width: 48em){pn-proxio-productcard [slot=title]{text-decoration:none}}";
+const pnProxioProductcardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-proxio-productcard .cardcontent{display:flex;flex-direction:row;border:solid 0.1rem #f9f8f8;border-radius:0.8rem;overflow:hidden;margin-left:auto;margin-right:auto;margin-bottom:1.6rem}@media screen and (max-width: 48em){pn-proxio-productcard .cardcontent{flex-direction:column}}pn-proxio-productcard .carddetails{min-width:70%;padding:2.4rem 4.8rem;display:flex;gap:0.8rem;flex-direction:column}@media screen and (max-width: 48em){pn-proxio-productcard .carddetails{gap:1.6rem;margin-bottom:0.8rem}}pn-proxio-productcard .carddetails pn-illustration[slot=illustrationmobile]{display:none}@media screen and (max-width: 48em){pn-proxio-productcard .carddetails pn-illustration[slot=illustrationmobile]{margin-top:1.6rem;display:block}pn-proxio-productcard .carddetails pn-illustration[slot=illustrationmobile] .pn-illustration{max-width:8rem;height:8rem;margin-left:auto;margin-right:auto}}pn-proxio-productcard .cardcalltoactions{min-width:30%;background-color:#effbff}pn-proxio-productcard .cardcalltoactions pn-illustration[slot=illustration]{display:flex;flex-direction:column;justify-content:center;align-content:center;max-width:12rem;margin-left:auto;margin-right:auto;margin-top:4rem}@media screen and (max-width: 48em){pn-proxio-productcard .cardcalltoactions pn-illustration[slot=illustration]{display:none}}pn-proxio-productcard [slot=information]{display:flex;gap:1rem}@media screen and (max-width: 48em){pn-proxio-productcard [slot=information]{flex-direction:column;gap:1.6rem}}pn-proxio-productcard [slot=uppertags]{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2rem}pn-proxio-productcard [slot=bottomtags]{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:2rem;margin:0.8rem 0}pn-proxio-productcard .heading{display:flex;justify-content:space-between;flex-direction:row}pn-proxio-productcard [slot=title]{text-decoration:underline}@media screen and (max-width: 48em){pn-proxio-productcard [slot=title]{text-decoration:none}}";
 const PnProxioProductcardStyle0 = pnProxioProductcardCss;
 const PnProxioProductcard = class {
@@ -13,12 +13,12 @@ const PnProxioProductcard = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'a54ac8b5337b080c3684da1adf3924a66e8e2db5' }, index.h("div", { key: 'c9ec257fbe1a0a6f266e15d5615028389be32aeb', class: "cardcontent" }, index.h("div", { key: 'f4fa413b12e6796e43a85ef84be95af5e77c313f', class: "carddetails" }, index.h("slot", { key: 'd3e84fb18d8e21e5874b7f1896e923235195b380', name: "illustrationmobile" }), index.h("div", { key: 'f957632f1a121cde3f016ef74e05e287e8a76a61', class: "heading" }, index.h("slot", { key: 'a5ad524ac899686241ff5fa7fb75b805ff5d5364', name: "title" }), index.h("slot", { key: '8b2498d83972342c5fd1fe0c08d8a6841fe8fba4', name: "uppertags" })), index.h("slot", { key: 'ee3530c277aef75f1bdae161cf656c03c0efc151', name: "description" }), index.h("slot", { key: '399d0361f0302828d42e0f263331e526ad2656a7', name: "information" }), index.h("slot", { key: 'e41b169bd8a128542e274cd5786f4fcd21296a06', name: "bottomtags" })), index.h("div", { key: 'dd2ea4dfd8fd9a620a9bfac2facdb79ce9a28fd1', class: "cardcalltoactions" }, index.h("slot", { key: '64c7dc14217432fddf536c1256779de624f8d135', name: "illustration" }), index.h("slot", { key: '1c0dc3318e43c55210d4de994f38426bcf96e84d', name: "pricelink" }), index.h("slot", { key: '08f83562748f18e63e4963a76048cf7ccf3dea06', name: "insurance" })))));
+        return (index.h(index.Host, { key: '0b26ae1aa1292357c5030498adeb5f1e7f87d85d' }, index.h("div", { key: '9a0b5646b320dd48dfbab0f7801fcf010b189071', class: "cardcontent" }, index.h("div", { key: 'd858b0a8ce5078004e0bd4ba4dc60d3d658a4672', class: "carddetails" }, index.h("slot", { key: 'b94aa9596d36c92b9d2fb441a85d61418654c484', name: "illustrationmobile" }), index.h("div", { key: '7fbb7c981dc47668aef3e98e8e1cd84ddb6dcc6d', class: "heading" }, index.h("slot", { key: '4abe626da56d671cc091627b10f6b9af57705408', name: "title" }), index.h("slot", { key: '8a3b9650d82f7f3d746546bdd71597d8b44a8d17', name: "uppertags" })), index.h("slot", { key: '61d5bbe10032d715e9dd879c68e3e856edbadcec', name: "description" }), index.h("slot", { key: 'd16c7591857d86b855f12b7dbe5f7a41772c7d91', name: "information" }), index.h("slot", { key: '6671fb2c6925f5ff0b3db66e337329924f9ed43f', name: "bottomtags" })), index.h("div", { key: '3882ae15afcd9b3b2bbd385cba386843a648a5c4', class: "cardcalltoactions" }, index.h("slot", { key: 'd171da455aee350507418b360cef353e92a184b9', name: "illustration" }), index.h("slot", { key: 'bcec30db741fa30195ee4091fa4b45aa20498813', name: "pricelink" }), index.h("slot", { key: '841fa07224456488d1ec67f3c5752276627e0a19', name: "insurance" })))));
     }
 };
 PnProxioProductcard.style = PnProxioProductcardStyle0;
-const pnProxioProductcardDescriptionCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-proxio-productcard-description h3{font-size:1.6rem}pn-proxio-productcard-description ul{padding-left:2.5rem}pn-proxio-productcard-description li{font-size:1.6rem;line-height:2.2rem}pn-proxio-productcard-description .highlight{color:#0aa85c}";
+const pnProxioProductcardDescriptionCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-proxio-productcard-description h3{font-size:1.6rem}pn-proxio-productcard-description ul{padding-left:2.5rem}pn-proxio-productcard-description li{font-size:1.6rem;line-height:2.2rem}pn-proxio-productcard-description .highlight{color:#0aa85c}";
 const PnProxioProductcardDescriptionStyle0 = pnProxioProductcardDescriptionCss;
 const PnProxioProductcardDescription = class {
@@ -30,14 +30,14 @@ const PnProxioProductcardDescription = class {
         this.list = [];
     }
     render() {
-        return (index.h(index.Host, { key: 'd3e64b6d66f2b2bc0857716a2125c709627f28fb' }, this.heading ? index.h("h3", null, this.heading) : null, this.highlight ? index.h("h3", { class: "highlight" }, this.highlight) : null, this.description ? index.h("span", null, this.description) : null, this.list ? (index.h("ul", null, this.list.map(text => {
+        return (index.h(index.Host, { key: '8a407eb3650b011fa56efd51440333d3a20980e4' }, this.heading ? index.h("h3", null, this.heading) : null, this.highlight ? index.h("h3", { class: "highlight" }, this.highlight) : null, this.description ? index.h("span", null, this.description) : null, this.list ? (index.h("ul", null, this.list.map(text => {
             return index.h("li", null, text);
         }))) : null));
     }
 };
 PnProxioProductcardDescription.style = PnProxioProductcardDescriptionStyle0;
-const pnProxioProductcardInformationCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-proxio-productcard-information p.cardinfocontent-title{margin-bottom:0.4rem}pn-proxio-productcard-information p strong.cardinfocontent-label{font-size:1.4rem;font-weight:500}";
+const pnProxioProductcardInformationCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-proxio-productcard-information p.cardinfocontent-title{margin-bottom:0.4rem}pn-proxio-productcard-information p strong.cardinfocontent-label{font-size:1.4rem;font-weight:500}";
 const PnProxioProductcardInformationStyle0 = pnProxioProductcardInformationCss;
 const PnProxioProductcardInformation = class {
@@ -47,12 +47,12 @@ const PnProxioProductcardInformation = class {
         this.information = [];
     }
     render() {
-        return (index.h(index.Host, { key: 'f8036717bc69970e8348e909c600484babd47dac' }, index.h("div", { key: 'ab79a0e358ec13504924e8f375262474d04d9e07', class: "cardinfocontent" }, this.information && this.information.length > 0 && this.label ? (index.h("div", { class: "cardinfocontent-item" }, this.label ? (index.h("p", { class: "cardinfocontent-title" }, index.h("strong", null, this.label))) : null, this.information.map(item => item ? (index.h("p", null, index.h("strong", { class: "cardinfocontent-label" }, item.item1, ":"), " ", item.item2)) : null))) : null)));
+        return (index.h(index.Host, { key: 'b404bb5b6dee088fe2c4d1f78207717633613d91' }, index.h("div", { key: '7a6f90aa91c57d71a61d3fdc58dc97b976b681f5', class: "cardinfocontent" }, this.information && this.information.length > 0 && this.label ? (index.h("div", { class: "cardinfocontent-item" }, this.label ? (index.h("p", { class: "cardinfocontent-title" }, index.h("strong", null, this.label))) : null, this.information.map(item => item ? (index.h("p", null, index.h("strong", { class: "cardinfocontent-label" }, item.item1, ":"), " ", item.item2)) : null))) : null)));
     }
 };
 PnProxioProductcardInformation.style = PnProxioProductcardInformationStyle0;
-const pnProxioProductcardPricelinkCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-proxio-productcard-pricelink{align-self:center;display:flex;flex-direction:column;align-items:center;margin:2rem 1rem;gap:0.8rem;align-content:center;flex-wrap:wrap}@media screen and (max-width: 48em){pn-proxio-productcard-pricelink{margin:2.4rem 1rem}}pn-proxio-productcard-pricelink h3{font-size:2rem}pn-proxio-productcard-pricelink pn-button{min-width:17.3rem}pn-proxio-productcard-pricelink pn-button a .pn-button-content{font-size:1.4rem;font-weight:500}@media screen and (max-width: 48em){pn-proxio-productcard-pricelink pn-button{min-width:30rem}}pn-proxio-productcard-pricelink .pn-pricelink-vat{font-weight:400}";
+const pnProxioProductcardPricelinkCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-proxio-productcard-pricelink{align-self:center;display:flex;flex-direction:column;align-items:center;margin:2rem 1rem;gap:0.8rem;align-content:center;flex-wrap:wrap}@media screen and (max-width: 48em){pn-proxio-productcard-pricelink{margin:2.4rem 1rem}}pn-proxio-productcard-pricelink h3{font-size:2rem}pn-proxio-productcard-pricelink pn-button{min-width:17.3rem}pn-proxio-productcard-pricelink pn-button a .pn-button-content{font-size:1.4rem;font-weight:500}@media screen and (max-width: 48em){pn-proxio-productcard-pricelink pn-button{min-width:30rem}}pn-proxio-productcard-pricelink .pn-pricelink-vat{font-weight:400}";
 const PnProxioProductcardPricelinkStyle0 = pnProxioProductcardPricelinkCss;
 const PnProxioProductcardPricelink = class {

package/dist/cjs/pn-proxio-productcard_4.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-proxio-productcard.pn-proxio-productcard-description.pn-proxio-productcard-information.pn-proxio-productcard-pricelink.entry.cjs.js","mappings":"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","names":["h","Host","arrow_right"],"sources":["src/components/widgets/pn-proxio-productcard/pn-proxio-productcard.scss?tag=pn-proxio-productcard","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard.tsx","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-description.scss?tag=pn-proxio-productcard-description","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-description.tsx","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-information.scss?tag=pn-proxio-productcard-information","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-information.tsx","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-pricelink.scss?tag=pn-proxio-productcard-pricelink","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-pricelink.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n@import './pn-proxio-productcard-common.scss';\n\npn-proxio-productcard {\n .cardcontent {\n display: flex;\n flex-direction: row;\n border: solid 0.1rem $gray25;\n border-radius: 0.8rem;\n overflow: hidden;\n margin-left: auto;\n margin-right: auto;\n margin-bottom: 1.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n flex-direction: column;\n }\n }\n\n .carddetails {\n min-width: 70%;\n padding: 2.4rem 4.8rem;\n display: flex;\n gap: 0.8rem;\n flex-direction: column;\n\n @media screen and (max-width: $productcard-media-tablet) {\n gap: 1.6rem;\n margin-bottom: 0.8rem;\n }\n\n pn-illustration[slot='illustrationmobile'] {\n display: none;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin-top: 1.6rem;\n display: block;\n\n .pn-illustration {\n max-width: 8rem;\n height: 8rem;\n margin-left: auto;\n margin-right: auto;\n }\n }\n }\n }\n\n .cardcalltoactions {\n min-width: 30%;\n background-color: $blue25;\n\n pn-illustration[slot='illustration'] {\n @media screen and (max-width: $productcard-media-tablet) {\n display: none;\n }\n\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n max-width: 12rem;\n margin-left: auto;\n margin-right: auto;\n margin-top: 4rem;\n }\n }\n\n [slot='information'] {\n display: flex;\n gap: 1rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n flex-direction: column;\n gap: 1.6rem;\n }\n }\n\n [slot='uppertags'] {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n gap: 2rem;\n }\n\n [slot='bottomtags'] {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n gap: 2rem;\n margin: 0.8rem 0;\n }\n\n .heading {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n }\n\n [slot='title'] {\n text-decoration: underline;\n\n @media screen and (max-width: $productcard-media-tablet) {\n text-decoration: none;\n }\n }\n}\n","import { Component, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'pn-proxio-productcard',\n styleUrl: 'pn-proxio-productcard.scss',\n})\nexport class PnProxioProductcard {\n render() {\n return (\n <Host>\n <div class=\"cardcontent\">\n <div class=\"carddetails\">\n <slot name=\"illustrationmobile\" />\n <div class=\"heading\">\n <slot name=\"title\" />\n <slot name=\"uppertags\" />\n </div>\n <slot name=\"description\" />\n <slot name=\"information\" />\n <slot name=\"bottomtags\" />\n </div>\n <div class=\"cardcalltoactions\">\n <slot name=\"illustration\" />\n <slot name=\"pricelink\" />\n <slot name=\"insurance\" />\n </div>\n </div>\n </Host>\n );\n }\n}\n","@import '../../../globals/main.scss';\n\npn-proxio-productcard-description {\n h3 {\n font-size: 1.6rem;\n }\n\n ul {\n padding-left: 2.5rem;\n }\n\n li {\n font-size: 1.6rem;\n line-height: 2.2rem;\n }\n\n .highlight {\n color: #0aa85c;\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\n\n@Component({\n tag: 'pn-proxio-productcard-description',\n styleUrl: 'pn-proxio-productcard-description.scss',\n})\nexport class PnProxioProductcardDescription {\n @Prop() heading: string;\n @Prop() highlight: string;\n @Prop() description: string;\n @Prop({ mutable: true }) list: string[] = [];\n\n render() {\n return (\n <Host>\n {this.heading ? <h3>{this.heading}</h3> : null}\n {this.highlight ? <h3 class=\"highlight\">{this.highlight}</h3> : null}\n {this.description ? <span>{this.description}</span> : null}\n {this.list ? (\n <ul>\n {this.list.map(text => {\n return <li>{text}</li>;\n })}\n </ul>\n ) : null}\n </Host>\n );\n }\n}\n","@import '../../../globals/main.scss';\n\npn-proxio-productcard-information {\n p.cardinfocontent-title {\n margin-bottom: 0.4rem;\n }\n\n p strong.cardinfocontent-label {\n font-size: 1.4rem;\n font-weight: 500;\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\nimport { ProductGenericItem, ProductWeightGroupListItem } from '../pn-proxio-pricegroup/types';\n\n@Component({\n tag: 'pn-proxio-productcard-information',\n styleUrl: 'pn-proxio-productcard-information.scss',\n})\nexport class PnProxioProductcardInformation {\n @Prop() label: string;\n @Prop() information: ProductGenericItem[] = [];\n\n render() {\n return (\n <Host>\n <div class=\"cardinfocontent\">\n {this.information && this.information.length > 0 && this.label ? (\n <div class=\"cardinfocontent-item\">\n {this.label ? (\n <p class=\"cardinfocontent-title\">\n <strong>{this.label}</strong>\n </p>\n ) : null}\n {this.information.map(item =>\n item ? (\n <p>\n <strong class=\"cardinfocontent-label\">{item.item1}:</strong> {item.item2}\n </p>\n ) : null,\n )}\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n","@import '../../../globals/main.scss';\n@import './pn-proxio-productcard-common.scss';\n\npn-proxio-productcard-pricelink {\n align-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 2rem 1rem;\n gap: 0.8rem;\n align-content: center;\n flex-wrap: wrap;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin: 2.4rem 1rem;\n }\n\n h3 {\n font-size: 2rem;\n }\n\n pn-button {\n min-width: 17.3rem;\n\n a .pn-button-content {\n font-size: 1.4rem;\n font-weight: 500;\n }\n\n @media screen and (max-width: $productcard-media-tablet) {\n min-width: 30rem;\n }\n }\n\n .pn-pricelink-vat {\n font-weight: 400;\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\nimport { arrow_right } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-proxio-productcard-pricelink',\n styleUrl: 'pn-proxio-productcard-pricelink.scss',\n})\nexport class PnProxioProductcardPricelink {\n @Prop() price: string;\n @Prop() vatText: string = '';\n @Prop() link: string;\n @Prop() linktext: string;\n\n render() {\n return this.link && this.linktext ? (\n <Host>\n {this.price ? (\n <h3>\n {this.price} <span class=\"pn-pricelink-vat\">{this.vatText}</span>\n </h3>\n ) : null}\n <pn-button small=\"true\" icon={arrow_right} appearance=\"light\" href={this.link} target=\"_blank\" rel=\"noopener nofollower noreferrer\">\n {this.linktext}\n </pn-button>\n </Host>\n ) : null;\n }\n}\n"],"version":3}
1	+ {"file":"pn-proxio-productcard.pn-proxio-productcard-description.pn-proxio-productcard-information.pn-proxio-productcard-pricelink.entry.cjs.js","mappings":"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","names":["h","Host","arrow_right"],"sources":["src/components/widgets/pn-proxio-productcard/pn-proxio-productcard.scss?tag=pn-proxio-productcard","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard.tsx","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-description.scss?tag=pn-proxio-productcard-description","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-description.tsx","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-information.scss?tag=pn-proxio-productcard-information","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-information.tsx","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-pricelink.scss?tag=pn-proxio-productcard-pricelink","src/components/widgets/pn-proxio-productcard/pn-proxio-productcard-pricelink.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n@import './pn-proxio-productcard-common.scss';\n\npn-proxio-productcard {\n .cardcontent {\n display: flex;\n flex-direction: row;\n border: solid 0.1rem $gray25;\n border-radius: 0.8rem;\n overflow: hidden;\n margin-left: auto;\n margin-right: auto;\n margin-bottom: 1.6rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n flex-direction: column;\n }\n }\n\n .carddetails {\n min-width: 70%;\n padding: 2.4rem 4.8rem;\n display: flex;\n gap: 0.8rem;\n flex-direction: column;\n\n @media screen and (max-width: $productcard-media-tablet) {\n gap: 1.6rem;\n margin-bottom: 0.8rem;\n }\n\n pn-illustration[slot='illustrationmobile'] {\n display: none;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin-top: 1.6rem;\n display: block;\n\n .pn-illustration {\n max-width: 8rem;\n height: 8rem;\n margin-left: auto;\n margin-right: auto;\n }\n }\n }\n }\n\n .cardcalltoactions {\n min-width: 30%;\n background-color: $blue25;\n\n pn-illustration[slot='illustration'] {\n @media screen and (max-width: $productcard-media-tablet) {\n display: none;\n }\n\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n max-width: 12rem;\n margin-left: auto;\n margin-right: auto;\n margin-top: 4rem;\n }\n }\n\n [slot='information'] {\n display: flex;\n gap: 1rem;\n\n @media screen and (max-width: $productcard-media-tablet) {\n flex-direction: column;\n gap: 1.6rem;\n }\n }\n\n [slot='uppertags'] {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n gap: 2rem;\n }\n\n [slot='bottomtags'] {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: flex-start;\n align-items: center;\n gap: 2rem;\n margin: 0.8rem 0;\n }\n\n .heading {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n }\n\n [slot='title'] {\n text-decoration: underline;\n\n @media screen and (max-width: $productcard-media-tablet) {\n text-decoration: none;\n }\n }\n}\n","import { Component, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'pn-proxio-productcard',\n styleUrl: 'pn-proxio-productcard.scss',\n})\nexport class PnProxioProductcard {\n render() {\n return (\n <Host>\n <div class=\"cardcontent\">\n <div class=\"carddetails\">\n <slot name=\"illustrationmobile\" />\n <div class=\"heading\">\n <slot name=\"title\" />\n <slot name=\"uppertags\" />\n </div>\n <slot name=\"description\" />\n <slot name=\"information\" />\n <slot name=\"bottomtags\" />\n </div>\n <div class=\"cardcalltoactions\">\n <slot name=\"illustration\" />\n <slot name=\"pricelink\" />\n <slot name=\"insurance\" />\n </div>\n </div>\n </Host>\n );\n }\n}\n","@import '../../../globals/main.scss';\n\npn-proxio-productcard-description {\n h3 {\n font-size: 1.6rem;\n }\n\n ul {\n padding-left: 2.5rem;\n }\n\n li {\n font-size: 1.6rem;\n line-height: 2.2rem;\n }\n\n .highlight {\n color: #0aa85c;\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\n\n@Component({\n tag: 'pn-proxio-productcard-description',\n styleUrl: 'pn-proxio-productcard-description.scss',\n})\nexport class PnProxioProductcardDescription {\n @Prop() heading: string;\n @Prop() highlight: string;\n @Prop() description: string;\n @Prop({ mutable: true }) list: string[] = [];\n\n render() {\n return (\n <Host>\n {this.heading ? <h3>{this.heading}</h3> : null}\n {this.highlight ? <h3 class=\"highlight\">{this.highlight}</h3> : null}\n {this.description ? <span>{this.description}</span> : null}\n {this.list ? (\n <ul>\n {this.list.map(text => {\n return <li>{text}</li>;\n })}\n </ul>\n ) : null}\n </Host>\n );\n }\n}\n","@import '../../../globals/main.scss';\n\npn-proxio-productcard-information {\n p.cardinfocontent-title {\n margin-bottom: 0.4rem;\n }\n\n p strong.cardinfocontent-label {\n font-size: 1.4rem;\n font-weight: 500;\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\nimport { ProductGenericItem, ProductWeightGroupListItem } from '../pn-proxio-pricegroup/types';\n\n@Component({\n tag: 'pn-proxio-productcard-information',\n styleUrl: 'pn-proxio-productcard-information.scss',\n})\nexport class PnProxioProductcardInformation {\n @Prop() label: string;\n @Prop() information: ProductGenericItem[] = [];\n\n render() {\n return (\n <Host>\n <div class=\"cardinfocontent\">\n {this.information && this.information.length > 0 && this.label ? (\n <div class=\"cardinfocontent-item\">\n {this.label ? (\n <p class=\"cardinfocontent-title\">\n <strong>{this.label}</strong>\n </p>\n ) : null}\n {this.information.map(item =>\n item ? (\n <p>\n <strong class=\"cardinfocontent-label\">{item.item1}:</strong> {item.item2}\n </p>\n ) : null,\n )}\n </div>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n","@import '../../../globals/main.scss';\n@import './pn-proxio-productcard-common.scss';\n\npn-proxio-productcard-pricelink {\n align-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 2rem 1rem;\n gap: 0.8rem;\n align-content: center;\n flex-wrap: wrap;\n\n @media screen and (max-width: $productcard-media-tablet) {\n margin: 2.4rem 1rem;\n }\n\n h3 {\n font-size: 2rem;\n }\n\n pn-button {\n min-width: 17.3rem;\n\n a .pn-button-content {\n font-size: 1.4rem;\n font-weight: 500;\n }\n\n @media screen and (max-width: $productcard-media-tablet) {\n min-width: 30rem;\n }\n }\n\n .pn-pricelink-vat {\n font-weight: 400;\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\nimport { arrow_right } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n tag: 'pn-proxio-productcard-pricelink',\n styleUrl: 'pn-proxio-productcard-pricelink.scss',\n})\nexport class PnProxioProductcardPricelink {\n @Prop() price: string;\n @Prop() vatText: string = '';\n @Prop() link: string;\n @Prop() linktext: string;\n\n render() {\n return this.link && this.linktext ? (\n <Host>\n {this.price ? (\n <h3>\n {this.price} <span class=\"pn-pricelink-vat\">{this.vatText}</span>\n </h3>\n ) : null}\n <pn-button small=\"true\" icon={arrow_right} appearance=\"light\" href={this.link} target=\"_blank\" rel=\"noopener nofollower noreferrer\">\n {this.linktext}\n </pn-button>\n </Host>\n ) : null;\n }\n}\n"],"version":3}

package/dist/cjs/pn-quick-cta.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b02670c2.js');
+const index = require('./index-34e1c673.js');
-const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#f06365}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
+const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#f06365}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
 const PnQuickCtaStyle0 = pnQuickCtaCss;
 const PnQuickCta = class {

package/dist/cjs/pn-quick-cta.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-quick-cta.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,~~irDAAirD~~,CAAC;~~AACxsD~~,yBAAe,aAAa;;MCKf,UAAU;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAIA,iEAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7EA,gEAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3DA,mEAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $coral400;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-quick-cta.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,w2CAAw2C,CAAC;AAC/3C,yBAAe,aAAa;;MCKf,UAAU;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAIA,iEAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7EA,gEAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3DA,mEAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $coral400;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/pn-quote-card.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b02670c2.js');
+const index = require('./index-34e1c673.js');
-const pnQuoteCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quote-card .pn-quote-card__container{margin:0 auto;display:flex;flex-direction:row;min-height:262px;padding:0 2.4rem}pn-quote-card .pn-quote-card__quote__container{padding:0 3.2rem}pn-quote-card .pn-quote-card__quote{position:relative;font-weight:400;font-size:2rem;line-height:140%;margin:0}pn-quote-card .pn-quote-card__quote svg{position:absolute;left:-3.2rem;top:0.2rem}pn-quote-card .pn-quote-card__reference__container{display:flex;flex-direction:row;justify-content:flex-start;gap:1.6rem;align-items:center}pn-quote-card .pn-quote-card__reference__name{display:block;font-weight:400;font-size:2.4rem;line-height:2.9rem}pn-quote-card .pn-quote-card__reference__occupation{display:block;font-weight:400;font-size:1.4rem;line-height:1.7rem}pn-quote-card [slot=illustration]{padding:0}pn-quote-card [slot=illustration-big]{padding:0.8rem 0}pn-quote-card [slot=illustration],pn-quote-card [slot=illustration-big]{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture,pn-quote-card [slot=illustration-big] picture{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture img,pn-quote-card [slot=illustration-big] picture img{clip-path:circle(50%);max-width:unset}pn-quote-card [slot=horizontal-line],pn-quote-card [slot=vertical-line]{display:flex}pn-quote-card[data-line-color=white] .pn-quote-card__section{background-color:#005d92;color:#ffffff}pn-quote-card[data-line-color=white] .pn-line-shape__line,pn-quote-card[data-line-color=white] .pn-line-shape__dot{border-color:#ffffff;background-color:#ffffff}pn-quote-card[data-line-color=white] .pn-quote-card__quote svg>path{fill:#ffffff}pn-quote-card[data-line-color=blue] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue] .pn-line-shape__line,pn-quote-card[data-line-color=blue] .pn-line-shape__dot{border-color:#00a0d6;background-color:#00a0d6}pn-quote-card[data-line-color=blue] .pn-quote-card__quote svg>path{fill:#00a0d6}pn-quote-card[data-line-color=blue900] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue900] .pn-line-shape__line,pn-quote-card[data-line-color=blue900] .pn-line-shape__dot{border-color:#0d234b;background-color:#0d234b}pn-quote-card[data-line-color=blue900] .pn-quote-card__quote svg>path{fill:#0d234b}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__section{border-radius:2.4rem}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__container{padding:2.4rem}pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:100%;margin:0 auto}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:70%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:60%}}pn-quote-card[data-card-style=standalone] .pn-quote-card__container{min-height:unset;padding:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__container{padding:0 2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{display:flex;flex-direction:column;justify-content:space-between;gap:3.2rem;padding:2.4rem 1.6rem 1.6rem 1.6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{padding:2.4rem 3.2rem 1.6rem 3.2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote svg{display:block;margin-bottom:0.8rem;position:relative;top:0;left:0}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:6rem;width:6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:9rem;width:9rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__large-photo{display:none}pn-quote-card[data-card-style=combo] .pn-quote-card__section{width:100%;margin:0 auto;padding-top:4rem;padding-bottom:4rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-bottom:0}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-top:10rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__container{min-height:10rem;padding-bottom:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:90%;width:100%}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:768px;width:100%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1140px;width:100%;padding:0 5.6rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1440px;width:100%;padding:0 12rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-bottom:0;padding-left:0;padding-right:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-left:2.4rem;padding-right:2.4rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2rem;padding-left:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-0.8rem;top:0.2rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0;top:0.4rem;scale:1.3}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:0;font-size:3.2rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-4.8rem;top:1rem;scale:1.4}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:3.8rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-6.4rem;top:1.6rem;scale:1.8}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__container{flex-direction:row-reverse}pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:6rem;max-height:6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:10rem;max-height:10rem}}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] [slot=illustration]{display:none}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference{text-align:right}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{display:block;font-size:1.4rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:1.6rem}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:2rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:3.2rem;margin-bottom:1rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{display:block;font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.4rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.6rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:none}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{width:18rem;height:18rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big] picture>img{width:18rem;height:18rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{position:relative;z-index:1;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]>picture>img{width:24rem;height:24rem}}";
+const pnQuoteCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-quote-card .pn-quote-card__container{margin:0 auto;display:flex;flex-direction:row;min-height:262px;padding:0 2.4rem}pn-quote-card .pn-quote-card__quote__container{padding:0 3.2rem}pn-quote-card .pn-quote-card__quote{position:relative;font-weight:400;font-size:2rem;line-height:140%;margin:0}pn-quote-card .pn-quote-card__quote svg{position:absolute;left:-3.2rem;top:0.2rem}pn-quote-card .pn-quote-card__reference__container{display:flex;flex-direction:row;justify-content:flex-start;gap:1.6rem;align-items:center}pn-quote-card .pn-quote-card__reference__name{display:block;font-weight:400;font-size:2.4rem;line-height:2.9rem}pn-quote-card .pn-quote-card__reference__occupation{display:block;font-weight:400;font-size:1.4rem;line-height:1.7rem}pn-quote-card [slot=illustration]{padding:0}pn-quote-card [slot=illustration-big]{padding:0.8rem 0}pn-quote-card [slot=illustration],pn-quote-card [slot=illustration-big]{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture,pn-quote-card [slot=illustration-big] picture{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture img,pn-quote-card [slot=illustration-big] picture img{clip-path:circle(50%);max-width:unset}pn-quote-card [slot=horizontal-line],pn-quote-card [slot=vertical-line]{display:flex}pn-quote-card[data-line-color=white] .pn-quote-card__section{background-color:#005d92;color:#ffffff}pn-quote-card[data-line-color=white] .pn-line-shape__line,pn-quote-card[data-line-color=white] .pn-line-shape__dot{border-color:#ffffff;background-color:#ffffff}pn-quote-card[data-line-color=white] .pn-quote-card__quote svg>path{fill:#ffffff}pn-quote-card[data-line-color=blue] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue] .pn-line-shape__line,pn-quote-card[data-line-color=blue] .pn-line-shape__dot{border-color:#00a0d6;background-color:#00a0d6}pn-quote-card[data-line-color=blue] .pn-quote-card__quote svg>path{fill:#00a0d6}pn-quote-card[data-line-color=blue900] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue900] .pn-line-shape__line,pn-quote-card[data-line-color=blue900] .pn-line-shape__dot{border-color:#0d234b;background-color:#0d234b}pn-quote-card[data-line-color=blue900] .pn-quote-card__quote svg>path{fill:#0d234b}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__section{border-radius:2.4rem}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__container{padding:2.4rem}pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:100%;margin:0 auto}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:70%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:60%}}pn-quote-card[data-card-style=standalone] .pn-quote-card__container{min-height:unset;padding:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__container{padding:0 2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{display:flex;flex-direction:column;justify-content:space-between;gap:3.2rem;padding:2.4rem 1.6rem 1.6rem 1.6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{padding:2.4rem 3.2rem 1.6rem 3.2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote svg{display:block;margin-bottom:0.8rem;position:relative;top:0;left:0}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:6rem;width:6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:9rem;width:9rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__large-photo{display:none}pn-quote-card[data-card-style=combo] .pn-quote-card__section{width:100%;margin:0 auto;padding-top:4rem;padding-bottom:4rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-bottom:0}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-top:10rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__container{min-height:10rem;padding-bottom:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:90%;width:100%}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:768px;width:100%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1140px;width:100%;padding:0 5.6rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1440px;width:100%;padding:0 12rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-bottom:0;padding-left:0;padding-right:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-left:2.4rem;padding-right:2.4rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2rem;padding-left:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-0.8rem;top:0.2rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0;top:0.4rem;scale:1.3}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:0;font-size:3.2rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-4.8rem;top:1rem;scale:1.4}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:3.8rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-6.4rem;top:1.6rem;scale:1.8}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__container{flex-direction:row-reverse}pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:6rem;max-height:6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:10rem;max-height:10rem}}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] [slot=illustration]{display:none}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference{text-align:right}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{display:block;font-size:1.4rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:1.6rem}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:2rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:3.2rem;margin-bottom:1rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{display:block;font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.4rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.6rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:none}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{width:18rem;height:18rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big] picture>img{width:18rem;height:18rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{position:relative;z-index:1;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]>picture>img{width:24rem;height:24rem}}";
 const PnQuoteCardStyle0 = pnQuoteCardCss;
 const PnQuoteCard = class {

package/dist/cjs/pn-quote-card.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-quote-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,gvSAAgvS,CAAC;AACxwS,0BAAe,cAAc;;MCKhB,WAAW;;;qBAGE,IAAI;oBACL,IAAI;0BACE,IAAI;;;IACjC,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,wBAAwB,IACjCA,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,mEAAM,IAAI,EAAC,eAAe,QAAS,EACnCA,kEAAK,KAAK,EAAC,iCAAiC,IAC1CA,yEAAY,KAAK,EAAC,sBAAsB,IACtCA,kEAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC5FA,mEACE,CAAC,EAAC,2NAA2N,EAC7N,IAAI,EAAC,OAAO,GACZ,CACE,EAEL,IAAI,CAAC,KAAK,CACA,EAEbA,mEAAM,IAAI,EAAC,iBAAiB,GAAQ,EACpCA,kEAAK,KAAK,EAAC,qCAAqC,IAC9CA,mEAAM,IAAI,EAAC,cAAc,GAAG,EAC5BA,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,mEAAM,KAAK,EAAC,gCAAgC,IAAE,IAAI,CAAC,IAAI,CAAQ,EAC/DA,mEAAM,KAAK,EAAC,sCAAsC,IAAE,IAAI,CAAC,UAAU,CAAQ,CACvE,CACF,CACF,EACNA,kEAAK,KAAK,EAAC,4BAA4B,IACrCA,mEAAM,IAAI,EAAC,kBAAkB,GAAG,CAC5B,CACF,CACF,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cards/pn-quote-card/pn-quote-card.scss?tag=pn-quote-card","src/components/cards/pn-quote-card/pn-quote-card.tsx"],"sourcesContent":["@import '../../../globals/main';\n\npn-quote-card {\n .pn-quote-card__section {\n }\n\n .pn-quote-card__container {\n margin: 0 auto;\n display: flex;\n flex-direction: row;\n\n min-height: 262px;\n padding: 0 2.4rem;\n }\n\n .pn-quote-card__quote__container {\n padding: 0 3.2rem;\n }\n\n .pn-quote-card__quote {\n position: relative;\n font-weight: 400;\n font-size: 2rem;\n line-height: 140%;\n margin: 0;\n\n svg {\n position: absolute;\n left: -3.2rem;\n top: 0.2rem;\n }\n }\n\n .pn-quote-card__reference__container {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n gap: 1.6rem;\n\n align-items: center;\n }\n\n .pn-quote-card__reference {\n }\n\n .pn-quote-card__reference__name {\n display: block;\n font-weight: 400;\n font-size: 2.4rem;\n line-height: 2.9rem;\n }\n\n .pn-quote-card__reference__occupation {\n display: block;\n font-weight: 400;\n font-size: 1.4rem;\n line-height: 1.7rem;\n }\n\n [slot='illustration'] {\n padding: 0;\n }\n\n [slot='illustration-big'] {\n padding: 0.8rem 0;\n }\n\n [slot='illustration'],\n [slot='illustration-big'] {\n aspect-ratio: 1/1;\n\n picture {\n aspect-ratio: 1 / 1;\n img {\n clip-path: circle(50%);\n max-width: unset;\n }\n }\n }\n}\n\n//line orientation\n\npn-quote-card {\n [slot='horizontal-line'],\n [slot='vertical-line'] {\n display: flex;\n }\n}\n\n//Colors\npn-quote-card[data-line-color='white'] {\n .pn-quote-card__section {\n background-color: $blue700;\n color: $white;\n }\n\n .pn-line-shape__line,\n .pn-line-shape__dot {\n border-color: $white;\n background-color: $white;\n }\n\n .pn-quote-card__quote {\n svg > path {\n fill: $white;\n }\n }\n}\n\npn-quote-card[data-line-color='blue'] {\n .pn-quote-card__section {\n background-color: $white;\n }\n\n .pn-line-shape__line,\n .pn-line-shape__dot {\n border-color: $blue400;\n background-color: $blue400;\n }\n\n .pn-quote-card__quote {\n svg > path {\n fill: $blue400;\n }\n }\n}\n\npn-quote-card[data-line-color='blue900'] {\n .pn-quote-card__section {\n background-color: $white;\n }\n\n .pn-line-shape__line,\n .pn-line-shape__dot {\n border-color: $blue900;\n background-color: $blue900;\n }\n\n .pn-quote-card__quote {\n svg > path {\n fill: $blue900;\n }\n }\n}\n\n//layouts\n\npn-quote-card[data-card-style='standalone'] {\n &[data-line-color='white'] {\n .pn-quote-card__section {\n border-radius: 2.4rem;\n }\n\n .pn-quote-card__container {\n padding: 2.4rem;\n }\n }\n .pn-quote-card__section {\n max-width: 100%;\n margin: 0 auto;\n\n @media screen and (min-width: $min-width-lg) {\n max-width: 70%;\n }\n @media screen and (min-width: $min-width-xl) {\n max-width: 60%;\n }\n }\n\n .pn-quote-card__container {\n min-height: unset;\n padding: 0;\n\n @media screen and (min-width: $min-width-md) {\n padding: 0 2.4rem;\n }\n }\n\n .pn-quote-card__quote__container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 3.2rem;\n padding: 2.4rem 1.6rem 1.6rem 1.6rem;\n\n @media screen and (min-width: $min-width-md) {\n padding: 2.4rem 3.2rem 1.6rem 3.2rem;\n }\n }\n\n .pn-quote-card__quote {\n font-size: 1.6rem;\n\n @media screen and (min-width: $min-width-lg) {\n font-size: 2rem;\n }\n\n svg {\n display: block;\n margin-bottom: 0.8rem;\n position: relative;\n top: 0;\n left: 0;\n }\n }\n\n .pn-quote-card__reference__container {\n [slot='illustration'] {\n picture {\n img {\n height: 6rem;\n width: 6rem;\n }\n }\n }\n @media screen and (min-width: $min-width-lg) {\n [slot='illustration'] {\n picture {\n img {\n height: 9rem;\n width: 9rem;\n }\n }\n }\n }\n }\n\n .pn-quote-card__reference__name {\n font-size: 1.6rem;\n @media screen and (min-width: $min-width-lg) {\n font-size: 2.4rem;\n }\n }\n\n .pn-quote-card__reference__occupation {\n font-size: 1.2rem;\n @media screen and (min-width: $min-width-lg) {\n font-size: 1.4rem;\n }\n }\n\n .pn-quote-card__large-photo {\n display: none;\n }\n}\n\npn-quote-card[data-card-style='combo'] {\n .pn-quote-card__section {\n width: 100%;\n margin: 0 auto;\n padding-top: 4rem;\n padding-bottom: 4rem;\n @media screen and (min-width: $min-width-lg) {\n padding-bottom: 0;\n }\n\n @media screen and (min-width: $min-width-xl) {\n padding-top: 10rem;\n }\n }\n\n .pn-quote-card__container {\n min-height: 10rem;\n padding-bottom: 0;\n\n @media screen and (min-width: $min-width-md) {\n max-width: 90%;\n width: 100%;\n }\n\n @media screen and (min-width: $min-width-lg) {\n max-width: $min-width-md;\n width: 100%;\n }\n @media screen and (min-width: $min-width-xl) {\n max-width: $max-width-xl;\n width: 100%;\n padding: 0 5.6rem;\n }\n @media screen and (min-width: $min-width-xxl) {\n max-width: $max-width-xxl;\n width: 100%;\n padding: 0 12rem;\n }\n }\n\n .pn-quote-card__quote__container {\n padding-bottom: 0;\n padding-left: 0;\n padding-right: 0;\n\n @media screen and (min-width: $min-width-md) {\n padding-left: 2.4rem;\n padding-right: 2.4rem;\n }\n }\n\n .pn-quote-card__quote {\n font-size: 2rem;\n padding-left: 2.4rem;\n svg {\n left: -0.8rem;\n top: 0.2rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n padding-left: 4rem;\n svg {\n left: 0;\n }\n }\n\n @media screen and (min-width: $min-width-lg) {\n font-size: 2.4rem;\n svg {\n left: 0;\n top: 0.4rem;\n scale: 1.3;\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n padding-left: 0;\n font-size: 3.2rem;\n svg {\n left: -4.8rem;\n top: 1rem;\n scale: 1.4;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 3.8rem;\n svg {\n left: -6.4rem;\n top: 1.6rem;\n scale: 1.8;\n }\n }\n }\n\n .pn-quote-card__reference__container {\n flex-direction: row-reverse;\n }\n\n [slot='illustration'] {\n picture > img {\n max-width: 6rem;\n max-height: 6rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n picture > img {\n max-width: 10rem;\n max-height: 10rem;\n }\n }\n\n @media screen and (min-width: $max-width-xl) {\n display: none;\n }\n }\n\n .pn-quote-card__reference {\n text-align: right;\n }\n\n .pn-quote-card__reference__name {\n display: block;\n font-size: 1.4rem;\n @media screen and (min-width: $min-width-md) {\n font-size: 1.6rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n font-size: 2rem;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 3.2rem;\n margin-bottom: 1rem;\n }\n }\n\n .pn-quote-card__reference__occupation {\n display: block;\n\n font-size: 1.2rem;\n @media screen and (min-width: $min-width-lg) {\n font-size: 1.4rem;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 1.6rem;\n }\n }\n\n .pn-quote-card__large-photo {\n display: none;\n\n @media screen and (min-width: $max-width-xl) {\n display: block;\n\n & > [slot='illustration-big'] {\n width: 18rem;\n height: 18rem;\n & picture > img {\n width: 18rem;\n height: 18rem;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n display: block;\n width: 24rem;\n height: 24rem;\n & > [slot='illustration-big'] {\n position: relative;\n z-index: 1;\n width: 24rem;\n height: 24rem;\n\n & > picture > img {\n width: 24rem;\n height: 24rem;\n }\n }\n }\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quote-card',\n styleUrl: 'pn-quote-card.scss',\n})\nexport class PnQuoteCard {\n @Element() hostElement: HTMLElement;\n //props\n @Prop() quote: string = null;\n @Prop() name: string = null;\n @Prop() occupation: string = null;\n render() {\n return (\n <Host>\n <div class=\"pn-quote-card__section\">\n <div class=\"pn-quote-card__container\">\n <slot name=\"vertical-line\"> </slot>\n <div class=\"pn-quote-card__quote__container\">\n <blockquote class=\"pn-quote-card__quote\">\n <svg width=\"25\" height=\"18\" viewBox=\"0 0 25 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M10.483 0V7.391C10.483 13.095 6.752 16.961 1.5 18L0.505 15.849C2.937 14.932 4.5 12.211 4.5 10H0.5V0H10.483ZM24.5 0V7.391C24.5 13.095 20.752 16.962 15.5 18L14.504 15.849C16.937 14.932 18.5 12.211 18.5 10H14.517V0H24.5Z\"\n fill=\"white\"\n />\n </svg>\n\n {this.quote}\n </blockquote>\n\n <slot name=\"horizontal-line\"></slot>\n <div class=\"pn-quote-card__reference__container\">\n <slot name=\"illustration\" />\n <div class=\"pn-quote-card__reference\">\n <span class=\"pn-quote-card__reference__name\">{this.name}</span>\n <span class=\"pn-quote-card__reference__occupation\">{this.occupation}</span>\n </div>\n </div>\n </div>\n <div class=\"pn-quote-card__large-photo\">\n <slot name=\"illustration-big\" />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-quote-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,u6RAAu6R,CAAC;AAC/7R,0BAAe,cAAc;;MCKhB,WAAW;;;qBAGE,IAAI;oBACL,IAAI;0BACE,IAAI;;;IACjC,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,wBAAwB,IACjCA,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,mEAAM,IAAI,EAAC,eAAe,QAAS,EACnCA,kEAAK,KAAK,EAAC,iCAAiC,IAC1CA,yEAAY,KAAK,EAAC,sBAAsB,IACtCA,kEAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC5FA,mEACE,CAAC,EAAC,2NAA2N,EAC7N,IAAI,EAAC,OAAO,GACZ,CACE,EAEL,IAAI,CAAC,KAAK,CACA,EAEbA,mEAAM,IAAI,EAAC,iBAAiB,GAAQ,EACpCA,kEAAK,KAAK,EAAC,qCAAqC,IAC9CA,mEAAM,IAAI,EAAC,cAAc,GAAG,EAC5BA,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,mEAAM,KAAK,EAAC,gCAAgC,IAAE,IAAI,CAAC,IAAI,CAAQ,EAC/DA,mEAAM,KAAK,EAAC,sCAAsC,IAAE,IAAI,CAAC,UAAU,CAAQ,CACvE,CACF,CACF,EACNA,kEAAK,KAAK,EAAC,4BAA4B,IACrCA,mEAAM,IAAI,EAAC,kBAAkB,GAAG,CAC5B,CACF,CACF,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cards/pn-quote-card/pn-quote-card.scss?tag=pn-quote-card","src/components/cards/pn-quote-card/pn-quote-card.tsx"],"sourcesContent":["@import '../../../globals/main';\n\npn-quote-card {\n .pn-quote-card__section {\n }\n\n .pn-quote-card__container {\n margin: 0 auto;\n display: flex;\n flex-direction: row;\n\n min-height: 262px;\n padding: 0 2.4rem;\n }\n\n .pn-quote-card__quote__container {\n padding: 0 3.2rem;\n }\n\n .pn-quote-card__quote {\n position: relative;\n font-weight: 400;\n font-size: 2rem;\n line-height: 140%;\n margin: 0;\n\n svg {\n position: absolute;\n left: -3.2rem;\n top: 0.2rem;\n }\n }\n\n .pn-quote-card__reference__container {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n gap: 1.6rem;\n\n align-items: center;\n }\n\n .pn-quote-card__reference {\n }\n\n .pn-quote-card__reference__name {\n display: block;\n font-weight: 400;\n font-size: 2.4rem;\n line-height: 2.9rem;\n }\n\n .pn-quote-card__reference__occupation {\n display: block;\n font-weight: 400;\n font-size: 1.4rem;\n line-height: 1.7rem;\n }\n\n [slot='illustration'] {\n padding: 0;\n }\n\n [slot='illustration-big'] {\n padding: 0.8rem 0;\n }\n\n [slot='illustration'],\n [slot='illustration-big'] {\n aspect-ratio: 1/1;\n\n picture {\n aspect-ratio: 1 / 1;\n img {\n clip-path: circle(50%);\n max-width: unset;\n }\n }\n }\n}\n\n//line orientation\n\npn-quote-card {\n [slot='horizontal-line'],\n [slot='vertical-line'] {\n display: flex;\n }\n}\n\n//Colors\npn-quote-card[data-line-color='white'] {\n .pn-quote-card__section {\n background-color: $blue700;\n color: $white;\n }\n\n .pn-line-shape__line,\n .pn-line-shape__dot {\n border-color: $white;\n background-color: $white;\n }\n\n .pn-quote-card__quote {\n svg > path {\n fill: $white;\n }\n }\n}\n\npn-quote-card[data-line-color='blue'] {\n .pn-quote-card__section {\n background-color: $white;\n }\n\n .pn-line-shape__line,\n .pn-line-shape__dot {\n border-color: $blue400;\n background-color: $blue400;\n }\n\n .pn-quote-card__quote {\n svg > path {\n fill: $blue400;\n }\n }\n}\n\npn-quote-card[data-line-color='blue900'] {\n .pn-quote-card__section {\n background-color: $white;\n }\n\n .pn-line-shape__line,\n .pn-line-shape__dot {\n border-color: $blue900;\n background-color: $blue900;\n }\n\n .pn-quote-card__quote {\n svg > path {\n fill: $blue900;\n }\n }\n}\n\n//layouts\n\npn-quote-card[data-card-style='standalone'] {\n &[data-line-color='white'] {\n .pn-quote-card__section {\n border-radius: 2.4rem;\n }\n\n .pn-quote-card__container {\n padding: 2.4rem;\n }\n }\n .pn-quote-card__section {\n max-width: 100%;\n margin: 0 auto;\n\n @media screen and (min-width: $min-width-lg) {\n max-width: 70%;\n }\n @media screen and (min-width: $min-width-xl) {\n max-width: 60%;\n }\n }\n\n .pn-quote-card__container {\n min-height: unset;\n padding: 0;\n\n @media screen and (min-width: $min-width-md) {\n padding: 0 2.4rem;\n }\n }\n\n .pn-quote-card__quote__container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 3.2rem;\n padding: 2.4rem 1.6rem 1.6rem 1.6rem;\n\n @media screen and (min-width: $min-width-md) {\n padding: 2.4rem 3.2rem 1.6rem 3.2rem;\n }\n }\n\n .pn-quote-card__quote {\n font-size: 1.6rem;\n\n @media screen and (min-width: $min-width-lg) {\n font-size: 2rem;\n }\n\n svg {\n display: block;\n margin-bottom: 0.8rem;\n position: relative;\n top: 0;\n left: 0;\n }\n }\n\n .pn-quote-card__reference__container {\n [slot='illustration'] {\n picture {\n img {\n height: 6rem;\n width: 6rem;\n }\n }\n }\n @media screen and (min-width: $min-width-lg) {\n [slot='illustration'] {\n picture {\n img {\n height: 9rem;\n width: 9rem;\n }\n }\n }\n }\n }\n\n .pn-quote-card__reference__name {\n font-size: 1.6rem;\n @media screen and (min-width: $min-width-lg) {\n font-size: 2.4rem;\n }\n }\n\n .pn-quote-card__reference__occupation {\n font-size: 1.2rem;\n @media screen and (min-width: $min-width-lg) {\n font-size: 1.4rem;\n }\n }\n\n .pn-quote-card__large-photo {\n display: none;\n }\n}\n\npn-quote-card[data-card-style='combo'] {\n .pn-quote-card__section {\n width: 100%;\n margin: 0 auto;\n padding-top: 4rem;\n padding-bottom: 4rem;\n @media screen and (min-width: $min-width-lg) {\n padding-bottom: 0;\n }\n\n @media screen and (min-width: $min-width-xl) {\n padding-top: 10rem;\n }\n }\n\n .pn-quote-card__container {\n min-height: 10rem;\n padding-bottom: 0;\n\n @media screen and (min-width: $min-width-md) {\n max-width: 90%;\n width: 100%;\n }\n\n @media screen and (min-width: $min-width-lg) {\n max-width: $min-width-md;\n width: 100%;\n }\n @media screen and (min-width: $min-width-xl) {\n max-width: $max-width-xl;\n width: 100%;\n padding: 0 5.6rem;\n }\n @media screen and (min-width: $min-width-xxl) {\n max-width: $max-width-xxl;\n width: 100%;\n padding: 0 12rem;\n }\n }\n\n .pn-quote-card__quote__container {\n padding-bottom: 0;\n padding-left: 0;\n padding-right: 0;\n\n @media screen and (min-width: $min-width-md) {\n padding-left: 2.4rem;\n padding-right: 2.4rem;\n }\n }\n\n .pn-quote-card__quote {\n font-size: 2rem;\n padding-left: 2.4rem;\n svg {\n left: -0.8rem;\n top: 0.2rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n padding-left: 4rem;\n svg {\n left: 0;\n }\n }\n\n @media screen and (min-width: $min-width-lg) {\n font-size: 2.4rem;\n svg {\n left: 0;\n top: 0.4rem;\n scale: 1.3;\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n padding-left: 0;\n font-size: 3.2rem;\n svg {\n left: -4.8rem;\n top: 1rem;\n scale: 1.4;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 3.8rem;\n svg {\n left: -6.4rem;\n top: 1.6rem;\n scale: 1.8;\n }\n }\n }\n\n .pn-quote-card__reference__container {\n flex-direction: row-reverse;\n }\n\n [slot='illustration'] {\n picture > img {\n max-width: 6rem;\n max-height: 6rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n picture > img {\n max-width: 10rem;\n max-height: 10rem;\n }\n }\n\n @media screen and (min-width: $max-width-xl) {\n display: none;\n }\n }\n\n .pn-quote-card__reference {\n text-align: right;\n }\n\n .pn-quote-card__reference__name {\n display: block;\n font-size: 1.4rem;\n @media screen and (min-width: $min-width-md) {\n font-size: 1.6rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n font-size: 2rem;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 3.2rem;\n margin-bottom: 1rem;\n }\n }\n\n .pn-quote-card__reference__occupation {\n display: block;\n\n font-size: 1.2rem;\n @media screen and (min-width: $min-width-lg) {\n font-size: 1.4rem;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 1.6rem;\n }\n }\n\n .pn-quote-card__large-photo {\n display: none;\n\n @media screen and (min-width: $max-width-xl) {\n display: block;\n\n & > [slot='illustration-big'] {\n width: 18rem;\n height: 18rem;\n & picture > img {\n width: 18rem;\n height: 18rem;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n display: block;\n width: 24rem;\n height: 24rem;\n & > [slot='illustration-big'] {\n position: relative;\n z-index: 1;\n width: 24rem;\n height: 24rem;\n\n & > picture > img {\n width: 24rem;\n height: 24rem;\n }\n }\n }\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quote-card',\n styleUrl: 'pn-quote-card.scss',\n})\nexport class PnQuoteCard {\n @Element() hostElement: HTMLElement;\n //props\n @Prop() quote: string = null;\n @Prop() name: string = null;\n @Prop() occupation: string = null;\n render() {\n return (\n <Host>\n <div class=\"pn-quote-card__section\">\n <div class=\"pn-quote-card__container\">\n <slot name=\"vertical-line\"> </slot>\n <div class=\"pn-quote-card__quote__container\">\n <blockquote class=\"pn-quote-card__quote\">\n <svg width=\"25\" height=\"18\" viewBox=\"0 0 25 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M10.483 0V7.391C10.483 13.095 6.752 16.961 1.5 18L0.505 15.849C2.937 14.932 4.5 12.211 4.5 10H0.5V0H10.483ZM24.5 0V7.391C24.5 13.095 20.752 16.962 15.5 18L14.504 15.849C16.937 14.932 18.5 12.211 18.5 10H14.517V0H24.5Z\"\n fill=\"white\"\n />\n </svg>\n\n {this.quote}\n </blockquote>\n\n <slot name=\"horizontal-line\"></slot>\n <div class=\"pn-quote-card__reference__container\">\n <slot name=\"illustration\" />\n <div class=\"pn-quote-card__reference\">\n <span class=\"pn-quote-card__reference__name\">{this.name}</span>\n <span class=\"pn-quote-card__reference__occupation\">{this.occupation}</span>\n </div>\n </div>\n </div>\n <div class=\"pn-quote-card__large-photo\">\n <slot name=\"illustration-big\" />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/pn-scroll_2.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b02670c2.js');
+const index = require('./index-34e1c673.js');
 const v4 = require('./v4-9b297151.js');
 const pnScrollCss = "pn-scroll .scroll-wrapper{transition:all var(--transition-duration) ease-in-out 250ms}pn-scroll .scroll-wrapper.fade{opacity:0}pn-scroll .scroll-wrapper.fade.in-view{opacity:1}pn-scroll .scroll-wrapper.slide-up{transform:translateY(50px)}pn-scroll .scroll-wrapper.slide-up.in-view{transform:translateY(0)}";
@@ -96,7 +96,7 @@ const translations = {
     },
 };
-const pnVideoOverlayCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-video-overlay.pn-video-overlay--show-overlay{position:absolute;width:100%;height:100%;background:radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%)}pn-video-overlay button{position:absolute;bottom:8px;left:8px;display:flex;align-items:center;justify-content:center;border-radius:50%;padding:0;border:none;outline:none;cursor:pointer;background-color:transparent}@media screen and (min-width: 768px){pn-video-overlay button{bottom:16px;left:16px}}pn-video-overlay button:hover svg rect{fill:#003d5f}pn-video-overlay button:active svg rect{fill:#001c2c}pn-video-overlay button:focus,pn-video-overlay button:focus-visible{outline:2px solid #ffffff}pn-video-overlay button svg{scale:0.7}@media screen and (min-width: 768px){pn-video-overlay button svg{scale:1}}";
+const pnVideoOverlayCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-video-overlay.pn-video-overlay--show-overlay{position:absolute;width:100%;height:100%;background:radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%)}pn-video-overlay button{position:absolute;bottom:8px;left:8px;display:flex;align-items:center;justify-content:center;border-radius:50%;padding:0;border:none;outline:none;cursor:pointer;background-color:transparent}@media screen and (min-width: 768px){pn-video-overlay button{bottom:16px;left:16px}}pn-video-overlay button:hover svg rect{fill:#003d5f}pn-video-overlay button:active svg rect{fill:#001c2c}pn-video-overlay button:focus,pn-video-overlay button:focus-visible{outline:2px solid #ffffff}pn-video-overlay button svg{scale:0.7}@media screen and (min-width: 768px){pn-video-overlay button svg{scale:1}}";
 const PnVideoOverlayStyle0 = pnVideoOverlayCss;
 const PnVideoOverlay = class {

package/dist/cjs/pn-scroll_2.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-scroll.pn-video-overlay.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,WAAW,GAAG,mTAAmT,CAAC;AACxU,uBAAe,WAAW;;ACG1B,MAAM,sBAAsB,GAA6B;IACvD,IAAI,EAAE,IAAI;IACV,SAAS,EAAE,CAAC;IACZ,UAAU,EAAE,oBAAoB;CACjC,CAAC;AAEF,MAAM,SAAS,GAAG,uBAAuB,CAAC;MAM7B,QAAQ;;;+BAEiC,sBAAsB;gCACvC,eAAe;yCACN,GAAG;0BAChB,KAAK;;;sBAIV,IAAI;;;IAE9B,gBAAgB;QACd,OAAOA,KAAM,EAAE,CAAC;KACjB;IAED,kBAAkB,CAAC,OAAoC,EAAE,QAA+B,EAAE,cAAyB,EAAE,iBAA4B,EAAE,UAAoB;QACrK,OAAO,CAAC,OAAO,CAAC,KAAK;YACnB,IAAI,CAAC,UAAU,EAAE;gBACf,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE;oBACzB,iBAAiB,GAAG,KAAK,EAAE,QAAQ,CAAC,CAAC;oBACrC,OAAO;iBACR;gBACD,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;gBACtC,cAAc,GAAG,KAAK,EAAE,QAAQ,CAAC,CAAC;gBAClC,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;aAClC;iBAAM;gBACL,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;gBAC/D,IAAI,KAAK,CAAC,cAAc,EAAE;oBACxB,cAAc,GAAG,KAAK,EAAE,QAAQ,CAAC,CAAC;iBACnC;qBAAM;oBACL,iBAAiB,GAAG,KAAK,EAAE,QAAQ,CAAC,CAAC;iBACtC;aACF;SACF,CAAC,CAAC;KACJ;;IAGD,iBAAiB;QACf,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;KACvC;IAED,gBAAgB;QACd,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,UAAU,CAAC,EAC7H,IAAI,CAAC,eAAe,CACrB,CAAC;QACF,MAAM,eAAe,GAAG,QAAQ,CAAC,cAAc,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QAC9E,QAAQ,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;KACnC;IAED,MAAM;QACJ,QACEC,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAE,kBAAkB,IAAI,CAAC,gBAAgB,EAAE,EAAE,EAAE,EAAE,GAAG,SAAS,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,uBAAuB,EAAE,GAAG,IAAI,CAAC,yBAAyB,GAAG,EAAE,IAC/JA,mEAAM,IAAI,EAAC,iBAAiB,GAAG,CAC3B,CACD,EACP;KACH;;;;AC1EI,MAAM,YAAY,GAAG;IAC1B,EAAE,EAAE;QACF,SAAS,EAAE,yBAAyB;KACrC;IACD,EAAE,EAAE;QACF,SAAS,EAAE,qBAAqB;KACjC;IACD,EAAE,EAAE;QACF,SAAS,EAAE,iCAAiC;KAC7C;IACD,EAAE,EAAE;QACF,SAAS,EAAE,oCAAoC;KAChD;IACD,EAAE,EAAE;QACF,SAAS,EAAE,2BAA2B;KACvC;IACD,EAAE,EAAE;QACF,SAAS,EAAE,+BAA+B;KAC3C;IACD,EAAE,EAAE;QACF,UAAU,EAAE,qBAAqB;KAClC;IACD,EAAE,EAAE;QACF,UAAU,EAAE,qBAAqB;KAClC;IACD,EAAE,EAAE;QACF,UAAU,EAAE,qBAAqB;KAClC;CACF;;AC5BD,MAAM,iBAAiB,GAAG,2qCAA2qC,CAAC;AACtsC,6BAAe,iBAAiB;;MCOnB,cAAc;;;;wBAEE,IAAI;wBACH,KAAK;2BACF,KAAK;;;;IAG3B,gBAAgB,CAAqB;IAE9C,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,eAAe;QACb,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;YAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACtB;QACD,IAAI,IAAI,CAAC,QAAQ,IAAI,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YAChD,IAAI,CAAC,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SACzC;KACF;IAGD,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,sBAAsB,GAAG;QACvB,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;KAC9B,CAAC;IAEF,cAAc,GAAG;QACf,QACEA,iBAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC5FA,kBAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAC,SAAS,GAAG,EACtDA,kBACE,CAAC,EAAC,6dAA6d,EAC/d,IAAI,EAAC,OAAO,GACZ,EACFA,+BACY,SAAS,eACT,SAAS,EACnB,CAAC,EAAC,0YAA0Y,EAC5Y,IAAI,EAAC,OAAO,GACZ,EACFA,kBACE,CAAC,EAAC,mOAAmO,EACrO,IAAI,EAAC,OAAO,GACZ,CACE,EACN;KACH,CAAC;IAEF,eAAe,GAAG;QAChB,QACEA,iBAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,IAC5FA,kBAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAC,SAAS,GAAG,EACtDA,kBACE,CAAC,EAAC,6dAA6d,EAC/d,IAAI,EAAC,OAAO,GACZ,EACFA,kBACE,CAAC,EAAC,mOAAmO,EACrO,IAAI,EAAC,OAAO,GACZ,EACFA,+BACY,SAAS,eACT,SAAS,EACnB,CAAC,EAAC,ieAAie,EACne,IAAI,EAAC,OAAO,GACZ,EACFA,+BACY,SAAS,eACT,SAAS,EACnB,CAAC,EAAC,ieAAie,EACne,IAAI,EAAC,OAAO,GACZ,CACE,EACN;KACH,CAAC;IAEF,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,KAAK,EAAE,oBAAoB,IAAI,CAAC,WAAW,GAAG,gCAAgC,GAAG,EAAE,EAAE,IACzFD,qEAAQ,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAC,8BAA8B,gBAAa,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,sBAAsB,IAC/H,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE,GAAG,IAAI,CAAC,eAAe,EAAE,CACxD,CACJ,EACP;KACH;;;;;;;;;;","names":["uuidv4","h","Host"],"sources":["src/components/animation/pn-scroll/pn-scroll.scss?tag=pn-scroll","src/components/animation/pn-scroll/pn-scroll.tsx","src/components/animation/pn-play-on-scroll/pn-video-overlay/translations.ts","src/components/animation/pn-play-on-scroll/pn-video-overlay/pn-video-overlay.scss?tag=pn-video-overlay","src/components/animation/pn-play-on-scroll/pn-video-overlay/pn-video-overlay.tsx"],"sourcesContent":["pn-scroll {\n .scroll-wrapper {\n transition: all var(--transition-duration) ease-in-out 250ms;\n\n &.fade {\n opacity: 0;\n\n &.in-view {\n opacity: 1;\n }\n }\n\n &.slide-up {\n transform: translateY(50px);\n &.in-view {\n transform: translateY(0);\n }\n }\n\n &.slide-in {\n &.in-view {\n }\n }\n\n &.slide-out {\n &.in-view {\n }\n }\n }\n}\n","import { v4 as uuidv4 } from 'uuid';\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\nconst defaultObserverOptions: IntersectionObserverInit = {\n root: null,\n threshold: 0,\n rootMargin: '0px 0px -150px 0px',\n};\n\nconst SCROLL_ID = `pn-scroll-wrapper-id-`;\n\n@Component({\n tag: 'pn-scroll',\n styleUrl: 'pn-scroll.scss',\n})\nexport class PnScroll {\n @Element() hostElement: HTMLElement;\n @Prop() observerOptions: IntersectionObserverInit = defaultObserverOptions;\n @Prop() behaviourClasses: string = 'fade slide-up';\n @Prop() transitionDurationSeconds: number = 0.5;\n @Prop() shouldLoop?: boolean = false;\n @Prop() intersectFunc?: Function;\n @Prop() notIntersectFunc?: Function;\n\n @State() compId: string = null;\n\n generateUniqueId() {\n return uuidv4();\n }\n\n handleIntersection(entries: IntersectionObserverEntry[], observer?: IntersectionObserver, onIntersecting?: Function, onNotIntersecting?: Function, shouldLoop?: boolean) {\n entries.forEach(entry => {\n if (!shouldLoop) {\n if (!entry.isIntersecting) {\n onNotIntersecting?.(entry, observer);\n return;\n }\n entry.target.classList.add('in-view');\n onIntersecting?.(entry, observer);\n observer.unobserve(entry.target);\n } else {\n entry.target.classList.toggle('in-view', entry.isIntersecting);\n if (entry.isIntersecting) {\n onIntersecting?.(entry, observer);\n } else {\n onNotIntersecting?.(entry, observer);\n }\n }\n });\n }\n\n //on load, generate unique id for this wrapper\n componentWillLoad() {\n this.compId = this.generateUniqueId();\n }\n\n componentDidLoad() {\n const observer = new IntersectionObserver(\n (entries, observer) => this.handleIntersection(entries, observer, this.intersectFunc, this.notIntersectFunc, this.shouldLoop),\n this.observerOptions,\n );\n const objectToObserve = document.getElementById(`${SCROLL_ID}${this.compId}`);\n observer.observe(objectToObserve);\n }\n\n render() {\n return (\n <Host>\n <div class={`scroll-wrapper ${this.behaviourClasses}`} id={`${SCROLL_ID}${this.compId}`} style={{ '--transition-duration': `${this.transitionDurationSeconds}s` }}>\n <slot name=\"scroll-affected\" />\n </div>\n </Host>\n );\n }\n}\n","export const translations = {\n sv: {\n ariaLabel: 'Spela eller pausa video',\n },\n en: {\n ariaLabel: 'Play or pause video',\n },\n da: {\n ariaLabel: 'Afspil eller sæt video på pause',\n },\n no: {\n ariaLabel: 'Spill av eller sett video på pause',\n },\n fi: {\n ariaLabel: 'Toista tai keskeytä video',\n },\n de: {\n ariaLabel: 'Video abspielen oder anhalten',\n },\n zh: {\n sharelabel: 'Play or pause video',\n },\n it: {\n sharelabel: 'Play or pause video',\n },\n nl: {\n sharelabel: 'Play or pause video',\n },\n};\n","@import '../../../../globals/main';\n\npn-video-overlay {\n &.pn-video-overlay--show-overlay {\n position: absolute;\n width: 100%;\n height: 100%;\n background: radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%);\n }\n\n button {\n position: absolute;\n bottom: 8px;\n left: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n padding: 0;\n border: none;\n outline: none;\n cursor: pointer;\n background-color: transparent;\n\n @media screen and (min-width: $min-width-md) {\n bottom: 16px;\n left: 16px;\n }\n\n &:hover {\n svg rect {\n fill: darken(#005d92, 10%);\n }\n }\n\n &:active {\n svg rect {\n fill: darken(#005d92, 20%);\n }\n }\n\n &:focus,\n &:focus-visible {\n outline: 2px solid $white;\n }\n\n svg {\n scale: 0.7;\n @media screen and (min-width: $min-width-md) {\n scale: 1;\n }\n }\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { translations } from './translations';\n\n@Component({\n tag: 'pn-video-overlay',\n styleUrl: 'pn-video-overlay.scss',\n})\nexport class PnVideoOverlay {\n @Element() hostElement: HTMLElement;\n @Prop() language: string = 'en';\n @Prop() isPaused: boolean = false;\n @Prop() showOverlay: boolean = false;\n @State() i18n: any;\n\n @Event() playPauseClicked: EventEmitter<void>;\n\n componentWillLoad() {\n this.setTranslations();\n }\n\n setTranslations() {\n if (this.language === 'nb') {\n this.language = 'no';\n }\n if (this.language && translations[this.language]) {\n this.i18n = translations[this.language];\n }\n }\n\n @Watch('language')\n onLanguageChange() {\n this.setTranslations();\n }\n\n handlePlayPauseClicked = () => {\n this.playPauseClicked.emit();\n };\n\n renderPlayIcon = () => {\n return (\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"64\" height=\"64\" rx=\"32\" fill=\"#005D92\" />\n <path\n d=\"M8 32C8 18.7305 18.7305 8 32 8C38.6401 8 44.5751 10.6887 48.9432 15.0568C49.5851 15.6988 49.5851 16.7396 48.9432 17.3815C48.3012 18.0235 47.2604 18.0235 46.6185 17.3815C42.8331 13.5962 37.7215 11.2877 32 11.2877C20.5462 11.2877 11.2877 20.5462 11.2877 32C11.2877 43.4538 20.5462 52.7123 32 52.7123C43.4538 52.7123 52.7123 43.4538 52.7123 32C52.7123 31.0921 53.4483 30.3562 54.3562 30.3562C55.264 30.3562 56 31.0921 56 32C56 45.2695 45.2695 56 32 56C18.7305 56 8 45.2695 8 32Z\"\n fill=\"white\"\n />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M24.5996 20.0577C25.1064 19.7636 25.7315 19.7615 26.2402 20.0522L44.6512 30.5728C45.1634 30.8654 45.4795 31.4101 45.4795 32C45.4795 32.5899 45.1634 33.1346 44.6512 33.4272L26.2402 43.9478C25.7315 44.2385 25.1064 44.2364 24.5996 43.9423C24.0928 43.6482 23.7808 43.1065 23.7808 42.5205V21.4795C23.7808 20.8935 24.0928 20.3518 24.5996 20.0577ZM27.0685 39.6879L40.5224 32L27.0685 24.3121V39.6879Z\"\n fill=\"white\"\n />\n <path\n d=\"M51.0685 19.1781C50.1606 19.1781 49.4247 19.9141 49.4247 20.8219C49.4247 21.7298 50.1606 22.4658 51.0685 22.4658H51.0816C51.9895 22.4658 52.7255 21.7298 52.7255 20.8219C52.7255 19.9141 51.9895 19.1781 51.0816 19.1781H51.0685Z\"\n fill=\"white\"\n />\n </svg>\n );\n };\n\n renderPauseIcon = () => {\n return (\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"64\" height=\"64\" rx=\"32\" fill=\"#005D92\" />\n <path\n d=\"M32 8C18.7305 8 8 18.7305 8 32C8 45.2695 18.7305 56 32 56C45.2695 56 56 45.2695 56 32C56 31.0921 55.264 30.3562 54.3562 30.3562C53.4483 30.3562 52.7123 31.0921 52.7123 32C52.7123 43.4538 43.4538 52.7123 32 52.7123C20.5462 52.7123 11.2877 43.4538 11.2877 32C11.2877 20.5462 20.5462 11.2877 32 11.2877C37.7215 11.2877 42.8331 13.5962 46.6185 17.3815C47.2604 18.0235 48.3012 18.0235 48.9432 17.3815C49.5851 16.7396 49.5851 15.6988 48.9432 15.0568C44.5751 10.6887 38.6401 8 32 8Z\"\n fill=\"white\"\n />\n <path\n d=\"M51.0685 19.1781C50.1606 19.1781 49.4247 19.9141 49.4247 20.8219C49.4247 21.7298 50.1606 22.4658 51.0685 22.4658H51.0816C51.9895 22.4658 52.7255 21.7298 52.7255 20.8219C52.7255 19.9141 51.9895 19.1781 51.0816 19.1781H51.0685Z\"\n fill=\"white\"\n />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M19.1729 24.1096C19.1729 21.7491 21.0865 19.8356 23.4469 19.8356H26.0771C28.4375 19.8356 30.351 21.7491 30.351 24.1096V39.8904C30.351 42.2509 28.4375 44.1644 26.0771 44.1644H23.4469C21.0865 44.1644 19.1729 42.2509 19.1729 39.8904V24.1096ZM23.4469 23.1233C22.9022 23.1233 22.4606 23.5649 22.4606 24.1096V39.8904C22.4606 40.4351 22.9022 40.8767 23.4469 40.8767H26.0771C26.6218 40.8767 27.0634 40.4351 27.0634 39.8904V24.1096C27.0634 23.5649 26.6218 23.1233 26.0771 23.1233H23.4469Z\"\n fill=\"white\"\n />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M37.7765 19.8356C35.4161 19.8356 33.5026 21.7491 33.5026 24.1096V39.8904C33.5026 42.2509 35.4161 44.1644 37.7765 44.1644H40.4067C42.7671 44.1644 44.6807 42.2509 44.6807 39.8904V24.1096C44.6807 21.7491 42.7671 19.8356 40.4067 19.8356H37.7765ZM36.7902 24.1096C36.7902 23.5649 37.2318 23.1233 37.7765 23.1233H40.4067C40.9514 23.1233 41.393 23.5649 41.393 24.1096V39.8904C41.393 40.4351 40.9514 40.8767 40.4067 40.8767H37.7765C37.2318 40.8767 36.7902 40.4351 36.7902 39.8904V24.1096Z\"\n fill=\"white\"\n />\n </svg>\n );\n };\n\n render() {\n return (\n <Host class={`pn-video-overlay ${this.showOverlay ? 'pn-video-overlay--show-overlay' : ''}`}>\n <button type=\"button\" id=\"overlayed-button-pause-video\" aria-label={`${this.i18n.ariaLabel}`} onClick={this.handlePlayPauseClicked}>\n {this.isPaused ? this.renderPlayIcon() : this.renderPauseIcon()}\n </button>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-scroll.pn-video-overlay.entry.cjs.js","mappings":"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","names":["uuidv4","h","Host"],"sources":["src/components/animation/pn-scroll/pn-scroll.scss?tag=pn-scroll","src/components/animation/pn-scroll/pn-scroll.tsx","src/components/animation/pn-play-on-scroll/pn-video-overlay/translations.ts","src/components/animation/pn-play-on-scroll/pn-video-overlay/pn-video-overlay.scss?tag=pn-video-overlay","src/components/animation/pn-play-on-scroll/pn-video-overlay/pn-video-overlay.tsx"],"sourcesContent":["pn-scroll {\n .scroll-wrapper {\n transition: all var(--transition-duration) ease-in-out 250ms;\n\n &.fade {\n opacity: 0;\n\n &.in-view {\n opacity: 1;\n }\n }\n\n &.slide-up {\n transform: translateY(50px);\n &.in-view {\n transform: translateY(0);\n }\n }\n\n &.slide-in {\n &.in-view {\n }\n }\n\n &.slide-out {\n &.in-view {\n }\n }\n }\n}\n","import { v4 as uuidv4 } from 'uuid';\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\nconst defaultObserverOptions: IntersectionObserverInit = {\n root: null,\n threshold: 0,\n rootMargin: '0px 0px -150px 0px',\n};\n\nconst SCROLL_ID = `pn-scroll-wrapper-id-`;\n\n@Component({\n tag: 'pn-scroll',\n styleUrl: 'pn-scroll.scss',\n})\nexport class PnScroll {\n @Element() hostElement: HTMLElement;\n @Prop() observerOptions: IntersectionObserverInit = defaultObserverOptions;\n @Prop() behaviourClasses: string = 'fade slide-up';\n @Prop() transitionDurationSeconds: number = 0.5;\n @Prop() shouldLoop?: boolean = false;\n @Prop() intersectFunc?: Function;\n @Prop() notIntersectFunc?: Function;\n\n @State() compId: string = null;\n\n generateUniqueId() {\n return uuidv4();\n }\n\n handleIntersection(entries: IntersectionObserverEntry[], observer?: IntersectionObserver, onIntersecting?: Function, onNotIntersecting?: Function, shouldLoop?: boolean) {\n entries.forEach(entry => {\n if (!shouldLoop) {\n if (!entry.isIntersecting) {\n onNotIntersecting?.(entry, observer);\n return;\n }\n entry.target.classList.add('in-view');\n onIntersecting?.(entry, observer);\n observer.unobserve(entry.target);\n } else {\n entry.target.classList.toggle('in-view', entry.isIntersecting);\n if (entry.isIntersecting) {\n onIntersecting?.(entry, observer);\n } else {\n onNotIntersecting?.(entry, observer);\n }\n }\n });\n }\n\n //on load, generate unique id for this wrapper\n componentWillLoad() {\n this.compId = this.generateUniqueId();\n }\n\n componentDidLoad() {\n const observer = new IntersectionObserver(\n (entries, observer) => this.handleIntersection(entries, observer, this.intersectFunc, this.notIntersectFunc, this.shouldLoop),\n this.observerOptions,\n );\n const objectToObserve = document.getElementById(`${SCROLL_ID}${this.compId}`);\n observer.observe(objectToObserve);\n }\n\n render() {\n return (\n <Host>\n <div class={`scroll-wrapper ${this.behaviourClasses}`} id={`${SCROLL_ID}${this.compId}`} style={{ '--transition-duration': `${this.transitionDurationSeconds}s` }}>\n <slot name=\"scroll-affected\" />\n </div>\n </Host>\n );\n }\n}\n","export const translations = {\n sv: {\n ariaLabel: 'Spela eller pausa video',\n },\n en: {\n ariaLabel: 'Play or pause video',\n },\n da: {\n ariaLabel: 'Afspil eller sæt video på pause',\n },\n no: {\n ariaLabel: 'Spill av eller sett video på pause',\n },\n fi: {\n ariaLabel: 'Toista tai keskeytä video',\n },\n de: {\n ariaLabel: 'Video abspielen oder anhalten',\n },\n zh: {\n sharelabel: 'Play or pause video',\n },\n it: {\n sharelabel: 'Play or pause video',\n },\n nl: {\n sharelabel: 'Play or pause video',\n },\n};\n","@import '../../../../globals/main';\n\npn-video-overlay {\n &.pn-video-overlay--show-overlay {\n position: absolute;\n width: 100%;\n height: 100%;\n background: radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%);\n }\n\n button {\n position: absolute;\n bottom: 8px;\n left: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n padding: 0;\n border: none;\n outline: none;\n cursor: pointer;\n background-color: transparent;\n\n @media screen and (min-width: $min-width-md) {\n bottom: 16px;\n left: 16px;\n }\n\n &:hover {\n svg rect {\n fill: darken(#005d92, 10%);\n }\n }\n\n &:active {\n svg rect {\n fill: darken(#005d92, 20%);\n }\n }\n\n &:focus,\n &:focus-visible {\n outline: 2px solid $white;\n }\n\n svg {\n scale: 0.7;\n @media screen and (min-width: $min-width-md) {\n scale: 1;\n }\n }\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { translations } from './translations';\n\n@Component({\n tag: 'pn-video-overlay',\n styleUrl: 'pn-video-overlay.scss',\n})\nexport class PnVideoOverlay {\n @Element() hostElement: HTMLElement;\n @Prop() language: string = 'en';\n @Prop() isPaused: boolean = false;\n @Prop() showOverlay: boolean = false;\n @State() i18n: any;\n\n @Event() playPauseClicked: EventEmitter<void>;\n\n componentWillLoad() {\n this.setTranslations();\n }\n\n setTranslations() {\n if (this.language === 'nb') {\n this.language = 'no';\n }\n if (this.language && translations[this.language]) {\n this.i18n = translations[this.language];\n }\n }\n\n @Watch('language')\n onLanguageChange() {\n this.setTranslations();\n }\n\n handlePlayPauseClicked = () => {\n this.playPauseClicked.emit();\n };\n\n renderPlayIcon = () => {\n return (\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"64\" height=\"64\" rx=\"32\" fill=\"#005D92\" />\n <path\n d=\"M8 32C8 18.7305 18.7305 8 32 8C38.6401 8 44.5751 10.6887 48.9432 15.0568C49.5851 15.6988 49.5851 16.7396 48.9432 17.3815C48.3012 18.0235 47.2604 18.0235 46.6185 17.3815C42.8331 13.5962 37.7215 11.2877 32 11.2877C20.5462 11.2877 11.2877 20.5462 11.2877 32C11.2877 43.4538 20.5462 52.7123 32 52.7123C43.4538 52.7123 52.7123 43.4538 52.7123 32C52.7123 31.0921 53.4483 30.3562 54.3562 30.3562C55.264 30.3562 56 31.0921 56 32C56 45.2695 45.2695 56 32 56C18.7305 56 8 45.2695 8 32Z\"\n fill=\"white\"\n />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M24.5996 20.0577C25.1064 19.7636 25.7315 19.7615 26.2402 20.0522L44.6512 30.5728C45.1634 30.8654 45.4795 31.4101 45.4795 32C45.4795 32.5899 45.1634 33.1346 44.6512 33.4272L26.2402 43.9478C25.7315 44.2385 25.1064 44.2364 24.5996 43.9423C24.0928 43.6482 23.7808 43.1065 23.7808 42.5205V21.4795C23.7808 20.8935 24.0928 20.3518 24.5996 20.0577ZM27.0685 39.6879L40.5224 32L27.0685 24.3121V39.6879Z\"\n fill=\"white\"\n />\n <path\n d=\"M51.0685 19.1781C50.1606 19.1781 49.4247 19.9141 49.4247 20.8219C49.4247 21.7298 50.1606 22.4658 51.0685 22.4658H51.0816C51.9895 22.4658 52.7255 21.7298 52.7255 20.8219C52.7255 19.9141 51.9895 19.1781 51.0816 19.1781H51.0685Z\"\n fill=\"white\"\n />\n </svg>\n );\n };\n\n renderPauseIcon = () => {\n return (\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <rect width=\"64\" height=\"64\" rx=\"32\" fill=\"#005D92\" />\n <path\n d=\"M32 8C18.7305 8 8 18.7305 8 32C8 45.2695 18.7305 56 32 56C45.2695 56 56 45.2695 56 32C56 31.0921 55.264 30.3562 54.3562 30.3562C53.4483 30.3562 52.7123 31.0921 52.7123 32C52.7123 43.4538 43.4538 52.7123 32 52.7123C20.5462 52.7123 11.2877 43.4538 11.2877 32C11.2877 20.5462 20.5462 11.2877 32 11.2877C37.7215 11.2877 42.8331 13.5962 46.6185 17.3815C47.2604 18.0235 48.3012 18.0235 48.9432 17.3815C49.5851 16.7396 49.5851 15.6988 48.9432 15.0568C44.5751 10.6887 38.6401 8 32 8Z\"\n fill=\"white\"\n />\n <path\n d=\"M51.0685 19.1781C50.1606 19.1781 49.4247 19.9141 49.4247 20.8219C49.4247 21.7298 50.1606 22.4658 51.0685 22.4658H51.0816C51.9895 22.4658 52.7255 21.7298 52.7255 20.8219C52.7255 19.9141 51.9895 19.1781 51.0816 19.1781H51.0685Z\"\n fill=\"white\"\n />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M19.1729 24.1096C19.1729 21.7491 21.0865 19.8356 23.4469 19.8356H26.0771C28.4375 19.8356 30.351 21.7491 30.351 24.1096V39.8904C30.351 42.2509 28.4375 44.1644 26.0771 44.1644H23.4469C21.0865 44.1644 19.1729 42.2509 19.1729 39.8904V24.1096ZM23.4469 23.1233C22.9022 23.1233 22.4606 23.5649 22.4606 24.1096V39.8904C22.4606 40.4351 22.9022 40.8767 23.4469 40.8767H26.0771C26.6218 40.8767 27.0634 40.4351 27.0634 39.8904V24.1096C27.0634 23.5649 26.6218 23.1233 26.0771 23.1233H23.4469Z\"\n fill=\"white\"\n />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M37.7765 19.8356C35.4161 19.8356 33.5026 21.7491 33.5026 24.1096V39.8904C33.5026 42.2509 35.4161 44.1644 37.7765 44.1644H40.4067C42.7671 44.1644 44.6807 42.2509 44.6807 39.8904V24.1096C44.6807 21.7491 42.7671 19.8356 40.4067 19.8356H37.7765ZM36.7902 24.1096C36.7902 23.5649 37.2318 23.1233 37.7765 23.1233H40.4067C40.9514 23.1233 41.393 23.5649 41.393 24.1096V39.8904C41.393 40.4351 40.9514 40.8767 40.4067 40.8767H37.7765C37.2318 40.8767 36.7902 40.4351 36.7902 39.8904V24.1096Z\"\n fill=\"white\"\n />\n </svg>\n );\n };\n\n render() {\n return (\n <Host class={`pn-video-overlay ${this.showOverlay ? 'pn-video-overlay--show-overlay' : ''}`}>\n <button type=\"button\" id=\"overlayed-button-pause-video\" aria-label={`${this.i18n.ariaLabel}`} onClick={this.handlePlayPauseClicked}>\n {this.isPaused ? this.renderPlayIcon() : this.renderPauseIcon()}\n </button>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/pn-share-item.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b02670c2.js');
+const index = require('./index-34e1c673.js');
-const pnShareItemCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-share-item .pn-share-item__container{padding:0.3rem 0.6rem;border:1px solid #d3cecb;border-radius:0.8rem;background-color:#ffffff;transition:background-color ease-in-out 0.3s;width:fit-content}pn-share-item a{text-decoration:none;color:#005d92;transition:color 0.3s;display:flex;align-items:center;gap:0.8rem;font-size:1.6rem;font-weight:400}pn-share-item [slot=icon] svg{height:1.6rem;width:1.6rem}pn-share-item [slot=icon] svg path{fill:#005d92;transition:fill 0.3s}pn-share-item:hover{cursor:pointer}pn-share-item:hover .pn-share-item__container{background-color:#0d234b}pn-share-item:hover a{color:#ffffff;text-decoration:none}pn-share-item:hover [slot=icon] svg{fill:#0d234b}pn-share-item:hover [slot=icon] svg path{fill:#ffffff}";
+const pnShareItemCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-share-item .pn-share-item__container{padding:0.3rem 0.6rem;border:1px solid #d3cecb;border-radius:0.8rem;background-color:#ffffff;transition:background-color ease-in-out 0.3s;width:fit-content}pn-share-item a{text-decoration:none;color:#005d92;transition:color 0.3s;display:flex;align-items:center;gap:0.8rem;font-size:1.6rem;font-weight:400}pn-share-item [slot=icon] svg{height:1.6rem;width:1.6rem}pn-share-item [slot=icon] svg path{fill:#005d92;transition:fill 0.3s}pn-share-item:hover{cursor:pointer}pn-share-item:hover .pn-share-item__container{background-color:#0d234b}pn-share-item:hover a{color:#ffffff;text-decoration:none}pn-share-item:hover [slot=icon] svg{fill:#0d234b}pn-share-item:hover [slot=icon] svg path{fill:#ffffff}";
 const PnShareItemStyle0 = pnShareItemCss;
 const PnShareItem = class {

package/dist/cjs/pn-share-item.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-share-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,~~2nCAA2nC~~,CAAC;~~AACnpC~~,0BAAe,cAAc;;MCKhB,WAAW;;;oBAEC,IAAI;oBACJ,IAAI;;;IAE3B,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,gEAAG,IAAI,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,IACrBA,mEAAM,IAAI,EAAC,MAAM,GAAG,OAAE,IAAI,CAAC,IAAI,CAC7B,CACA,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-share/pn-share-item.scss?tag=pn-share-item","src/components/cta/pn-share/pn-share-item.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-share-item {\n .pn-share-item__container {\n padding: 0.3rem 0.6rem;\n border: 1px solid $gray200;\n border-radius: 0.8rem;\n\n background-color: $white;\n transition: background-color ease-in-out 0.3s;\n width: fit-content;\n }\n\n a {\n text-decoration: none;\n color: $blue700;\n transition: color 0.3s;\n display: flex;\n align-items: center;\n gap: 0.8rem;\n font-size: 1.6rem;\n font-weight: 400;\n }\n\n [slot='icon'] {\n svg {\n height: 1.6rem;\n width: 1.6rem;\n path {\n fill: $blue700;\n transition: fill 0.3s;\n }\n }\n }\n\n &:hover {\n cursor: pointer;\n\n .pn-share-item__container {\n background-color: $blue900;\n }\n\n a {\n color: $white;\n text-decoration: none;\n }\n\n [slot='icon'] {\n svg {\n fill: $blue900;\n path {\n fill: $white;\n }\n }\n }\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-share-item',\n styleUrl: 'pn-share-item.scss',\n})\nexport class PnShareItem {\n @Element() hostElement: HTMLElement;\n @Prop() link: string = null;\n @Prop() text: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"pn-share-item__container\">\n <a href={`${this.link}`}>\n <slot name=\"icon\" /> {this.text}\n </a>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-share-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,kzBAAkzB,CAAC;AAC10B,0BAAe,cAAc;;MCKhB,WAAW;;;oBAEC,IAAI;oBACJ,IAAI;;;IAE3B,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,gEAAG,IAAI,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,IACrBA,mEAAM,IAAI,EAAC,MAAM,GAAG,OAAE,IAAI,CAAC,IAAI,CAC7B,CACA,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-share/pn-share-item.scss?tag=pn-share-item","src/components/cta/pn-share/pn-share-item.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-share-item {\n .pn-share-item__container {\n padding: 0.3rem 0.6rem;\n border: 1px solid $gray200;\n border-radius: 0.8rem;\n\n background-color: $white;\n transition: background-color ease-in-out 0.3s;\n width: fit-content;\n }\n\n a {\n text-decoration: none;\n color: $blue700;\n transition: color 0.3s;\n display: flex;\n align-items: center;\n gap: 0.8rem;\n font-size: 1.6rem;\n font-weight: 400;\n }\n\n [slot='icon'] {\n svg {\n height: 1.6rem;\n width: 1.6rem;\n path {\n fill: $blue700;\n transition: fill 0.3s;\n }\n }\n }\n\n &:hover {\n cursor: pointer;\n\n .pn-share-item__container {\n background-color: $blue900;\n }\n\n a {\n color: $white;\n text-decoration: none;\n }\n\n [slot='icon'] {\n svg {\n fill: $blue900;\n path {\n fill: $white;\n }\n }\n }\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-share-item',\n styleUrl: 'pn-share-item.scss',\n})\nexport class PnShareItem {\n @Element() hostElement: HTMLElement;\n @Prop() link: string = null;\n @Prop() text: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"pn-share-item__container\">\n <a href={`${this.link}`}>\n <slot name=\"icon\" /> {this.text}\n </a>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/pn-share.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b02670c2.js');
+const index = require('./index-34e1c673.js');
 const translations = {
     sv: {
@@ -31,7 +31,7 @@ const translations = {
     },
 };
-const pnShareCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-share .pn-share__container{display:flex;flex-direction:column;gap:0.8rem}pn-share .pn-share__heading{font-size:1.6rem;font-weight:500}pn-share .pn-share__heading:after{content:\"\";display:block;height:0.2rem;background-color:#f3f2f2;margin-top:0.4rem;margin-bottom:0.8rem}pn-share .pn-share__items{display:flex;flex-direction:row;gap:0.8rem;align-items:center}";
+const pnShareCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-share .pn-share__container{display:flex;flex-direction:column;gap:0.8rem}pn-share .pn-share__heading{font-size:1.6rem;font-weight:500}pn-share .pn-share__heading:after{content:\"\";display:block;height:0.2rem;background-color:#f3f2f2;margin-top:0.4rem;margin-bottom:0.8rem}pn-share .pn-share__items{display:flex;flex-direction:row;gap:0.8rem;align-items:center}";
 const PnShareStyle0 = pnShareCss;
 const SHARE_URLS = [

package/dist/cjs/pn-share.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"pn-share.entry.cjs.js","mappings":";;;;;;AAAO,MAAM,YAAY,GAAG;IAC1B,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,SAAS;KACtB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,OAAO;KACpB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;CACF;;ACzBD,MAAM,UAAU,GAAG,~~swBAAswB~~,CAAC;~~AAC1xB~~,sBAAe,UAAU;;ACGzB,MAAM,UAAU,GAAG;IACjB,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,sDAAsD,EAAE,IAAI,EAAE,UAAU,EAAE;IACvG,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,uCAAuC,EAAE,IAAI,EAAE,SAAS,EAAE;IACtF,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,+CAA+C,EAAE,IAAI,EAAE,UAAU,EAAE;CACjG,CAAC;MAMW,OAAO;;;oBAEK,IAAI;wBACgC,IAAI;;;;IAG/D,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,eAAe;QACb,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;YAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACtB;QACD,IAAI,IAAI,CAAC,QAAQ,IAAI,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YAChD,IAAI,CAAC,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SACzC;KACF;IAGD,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,qBAAqB,IAC9BA,iEAAI,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,CAAC,UAAU,MAAO,EAC1DA,kEAAK,KAAK,EAAC,iBAAiB,IACzB,UAAU,CAAC,GAAG,CAAC,QAAQ;YACtB,QACEA,2BAAe,IAAI,EAAE,GAAG,QAAQ,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,CAAC,IAAI,IACrEA,qBAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,QAAQ,CAAC,QAAQ,GAAY,CAC1C,EAChB;SACH,CAAC,CACE,CACF,CACD,EACP;KACH;;;;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-share/translations.ts","src/components/cta/pn-share/pn-share.scss?tag=pn-share","src/components/cta/pn-share/pn-share.tsx"],"sourcesContent":["export const translations = {\n sv: {\n sharelabel: 'Dela med',\n },\n en: {\n sharelabel: 'Share to',\n },\n da: {\n sharelabel: 'Del med',\n },\n no: {\n sharelabel: 'Dele med',\n },\n fi: {\n sharelabel: 'Jakaa',\n },\n zh: {\n sharelabel: 'Share to',\n },\n it: {\n sharelabel: 'Share to',\n },\n nl: {\n sharelabel: 'Share to',\n },\n};\n","@import '../../../globals/main.scss';\npn-share {\n .pn-share__container {\n display: flex;\n flex-direction: column;\n gap: 0.8rem;\n }\n\n .pn-share__heading {\n font-size: 1.6rem;\n font-weight: 500;\n &:after {\n content: '';\n display: block;\n height: 0.2rem;\n background-color: $gray50;\n margin-top: 0.4rem;\n margin-bottom: 0.8rem;\n }\n }\n\n .pn-share__items {\n display: flex;\n flex-direction: row;\n gap: 0.8rem;\n align-items: center;\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { translations } from './translations';\n\nconst SHARE_URLS = [\n { platform: 'linkedin', url: 'https://www.linkedin.com/sharing/share-offsite/?url=', text: 'LinkedIn' },\n { platform: 'twitter', url: 'https://twitter.com/intent/tweet?url=', text: 'Twitter' },\n { platform: 'facebook', url: 'https://www.facebook.com/sharer/sharer.php?u=', text: 'Facebook' },\n];\n\n@Component({\n tag: 'pn-share',\n styleUrl: 'pn-share.scss',\n})\nexport class PnShare {\n @Element() hostElement: HTMLElement;\n @Prop() link: string = null;\n @Prop({ mutable: true, reflect: true }) language: string = 'sv';\n @State() i18n: any;\n\n componentWillLoad() {\n this.setTranslations();\n }\n\n setTranslations() {\n if (this.language === 'nb') {\n this.language = 'no';\n }\n if (this.language && translations[this.language]) {\n this.i18n = translations[this.language];\n }\n }\n\n @Watch('language')\n onLanguageChange() {\n this.setTranslations();\n }\n\n render() {\n return (\n <Host>\n <div class=\"pn-share__container\">\n <h3 class=\"pn-share__heading\">{this.i18n.sharelabel}:</h3>\n <div class=\"pn-share__items\">\n {SHARE_URLS.map(platform => {\n return (\n <pn-share-item link={`${platform.url}${this.link}`} text={platform.text}>\n <pn-icon slot=\"icon\" icon={platform.platform}></pn-icon>\n </pn-share-item>\n );\n })}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"pn-share.entry.cjs.js","mappings":";;;;;;AAAO,MAAM,YAAY,GAAG;IAC1B,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,SAAS;KACtB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,OAAO;KACpB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;IACD,EAAE,EAAE;QACF,UAAU,EAAE,UAAU;KACvB;CACF;;ACzBD,MAAM,UAAU,GAAG,6bAA6b,CAAC;AACjd,sBAAe,UAAU;;ACGzB,MAAM,UAAU,GAAG;IACjB,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,sDAAsD,EAAE,IAAI,EAAE,UAAU,EAAE;IACvG,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,uCAAuC,EAAE,IAAI,EAAE,SAAS,EAAE;IACtF,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,+CAA+C,EAAE,IAAI,EAAE,UAAU,EAAE;CACjG,CAAC;MAMW,OAAO;;;oBAEK,IAAI;wBACgC,IAAI;;;;IAG/D,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,eAAe;QACb,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;YAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACtB;QACD,IAAI,IAAI,CAAC,QAAQ,IAAI,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;YAChD,IAAI,CAAC,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SACzC;KACF;IAGD,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,qBAAqB,IAC9BA,iEAAI,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,CAAC,UAAU,MAAO,EAC1DA,kEAAK,KAAK,EAAC,iBAAiB,IACzB,UAAU,CAAC,GAAG,CAAC,QAAQ;YACtB,QACEA,2BAAe,IAAI,EAAE,GAAG,QAAQ,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,CAAC,IAAI,IACrEA,qBAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,QAAQ,CAAC,QAAQ,GAAY,CAC1C,EAChB;SACH,CAAC,CACE,CACF,CACD,EACP;KACH;;;;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-share/translations.ts","src/components/cta/pn-share/pn-share.scss?tag=pn-share","src/components/cta/pn-share/pn-share.tsx"],"sourcesContent":["export const translations = {\n sv: {\n sharelabel: 'Dela med',\n },\n en: {\n sharelabel: 'Share to',\n },\n da: {\n sharelabel: 'Del med',\n },\n no: {\n sharelabel: 'Dele med',\n },\n fi: {\n sharelabel: 'Jakaa',\n },\n zh: {\n sharelabel: 'Share to',\n },\n it: {\n sharelabel: 'Share to',\n },\n nl: {\n sharelabel: 'Share to',\n },\n};\n","@import '../../../globals/main.scss';\npn-share {\n .pn-share__container {\n display: flex;\n flex-direction: column;\n gap: 0.8rem;\n }\n\n .pn-share__heading {\n font-size: 1.6rem;\n font-weight: 500;\n &:after {\n content: '';\n display: block;\n height: 0.2rem;\n background-color: $gray50;\n margin-top: 0.4rem;\n margin-bottom: 0.8rem;\n }\n }\n\n .pn-share__items {\n display: flex;\n flex-direction: row;\n gap: 0.8rem;\n align-items: center;\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { translations } from './translations';\n\nconst SHARE_URLS = [\n { platform: 'linkedin', url: 'https://www.linkedin.com/sharing/share-offsite/?url=', text: 'LinkedIn' },\n { platform: 'twitter', url: 'https://twitter.com/intent/tweet?url=', text: 'Twitter' },\n { platform: 'facebook', url: 'https://www.facebook.com/sharer/sharer.php?u=', text: 'Facebook' },\n];\n\n@Component({\n tag: 'pn-share',\n styleUrl: 'pn-share.scss',\n})\nexport class PnShare {\n @Element() hostElement: HTMLElement;\n @Prop() link: string = null;\n @Prop({ mutable: true, reflect: true }) language: string = 'sv';\n @State() i18n: any;\n\n componentWillLoad() {\n this.setTranslations();\n }\n\n setTranslations() {\n if (this.language === 'nb') {\n this.language = 'no';\n }\n if (this.language && translations[this.language]) {\n this.i18n = translations[this.language];\n }\n }\n\n @Watch('language')\n onLanguageChange() {\n this.setTranslations();\n }\n\n render() {\n return (\n <Host>\n <div class=\"pn-share__container\">\n <h3 class=\"pn-share__heading\">{this.i18n.sharelabel}:</h3>\n <div class=\"pn-share__items\">\n {SHARE_URLS.map(platform => {\n return (\n <pn-share-item link={`${platform.url}${this.link}`} text={platform.text}>\n <pn-icon slot=\"icon\" icon={platform.platform}></pn-icon>\n </pn-share-item>\n );\n })}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}