@oiz/stzh-components 4.5.0 → 4.6.0-beta2

package/dist/collection/components/CMS/stzh-feedreader-item/stzh-feedreader-item.js

@@ -35,7 +35,7 @@ export class StzhFeedreaderItem {
             "stzh-feedreader-item--has-link": !!this.link,
             [`stzh-feedreader-item--${this.variant}`]: true,
         };
-        return (h(Host, { key: '487f0f2871d41c8fbde3ad1a6b39ac1f6526cd25', variant: this.variant }, !!this.link ? (h("a", { class: classes, href: this.link, target: this.target }, this.renderInner())) : (h("div", { class: classes }, this.renderInner()))));
+        return (h(Host, { key: 'cca09872dd7266d787923616973495d736ac90eb', variant: this.variant }, !!this.link ? (h("a", { class: classes, href: this.link, target: this.target }, this.renderInner())) : (h("div", { class: classes }, this.renderInner()))));
     }
     static get is() { return "stzh-feedreader-item"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-geo-ref-data/stzh-geo-ref-data.js

@@ -485,12 +485,12 @@ export class GeoRefData {
             "stzh-geo-ref-data--is-open": this.isOpen,
             "stzh-geo-ref-data--has-filters": this._availableTags.length > 0,
         };
-        return (h(Host, { key: 'e0dd5fa42d0ba4baf77f632feec8780e8a524eda' }, h("stzh-toastbar", { key: '2ff02de479d436c1a1225b45d87c49612a54f185', ref: el => (this.toastbarElement = el) }), h("div", { key: '24b6c99245e439958838736d9a9e7278a056a412', class: "stzh-geo-ref-data__trigger", onClick: () => this.initializeAndOpenMap() }, h("slot", { key: '041b10ba8f1011976929455241ebf8a8efeea63c', name: "trigger" })), h("stzh-overlay", { key: '92cb6c5d1bf304d965dc79df84149679ae295523', open: this.isLoading }, h("stzh-loader", { key: 'bfa5d1e375f07dc1302a8eaf1053f718a5cb420a', label: "Daten werden geladen..." })), h("div", { key: 'fab9b4ef17401bfb84db58bc4e1f024641b77a0b', class: classes }, h("div", { key: '58545fa974d2da236ffd9eb81345bfb8cbfb89be', class: "stzh-geo-ref-data__header-wrapper" }, h("stzh-header", { key: '642fc0431a6f3b867aeaef9485d128102e4eee48', class: "stzh-geo-ref-data__header", "hide-metabar": true, sticky: "disabled" }, h("slot", { key: 'a80272de39bb30e5a0e222f2dad733f82144abb7', name: "logo", slot: "logo" })), h("div", { key: '0d789cca3ee97f25387dbc4bd89b36421b16d782', class: "stzh-geo-ref-data__heading stzh-geo-ref-data--content-padding" }, h("stzh-heading", { key: '5fc9670c7bb9808a8749232477ffe103d8c838fd', class: "stzh-geo-ref-data__heading-heading", curve: "h2" }, this.heading), h("stzh-button", { key: '425490811a1ca92bf8e95da1b723d927f6af6375', class: "stzh-geo-ref-data__overlay-close", icon: "close", iconOnly: true, size: "small", variant: "tertiary", onClick: this.handleOverlayCloseClick }))), h("div", { key: '2602cf984edc0c67eff8e82034ccc465f3f317bb', class: "stzh-geo-ref-data__content" }, h("div", { key: 'dd58489e404c5372da7a8d35f336954fcc7585bd', class: "stzh-geo-ref-data__meta-wrapper stzh-geo-ref-data--content-padding", ref: el => (this.metaWrapperElement = el) }, h("div", { key: 'd8bc1886172b0f5220a9874d27455ac6852c991f', class: "stzh-geo-ref-data__filters" }, this._availableTags.length > 0 && (h("div", { key: 'f2259688651dc0204f71c7af4ce087294d0307bd', class: "stzh-geo-ref-data__filters-toggle" }, h("stzh-chip", { key: '0ae84325bd8c36a749e19f7e319ec4240c8541f7', label: this.isViewportMedium ? "Filter" : "", variant: "filter", icon: "filtering", onStzhClick: this.handleFilterToggleClick }))), h("div", { key: '300a3069247f6c0d966467fc2399f88072dbb114', class: {
+        return (h(Host, { key: '622fa576a12d4a4f14f0a3abcb0aee383447ed4e' }, h("stzh-toastbar", { key: '35c7c17d01a384663c260cd95ef1a0695f2d3f47', ref: el => (this.toastbarElement = el) }), h("div", { key: '4c5c5e2f63d3df941d9a5e6e4b04f5cab957a745', class: "stzh-geo-ref-data__trigger", onClick: () => this.initializeAndOpenMap() }, h("slot", { key: 'de597358856bdf35161f9828e847ebe83fe50417', name: "trigger" })), h("stzh-overlay", { key: 'a4e4b760d0bdaf40e323366f2f2cccc28d5ced63', open: this.isLoading }, h("stzh-loader", { key: 'b9b8167f9f9c846da78ad5564beb719c4d449e51', label: "Daten werden geladen..." })), h("div", { key: 'b967e2028eddb2f9cec34e02406632c9bd782384', class: classes }, h("div", { key: 'f3304f57e22263eeba6acd7e57b04bfe46bf1deb', class: "stzh-geo-ref-data__header-wrapper" }, h("stzh-header", { key: 'c902710cd2873a98175d6b2538d70db80789d34b', class: "stzh-geo-ref-data__header", "hide-metabar": true, sticky: "disabled" }, h("slot", { key: '12fc1e28c6d4e0b491d0be9e27ac066b14fb51a7', name: "logo", slot: "logo" })), h("div", { key: 'e7a6c4c8919fe81eca84023df7e5518623ad3f7e', class: "stzh-geo-ref-data__heading stzh-geo-ref-data--content-padding" }, h("stzh-heading", { key: 'bb06d84141149d4efef44be0d10b47d241142ac3', class: "stzh-geo-ref-data__heading-heading", curve: "h2" }, this.heading), h("stzh-button", { key: 'd3ea28c2cfabf733ee224a0b6a5b7891cc1ebd5d', class: "stzh-geo-ref-data__overlay-close", icon: "close", iconOnly: true, size: "small", variant: "tertiary", onClick: this.handleOverlayCloseClick }))), h("div", { key: '7e33152f3e1c1ffb569ffcb29f38f0fd6a8f5142', class: "stzh-geo-ref-data__content" }, h("div", { key: '5792f4259ab3f693e1026ce38c65efa14bb2b423', class: "stzh-geo-ref-data__meta-wrapper stzh-geo-ref-data--content-padding", ref: el => (this.metaWrapperElement = el) }, h("div", { key: '655d2a88a92cca05b67e5405c0a6cfd96183c2a5', class: "stzh-geo-ref-data__filters" }, this._availableTags.length > 0 && (h("div", { key: '28e95610103e34e8b5413f48e1215a40f618237c', class: "stzh-geo-ref-data__filters-toggle" }, h("stzh-chip", { key: '1dcf8a42747df8fc1d24ebb69d841c73cc957296', label: this.isViewportMedium ? "Filter" : "", variant: "filter", icon: "filtering", onStzhClick: this.handleFilterToggleClick }))), h("div", { key: '9f69ad03171fdf6b5c568b256b3670a55e044f29', class: {
                 "stzh-geo-ref-data__filters-content": true,
                 "stzh-geo-ref-data__filters-content--visible": !this.isViewportLarge && this.isFiltersContentOpen,
-            } }, h("stzh-chipselect", { key: '516f640de23b5309fb3183a32f6c213248a2248c', "label-hidden": true, label: "Tags", data: this.enhancedTags, onStzhChange: this.handleFilterChange, multiple: true, defaultValue: this.appliedFilters, value: this.appliedFilters }), h("div", { key: '2f1d27322624e8ab65b327b58cb7338817753603', class: "stzh-geo-ref-data__filters-apply-button" }, h("stzh-button", { key: '784454aa3d067f79e7bf87b5e90bf966cc269349', size: "small", fullwidth: true, onStzhClick: this.handleApplyFilterClick }, "Anwenden")))), h("div", { key: '08c124e62654133064109014da8404180daaaf31', class: "stzh-geo-ref-data__search" }, h("stzh-input", { key: '56d5dee39ec3a7d4012e8b6d1ae0be0483318347', name: "stzh-datatable-search", onStzhChange: this.handleSearchChange, hideOptional: true, label: "Suche", type: "search" })), h("div", { key: 'ddccbcf77152a5cb69293d047a7965ef4cc6556a', class: "stzh-geo-ref-data__results-toggle" }, h("stzh-chip", { key: 'cb6d49de9d1150c8af851e5370ede1d4652306c7', onStzhClick: this.toggleViewMode, label: this.viewmode === "map" ? "Liste" : "Karte", icon: this.viewmode === "map" ? "bulleted-list" : "map", variant: "filter" }))), h("div", { key: '1d234e87f7416f43e361a429f3d8d2ac206441c5', class: "stzh-geo-ref-data__results-wrapper" }, h("div", { key: '208b43c8ecd8ecebfb7a49ebf6c4e127a3f1a493', class: `stzh-geo-ref-data__results-map ${this.viewmode === "map" ? "active" : "inactive"}` }, h("stzh-olmap", { key: '7dfd4e8e4b3586ad130d95a5998121a64713cb6c', class: "stzh-geo-ref-data__ol-map", centerMarker: this.centerMarker, zoom: this.zoom, zoomLocation: this.zoomLocation, writeExtentToUrlEnabled: this.isOpen, locationControl: this.locationControl, pinchRotateThreshold: this.pinchRotateThreshold, ref: el => (this.mapElement = el) }), h("div", { key: '1cd1adedce9d9a1002ea4179d8686268ec9724ed', class: "stzh-geo-ref-data__map-controls" }, h("stzh-checkbox", { key: '3fd0e08d316970997b45cb3eafcefb7e9c31f084', label: "Treffer an Kartenausschnitt anpassen", checked: this.showOnlyResultsForCurrentExtent, hideOptional: true, onStzhChange: this.handleExtentVisibilityChange }))), h("div", { key: '0aa4beec4eec88e83e110947c63e4a913496c06c', class: `stzh-geo-ref-data__results-list ${this.viewmode === "list" ? "active" : "inactive"}`, ref: el => (this.resultsListElement = el) }, this.finalResults && (h(Fragment, { key: '9245bcc5339dc238e44a1858c573531f1321ad3f' }, h("div", { key: '41b6e85f8cae1cd69b041c31d069ba1261d5c331', class: "stzh-geo-ref-data__list-search" }, h("stzh-input", { key: '02c1b15ac508620b1ee10de3f7408775936e000c', name: "stzh-datatable-search", onStzhChange: this.handleSearchChange, hideOptional: true, label: "Suche", type: "search" })), h("stzh-text", { key: 'ca0d6a32aa889a217e06b2b34df4207acc8f72c1', class: "stzh-geo-ref-data__results-list-heading" }, this.finalResults.length, " Treffer"), h("div", { key: '83611b11e426e3f635ffd3a8b93edd4dc93864a2', class: "stzh-geo-ref-data__teaser-list" }, this.finalResultsPaginatedList.map(item => (h("div", { class: "stzh-poi-teaser", onMouseEnter: () => this.handlePoiTeaserMouseEnter(item), onMouseLeave: () => this.handlePoiTeaserMouseLeave(item) }, h("a", { class: "stzh-poi-teaser-link", href: this.baseUrlOverride + item.path }), h("div", { class: "stzh-poi-teaser-content" }, h("stzh-heading", { curve: "lead" }, item.poiname), item.description && h("stzh-text", { size: "micro" }, item.description), item.data &&
+            } }, h("stzh-chipselect", { key: 'c27ee31157049458f50a47baddba94cfb5104d8c', "label-hidden": true, label: "Tags", data: this.enhancedTags, onStzhChange: this.handleFilterChange, multiple: true, defaultValue: this.appliedFilters, value: this.appliedFilters }), h("div", { key: 'bbd33d9325edba4ecfc322257fa6784c4f7acc79', class: "stzh-geo-ref-data__filters-apply-button" }, h("stzh-button", { key: 'c6226a9962aef1d0c9a34b74461da7f8c9209c45', size: "small", fullwidth: true, onStzhClick: this.handleApplyFilterClick }, "Anwenden")))), h("div", { key: 'e81605d03e3b06f12d3409db5f05e48aad4f6995', class: "stzh-geo-ref-data__search" }, h("stzh-input", { key: '79ab7edfd3d6e90ca04a757a7fef9764fa868429', name: "stzh-datatable-search", onStzhChange: this.handleSearchChange, hideOptional: true, label: "Suche", type: "search" })), h("div", { key: '6b39cac1ee8d5d14c6f4d9d8e2e11aedd785990d', class: "stzh-geo-ref-data__results-toggle" }, h("stzh-chip", { key: '0e0d333857c523de82f6e5eb8dde321480522d13', onStzhClick: this.toggleViewMode, label: this.viewmode === "map" ? "Liste" : "Karte", icon: this.viewmode === "map" ? "bulleted-list" : "map", variant: "filter" }))), h("div", { key: '47fc05d878a5a3c30b384d8188cc884cb8ed7bed', class: "stzh-geo-ref-data__results-wrapper" }, h("div", { key: '919980fe302ac2396582963a3e8b51c0b84fbc1b', class: `stzh-geo-ref-data__results-map ${this.viewmode === "map" ? "active" : "inactive"}` }, h("stzh-olmap", { key: '1627765063abcbe5fdc8c8dbae227b236af2b35a', class: "stzh-geo-ref-data__ol-map", centerMarker: this.centerMarker, zoom: this.zoom, zoomLocation: this.zoomLocation, writeExtentToUrlEnabled: this.isOpen, locationControl: this.locationControl, pinchRotateThreshold: this.pinchRotateThreshold, ref: el => (this.mapElement = el) }), h("div", { key: 'd80b8667608f11ee213dd69345945a4cd00cd6b4', class: "stzh-geo-ref-data__map-controls" }, h("stzh-checkbox", { key: '5bf939fb6ee430af901a29fd8f838ab31e3bd866', label: "Treffer an Kartenausschnitt anpassen", checked: this.showOnlyResultsForCurrentExtent, hideOptional: true, onStzhChange: this.handleExtentVisibilityChange }))), h("div", { key: '59231f60d9bb0ef8865601ed2a768349a3d68930', class: `stzh-geo-ref-data__results-list ${this.viewmode === "list" ? "active" : "inactive"}`, ref: el => (this.resultsListElement = el) }, this.finalResults && (h(Fragment, { key: '2d5d59430f1f13a73763c7b57626e88cd75b9878' }, h("div", { key: '2132594f70a45cceac921e3e8310d6528774ed05', class: "stzh-geo-ref-data__list-search" }, h("stzh-input", { key: 'd03968de2cb968a143a25e40cc87ad63451124cc', name: "stzh-datatable-search", onStzhChange: this.handleSearchChange, hideOptional: true, label: "Suche", type: "search" })), h("stzh-text", { key: '49f07eeb65179d364e9eb716db1754ba5bcb24ef', class: "stzh-geo-ref-data__results-list-heading" }, this.finalResults.length, " Treffer"), h("div", { key: '31667e80a3278503099292cbea3c57dbb51d6c3e', class: "stzh-geo-ref-data__teaser-list" }, this.finalResultsPaginatedList.map(item => (h("div", { class: "stzh-poi-teaser", onMouseEnter: () => this.handlePoiTeaserMouseEnter(item), onMouseLeave: () => this.handlePoiTeaserMouseLeave(item) }, h("a", { class: "stzh-poi-teaser-link", href: this.baseUrlOverride + item.path }), h("div", { class: "stzh-poi-teaser-content" }, h("stzh-heading", { curve: "lead" }, item.poiname), item.description && h("stzh-text", { size: "micro" }, item.description), item.data &&
             item.data.length > 0 &&
-            item.data.map(item => (h("div", { class: "stzh-poi-teaser-list-item" }, h("stzh-icon", { name: item.icon }), h("stzh-text", { size: "micro" }, item.text))))), item.image && (h("div", { class: "stzh-poi-teaser__image-wrapper" }, h("stzh-ratio", { ratio: "2:1", "ratio-large": "5:4", "ratio-ultra": "1:1", portrait: this.isViewportLarge, class: "stzh-poi-teaser__ratio" }), h("div", { class: "stzh-poi-teaser__image-inner-wrapper" }, h("img", { src: this.baseUrlOverride + item.image, alt: "Foto von " + item.poiname })))))))), this.canLoadMore && (h("div", { key: 'cac4334ccdefe0631c7a87aabb0fae894350f442', class: "stzh-geo-ref-data__teaser-load-more" }, h("stzh-button", { key: '4150e27fb7cd3981cd1d09701aea6ef36f0d224b', onStzhClick: () => this.loadMore() }, "Weitere laden")))))))))));
+            item.data.map(item => (h("div", { class: "stzh-poi-teaser-list-item" }, h("stzh-icon", { name: item.icon }), h("stzh-text", { size: "micro" }, item.text))))), item.image && (h("div", { class: "stzh-poi-teaser__image-wrapper" }, h("stzh-ratio", { ratio: "2:1", "ratio-large": "5:4", "ratio-ultra": "1:1", portrait: this.isViewportLarge, class: "stzh-poi-teaser__ratio" }), h("div", { class: "stzh-poi-teaser__image-inner-wrapper" }, h("img", { src: this.baseUrlOverride + item.image, alt: "Foto von " + item.poiname })))))))), this.canLoadMore && (h("div", { key: 'acda745d3572c46a6b918419f3f8d501d1a18675', class: "stzh-geo-ref-data__teaser-load-more" }, h("stzh-button", { key: 'e7c616229e3af0eede341226882d42dcc25eee78', onStzhClick: () => this.loadMore() }, "Weitere laden")))))))))));
     }
     static get is() { return "stzh-geo-ref-data"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/CMS/stzh-ghettobox/stzh-ghettobox.js

@@ -65,7 +65,7 @@ export class StzhGhettobox {
             "stzh-ghettobox--has-close-button": !this.hideClose,
         };
         // TODO: Temporary workaround/bugfix for readspeaker class "rs_skip" can be removed once Readspeaker update with bugfix has arrived (ETA end of 2024).
-        return (h(Host, { key: '260b6f595622a23d0d63c0ed4909ee7ce7c82f9a', hidden: !this.open }, h("div", { key: 'b6ec42b74b41a6ac7ecaa9c128e1660c81e26fe2', class: Object.assign(Object.assign({}, classes), { rs_skip: !this.open }), "aria-hidden": this.open ? "false" : "true" }, h("div", { key: 'cd03d71dfa508e05300ca331d3203d511f8cd7ec', class: "stzh-ghettobox__container" }, h("h1", { key: '0c911250edb44d040088cceeccdfd0418f103fbd', class: "stzh-ghettobox__hidden-title" }, this.hiddenTitle || this.localization.hiddenTitle), h("div", { key: '0ed9ce039ce4939f5fbcd2cdcfd3131772a6a3b5', class: "stzh-ghettobox__message" }, h("div", { key: '403ce4334cc501e6b192c689e07c3c9f120e649a', class: "stzh-ghettobox__text" }, h("h2", { key: 'e64e302980396b0ebaa4f7ffbee4ac93bde171db', class: "stzh-ghettobox__main-title" }, this.mainTitle), h("div", { key: 'b5837c1135e83d135446bda0b524a4ddbbbc759d', class: "stzh-ghettobox__description" }, this.description ? this.description : h("slot", null))), h("div", { key: 'b2c72af66cfdd690ac40a894816ff3cff70839e4', class: "stzh-ghettobox__button" }, h("slot", { key: '741012309a402094ab8dcc1e3bfa86bc211b28ac', name: "button" }))), !this.hideClose && (h("stzh-button", { key: '1d2382acf8262559f425b8a0958ec4dae8a1f20e', class: "stzh-ghettobox__close", onClick: this.onCloseButtonClick, a11yLabel: this.localization.close, variant: "tertiary", size: "small", iconOnly: true, icon: "close-big" }))))));
+        return (h(Host, { key: '07b9486204d24f9ffd8ac926f12d6b168376e2c2', hidden: !this.open }, h("div", { key: 'e728b4c2339592d95d78c7cfa53092027daff317', class: Object.assign(Object.assign({}, classes), { rs_skip: !this.open }), "aria-hidden": this.open ? "false" : "true" }, h("div", { key: 'e713155dbe1b06a1a161220c1d73f399f2b8c83a', class: "stzh-ghettobox__container" }, h("h1", { key: 'a548827bee4ded14960a55ed618dd802e8a3a8da', class: "stzh-ghettobox__hidden-title" }, this.hiddenTitle || this.localization.hiddenTitle), h("div", { key: '1992031874d92412fbd9b198885e445d7f8cf1ef', class: "stzh-ghettobox__message" }, h("div", { key: '05f7ace8f802ca10ab744fcdd37c921b92e3fed9', class: "stzh-ghettobox__text" }, h("h2", { key: '099223e2e06622718fc26126cf98e190ab346f41', class: "stzh-ghettobox__main-title" }, this.mainTitle), h("div", { key: 'a1ee6b0178bdead7a5be7a71200d5f9b6cae18ff', class: "stzh-ghettobox__description" }, this.description ? this.description : h("slot", null))), h("div", { key: '17a6094801cf5b8893c2caef3598b11138b86218', class: "stzh-ghettobox__button" }, h("slot", { key: '861af9a79943f7af4eedae7f6eef47173141536f', name: "button" }))), !this.hideClose && (h("stzh-button", { key: '77c36fa8edc07bfed825861e7030e3319fccc1c9', class: "stzh-ghettobox__close", onClick: this.onCloseButtonClick, a11yLabel: this.localization.close, variant: "tertiary", size: "small", iconOnly: true, icon: "close-big" }))))));
     }
     static get is() { return "stzh-ghettobox"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-homepage-search/stzh-homepage-search.js

@@ -44,7 +44,7 @@ export class StzhHomepageSearch {
             "stzh-homepage-search": true,
             "stzh-homepage-search--is-search-filled": this.searchFilled,
         };
-        return (h(Host, { key: '4610961dc501870db8ed1191bd3b3366db064457' }, h("div", { key: 'd60f3270c7a38944eb5fda27e408b091e9a91774', class: classes }, h("div", { key: 'f24ea7e0c067d7aa12f7b1ddeb56daec915ada4c', class: "stzh-homepage-search__container" }, h("form", { key: '440bc679283f7531be3fe781c91867adc99d1c58', class: "stzh-homepage-search__form", action: this.searchAction, role: "search", ref: el => (this.formElement = el) }, h("label", { key: '7e756fc59bb0b4be74dc9f9bccfb74946f31fb0f', class: "stzh-homepage-search__search" }, h("input", { key: 'b529d7acdf57467640d8502f11ca540a71314338', id: this.searchId, ref: el => (this.searchInput = el), class: "stzh-homepage-search__search-input", type: "search", name: this.searchFieldName, onChange: this.handleSearchChange, onInput: this.handleSearchInput, placeholder: this.placeholder }), h("stzh-icon", { key: 'a1315be821ca16e6d4a9ca7f0beff2b73ba74c9f', class: "stzh-homepage-search__search-icon", name: "search" })))))));
+        return (h(Host, { key: '4cf4819a55d07a025e3d241c63ce9983d2ffec0a' }, h("div", { key: '95c9f388125367c563cabb300d19e6edfc44c964', class: classes }, h("div", { key: 'b5d0ffb8deae388fb313002251b069f96b1aa4cc', class: "stzh-homepage-search__container" }, h("form", { key: 'cbc4fadb9b98f37975c379c09d2c004de1479f82', class: "stzh-homepage-search__form", action: this.searchAction, role: "search", ref: el => (this.formElement = el) }, h("label", { key: '5576c0b129a87cd53d5d30cc1cb3ff43a2f80ece', class: "stzh-homepage-search__search" }, h("input", { key: 'd52b782114a5ce3ff733aa927581d52ed594febd', id: this.searchId, ref: el => (this.searchInput = el), class: "stzh-homepage-search__search-input", type: "search", name: this.searchFieldName, onChange: this.handleSearchChange, onInput: this.handleSearchInput, placeholder: this.placeholder }), h("stzh-icon", { key: 'faa1b99a92dc31dfcf9ec71d0ea2198ebaef52b8', class: "stzh-homepage-search__search-icon", name: "search" })))))));
     }
     static get is() { return "stzh-homepage-search"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-homepage-service-highlights/stzh-homepage-service-highlights.js

@@ -78,14 +78,14 @@ export class StzhHomepageServiceHighlights {
             "stzh-homepage-service-highlights": true,
             "stzh-homepage-service-highlights--has-topnews": this._topnewsItems.length > 0,
         };
-        return (h(Host, { key: '55ecbb6644d3a1484777d490ef7733a92dbe6533' }, h("div", { key: 'fb6a15f4fc4184b1772c92241cfa21aac8bc2596', class: classes }, this._topnewsItems.length > 0 && (h("div", { key: '04870cf7bec04a384a87c3dd0a1bc9e7971769f6', class: "stzh-homepage-service-highlights__topnews" }, this._topnewsItems.map(item => !!item.href ? (h("a", { href: item.href, class: {
+        return (h(Host, { key: 'f76ccb3e58c70c21c0aa6c62624cf8c42687562f' }, h("div", { key: '94340a97824898f8b6938a8df805c745c11aa71e', class: classes }, this._topnewsItems.length > 0 && (h("div", { key: 'fc8d75cfe428d36ac0a479e42dc8b4b53fd18a82', class: "stzh-homepage-service-highlights__topnews" }, this._topnewsItems.map(item => !!item.href ? (h("a", { href: item.href, class: {
                 "stzh-topnews-item": true,
                 "stzh-topnews-item--highlighted": item.isHighlighted,
                 "stzh-topnews-item--has-link": true,
             } }, this.renderTopnewsItemInner(item))) : (h("div", { class: {
                 "stzh-topnews-item": true,
                 "stzh-topnews-item--highlighted": item.isHighlighted,
-            } }, this.renderTopnewsItemInner(item)))))), this._mostsearchedItems.length > 0 && (h("div", { key: '0d067f7d0cc189221132ccb7bdc5db175f1e11f9', class: "stzh-homepage-service-highlights__mostsearched" }, this._mostsearchedItems.map(item => (h("div", { class: {
+            } }, this.renderTopnewsItemInner(item)))))), this._mostsearchedItems.length > 0 && (h("div", { key: '38b1a9587d2412a0f5a797224313198a3fb5f4f3', class: "stzh-homepage-service-highlights__mostsearched" }, this._mostsearchedItems.map(item => (h("div", { class: {
                 "stzh-mostsearched-item": true,
             } }, h("stzh-link", { class: "stzh-mostsearched-item__link", href: item.href, icon: "arrow-right" }, item.label)))))))));
     }

package/dist/collection/components/CMS/stzh-linklist/stzh-linklist.js

@@ -1,4 +1,8 @@
 import { h, Host } from "@stencil/core";
+import { hasSlot } from "../../../utils/utils";
+/**
+ * @slot datalist - Slot for any content
+ */
 export class StzhLinklist {
     constructor() {
         this.heading = undefined;
@@ -10,7 +14,8 @@ export class StzhLinklist {
         const classes = {
             "stzh-linklist": true,
         };
-        return (h(Host, { key: 'f19b2d717ab47294b13615ebbbd5c287860d5bad', "padding-bottom": this.paddingBottom }, h("div", { key: 'fcb8a67146c4a981534b62aba8bb40582172ce1e', class: classes }, h("div", { key: '9bf487f10a02a80c419d4f83c882f00010385965', class: "stzh-linklist__wrapper" }, this.heading && (h("div", { key: '8dc142caf251cdeddedbc223ddf0994bcc517efd', class: "stzh-linklist__heading" }, h("stzh-heading", { key: 'bbae931c073d7834e00a7b636846a5aeb8f79ac9', level: this.headingLevel }, this.heading))), h("div", { key: 'cc72af1e813ab35d91c52299024f38a389c6ef54', class: "stzh-linklist__list" }, h("stzh-datalist", { key: '3e27fb4f2ed5169cf8cf08a1c09a95080a5d2bb8', verticalGap: "small", items: this.items }))))));
+        const datalistSlotUsed = hasSlot(this.element, "datalist");
+        return (h(Host, { key: 'e0002b58798035301beca5c368f7c71791f1cefc', "padding-bottom": this.paddingBottom }, h("div", { key: '7f12f6c9a26509abee7a89ae92af975e7bb9180c', class: classes }, h("div", { key: '7a45aa75e1a7883e0de45fc9b70b0ae832647031', class: "stzh-linklist__wrapper" }, this.heading && (h("div", { key: '75c41a5c5ee737913bcbde158a732f1b50a53295', class: "stzh-linklist__heading" }, h("stzh-heading", { key: '0ad21942860acaad9084395c9d75346dd117f21d', level: this.headingLevel }, this.heading))), h("div", { key: 'd56b413ffb445514a565891e4ed75ff638a9418b', class: "stzh-linklist__list" }, datalistSlotUsed ? (h("slot", { name: "datalist" })) : (h("stzh-datalist", { verticalGap: "small", items: this.items })))))));
     }
     static get is() { return "stzh-linklist"; }
     static get encapsulation() { return "scoped"; }
@@ -88,7 +93,7 @@ export class StzhLinklist {
                     "references": {
                         "StzhDatalistItemEntry": {
                             "location": "import",
-                            "path": "../../..",
+                            "path": "../../../index",
                             "id": "src/index.ts::StzhDatalistItemEntry"
                         }
                     }
@@ -105,5 +110,6 @@ export class StzhLinklist {
             }
         };
     }
+    static get elementRef() { return "element"; }
 }
 //# sourceMappingURL=stzh-linklist.js.map

package/dist/collection/components/CMS/stzh-linklist/stzh-linklist.js.map

@@ -1 +1 @@
-{"version":3,"file":"stzh-linklist.js","sourceRoot":"","sources":["../../../../../src/components/CMS/stzh-linklist/stzh-linklist.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQzD,MAAM,OAAO,YAAY;;;4BAIwC,GAAG;6BAGjC,IAAI;qBAEa,EAAE;;IAEpD,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,eAAe,EAAE,IAAI;SACtB,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,uEAAiB,IAAI,CAAC,aAAa;YACtC,4DAAK,KAAK,EAAE,OAAO;gBACjB,4DAAK,KAAK,EAAC,wBAAwB;oBAChC,IAAI,CAAC,OAAO,IAAI,CACf,4DAAK,KAAK,EAAE,wBAAwB;wBAClC,qEAAc,KAAK,EAAE,IAAI,CAAC,YAAY,IAAG,IAAI,CAAC,OAAO,CAAgB,CACjE,CACP;oBACD,4DAAK,KAAK,EAAC,qBAAqB;wBAC9B,sEAAe,WAAW,EAAC,OAAO,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,GAAkB,CAClE,CACF,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from \"@stencil/core\";\nimport { StzhDatalistItemEntry } from \"../../..\";\n\n@Component({\n  tag: \"stzh-linklist\",\n  styleUrl: \"stzh-linklist.scss\",\n  scoped: true,\n})\nexport class StzhLinklist {\n  /**Heading for the linklist*/\n  @Prop() heading: string;\n  /** Heading level */\n  @Prop({ reflect: true }) headingLevel: \"1\" | \"2\" | \"3\" | \"4\" = \"3\";\n  /**Whether the component had a padding-bottom or not\n   */\n  @Prop() paddingBottom: boolean = true;\n  /** The items that should be displayed in the link list */\n  @Prop() items: StzhDatalistItemEntry[] | string = [];\n\n  render() {\n    const classes = {\n      \"stzh-linklist\": true,\n    };\n\n    return (\n      <Host padding-bottom={this.paddingBottom}>\n        <div class={classes}>\n          <div class=\"stzh-linklist__wrapper\">\n            {this.heading && (\n              <div class={\"stzh-linklist__heading\"}>\n                <stzh-heading level={this.headingLevel}>{this.heading}</stzh-heading>\n              </div>\n            )}\n            <div class=\"stzh-linklist__list\">\n              <stzh-datalist verticalGap=\"small\" items={this.items}></stzh-datalist>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"stzh-linklist.js","sourceRoot":"","sources":["../../../../../src/components/CMS/stzh-linklist/stzh-linklist.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAElE,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C;;GAEG;AAMH,MAAM,OAAO,YAAY;;;4BAIwC,GAAG;6BAGjC,IAAI;qBAEa,EAAE;;IAIpD,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,eAAe,EAAE,IAAI;SACtB,CAAC;QAEF,MAAM,gBAAgB,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;QAE3D,OAAO,CACL,EAAC,IAAI,uEAAiB,IAAI,CAAC,aAAa;YACtC,4DAAK,KAAK,EAAE,OAAO;gBACjB,4DAAK,KAAK,EAAC,wBAAwB;oBAChC,IAAI,CAAC,OAAO,IAAI,CACf,4DAAK,KAAK,EAAE,wBAAwB;wBAClC,qEAAc,KAAK,EAAE,IAAI,CAAC,YAAY,IAAG,IAAI,CAAC,OAAO,CAAgB,CACjE,CACP;oBACD,4DAAK,KAAK,EAAC,qBAAqB,IAC7B,gBAAgB,CAAC,CAAC,CAAC,CAClB,YAAM,IAAI,EAAC,UAAU,GAAG,CACzB,CAAC,CAAC,CAAC,CACF,qBAAe,WAAW,EAAC,OAAO,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,GAAkB,CACvE,CACG,CACF,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Element, Prop } from \"@stencil/core\";\nimport { StzhDatalistItemEntry } from \"../../../index\";\nimport { hasSlot } from \"../../../utils/utils\";\n\n/**\n * @slot datalist - Slot for any content\n */\n@Component({\n  tag: \"stzh-linklist\",\n  styleUrl: \"stzh-linklist.scss\",\n  scoped: true,\n})\nexport class StzhLinklist {\n  /**Heading for the linklist*/\n  @Prop() heading: string;\n  /** Heading level */\n  @Prop({ reflect: true }) headingLevel: \"1\" | \"2\" | \"3\" | \"4\" = \"3\";\n  /**Whether the component had a padding-bottom or not\n   */\n  @Prop() paddingBottom: boolean = true;\n  /** The items that should be displayed in the link list */\n  @Prop() items: StzhDatalistItemEntry[] | string = [];\n\n  @Element() element: HTMLStzhPiPagetitleElement;\n\n  render() {\n    const classes = {\n      \"stzh-linklist\": true,\n    };\n\n    const datalistSlotUsed = hasSlot(this.element, \"datalist\");\n\n    return (\n      <Host padding-bottom={this.paddingBottom}>\n        <div class={classes}>\n          <div class=\"stzh-linklist__wrapper\">\n            {this.heading && (\n              <div class={\"stzh-linklist__heading\"}>\n                <stzh-heading level={this.headingLevel}>{this.heading}</stzh-heading>\n              </div>\n            )}\n            <div class=\"stzh-linklist__list\">\n              {datalistSlotUsed ? (\n                <slot name=\"datalist\" />\n              ) : (\n                <stzh-datalist verticalGap=\"small\" items={this.items}></stzh-datalist>\n              )}\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/CMS/stzh-linklist/stzh-linklist.stories.js

@@ -8,7 +8,40 @@ const COMPONENT_NAME = 'stzh-linklist';
 const story = createComponentStory(COMPONENT_NAME);
 
 const TEMPLATE = `
-<stzh-linklist></stzh-linklist>
+<stzh-linklist>
+</stzh-linklist>
+`;
+
+const TEMPLATE_SLOTTED = `
+<stzh-linklist>
+<stzh-datalist slot="datalist">
+  <div class="layout_column">
+    <div class="section link">
+      <stzh-datalist-item href="#" value="Relative link"></stzh-datalist-item>
+    </div>
+  </div>
+  <div class="layout_column">
+    <div class="section link">
+      <stzh-datalist-item href="#" value="External link" rel="external nofollow" target="_blank"></stzh-datalist-item>
+    </div>
+  </div>
+  <div class="layout_column">
+    <div class="section link">
+      <stzh-datalist-item href="#" label="Label" value="Relative link with label"></stzh-datalist-item>
+    </div>
+  </div>
+  <div class="layout_column">
+    <div class="section link">
+      <stzh-datalist-item href="#" label="Label" value="Download link" download meta='["PDF", "1 Seite", "60 KB"]'></stzh-datalist-item>
+    </div>
+  </div>
+  <div class="layout_column">
+    <div class="section link">
+      <stzh-datalist-item href="#" label="Label" value="Download link" download meta='["PDF", "1 Seite", "60 KB"]' icon="volume-medium" icon-href="#"></stzh-datalist-item>
+    </div>
+  </div>
+</stzh-datalist>
+</stzh-linklist>
 `;
 
 const TEMPLATE_DATALIST = `
@@ -95,6 +128,10 @@ export const Default = {
   }
 };
 
+export const Slotted = {
+  render: (args) => story(args, TEMPLATE_SLOTTED)
+};
+
 export const WithTitle = {
   render: (args) => story(args, TEMPLATE),
   args: {

package/dist/collection/components/CMS/stzh-microsite-teaserlist/stzh-microsite-teaserlist.js

@@ -72,7 +72,7 @@ export class StzhMicrositeTeaserlist {
         const classes = {
             "stzh-microsite-teaserlist": true,
         };
-        return (h(Host, { key: '037ac3c273bd4f15ece3e41a1e2b3f607470429d' }, h("div", { key: '75a12d422b3a13b94bc5f7f18675ea43a73e8c41', class: classes }, this._tagChips.length > 0 && (h("stzh-chipselect", { key: '1b9893a0d1f054d5f4e594772fc3cf3e04d16dfd', "hide-optional": true, "label-hidden": true, class: "stzh-microsite-teaserlist__filter", label: this.localization.tagsLabel, data: this._tagChips, onStzhChange: this.handleChange })), h("stzh-cardlist", { key: 'e1d62163c5d29bb66f28fa1d79f402a2e5863766', layout: "teasers" }, this._filteredSlicedItems.map(item => (h("stzh-card", { href: item.link }, item.image && (h("stzh-ratio", { slot: "image" }, h("img", { src: item.image }))), item.title && h("div", { slot: "heading" }, item.title), item.description && h("div", { slot: "content" }, item.description))))), this._showMoreLink && (h("div", { key: 'd118f38950ab4fb6a68b31b0988acf6d86177ae0', class: "stzh-microsite-teaserlist__show-more" }, h("stzh-button", { key: 'fafcc6bdf5c1047d5f48de45f6d05a42fbd198e8', variant: "secondary", label: this.localization.showMore, onClick: this.handleMoreClick }))))));
+        return (h(Host, { key: '33f709ed60ff013d3e0c123f19a4d86b0bff9128' }, h("div", { key: '43aac0009c91d4f7ac0c0961773b792bc2cec274', class: classes }, this._tagChips.length > 0 && (h("stzh-chipselect", { key: '815b9b392e0862973c2da64e77b24f4d6bcfc63d', "hide-optional": true, "label-hidden": true, class: "stzh-microsite-teaserlist__filter", label: this.localization.tagsLabel, data: this._tagChips, onStzhChange: this.handleChange })), h("stzh-cardlist", { key: 'd521939456bbf16acfe6f2ea7aebcd2183818e76', layout: "teasers" }, this._filteredSlicedItems.map(item => (h("stzh-card", { href: item.link }, item.image && (h("stzh-ratio", { slot: "image" }, h("img", { src: item.image }))), item.title && h("div", { slot: "heading" }, item.title), item.description && h("div", { slot: "content" }, item.description))))), this._showMoreLink && (h("div", { key: '7c3f1712e6ae03f25746daecaffc6c1d7e56e455', class: "stzh-microsite-teaserlist__show-more" }, h("stzh-button", { key: '0cc6a2d32a1aa5180909aec516d0b0eafd3c2f9b', variant: "secondary", label: this.localization.showMore, onClick: this.handleMoreClick }))))));
     }
     static get is() { return "stzh-microsite-teaserlist"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-page-skiplinks/stzh-page-skiplinks.js

@@ -25,7 +25,7 @@ export class StzhPageSkiplinks {
         }
     }
     render() {
-        return (h(Host, { key: '409810be74740c94b493b890d43999a2c4c9b1d6' }, h("div", { key: '90e6ff829f95acaee31fb61e32266737022f36cd', class: "stzh-page-skiplinks", role: "list" }, h("slot", { key: '58eec930796c55319ca33753f87a751eda4c368a' }))));
+        return (h(Host, { key: '8d08d198d36044d8db4d092aebe367b36f1b33bd' }, h("div", { key: 'adeea901b72554cbc7bf68deb21b97e3d1d96ea3', class: "stzh-page-skiplinks", role: "list" }, h("slot", { key: '31415fd96e02e3dcbbf052302614a182db711904' }))));
     }
     static get is() { return "stzh-page-skiplinks"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pagebottom/stzh-pagebottom.js

@@ -27,7 +27,7 @@ export class StzhPagebottom {
             "stzh-pagebottom": true,
             rs_skip: true, // will prevent component being read by readspeaker
         };
-        return (h(Host, { key: '86b219e13a6c85c70e372c828e974bdc65e46008' }, h("div", { key: '20bba21d493d56f2eb5a7939bf3caabbb4dbf32f', class: classes }, h("div", { key: 'e81fc4ef130048b7622c84d079b078a12ef130b5', class: "stzh-pagebottom__wrapper" }, h("div", { key: '9187966337d643df6040607705cbd70555205a15', class: "stzh-pagebottom__left" }, this.withPrint && (h("div", { key: '937f70cb75fc59de9d7d057f4694efd2a0fdc8ce', class: "stzh-pagebottom__print" }, h("stzh-print", { key: '31357b288e32c8948844ba7826641937904bac28' }, h("stzh-button", { key: 'b5077a2e0d80c9423e4a121076313ed9c1672c0b', label: this.localization.printLabel, variant: "tertiary-plain", size: "small", noPaddingLeft: true, noPaddingRight: true, analyticsId: this.printAnalyticsId })))), !this.shareDisabled && (h("div", { key: '9e2fef4459e773003ec4ac3493cf9b9905b4c3a4', class: "stzh-pagebottom__share-wrapper" }, this.shareTitle && h("div", { key: 'eb8d45284496f544c25b900cc77ce1ac204ea719', class: "stzh-pagebottom__share-title" }, this.shareTitle), h("stzh-share", { key: '97d0740070666ef7b6843220e562cdf78ecccff0', url: this.shareUrl, services: this.shareServices, mailSubject: this.shareMailSubject, mailBody: this.shareMailBody })))), h("div", { key: '5266eb1985d2c8574ca59a9365f971ac877b9f6c', class: "stzh-pagebottom__sticky-actions" }, h("slot", { key: '6c5455890be560cac1382688757fe5f9d21dc073', name: "sticky-actions" }))))));
+        return (h(Host, { key: '005deb84142b76635d8470da6adaff17ed108958' }, h("div", { key: '73bb1bf4226953f7447768d9c1eed3bfc01ba646', class: classes }, h("div", { key: 'd8530fe4842bf7d12d41bc34e77d49134df1b29b', class: "stzh-pagebottom__wrapper" }, h("div", { key: 'd478518d4b7ff3c5efddf845563a290881df671c', class: "stzh-pagebottom__left" }, this.withPrint && (h("div", { key: 'fac78db6e63ce1a66e7d060f1ec451958b3e0889', class: "stzh-pagebottom__print" }, h("stzh-print", { key: '3e514058ba6b66a96fdfb3f31d0047e25c66eb59' }, h("stzh-button", { key: '922c3ea2036de895cb385f4cd18e8905150cc7fa', label: this.localization.printLabel, variant: "tertiary-plain", size: "small", noPaddingLeft: true, noPaddingRight: true, analyticsId: this.printAnalyticsId })))), !this.shareDisabled && (h("div", { key: '6090a666612fe829464a70a04251ec5de350480a', class: "stzh-pagebottom__share-wrapper" }, this.shareTitle && h("div", { key: '8c9b1f9819f6f4d725acf93b06771baafb437254', class: "stzh-pagebottom__share-title" }, this.shareTitle), h("stzh-share", { key: '27f1d54b536bba53ca35f561de163b51175fc59f', url: this.shareUrl, services: this.shareServices, mailSubject: this.shareMailSubject, mailBody: this.shareMailBody })))), h("div", { key: '7937e815e89689189415eb7512017aa35264decb', class: "stzh-pagebottom__sticky-actions" }, h("slot", { key: 'b058ae842711f3a054e8efbee759c0c235db4af4', name: "sticky-actions" }))))));
     }
     static get is() { return "stzh-pagebottom"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pagecontent/stzh-pagecontent.js

@@ -14,7 +14,7 @@ export class StzhPagecontent {
             "stzh-pagecontent--has-aside-left": hasAsideLeft || hasAnchornav,
             "stzh-pagecontent--has-no-aside-left": !hasAsideLeft && !hasAnchornav,
         };
-        return (h(Host, { key: '4d9f85a23cdf707919faf0ca310094e998d9eab3' }, h("div", { key: '229b94d83ac0b07aff14a0c4c8aaecc73bbfbeb1', class: classes }, h("aside", { key: '44b74f2b05773a3fc24366a1d2a4f032b90f111c', class: "stzh-pagecontent__aside-left" }, h("div", { key: 'eca1e7294926c27c021d03cad273a9b3c2962b0d', class: "stzh-pagecontent__anchornav" }, h("slot", { key: 'afa16547566f035323f9032282303585bb2a7fb4', name: "anchornav" })), h("slot", { key: '8b1ac4b7aa2cfe6baf02538bfef73f163c958030', name: "aside-left" })), h("div", { key: '14703cd1bf2a490371046412586ba863ade146c9', class: "stzh-pagecontent__content" }, h("slot", { key: '12ffb5f3807742bbbddd7e70ba94a44e9db91799' })))));
+        return (h(Host, { key: 'f726915c77fb50da570f9464c11423e5a8ccd89a' }, h("div", { key: 'd41812115b4a4acde596e6a0ab9f010cbd0a61cb', class: classes }, h("aside", { key: 'c66267f8d7d3cedc013a2ec928ed4c45c03255f8', class: "stzh-pagecontent__aside-left" }, h("div", { key: 'e4e90e268463053ebacfbce8ff4812a737fe7367', class: "stzh-pagecontent__anchornav" }, h("slot", { key: '08a0ca43c98fd32d7ef4585d7dcb5e4720f2865c', name: "anchornav" })), h("slot", { key: 'a423a6bd099c5891ef13aea3ff2ed09703b8b952', name: "aside-left" })), h("div", { key: '1cdcdf7717832b8d55634a4775f6f5ebda741126', class: "stzh-pagecontent__content" }, h("slot", { key: 'a67910955cf2adde8784169a5ff9bb3d3306871a' })))));
     }
     static get is() { return "stzh-pagecontent"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pagetitle/stzh-pagetitle.js

@@ -134,7 +134,7 @@ export class StzhPagetitle {
             "stzh-pagetitle--hyphens": this.hyphensEnabled,
             [`stzh-pagetitle--background-${this.background}`]: !!this.background,
         };
-        return (h(Host, { key: 'dd1dae5e9d6238ffdac9b57bee9028c6ab293a9e' }, h("div", { key: '7692e22c130fb9d768d54c57e56aea0bf5f49e75', class: classes }, h("div", { key: '276b719825766581a9310b2da3f2a8da24fc3ca8', class: "stzh-pagetitle__container" }, h("div", { key: '4edbf3c08ace8896ad635561e564fdfcfe9b0636', class: "stzh-pagetitle__wrapper" }, h("div", { key: 'b0d87b0ff4c587809434424dbe4b5ea820486849', class: "stzh-pagetitle__text" }, h("div", { key: '644c747a9faf9dec771338668bf8b1400ca0f22b', class: "stzh-pagetitle__meta" }, h("div", { key: '308d1af6ca44ed4e529f7b3f2c842c3cc5b433a8', class: "stzh-pagetitle__tag" }, h("slot", { key: '45d323f77a910db3c3333d71a4fca19e9df09de2', name: "tag" })), h("div", { key: '8c5f81a671e670b450efc5c689cba18b4146be34', class: "stzh-pagetitle__readspeaker" }, h("slot", { key: '53ca3e154eba02986ebb6a6243b01cdf211ec8e0', name: "readspeaker" }))), this.dateline && h("div", { key: '4c75ea7565d6d7ace87e4d315c21eaf2afad2ee4', class: "stzh-pagetitle__dateline" }, this.dateline), h("div", { key: 'a26fc81a10690ac96d14dd298a195861001feeb4', class: "stzh-pagetitle__heading" }, h("slot", { key: '187a4b8f2c292263c9176fea2fe421d78f43aeeb', name: "heading" })), h("div", { key: '187da73cdbbc557ad0609f83fee27a982b400d90', class: "stzh-pagetitle__lead" }, h("slot", { key: '0209e7b1c9431237292c7d62db87c95f58f89855', name: "lead" }))), h("div", { key: '8e9b473d1b013b1cef1b0df537612568cf0849e8', class: "stzh-pagetitle__image-wrapper" }, h("stzh-ratio", { key: '3d360e87e41d8ad5f8cdd292ca4d6d971af1c3fb', ratio: "16:9", ratioSmall: "3:2", ratioMedium: "16:9", class: "stzh-pagetitle__ratio" }), h("div", { key: '77fe51987394ce4d61e4b809bf3c1ed3e0231dcf', class: "stzh-pagetitle__image-inner-wrapper" }, h("slot", { key: '74b4a5695c7fcd3f9dbdd11d2e6eae6f9cd395d6', name: "image" }))), h("div", { key: '70f64853370f205febf986d7b0f405aa5d635371', class: "stzh-pagetitle__disturber", ref: el => (this.disturberElement = el) }, h("slot", { key: '8e45414bd0ef9b94029098bd2998ea3c6fb0c64d', name: "disturber" })))))));
+        return (h(Host, { key: '44f334e63ff5db5a9a1d97e849da679dcc31839b' }, h("div", { key: '30456eb5fd2763ea488a1dafc7b2aee3e0ed4377', class: classes }, h("div", { key: 'f01d7ffba4f3347a13d85be74f41b37daa6bcaec', class: "stzh-pagetitle__container" }, h("div", { key: 'cb24305da741c280db8f91c77e61cbf51a7c1bf8', class: "stzh-pagetitle__wrapper" }, h("div", { key: '37ba4fbeea5c5a05b404cdf7985f8c813bea71a8', class: "stzh-pagetitle__text" }, h("div", { key: '073ba56929ce3463d71050652ea1462c685e27cf', class: "stzh-pagetitle__meta" }, h("div", { key: '2ffd8a096f4b83604499bd7f2ec0d7a854663647', class: "stzh-pagetitle__tag" }, h("slot", { key: 'e46fe24b23852c524aa8022892451835c1ffa798', name: "tag" })), h("div", { key: '9e1427369474667936816c937c05460db2ca9e32', class: "stzh-pagetitle__readspeaker" }, h("slot", { key: '381371798764e856e046768e2e8400e9721bb3b9', name: "readspeaker" }))), this.dateline && h("div", { key: 'd506066275fcd82211fe691d6b679b5ba93afe15', class: "stzh-pagetitle__dateline" }, this.dateline), h("div", { key: '5d9808dd2aebe14646a7b550cca1dcc69e1a61f1', class: "stzh-pagetitle__heading" }, h("slot", { key: 'a466725b4361d869036486ad2ecdb461a53f6be5', name: "heading" })), h("div", { key: '09c87ce1f8caba89b916e122fdb033018040254c', class: "stzh-pagetitle__lead" }, h("slot", { key: 'df1436e56e97f206efa49f846e714db15e56f1b7', name: "lead" }))), h("div", { key: '3481dfdd6294adae1b326882b5b2661548cbfaca', class: "stzh-pagetitle__image-wrapper" }, h("stzh-ratio", { key: 'bfee946466a4e6244ca71f775151929d1a225a4a', ratio: "16:9", ratioSmall: "3:2", ratioMedium: "16:9", class: "stzh-pagetitle__ratio" }), h("div", { key: '5bb505e0c6fb23c54cca77cdd4bb80c96388d6ad', class: "stzh-pagetitle__image-inner-wrapper" }, h("slot", { key: 'c45840b576424d1b0a6185f3fb48c3ecf06f5884', name: "image" }))), h("div", { key: '2358fb35eda7fa73e9d0ee107bb9bed919e6297a', class: "stzh-pagetitle__disturber", ref: el => (this.disturberElement = el) }, h("slot", { key: '89902de8265bc604db44feb9f7e6a1068253c495', name: "disturber" })))))));
     }
     static get is() { return "stzh-pagetitle"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pagetitle-hero/stzh-pagetitle-hero.js

@@ -84,7 +84,7 @@ export class StzhPagetitleHero {
             "stzh-pagetitle-hero--has-no-lead": !leadSlotUsed,
             "stzh-pagetitle-hero--has-back-link": backLinkSlotUsed,
         };
-        return (h(Host, { key: '4092fdf29e81da467a01ce14169ef0a236fa1e81' }, h("div", { key: 'a3a5fa6f25707cfc669ebc2068c7659b2ede3a75', class: classes }, h("div", { key: '44705be15cd02e32cd63089fec428ca89f274c4e', class: "stzh-pagetitle-hero__header" }, h("div", { key: '3368ece2fcb33a65b43ef1d69cac47bfabacd7a6', class: "stzh-pagetitle-hero__back-link" }, h("slot", { key: 'e9a10e3a4ea5f63929e4a5b1a36f5d1a70c00744', name: "back-link" })), h("div", { key: 'c469457f5348d0fbaa824bf440078320e8a32596', class: "stzh-pagetitle-hero__image-wrapper" }, h("div", { key: 'fc53ef3d0dcfde0d119e7027b4d9188b900c751c', class: "stzh-pagetitle-hero__image-ratio" }), h("slot", { key: '9ae6ec6a9935a3aa4ffd8053c18664067d6680cb', name: "image" })), h("div", { key: '0f0f8af4c8f2112e2e6c3b93e21271e827366052', class: "stzh-pagetitle-hero__title-wrapper" }, h("div", { key: '58645c0a1a06a5989dcbcceecff1257bf9f014ff', class: "stzh-pagetitle-hero__tags", role: "list" }, h("slot", { key: '4c6eee91b82a84e6aebbf47bd7579a0ed38aac14', name: "tag" })), h("div", { key: '41d1ef58eab92d23dd56280f366372e1f314ad9d', class: "stzh-pagetitle-hero__title-parent" }, h("h1", { key: '08158f41da5669da5cee4d65f66022220f7c7304', ref: el => (this.mainTitleElement = el), class: "stzh-pagetitle-hero__title", id: this.headingId, innerHTML: this.heading })), this.subtitle && h("div", { key: 'fcc6c8049f43836f7ed054225c0f32c50161c19c', class: "stzh-pagetitle-hero__subtitle" }, this.subtitle))), h("div", { key: '281ce8413afb63bd550af21b02eeed4337c979f9', class: "stzh-pagetitle-hero__lead" }, h("slot", { key: '992301a3e044847bc796daa82ffe749c2e9055d0', name: "lead" }), h("div", { key: 'ffb40b5bf0fc473a8b1c3acdd9fe10c699fd5063', class: "stzh-pagetitle-hero__lead-author" }, this.leadAuthor)))));
+        return (h(Host, { key: '7131fb3579b554c83ed04bfe3adf7a334cea4a11' }, h("div", { key: 'ae93f4d178c03843cc294dc161b2f86745da9df5', class: classes }, h("div", { key: 'bfc41e3c232ba164871607a2545e767e212998d5', class: "stzh-pagetitle-hero__header" }, h("div", { key: 'b0f8eeff9b5a96b3351d0caa67d9c054486b21be', class: "stzh-pagetitle-hero__back-link" }, h("slot", { key: 'f0d6ac1f0ce21887f59a86b3972ed8ca5a5503b2', name: "back-link" })), h("div", { key: '4b1b3be34cb11c0d681ef1b0fde01d32102feb28', class: "stzh-pagetitle-hero__image-wrapper" }, h("div", { key: '4910095f7a2168ee467e366e743d8b345d2a1a03', class: "stzh-pagetitle-hero__image-ratio" }), h("slot", { key: '7ba9ad2669e9c7e2e2107fc0af9794ad712f1dfa', name: "image" })), h("div", { key: '0149cf3acc30fcf1cc9a69893b64256789cbb365', class: "stzh-pagetitle-hero__title-wrapper" }, h("div", { key: '6a333694de2e2afe32b9876495d3f06852f0f458', class: "stzh-pagetitle-hero__tags", role: "list" }, h("slot", { key: 'a2d242d2e4b05b43430ef358f1284a349750b5d6', name: "tag" })), h("div", { key: 'afddda21b9a8c4582fa9d4ce93bde060767182b1', class: "stzh-pagetitle-hero__title-parent" }, h("h1", { key: 'b91e3e159a07f765be288379646506e080668a48', ref: el => (this.mainTitleElement = el), class: "stzh-pagetitle-hero__title", id: this.headingId, innerHTML: this.heading })), this.subtitle && h("div", { key: 'c1a796b7ca15da84d12da31c92c4248e76ad5c55', class: "stzh-pagetitle-hero__subtitle" }, this.subtitle))), h("div", { key: '9c58abab4911b1ade0ecf535cd7766113e77dbf9', class: "stzh-pagetitle-hero__lead" }, h("slot", { key: '319faf271c067665cfe0101293250cce130bb656', name: "lead" }), h("div", { key: '2afffcdf300dae75622fa3da9cbd671a9a7411d9', class: "stzh-pagetitle-hero__lead-author" }, this.leadAuthor)))));
     }
     static get is() { return "stzh-pagetitle-hero"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pagetitle-home/stzh-pagetitle-home.js

@@ -73,7 +73,7 @@ export class StzhPagetitleHome {
             "stzh-pagetitle-home--hyphens": this.hyphensEnabled,
             "stzh-pagetitle-home--has-meta": readspeakerSlotUsed,
         };
-        return (h(Host, { key: 'b638d153bcfb7b4fe87b87b29d7320583775bd46', "has-image": imageSlotUsed }, h("div", { key: '68999d5a6d6ec3470b2d7b90fa7240fb101f8972', class: classes }, h("div", { key: '01da18fe59c497bd145f9d6db14334fc518f9063', class: "stzh-pagetitle-home__image-wrapper" }, h("stzh-ratio", { key: '058edc2961c2f6f186711bdb0904d1998eb0e990', ratio: "1:1", ratioSmall: "16:9", ratioMedium: "2:1", ratioLarge: "21:9", class: "stzh-pagetitle-home__ratio" }), h("div", { key: '925bbfc859262fd6d2ff3ab2130d1e3d82f85b44', class: "stzh-pagetitle-home__image-gradient" }), h("div", { key: '6b26d4baaa957d85f8ff20d62380a18734fbbc6a', class: "stzh-pagetitle-home__image-inner-wrapper" }, h("slot", { key: '70101199a9e82da6a40dd921a7d961f82b1eb764', name: "image" }))), h("div", { key: 'b0110b6de4093b9f62993ccbf3fcea7adbaf23d9', class: "stzh-pagetitle-home__container" }, h("div", { key: '13050ea6e6d918ef44cf8a9aa7168d9b5619cace', class: "stzh-pagetitle-home__wrapper" }, h("div", { key: 'c324c43fe755b7716d11b1734304656c464f2f50', class: "stzh-pagetitle-home__text" }, h("div", { key: '8368115a3c0629aec8ba5b427aac8fe1b11de5da', class: "stzh-pagetitle-home__meta" }, h("div", { key: 'b03e94e3011103f27a3344e08d0889b2a8f3beba', class: "stzh-pagetitle-home__readspeaker" }, h("slot", { key: '693a60c6dab6698c2ff8c526e8635c2c7b69d371', name: "readspeaker" }))), h("div", { key: 'a4b9dcf0f9f62b21d5077cb070baeefe98a79613', class: "stzh-pagetitle-home__heading" }, h("slot", { key: '42b95509e25a8496ebb19f6e20d48526dc981a41', name: "heading" })), h("div", { key: '9f115338a44493e71aab896f8610962e139cda0e', class: "stzh-pagetitle-home__subheading" }, h("slot", { key: '298604d1fce9000561b0aeac82fa13e84700821f', name: "subheading" }))))))));
+        return (h(Host, { key: 'a6b5a908d562b6d6f595e92178b884c6c45f46f3', "has-image": imageSlotUsed }, h("div", { key: 'babedc3294a807918c5c8e66aaf9e6a497d0aa19', class: classes }, h("div", { key: 'a91f46ddc54b508eddaef1bd9b961e225f3b29bf', class: "stzh-pagetitle-home__image-wrapper" }, h("stzh-ratio", { key: '6fdd7ae67e9d3c37ea3b4c5abdbf83900f4ad724', ratio: "1:1", ratioSmall: "16:9", ratioMedium: "2:1", ratioLarge: "21:9", class: "stzh-pagetitle-home__ratio" }), h("div", { key: '85a80d1fc9c2b64fe884deb0ff4783a8875ba882', class: "stzh-pagetitle-home__image-gradient" }), h("div", { key: '06016f5efb8b69effaeccd47c672b0bf400bf652', class: "stzh-pagetitle-home__image-inner-wrapper" }, h("slot", { key: '30026bf3cf9fa3542d21163d75e30112296b1333', name: "image" }))), h("div", { key: '266b6330efdc3724a8f4055cf1117d51402b7a6d', class: "stzh-pagetitle-home__container" }, h("div", { key: '2bb3e41d69a23d18d9c75ff79b293ac17b93b49a', class: "stzh-pagetitle-home__wrapper" }, h("div", { key: '570d416be79b7d1b82772c10d07d0a709708f426', class: "stzh-pagetitle-home__text" }, h("div", { key: '04e39163a9bad8ba4ef5385a5f0503a72292d6a0', class: "stzh-pagetitle-home__meta" }, h("div", { key: '6318ed166a9502c9966fd9bc67c6ff764ccf0af1', class: "stzh-pagetitle-home__readspeaker" }, h("slot", { key: '3f1506b2d98b9ebf56734b77b0426a9cf01c4e50', name: "readspeaker" }))), h("div", { key: '85ae0b1b6aa706aff5f2cff5223b0c737f6723ce', class: "stzh-pagetitle-home__heading" }, h("slot", { key: 'b09c9b60fba35f97c4f481293ae05f849a543646', name: "heading" })), h("div", { key: '024e544ef0657fc490485aff1b745b54f034b070', class: "stzh-pagetitle-home__subheading" }, h("slot", { key: 'c015ffb08dee3ee824a7745743cb66c6e28928b5', name: "subheading" }))))))));
     }
     static get is() { return "stzh-pagetitle-home"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pi-content-navigation/stzh-pi-content-navigation.js

@@ -48,7 +48,7 @@ export class StzhPiContentNavigation {
             "stzh-pi-content-navigation--is-navigation-level-1-or-2": isNavigationLevel1or2,
         };
         const CardLink = this.href ? "a" : "button";
-        return (h(Host, { key: 'c42abe95e0d73723d1f0cf2aa751973a5a583c62', "has-lead": hasLead }, h("article", { key: '879c274c2073ea1ce0c5b6017233b610365d7aa2', class: classes, "aria-label": this.heading, role: "listitem" }, h(CardLink, { key: '8332f0c407d0c69d8c063ab1667a6c1465993925', ref: el => (this.cardLinkElement = el), class: "stzh-pi-content-navigation__title-link", href: this.href, target: this.target, onClick: this.handleCardClick }, h("div", { key: 'aeb3927354ce525cbe6edee3ae7226409de22a7e', class: "stzh-pi-content-navigation__image" }, h("stzh-ratio", { key: 'da9d6a69d53465d9171c7c6ab0e96bd1dc985024', ratio: "2:1" }, h("slot", { key: 'dfd6406a810fd11a13bc0f2670df982e33096103', name: "image" }))), shouldRenderTitleRatio && (h("div", { key: '4399f9261a7546906257c928c511aeac337feda2', class: "stzh-pi-content-navigation__title-ratio" }, this.renderHeading())), h("div", { key: 'cc0310c4e4ba422fc5f7a171206aa7902bea2052', class: "stzh-pi-content-navigation__wrapper" }, !shouldRenderTitleRatio && this.renderHeading(), hasLead && (h("div", { key: '0de77793c29c75685a56e073b15ff5b2b84321e9', class: "stzh-pi-content-navigation__lead" }, this.lead ? this.lead : h("slot", { name: "lead" })))), h("div", { key: '6d5307769334e8f1da198b5d375a4141aae31b2a', class: "stzh-pi-content-navigation__arrow" }, h("stzh-icon", { key: '89a95c1f263261738f1578db407e9121f3807775', class: "stzh-pi-content-navigation__arrow-icon", name: "arrow-right" }))))));
+        return (h(Host, { key: '76c5d185c4b95277345a7553e2fb2624b2381c73', "has-lead": hasLead }, h("article", { key: 'c6951fc908a7c16cd6664e74dd895339628c96b4', class: classes, "aria-label": this.heading, role: "listitem" }, h(CardLink, { key: 'f5124cbc29d5e191d30410d41c21c575dfb0b7f5', ref: el => (this.cardLinkElement = el), class: "stzh-pi-content-navigation__title-link", href: this.href, target: this.target, onClick: this.handleCardClick }, h("div", { key: '6ffc74e56bc15e97d56290b67dcad105fe37464d', class: "stzh-pi-content-navigation__image" }, h("stzh-ratio", { key: 'd1f29fd45d125151bf697b5a69ea2a804823dc24', ratio: "2:1" }, h("slot", { key: 'cccf70fe733b2a71813fd04fedcf8f8120d47049', name: "image" }))), shouldRenderTitleRatio && (h("div", { key: '4f060613a6dc993ffebe15c33752bdb118418e21', class: "stzh-pi-content-navigation__title-ratio" }, this.renderHeading())), h("div", { key: 'dc35588c012f3fc1736ae8fbb9b5c01f19587db8', class: "stzh-pi-content-navigation__wrapper" }, !shouldRenderTitleRatio && this.renderHeading(), hasLead && (h("div", { key: '4157f021b2f12c6f36a3de1d71155704c73689f3', class: "stzh-pi-content-navigation__lead" }, this.lead ? this.lead : h("slot", { name: "lead" })))), h("div", { key: '2d1949deebd2556d9994df1d8d372aebe44135e7', class: "stzh-pi-content-navigation__arrow" }, h("stzh-icon", { key: 'd24c8c04a36f75c80c15e7801e65559820a0b587', class: "stzh-pi-content-navigation__arrow-icon", name: "arrow-right" }))))));
     }
     static get is() { return "stzh-pi-content-navigation"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pi-menu/stzh-pi-menu.js

@@ -250,7 +250,7 @@ export class StzhPiMenu {
         // Screens medium, large and ultra
         const wideScreens = `${this.entangledMenuSize}px`;
         const menuWidth = this.open ? (this.isMedium ? wideScreens : narrowScreens) : this.isMedium ? wideScreens : closed;
-        return (h(Host, { key: '8d814a8e0e79688c18cf252a97027944664eaeee', tabindex: this.rootTabindex, onFocus: this.onRootFocus }, h("div", { key: 'e4048c92028b18c3a6e2bd0a33200b80cbf63bef', class: "stzh-pi-menu-positioner" }, h("div", { key: '58cba2e20480c28bea85e7268370aeb686785f2f', class: classes, style: { width: menuWidth } }, h("div", { key: '427a08f026aa5f274e6358e44e21d01754c88322', class: backdropClasses, onClick: this.handleBackdropClick }), h(Heading, { key: '9e3b71a442ad935930fa47961dfcce387220dd27', class: "stzh-pi-menu__heading", onClick: this.handleHeaderClick }, h("button", { key: '76e742716dc800c260ad509413efa3abcf2b7b1c', ref: el => (this.buttonElement = el), class: "stzh-pi-menu__button", "aria-expanded": `${this.open ? "true" : "false"}`, type: "button", "s-object-id": this.analyticsId || this.heading }, h("span", { key: 'd907834e673e9838d75120b239f3bba9574cbf43', class: "stzh-pi-menu__button-text" }, this.heading), h("stzh-icon", { key: 'a0aee001981739d866c75673f4e9739b299aa9f9', name: "angle-down", class: "stzh-pi-menu__button-icon" }))), h("div", { key: 'f48db0525c4aa919af26b0b102e187b0fba12175', id: `${this.piMenuId}-content`, ref: el => (this.bodyElement = el), class: "stzh-pi-menu__content", "aria-labelledby": `${this.piMenuId}-header`, role: "region" }, h("div", { key: '7d601e993e68d909bada6b7f73690b4b544d5f94', class: "stzh-pi-menu__content-inner" }, h("nav", { key: '16f78af2613d5d627ae425012e8ace36788d9c37', class: "stzh-pi-menu__nav", "aria-label": this.localization.menuLabel }, this.subheading && h("p", { key: '861ad618e88385525ce7455e3c3c3eeeb085ca97', class: "stzh-pi-menu__subheading" }, this.subheading), h("ul", { key: '3c57f05aa34ab8c0900c41f61beba7ad28dca17e', class: "stzh-pi-menu__nav-list is-level-1" }, this._menuItems.map((item, index) => (h("li", { class: "stzh-pi-menu__nav-list-item" }, this.isMedium || this.isLarge || this.isUltra ? (h("div", null, this.setSubMenuHeader(item), this.setSubMenuItems(item))) : (h("stzh-details", { open: index === 0 }, this.setSubMenuHeader(item), h("div", { slot: "content" }, this.setSubMenuItems(item)))))))))))), h("button", { key: 'fb870cbd1098cab33cdcd3a641146cd591bde3bc', class: "stzh-pi-menu__button stzh-pi-menu__button-space-helper", "aria-hidden": "true", type: "button" }, h("span", { key: 'f4073640a70396980e8d3a3305dbd58858cc7ead', class: "stzh-pi-menu__button-text" }, h("span", { key: '90c703747d6ac6fb8849bfb207a2c1fffe660cf5', class: "stzh-pi-menu__heading-text" }, this.heading)), h("stzh-icon", { key: '21cdf06321e37b291f4c32fda90c75b86d918ffe', name: "angle-down", class: "stzh-pi-menu__button-icon" })))));
+        return (h(Host, { key: '19c9245b7898158309b63e3cecbb6322a9494567', tabindex: this.rootTabindex, onFocus: this.onRootFocus }, h("div", { key: '80bf1fd91b550fcfd4b1894020957f890d67520f', class: "stzh-pi-menu-positioner" }, h("div", { key: '44b07a6af2535d75f2aee4f64edae2f05420774f', class: classes, style: { width: menuWidth } }, h("div", { key: '5ebcdd0b185e4be3b9e86bc7e83ce2087b09dabb', class: backdropClasses, onClick: this.handleBackdropClick }), h(Heading, { key: '075ce52b2106e0df7eac5414a51690b049f982c7', class: "stzh-pi-menu__heading", onClick: this.handleHeaderClick }, h("button", { key: 'b1a7f0497f7e973848e8fe4d337d2f7d5b13b28f', ref: el => (this.buttonElement = el), class: "stzh-pi-menu__button", "aria-expanded": `${this.open ? "true" : "false"}`, type: "button", "s-object-id": this.analyticsId || this.heading }, h("span", { key: '7beb1052c937d6c7a536be8bd92f8cc536cc9018', class: "stzh-pi-menu__button-text" }, this.heading), h("stzh-icon", { key: '9901049180363da950c14a75ad44db0360cc4e2f', name: "angle-down", class: "stzh-pi-menu__button-icon" }))), h("div", { key: 'd0ebd8482b70224040fcc19a3693026c95e60579', id: `${this.piMenuId}-content`, ref: el => (this.bodyElement = el), class: "stzh-pi-menu__content", "aria-labelledby": `${this.piMenuId}-header`, role: "region" }, h("div", { key: 'fd76f69718f44ca704754e0c5ebed8309ea9f2f4', class: "stzh-pi-menu__content-inner" }, h("nav", { key: 'ebc0138ea3372635a5c2538050dbe235e41735d8', class: "stzh-pi-menu__nav", "aria-label": this.localization.menuLabel }, this.subheading && h("p", { key: '778afe5da2ce59a0a72456c44f7be248a097c707', class: "stzh-pi-menu__subheading" }, this.subheading), h("ul", { key: '6fc94fcfb7a6711928e624f854b77bd5927fc24e', class: "stzh-pi-menu__nav-list is-level-1" }, this._menuItems.map((item, index) => (h("li", { class: "stzh-pi-menu__nav-list-item" }, this.isMedium || this.isLarge || this.isUltra ? (h("div", null, this.setSubMenuHeader(item), this.setSubMenuItems(item))) : (h("stzh-details", { open: index === 0 }, this.setSubMenuHeader(item), h("div", { slot: "content" }, this.setSubMenuItems(item)))))))))))), h("button", { key: '0347330e191eda5dda471f6e4379b254edc5cab2', class: "stzh-pi-menu__button stzh-pi-menu__button-space-helper", "aria-hidden": "true", type: "button" }, h("span", { key: 'a42ee43aa87c160023605933428c75c0072fe691', class: "stzh-pi-menu__button-text" }, h("span", { key: '53106545d12e49cde15a24706f532bdfd179e8b3', class: "stzh-pi-menu__heading-text" }, this.heading)), h("stzh-icon", { key: 'e638fc640654dc3cb1223a40c34cfc7b8191e19a', name: "angle-down", class: "stzh-pi-menu__button-icon" })))));
     }
     static get is() { return "stzh-pi-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.js

@@ -64,7 +64,7 @@ export class StzhPiPagetitle {
             "stzh-pi-pagetitle--hyphens": this.hyphensEnabled,
             [`stzh-pi-pagetitle--level-${this.level}`]: !!this.level,
         };
-        return (h(Host, { key: 'bc1447bd906371534607883029d0fdafaac84865', "has-menu": menuSlotUsed, "has-article-info": hasArticleInfo }, h("div", { key: '2976ef10ec0a80e25447a706948df5e83bce96e4', class: classes }, h("div", { key: 'a643484b32794710eb3209eb30a464f2e6abd4f5', class: "stzh-pi-pagetitle__hero-container" }, h("div", { key: 'c7fb03253283621f30d744fd7b42bf88a7650aa7', class: "stzh-pi-pagetitle__hero" }, h("div", { key: '276a214f03d357f18601abb6573fd99fd492a89a', class: "stzh-pi-pagetitle__breadcrumbs" }, h("slot", { key: '1406af1abed10f1d4f19a25ca4889fd09a5dd594', name: "breadcrumb" })), h("div", { key: 'c02fd00abc4bb83333a392bcb6594e31a45e4733', class: "stzh-pi-pagetitle__meta" }, h("div", { key: '323c574c1b38891b9aea152fc0fde085ce645189', class: "stzh-pi-pagetitle__readspeaker" }, h("slot", { key: '023779d61f0f1726c7740726a5d5ad96db24837a', name: "readspeaker" }))), h("div", { key: 'a04c33680ba7bec7cd34b7e11d14e2761f75cf1e', class: "stzh-pi-pagetitle__dateline" }, h("slot", { key: '242c2ba331c2bd373970d3a36225acfa7ce55ca8', name: "dateline" })), h("div", { key: '2e4ea0b21f4ff9479b9a6c4ada9a355283fe3847', class: "stzh-pi-pagetitle__heading" }, h("slot", { key: 'bd4a74fbc65b05564abf7a0b88eee4c2ca523dbd', name: "heading" })))), h("div", { key: 'ee24ff47efc29d6fe1345ef7bfd08c697ccdcebb', class: "stzh-pi-pagetitle__image-lead-menu-container" }, h("div", { key: 'db6cb2a05c58b1189832d350160e943c4fb228a9', class: "stzh-pi-pagetitle__image-lead-menu" }, h("div", { key: 'bae5a9d6aa541bbd8c978b550f22bbecf92caab2', class: "stzh-pi-pagetitle__menu" }, menuSlotUsed && (h("div", { key: '64614f49e06acaa037f233a4b4361f5d0618f950', class: "stzh-pi-pagetitle__menu-inner" }, h("slot", { key: 'dbc9294e0a1ed5d65e2998aa1c956fed8355bf0b', name: "menu" })))), imageSlotUsed && (h("div", { key: '46cc40114e3d085f261e1244b2efe64fdc73073e', class: "stzh-pi-pagetitle__image" }, [1, 2].indexOf(this.level) > -1 && (h("div", { key: '2448c75b847ab9f4729aba5681c30bac615c6f9f', class: "stzh-pi-pagetitle__image-wrapper" }, h("stzh-ratio", { key: '01dcebc68d01b849f86073885564df8fb1ffdfcb', ratio: "16:9", ratioSmall: "21:9", class: "stzh-pi-pagetitle__ratio" }, h("slot", { key: '2b668c52975933f2294e6f3c87bcae85219d6044', name: "image" })))))), menuSlotUsed && (h("div", { key: 'a989167bc3a76e160b5cde9c06871948b65d0042', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: 'bae28bb8353549eb9c4b4b9b3ce65aae911f07ca', name: "lead" }))))), !menuSlotUsed && (h("div", { key: '47657439842999b021bc4158c19b755f21ae8752', class: "stzh-pi-pagetitle__lead-container" }, h("div", { key: '5358eb381605b433ffd56793bd719ff3d1be9746', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: '09dd20699f06cd5a77356f00d6db001264596f7c', name: "lead" })))), hasArticleInfo && (h("div", { key: '6087fc056609840d8f1ee629379c8da77440d035', class: "stzh-pi-pagetitle__article-info-wrapper" }, h("div", { key: 'ba08bb1cc82b8b13fb385a5b823ccf45d43c4252', class: "stzh-pi-pagetitle__article-info" }, h("div", { key: '1158c090072dc2090273d967e7bf2aaa22610272', class: "stzh-pi-pagetitle__article-info-holder" }, this.author && h("p", { key: 'd7bb67b16ad7404da9cb1b49df4921a681638fd1', class: "stzh-pi-pagetitle__author" }, this.author), this.date && h("p", { key: '615e3defa175315b194e2ebe8333f6d856327b24', class: "stzh-pi-pagetitle__date" }, this.date), h("slot", { key: '413b9e6f73c14b62ba6d752e644e0f928be4d7ca', name: "content" }))))))));
+        return (h(Host, { key: '7ea11c48b8c57d36a37c2a6d74bbf9a2fc9d904e', "has-menu": menuSlotUsed, "has-article-info": hasArticleInfo }, h("div", { key: 'c9d1cc9761d0a35b9fc66baf409813c0af435685', class: classes }, h("div", { key: 'e32cb331b8e6f03381bb8b5ca33af86a992edf26', class: "stzh-pi-pagetitle__hero-container" }, h("div", { key: '37c4e72c7eb3b4e2ec1a64ace15c4d47b0f6e43a', class: "stzh-pi-pagetitle__hero" }, h("div", { key: 'f285333ba0eff3875613a2b890c36196f99ee12c', class: "stzh-pi-pagetitle__breadcrumbs" }, h("slot", { key: 'fd81c5e3e49816288ec9d822a86950c5702964a5', name: "breadcrumb" })), h("div", { key: '935d4419958984a2d91ed7db6d37a5beca568598', class: "stzh-pi-pagetitle__meta" }, h("div", { key: '328d4c6994b315da26f3f7470d741cffdbada90d', class: "stzh-pi-pagetitle__readspeaker" }, h("slot", { key: '2ead52ad42dabc733bfa67b3e743bc790c2b50eb', name: "readspeaker" }))), h("div", { key: '4df5e3871f9114a38dccc6739304df280f6cd7d4', class: "stzh-pi-pagetitle__dateline" }, h("slot", { key: '4576c4f11268a8081b71a8e776c3527f8cb94571', name: "dateline" })), h("div", { key: '24d4ef15a376d07ad44a95e38ea83e86e3be29cd', class: "stzh-pi-pagetitle__heading" }, h("slot", { key: '5530b2846ff28d8568c6781279d9671ab17e1601', name: "heading" })))), h("div", { key: '9dbfc7fac99bb4b89eef7887296648392e099109', class: "stzh-pi-pagetitle__image-lead-menu-container" }, h("div", { key: 'ab73e1d6f13e2098309bc03454657e9a9b189f4a', class: "stzh-pi-pagetitle__image-lead-menu" }, h("div", { key: '4a28eadc08311050cb0f6a591c01cf91c94dfdc1', class: "stzh-pi-pagetitle__menu" }, menuSlotUsed && (h("div", { key: '566cf88bd625035d8060e7de23d1bfaf0858d1f7', class: "stzh-pi-pagetitle__menu-inner" }, h("slot", { key: '837e00551eb0e0208ec9ab979a3cf090af734b5a', name: "menu" })))), imageSlotUsed && (h("div", { key: '2f4be9e6df7f32ca34dff53a225f859905df6339', class: "stzh-pi-pagetitle__image" }, [1, 2].indexOf(this.level) > -1 && (h("div", { key: 'c7c913468286788ec37f5be9a03e5c8aa0870b9c', class: "stzh-pi-pagetitle__image-wrapper" }, h("stzh-ratio", { key: '0cff56d0e99705c567589db49931ceff94b6ae5f', ratio: "16:9", ratioSmall: "21:9", class: "stzh-pi-pagetitle__ratio" }, h("slot", { key: 'd5288b9554264c8d976188ad61898eaf4ae284ed', name: "image" })))))), menuSlotUsed && (h("div", { key: 'ba77a201bef9d6a44fae462cc30bf0d35a1e74db', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: 'c388a5a185ff83d98fb1e8400b4ffa6f0693e1bb', name: "lead" }))))), !menuSlotUsed && (h("div", { key: 'f2d78346bce95f3271cb386d3e03bbe0ceba8eac', class: "stzh-pi-pagetitle__lead-container" }, h("div", { key: '647bcc87e9fbfb359bc11b7b7b1b080f8a914b78', class: "stzh-pi-pagetitle__lead" }, h("slot", { key: '5c03b625f0282c93c4e32f24996caa0bfd12db78', name: "lead" })))), h("div", { key: '713935d6e3d7ed9ce9ec93fc551e37c820d043e1', class: "stzh-pi-pagetitle__article-info-wrapper" }, h("div", { key: 'd0103129df581d0b516f74556d26c0487cf17c2e', class: "stzh-pi-pagetitle__article-info" }, h("div", { key: '51b9b85aca3e2158ba29366dcc9497ff24da6781', class: "stzh-pi-pagetitle__article-info-holder" }, hasArticleInfo && (h("div", { key: 'd1b26da604f2c60a8ca6d4a321cb113e610fd1c7' }, this.author && h("p", { key: '8fc605d7235b143d4fc6eee854a32ba493b2b8f4', class: "stzh-pi-pagetitle__author" }, this.author), this.date && h("p", { key: '6e9d57f0b109d837b850db8733eb5271af54ef81', class: "stzh-pi-pagetitle__date" }, this.date))), h("slot", { key: 'b87768ccb4752a0027585601b121f1948d9d31e4', name: "content" })))))));
     }
     static get is() { return "stzh-pi-pagetitle"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"stzh-pi-pagetitle.js","sourceRoot":"","sources":["../../../../../src/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAElE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE/D;;;;;;;;;;GAUG;AAMH,MAAM,OAAO,eAAe;;QAelB,SAAI,GAAG,GAAG,EAAE;YAClB,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,6DAA6D,CAAC,CAAC;YAC1G,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,iDAAiD,CAAC,CAAC;YAC/F,MAAM,iBAAiB,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,kCAAkC,CAAC,CAAC;YAEzF,IAAI,OAAO,EAAE,CAAC;gBACZ,cAAc,CAAC,OAAO,EAAE;oBACtB,KAAK,EAAE,MAAM;oBACb,KAAK,EAAE,GAAG;iBACe,CAAC,CAAC;YAC/B,CAAC;YAED,IAAI,iBAAiB,EAAE,CAAC;gBACtB,cAAc,CAAC,iBAAiB,EAAE;oBAChC,OAAO,EAAE,gBAAgB;oBACzB,aAAa,EAAE,IAAI;oBACnB,cAAc,EAAE,IAAI;oBACpB,IAAI,EAAE,OAAO;oBACb,UAAU,EAAE,MAAM;oBAClB,eAAe,EAAE,GAAG;iBACI,CAAC,CAAC;YAC9B,CAAC;YAED,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACnB,cAAc,CAAC,IAAI,EAAE;oBACnB,IAAI,EAAE,IAAI;iBACY,CAAC,CAAC;YAC5B,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;qBAzC8C,CAAC;8BAGE,KAAK;sBAGd,EAAE;oBAGJ,EAAE;;IAkC1C,iBAAiB;QACf,IAAI,CAAC,IAAI,EAAE,CAAC;IACd,CAAC;IAED,MAAM;QACJ,MAAM,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QACrD,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACnD,MAAM,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QACjE,MAAM,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACnD,MAAM,cAAc,GAAG,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAEpD,MAAM,OAAO,GAAG;YACd,mBAAmB,EAAE,IAAI;YACzB,8BAA8B,EAAE,aAAa;YAC7C,iCAAiC,EAAE,CAAC,aAAa;YACjD,6BAA6B,EAAE,YAAY;YAC3C,6BAA6B,EAAE,mBAAmB;YAClD,6BAA6B,EAAE,YAAY;YAC3C,qCAAqC,EAAE,cAAc;YACrD,4BAA4B,EAAE,IAAI,CAAC,cAAc;YACjD,CAAC,4BAA4B,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;SACzD,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,iEAAW,YAAY,sBAAoB,cAAc;YAC5D,4DAAK,KAAK,EAAE,OAAO;gBACjB,4DAAK,KAAK,EAAC,mCAAmC;oBAC5C,4DAAK,KAAK,EAAC,yBAAyB;wBAClC,4DAAK,KAAK,EAAC,gCAAgC;4BACzC,6DAAM,IAAI,EAAC,YAAY,GAAQ,CAC3B;wBAEN,4DAAK,KAAK,EAAC,yBAAyB;4BAClC,4DAAK,KAAK,EAAC,gCAAgC;gCACzC,6DAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACF;wBAEN,4DAAK,KAAK,EAAC,6BAA6B;4BACtC,6DAAM,IAAI,EAAC,UAAU,GAAQ,CACzB;wBAEN,4DAAK,KAAK,EAAC,4BAA4B;4BACrC,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF;gBACN,4DAAK,KAAK,EAAC,8CAA8C;oBACvD,4DAAK,KAAK,EAAC,oCAAoC;wBAC7C,4DAAK,KAAK,EAAC,yBAAyB,IACjC,YAAY,IAAI,CACf,4DAAK,KAAK,EAAC,+BAA+B;4BACxC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACP,CACG;wBAEL,aAAa,IAAI,CAChB,4DAAK,KAAK,EAAC,0BAA0B,IAClC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAClC,4DAAK,KAAK,EAAC,kCAAkC;4BAC3C,mEAAY,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAC,0BAA0B;gCAC7E,6DAAM,IAAI,EAAE,OAAO,GAAS,CACjB,CACT,CACP,CACG,CACP;wBAEA,YAAY,IAAI,CACf,4DAAK,KAAK,EAAC,yBAAyB;4BAClC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACP,CACG,CACF;gBAEL,CAAC,YAAY,IAAI,CAChB,4DAAK,KAAK,EAAC,mCAAmC;oBAC5C,4DAAK,KAAK,EAAC,yBAAyB;wBAClC,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,CACF,CACP;gBAEA,cAAc,IAAI,CACjB,4DAAK,KAAK,EAAC,yCAAyC;oBAClD,4DAAK,KAAK,EAAC,iCAAiC;wBAC1C,4DAAK,KAAK,EAAC,wCAAwC;4BAChD,IAAI,CAAC,MAAM,IAAI,0DAAG,KAAK,EAAC,2BAA2B,IAAE,IAAI,CAAC,MAAM,CAAK;4BACrE,IAAI,CAAC,IAAI,IAAI,0DAAG,KAAK,EAAC,yBAAyB,IAAE,IAAI,CAAC,IAAI,CAAK;4BAEhE,6DAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACF,CACF,CACP,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { hasSlot, setPropsIfNull } from \"../../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n * @slot heading - Slot for `stzh-heading` element\n * @slot image - Slot for `stzh-figure` or `img` element\n * @slot lead - Slot for `stzh-text` element\n * @slot readspeaker - Slot for `stzh-readspeaker` element\n * @slot breadcrumb - Slot for `stzh-link` element\n * @slot menu - Slot for `stzh-link` element\n * @slot dateline - Slot for date or meta information\n * @slot content - Slot for content\n */\n@Component({\n  tag: \"stzh-pi-pagetitle\",\n  styleUrl: \"stzh-pi-pagetitle.scss\",\n  scoped: true,\n})\nexport class StzhPiPagetitle {\n  /** Level */\n  @Prop({ reflect: true }) level: 1 | 2 | 3 | 4 = 1;\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  /** Author of the content */\n  @Prop({ reflect: true }) author: string = \"\";\n\n  /** Date of the content */\n  @Prop({ reflect: true }) date: string = \"\";\n\n  @Element() element: HTMLStzhPiPagetitleElement;\n\n  private init = () => {\n    const heading = this.element.querySelector('stzh-heading[slot=\"heading\"], [slot=\"heading\"] stzh-heading');\n    const leads = this.element.querySelectorAll('stzh-text[slot=\"lead\"], [slot=\"lead\"] stzh-text');\n    const readspeakerButton = this.element.querySelector('[slot=\"readspeaker\"] stzh-button');\n\n    if (heading) {\n      setPropsIfNull(heading, {\n        curve: \"hero\",\n        level: \"1\",\n      } as HTMLStzhHeadingElement);\n    }\n\n    if (readspeakerButton) {\n      setPropsIfNull(readspeakerButton, {\n        variant: \"tertiary-plain\",\n        noPaddingLeft: true,\n        noPaddingRight: true,\n        size: \"small\",\n        sizeMedium: \"tiny\",\n        buttonAccesskey: \"L\",\n      } as HTMLStzhButtonElement);\n    }\n\n    leads.forEach(lead => {\n      setPropsIfNull(lead, {\n        lead: true,\n      } as HTMLStzhTextElement);\n    });\n  };\n\n  connectedCallback() {\n    this.init();\n  }\n\n  render() {\n    const imageSlotUsed = hasSlot(this.element, \"image\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n    const readspeakerSlotUsed = hasSlot(this.element, \"readspeaker\");\n    const menuSlotUsed = hasSlot(this.element, \"menu\");\n    const hasArticleInfo = !!this.author || !!this.date;\n\n    const classes = {\n      \"stzh-pi-pagetitle\": true,\n      \"stzh-pi-pagetitle--has-image\": imageSlotUsed,\n      \"stzh-pi-pagetitle--has-no-image\": !imageSlotUsed,\n      \"stzh-pi-pagetitle--has-lead\": leadSlotUsed,\n      \"stzh-pi-pagetitle--has-meta\": readspeakerSlotUsed,\n      \"stzh-pi-pagetitle--has-menu\": menuSlotUsed,\n      \"stzh-pi-pagetitle--has-article-info\": hasArticleInfo,\n      \"stzh-pi-pagetitle--hyphens\": this.hyphensEnabled,\n      [`stzh-pi-pagetitle--level-${this.level}`]: !!this.level,\n    };\n\n    return (\n      <Host has-menu={menuSlotUsed} has-article-info={hasArticleInfo}>\n        <div class={classes}>\n          <div class=\"stzh-pi-pagetitle__hero-container\">\n            <div class=\"stzh-pi-pagetitle__hero\">\n              <div class=\"stzh-pi-pagetitle__breadcrumbs\">\n                <slot name=\"breadcrumb\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__meta\">\n                <div class=\"stzh-pi-pagetitle__readspeaker\">\n                  <slot name=\"readspeaker\"></slot>\n                </div>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__dateline\">\n                <slot name=\"dateline\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__heading\">\n                <slot name=\"heading\"></slot>\n              </div>\n            </div>\n          </div>\n          <div class=\"stzh-pi-pagetitle__image-lead-menu-container\">\n            <div class=\"stzh-pi-pagetitle__image-lead-menu\">\n              <div class=\"stzh-pi-pagetitle__menu\">\n                {menuSlotUsed && (\n                  <div class=\"stzh-pi-pagetitle__menu-inner\">\n                    <slot name=\"menu\"></slot>\n                  </div>\n                )}\n              </div>\n\n              {imageSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__image\">\n                  {[1, 2].indexOf(this.level) > -1 && (\n                    <div class=\"stzh-pi-pagetitle__image-wrapper\">\n                      <stzh-ratio ratio={\"16:9\"} ratioSmall={\"21:9\"} class=\"stzh-pi-pagetitle__ratio\">\n                        <slot name={\"image\"}></slot>\n                      </stzh-ratio>\n                    </div>\n                  )}\n                </div>\n              )}\n\n              {menuSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__lead\">\n                  <slot name=\"lead\"></slot>\n                </div>\n              )}\n            </div>\n          </div>\n\n          {!menuSlotUsed && (\n            <div class=\"stzh-pi-pagetitle__lead-container\">\n              <div class=\"stzh-pi-pagetitle__lead\">\n                <slot name=\"lead\"></slot>\n              </div>\n            </div>\n          )}\n\n          {hasArticleInfo && (\n            <div class=\"stzh-pi-pagetitle__article-info-wrapper\">\n              <div class=\"stzh-pi-pagetitle__article-info\">\n                <div class=\"stzh-pi-pagetitle__article-info-holder\">\n                  {this.author && <p class=\"stzh-pi-pagetitle__author\">{this.author}</p>}\n                  {this.date && <p class=\"stzh-pi-pagetitle__date\">{this.date}</p>}\n\n                  <slot name=\"content\" />\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"stzh-pi-pagetitle.js","sourceRoot":"","sources":["../../../../../src/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { hasSlot, setPropsIfNull } from \"../../../utils/utils\";\n\n/**\n * @slot - Slot for any content\n * @slot heading - Slot for `stzh-heading` element\n * @slot image - Slot for `stzh-figure` or `img` element\n * @slot lead - Slot for `stzh-text` element\n * @slot readspeaker - Slot for `stzh-readspeaker` element\n * @slot breadcrumb - Slot for `stzh-link` element\n * @slot menu - Slot for `stzh-link` element\n * @slot dateline - Slot for date or meta information\n * @slot content - Slot for content\n */\n@Component({\n  tag: \"stzh-pi-pagetitle\",\n  styleUrl: \"stzh-pi-pagetitle.scss\",\n  scoped: true,\n})\nexport class StzhPiPagetitle {\n  /** Level */\n  @Prop({ reflect: true }) level: 1 | 2 | 3 | 4 = 1;\n\n  /** Automatic Hyphens */\n  @Prop({ reflect: true }) hyphensEnabled: boolean = false;\n\n  /** Author of the content */\n  @Prop({ reflect: true }) author: string = \"\";\n\n  /** Date of the content */\n  @Prop({ reflect: true }) date: string = \"\";\n\n  @Element() element: HTMLStzhPiPagetitleElement;\n\n  private init = () => {\n    const heading = this.element.querySelector('stzh-heading[slot=\"heading\"], [slot=\"heading\"] stzh-heading');\n    const leads = this.element.querySelectorAll('stzh-text[slot=\"lead\"], [slot=\"lead\"] stzh-text');\n    const readspeakerButton = this.element.querySelector('[slot=\"readspeaker\"] stzh-button');\n\n    if (heading) {\n      setPropsIfNull(heading, {\n        curve: \"hero\",\n        level: \"1\",\n      } as HTMLStzhHeadingElement);\n    }\n\n    if (readspeakerButton) {\n      setPropsIfNull(readspeakerButton, {\n        variant: \"tertiary-plain\",\n        noPaddingLeft: true,\n        noPaddingRight: true,\n        size: \"small\",\n        sizeMedium: \"tiny\",\n        buttonAccesskey: \"L\",\n      } as HTMLStzhButtonElement);\n    }\n\n    leads.forEach(lead => {\n      setPropsIfNull(lead, {\n        lead: true,\n      } as HTMLStzhTextElement);\n    });\n  };\n\n  connectedCallback() {\n    this.init();\n  }\n\n  render() {\n    const imageSlotUsed = hasSlot(this.element, \"image\");\n    const leadSlotUsed = hasSlot(this.element, \"lead\");\n    const readspeakerSlotUsed = hasSlot(this.element, \"readspeaker\");\n    const menuSlotUsed = hasSlot(this.element, \"menu\");\n    const hasArticleInfo = !!this.author || !!this.date;\n\n    const classes = {\n      \"stzh-pi-pagetitle\": true,\n      \"stzh-pi-pagetitle--has-image\": imageSlotUsed,\n      \"stzh-pi-pagetitle--has-no-image\": !imageSlotUsed,\n      \"stzh-pi-pagetitle--has-lead\": leadSlotUsed,\n      \"stzh-pi-pagetitle--has-meta\": readspeakerSlotUsed,\n      \"stzh-pi-pagetitle--has-menu\": menuSlotUsed,\n      \"stzh-pi-pagetitle--has-article-info\": hasArticleInfo,\n      \"stzh-pi-pagetitle--hyphens\": this.hyphensEnabled,\n      [`stzh-pi-pagetitle--level-${this.level}`]: !!this.level,\n    };\n\n    return (\n      <Host has-menu={menuSlotUsed} has-article-info={hasArticleInfo}>\n        <div class={classes}>\n          <div class=\"stzh-pi-pagetitle__hero-container\">\n            <div class=\"stzh-pi-pagetitle__hero\">\n              <div class=\"stzh-pi-pagetitle__breadcrumbs\">\n                <slot name=\"breadcrumb\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__meta\">\n                <div class=\"stzh-pi-pagetitle__readspeaker\">\n                  <slot name=\"readspeaker\"></slot>\n                </div>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__dateline\">\n                <slot name=\"dateline\"></slot>\n              </div>\n\n              <div class=\"stzh-pi-pagetitle__heading\">\n                <slot name=\"heading\"></slot>\n              </div>\n            </div>\n          </div>\n          <div class=\"stzh-pi-pagetitle__image-lead-menu-container\">\n            <div class=\"stzh-pi-pagetitle__image-lead-menu\">\n              <div class=\"stzh-pi-pagetitle__menu\">\n                {menuSlotUsed && (\n                  <div class=\"stzh-pi-pagetitle__menu-inner\">\n                    <slot name=\"menu\"></slot>\n                  </div>\n                )}\n              </div>\n\n              {imageSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__image\">\n                  {[1, 2].indexOf(this.level) > -1 && (\n                    <div class=\"stzh-pi-pagetitle__image-wrapper\">\n                      <stzh-ratio ratio={\"16:9\"} ratioSmall={\"21:9\"} class=\"stzh-pi-pagetitle__ratio\">\n                        <slot name={\"image\"}></slot>\n                      </stzh-ratio>\n                    </div>\n                  )}\n                </div>\n              )}\n\n              {menuSlotUsed && (\n                <div class=\"stzh-pi-pagetitle__lead\">\n                  <slot name=\"lead\"></slot>\n                </div>\n              )}\n            </div>\n          </div>\n\n          {!menuSlotUsed && (\n            <div class=\"stzh-pi-pagetitle__lead-container\">\n              <div class=\"stzh-pi-pagetitle__lead\">\n                <slot name=\"lead\"></slot>\n              </div>\n            </div>\n          )}\n\n          <div class=\"stzh-pi-pagetitle__article-info-wrapper\">\n            <div class=\"stzh-pi-pagetitle__article-info\">\n              <div class=\"stzh-pi-pagetitle__article-info-holder\">\n                {hasArticleInfo && (\n                  <div>\n                    {this.author && <p class=\"stzh-pi-pagetitle__author\">{this.author}</p>}\n                    {this.date && <p class=\"stzh-pi-pagetitle__date\">{this.date}</p>}\n                  </div>\n                )}\n                <slot name=\"content\" />\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/CMS/stzh-pi-pagetitle/stzh-pi-pagetitle.stories.js

@@ -114,8 +114,9 @@ const piMenuItems = [
   }
 ];
 
-const TEMPLATE = `
+const TEMPLATE = (args) => `
 <stzh-pi-pagetitle author="Firstname Lastname" date="27.03.2027">
+<div slot="content">${args.content}</div>
   <stzh-breadcrumb items='${JSON.stringify(breadcrumbItems)}' slot="breadcrumb"></stzh-breadcrumb>
   <stzh-text slot="dateline">Spitzmarke Dateline</stzh-text>
   <stzh-readspeaker slot="readspeaker" href="https://app-eu.readspeaker.com/cgi-bin/rsent?customerid=4490&lang=de_de&readid=content&url=https://www.stadt-zuerich.ch/portal/de/index/service/kontakt.html">
@@ -130,8 +131,9 @@ const TEMPLATE = `
 </stzh-pi-pagetitle>
 `;
 
-const TEMPLATE_WITH_MENU = `
+const TEMPLATE_WITH_MENU = (args) => `
 <stzh-pi-pagetitle author="Firstname Lastname" date="27.03.2027">
+<div slot="content">${args.content}</div>
   <stzh-breadcrumb items='${JSON.stringify(breadcrumbItems)}' slot="breadcrumb"></stzh-breadcrumb>
   <stzh-text slot="dateline">Spitzmarke Dateline</stzh-text>
   <stzh-readspeaker slot="readspeaker" href="https://app-eu.readspeaker.com/cgi-bin/rsent?customerid=4490&lang=de_de&readid=content&url=https://www.stadt-zuerich.ch/portal/de/index/service/kontakt.html">
@@ -149,8 +151,9 @@ const TEMPLATE_WITH_MENU = `
 </stzh-pi-pagetitle>
 `;
 
-const TEMPLATE_WITH_IMAGE = `
+const TEMPLATE_WITH_IMAGE = (args) => `
 <stzh-pi-pagetitle author="Firstname Lastname" date="27.03.2027">
+<div slot="content">${args.content}</div>
   <stzh-breadcrumb items='${JSON.stringify(breadcrumbItems)}' slot="breadcrumb"></stzh-breadcrumb>
   <stzh-text slot="dateline">Spitzmarke Dateline</stzh-text>
   <stzh-readspeaker slot="readspeaker" href="https://app-eu.readspeaker.com/cgi-bin/rsent?customerid=4490&lang=de_de&readid=content&url=https://www.stadt-zuerich.ch/portal/de/index/service/kontakt.html">
@@ -168,7 +171,7 @@ const TEMPLATE_WITH_IMAGE = `
 `;
 
 const TEMPLATE_WITH_IMAGE_AND_MENU = (args) => `
-<stzh-pi-pagetitle author="Firstname Lastname" date="27.03.2027">
+<stzh-pi-pagetitle >
   <div slot="content">${args.content}</div>
   <stzh-breadcrumb items='${JSON.stringify(breadcrumbItems)}' slot="breadcrumb"></stzh-breadcrumb>
   <stzh-text slot="dateline">Spitzmarke Dateline</stzh-text>
@@ -211,23 +214,29 @@ export default {
 };
 
 export const Default = {
-  render: (args) => story(args, TEMPLATE),
-  args: {}
+  render: (args) => story(args, TEMPLATE(args)),
+  args: {
+    content: `<p>Template - content</p>`
+  }
 };
 
 export const WithImage = {
-  render: (args) => story(args, TEMPLATE_WITH_IMAGE),
-  args: {}
+  render: (args) => story(args, TEMPLATE_WITH_IMAGE(args)),
+  args: {
+    content: `<p>Template with image - content</p>`
+  }
 };
 
 export const WithMenu = {
-  render: (args) => story(args, TEMPLATE_WITH_MENU),
-  args: {}
+  render: (args) => story(args, TEMPLATE_WITH_MENU(args)),
+  args: {
+    content: `<p>Template with menu - content</p>`
+  }
 };
 
 export const WithImageAndMenu = {
   render: (args) => story(args, TEMPLATE_WITH_IMAGE_AND_MENU(args)),
   args: {
-    content: `<p>Hey</p>`
+    content: `<p>Template with image and menu - content</p>`
   }
 };

package/dist/collection/components/CMS/stzh-pi-quote/stzh-pi-quote.js

@@ -11,7 +11,7 @@ export class StzhPiQuote {
         const classes = {
             "stzh-pi-quote": true,
         };
-        return (h(Host, { key: '5fd70d77731728318c9b9653b9bdc0796f7fc8a0' }, h("div", { key: '6e142cb6d6d2a4a4f78aa312bdd8c9d4968e959e', class: classes }, h("blockquote", { key: '69dc187d2d494dad5294299456920fd6ec7933c3', class: "stzh-pi-quote__content" }, h("p", { key: '5ae1f9a4d0df0d8285a1769729c419c640b029b1', class: "stzh-pi-quote__text" }, this.text), this.author && h("cite", { key: '0c251dc121558bf2ee8bed7a52d118df740eacae', class: "stzh-pi-quote__author" }, this.author)))));
+        return (h(Host, { key: '213692370897716d960e3dfbfa16142c6468bb6a' }, h("div", { key: '6fdc12ea34841aff0da66ff40f58812a94fa516d', class: classes }, h("blockquote", { key: '0b812d842316c3e83c1b44efc9c710bede61bcdd', class: "stzh-pi-quote__content" }, h("p", { key: '89ecfec809044b3cea057a017643ac6b7f04b26b', class: "stzh-pi-quote__text" }, this.text), this.author && h("cite", { key: '05f63895d5f308ec94f5528133a6cce6bd00ee66', class: "stzh-pi-quote__author" }, this.author)))));
     }
     static get is() { return "stzh-pi-quote"; }
     static get encapsulation() { return "scoped"; }