https://www.eu-gleichbehandlungsstelle.de/_assets/9da1c2a6d746389c…/current/public/chunks/grid-C1KBFPJm.js

1import{g as t,l as s,e,b as i,A as r,i as a}from"./pp-accordion-CA6w9In6.js";import{o}from"./pp-facet-dropdown-FY1eeaHH.js";import{u as n,i as l}from"./pp-highcharts-D5Crk9o0.js";import{M as h}from"./pp-social-media-newsroom-XnZulFRf.js";import"./bootstrap-collapse-tT-5TXrK.js";import"./pp-slider-BLQQXShl.js";import"./pp-process-CNG5NvVa.js";class p extends(h(a)){static get properties(){return{itemsInitial:{type:Number,attribute:"items-initial"},itemsAdd:{type:Number,attribute:"items-add"},noVerticalGap:{type:Boolean,attribute:"no-vertical-gap"},verticalSeparator:{type:Boolean,attribute:"vertical-separator"},itemsCurrent:{type:Number,attribute:!1},columns:{type:Number},items:{type:Array},currentItemIndex:{type:Number},masonryLayout:{type:Boolean,attribute:"masonry-layout"}}}constructor(){super(),this.columns=4,this.currentItemIndex=0,this.itemsInitial=9999,this.itemsAdd=9999,this.noVerticalGap=!1,this.verticalSeparator=!1,this.masonryLayout=!1}firstUpdated(){this.masonryLayout&&this.addEventListener(n,this.initMiniMasonry)}connectedCallback(){super.connectedCallback(),this.itemsCurrent=this.itemsInitial,this._children||(this._children=t(this,["html-collection","pp-button-progress","pp-list"])),this._children["pp-button-progress"]&&this.addEventListener(l,this.updateItemsAndSetFocus),this.items||(this.items=[...this._children?.["html-collection"].children].map(t=>s(t)))}async updateItemsAndSetFocus(){this.itemToFocus=this.itemsCurrent+1,this.itemsCurrent+=this.itemsAdd,await this.updateComplete,this.elementToFocus=this.querySelector(`.js-list-item:nth-child(${this.itemToFocus})`),this.elementToFocus.focus()}customMiniMasonryConfig(){let t;switch(this.columns){case 3:t=330;break;case 2:t=380;break;default:t=250}return{baseWidth:t,ultimateGutter:this.noVerticalGap?0:10,gutterX:10,gutterY:this.noVerticalGap?0:30}}get gridContentWidthClasses(){return{"lg:col-10":2===this.columns}}get listItemClasses(){return{"sm:col-6":1!==this.columns&&!this.masonryLayout,"lg:col-4":!this.masonryLayout&&(3===this.columns||4===this.columns),"xl:col-3":4===this.columns,"border-1":!this.verticalSeparator,"border-solid":!this.verticalSeparator,"border-transparent":!this.verticalSeparator,"border-t-2":this.verticalSeparator,"border-t-line-1":this.verticalSeparator,"animate-fade-in":this.currentItemIndex>this.itemsInitial,absolute:this.masonryLayout,relative:!this.masonryLayout,"sm:px-15":!this.masonryLayout}}get listClasses(){return{"gap-y-32":!this.noVerticalGap,"md:gap-y-40":!this.noVerticalGap,relative:this.masonryLayout,"js-minimasonry":this.masonryLayout,"justify-center":!this.masonryLayout}}get progressButtonClasses(){return{"pt-40":this.verticalSeparator,"border-t-2":this.verticalSeparator,"border-t-line-1":this.verticalSeparator}}get itemList(){return i`
2            <ul class="qs-grid-list row ${e(this.listClasses)} px-0">
3                ${this.items.map((t,s)=>this.getItem(t,s))}
4            </ul>
5        `}getItem(t,s){return this.currentItemIndex+=1,s+1<=this.itemsCurrent?i`
6                <li class="${e(this.listItemClasses)} js-list-item col-12" tabindex="-1">
7                    ${t}
8                </li>`:r}get progressButton(){return!this._children["pp-button-progress"]||this.itemsCurrent>=this.items.length?r:i`
9            <div class="z-1 relative ${e(this.progressButtonClasses)}">
10                ${this._children["pp-button-progress"]}
11            </div>
12        `}get buttonList(){return this._children["pp-list"]?i`
13            <div class="pt-40">
14                ${this._children["pp-list"]}
15            </div>
16        `:r}render(){return i`
17            <div class="container"
18                 aria-live="${o(this._children["pp-button-progress"]?"polite":void 0)}"
19            >
20                <div class="row">
21                    <div class="mx-auto col-12 ${e(this.gridContentWidthClasses)}">
22                        ${this.itemList}
23                        ${this.progressButton}
24                        ${this.buttonList}
25                    </div>
26                </div>
27            </div>
28                
29        `}createRenderRoot(){return this}}

29customElements.define("pp-grid",p);export{p as default};