import { html, nothing } from "lit";
import { when } from "lit/directives/when.js";
import { renderButton } from "../button.js";
const renderRefineModalFiltersSection = ({ props })=>(children)=>html`
      <div part="filter-section" class="mt-8 mb-3 flex w-full justify-between">
        <h2
          part="section-title section-filters-title"
          class="truncate text-2xl font-bold"
        >
          ${props.i18n.t('filters')}
        </h2>
        ${children}
      </div>
      ${when(props.withFacets, ()=>html`<slot name="facets"></slot>`)}
      ${when(props.withAutomaticFacets, ()=>html`<slot name="automatic-facets"></slot>`)}
    `;
const renderRefineModalFiltersClearButton = ({ props })=>html`${renderButton({
        props: {
            onClick: props.onClick,
            style: 'text-primary',
            text: props.i18n.t('clear'),
            class: 'px-2 py-1',
            part: 'filter-clear-all'
        }
    })(nothing)}`;
export { renderRefineModalFiltersClearButton, renderRefineModalFiltersSection };
