https://www.eu-gleichbehandlungsstelle.de/_assets/9da1c2a6d746389c…/public/chunks/search-container-CTFam1IK.js

1import{B as e,g as t,_ as i,A as s,b as l,e as n}from"./pp-accordion-CA6w9In6.js";class a extends e{static get properties(){return{labelShowFilters:{type:String,attribute:"label-show-filters"},labelHideFilters:{type:String,attribute:"label-hide-filters"},showFilters:{type:Boolean,state:!0},noMargin:{type:Boolean,attribute:"no-margin"},collapseLg:{type:Boolean,attribute:"collapse-lg"},collapseOpen:{type:Boolean,attribute:"collapse-open"}}}constructor(){super(),this.labelShowFilters="Filter anzeigen",this.labelHideFilters="Filter ausblenden",this.showFilters=!0,this.noMargin=!1,this.collapseLg=!1,this.collapseOpen=!1,this._children=t(this,["pp-headline","pp-form","pp-headline-container-filter","pp-headline-container-radio-sort","pp-headline-container-radio-sort-mobile","pp-headline-container-facet","pp-button","pp-headline-search-results","pp-html","pp-headline-sr-only","pp-search","html-collection","pp-fieldset","pp-button-reset","pp-search-highlight"]),this.headlineSearchResults=this._children?.["pp-headline-search-results"],this.headlineContainerRadio=this._children?.["pp-headline-container-radio-sort"],this.headlineContainerRadioMobile=this._children?.["pp-headline-container-radio-sort-mobile"],this.collapsableContent=this._children["pp-html"]||this._children["pp-headline-container-filter"]||this._children?.["html-collection"],this.hasBgContainerContent=this._children?.["pp-headline"]||this._children?.["pp-headline-sr-only"]||this._children?.["pp-form"]||this._children?.["pp-search"]||this._children?.["pp-fieldset"]||this.collapsableContent||this._children?.["pp-headline-container-facet"]||this._children?.["pp-button-reset"]}async firstUpdated(){if(this.collapsableContent){this.showFilters=!this.collapseOpen,await i(()=>import("./bootstrap-collapse-tT-5TXrK.js").then(e=>e.c),[],import.meta.url),await new Promise(e=>{setTimeout(e,0)});const e=this.querySelector("#search-accordeon");e.addEventListener("show.bs.collapse",()=>{this.showFilters=!1}),e.addEventListener("hide.bs.collapse",()=>{this.showFilters=!0})}}get iconClasses(){return{"rotate-180":this.showFilters}}get facetContainerClasses(){return{container:!this._children?.["pp-html"]&&!this._children?.["pp-headline-container-filter"]}}get collapseContainerClasses(){return{container:!this._children["pp-fieldset"],"lg:hidden":this.headlineContainerRadioMobile&&!this.collapsableContent}}get collapseButtonContainerClasses(){return{"lg:hidden":!this.collapseLg}}get alignmentAndSpacingClasses(){return{"justify-between":this.headlineSearchResults&&this.headlineContainerRadio,"justify-end":!this.headlineSearchResults&&this.headlineContainerRadio,"mt-40":this._children?.["pp-search-highlight"],"pt-24":!this.hasBgContainerContent,"lg:pt-32":!this.hasBgContainerContent}}get collapsableContentContainerClasses(){return{"lg:block":!this.collapseLg,show:this.collapseOpen}}get collapsableContentClasses(){return{"lg:flex":this._children?.["pp-fieldset"],"lg:gap-32":this._children?.["pp-fieldset"],"lg:mt-40":this.collapseLg}}get radioMobile(){return this.headlineContainerRadioMobile?l`
2                <div class="mt-32 lg:hidden">
3                    ${this.headlineContainerRadioMobile}
4                </div>`:s}get collapseContainer(){return this.collapsableContent||this.headlineContainerRadioMobile?l`
5                <div class="${n(this.collapseContainerClasses)} mt-24 lg:mt-40 ">
6                    <div class="w-full text-center ${n(this.collapseButtonContainerClasses)}">
7                        <button class="typ-menu text-static-1 bg-right flex items-center mx-auto" type="button" data-bs-toggle="collapse" data-bs-target="#search-accordeon" aria-controls="search-accordeon" aria-expanded="false">
8                            <span>${this.showFilters?this.labelShowFilters:this.labelHideFilters}</span>
9                            <div class="${n(this.iconClasses)} ml-8 fill-current transform md:transform-gpu transition-all delay-0 duration-200 ease-in ">
10                                <pp-icon name="chevron-up"></pp-icon>
11                            </div>
12                        </button>
13                    </div>
14                    <div class="collapse ${n(this.collapsableContentContainerClasses)}" id="search-accordeon">
15                        <div class="row">
16                            <div class="col-12">
17                                <div class="mb-24 lg:mb-40 xl:mb-0 pt-32 lg:pt-0 ${n(this.collapsableContentClasses)}">
18                                    ${this.collapsableContent}
19                                    ${this.radioMobile}
20                                </div>
21                            </div>
22                        </div>
23                        ${this.headlineContainerFacet}
24                        ${this.resetButton}
25                    </div>
26                </div>`:this.headlineContainerFacet}get headlineContainerFacet(){return this._children?.["pp-headline-container-facet"]?l`
27            <div class="${n(this.facetContainerClasses)}">
28                <div class="row">
29                    <div class="col-12 mt-40 mb-24">
30                        <div class="border-b-1 border-static-11 border-solid pb-24" role="status">
31                            ${this._children?.["pp-headline-container-facet"]}
32                        </div>
33                    </div>
34                </div>
35                <div class="row">
36                    <div class="col-12 flex justify-center">
37                        ${this._children?.["pp-button"]}
38                    </div>
39                </div>
40            </div>`:s}get searchResultsText(){return this.headlineSearchResults||this.headlineContainerRadio?l`
41                <div class="container">
42                    <div class="row">
43                        <div class="md:col-10 col-12 mx-auto mb-40 flex lg:flex-row flex-col ${n(this.alignmentAndSpacingClasses)} gap-y-24">
44                            <div class="hidden lg:block order-2 min-w-[240px]">
45                                ${this.headlineContainerRadio}
46                            </div>
47                            <div class="typ-menu text-static-16 order-1">
48                                ${this.headlineSearchResults}
49                            </div>
50                        </div>
51                    </div>
52                </div>`:s}get headline(){return this._children?.["pp-headline"]?l`
53                <div class="text-center mb-24">
54                    <div class="text-static-1 rounded-br-12 bg-no-repeat no-underline bg-100100 bg-clip-content bg-clip-border bg-gradient-underline typ-heading-2 underline-effect-general underline-effect-general--static">
55                        ${this._children?.["pp-headline"]}
56                    </div>
57                </div>
58            `:this._children?.["pp-headline-sr-only"]?l`<div class="sr-only">${this._children?.["pp-headline-sr-only"]}</div>`:s}get marginClasses(){return{"mb-40":!this.noMargin}}get fieldset(){const e=this._children?.["pp-fieldset"];return e?l`
59                <div class="mt-40">
60                    ${e}
61                </div>`:s}get resetButton(){const e=this._children?.["pp-button-reset"];return e?l`
62                <div class="flex justify-center">
63                    ${e}
64                </div>`:s}get searchHighlights(){const e=this._children?.["pp-search-highlight"];if(!e)return s;const t=e.length>=2?l`
65                <ul class="row justify-center">
66                    ${e.map(e=>l`
67                        <li class="col-10 lg:col-5 first:mb-16 first:lg:mb-0">
68                            ${e}
69                        </li>
70                    `)}
71                </ul>
72            `:l`
73                <div class="row justify-center">
74                    <div class="col-10">
75                        ${e}
76                    </div>
77                </div>
78            `;return l`
79            <div class="container">
80                ${t}
81            </div>
82        `}get bgContainerContent(){return this.hasBgContainerContent?l`
83            <div class="py-24 lg:py-32 bg-module-bg-1 ${n(this.marginClasses)}">
84                ${this.headline}
85                ${this._children?.["pp-form"]}
86                ${this._children?.["pp-search"]}
87                ${this.fieldset}
88                ${this.collapseContainer}
89            </div>`:s}render(){return l`
90            ${this.bgContainerContent}
91            ${this.searchHighlights}
92            ${this.searchResultsText}
93        `}}customElements.define("pp-search-container",a);export{a as default};