@salla.sa/twilight-components 2.13.45 → 2.13.47

package/dist/components/salla-breadcrumb.js

@@ -11,14 +11,23 @@ const SallaBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class SallaBreadcrumb
     super();
     this.__registerHost();
     var _a, _b;
-    this.items = undefined;
     this.breadcrumbs = undefined;
     // Initialize slot HTML or use default if not provided
-    this.itemSlot = ((_a = this.host.querySelector('[slot="item"]')) === null || _a === void 0 ? void 0 : _a.outerHTML) || '<li class="s-breadcrumb-item"><a href={url}>{title}</a></li>';
+    this.itemSlot = ((_a = this.host.querySelector('[slot="item"]')) === null || _a === void 0 ? void 0 : _a.outerHTML) || `<li class="s-breadcrumb-item"><a href={url}>{title}</a></li>`;
     this.iconSlot = (_b = this.host.querySelector('[slot="icon"]')) === null || _b === void 0 ? void 0 : _b.outerHTML;
   }
   componentWillLoad() {
     return (new Promise(resolve => salla.onReady(() => salla.lang.onLoaded(resolve))))
+      .then(() => {
+      if (salla.url.is_page('index')) {
+        throw new Error('salla-breadcrumb:: breadcrumb not supported on home page');
+      }
+    })
+      .then(() => {
+      if (!salla.config.get('theme.settings.is_breadcrumbs_enabled', true)) {
+        throw new Error('salla-breadcrumb:: merchant disabled the feature');
+      }
+    })
       .then(() => {
       const page = salla.config.get("page");
       if (!page || !page.slug) {
@@ -44,6 +53,10 @@ const SallaBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class SallaBreadcrumb
       if (page.slug == 'brands.single') {
         this.breadcrumbs.push({ title: salla.lang.get('common.titles.brands'), url: salla.url.get('brands') });
       }
+      //inject loyalty on the breadcrumb, for some reason salla.config.get('page.title') not passed!!
+      if (!page.title && page.slug == "loyalty") {
+        this.breadcrumbs.push({ title: salla.lang.get('common.titles.loyalty_program'), url: salla.url.get('loyalty') });
+      }
       //add the current page title as the last breadcrumb item, only if it's not set before
       if (page.title && !['customer.profile', 'brands.index', 'blog.index'].includes(page.slug)) {
         this.breadcrumbs.push({ title: page.title });
@@ -62,10 +75,14 @@ const SallaBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class SallaBreadcrumb
    */
   render() {
     if (this.breadcrumbs.length <= 1) {
-      salla.log('salla-breadcrumb:: There is no breadcrumbs!', this.breadcrumbs);
+      salla.log('salla-breadcrumb:: There is no breadcrumbs!');
       return;
     }
-    return (h("ol", { class: "s-breadcrumb-wrapper" }, this.breadcrumbs.map(item => [
+    return (h("ol", { class: {
+        "s-breadcrumb-wrapper": true,
+        "s-breadcrumb-dark": salla.url.is_page('loyalty'),
+        "s-breadcrumb-primary-reverse": salla.config.get('page.slug').includes('customer')
+      } }, this.breadcrumbs.map(item => [
       h("div", { class: "s-breadcrumb-slot", innerHTML: this.itemSlot.replace(/\{url\}/g, item.url).replace(/\{title\}/g, item.title) }),
       this.getArrowDomForItem(item),
     ])));
@@ -98,7 +115,6 @@ const SallaBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class SallaBreadcrumb
   get host() { return this; }
   static get style() { return sallaBreadcrumbCss; }
 }, [0, "salla-breadcrumb", {
-    "items": [1],
     "breadcrumbs": [32]
   }]);
 function defineCustomElement$1() {

package/dist/components/salla-breadcrumb.js.map

@@ -1 +1 @@
-{"file":"salla-breadcrumb.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,sBAAsB;;MCiBpCA,iBAAe;EAC1B;;;;;;;IAGE,IAAI,CAAC,QAAQ,GAAG,CAAA,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,SAAS,KAAI,8DAA8D,CAAC;IACtI,IAAI,CAAC,QAAQ,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,SAAS,CAAA;GACpE;EAaD,iBAAiB;IACf,OAAO,CAAC,IAAI,OAAO,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;OAC9E,IAAI,CAAC;MACJ,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;MACtC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;QACvB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,0EAA0E,CAAC,CAAC;QAC/F,OAAO,EAAE,CAAC;OACX;;MAGD,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;QAC3D,OAAO,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,QAAQ,EAAE,QAAQ,CAAC,QAAQ,EAAE,CAAC;WAC1G,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC;OAC7C;;MAID,IAAI,CAAC,WAAW,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;;MAG7F,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;QAClC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,uBAAuB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;OAC1G;;MAGD,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;OACpG;;MAGD,IAAI,IAAI,CAAC,IAAI,IAAI,eAAe,EAAE;QAChC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,sBAAsB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;OACxG;;MAGD,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,kBAAkB,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;QACzF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;OAC9C;MAED,OAAO,IAAI,CAAC,WAAW,CAAC;KACzB,CAAC;OACD,IAAI,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,KAAK,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;OACrG,KAAK,CAAC,CAAC,KAAK;MACX,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,sCAAsC,EAAE,KAAK,CAAC,CAAC;MAClE,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;KACvB,CAAC,CAAC;GACN;;;;;EAMD,MAAM;IACJ,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,IAAI,CAAC,EAAE;MAChC,KAAK,CAAC,GAAG,CAAC,6CAA6C,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;MAC3E,OAAO;KACR;IACD,QACE,UAAI,KAAK,EAAC,sBAAsB,IAC7B,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,IAAI;MAC5B,WAAK,KAAK,EAAC,mBAAmB,EAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,UAAU,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,GAAQ;MAC/H,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC;KAC9B,CACA,CACE,EACL;GACH;EAEO,kBAAkB,CAAC,IAAoB;IAC7C,IAAI,IAAI,CAAC,OAAO,EAAE;MAChB,OAAO,EAAE,CAAC;KACX;IACD,IAAI,OAAO,GAAG,IAAI,CAAC,QAAQ,KAAK,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,GAAG,qBAAqB,GAAG,sBAAsB,CAAC,CAAC;IAEzH,OAAO,UAAI,KAAK,EAAC,oBAAoB,IACnC,WAAK,KAAK,EAAE,EAAE,wBAAwB,EAAE,IAAI,EAAE,2BAA2B,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,OAAO,GAAQ,CACpH,CAAC;GACP;;;;;;;EAQD,kBAAkB;;;IAEhB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAC9F,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,mDAAmD,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;;IAGvI,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,MAAM,EAAE,CAAC;IACnD,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,MAAM,EAAE,CAAC;;IAGnD,IAAI,MAAM,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,0CAAE,aAAa,CAAC,GAAG,CAAC,CAAC;IAC/G,MAAM,IAAI,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;GACjD;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["SallaBreadcrumb"],"sources":["src/components/salla-breadcrumb/salla-breadcrumb.scss?tag=salla-breadcrumb","src/components/salla-breadcrumb/salla-breadcrumb.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, Prop, State, h, Element } from '@stencil/core';\nimport { BreadcrumbItem } from './interfaces';\nimport KeyBoardArrowLeftIcon from \"../../assets/svg/keyboard_arrow_left.svg\"\nimport KeyBoardArrowRightIcon from \"../../assets/svg/keyboard_arrow_right.svg\"\n\n/**\n * @name SallaBreadcrumb\n * @description A StencilJS component for rendering breadcrumb navigation.\n * @tag salla-breadcrumb\n *\n * @slot item - Replaces breadcrumb item, has replaceable props `{url}`, `{title}`.\n * @slot icon - Replaces breadcrumb arrow icon.\n */\n@Component({\n  tag: 'salla-breadcrumb',\n  styleUrl: 'salla-breadcrumb.scss',\n})\nexport class SallaBreadcrumb {\n  constructor() {\n\n    // Initialize slot HTML or use default if not provided\n    this.itemSlot = this.host.querySelector('[slot=\"item\"]')?.outerHTML || '<li class=\"s-breadcrumb-item\"><a href={url}>{title}</a></li>';\n    this.iconSlot = this.host.querySelector('[slot=\"icon\"]')?.outerHTML\n  }\n\n  @Element() host: HTMLElement;\n\n  /**\n   * Breadcrumb items in array\n   */\n  @Prop() items: string;\n\n  private readonly itemSlot: string;\n  private readonly iconSlot: string;\n\n  @State() breadcrumbs: BreadcrumbItem[];\n  componentWillLoad() {\n    return (new Promise(resolve => salla.onReady(() => salla.lang.onLoaded(resolve))))\n      .then(() => {\n        const page = salla.config.get(\"page\");\n        if (!page || !page.slug) {\n          salla.logger.error('salla-breadcrumbs:: page object not existed on salla.config.get(\"page\")!');\n          return [];\n        }\n\n        //get from api on these pages\n        if (['product.single', 'product.index'].includes(page.slug)) {\n          return salla.api.navigation.fetchBreadcrumbs({ page: page.slug, id: page.id, referrer: document.referrer })\n          .then(resp => this.breadcrumbs = resp.data);\n        }\n\n        //otherwise generate the breadcrumb\n\n        this.breadcrumbs = [{ title: salla.lang.get('common.titles.home'), url: salla.url.get('') }];\n\n        //inject my_account on the breadcrumb\n        if (page.slug.includes(\"customer\")) {\n          this.breadcrumbs.push({ title: salla.lang.get('common.titles.profile'), url: salla.url.get('profile') });\n        }\n\n        //inject blog on the breadcrumb\n        if (page.slug.includes(\"blog\")) {\n          this.breadcrumbs.push({ title: salla.lang.get('blocks.footer.blog'), url: salla.url.get('blog') });\n        }\n\n        //inject brands on the breadcrumb\n        if (page.slug == 'brands.single') {\n          this.breadcrumbs.push({ title: salla.lang.get('common.titles.brands'), url: salla.url.get('brands') });\n        }\n\n        //add the current page title as the last breadcrumb item, only if it's not set before\n        if (page.title && !['customer.profile', 'brands.index', 'blog.index'].includes(page.slug)) {\n          this.breadcrumbs.push({ title: page.title });\n        }\n\n        return this.breadcrumbs;\n      })\n      .then(() => this.breadcrumbs.length && (this.breadcrumbs[this.breadcrumbs.length - 1].is_last = true))\n      .catch((error) => {\n        salla.logger.error('salla-breadcrumb:: unexpected error!', error);\n        this.breadcrumbs = [];\n      });\n  }\n\n  /**\n   * Renders the breadcrumb component.\n   * @returns JSX for rendering breadcrumbs.\n   */\n  render() {\n    if (this.breadcrumbs.length <= 1) {\n      salla.log('salla-breadcrumb:: There is no breadcrumbs!', this.breadcrumbs);\n      return;\n    }\n    return (\n      <ol class=\"s-breadcrumb-wrapper\">\n        {this.breadcrumbs.map(item => [\n          <div class=\"s-breadcrumb-slot\" innerHTML={this.itemSlot.replace(/\\{url\\}/g, item.url).replace(/\\{title\\}/g, item.title)}></div>,\n          this.getArrowDomForItem(item),\n        ]\n        )}\n      </ol>\n    );\n  }\n\n  private getArrowDomForItem(item: BreadcrumbItem) {\n    if (item.is_last) {\n      return '';\n    }\n    let iconDom = this.iconSlot || (salla.config.get('theme.is_rtl', true) ? KeyBoardArrowLeftIcon : KeyBoardArrowRightIcon);\n\n    return <li class=\"s-breadcrumb-arrow\">\n      <div class={{ \"s-breadcrumb-icon-slot\": true, \"s-breadcrumb-default-icon\": !this.iconSlot }} innerHTML={iconDom}></div>\n    </li>;\n  }\n\n  /**\n   * Lifecycle method called after the component is rendered.\n   * - Reduces the number of elements in the DOM.\n   * - Removes unnecessary slots parent elements.\n   * - Replaces the last anchor tag in the breadcrumb with its content.\n   */\n  componentDidRender() {\n    // Reduces the number of elements in the DOM\n    this.host.querySelectorAll('.s-breadcrumb-slot').forEach(el => el.replaceWith(el.firstChild));\n    this.host.querySelectorAll('.s-breadcrumb-icon-slot.s-breadcrumb-default-icon').forEach(el => el.replaceWith(el.querySelector('svg')));\n\n    // Removes the slots parent elements if exists\n    this.host.querySelector('[slot=\"item\"]')?.remove();\n    this.host.querySelector('[slot=\"icon\"]')?.remove();\n\n    // Removes the last anchor tag in the breadcrumb\n    let lastEl = this.host.querySelectorAll('.s-breadcrumb-item')[this.breadcrumbs.length - 1]?.querySelector('a');\n    lastEl && lastEl.replaceWith(lastEl.firstChild);\n  }\n}\n"],"version":3}
+{"file":"salla-breadcrumb.js","mappings":";;;;;;AAAA,MAAM,kBAAkB,GAAG,sBAAsB;;MCiBpCA,iBAAe;EAC1B;;;;;;IAGE,IAAI,CAAC,QAAQ,GAAG,CAAA,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,SAAS,KAAI,8DAA8D,CAAC;IACtI,IAAI,CAAC,QAAQ,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,SAAS,CAAA;GACpE;EAaD,iBAAiB;IACf,OAAO,CAAC,IAAI,OAAO,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;OAC9E,IAAI,CAAC;MACJ,IAAI,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;QAC9B,MAAM,IAAI,KAAK,CAAC,0DAA0D,CAAC,CAAC;OAC7E;KACF,CAAC;OACD,IAAI,CAAC;MACJ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,uCAAuC,EAAE,IAAI,CAAC,EAAE;QACpE,MAAM,IAAI,KAAK,CAAC,kDAAkD,CAAC,CAAC;OACrE;KACF,CAAC;OACD,IAAI,CAAC;MACJ,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;MACtC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;QACvB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,0EAA0E,CAAC,CAAC;QAC/F,OAAO,EAAE,CAAC;OACX;;MAGD,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;QAC3D,OAAO,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,QAAQ,EAAE,QAAQ,CAAC,QAAQ,EAAE,CAAC;WACxG,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC;OAC/C;;MAID,IAAI,CAAC,WAAW,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;;MAG7F,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;QAClC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,uBAAuB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;OAC1G;;MAGD,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,oBAAoB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;OACpG;;MAGD,IAAI,IAAI,CAAC,IAAI,IAAI,eAAe,EAAE;QAChC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,sBAAsB,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;OACxG;;MAGD,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,IAAI,SAAS,EAAE;QACzC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,+BAA+B,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;OAClH;;MAGD,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,kBAAkB,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;QACzF,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;OAC9C;MAED,OAAO,IAAI,CAAC,WAAW,CAAC;KACzB,CAAC;OACD,IAAI,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,MAAM,KAAK,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;OACrG,KAAK,CAAC,CAAC,KAAK;MACX,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,sCAAsC,EAAE,KAAK,CAAC,CAAC;MAClE,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;KACvB,CAAC,CAAC;GACN;;;;;EAMD,MAAM;IACJ,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,IAAI,CAAC,EAAE;MAChC,KAAK,CAAC,GAAG,CAAC,6CAA6C,CAAC,CAAC;MACzD,OAAO;KACR;IACD,QACE,UAAI,KAAK,EAAE;QACT,sBAAsB,EAAE,IAAI;QAC5B,mBAAmB,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC;QACjD,8BAA8B,EAAE,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC;OACnF,IACE,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,IAAI;MAC5B,WAAK,KAAK,EAAC,mBAAmB,EAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,UAAU,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,GAAQ;MAC/H,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC;KAC9B,CACA,CACE,EACL;GACH;EAEO,kBAAkB,CAAC,IAAoB;IAC7C,IAAI,IAAI,CAAC,OAAO,EAAE;MAChB,OAAO,EAAE,CAAC;KACX;IACD,IAAI,OAAO,GAAG,IAAI,CAAC,QAAQ,KAAK,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,GAAG,qBAAqB,GAAG,sBAAsB,CAAC,CAAC;IAEzH,OAAO,UAAI,KAAK,EAAC,oBAAoB,IACnC,WAAK,KAAK,EAAE,EAAE,wBAAwB,EAAE,IAAI,EAAE,2BAA2B,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,OAAO,GAAQ,CACpH,CAAC;GACP;;;;;;;EAQD,kBAAkB;;;IAEhB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAC9F,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,mDAAmD,CAAC,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;;IAGvI,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,MAAM,EAAE,CAAC;IACnD,MAAA,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,0CAAE,MAAM,EAAE,CAAC;;IAGnD,IAAI,MAAM,GAAG,MAAA,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,0CAAE,aAAa,CAAC,GAAG,CAAC,CAAC;IAC/G,MAAM,IAAI,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;GACjD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["SallaBreadcrumb"],"sources":["src/components/salla-breadcrumb/salla-breadcrumb.scss?tag=salla-breadcrumb","src/components/salla-breadcrumb/salla-breadcrumb.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, State, h, Element } from '@stencil/core';\nimport { BreadcrumbItem } from './interfaces';\nimport KeyBoardArrowLeftIcon from \"../../assets/svg/keyboard_arrow_left.svg\"\nimport KeyBoardArrowRightIcon from \"../../assets/svg/keyboard_arrow_right.svg\"\n\n/**\n * @name SallaBreadcrumb\n * @description A StencilJS component for rendering breadcrumb navigation.\n * @tag salla-breadcrumb\n *\n * @slot item - Replaces breadcrumb item, has replaceable props `{url}`, `{title}`.\n * @slot icon - Replaces breadcrumb arrow icon.\n */\n@Component({\n  tag: 'salla-breadcrumb',\n  styleUrl: 'salla-breadcrumb.scss',\n})\nexport class SallaBreadcrumb {\n  constructor() {\n\n    // Initialize slot HTML or use default if not provided\n    this.itemSlot = this.host.querySelector('[slot=\"item\"]')?.outerHTML || `<li class=\"s-breadcrumb-item\"><a href={url}>{title}</a></li>`;\n    this.iconSlot = this.host.querySelector('[slot=\"icon\"]')?.outerHTML\n  }\n\n  @Element() host: HTMLElement;\n\n  // /**\n  //  * Breadcrumb items in array\n  //  */\n  // @Prop() items: string;\n\n  private readonly itemSlot: string;\n  private readonly iconSlot: string;\n\n  @State() breadcrumbs: BreadcrumbItem[];\n  componentWillLoad() {\n    return (new Promise(resolve => salla.onReady(() => salla.lang.onLoaded(resolve))))\n      .then(() => {\n        if (salla.url.is_page('index')) {\n          throw new Error('salla-breadcrumb:: breadcrumb not supported on home page');\n        }\n      })\n      .then(() => {\n        if (!salla.config.get('theme.settings.is_breadcrumbs_enabled', true)) {\n          throw new Error('salla-breadcrumb:: merchant disabled the feature');\n        }\n      })\n      .then(() => {\n        const page = salla.config.get(\"page\");\n        if (!page || !page.slug) {\n          salla.logger.error('salla-breadcrumbs:: page object not existed on salla.config.get(\"page\")!');\n          return [];\n        }\n\n        //get from api on these pages\n        if (['product.single', 'product.index'].includes(page.slug)) {\n          return salla.api.navigation.fetchBreadcrumbs({ page: page.slug, id: page.id, referrer: document.referrer })\n            .then(resp => this.breadcrumbs = resp.data);\n        }\n\n        //otherwise generate the breadcrumb\n\n        this.breadcrumbs = [{ title: salla.lang.get('common.titles.home'), url: salla.url.get('') }];\n\n        //inject my_account on the breadcrumb\n        if (page.slug.includes(\"customer\")) {\n          this.breadcrumbs.push({ title: salla.lang.get('common.titles.profile'), url: salla.url.get('profile') });\n        }\n\n        //inject blog on the breadcrumb\n        if (page.slug.includes(\"blog\")) {\n          this.breadcrumbs.push({ title: salla.lang.get('blocks.footer.blog'), url: salla.url.get('blog') });\n        }\n\n        //inject brands on the breadcrumb\n        if (page.slug == 'brands.single') {\n          this.breadcrumbs.push({ title: salla.lang.get('common.titles.brands'), url: salla.url.get('brands') });\n        }\n\n        //inject loyalty on the breadcrumb, for some reason salla.config.get('page.title') not passed!!\n        if (!page.title && page.slug == \"loyalty\") {\n          this.breadcrumbs.push({ title: salla.lang.get('common.titles.loyalty_program'), url: salla.url.get('loyalty') });\n        }\n\n        //add the current page title as the last breadcrumb item, only if it's not set before\n        if (page.title && !['customer.profile', 'brands.index', 'blog.index'].includes(page.slug)) {\n          this.breadcrumbs.push({ title: page.title });\n        }\n\n        return this.breadcrumbs;\n      })\n      .then(() => this.breadcrumbs.length && (this.breadcrumbs[this.breadcrumbs.length - 1].is_last = true))\n      .catch((error) => {\n        salla.logger.error('salla-breadcrumb:: unexpected error!', error);\n        this.breadcrumbs = [];\n      });\n  }\n\n  /**\n   * Renders the breadcrumb component.\n   * @returns JSX for rendering breadcrumbs.\n   */\n  render() {\n    if (this.breadcrumbs.length <= 1) {\n      salla.log('salla-breadcrumb:: There is no breadcrumbs!');\n      return;\n    }\n    return (\n      <ol class={{\n        \"s-breadcrumb-wrapper\": true,\n        \"s-breadcrumb-dark\": salla.url.is_page('loyalty'),\n        \"s-breadcrumb-primary-reverse\": salla.config.get('page.slug').includes('customer')\n      }}>\n        {this.breadcrumbs.map(item => [\n          <div class=\"s-breadcrumb-slot\" innerHTML={this.itemSlot.replace(/\\{url\\}/g, item.url).replace(/\\{title\\}/g, item.title)}></div>,\n          this.getArrowDomForItem(item),\n        ]\n        )}\n      </ol>\n    );\n  }\n\n  private getArrowDomForItem(item: BreadcrumbItem) {\n    if (item.is_last) {\n      return '';\n    }\n    let iconDom = this.iconSlot || (salla.config.get('theme.is_rtl', true) ? KeyBoardArrowLeftIcon : KeyBoardArrowRightIcon);\n\n    return <li class=\"s-breadcrumb-arrow\">\n      <div class={{ \"s-breadcrumb-icon-slot\": true, \"s-breadcrumb-default-icon\": !this.iconSlot }} innerHTML={iconDom}></div>\n    </li>;\n  }\n\n  /**\n   * Lifecycle method called after the component is rendered.\n   * - Reduces the number of elements in the DOM.\n   * - Removes unnecessary slots parent elements.\n   * - Replaces the last anchor tag in the breadcrumb with its content.\n   */\n  componentDidRender() {\n    // Reduces the number of elements in the DOM\n    this.host.querySelectorAll('.s-breadcrumb-slot').forEach(el => el.replaceWith(el.firstChild));\n    this.host.querySelectorAll('.s-breadcrumb-icon-slot.s-breadcrumb-default-icon').forEach(el => el.replaceWith(el.querySelector('svg')));\n\n    // Removes the slots parent elements if exists\n    this.host.querySelector('[slot=\"item\"]')?.remove();\n    this.host.querySelector('[slot=\"icon\"]')?.remove();\n\n    // Removes the last anchor tag in the breadcrumb\n    let lastEl = this.host.querySelectorAll('.s-breadcrumb-item')[this.breadcrumbs.length - 1]?.querySelector('a');\n    lastEl && lastEl.replaceWith(lastEl.firstChild);\n  }\n}\n"],"version":3}