var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
  if (kind === "a" && !f)
    throw new TypeError("Private accessor was defined without a getter");
  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
    throw new TypeError("Cannot read private member from an object whose class did not declare it");
  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var _KlevuFacet_instances, _KlevuFacet_renderSlider, _KlevuFacet_renderOptions;
import { Fragment, h, Host, forceUpdate } from "@stencil/core";
import { getGlobalSettings, globalExportedParts } from "../../utils/utils";
/**
 * Rendering items of single facet with all its options or a slider.
 *
 * Manager property must be set for this component to work.
 *
 * @csspart facet-heading - Heading of the facet
 */
export class KlevuFacet {
  constructor() {
    _KlevuFacet_instances.add(this);
    this.option = undefined;
    this.slider = undefined;
    this.manager = undefined;
    this.mode = "checkbox";
    this.customOrder = undefined;
    this.accordion = undefined;
    this.accordionStartOpen = undefined;
    this.labelOverride = undefined;
    this.showAll = false;
  }
  filterSelectionUpdate(event) {
    forceUpdate(this.el);
  }
  render() {
    return (h(Host, null, this.option ? (h(Fragment, null, this.accordion ? (h("klevu-accordion", { exportparts: globalExportedParts, startOpen: this.accordionStartOpen }, __classPrivateFieldGet(this, _KlevuFacet_instances, "m", _KlevuFacet_renderOptions).call(this))) : (__classPrivateFieldGet(this, _KlevuFacet_instances, "m", _KlevuFacet_renderOptions).call(this)))) : this.slider ? (h(Fragment, null, this.accordion ? (h("klevu-accordion", { exportparts: globalExportedParts, startOpen: this.accordionStartOpen }, __classPrivateFieldGet(this, _KlevuFacet_instances, "m", _KlevuFacet_renderSlider).call(this))) : (__classPrivateFieldGet(this, _KlevuFacet_instances, "m", _KlevuFacet_renderSlider).call(this)))) : null));
  }
  static get is() { return "klevu-facet"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["klevu-facet.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["klevu-facet.css"]
    };
  }
  static get properties() {
    return {
      "option": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "KlevuFilterResultOptions",
          "resolved": "KlevuFilterResult & { type: KlevuFilterType.Options | KlevuFilterType.Rating; options: { name: string; value: string; count: number; selected: boolean; }[]; } | undefined",
          "references": {
            "KlevuFilterResultOptions": {
              "location": "import",
              "path": "@klevu/core"
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "From which options to build facet. Single option value from Klevu SDK FilterManager. Either this or slider must be set."
        }
      },
      "slider": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "KlevuFilterResultSlider",
          "resolved": "KlevuFilterResult & { type: KlevuFilterType.Slider; min: string; max: string; start: string | null; end: string | null; } | undefined",
          "references": {
            "KlevuFilterResultSlider": {
              "location": "import",
              "path": "@klevu/core"
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "From which slider to build facet."
        }
      },
      "manager": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "FilterManager",
          "resolved": "FilterManager",
          "references": {
            "FilterManager": {
              "location": "import",
              "path": "@klevu/core"
            }
          }
        },
        "required": true,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Originating filter manager which to modify. This is the most important property of the component.\nIt will be used to modify the filter state for queries."
        }
      },
      "mode": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "KlevuFacetMode",
          "resolved": "\"checkbox\" | \"radio\"",
          "references": {
            "KlevuFacetMode": {
              "location": "local",
              "path": "/home/runner/work/frontend-sdk/frontend-sdk/packages/klevu-ui/src/components/klevu-facet/klevu-facet.tsx"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Which mode should facets be in"
        },
        "attribute": "mode",
        "reflect": false,
        "defaultValue": "\"checkbox\""
      },
      "customOrder": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[] | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Set predefined order for options. Unfound values are in original order in end"
        }
      },
      "accordion": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Should the facet be in accordion"
        },
        "attribute": "accordion",
        "reflect": false
      },
      "accordionStartOpen": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Start accordion open"
        },
        "attribute": "accordion-start-open",
        "reflect": false
      },
      "labelOverride": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Override label text with custom value"
        },
        "attribute": "label-override",
        "reflect": false
      }
    };
  }
  static get states() {
    return {
      "showAll": {}
    };
  }
  static get elementRef() { return "el"; }
  static get listeners() {
    return [{
        "name": "klevu-filter-selection-updates",
        "method": "filterSelectionUpdate",
        "target": "document",
        "capture": false,
        "passive": false
      }];
  }
}
_KlevuFacet_instances = new WeakSet(), _KlevuFacet_renderSlider = function _KlevuFacet_renderSlider() {
  if (!this.slider) {
    return null;
  }
  return (h(Fragment, null, h("klevu-typography", { part: "facet-heading", class: { accordion: Boolean(this.accordion) }, variant: "body-s-bold", slot: "header" }, this.labelOverride || this.slider.label), h("klevu-slider", { slot: "content", showTooltips: true, min: parseFloat(this.slider.min), max: parseFloat(this.slider.max), start: this.slider.start ? parseFloat(this.slider.start) : undefined, end: this.slider.end ? parseFloat(this.slider.end) : undefined, formatTooltip: (value) => { var _a, _b, _c; return ((_c = (_b = (_a = getGlobalSettings()) === null || _a === void 0 ? void 0 : _a.renderPrice) === null || _b === void 0 ? void 0 : _b.call(_a, value.toFixed(2), "EUR")) !== null && _c !== void 0 ? _c : value.toFixed(2)).toString(); }, onKlevuSliderChange: (event) => {
      this.manager.updateSlide(this.slider.key, event.detail[0], event.detail[1]);
    } })));
}, _KlevuFacet_renderOptions = function _KlevuFacet_renderOptions() {
  if (!this.option) {
    return null;
  }
  let opts = [...this.option.options];
  if (this.customOrder) {
    opts.sort((a, b) => {
      const aio = this.customOrder.indexOf(a.value);
      const bio = this.customOrder.indexOf(b.value);
      if (aio === -1 && bio !== -1) {
        return 1;
      }
      if (aio !== -1 && bio === -1) {
        return -1;
      }
      return aio - bio;
    });
  }
  let showAllButton = false;
  if (!this.showAll && opts.length > 5) {
    opts = opts.slice(0, 5);
    showAllButton = true;
  }
  return (h(Fragment, null, h("klevu-typography", { part: "facet-heading", class: { accordion: Boolean(this.accordion) }, variant: "body-s-bold", slot: "header" }, this.labelOverride || this.option.label), h("div", { class: "options", slot: "content" }, opts.map((o) => (h("div", { class: "option" }, this.mode === "checkbox" ? (h("klevu-checkbox", { exportparts: globalExportedParts, checked: o.selected, name: this.option.key, onKlevuCheckboxChange: (event) => {
      this.manager.toggleOption(this.option.key, o.value);
    } }, h("div", { class: "container" }, h("span", { class: "name" }, h("span", null, o.name)), h("span", { class: "count" }, "(", o.count, ")")))) : (h("div", { class: "container" }, h("input", { type: "radio", id: this.option.key, name: this.option.key, value: o.value, checked: o.selected, onClick: () => {
      this.manager.clearOptionSelections(this.option.key);
      this.manager.toggleOption(this.option.key, o.value);
    } }), h("label", { htmlFor: this.option.key, class: "name" }, h("span", null, o.name)), h("span", { class: "count" }, "(", o.count, ")")))))), showAllButton ? (h("klevu-button", { style: { "--klevu-button-text-align": "left" }, isTertiary: true, fullWidth: true, onClick: () => (this.showAll = true) }, "More")) : null)));
};
//# sourceMappingURL=klevu-facet.js.map
