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 _KlevuRecommendations_instances, _KlevuRecommendations_internalRenderProductSlot, _KlevuRecommendations_productClick;
import { KlevuFetch, kmcRecommendation, sendRecommendationViewEvent } from "@klevu/core";
import { h, Host } from "@stencil/core";
import { globalExportedParts } from "../../utils/utils";
import { KlevuInit } from "../klevu-init/klevu-init";
import { parts } from "../../utils/parts";
/**
 * Full recommendation banner solution
 */
export class KlevuRecommendations {
  constructor() {
    _KlevuRecommendations_instances.add(this);
    this.recommendationTitle = undefined;
    this.recommendationId = undefined;
    this.cartProductIds = undefined;
    this.categoryPath = undefined;
    this.currentProductId = undefined;
    this.itemGroupId = undefined;
    this.products = [undefined, undefined, undefined, undefined, undefined, undefined];
    this.clickEvent = undefined;
    this.renderProductSlot = undefined;
  }
  async connectedCallback() {
    await KlevuInit.ready();
    if (!this.recommendationId) {
      throw new Error("recommendationId is required");
    }
    const res = await KlevuFetch(kmcRecommendation(this.recommendationId, {
      id: "recommendation",
      cartProductIds: this.cartProductIds,
      categoryPath: this.categoryPath,
      currentProductId: this.currentProductId,
      itemGroupId: this.itemGroupId,
    }, sendRecommendationViewEvent(this.recommendationTitle)));
    const resultObject = res.queriesById("recommendation");
    if (resultObject) {
      this.products = resultObject.records;
      if (resultObject.getRecommendationClickSendEvent) {
        this.clickEvent = resultObject.getRecommendationClickSendEvent();
      }
    }
  }
  render() {
    if (this.products.length === 0) {
      return null;
    }
    return (h(Host, null, h("klevu-slides", { exportparts: globalExportedParts, heading: this.recommendationTitle }, this.products.map((product) => (h("klevu-product", { exportparts: parts["klevu-product"], fixedWidth: true, onKlevuProductClick: __classPrivateFieldGet(this, _KlevuRecommendations_instances, "m", _KlevuRecommendations_productClick).bind(this), product: product, style: {
        "--klevu-product-width": "300px",
      } }, __classPrivateFieldGet(this, _KlevuRecommendations_instances, "m", _KlevuRecommendations_internalRenderProductSlot).call(this, product, "top"), __classPrivateFieldGet(this, _KlevuRecommendations_instances, "m", _KlevuRecommendations_internalRenderProductSlot).call(this, product, "image"), __classPrivateFieldGet(this, _KlevuRecommendations_instances, "m", _KlevuRecommendations_internalRenderProductSlot).call(this, product, "info"), __classPrivateFieldGet(this, _KlevuRecommendations_instances, "m", _KlevuRecommendations_internalRenderProductSlot).call(this, product, "bottom")))))));
  }
  static get is() { return "klevu-recommendations"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["klevu-recommendations.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["klevu-recommendations.css"]
    };
  }
  static get properties() {
    return {
      "recommendationTitle": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": true,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Title of the recommendation"
        },
        "attribute": "recommendation-title",
        "reflect": false
      },
      "recommendationId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": true,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "The ID of the recommendation"
        },
        "attribute": "recommendation-id",
        "reflect": false
      },
      "cartProductIds": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "string[]",
          "resolved": "string[] | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "For cart recommendation you need to provide product id's in cart"
        }
      },
      "categoryPath": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "For category product recommendation you need to provide categery path"
        },
        "attribute": "category-path",
        "reflect": false
      },
      "currentProductId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "For similiar products recommendation you need to provide productId and itemGroupId"
        },
        "attribute": "current-product-id",
        "reflect": false
      },
      "itemGroupId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string | undefined",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "For similiar products recommendation you need to provide productId and itemGroupId"
        },
        "attribute": "item-group-id",
        "reflect": false
      },
      "renderProductSlot": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "(product: KlevuRecord, productSlot: KlevuProductSlots) => HTMLElement | string | null",
          "resolved": "((product: KlevuRecord, productSlot: KlevuProductSlots) => string | HTMLElement | null) | undefined",
          "references": {
            "KlevuRecord": {
              "location": "import",
              "path": "@klevu/core"
            },
            "KlevuProductSlots": {
              "location": "import",
              "path": "../klevu-product/klevu-product"
            },
            "HTMLElement": {
              "location": "global"
            }
          }
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Rendering function created to put custom content to klevu-product slots. Provides a product being rendered.\nThis function is called for each slot (top, image, info and bottom) of the component. Second parameter provides\nslot requested. Return null for slots that you do not want to render."
        }
      }
    };
  }
  static get states() {
    return {
      "products": {},
      "clickEvent": {}
    };
  }
}
_KlevuRecommendations_instances = new WeakSet(), _KlevuRecommendations_internalRenderProductSlot = function _KlevuRecommendations_internalRenderProductSlot(product, slot) {
  if (!this.renderProductSlot || !product) {
    return null;
  }
  const content = this.renderProductSlot(product, slot);
  if (content === null) {
    return null;
  }
  if (typeof content === "string") {
    return h("div", { slot: slot, innerHTML: content });
  }
  return (h("div", { slot: slot, ref: (el) => {
      if (!el) {
        return;
      }
      el.innerHTML = "";
      el.appendChild(content);
    } }));
}, _KlevuRecommendations_productClick = function _KlevuRecommendations_productClick(event) {
  if (this.clickEvent && event.detail.product.id) {
    this.clickEvent(event.detail.product.id, event.detail.product.itemGroupId || event.detail.product.id);
  }
};
//# sourceMappingURL=klevu-recommendations.js.map
