hr-design-system-handlebars 1.63.15 → 1.64.1

package/dist/views/components/socialmedia/socialmedia.hbs

@@ -5,7 +5,7 @@
     <ul class="flex flex-wrap w-full pt-2 gap-x-2 gap-y-2">
         {{~#with this.twitterLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     target="_blank"
                     rel="noopener noreferrer"
@@ -20,7 +20,7 @@
         {{~/with~}}
         {{~#with this.facebookLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     target="_blank"
                     rel="noopener noreferrer"
@@ -35,7 +35,7 @@
         {{~/with~}}
         {{~#with this.whatsappLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     target="_blank"
                     rel="noopener noreferrer"
@@ -50,7 +50,7 @@
         {{~/with~}}
         {{~#with this.mailtoLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     title="{{loca "share_mail_linktitle" }}"
                     {{#with ../../this.content.trackingData}}

package/dist/views/components/teaser/components/teaser_body.hbs

@@ -21,6 +21,15 @@
                         {{/if}}
                     {{/components/teaser/components/teaser_headline}}
                 {{/components/base/link}} 
+                {{#if (isStorybook)}}
+                    {{#if this.link.isUserConsentNeeded}}
+                        {{#with this}}
+                            {{#> components/modal/modal _type="userConsent" _css="" _trigger=".js-user-consent-needed"}}
+                                {{> components/modal/user_consent _link=this.link _headline=(loca "modal_user_consent_headline") _text=(loca "modal_user_consent_text") _labelOk=(loca "modal_user_consent_label_ok") _labelCancel=(loca "modal_user_consent_label_cancel")}}
+                            {{/components/modal/modal}}
+                        {{/with}}
+                    {{/if}}
+                {{/if}}
         {{/components/teaser/components/teaser_header}}
         {{#*inline "htmlProperties"}}
             {{#if this.isFileDownload}}
@@ -32,7 +41,7 @@
     {{#unless this.hideBylineAndShorttext}}
         <div class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
             {{#if this.shorttext}}
-                {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize}}
+                {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize }}
             {{/if}}
             {{> components/teaser/components/teaser_byline}} 
         </div>

package/dist/views/components/teaser/components/teaser_lead.hbs

@@ -1,7 +1,7 @@
 {{~#if this.allowAVConsumption ~}}
     {{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _teaserType=_teaserType _addClassImg=_addClassImg}}
 {{else}}
-    {{#if this.isTickerTeaser}}<a href="{{this.link.url}}" aria-label="Zum Ticker" tabindex="-1">{{/if}}
+    {{#if this.isTickerTeaser}}<a href="{{this.link.url}}" aria-label="Zum Ticker" tabindex="-1"{{#if (isUserConsentNeeded this.link.url)}} class="js-user-consent-needed"{{/if}}>{{/if}}
         {{> components/teaser/components/teaser_image _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _addClassImg=_addClassImg _aspectRatio=_aspectRatio}}
     {{#if this.isTickerTeaser}}</a>{{/if}}
 {{/if}}

package/dist/views/components/teaser/group_teaser/group_teaser.hbs

@@ -2,7 +2,7 @@
     {{#>components/grid/grid_group _backgroundColor=this.backgroundColor }} 
             {{~#if this.hasGroupTitle}}
                 <{{if this.headlineTag this.headlineTag "h2"}} class="text-2xl {{#unless this.isRelatedContent}} md:text-5xl{{else}} justifyLine{{/unless}} col-span-full py-0 font-title {{#if this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
-                    {{~#if this.hasLink}}<a class="no-underline hover:underline decoration-1 md:decoration-2 text-link" href="{{this.link.url}}">{{/if~}}
+                    {{~#if this.hasLink}}<a class="{{if (isUserConsentNeeded this.link.url) 'js-user-consent-needed ' ''}}no-underline hover:underline decoration-1 md:decoration-2 text-link" href="{{this.link.url}}">{{/if~}}
                         {{this.groupTitle}}
                     {{~#if this.hasLink}}</a>{{/if~}}
                 </{{if this.headlineTag this.headlineTag "h2"}}>

package/dist/views/components/teaser/group_teaser/group_teaser_accented.hbs

@@ -3,7 +3,7 @@
         <div class="grid items-start content-start h-auto grid-cols-12 col-span-12 py-5 mx-5 group-accented sm:p-5 sm:mx-0 rounded-tl-hr rounded-br-hr bg-highlight-1 gap-x-6 gap-y-5">
             {{~#if this.hasGroupTitle}}
                 <h2 class="text-2xl md:text-5xl px-5 sm:px-0 col-span-full pt-0 pb-4 font-title {{#if this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
-                    {{~#if this.hasLink}}<a class="no-underline hover:underline decoration-1 md:decoration-2 text-blue-science" href="{{this.link.url}}">{{/if~}}
+                    {{~#if this.hasLink}}<a class="{{if (isUserConsentNeeded this.link.url) 'js-user-consent-needed ' ''}}no-underline hover:underline decoration-1 md:decoration-2 text-blue-science" href="{{this.link.url}}">{{/if~}}
                     {{this.groupTitle}}
                     {{~#if this.hasLink}}</a>{{/if~}}
                 </h2>

package/dist/views/components/teaser/ticker/teaser_ticker_timeline.hbs

@@ -20,7 +20,7 @@
                         {{/if}}
                     </div>
                 {{~/with}}                    
-                <a class="link-focus-white text-base js-load {{#if ../../_color}} text-{{../../_color}}{{else}} text-toplineColor{{/if}} underline decoration-1 ds-link" href="{{this.tickerItemUrl}}" rel="nofollow" data-hr-click-tracking='{"settings": [{"type": "uxAction", "clickLabel": "TickerTeaser::{{../../this.sophoraId}}-TeaserPostLink geklickt"}]}'>{{this.relevantTitle}}</a>
+                <a class="{{if (isUserConsentNeeded this.tickerItemUrl) 'js-user-consent-needed ' ''}}link-focus-white text-base js-load {{#if ../../_color}} text-{{../../_color}}{{else}} text-toplineColor{{/if}} underline decoration-1 ds-link" href="{{this.tickerItemUrl}}" rel="nofollow" data-hr-click-tracking='{"settings": [{"type": "uxAction", "clickLabel": "TickerTeaser::{{../../this.sophoraId}}-TeaserPostLink geklickt"}]}'>{{this.relevantTitle}}</a>
             </li>
         {{~/each~}}
     </ul>

package/dist/views/components/topictag/topictag_list.hbs

@@ -5,7 +5,7 @@
         <ul class="flex flex-wrap sm:block gap-x-4 w-fit sm:w-full sm:pt-2 ">
             {{~#each this~}}
                 <li class="w-fit sm:w-full text-primary dark:text-standard-text-dark">
-                    <a class="block line-clamp-1 hover:underline gap-x-1" href="{{this.url}}">
+                    <a class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}block line-clamp-1 hover:underline gap-x-1" href="{{this.url}}">
                         {{~> components/base/image/icon _icon="taglabel" _addClass="inline w-4 h-4 mr-2 fill-current"~}}
 
                         {{~this.title~}}

package/dist/views_static/components/banner/header/banner_image.hbs

@@ -1,6 +1,6 @@
 {{#with this.bannerImage}}
     {{#if ../bannerLink}}
-        <a href="{{../bannerLink}}">
+        <a href="{{../bannerLink}}"{{#if (isUserConsentNeeded ../bannerLink)}} class="js-user-consent-needed"{{/if}}>
     {{/if}}
     {{#unless ../_hideOnMobile }}
         {{~> components/base/image/responsive_image _type="banner" _variant="default" _addClass="print:hidden" _noDelay="true" _title=(loca "banner_image_copyright" (strip this.copyrightWithLinks html)) ~}}

package/dist/views_static/components/base/backlink.hbs

@@ -1,4 +1,4 @@
-<a href="{{this}}" class="flex flex-nowrap items-center text-sm gap-x-2 text-primary hover:underline {{~#with _addClass }} {{this}}{{/with}}">
+<a href="{{this}}" class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}flex flex-nowrap items-center text-sm gap-x-2 text-primary hover:underline {{~#with _addClass }} {{this}}{{/with}}">
     {{~> components/base/image/icon _icon="arrow-left" _addClass="w-5 h-5 fill-current" ~}}
     {{~loca "backlink_title" ~}}
 </a>

package/dist/views_static/components/base/link.hbs

@@ -1,5 +1,5 @@
 <a {{#with _link.webviewUrl}}data-webviewurl="{{this}}"{{/with}} {{#if _link.isStaticUrl}}href="{{#if _link.site}}{{resourceUrl _link.url _site=_link.site}}{{else}}{{resourceUrl _link.url}}{{/if}}{{else}}href="{{_link.url}}{{/if}}{{#if this.hasComments}}#commentList{{/if}}"
-    class="sb-link ds-link js-load {{#if _isSelected}} {{defaultIfEmpty _selectedCssClass "-current"}}{{/if}}{{#if _css}} {{_css}}{{/if}} {{#> css}}{{/css}}"
+    class="sb-link ds-link js-load{{#if _link.isUserConsentNeeded}} js-user-consent-needed{{/if}} {{#if _isSelected}} {{defaultIfEmpty _selectedCssClass "-current"}}{{/if}}{{#if _css}} {{_css}}{{/if}} {{#> css}}{{/css}}"
     {{#if _link.isTargetBlank}} target="_blank"  rel="noopener{{#if _link.hasNoReferrerFlag}} noreferrer{{/if}}"{{/if}}
     {{#if _isAriaHidden}} aria-hidden="true" tabindex="-1"{{/if}}
     {{#> htmlProperties}}{{/htmlProperties}}

package/dist/views_static/components/dataPolicySettings/data_policy_settings.hbs

@@ -31,7 +31,7 @@
                     {{#with this.footerMetadata}}
                         {{#with this.dataProtectionLink}}
                             {{loca "cookies_setting_tracking_service_description_text"}}
-                            <a class="block mt-2 ds-link text-link hover:underline" target="_blank"
+                            <a class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}block mt-2 ds-link text-link hover:underline" target="_blank"
                             rel="noopener noreferrer" href="{{this.url}}"
                             title="Mehr Informationen zum Thema Datenschutz">Mehr Informationen zum Thema Datenschutz
                             {{#if this.isTargetBlank}}{{~> components/base/image/icon _icon="extern" _addClass="h-5 w-5 -mt-0.5 fill-current ml-1 inline-flex" _iconmap="icons"~}}{{/if}}
@@ -48,7 +48,7 @@
             <ul class="{{#if _webview}} hidden{{/if}}">
                 <li class="px-6 py-3 flex justify-between items-center bg-white border-t border-[#e3e3e3] tracking_1">
                     <span class="text-base text-black">AGF <a
-                        class="mt-3 -mb-1 ds-link text-link hover:underline" target="_blank" rel="noopener noreferrer"
+                        class="{{if (isUserConsentNeeded 'https://www.agf.de/') 'js-user-consent-needed ' ''}}mt-3 -mb-1 ds-link text-link hover:underline" target="_blank" rel="noopener noreferrer"
                         href="https://www.agf.de/" title="AGF">(https://www.agf.de/){{~> components/base/image/icon _icon="extern" _addClass="h-5 w-5 -mt-0.5 fill-current ml-1 inline-flex" _iconmap="icons"~}}</a></span>
                     <div class="flex w-fit toggleSwitch">
                         {{> components/forms/toggle_button _id="agf" _addClass="js-toggleSwitch-checkbox js-toggleSwitch-tracking" _isInitiallyHidden=false _screenReaderText="agf aktivieren/deaktivieren" }}
@@ -56,7 +56,7 @@
                 </li>
                 <li class="px-6 py-3 flex justify-between items-center bg-white border-t border-[#e3e3e3] tracking_2">
                     <span class="text-base text-black">AT Internet <a
-                        class="mt-3 -mb-1 ds-link text-link hover:underline" target="_blank" rel="noopener noreferrer"
+                        class="{{if (isUserConsentNeeded 'https://www.atinternet.com/de/') 'js-user-consent-needed ' ''}}mt-3 -mb-1 ds-link text-link hover:underline" target="_blank" rel="noopener noreferrer"
                         href="https://www.atinternet.com/de/"
                         title="AT Internet">(https://www.atinternet.com/de/){{~> components/base/image/icon _icon="extern" _addClass="h-5 w-5 -mt-0.5 fill-current ml-1 inline-flex" _iconmap="icons"~}}</a></span>
                     <div class="flex w-fit toggleSwitch">
@@ -71,7 +71,7 @@
                     {{#with this.footerMetadata}}
                         {{#with this.dataProtectionLink}}
                             {{loca "cookies_setting_description_text"}}
-                            <a class="block mt-2 ds-link text-link hover:underline" target="_blank"
+                            <a class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}block mt-2 ds-link text-link hover:underline" target="_blank"
                             rel="noopener noreferrer" href="{{this.url}}"
                             title="Mehr Informationen zum Thema Datenschutz">Mehr Informationen zum Thema Datenschutz
                             {{#if this.isTargetBlank}}{{~> components/base/image/icon _icon="extern" _addClass="h-5 w-5 -mt-0.5 fill-current ml-1 inline-flex" _iconmap="icons"~}}{{/if}}

package/dist/views_static/components/event/calendar/event_calendar.hbs

@@ -1,3 +1,6 @@
 <div class="flex flex-col border-event-calendar-secondary border gap-x-4 js-load" data-hr-filterer-ds="{}"> 
     {{> @partial-block }}
+    {{#> components/modal/modal _type="userConsent" _trigger=".js-ticket-button-user-consent-needed"}}
+        {{> components/modal/user_consent _link=this.link _headline=(loca "ticket_modal_headline") _text=(loca "ticket_modal_text") _labelOk=(loca "ticket_modal_label_ok") _labelCancel=(loca "ticket_modal_label_cancel")}}
+    {{/components/modal/modal}}
 </div>

package/dist/views_static/components/event/event_ticket_button.hbs

@@ -1,23 +1,15 @@
 <div class="static pt-1 pb-3 pl-4 sm:absolute sm:pl-0 sm:pt-0 sm:pb-0 sm:right-4 sm:bottom-4">
-    {{#> components/button/button _id=(nextRandom) _size="lg"}}
-        {{> components/button/components/button_icon _icon="ticket" _iconmap="icons" _css="mr-2"}}
-        {{>components/button/components/button_label _label="Tickets"}}
-    {{/components/button/button}}
-    {{#> components/modal/modal _trigger=(getRandom)}}
-        {{#> components/teaser/components/teaser_headline}}
-            {{> components/teaser/components/teaser_title _text=(loca 'ticket_modal_headline') _css="text-2xl"}}
-        {{/components/teaser/components/teaser_headline}}
-        <p class="mt-2 text-base font-copy">{{loca "ticket_modal_text"}}</p>
+    {{#with this}}
+        {{#> components/button/button _css="js-ticket-button-user-consent-needed"_id=(nextRandom) _size="lg"}}
+            {{> components/button/components/button_icon _icon="ticket" _iconmap="icons" _css="mr-2"}}
+            {{>components/button/components/button_label _css='' _label="Tickets"}}
+        {{/components/button/button}}
+        {{#*inline "htmlProperties"~}}
+        data-user-consent-link='{"url":"{{this.link.url}}","isTargetBlank":{{this.link.isTargetBlank}} }'
+        data-user-consent-tracking-data="{{this.link.cmsDocument.trackingInformations.ticketLink}}"
+        {{~/inline}}
+    {{/with}}
 
-        <div class="flex flex-wrap mt-4">
-            {{#> components/button/button _size="lg" _variant="tertiary" _value="cancel" _css="mr-4 mt-4"}}
-                {{>components/button/components/button_label _label="Abbrechen" _css=""}}
-            {{/components/button/button}}
-            {{#> components/button/link_button _link=this.link _size="lg" _css="js-ticket-ok-button js-modal-close mt-4"}}
-                {{>components/button/components/button_label _label="Zum Ticketshop" _css=""}}
-            {{/components/button/link_button}}
-        </div>
-    {{/components/modal/modal}}
     <noscript>
         <style>
             #{{getRandom}} {

package/dist/views_static/components/externalService/external_service.hbs

@@ -1,5 +1,5 @@
 {{#if this.externalServiceConfig.makeConfigurable}}
-    
+    <!-- Embedding via JS with DataPolicyCheck-->  
     {{> components/externalService/external_service_with_datapolicy_check }}
 
 {{else}}
@@ -8,26 +8,19 @@
         <div class="clear-both mt-10">
             <span class="sr-only">{{loca "story_externalservice_intro_sr" }}</span>    
             {{#if this.externalServiceConfig.embedAsIFrame}}              
-                    
+                <!-- Embedding via Iframe -->    
                 <div class="{{#if this.fixedHeight}}overflow-y-hidden{{else}}overflow-hidden{{/if}}" {{#if this.fixedHeight}}style="height:{{this.fixedHeight}}px;"{{/if}}>
                     {{#unless this.fixedHeight}}<div class="{{~inline-switch this.aspectRatio  '["16x9","16x7","4x3","100x27","100","9x16","7x16"]' '["ar-16-9","ar-16-7","ar-4-3","ar-100-27","ar-1-1","ar-9-16","ar-7-16","ar-16-9"]'~}}">{{/unless}}
-                        <iframe frameborder="0" width="100%" height="100%"
-                                src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen
-                                allowfullscreen scrolling='no'>
-                        </iframe>
+                        <iframe frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
                     {{#unless this.fixedHeight}}</div>{{/unless}}                        
                 </div>
-            
             {{else}}
-            
+                <!-- Embedding via JS without DataPolicyCheck-->  
                 <div class="c-externalService__{{this.externalServiceConfig.externalServiceId}} js-load"
-                    data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}", "embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}", "dataPolicyCheck": false, "iFrameConfig":{}}'>
-                </div>
-                
-            {{/if}}
-                
+                    data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","dataPolicyCheck": false,"iFrameConfig":{}}'>
+                </div>  
+            {{/if}}    
             {{~> components/externalService/components/external_service_caption ~}}
-            
             <span class="sr-only">{{loca "story_externalservice_outro_sr" }}</span>    
         </div>
     {{/if}}

package/dist/views_static/components/externalService/external_service_with_datapolicy_check.hbs

@@ -1,9 +1,8 @@
 <div class="grid clear-both mt-10">
-        {{~> components/base/a11y/hiddenText _locaTag="story_externalservice_intro_sr" ~}}
+        {{~> components/base/a11y/hiddenText _locaTag="story_externalservice_intro_sr" ~}}        
         <div class="c-externalService c-externalService__{{this.externalServiceConfig.externalServiceId}} js-load"
-             data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}", "embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}", "dataPolicyCheck": true,"iFrameConfig": {"heightClass":""{{#if
-                 this.fixedHeight}},"fixedHeight":"{{this.fixedHeight}}", "fixedHeightClass":"-fixedHeight"{{else}},{{#if
-                 this.aspectRatio}}"aspectRatio":"{{this.aspectRatio}}"{{else}}"aspectRatio":"16x9"{{/if}}{{/if}},"noResponsiveIframe":"{{{this.setResponsiveIframe}}}","refreshContent":"{{{this.setTimedReloadIframe}}}","refreshIntervall":"{{this.setTimeForReload}}"}}'>
+             data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","dataPolicyCheck": true,"iFrameConfig": { {{#if this.fixedHeight}}
+                "fixedHeight":"{{this.fixedHeight}}"{{else}}{{#if this.aspectRatio}}"aspectRatio":"{{this.aspectRatio}}"{{else}}"aspectRatio":"16x9"{{/if}}{{/if}},"noResponsiveIframe":"{{{this.setResponsiveIframe}}}"{{#if this.setTimedReloadIframe}},"refreshContent":"{{{this.setTimedReloadIframe}}}","refreshIntervall":"{{this.setTimeForReload}}"{{/if}} }}'>
             {{~> components/externalService/components/external_service_data_policy ~}}
         </div>
         {{~> components/externalService/components/external_service_caption ~}}

package/dist/views_static/components/geoTag/geoTag_list.hbs

@@ -5,7 +5,7 @@
         <ul class="flex flex-wrap gap-x-4 w-fit sm:w-full sm:pt-2 ">
             {{~#each this~}}
                 <li class="w-fit sm:w-full text-primary dark:text-standard-text-dark">
-                    <a class="block hover:underline gap-x-1" href="{{this.url}}">
+                    <a class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}block hover:underline gap-x-1" href="{{this.url}}">
                         {{~> components/base/image/icon _icon="ortsmarke" _addClass="inline w-5 h-5 mr-2 fill-current"~}}
 
                         {{~this.title~}}

package/dist/views_static/components/mediaplayer/media_player.hbs

@@ -8,7 +8,7 @@
             {{/with~}}
         {{/unless}}
         {{#with _teaser}}
-            {{#if this.isTickerTeaser}}<a href="{{this.link.url}}" aria-label="Zum Ticker" tabindex="-1">{{/if}}
+            {{#if this.isTickerTeaser}}<a href="{{this.link.url}}" aria-label="Zum Ticker" tabindex="-1"{{#if (isUserConsentNeeded this.link.url)}} class="js-user-consent-needed"{{/if}}>{{/if}}
                 {{~> components/base/image/responsive_image this.teaserImage _type=(if this.teaserType this.teaserType 'story') _variant=(if this.content.imageVariant this.content.imageVariant '100-copytext') _addClassImg=(appendToDefault _addClassImg "ar__content") _noDelay=this.dontLazyload ~}}                             
             {{#if this.isTickerTeaser}}</a>{{/if}}
         {{/with}}

package/dist/views_static/components/modal/modal.hbs

@@ -1,4 +1,4 @@
-<div class="js-load" data-hr-modal='{"modalTriggerId":"{{defaultIfEmpty _trigger ""}}", "trackingInformations": {{this.link.cmsDocument.trackingInformations.ticketLink}},"dialogPolyfillBaseUrl":"{{resourceUrl (configProperty 'dialogPolyfill.baseUrl')}}"}'>
+<div class="js-load" data-hr-modal='{"trigger":"{{if _trigger _trigger ""}}", "type":"{{defaultIfEmpty _type 'default'}}", "dialogPolyfillBaseUrl":"{{resourceUrl (configProperty 'dialogPolyfill.baseUrl')}}"}'>
     <dialog class='js-modal p-0 backdrop:bg-gray-scorpion/90 shadow-md {{defaultIfEmpty _css "sm:max-w-xl"}}'>
         <form method="dialog" class="js-dialog-content p-4">
             {{> @partial-block }}

package/dist/views_static/components/modal/user_consent.hbs

@@ -0,0 +1,13 @@
+{{#> components/teaser/components/teaser_headline}}
+    {{> components/teaser/components/teaser_title _text=_headline _css="text-2xl"}}
+{{/components/teaser/components/teaser_headline}}
+<p class="mt-2 text-base font-copy">{{_text}}</p>
+
+<div class="flex flex-wrap mt-4"> 
+    {{#> components/button/button _size="lg" _variant="tertiary" _value="cancel" _css="mr-4 mt-4"}}
+        {{>components/button/components/button_label _label=_labelCancel _css=""}}
+    {{/components/button/button}}
+    {{#> components/button/link_button _link='{"url":"#", "isTargetBlank": false, "hasIcon": false}' _size="lg" _css="js-user-consent-ok js-modal-close mt-4"}}
+        {{>components/button/components/button_label _label=_labelOk _css=""}}
+    {{/components/button/link_button}}
+</div>

package/dist/views_static/components/navigation/breadcrumb/breadcrumb.hbs

@@ -8,7 +8,7 @@
         {{/with}}
         <li class="inline">
             <h1 class="inline{{#unless this.showBreadcrumbTitleAlways}} sr-only sm:not-sr-only{{/unless}}">
-                <a href="{{_currentPageUrl}}" class="{{> components/navigation/breadcrumb/utils/breadcrumb_link_classes}}">{{~_currentPageTitle~}}</a>
+                <a href="{{_currentPageUrl}}" class="{{if (isUserConsentNeeded _currentPageUrl) 'js-user-consent-needed ' ''}}{{> components/navigation/breadcrumb/utils/breadcrumb_link_classes}}">{{~_currentPageTitle~}}</a>
             </h1>
         </li>
     </ul>

package/dist/views_static/components/navigation/breadcrumb/breadcrumb_items.ssi.hbs

@@ -1,6 +1,6 @@
 {{~#each this.breadcrumb}}
     <li class="inline">
-        <a href="{{this.url}}" class="{{> components/navigation/breadcrumb/utils/breadcrumb_link_classes}}">
+        <a href="{{this.url}}" class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}{{> components/navigation/breadcrumb/utils/breadcrumb_link_classes}}">
             <span>{{this.title}}</span>
         </a>
         <span class="ds-icon-container inline-block">{{~> components/base/image/icon _icon="arrow-right" _addClass="mx-2 w-2 h-2 text-inherit fill-link" _iconmap="icons"~}}</span>

package/dist/views_static/components/page/components/author.hbs

@@ -35,7 +35,7 @@
             <div class="self-start text-xs sm480:text-sm basis-0 grow font-headingSerif text-gray-scorpion dark:text-text-dark">
                 {{#unless _hideFrom }}Von{{/unless}}
                 {{#if this.authorUrl~}}
-                    <a href="{{this.authorUrl}}" {{#with this.webviewAuthorUrl}}data-webviewurl="{{this}}"{{/with}} class="text-link hover:underline dark:text-link-dark ">{{this.authorTitle}}</a>
+                    <a href="{{this.authorUrl}}" {{#with this.webviewAuthorUrl}}data-webviewurl="{{this}}"{{/with}} class="{{if (isUserConsentNeeded this.authorUrl) 'js-user-consent-needed ' ''}}text-link hover:underline dark:text-link-dark ">{{this.authorTitle}}</a>
                 {{else}}
                     {{this.authorTitle}}
                 {{/if}}

package/dist/views_static/components/page/components/socialsharing.hbs

@@ -4,7 +4,7 @@
         <ul class="flex justify-end">
             {{~#with this.twitterLink ~}}
                 <li class="float-left mr-3">
-                    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                         href="{{this}}"
                         target="_blank"
                         rel="noopener noreferrer"
@@ -19,7 +19,7 @@
             {{~/with~}}
             {{~#with this.facebookLink ~}}
                 <li class="float-left mr-3">
-                    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                         href="{{this}}"
                         target="_blank"
                         rel="noopener noreferrer"
@@ -34,7 +34,7 @@
             {{~/with~}}
             {{~#with this.whatsappLink ~}}
                 <li class="float-left mr-3">
-                    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                         href="{{this}}"
                         target="_blank"
                         rel="noopener noreferrer"
@@ -49,7 +49,7 @@
             {{~/with~}}
             {{~#with this.mailtoLink ~}}
                 <li class="float-left mr-3">
-                    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                         href="{{this}}"
                         title="{{loca "share_mail_linktitle" }}"
                         {{#with ../../this.content.trackingData}}

package/dist/views_static/components/podcast/components/podcast_subscribe_button.hbs

@@ -54,7 +54,7 @@
         <ul>
             {{~#each this~}}
                 <li class="{{#unless @last}}border-b{{/unless}}"> 
-                    <a class="flex px-2 py-2 text-left ds-link whitespace-nowrap hover:underline disabled:text-gray-500 js-load"
+                    <a class="{{if (isUserConsentNeeded this.podcastHosterUrl) 'js-user-consent-needed ' ''}}flex px-2 py-2 text-left ds-link whitespace-nowrap hover:underline disabled:text-gray-500 js-load"
                         title="{{this.podcastHosterName}}" 
                         target="_blank"
                         rel="noopener noreferrer"

package/dist/views_static/components/podcast/podcast_player.hbs

@@ -75,7 +75,7 @@
         <div class="flex justify-end w-full pl-4">
           <div class="flex flex-col flex-wrap self-end text-xs font-heading text-podcast-text dark:text-podcast-text-dark">
             <span class="self-end font-bold">Zur Sendung</span>
-            <a class="self-end underline ds-link" href="{{this.url}}">{{this.title}}</a>
+            <a class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}self-end underline ds-link" href="{{this.url}}">{{this.title}}</a>
           </div>
         </div>
       {{/with}}          

package/dist/views_static/components/site_header/brand_navigation/brand_navigation_item.hbs

@@ -1,3 +1,3 @@
 <li class="sb-brand-navigation-item h-8 {{#if @first }}-ml-3 {{/if}}{{#if this.selected}} h-10 md:h-8 font-bold text-brandnav-pseudo {{/if}}cursor-pointer inline-block lg:hover:underline active:font-bold active:text-primary">   
-   <a class="link-focus-inset leading-[34px] items-center flex-col px-3 {{#if this.selected }}relative {{/if}}md:flex-row js-load w-max flex justify-center {{#if this.selected}} -currentBrand {{/if}}" aria-label="{{this.name}}" href="{{resourceUrl "index.html" _site=this.site}}"{{#if this.extern}} target="_blank" rel="noopener noreferrer"{{/if}} data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Brandnavigation::{{this.text}}-Link geklickt"}]}'>{{this.text}}</a>
+   <a class="{{if (isUserConsentNeeded (resourceUrl "index.html" _site=this.site)) 'js-user-consent-needed ' ''}}link-focus-inset leading-[34px] items-center flex-col px-3 {{#if this.selected }}relative {{/if}}md:flex-row js-load w-max flex justify-center {{#if this.selected}} -currentBrand {{/if}}" aria-label="{{this.name}}" href="{{resourceUrl "index.html" _site=this.site}}"{{#if this.extern}} target="_blank" rel="noopener noreferrer"{{/if}} data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Brandnavigation::{{this.text}}-Link geklickt"}]}'>{{this.text}}</a>
 </li>

package/dist/views_static/components/site_header/navigation_flyout/navigation_flyout.hbs

@@ -32,7 +32,7 @@
             {{#if ../this.flyoutStartLinkText}}
                 <div class="w-full">
                     <div class="{{~#if ../_isSectionNav}}hidden lg:flex{{else}}flex{{/if}} pt-4 pb-2 pl-4 text-base font-bold bg-white lg:pl-0 md:pt-4 lg:pt-1 lg:pb-0 justify-left text-primary ">              
-                        <a href="{{resourceUrl ../this.url}}" class="-isHeaderLink lg:leading-10 link-focus-inset js-load" data-hr-click-tracking='{"settings": [{"type": "uxAction", "secondLevelId": 1, "clickLabel": "{{../_navigationType}}::{{../_parent}}::{{../this.flyoutStartLinkText}}-Link geklickt"}]}' >
+                        <a href="{{resourceUrl ../this.url}}" class="{{if (isUserConsentNeeded (resourceUrl ../this.url)) 'js-user-consent-needed ' ''}}-isHeaderLink lg:leading-10 link-focus-inset js-load" data-hr-click-tracking='{"settings": [{"type": "uxAction", "secondLevelId": 1, "clickLabel": "{{../_navigationType}}::{{../_parent}}::{{../this.flyoutStartLinkText}}-Link geklickt"}]}' >
                             {{../this.flyoutStartLinkText}}
                         </a>      
                     </div>          

package/dist/views_static/components/site_header/section_navigation/section_navigation_item.hbs

@@ -28,7 +28,7 @@
                         @click="preventDefault(isDesktopView(),$event); toggle(); correctFlyoutPos()"
                         @resize.window="dropped=false; correctFlyoutPos()" 
                         :class="dropped ? 'lg:underline font-bold lg:font-normal' : 'font-normal'"
-                        class="js-noStateManager {{#if this.selected}}-currentSection lg:justify-center !font-bold {{/if}}link-focus-inset js-load pl-5 pr-8 lg:pl-4 lg:pr-4 flex flex-auto justify-between lg:flex-initial h-10 lg:w-full items-center leading-4" 
+                        class="{{#if this.extern}}{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}{{else}}{{if (isUserConsentNeeded (resourceUrl this.url)) 'js-user-consent-needed ' ''}}{{/if}}js-dropdown-in-desktop js-noStateManager {{#if this.selected}}-currentSection lg:justify-center !font-bold {{/if}}link-focus-inset js-load pl-5 pr-8 lg:pl-4 lg:pr-4 flex flex-auto justify-between lg:flex-initial h-10 lg:w-full items-center leading-4" 
                         aria-haspopup="true"  
                         x-effect="$el.setAttribute('aria-expanded', dropped);$el.setAttribute('tabindex',  $store.burgeropen || $screen('lg') ? '0' : '-1')"
                         aria-owns="flyout-{{getRandom}}" 
@@ -42,7 +42,7 @@
                         id="flyout-{{nextRandom}}-1" 
                         
                         :class="dropped ? 'font-bold' : ''"
-                        class="{{#if this.selected}}-currentSection lg:justify-center {{/if}}link-focus-inset js-load pl-5 pr-8 lg:pl-4 lg:pr-4 flex flex-auto h-10 items-center leading-4 lg:w-full lg:justify-center{{#if this.selected}} font-bold{{/if}}"
+                        class="{{#if this.extern}}{{if (isUserConsentNeeded this.Url) 'js-user-consent-needed ' ''}}{{else}}{{if (isUserConsentNeeded (resourceUrl this.url)) 'js-user-consent-needed ' ''}}{{/if}}{{#if this.selected}}-currentSection lg:justify-center {{/if}}link-focus-inset js-load pl-5 pr-8 lg:pl-4 lg:pr-4 flex flex-auto h-10 items-center leading-4 lg:w-full lg:justify-center{{#if this.selected}} font-bold{{/if}}"
                         {{#if this.labelText}} aria-label="{{this.labelText}}"{{/if}} 
                         aria-haspopup="true" 
                         x-effect="$el.setAttribute('aria-expanded', dropped || $screen('lg'));$el.setAttribute('tabindex',  $store.burgeropen || $screen('lg') ? '0' : '-1')"
@@ -57,7 +57,7 @@
                 {{!-- Gilt für START/GESELLSCHAFT/WIRTSCHAFT usw:  --}}
                 <a {{#if this.extern}}href="{{this.url}}{{else}}href="{{resourceUrl
                     this.url}}{{/if}}" 
-                    class="{{#if this.selected}}-currentSection lg:justify-center {{/if}} link-focus-inset js-load flex justify-start px-5 lg:px-4 h-10 lg:justify-center items-center w-full{{#if this.selected}} font-bold{{/if}}" 
+                    class="{{#if this.extern}}{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}{{else}}{{if (isUserConsentNeeded (resourceUrl this.url)) 'js-user-consent-needed ' ''}}{{/if}}{{#if this.selected}}-currentSection lg:justify-center {{/if}} link-focus-inset js-load flex justify-start px-5 lg:px-4 h-10 lg:justify-center items-center w-full{{#if this.selected}} font-bold{{/if}}" 
                     {{#if this.labelText}} aria-label="{{this.labelText}}"{{/if}} 
                     data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Rubriknavigation::{{this.text}}-Link geklickt"}]}'
                     x-effect="$el.setAttribute('tabindex',  $store.burgeropen || $screen('lg') ? '0' : '-1')"

package/dist/views_static/components/site_header/service_logo.hbs

@@ -1,4 +1,4 @@
-<a class="relative flex items-center w-auto h-full text-white fill-current sb-service-logo link-focus-inset print:hidden" 
+<a class="{{if (isUserConsentNeeded (resourceUrl 'index.html')) 'js-user-consent-needed ' ''}}relative flex items-center w-auto h-full text-white fill-current sb-service-logo link-focus-inset print:hidden" 
     href={{resourceUrl "index.html"}} 
     title="{{loca "header_homepage_link_title"}}">
 

package/dist/views_static/components/site_header/service_navigation/service_navigation_item.hbs

@@ -20,9 +20,9 @@
         {{else}}
 
             {{#if this.extern}}
-                <a href="{{this.url}}" target="_blank" x-init="dropped = false" class="flex flex-col items-center justify-center h-full px-4 lg:justify-start lg:px-3 lg:pt-1 lg:rounded-t link-focus-inset js-load" id="flyout-{{nextRandom}}-1" data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}'>
+                <a href="{{this.url}}" target="_blank" x-init="dropped = false" class="{{if (isUserConsentNeeded this.url) 'js-user-consent-needed ' ''}}flex flex-col items-center justify-center h-full px-4 lg:justify-start lg:px-3 lg:pt-1 lg:rounded-t link-focus-inset js-load" id="flyout-{{nextRandom}}-1" data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}'>
             {{else}}
-                <a href="{{resourceUrl this.url}}" x-init="dropped = false" class="flex flex-col items-center justify-center h-full px-4 lg:justify-start lg:px-3 lg:pt-1 lg:rounded-t link-focus-inset js-load" id="flyout-{{nextRandom}}-1" data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}'>
+                <a href="{{resourceUrl this.url}}" x-init="dropped = false" class="{{if (isUserConsentNeeded (resourceUrl this.url)) 'js-user-consent-needed ' ''}}flex flex-col items-center justify-center h-full px-4 lg:justify-start lg:px-3 lg:pt-1 lg:rounded-t link-focus-inset js-load" id="flyout-{{nextRandom}}-1" data-hr-click-tracking='{"settings": [{"type": "uxNavigation", "secondLevelId": 1, "clickLabel": "Servicenavigation::{{this.text}}-Link geklickt"}]}'>
             {{/if}}
 
         {{/if}}

package/dist/views_static/components/social_sharing/social_sharing_compact_icons.hbs

@@ -1,5 +1,5 @@
 <li>
-    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
+    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
         
         href="{{this}}"
         target="_blank"
@@ -13,7 +13,7 @@
     </a>
 </li>
 <li class="">
-    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
+    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
         
         href="{{this}}"
         target="_blank"
@@ -27,7 +27,7 @@
     </a>
 </li>
 <li class="">
-    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
+    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
         
         href="{{this}}"
         target="_blank"
@@ -41,7 +41,7 @@
     </a>
 </li>
 <li class="">
-    <a class="{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
+    <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}} flex order-2 ds-button font-heading active:scale-95 w-8 h-8"
         
         href="{{this}}"
         title="{{loca "share_mail_linktitle" }}"

package/dist/views_static/components/socialmedia/socialmedia.hbs

@@ -5,7 +5,7 @@
     <ul class="flex flex-wrap w-full pt-2 gap-x-2 gap-y-2">
         {{~#with this.twitterLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     target="_blank"
                     rel="noopener noreferrer"
@@ -20,7 +20,7 @@
         {{~/with~}}
         {{~#with this.facebookLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     target="_blank"
                     rel="noopener noreferrer"
@@ -35,7 +35,7 @@
         {{~/with~}}
         {{~#with this.whatsappLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     target="_blank"
                     rel="noopener noreferrer"
@@ -50,7 +50,7 @@
         {{~/with~}}
         {{~#with this.mailtoLink ~}}
             <li>
-                <a class="{{#with ../../this.content.trackingData}} js-load{{/with}}"
+                <a class="{{if (isUserConsentNeeded this) 'js-user-consent-needed ' ''}}{{#with ../../this.content.trackingData}} js-load{{/with}}"
                     href="{{this}}"
                     title="{{loca "share_mail_linktitle" }}"
                     {{#with ../../this.content.trackingData}}

package/dist/views_static/components/teaser/components/teaser_body.hbs

@@ -21,6 +21,15 @@
                         {{/if}}
                     {{/components/teaser/components/teaser_headline}}
                 {{/components/base/link}} 
+                {{#if (isStorybook)}}
+                    {{#if this.link.isUserConsentNeeded}}
+                        {{#with this}}
+                            {{#> components/modal/modal _type="userConsent" _css="" _trigger=".js-user-consent-needed"}}
+                                {{> components/modal/user_consent _link=this.link _headline=(loca "modal_user_consent_headline") _text=(loca "modal_user_consent_text") _labelOk=(loca "modal_user_consent_label_ok") _labelCancel=(loca "modal_user_consent_label_cancel")}}
+                            {{/components/modal/modal}}
+                        {{/with}}
+                    {{/if}}
+                {{/if}}
         {{/components/teaser/components/teaser_header}}
         {{#*inline "htmlProperties"}}
             {{#if this.isFileDownload}}
@@ -32,7 +41,7 @@
     {{#unless this.hideBylineAndShorttext}}
         <div class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
             {{#if this.shorttext}}
-                {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize}}
+                {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize }}
             {{/if}}
             {{> components/teaser/components/teaser_byline}} 
         </div>

package/dist/views_static/components/teaser/components/teaser_lead.hbs

@@ -1,7 +1,7 @@
 {{~#if this.allowAVConsumption ~}}
     {{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _teaserType=_teaserType _addClassImg=_addClassImg}}
 {{else}}
-    {{#if this.isTickerTeaser}}<a href="{{this.link.url}}" aria-label="Zum Ticker" tabindex="-1">{{/if}}
+    {{#if this.isTickerTeaser}}<a href="{{this.link.url}}" aria-label="Zum Ticker" tabindex="-1"{{#if (isUserConsentNeeded this.link.url)}} class="js-user-consent-needed"{{/if}}>{{/if}}
         {{> components/teaser/components/teaser_image _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _addClassImg=_addClassImg _aspectRatio=_aspectRatio}}
     {{#if this.isTickerTeaser}}</a>{{/if}}
 {{/if}}