"use strict";
var __webpack_require__ = {};
(()=>{
    __webpack_require__.n = (module)=>{
        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
        __webpack_require__.d(getter, {
            a: getter
        });
        return getter;
    };
})();
(()=>{
    __webpack_require__.d = (exports1, definition)=>{
        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
            enumerable: true,
            get: definition[key]
        });
    };
})();
(()=>{
    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
})();
(()=>{
    __webpack_require__.r = (exports1)=>{
        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
            value: 'Module'
        });
        Object.defineProperty(exports1, '__esModule', {
            value: true
        });
    };
})();
var __webpack_exports__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
    renderFacetShowMoreLess: ()=>renderFacetShowMoreLess
});
const external_lit_namespaceObject = require("lit");
const when_js_namespaceObject = require("lit/directives/when.js");
const minus_cjs_namespaceObject = require("../../../../images/minus.cjs");
var minus_cjs_default = /*#__PURE__*/ __webpack_require__.n(minus_cjs_namespaceObject);
const plus_cjs_namespaceObject = require("../../../../images/plus.cjs");
var plus_cjs_default = /*#__PURE__*/ __webpack_require__.n(plus_cjs_namespaceObject);
require("../../atomic-icon/atomic-icon.cjs");
const external_button_cjs_namespaceObject = require("../../button.cjs");
const renderFacetShowMoreLess = ({ props })=>{
    const label = props.i18n.t(props.label);
    const showMore = props.i18n.t('show-more');
    const showMoreFacetValues = props.i18n.t('show-more-facet-values', {
        label
    });
    const showLess = props.i18n.t('show-less');
    const showLessFacetValues = props.i18n.t('show-less-facet-values', {
        label
    });
    const btnClasses = 'flex items-baseline text-left p-2 text-sm max-w-full';
    const iconClasses = 'w-2 h-2 mr-1';
    if (!props.canShowLessValues && !props.canShowMoreValues) return external_lit_namespaceObject.nothing;
    return (0, external_lit_namespaceObject.html)`<div class="mt-2">
    ${(0, when_js_namespaceObject.when)(props.canShowLessValues, ()=>(0, external_button_cjs_namespaceObject.renderButton)({
            props: {
                style: 'text-primary',
                part: 'show-less',
                class: btnClasses,
                ariaLabel: showLessFacetValues,
                onClick: ()=>props.onShowLess(),
                ref: (el)=>props.showLessRef?.(el)
            }
        })((0, external_lit_namespaceObject.html)`<atomic-icon
            part="show-more-less-icon"
            class=${iconClasses}
            icon=${minus_cjs_default()}
          ></atomic-icon>
          <span class="truncate">${showLess}</span>`))}
    ${(0, when_js_namespaceObject.when)(props.canShowMoreValues, ()=>(0, external_button_cjs_namespaceObject.renderButton)({
            props: {
                style: 'text-primary',
                part: 'show-more',
                class: btnClasses,
                ariaLabel: showMoreFacetValues,
                onClick: ()=>props.onShowMore(),
                ref: (el)=>props.showMoreRef?.(el)
            }
        })((0, external_lit_namespaceObject.html)`<atomic-icon
            part="show-more-less-icon"
            class=${iconClasses}
            icon=${plus_cjs_default()}
          ></atomic-icon>
          <span class="truncate">${showMore}</span>`))}
  </div>`;
};
exports.renderFacetShowMoreLess = __webpack_exports__.renderFacetShowMoreLess;
for(var __rspack_i in __webpack_exports__)if (-1 === [
    "renderFacetShowMoreLess"
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
Object.defineProperty(exports, '__esModule', {
    value: true
});
