https://www.eu-gleichbehandlungsstelle.de/_assets/9da1c2a6d746389c…/pp-social-media-newsroom-XnZulFRf.js

1import{a as t,c as e,A as i,t as s,E as r,i as a,g as n,b as o,_ as c,e as l}from"./pp-accordion-CA6w9In6.js";import{o as h}from"./pp-facet-dropdown-FY1eeaHH.js";import{I as u,b as d,c as p,B as m}from"./pp-highcharts-D5Crk9o0.js";import{h as g}from"./bootstrap-collapse-tT-5TXrK.js";import{r as y,a as x}from"./pp-slider-BLQQXShl.js";var v,f;const b=g(function(){if(f)return v;f=1;var t=y(),e=x();return v=function(i,s,r){var a=!0,n=!0;if("function"!=typeof i)throw new TypeError("Expected a function");return e(r)&&(a="leading"in r?!!r.leading:a,n="trailing"in r?!!r.trailing:n),t(i,s,{leading:a,maxWait:s,trailing:n})}}()),T=(t,e)=>{if(!t||!e)return!1;if("a"!==t.target?.tagName?.toLowerCase()){const i=e.querySelector("a[href]");if(i)return t.preventDefault(),t.stopPropagation(),i.click(),!0}return!1};class w extends e{constructor(t){if(super(t),this.it=i,t.type!==s.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===i||null==t)return this._t=void 0,this.it=t;if(t===r)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;const e=[t];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}}w.directiveName="unsafeHTML",w.resultType=1;const $=t(w);class M extends a{static get properties(){return{contentHref:{type:String,attribute:"content-href"},a11yExternalLinkMessage:{type:String,attribute:"a11y-external-link-message"},videoOverlay:{type:Boolean,attribute:"video-overlay"},medium:{type:String}}}connectedCallback(){super.connectedCallback(),this.addEventListener(u,this.hideImageOverlay),this._children=n(this,["pp-image","pp-text-with-icon","pp-text","pp-link","pp-switch-content-with-transition"])}hideImageOverlay(){this.videoOverlay=!1}clickAnchorIfNotTarget(t){T(t,this)}get imageOverlay(){return this.videoOverlay?o`<div class="qs-video-overlay absolute left-10 bottom-10 z-10 h-60 w-60 u-icon-flockler-video"></div>`:i}get imageEmbed(){return this._children?.["pp-image"]?o`
2                <div class="relative">
3                    ${this.imageOverlay}
4                    ${this._children?.["pp-image"]}
5                </div>`:i}get icons(){return o`
6            <div class="mr-24" aria-hidden="true">
7                ${this._children?.["pp-switch-content-with-transition"]}
8            </div>
9        `}get contentEmbed(){return this.contentHref?o`
10                <a href="${this.contentHref}"
11                    class="s-social-media-newsroom-item relative block overflow-hidden word-wrap mb-24 typ-body-2 text-static-2 focus:underline hover:underline outline-none"
12                    target="_blank"
13                    rel="noopener noreferrer"
14                >
15                    ${this._children?.["pp-text"]}
16                    <span class="sr-only">${this.a11yExternalLinkMessage}</span>
17                </a>
18            `:o`
19            <span class="s-social-media-newsroom-item relative block overflow-hidden word-wrap mb-24 typ-body-2 text-static-2">
20                ${this._children?.["pp-text"]}
21            </span>
22        `}render(){return o`
23            <article
24                class="qs-social-media-item group outline-grey hover:shadow-card hover:duration-200 hover:ease-out hover:outline
25                            hover:outline-1 focus:shadow-card focus:duration-200 focus:ease-out focus:outline focus:outline-1
26                            focus-within:shadow-card focus-within:duration-200 focus-within:ease-out
27                            focus-within:outline focus-within:outline-1 duration-300 ease-out cursor-pointer"
28                @click="${this.clickAnchorIfNotTarget}"
29            >
30                ${this.imageEmbed}
31                <div class="p-20">
32                    <div class="flex flex-wrap items-center text-static-16 mb-16 qs-social-media-icon">
33                        ${this.icons} ${this._children?.["pp-text-with-icon"]}
34                    </div>
35                    <div class="mb-20 group-hover:underline group-focus-within:underline">
36                        ${this.contentEmbed}
37                    </div>
38                </div>
39            </article>
40        `}createRenderRoot(){return this}}customElements.define("pp-social-media-newsroom-item",M);const S=Object.freeze(Object.defineProperty({__proto__:null,default:M},Symbol.toStringTag,{value:"Module"})),k=t=>class extends t{static get properties(){return{keepItemOrder:{type:Boolean,attribute:"keep-item-order"}}}miniMasonry;constructor(){super(),this.keepItemOrder=!1}async initMiniMasonry(){const{default:t}=await c(async()=>{const{default:t}=await import("./minimasonry.esm-dRtPXVgI.js");return{default:t}},[],import.meta.url);await new Promise(t=>{setTimeout(t,0)}),await this.updateComplete,this.addEventListener(d,this.updateMiniMasonryLayout),this.miniMasonry=new t(this.constructMiniMasonryConfig()),window.addEventListener("resize",b(this.updateMiniMasonryLayout.bind(this),16))}updateMiniMasonryLayout(){this.miniMasonry.layout()}constructMiniMasonryConfig(){return{container:".js-minimasonry",baseWi

40dth:330,ultimateGutter:40,gutterX:30,gutterY:40,surroundingGutter:!1,minify:!this.keepItemOrder,...this.customMiniMasonryConfig()}}customMiniMasonryConfig(){return{}}},E=t=>class extends t{static get properties(){return{serviceUnavailableErrorText:{type:String,attribute:"service-unavailable-error-text"},noContentErrorText:{type:String,attribute:"no-content-error-text"},sectionID:{type:String,attribute:"section-id"},articlesList:{type:Object,attribute:!1},errorMessage:{type:Object,attribute:!1},count:{type:Number},apiKey:{type:String},url:{type:String},tag:{type:String}}}constructor(){super(),this.count=100,this.apiKey="2760bfb98c03306453d4070f4faf5dd6",this.serviceUnavailableErrorText="Wir konnten leider keine Daten laden. Laden Sie die Seite erneut oder versuchen Sie es später noch einmal.",this.noContentErrorText="In diesem Bereich sind leider aktuell keine Posts vorhanden. Versuchen Sie es später noch einmal."}isLocalData(t){return new URL(document.baseURI).origin===new URL(t,document.baseURI).origin}fetchArticles(){return fetch(this.urlForFlockerRequest).then(t=>(!t.ok||t.status,t.json()))}get urlForFlockerRequest(){if(this.isLocalData(this.url))return this.url;const t=new URL(this.url);return t.searchParams.set("api_key",this.apiKey),t.searchParams.append("filterBySectionIds[]",this.sectionID),t.searchParams.set("count",this.count),this.tag&&t.searchParams.append("filterByTags[]",this.tag),t}};class L extends(k(E(a))){static get properties(){return{bmasOnFacebookText:{type:String,attribute:"bmas-on-facebook"},bmasOnXText:{type:String,attribute:"bmas-on-x"},bmasOnInstagramText:{type:String,attribute:"bmas-on-instagram"},agoText:{type:String,attribute:"ago-text"},yearText:{type:String,attribute:"year-text"},yearsText:{type:String,attribute:"years-text"},monthText:{type:String,attribute:"month-text"},monthsText:{type:String,attribute:"months-text"},dayText:{type:String,attribute:"day-text"},daysText:{type:String,attribute:"days-text"},hourText:{type:String,attribute:"hour-text"},hoursText:{type:String,attribute:"hours-text"},minuteText:{type:String,attribute:"minute-text"},minutesText:{type:String,attribute:"minutes-text"},secondsText:{type:String,attribute:"seconds-text"},a11yExternalLinkMessage:{type:String,attribute:"a11y-external-link-message"},articlesId:{type:String,attribute:"articles-id"},ariaBusy:{type:Boolean,attribute:!1},theme:{type:String}}}constructor(){super(),this.theme="primary",this.bmasOnFacebookText="Das BMAS auf Facebook",this.bmasOnXText="Das BMAS auf X",this.bmasOnInstagramText="Das BMAS auf Instagram",this.agoText="vor",this.yearText="Jahr",this.yearsText="Jahren",this.monthText="Monat",this.monthsText="Monaten",this.dayText="Tag",this.daysText="Tagen",this.hourText="Stunde",this.hoursText="Stunden",this.minuteText="Minute",this.minutesText="Minuten",this.secondsText="Sekunden",this.a11yExternalLinkMessage="Mit dem Klick dieses Links verlassen Sie die BMAS-Seite",this.articlesId=p,this._children=n(this,["html-collection","pp-list"]),this.articlesList=i,this.errorMessage=i}async firstUpdated(){this.initEvents(),await this.resolveApiRequestsAndRenderArticles(),await this.initMiniMasonry()}connectedCallback(){super.connectedCallback(),this.miniMasonry&&this.updateMiniMasonryLayout()}async resolveApiRequestsAndRenderArticles(){await Promise.allSettled([this.fetchArticles()]).then(async t=>{const e=t[0];if("rejected"===e.status)throw new Error("Rejected");this.ariaBusy=!0,this.errorMessage=i,this.articlesList=i,this.requestUpdate(),await this.updateComplete;const{posts:s}=e.value;this.articlesList=this.renderTeaser(s),this.ariaBusy=!1,this.requestUpdate(),await this.updateComplete}).catch(()=>{this.errorMessage=o`<div class="qs-social-media-error mt-40 typ-body-2 text-static-2 text-center" role="status">${this.serviceUnavailableErrorText}</div>`})}errorInformation(){0===this.articlesList.length&&(this.errorMessage=o`<div class="qs-social-media-error mt-40 typ-body-2 text-static-2 text-center" role="status">${this.noContentErrorText}</div>`)}initEvents(){this.addEventListener(m,async t=>{this.sectionID=t.detail.customEventDetail,await this.resolveApiRequestsAndRenderArticles(),await this.initMiniMasonry()})}getMedium(t){return"twitter"===t?"x":t}getSvgTitle(t){return"instagram"===t?this.bmasOnInstagramText:"facebook"===t?this.bmasOnFacebookText:"twitter"===t?this.bmasOnXText:""}getBodyText(t){if(t.textRich){let e=t.textRich.replace(/<div[^>]*>/g,"").replace(/<img[^>]*>/g,"").replace(/<a[^>]*>/g,"").replace(/<p[^>]*>/g,"").slice(0,120);return e.length>=120&&(e=e.concat("","..")),o`<p data-slot="pp-text">${$(e)}</p>`}return i}rewriteDateString(t){const e=t.split(" ");if(3===e.length){return e.slice(0,2).join("T")+e[2]}return t}getDateCreated(t,e){return"60471"===this.sectionID?this.rewriteDateString(e):e}timeSince(t){const e=new Date,i=new Date(this.getDateCreated(t.channel,t.publishedAt)),s=e.getTime()-i.getTime();let r=s/31536e6;return r>2?`${this.agoText} ${Math.floor(r)} ${this.yearsText}`:r>1?`${this.agoText} ${Math.floor(r)} ${this.yearText}`:(r=s/2628e6,r>2?`${this.agoText} ${Math.floor(r)} ${this.monthsText}`:r>1?`${this.agoText} ${Math.floor(r)} ${this.monthText}`:(r=s/864e5,r>2?`${this.agoText} ${Math.floor(r)} ${this.daysText}`:r>1?`${this.agoText} ${Math.floor(r)} ${this.dayText}`:(r=s/36e5,r>2?`${this.agoText} ${Math.floor(r)} ${this.hoursText}`:r>1?`${this.agoText} ${Math.floor(r)} ${this.hourText}`:(r=s/6e4,r>2?`${this.agoText} ${Math.floor(r)} ${this.minutesText}`:r>1?`${this.agoText} ${Math.floor(r)} ${this.minuteText}`:`${this.agoText} ${Math.floor(s/1e3)} ${this.secondsText}`))))}getImage(t){const e=t?.images.length>0?t?.images[0].url:void 0;if(e){const i=t.images[0]?.altText?t.images[0]?.altText:t?.title;return o`
41                <pp-image
42                    src="${e}"
43                    alt="${h(i)}"
44                    emit-load-event
45                    data-slot="pp-image"
46                ></pp-image>
47            `}return""}get backgroundClasses(){return{"bg-static-22":"secondary"===this.theme,"bg-static-12":"primary"===this.theme}}renderTeaser(t){return t.map(t=>o`
48            <li class="absolute">
49                <div class="${l(this.backgroundClasses)}">
50                    <pp-social-media-newsroom-item
51                        content-href="${h(t.sourceUrl)}"
52                        medium="${h(this.getMedium(t.channel))}"
53                        a11y-external-link-message="${this.a11yExternalLinkMessage}"
54                        ?video-overlay="${"video"===t.postType||"video_inline"===t.postType}"
55                    >
56                        ${this.getImage(t)}
57                        <pp-switch-content-with-transition data-slot="pp-switch-content-with-transition">

58                            <span data-slot="html-collection">
59                                <pp-icon name="${this.getMedium(t.channel)}"
60                                    navid="icon-${t.id}"
61                                    svg-title="${this.getSvgTitle(t.channel)}"
62                                    data-slot="pp-icon" size="32">
63                                </pp-icon>
64                            </span>
65                            <span data-slot="html-collection-switched">
66                                <pp-icon name="${this.getMedium(t.channel)}-active"
67                                    navid="icon-${t.id}-active"
68                                    svg-title="${this.getSvgTitle(t.channel)}"
69                                    data-slot="pp-icon-active" size="32">
70                                </pp-icon>
71                            </span>
72                        </pp-switch-content-with-transition>
73
74                        <pp-text-with-icon icon="clock-with-bg" data-slot="pp-text-with-icon">
75                            <div data-slot="pp-text">
76                                <time datetime="${this.getDateCreated(t.channel,t.publishedAt)}">
77                                    ${this.timeSince(t)}
78                                </time>
79                            </div>
80                        </pp-text-with-icon>
81                        ${this.getBodyText(t)}
82                    </pp-social-media-newsroom-item>
83                </div>
84            </li>
85        `)}render(){return this.errorInformation(),o`
86            <aside class="relative mx-breakout w-screen">
87                <div class="container">
88                    <div class="row">
89                        <div class="col-12">
90                            ${this._children?.["pp-list"]}
91                            ${this.errorMessage}
92                            <ul id=${this.articlesId} class="js-minimasonry relative flex w-full mt-40 qs-social-media-list" aria-live="polite" aria-busy=${this.ariaBusy}>
93                                ${this.articlesList}
94                            </ul>
95                        </div>
96                    </div>
97                </div>
98            </aside>
99        `}createRenderRoot(){return this}}customElements.define("pp-social-media-newsroom",L);const _=Object.freeze(Object.defineProperty({__proto__:null,default:L},Symbol.toStringTag,{value:"Module"}));export{E as F,k as M,_ as a,T as c,$ as o,S as s,b as t};