@everymatrix/blog-articles-grid 1.98.30 → 1.99.0

package/dist/blog-articles-grid/blog-articles-grid.esm.js

@@ -1 +1 @@
-import{p as e,b as t}from"./index-4af8e775.js";export{s as setNonce}from"./index-4af8e775.js";import{g as n}from"./app-globals-0f993ce5.js";(()=>{const t=import.meta.url,n={};return""!==t&&(n.resourcesUrl=new URL(".",t).href),e(n)})().then((async e=>(await n(),t([["blog-articles-grid_2",[[1,"blog-articles-grid",{cmsEndpoint:[513,"cms-endpoint"],language:[513],translationUrl:[513,"translation-url"],userRoles:[513,"user-roles"],cmsEnv:[513,"cms-env"],mbSource:[1,"mb-source"],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],showPublishingDate:[516,"show-publishing-date"],showImage:[516,"show-image"],showTitle:[516,"show-title"],showPageTitle:[516,"show-page-title"],showBreadcrumb:[516,"show-breadcrumb"],showContent:[516,"show-content"],showButton:[516,"show-button"],hideError:[516,"hide-error"],usePostmessage:[516,"use-postmessage"],postMessageEvent:[513,"post-message-event"],blogsLimit:[513,"blogs-limit"],paginationActive:[516,"pagination-active"],arrowsActive:[516,"arrows-active"],secondaryArrowsActive:[516,"secondary-arrows-active"],numberedNavActive:[516,"numbered-nav-active"],intlDateTimeFormat:[513,"intl-date-time-format"],page:[513],pageQueryParam:[1,"page-query-param"],eventId:[513,"event-id"],paginationBlogList:[32],currentPage:[32],hasErrors:[32],isLoading:[32],bannerMatrixReady:[32],nextPage:[32],previousPage:[32],device:[32],displayedBlogResponse:[32],paginationBlogResponse:[32],allBlogResponse:[32],totalBlogs:[32],customTranslations:[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{page:["watchEndpoint"],hasErrors:["watchEndpoint"],cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"],cmsEnv:["watchEndpoint"],userRoles:["watchEndpoint"],blogsLimit:["watchEndpoint"],eventId:["watchEndpoint"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["loadTranslations"]}],[1,"helper-pagination",{nextPage:[1537,"next-page"],prevPage:[1537,"prev-page"],offset:[1538],limit:[1538],total:[1538],language:[1537],mbSource:[1,"mb-source"],clientStyling:[1537,"client-styling"],clientStylingUrl:[1537,"client-styling-url"],arrowsActive:[1540,"arrows-active"],secondaryArrowsActive:[1540,"secondary-arrows-active"],numberedNavActive:[1540,"numbered-nav-active"],pageQueryParam:[1,"page-query-param"],page:[2],offsetInt:[32],lastPage:[32],previousPage:[32],limitInt:[32],totalInt:[32],pagesArray:[32],endInt:[32]},null,{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}]]]],e))));
+import{p as e,b as t}from"./index-4af8e775.js";export{s as setNonce}from"./index-4af8e775.js";import{g as a}from"./app-globals-0f993ce5.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((async e=>(await a(),t([["blog-articles-grid_2",[[1,"blog-articles-grid",{cmsEndpoint:[513,"cms-endpoint"],language:[513],translationUrl:[513,"translation-url"],userRoles:[513,"user-roles"],cmsEnv:[513,"cms-env"],mbSource:[1,"mb-source"],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],showPublishingDate:[516,"show-publishing-date"],showBlogSubcategories:[516,"show-blog-subcategories"],showImage:[516,"show-image"],showTitle:[516,"show-title"],showPageTitle:[516,"show-page-title"],showBreadcrumb:[516,"show-breadcrumb"],showContent:[516,"show-content"],showButton:[516,"show-button"],hideError:[516,"hide-error"],usePostmessage:[516,"use-postmessage"],postMessageEvent:[513,"post-message-event"],blogsLimit:[513,"blogs-limit"],paginationActive:[516,"pagination-active"],arrowsActive:[516,"arrows-active"],secondaryArrowsActive:[516,"secondary-arrows-active"],numberedNavActive:[516,"numbered-nav-active"],intlDateTimeFormat:[513,"intl-date-time-format"],page:[513],pageQueryParam:[1,"page-query-param"],eventId:[513,"event-id"],paginationBlogList:[32],currentPage:[32],hasErrors:[32],isLoading:[32],bannerMatrixReady:[32],nextPage:[32],previousPage:[32],device:[32],displayedBlogResponse:[32],paginationBlogResponse:[32],allBlogResponse:[32],totalBlogs:[32],customTranslations:[32],selectedCategory:[32],categories:[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{page:["watchEndpoint"],hasErrors:["watchEndpoint"],cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"],cmsEnv:["watchEndpoint"],userRoles:["watchEndpoint"],blogsLimit:["watchEndpoint"],eventId:["watchEndpoint"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["loadTranslations"]}],[1,"helper-pagination",{nextPage:[1537,"next-page"],prevPage:[1537,"prev-page"],offset:[1538],limit:[1538],total:[1538],language:[1537],mbSource:[1,"mb-source"],clientStyling:[1537,"client-styling"],clientStylingUrl:[1537,"client-styling-url"],arrowsActive:[1540,"arrows-active"],secondaryArrowsActive:[1540,"secondary-arrows-active"],numberedNavActive:[1540,"numbered-nav-active"],pageQueryParam:[1,"page-query-param"],page:[2],offsetInt:[32],lastPage:[32],previousPage:[32],limitInt:[32],totalInt:[32],pagesArray:[32],endInt:[32]},null,{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}]]]],e))));

package/dist/blog-articles-grid/blog-articles-grid_2.entry.js

@@ -1 +1 @@
-import{r as i,c as t,h as n}from"./index-4af8e775.js";const e={en:{error:"Error",readmore:"Read more",home:"Home",blog:"Blog",blogPageTitle:"Blog"},ro:{error:"Eroare",readmore:"Read more",home:"Acasă",blog:"Blog",blogPageTitle:"Blog"},fr:{error:"Error",readmore:"Read more",home:"Accueil",blog:"Blog",blogPageTitle:"Blog"},ar:{error:"خطأ",readmore:"Read more",home:"الرئيسية",blog:"المدونة",blogPageTitle:"المدونة"},hu:{error:"خطأ",readmore:"Tovább olvasom",home:"Kezdőlap",blog:"Blog",blogPageTitle:"Blog"},hr:{error:"Greška",readmore:"Pročitaj više",home:"Početna",blog:"Blog",blogPageTitle:"Blog"},"pt-br":{error:"Erro",readmore:"Ler mais",home:"Início",blog:"Blog",blogPageTitle:"Blog"},"es-mx":{error:"Error",readmore:"Leer más",home:"Inicio",blog:"Blog",blogPageTitle:"Blog"}},s=(i,t,n)=>{var s;const o=null!=t?t:"en",a=null===(s=null==n?void 0:n[o])||void 0===s?void 0:s[i];return"string"==typeof a?a:e[o in e?o:"en"][i]},o="__WIDGET_GLOBAL_STYLE_CACHE__";function a(i,t){if(i){const n=document.createElement("style");n.innerHTML=t,i.appendChild(n)}}function r(i,t){if(!i||!t)return;const n=new URL(t);fetch(n.href).then((i=>i.text())).then((t=>{const n=document.createElement("style");n.innerHTML=t,i&&i.appendChild(n)})).catch((i=>{console.error("There was an error while trying to load client styling from URL",i)}))}function h(i,t,n,e=!1){if(!window.emMessageBus)return;if(!("adoptedStyleSheets"in Document.prototype)||!e)return n=function(i,t){const n=document.createElement("style");return window.emMessageBus.subscribe(t,(t=>{i&&(n.innerHTML=t,i.appendChild(n))}))}(i,t),n;window[o]||(window[o]={}),n=function(i,t){return window.emMessageBus.subscribe(t,(n=>{if(!i)return;const e=i.getRootNode(),s=window[o];let a=s[t]&&s[t].sheet;a?s[t].refCount=s[t].refCount+1:(a=new CSSStyleSheet,a.replaceSync(n),s[t]={sheet:a,refCount:1});const r=e.adoptedStyleSheets||[];r.includes(a)||(e.adoptedStyleSheets=[...r,a])}))}(i,t);const s=n.unsubscribe.bind(n);return n.unsubscribe=()=>{if(window[o][t]){const i=window[o][t];i.refCount>1?i.refCount=i.refCount-1:delete window[o][t]}s()},n}function l(i){return i.includes("android")}const d=class{constructor(e){i(this,e),this.articleActionButton=t(this,"articleActionButton",7),this.lastPage=1,this.isInitialized=!1,this.paginationDefaultStyling="\n  nav#PaginationContainer {\n    justify-content: right;\n  }\n  .LeftItems a .NavigationButton {\n    display: none;\n  }\n  .LeftItems a:after, .RightItems a:after {\n    padding: 7px 12px;\n    font-size: 18px;\n    font-weight: 700;\n    line-height: 46px;\n  }\n  .LeftItems a:after {\n    content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'/%3E%3C/svg%3E\");\n  }\n  .RightItems a:after {\n    content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E\");\n    display: block;\n    height: 38px;\n  }\n  div.LeftItems a, div.RightItems a {\n    width: unset;\n    height: 40px;\n    background-color: #fff;\n    color: #000;\n    border: 1px solid #000;\n    overflow: hidden;\n    &[aria-disabled=\"true\"] {\n      background-color: #989898;\n    }\n  }\n  div.LeftItems a {\n    min-width: 60px;\n    border-radius: 20px 0 0 20px;\n    border-right: 0;\n  }\n  div.RightItems a {\n    display: flex;\n    min-width: 100px;\n    justify-content: space-evenly;\n    align-items: center;\n    border-radius: 0 20px 20px 0;\n    text-transform: none;\n  }\n  .RightItems a .NavigationButton {\n    padding: 12px 0 12px 12px;\n    font-weight: 700;\n  }",this.renderContentConditionally=i=>i&&(!i.includes("<bannermatrix-banner")||this.bannerMatrixReady)?n("p",{class:"BlogContent",innerHTML:i}):null,this.cmsEndpoint=void 0,this.language="en",this.translationUrl="",this.userRoles="everyone",this.cmsEnv="stage",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.showPublishingDate=!0,this.showImage=!0,this.showTitle=!0,this.showPageTitle=!1,this.showBreadcrumb=!1,this.showContent=!0,this.showButton=!0,this.hideError=!1,this.usePostmessage=void 0,this.postMessageEvent="",this.blogsLimit="0",this.paginationActive=void 0,this.arrowsActive=!0,this.secondaryArrowsActive=!1,this.numberedNavActive=!1,this.intlDateTimeFormat="",this.page="1",this.pageQueryParam=void 0,this.eventId=void 0,this.paginationBlogList={offset:0},this.currentPage=0,this.hasErrors=!1,this.isLoading=!0,this.bannerMatrixReady=!1,this.nextPage="",this.previousPage="",this.device="mobile",this.displayedBlogResponse=void 0,this.paginationBlogResponse=void 0,this.allBlogResponse=void 0,this.totalBlogs=0,this.customTranslations={}}getArticleId(i,t){var n;if(0!==i.button||i.metaKey||i.ctrlKey||i.shiftKey||i.altKey)return;const e={postId:t.postID.toString(),slug:t.slug,customPath:t.customPath};this.usePostmessage?(i.preventDefault(),window.postMessage(Object.assign({type:this.postMessageEvent},e))):null===(n=this.articleActionButton)||void 0===n||n.emit(e)}handleBannerReady(){this.bannerMatrixReady=!0}watchEndpoint(i,t){this.isInitialized&&(this.currentPage=parseInt(this.page)-1,(i||""===i)&&i!=t&&this.cmsEndpoint&&this.language&&this.getBlogArticleGrid())}handleClientStylingChange(i,t){i!==t&&a(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(i,t){i!==t&&this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)}async loadTranslations(){if(this.translationUrl)try{const i=await fetch(this.translationUrl);if(!i.ok)throw new Error(`HTTP error! status: ${i.status}`);this.customTranslations=await i.json()}catch(i){console.error("Failed to fetch or parse translations from URL:",i)}else this.customTranslations={}}hpPageChange(i){var t,n;this.paginationBlogList=i.detail,this.currentPage=Math.floor((null===(t=this.paginationBlogList)||void 0===t?void 0:t.offset)/(null===(n=this.paginationBlogList)||void 0===n?void 0:n.limit)),this.page&&(this.currentPage=this.currentPage+ +this.page-1),this.currentPage+1>this.lastPage?this.nextPage=null:this.currentPage<0?this.previousPage=null:(window.postMessage({type:"BlogArticlesGridActivePagination",currentPage:this.currentPage},window.location.href),this.getBlogArticleGrid(!0))}sortArticlesByDate(i){return i.sort(((i,t)=>i.publishingDate>t.publishingDate?-1:i.publishingDate<t.publishingDate?1:0)),i}findLatestFeatured(i){let t=i.filter((i=>i.isFeaturedPost));return 0===t.length?null:(t=this.sortArticlesByDate(t),t[0])}moveLatestFeatureToStart(i,t){if(!t)return i;const n=i.indexOf(t);return-1!==n&&(i.splice(n,1),i.unshift(t)),i}async fetchBlogPosts(i,t=!1){const n=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);return n.searchParams.append("per_page",t?"300":this.blogsLimit),n.searchParams.append("page",`${i||this.currentPage+1}`),n.searchParams.append("env",this.cmsEnv),n.searchParams.append("userRoles",this.userRoles),n.searchParams.append("device",(()=>{const i=(()=>{let i=window.navigator.userAgent;return i.toLowerCase().match(/android/i)?"Android":i.toLowerCase().match(/iphone/i)?"iPhone":i.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})();if(i){if("PC"===i)return"dk";if("iPad"===i||"iPhone"===i)return"mtWeb"}return"mtWeb"})()),fetch(n.href).then((i=>{if(i.status>=300)throw this.hasErrors=!0,new Error("There was an error while fetching the data");return i.json()})).then((i=>{let n=i.items;const e=this.findLatestFeatured(n);return n=this.sortArticlesByDate(n),n=this.moveLatestFeatureToStart(n,e),i=Object.assign(Object.assign({},i),{items:n}),t?this.allBlogResponse=i:this.paginationBlogResponse=i,i})).catch((i=>(this.hasErrors=!0,console.log("Error",i),{})))}async getBlogArticleGrid(i=!1,t){var n,e,s,o,a,r,h;this.isLoading=!0;try{let l;if(this.eventId&&this.eventId.length>0){const o=(null===(n=this.allBlogResponse)||void 0===n?void 0:n.items)?this.allBlogResponse:await this.fetchBlogPosts(1,!0),a=o.items.filter((({eventIds:i})=>{var t;return i.includes(null!==(t=this.eventId)&&void 0!==t?t:"-")}));a.length?(l=Object.assign(Object.assign({},o),{items:a,total:Math.min(parseInt(this.blogsLimit),a.length)}),window.postMessage({type:"OP:blogReady",payload:{hasBlog:!0}},"*")):(window.postMessage({type:"OP:blogReady",payload:{hasBlog:!1}},"*"),l=(null===(s=null===(e=this.paginationBlogResponse)||void 0===e?void 0:e.items)||void 0===s?void 0:s.length)&&!i?this.paginationBlogResponse:await this.fetchBlogPosts(t))}else l=(null===(a=null===(o=this.paginationBlogResponse)||void 0===o?void 0:o.items)||void 0===a?void 0:a.length)&&!i?this.paginationBlogResponse:await this.fetchBlogPosts(t);this.displayedBlogResponse=l,this.totalBlogs=l.total,this.lastPage=+((null===(h=null===(r=l.pages.last)||void 0===r?void 0:r.match(/&page=(\d+)/))||void 0===h?void 0:h[1])||1),this.nextPage=l.pages.next,this.previousPage=l.pages.previous,this.isLoading=!1,this.hasErrors=!1}catch(i){this.hasErrors=!0,console.log("Error",i)}}componentWillLoad(){return this.cmsEndpoint&&this.language&&this.blogsLimit&&(this.page?(this.currentPage=this.currentPage+ +this.page-1,this.getBlogArticleGrid(!1,+this.page)):this.getBlogArticleGrid()),this.loadTranslations()}handleClientStyling(){void 0===window.emMessageBus?(this.clientStyling&&a(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)):this.stylingSubscription=h(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription,!0)}componentDidLoad(){this.handleClientStyling(),this.isInitialized=!0,window.postMessage({type:"BlogArticlesGridLoaded"},window.location.href),this.device=((i=!1)=>{if("undefined"==typeof window||"undefined"==typeof navigator)return"desktop";const t=navigator.userAgent.toLowerCase(),n=window.innerWidth;if(function(i){return!!i.includes("ipad")||i.includes("macintosh")&&navigator.maxTouchPoints>0}(t))return"tablet";if(function(i){return i.includes("iphone")||i.includes("ipod")}(t))return"mobile";if(function(i,t){return l(i)&&(i.includes("mobile")||i.includes("mobi")||t<=599)}(t,n))return"mobile";if(function(i,t){return l(i)&&!i.includes("mobile")&&!i.includes("mobi")&&t>599}(t,n))return"tablet";if(i){if(n<=599)return"mobile";if(n<=1099)return"tablet"}return"desktop"})()}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}setImage(i){var t,n;return(null===(n=null===(t=i.sources)||void 0===t?void 0:t["mobile"===this.device?0:"tablet"===this.device?1:2])||void 0===n?void 0:n.pictureSource)||i.src}parseDate(i){const t=new Date(i);if(t instanceof Date&&!Number.isNaN(t.getTime()))return t;const[n,e,s]=i.trim().split("/").map(Number);return new Date(s,e-1,n)}formatDate(i){const t=this.parseDate(i);return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(t)}render(){if(this.hasErrors)return n("div",{class:"BlogsContainer"},!this.hideError&&n("div",{class:"ErrorMessage"},s("error",this.language,this.customTranslations)));const i=[];for(let t=0;t<parseInt(this.blogsLimit);t++)i.push(n("div",{class:"GridContainer FeaturedPost Skeleton"},n("div",{class:"GridWrapper"},n("div",{class:"GridSector"},n("div",{class:"VisualContent LoadingImage"})),n("div",{class:"GridSector"},n("div",{class:"BlogTitle LoadingStripe LoadingSmallStripe"}),n("div",{class:"BlogDetails LoadingStripe LoadingMediumStripe"}),n("div",{class:"BlogLink LoadingStripe LoadingLongStripe"})))));const t=Boolean(this.paginationActive)&&this.totalBlogs>+this.blogsLimit,e=this.mbSource?void 0:this.clientStyling||this.paginationDefaultStyling;return n("div",{ref:i=>this.stylingContainer=i},this.showBreadcrumb&&n("nav",{class:"breadcrumb","aria-label":"Breadcrumb"},n("a",{href:`/${encodeURIComponent(this.language)}`},s("home",this.language,this.customTranslations)),n("span",{"aria-hidden":"true"},"›"),n("span",{"aria-current":"page"},s("blog",this.language,this.customTranslations))),this.showPageTitle&&n("h1",{class:"BlogPageTitle"},s("blogPageTitle",this.language,this.customTranslations)),n("div",{class:"BlogPageContainer"},n("div",{class:"BlogGridPaginationWrapper"},t&&n("helper-pagination",{"next-page":this.nextPage,"prev-page":this.previousPage,offset:this.paginationBlogList.offset,limit:parseInt(this.blogsLimit,10),total:this.totalBlogs,language:this.language,"mb-source":this.mbSource,"client-styling":e,"client-styling-url":this.clientStylingUrl,"arrows-active":this.arrowsActive,"secondary-arrows-active":this.secondaryArrowsActive,"numbered-nav-active":this.numberedNavActive,"page-query-param":this.pageQueryParam,page:+this.page||1})),!this.isLoading&&n("div",{class:`GridContainerWrapper BlogPage-${this.currentPage} ${this.device}`},this.displayedBlogResponse&&this.displayedBlogResponse.items.map((i=>{var t,e;return n("div",{key:i.postID,class:i.isFeaturedPost?"GridContainer FeaturedPost":"GridContainer"},n("div",{class:"GridWrapper"},n("div",{class:"GridSector"},this.showPublishingDate&&n("div",{class:"BlogDate"},n("time",{dateTime:i.publishingDate},this.formatDate(i.publishingDate))),this.showImage&&(null===(t=i.image)||void 0===t?void 0:t.src)?n("img",{class:"VisualContent",src:this.setImage(i.image),alt:i.image.alt||i.title,width:"400",height:"225",loading:"lazy"}):(null===(e=i.video)||void 0===e?void 0:e.sources[this.device])?n("video",{class:"VisualContent",src:i.video.sources[this.device]}):n("span",{class:"VisualContent",style:{color:"#fff"}},"No Image")),n("div",{class:"GridSector"},this.showTitle&&n("h2",{class:"BlogTitle"},n("a",{class:"BlogCardLink",href:`/${encodeURIComponent(this.language)}/blog/${encodeURIComponent(i.customPath||i.slug)}`,onClick:t=>this.getArticleId(t,i)},i.title)),this.showContent&&this.renderContentConditionally(i.descriptionPreview),this.showButton&&n("span",{class:"BlogLink"},s("readmore",this.language,this.customTranslations)))))}))),this.isLoading&&n("div",{class:"GridContainerWrapper LoadingGrid"},i)))}static get watchers(){return{page:["watchEndpoint"],hasErrors:["watchEndpoint"],cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"],cmsEnv:["watchEndpoint"],userRoles:["watchEndpoint"],blogsLimit:["watchEndpoint"],eventId:["watchEndpoint"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["loadTranslations"]}}};d.style=':host {\n  display: block;\n}\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 0.5rem;\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 40px auto 20px;\n  color: var(--emw--color-white, #FFFFFF);\n}\n.breadcrumb a {\n  color: inherit;\n}\n\n.BlogPageTitle {\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 0 auto;\n  color: var(--emw--color-primary);\n  font-size: 22px;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.BlogPageContainer {\n  background: #0A0A17;\n  padding: 20px;\n}\n\n.GridContainerWrapper {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n.BlogPage-0 .GridContainer.FeaturedPost:first-child {\n  width: 100%;\n  flex-basis: auto;\n}\n\n.GridContainer {\n  position: relative;\n  container-type: inline-size;\n  container-name: article;\n  border-radius: 15px;\n  color: #000;\n  overflow: hidden;\n}\n.GridContainer.FeaturedPost:first-child {\n  grid-column: 1/-1;\n  width: 100%;\n}\n.GridContainer .GridWrapper {\n  display: flex;\n  flex-direction: row;\n  height: 280px;\n  background: var(--emw--color-white, #FFFFFF);\n}\n.GridContainer .GridSector {\n  flex-basis: 50%;\n  position: relative;\n}\n.GridContainer .GridSector:first-of-type {\n  height: 280px;\n  display: flex;\n}\n.GridContainer .GridSector:last-of-type {\n  position: static;\n  padding: 20px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.GridContainer .VisualContent {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.GridContainer .BlogDate {\n  position: absolute;\n  bottom: 0px;\n  left: 30px;\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: #CD0B5E;\n  z-index: 1;\n  pointer-events: none;\n}\n.GridContainer .BlogTitle {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 400;\n  color: #000;\n  padding-bottom: 10px;\n}\n.GridContainer .BlogTitle .BlogCardLink {\n  display: block;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n}\n.GridContainer .BlogTitle .BlogCardLink::after {\n  content: "";\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n}\n.GridContainer .BlogContent {\n  margin: 0;\n  display: -webkit-box;\n  font-size: 14px;\n  line-height: 1.2em;\n  -webkit-line-clamp: 6;\n  color: #000;\n  -webkit-box-orient: vertical;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n.GridContainer .BlogLink {\n  color: #22B04E;\n  font-size: 14px;\n  position: absolute;\n  bottom: 16px;\n  padding-top: 2.5px;\n}\n\n@container article (max-width: 550px) {\n  .GridContainer .GridWrapper {\n    height: 380px;\n    flex-direction: column;\n  }\n  .GridContainer .GridWrapper .GridSector:first-of-type {\n    height: 120px;\n    flex-shrink: 0;\n    flex-basis: 150px;\n  }\n  .GridContainer .GridWrapper .GridSector:last-of-type {\n    padding: 20px 20px 40px;\n  }\n}\n.LoadingImage {\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n}\n\n.LoadingStripe {\n  border: 1px solid var(--emw--color-white, #FFFFFF);\n  height: 20%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n  margin-bottom: 5px;\n}\n\n.LoadingSmallStripe {\n  width: 40%;\n}\n\n.LoadingMediumStripe {\n  width: 70%;\n}\n\n.BlogLink.LoadingLongStripe {\n  position: static;\n  width: 100%;\n}\n\n.GridContainerWrapper.LoadingGrid .GridSector {\n  justify-content: space-around;\n}\n\n.GridContainerWrapper.LoadingGrid .LoadingImage, .GridContainerWrapper.LoadingGrid .LoadingStripe {\n  animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n  -webkit-animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n}\n\n@keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n@-webkit-keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}';const c=i=>!!(i.toLowerCase().match(/android/i)||i.toLowerCase().match(/blackberry|bb/i)||i.toLowerCase().match(/iphone|ipad|ipod/i)||i.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i)),g={en:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ro:{firstPage:"Prima",previousPage:"Anterior",nextPage:"Urmatoarea",lastPage:"Ultima"},fr:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ar:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},hu:{firstPage:"First",previousPage:"Previous",nextPage:"Következő",lastPage:"Last"},hr:{firstPage:"Prva",previousPage:"Prethodna",nextPage:"Slijedeća",lastPage:"Zadnja"}},p=(i,t)=>g[void 0!==t&&t in g?t:"en"][i],u=class{constructor(n){i(this,n),this.hpPageChange=t(this,"hpPageChange",7),this.userAgent=window.navigator.userAgent,this.currentPage=1,this.navigateTo=i=>{var t;switch(i){case"firstPage":this.offsetInt=0;break;case"lastPage":this.offsetInt=this.endInt*this.limitInt;break;case"previousPage":this.offsetInt-=this.limitInt;break;case"nextPage":this.offsetInt+=this.limitInt;break;case"fivePagesBack":this.offsetInt-=5*this.limitInt,this.offsetInt=this.offsetInt<=0?0:this.offsetInt;break;case"fivePagesForward":this.offsetInt+=5*this.limitInt,this.offsetInt=this.offsetInt/this.limitInt>=this.endInt?this.endInt*this.limitInt:this.offsetInt}this.previousPage=!!this.offsetInt,null===(t=this.hpPageChange)||void 0===t||t.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.paginationNavigation=(i,t)=>{var n;this.previousPage=!0,isNaN(i)?0===t&&this.currentPage<=4?this.navigateTo("firstPage"):0===t&&this.currentPage>4?this.navigateTo("fivePagesBack"):4===t&&this.endInt-this.currentPage>=2&&this.navigateTo("fivePagesForward"):1===i?(this.offsetInt=i-1,this.previousPage=!1):this.offsetInt=(i-1)*this.limitInt,null===(n=this.hpPageChange)||void 0===n||n.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.nextPage="",this.prevPage="",this.offset=0,this.limit=1,this.total=1,this.language="en",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.arrowsActive=!0,this.secondaryArrowsActive=!1,this.numberedNavActive=!1,this.pageQueryParam=void 0,this.page=1,this.offsetInt=0,this.lastPage=!1,this.previousPage=!1,this.limitInt=0,this.totalInt=0,this.pagesArray=[],this.endInt=0}handleClientStylingChange(i,t){i!==t&&a(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(i,t){i!==t&&this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)}componentWillRender(){this.offsetInt=this.offset,this.limitInt=this.limit,this.currentPage=this.offsetInt/this.limitInt+1,this.limitInt=this.limit,this.totalInt=this.total,this.endInt=Math.ceil(this.totalInt/this.limitInt)-1,this.lastPage=!(this.offsetInt>=this.endInt*this.limitInt),1==this.currentPage||2==this.currentPage?(this.pagesArray=Array.from({length:4},((i,t)=>t+1)),this.pagesArray.push("...")):this.currentPage>=3&&this.endInt-this.currentPage>=2?(this.pagesArray=Array.from({length:3},((i,t)=>this.currentPage+t-1)),this.pagesArray.push("..."),this.pagesArray.unshift("...")):this.endInt-this.currentPage<3&&(this.pagesArray=Array.from({length:4},((i,t)=>this.endInt-2+t)),this.pagesArray.unshift("..."))}handleClientStyling(){void 0===window.emMessageBus?(this.clientStyling&&a(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)):this.stylingSubscription=h(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription,!0)}componentDidLoad(){this.handleClientStyling()}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}pageHref(i){if(!this.pageQueryParam)return"#";const t=new URL(window.location.href);return t.searchParams.set(this.pageQueryParam,String(i+this.page-1)),`${t.search}${t.hash}`}render(){let i=n("ul",{class:"PaginationArea"},this.pagesArray.map(((i,t)=>{const e="number"==typeof i?i:0===t?Math.max(1,this.currentPage-5):Math.min(this.endInt+1,this.currentPage+5);return n("li",{class:"PaginationItem"+(i===this.currentPage?" ActiveItem":" ")+" "+(c(this.userAgent)?"MobileButtons":"")},n("a",{href:this.pageHref(e),"aria-current":i===this.currentPage?"page":void 0,"aria-disabled":i===this.currentPage?"true":void 0,tabIndex:i===this.currentPage?-1:void 0,onClick:n=>{n.preventDefault(),i!==this.currentPage&&this.paginationNavigation(i,t)}},n("span",null,i)))}))),t=n("a",{href:this.prevPage?this.pageHref(1):"#","aria-disabled":this.prevPage?void 0:"true",tabIndex:this.prevPage?void 0:-1,onClick:i=>{i.preventDefault(),this.prevPage&&this.navigateTo("firstPage")}},n("span",{class:"NavigationButton"},p("firstPage",this.language)),n("span",{class:"NavigationIcon"})),e=n("div",{class:"LeftItems"},this.secondaryArrowsActive&&t,n("a",{href:this.prevPage?this.pageHref(this.currentPage-1):"#",rel:"prev","aria-label":p("previousPage",this.language),"aria-disabled":this.prevPage?void 0:"true",tabIndex:this.prevPage?void 0:-1,onClick:i=>{i.preventDefault(),this.prevPage&&this.navigateTo("previousPage")}},n("span",{class:"NavigationButton"},p("previousPage",this.language)),n("span",{class:"NavigationIcon"})));c(this.userAgent)&&(e=n("div",{class:"LeftItems"},n("a",{href:this.prevPage?this.pageHref(this.currentPage-1):"#",rel:"prev","aria-label":p("previousPage",this.language),"aria-disabled":this.prevPage?void 0:"true",tabIndex:this.prevPage?void 0:-1,onClick:i=>{i.preventDefault(),this.prevPage&&this.navigateTo("previousPage")}},n("span",{class:"NavigationButton"},p("previousPage",this.language)),n("span",{class:"NavigationIcon"}))));let s=n("a",{href:this.nextPage?this.pageHref(this.endInt+1):"#","aria-disabled":this.nextPage?void 0:"true",tabIndex:this.nextPage?void 0:-1,onClick:i=>{i.preventDefault(),this.nextPage&&this.navigateTo("lastPage")}},n("span",{class:"NavigationButton"},p("lastPage",this.language)),n("span",{class:"NavigationIcon"})),o=n("div",{class:"RightItems"},n("a",{href:this.nextPage?this.pageHref(this.currentPage+1):"#",rel:"next","aria-label":p("nextPage",this.language),"aria-disabled":this.nextPage?void 0:"true",tabIndex:this.nextPage?void 0:-1,onClick:i=>{i.preventDefault(),this.nextPage&&this.navigateTo("nextPage")}},n("span",{class:"NavigationButton"},p("nextPage",this.language)),n("span",{class:"NavigationIcon"})),this.secondaryArrowsActive&&s);return c(this.userAgent)&&(o=n("div",{class:"RightItems"},n("a",{href:this.nextPage?this.pageHref(this.currentPage+1):"#",rel:"next","aria-label":p("nextPage",this.language),"aria-disabled":this.nextPage?void 0:"true",tabIndex:this.nextPage?void 0:-1,onClick:i=>{i.preventDefault(),this.nextPage&&this.navigateTo("nextPage")}},n("span",{class:"NavigationButton"},p("nextPage",this.language)),n("span",{class:"NavigationIcon"})))),n("nav",{id:"PaginationContainer",class:"PaginationContainer","aria-label":"Blog pagination",ref:i=>this.stylingContainer=i},this.arrowsActive&&e,this.numberedNavActive&&i,this.arrowsActive&&o)}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}}};u.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}#PaginationContainer{width:100%;margin:20px 0;display:inline-flex;justify-content:space-between;align-items:center}.LeftItems a:not(:first-child),.RightItems a:not(:last-child){margin:0 10px}.LeftItems a,.RightItems a{padding:0;background-color:#009993;border-color:#009993}.PaginationArea{display:inline-flex;gap:10px;list-style:none}.PaginationArea li{margin:0;padding:0}.PaginationArea li a{width:24px;height:24px;display:flex;border:0;padding:0;justify-content:center;align-items:center;background-color:transparent;color:#000;cursor:pointer;pointer-events:all}.PaginationItem.ActiveItem a{background:#009993;border-color:#009993;color:#fff}.PaginationItem.ActiveItem a[aria-disabled=true]{pointer-events:none;cursor:not-allowed}.PaginationItem a:hover,.PaginationItem a:active{background:#009993;border-color:#009993;color:#fff;opacity:0.8}a{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;text-decoration:none;width:100px;height:32px;border:1px solid #524e52;border-radius:5px;background:#524e52;color:#fff;font-size:14px;font:inherit;cursor:pointer;transition:all 0.1s linear;text-transform:uppercase;text-align:center;letter-spacing:0}a:hover,a:active{background:#004D4A;border-color:#004D4A}a[aria-disabled=true]{background-color:#ccc;border-color:#ccc;color:#fff;cursor:not-allowed}@media screen and (max-width: 720px){a{width:90px;font-size:14px}}@media screen and (max-width: 480px){a{width:70px;font-size:14px}.paginationArea{padding:5px}}@media screen and (max-width: 320px){a{width:58px;font-size:12px}.paginationArea{padding:5px;gap:5px}}@media (hover: none){.paginationItem a:hover{background:inherit;border-color:inherit;color:inherit;opacity:1}.paginationItem.activeItem a:hover{background:#009993;border-color:#009993;color:#fff}}';export{d as blog_articles_grid,u as helper_pagination}
+import{r as i,c as t,h as n}from"./index-4af8e775.js";const e={en:{error:"Error",readmore:"Read more",home:"Home",blog:"Blog",blogPageTitle:"Blog"},ro:{error:"Eroare",readmore:"Read more",home:"Acasă",blog:"Blog",blogPageTitle:"Blog"},fr:{error:"Error",readmore:"Read more",home:"Accueil",blog:"Blog",blogPageTitle:"Blog"},ar:{error:"خطأ",readmore:"Read more",home:"الرئيسية",blog:"المدونة",blogPageTitle:"المدونة"},hu:{error:"خطأ",readmore:"Tovább olvasom",home:"Kezdőlap",blog:"Blog",blogPageTitle:"Blog"},hr:{error:"Greška",readmore:"Pročitaj više",home:"Početna",blog:"Blog",blogPageTitle:"Blog"},"pt-br":{error:"Erro",readmore:"Ler mais",home:"Início",blog:"Blog",blogPageTitle:"Blog"},"es-mx":{error:"Error",readmore:"Leer más",home:"Inicio",blog:"Blog",blogPageTitle:"Blog"}},s=(i,t,n)=>{var s;const o=null!=t?t:"en",a=null===(s=null==n?void 0:n[o])||void 0===s?void 0:s[i];return"string"==typeof a?a:e[o in e?o:"en"][i]},o="__WIDGET_GLOBAL_STYLE_CACHE__";function a(i,t){if(i){const n=document.createElement("style");n.innerHTML=t,i.appendChild(n)}}function r(i,t){if(!i||!t)return;const n=new URL(t);fetch(n.href).then((i=>i.text())).then((t=>{const n=document.createElement("style");n.innerHTML=t,i&&i.appendChild(n)})).catch((i=>{console.error("There was an error while trying to load client styling from URL",i)}))}function h(i,t,n,e=!1){if(!window.emMessageBus)return;if(!("adoptedStyleSheets"in Document.prototype)||!e)return n=function(i,t){const n=document.createElement("style");return window.emMessageBus.subscribe(t,(t=>{i&&(n.innerHTML=t,i.appendChild(n))}))}(i,t),n;window[o]||(window[o]={}),n=function(i,t){return window.emMessageBus.subscribe(t,(n=>{if(!i)return;const e=i.getRootNode(),s=window[o];let a=s[t]&&s[t].sheet;a?s[t].refCount=s[t].refCount+1:(a=new CSSStyleSheet,a.replaceSync(n),s[t]={sheet:a,refCount:1});const r=e.adoptedStyleSheets||[];r.includes(a)||(e.adoptedStyleSheets=[...r,a])}))}(i,t);const s=n.unsubscribe.bind(n);return n.unsubscribe=()=>{if(window[o][t]){const i=window[o][t];i.refCount>1?i.refCount=i.refCount-1:delete window[o][t]}s()},n}function l(i){return i.includes("android")}const d=class{constructor(e){i(this,e),this.articleActionButton=t(this,"articleActionButton",7),this.lastPage=1,this.isInitialized=!1,this.paginationDefaultStyling="\n  nav#PaginationContainer {\n    justify-content: right;\n  }\n  .LeftItems a .NavigationButton {\n    display: none;\n  }\n  .LeftItems a:after, .RightItems a:after {\n    padding: 7px 12px;\n    font-size: 18px;\n    font-weight: 700;\n    line-height: 46px;\n  }\n  .LeftItems a:after {\n    content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'/%3E%3C/svg%3E\");\n  }\n  .RightItems a:after {\n    content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.2em' viewBox='0 0 320 512'%3E%3C!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E\");\n    display: block;\n    height: 38px;\n  }\n  div.LeftItems a, div.RightItems a {\n    width: unset;\n    height: 40px;\n    background-color: #fff;\n    color: #000;\n    border: 1px solid #000;\n    overflow: hidden;\n    &[aria-disabled=\"true\"] {\n      background-color: #989898;\n    }\n  }\n  div.LeftItems a {\n    min-width: 60px;\n    border-radius: 20px 0 0 20px;\n    border-right: 0;\n  }\n  div.RightItems a {\n    display: flex;\n    min-width: 100px;\n    justify-content: space-evenly;\n    align-items: center;\n    border-radius: 0 20px 20px 0;\n    text-transform: none;\n  }\n  .RightItems a .NavigationButton {\n    padding: 12px 0 12px 12px;\n    font-weight: 700;\n  }",this.renderContentConditionally=i=>i&&(!i.includes("<bannermatrix-banner")||this.bannerMatrixReady)?n("p",{class:"BlogContent",innerHTML:i}):null,this.cmsEndpoint=void 0,this.language="en",this.translationUrl="",this.userRoles="everyone",this.cmsEnv="stage",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.showPublishingDate=!0,this.showBlogSubcategories=!1,this.showImage=!0,this.showTitle=!0,this.showPageTitle=!1,this.showBreadcrumb=!1,this.showContent=!0,this.showButton=!0,this.hideError=!1,this.usePostmessage=void 0,this.postMessageEvent="",this.blogsLimit="0",this.paginationActive=void 0,this.arrowsActive=!0,this.secondaryArrowsActive=!1,this.numberedNavActive=!1,this.intlDateTimeFormat="",this.page="1",this.pageQueryParam=void 0,this.eventId=void 0,this.paginationBlogList={offset:0},this.currentPage=0,this.hasErrors=!1,this.isLoading=!0,this.bannerMatrixReady=!1,this.nextPage="",this.previousPage="",this.device="mobile",this.displayedBlogResponse=void 0,this.paginationBlogResponse=void 0,this.allBlogResponse=void 0,this.totalBlogs=0,this.customTranslations={},this.selectedCategory="all",this.categories=[]}getArticleId(i,t){var n;if(0!==i.button||i.metaKey||i.ctrlKey||i.shiftKey||i.altKey)return;const e={postId:t.postID.toString(),slug:t.slug,customPath:t.customPath};this.usePostmessage?(i.preventDefault(),window.postMessage(Object.assign({type:this.postMessageEvent},e))):null===(n=this.articleActionButton)||void 0===n||n.emit(e)}handleBannerReady(){this.bannerMatrixReady=!0}watchEndpoint(i,t){this.isInitialized&&(this.currentPage=parseInt(this.page)-1,(i||""===i)&&i!=t&&this.cmsEndpoint&&this.language&&this.getBlogArticleGrid())}handleClientStylingChange(i,t){i!==t&&a(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(i,t){i!==t&&this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)}async loadTranslations(){if(this.translationUrl)try{const i=await fetch(this.translationUrl);if(!i.ok)throw new Error(`HTTP error! status: ${i.status}`);this.customTranslations=await i.json()}catch(i){console.error("Failed to fetch or parse translations from URL:",i)}else this.customTranslations={}}hpPageChange(i){var t,n;this.paginationBlogList=i.detail,this.currentPage=Math.floor((null===(t=this.paginationBlogList)||void 0===t?void 0:t.offset)/(null===(n=this.paginationBlogList)||void 0===n?void 0:n.limit)),this.page&&(this.currentPage=this.currentPage+ +this.page-1),this.currentPage+1>this.lastPage?this.nextPage=null:this.currentPage<0?this.previousPage=null:(window.postMessage({type:"BlogArticlesGridActivePagination",currentPage:this.currentPage},window.location.href),this.getBlogArticleGrid(!0))}sortArticlesByDate(i){return i.sort(((i,t)=>i.publishingDate>t.publishingDate?-1:i.publishingDate<t.publishingDate?1:0)),i}findLatestFeatured(i){let t=i.filter((i=>i.isFeaturedPost));return 0===t.length?null:(t=this.sortArticlesByDate(t),t[0])}moveLatestFeatureToStart(i,t){if(!t)return i;const n=i.indexOf(t);return-1!==n&&(i.splice(n,1),i.unshift(t)),i}async fetchBlogPosts(i,t=!1){const n=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);if(this.showBlogSubcategories&&this.selectedCategory&&"all"!==this.selectedCategory){const i=this.categories.find((i=>i.id==this.selectedCategory));i&&n.searchParams.append("category",i.name)}return n.searchParams.append("per_page",t?"300":this.blogsLimit),n.searchParams.append("page",`${i||this.currentPage+1}`),n.searchParams.append("env",this.cmsEnv),n.searchParams.append("userRoles",this.userRoles),n.searchParams.append("device",(()=>{const i=(()=>{let i=window.navigator.userAgent;return i.toLowerCase().match(/android/i)?"Android":i.toLowerCase().match(/iphone/i)?"iPhone":i.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})();if(i){if("PC"===i)return"dk";if("iPad"===i||"iPhone"===i)return"mtWeb"}return"mtWeb"})()),fetch(n.href).then((i=>{if(i.status>=300)throw this.hasErrors=!0,new Error("There was an error while fetching the data");return i.json()})).then((i=>{let n=i.items;const e=this.findLatestFeatured(n);return n=this.sortArticlesByDate(n),n=this.moveLatestFeatureToStart(n,e),i=Object.assign(Object.assign({},i),{items:n}),t?this.allBlogResponse=i:this.paginationBlogResponse=i,i})).catch((i=>(this.hasErrors=!0,console.log("Error",i),{})))}async fetchCategories(){try{const i=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts/category`),t=await fetch(i.href);if(!t.ok)throw new Error("Failed to fetch categories");const n=await t.json();this.categories=[{id:"all",name:"All"},...n]}catch(i){console.error("Error fetching categories",i)}}async getBlogArticleGrid(i=!1,t){var n,e,s,o,a,r,h;this.isLoading=!0;try{let l;if(this.eventId&&this.eventId.length>0){const o=(null===(n=this.allBlogResponse)||void 0===n?void 0:n.items)?this.allBlogResponse:await this.fetchBlogPosts(1,!0),a=o.items.filter((({eventIds:i})=>{var t;return i.includes(null!==(t=this.eventId)&&void 0!==t?t:"-")}));a.length?(l=Object.assign(Object.assign({},o),{items:a,total:Math.min(parseInt(this.blogsLimit),a.length)}),window.postMessage({type:"OP:blogReady",payload:{hasBlog:!0}},"*")):(window.postMessage({type:"OP:blogReady",payload:{hasBlog:!1}},"*"),l=(null===(s=null===(e=this.paginationBlogResponse)||void 0===e?void 0:e.items)||void 0===s?void 0:s.length)&&!i?this.paginationBlogResponse:await this.fetchBlogPosts(t))}else l=(null===(a=null===(o=this.paginationBlogResponse)||void 0===o?void 0:o.items)||void 0===a?void 0:a.length)&&!i?this.paginationBlogResponse:await this.fetchBlogPosts(t);this.displayedBlogResponse=l,this.totalBlogs=l.total,this.lastPage=+((null===(h=null===(r=l.pages.last)||void 0===r?void 0:r.match(/&page=(\d+)/))||void 0===h?void 0:h[1])||1),this.nextPage=l.pages.next,this.previousPage=l.pages.previous,this.isLoading=!1,this.hasErrors=!1}catch(i){this.hasErrors=!0,console.log("Error",i)}}async componentWillLoad(){return this.showBlogSubcategories&&await this.fetchCategories(),this.cmsEndpoint&&this.language&&this.blogsLimit&&(this.page?(this.currentPage=this.currentPage+ +this.page-1,this.getBlogArticleGrid(!1,+this.page)):this.getBlogArticleGrid()),this.loadTranslations()}async handleCategoryChange(i){this.selectedCategory=i,this.currentPage=0,this.paginationBlogList=Object.assign(Object.assign({},this.paginationBlogList),{offset:0}),await this.getBlogArticleGrid(!0,1)}handleClientStyling(){void 0===window.emMessageBus?(this.clientStyling&&a(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)):this.stylingSubscription=h(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription,!0)}componentDidLoad(){this.handleClientStyling(),this.isInitialized=!0,window.postMessage({type:"BlogArticlesGridLoaded"},window.location.href),this.device=((i=!1)=>{if("undefined"==typeof window||"undefined"==typeof navigator)return"desktop";const t=navigator.userAgent.toLowerCase(),n=window.innerWidth;if(function(i){return!!i.includes("ipad")||i.includes("macintosh")&&navigator.maxTouchPoints>0}(t))return"tablet";if(function(i){return i.includes("iphone")||i.includes("ipod")}(t))return"mobile";if(function(i,t){return l(i)&&(i.includes("mobile")||i.includes("mobi")||t<=599)}(t,n))return"mobile";if(function(i,t){return l(i)&&!i.includes("mobile")&&!i.includes("mobi")&&t>599}(t,n))return"tablet";if(i){if(n<=599)return"mobile";if(n<=1099)return"tablet"}return"desktop"})()}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}setImage(i){var t,n;return(null===(n=null===(t=i.sources)||void 0===t?void 0:t["mobile"===this.device?0:"tablet"===this.device?1:2])||void 0===n?void 0:n.pictureSource)||i.src}parseDate(i){const t=new Date(i);if(t instanceof Date&&!Number.isNaN(t.getTime()))return t;const[n,e,s]=i.trim().split("/").map(Number);return new Date(s,e-1,n)}formatDate(i){const t=this.parseDate(i);return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(t)}render(){if(this.hasErrors)return n("div",{class:"BlogsContainer"},!this.hideError&&n("div",{class:"ErrorMessage"},s("error",this.language,this.customTranslations)));const i=[];for(let t=0;t<parseInt(this.blogsLimit);t++)i.push(n("div",{class:"GridContainer FeaturedPost Skeleton"},n("div",{class:"GridWrapper"},n("div",{class:"GridSector"},n("div",{class:"VisualContent LoadingImage"})),n("div",{class:"GridSector"},n("div",{class:"BlogTitle LoadingStripe LoadingSmallStripe"}),n("div",{class:"BlogDetails LoadingStripe LoadingMediumStripe"}),n("div",{class:"BlogLink LoadingStripe LoadingLongStripe"})))));const t=Boolean(this.paginationActive)&&this.totalBlogs>+this.blogsLimit,e=this.mbSource?void 0:this.clientStyling||this.paginationDefaultStyling;return n("div",{ref:i=>this.stylingContainer=i},this.showBreadcrumb&&n("nav",{class:"breadcrumb","aria-label":"Breadcrumb"},n("a",{href:`/${encodeURIComponent(this.language)}`},s("home",this.language,this.customTranslations)),n("span",{"aria-hidden":"true"},"›"),n("span",{"aria-current":"page"},s("blog",this.language,this.customTranslations))),this.showPageTitle&&n("h1",{class:"BlogPageTitle"},s("blogPageTitle",this.language,this.customTranslations)),n("div",{class:"BlogPageContainer"},this.showBlogSubcategories&&n("div",{class:"BlogCategoriesSliderWrapper"},n("div",{class:"CarouselWrapper"},n("div",{class:"CarouselContainer"},n("div",{class:"BlogCategoriesWrapper"},n("div",{class:"CategoryButtons"},this.categories.map((i=>n("button",{key:i.id,class:{CategoryButton:!0,active:this.selectedCategory===i.id},onClick:()=>{this.handleCategoryChange(i.id)}},i.name)))))))),n("div",{class:"BlogGridPaginationWrapper"},t&&n("helper-pagination",{"next-page":this.nextPage,"prev-page":this.previousPage,offset:this.paginationBlogList.offset,limit:parseInt(this.blogsLimit,10),total:this.totalBlogs,language:this.language,"mb-source":this.mbSource,"client-styling":e,"client-styling-url":this.clientStylingUrl,"arrows-active":this.arrowsActive,"secondary-arrows-active":this.secondaryArrowsActive,"numbered-nav-active":this.numberedNavActive,"page-query-param":this.pageQueryParam,page:+this.page||1})),!this.isLoading&&n("div",{class:`GridContainerWrapper BlogPage-${this.currentPage} ${this.device}`},this.displayedBlogResponse&&this.displayedBlogResponse.items.map((i=>{var t,e;return n("div",{key:i.postID,class:i.isFeaturedPost?"GridContainer FeaturedPost":"GridContainer"},n("div",{class:"GridWrapper"},n("div",{class:"GridSector"},this.showPublishingDate&&n("div",{class:"BlogDate"},n("time",{dateTime:i.publishingDate},this.formatDate(i.publishingDate))),this.showImage&&(null===(t=i.image)||void 0===t?void 0:t.src)?n("img",{class:"VisualContent",src:this.setImage(i.image),alt:i.image.alt||i.title,width:"400",height:"225",loading:"lazy"}):(null===(e=i.video)||void 0===e?void 0:e.sources[this.device])?n("video",{class:"VisualContent",src:i.video.sources[this.device]}):n("span",{class:"VisualContent",style:{color:"#fff"}},"No Image")),n("div",{class:"GridSector"},this.showTitle&&n("h2",{class:"BlogTitle"},n("a",{class:"BlogCardLink",href:`/${encodeURIComponent(this.language)}/blog/${encodeURIComponent(i.customPath||i.slug)}`,onClick:t=>this.getArticleId(t,i)},i.title)),this.showContent&&this.renderContentConditionally(i.descriptionPreview),this.showButton&&n("span",{class:"BlogLink"},s("readmore",this.language,this.customTranslations)))))}))),this.isLoading&&n("div",{class:"GridContainerWrapper LoadingGrid"},i)))}static get watchers(){return{page:["watchEndpoint"],hasErrors:["watchEndpoint"],cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"],cmsEnv:["watchEndpoint"],userRoles:["watchEndpoint"],blogsLimit:["watchEndpoint"],eventId:["watchEndpoint"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["loadTranslations"]}}};d.style=':host {\n  display: block;\n}\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 0.5rem;\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 40px auto 20px;\n  color: var(--emw--color-white, #FFFFFF);\n}\n.breadcrumb a {\n  color: inherit;\n}\n\n.BlogPageTitle {\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 0 auto;\n  color: var(--emw--color-primary);\n  font-size: 22px;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.BlogPageContainer {\n  background: #0A0A17;\n  padding: 20px;\n}\n\n.GridContainerWrapper {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n.BlogPage-0 .GridContainer.FeaturedPost:first-child {\n  width: 100%;\n  flex-basis: auto;\n}\n\n.GridContainer {\n  position: relative;\n  container-type: inline-size;\n  container-name: article;\n  border-radius: 15px;\n  color: #000;\n  overflow: hidden;\n}\n.GridContainer.FeaturedPost:first-child {\n  grid-column: 1/-1;\n  width: 100%;\n}\n.GridContainer .GridWrapper {\n  display: flex;\n  flex-direction: row;\n  height: 280px;\n  background: var(--emw--color-white, #FFFFFF);\n}\n.GridContainer .GridSector {\n  flex-basis: 50%;\n  position: relative;\n}\n.GridContainer .GridSector:first-of-type {\n  height: 280px;\n  display: flex;\n}\n.GridContainer .GridSector:last-of-type {\n  position: static;\n  padding: 20px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.GridContainer .VisualContent {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.GridContainer .BlogDate {\n  position: absolute;\n  bottom: 0px;\n  left: 30px;\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: #CD0B5E;\n  z-index: 1;\n  pointer-events: none;\n}\n.GridContainer .BlogTitle {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 400;\n  color: #000;\n  padding-bottom: 10px;\n}\n.GridContainer .BlogTitle .BlogCardLink {\n  display: block;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n}\n.GridContainer .BlogTitle .BlogCardLink::after {\n  content: "";\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n}\n.GridContainer .BlogContent {\n  margin: 0;\n  display: -webkit-box;\n  font-size: 14px;\n  line-height: 1.2em;\n  -webkit-line-clamp: 6;\n  color: #000;\n  -webkit-box-orient: vertical;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n.GridContainer .BlogLink {\n  color: #22B04E;\n  font-size: 14px;\n  position: absolute;\n  bottom: 16px;\n  padding-top: 2.5px;\n}\n\n@container article (max-width: 550px) {\n  .GridContainer .GridWrapper {\n    height: 380px;\n    flex-direction: column;\n  }\n  .GridContainer .GridWrapper .GridSector:first-of-type {\n    height: 120px;\n    flex-shrink: 0;\n    flex-basis: 150px;\n  }\n  .GridContainer .GridWrapper .GridSector:last-of-type {\n    padding: 20px 20px 40px;\n  }\n}\n.LoadingImage {\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n}\n\n.LoadingStripe {\n  border: 1px solid var(--emw--color-white, #FFFFFF);\n  height: 20%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n  margin-bottom: 5px;\n}\n\n.LoadingSmallStripe {\n  width: 40%;\n}\n\n.LoadingMediumStripe {\n  width: 70%;\n}\n\n.BlogLink.LoadingLongStripe {\n  position: static;\n  width: 100%;\n}\n\n.GridContainerWrapper.LoadingGrid .GridSector {\n  justify-content: space-around;\n}\n\n.GridContainerWrapper.LoadingGrid .LoadingImage, .GridContainerWrapper.LoadingGrid .LoadingStripe {\n  animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n  -webkit-animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n}\n\n@keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n@-webkit-keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n.BlogCategoriesWrapper {\n  margin-bottom: 24px;\n}\n\n.FilterLabel {\n  margin-bottom: 12px;\n  color: var(--emw--color-white, #fff);\n  font-weight: 600;\n}\n\n.CategoryButtons {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n}\n\n.CategoryButton {\n  padding: 10px 20px;\n  border-radius: 999px;\n  border: 1px solid currentColor;\n  background: transparent;\n  color: var(--emw--color-white, #fff);\n  cursor: pointer;\n  transition: all 0.2s ease;\n}\n\n.CategoryButton.active {\n  background: var(--emw--casino-color-primary, var(--emw--color-primary, #22B04E));\n  color: var(--emw--color-background, #fff);\n}';const c=i=>!!(i.toLowerCase().match(/android/i)||i.toLowerCase().match(/blackberry|bb/i)||i.toLowerCase().match(/iphone|ipad|ipod/i)||i.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i)),g={en:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ro:{firstPage:"Prima",previousPage:"Anterior",nextPage:"Urmatoarea",lastPage:"Ultima"},fr:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},ar:{firstPage:"First",previousPage:"Previous",nextPage:"Next",lastPage:"Last"},hu:{firstPage:"First",previousPage:"Previous",nextPage:"Következő",lastPage:"Last"},hr:{firstPage:"Prva",previousPage:"Prethodna",nextPage:"Slijedeća",lastPage:"Zadnja"}},p=(i,t)=>g[void 0!==t&&t in g?t:"en"][i],u=class{constructor(n){i(this,n),this.hpPageChange=t(this,"hpPageChange",7),this.userAgent=window.navigator.userAgent,this.currentPage=1,this.navigateTo=i=>{var t;switch(i){case"firstPage":this.offsetInt=0;break;case"lastPage":this.offsetInt=this.endInt*this.limitInt;break;case"previousPage":this.offsetInt-=this.limitInt;break;case"nextPage":this.offsetInt+=this.limitInt;break;case"fivePagesBack":this.offsetInt-=5*this.limitInt,this.offsetInt=this.offsetInt<=0?0:this.offsetInt;break;case"fivePagesForward":this.offsetInt+=5*this.limitInt,this.offsetInt=this.offsetInt/this.limitInt>=this.endInt?this.endInt*this.limitInt:this.offsetInt}this.previousPage=!!this.offsetInt,null===(t=this.hpPageChange)||void 0===t||t.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.paginationNavigation=(i,t)=>{var n;this.previousPage=!0,isNaN(i)?0===t&&this.currentPage<=4?this.navigateTo("firstPage"):0===t&&this.currentPage>4?this.navigateTo("fivePagesBack"):4===t&&this.endInt-this.currentPage>=2&&this.navigateTo("fivePagesForward"):1===i?(this.offsetInt=i-1,this.previousPage=!1):this.offsetInt=(i-1)*this.limitInt,null===(n=this.hpPageChange)||void 0===n||n.emit({offset:this.offsetInt,limit:this.limitInt,total:this.totalInt})},this.nextPage="",this.prevPage="",this.offset=0,this.limit=1,this.total=1,this.language="en",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.arrowsActive=!0,this.secondaryArrowsActive=!1,this.numberedNavActive=!1,this.pageQueryParam=void 0,this.page=1,this.offsetInt=0,this.lastPage=!1,this.previousPage=!1,this.limitInt=0,this.totalInt=0,this.pagesArray=[],this.endInt=0}handleClientStylingChange(i,t){i!==t&&a(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(i,t){i!==t&&this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)}componentWillRender(){this.offsetInt=this.offset,this.limitInt=this.limit,this.currentPage=this.offsetInt/this.limitInt+1,this.limitInt=this.limit,this.totalInt=this.total,this.endInt=Math.ceil(this.totalInt/this.limitInt)-1,this.lastPage=!(this.offsetInt>=this.endInt*this.limitInt),1==this.currentPage||2==this.currentPage?(this.pagesArray=Array.from({length:4},((i,t)=>t+1)),this.pagesArray.push("...")):this.currentPage>=3&&this.endInt-this.currentPage>=2?(this.pagesArray=Array.from({length:3},((i,t)=>this.currentPage+t-1)),this.pagesArray.push("..."),this.pagesArray.unshift("...")):this.endInt-this.currentPage<3&&(this.pagesArray=Array.from({length:4},((i,t)=>this.endInt-2+t)),this.pagesArray.unshift("..."))}handleClientStyling(){void 0===window.emMessageBus?(this.clientStyling&&a(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&r(this.stylingContainer,this.clientStylingUrl)):this.stylingSubscription=h(this.stylingContainer,`${this.mbSource}.Style`,this.stylingSubscription,!0)}componentDidLoad(){this.handleClientStyling()}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}pageHref(i){if(!this.pageQueryParam)return"#";const t=new URL(window.location.href);return t.searchParams.set(this.pageQueryParam,String(i+this.page-1)),`${t.search}${t.hash}`}render(){let i=n("ul",{class:"PaginationArea"},this.pagesArray.map(((i,t)=>{const e="number"==typeof i?i:0===t?Math.max(1,this.currentPage-5):Math.min(this.endInt+1,this.currentPage+5);return n("li",{class:"PaginationItem"+(i===this.currentPage?" ActiveItem":" ")+" "+(c(this.userAgent)?"MobileButtons":"")},n("a",{href:this.pageHref(e),"aria-current":i===this.currentPage?"page":void 0,"aria-disabled":i===this.currentPage?"true":void 0,tabIndex:i===this.currentPage?-1:void 0,onClick:n=>{n.preventDefault(),i!==this.currentPage&&this.paginationNavigation(i,t)}},n("span",null,i)))}))),t=n("a",{href:this.prevPage?this.pageHref(1):"#","aria-disabled":this.prevPage?void 0:"true",tabIndex:this.prevPage?void 0:-1,onClick:i=>{i.preventDefault(),this.prevPage&&this.navigateTo("firstPage")}},n("span",{class:"NavigationButton"},p("firstPage",this.language)),n("span",{class:"NavigationIcon"})),e=n("div",{class:"LeftItems"},this.secondaryArrowsActive&&t,n("a",{href:this.prevPage?this.pageHref(this.currentPage-1):"#",rel:"prev","aria-label":p("previousPage",this.language),"aria-disabled":this.prevPage?void 0:"true",tabIndex:this.prevPage?void 0:-1,onClick:i=>{i.preventDefault(),this.prevPage&&this.navigateTo("previousPage")}},n("span",{class:"NavigationButton"},p("previousPage",this.language)),n("span",{class:"NavigationIcon"})));c(this.userAgent)&&(e=n("div",{class:"LeftItems"},n("a",{href:this.prevPage?this.pageHref(this.currentPage-1):"#",rel:"prev","aria-label":p("previousPage",this.language),"aria-disabled":this.prevPage?void 0:"true",tabIndex:this.prevPage?void 0:-1,onClick:i=>{i.preventDefault(),this.prevPage&&this.navigateTo("previousPage")}},n("span",{class:"NavigationButton"},p("previousPage",this.language)),n("span",{class:"NavigationIcon"}))));let s=n("a",{href:this.nextPage?this.pageHref(this.endInt+1):"#","aria-disabled":this.nextPage?void 0:"true",tabIndex:this.nextPage?void 0:-1,onClick:i=>{i.preventDefault(),this.nextPage&&this.navigateTo("lastPage")}},n("span",{class:"NavigationButton"},p("lastPage",this.language)),n("span",{class:"NavigationIcon"})),o=n("div",{class:"RightItems"},n("a",{href:this.nextPage?this.pageHref(this.currentPage+1):"#",rel:"next","aria-label":p("nextPage",this.language),"aria-disabled":this.nextPage?void 0:"true",tabIndex:this.nextPage?void 0:-1,onClick:i=>{i.preventDefault(),this.nextPage&&this.navigateTo("nextPage")}},n("span",{class:"NavigationButton"},p("nextPage",this.language)),n("span",{class:"NavigationIcon"})),this.secondaryArrowsActive&&s);return c(this.userAgent)&&(o=n("div",{class:"RightItems"},n("a",{href:this.nextPage?this.pageHref(this.currentPage+1):"#",rel:"next","aria-label":p("nextPage",this.language),"aria-disabled":this.nextPage?void 0:"true",tabIndex:this.nextPage?void 0:-1,onClick:i=>{i.preventDefault(),this.nextPage&&this.navigateTo("nextPage")}},n("span",{class:"NavigationButton"},p("nextPage",this.language)),n("span",{class:"NavigationIcon"})))),n("nav",{id:"PaginationContainer",class:"PaginationContainer","aria-label":"Blog pagination",ref:i=>this.stylingContainer=i},this.arrowsActive&&e,this.numberedNavActive&&i,this.arrowsActive&&o)}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}}};u.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}#PaginationContainer{width:100%;margin:20px 0;display:inline-flex;justify-content:space-between;align-items:center}.LeftItems a:not(:first-child),.RightItems a:not(:last-child){margin:0 10px}.LeftItems a,.RightItems a{padding:0;background-color:#009993;border-color:#009993}.PaginationArea{display:inline-flex;gap:10px;list-style:none}.PaginationArea li{margin:0;padding:0}.PaginationArea li a{width:24px;height:24px;display:flex;border:0;padding:0;justify-content:center;align-items:center;background-color:transparent;color:#000;cursor:pointer;pointer-events:all}.PaginationItem.ActiveItem a{background:#009993;border-color:#009993;color:#fff}.PaginationItem.ActiveItem a[aria-disabled=true]{pointer-events:none;cursor:not-allowed}.PaginationItem a:hover,.PaginationItem a:active{background:#009993;border-color:#009993;color:#fff;opacity:0.8}a{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;text-decoration:none;width:100px;height:32px;border:1px solid #524e52;border-radius:5px;background:#524e52;color:#fff;font-size:14px;font:inherit;cursor:pointer;transition:all 0.1s linear;text-transform:uppercase;text-align:center;letter-spacing:0}a:hover,a:active{background:#004D4A;border-color:#004D4A}a[aria-disabled=true]{background-color:#ccc;border-color:#ccc;color:#fff;cursor:not-allowed}@media screen and (max-width: 720px){a{width:90px;font-size:14px}}@media screen and (max-width: 480px){a{width:70px;font-size:14px}.paginationArea{padding:5px}}@media screen and (max-width: 320px){a{width:58px;font-size:12px}.paginationArea{padding:5px;gap:5px}}@media (hover: none){.paginationItem a:hover{background:inherit;border-color:inherit;color:inherit;opacity:1}.paginationItem.activeItem a:hover{background:#009993;border-color:#009993;color:#fff}}';export{d as blog_articles_grid,u as helper_pagination}

package/dist/cjs/blog-articles-grid.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
+  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showBlogSubcategories":[516,"show-blog-subcategories"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32],"selectedCategory":[32],"categories":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/blog-articles-grid_2.cjs.entry.js

@@ -275,7 +275,7 @@ const getDevicePlatform = () => {
     return 'mtWeb';
 };
 
-const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 0.5rem;\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 40px auto 20px;\n  color: var(--emw--color-white, #FFFFFF);\n}\n.breadcrumb a {\n  color: inherit;\n}\n\n.BlogPageTitle {\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 0 auto;\n  color: var(--emw--color-primary);\n  font-size: 22px;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.BlogPageContainer {\n  background: #0A0A17;\n  padding: 20px;\n}\n\n.GridContainerWrapper {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n.BlogPage-0 .GridContainer.FeaturedPost:first-child {\n  width: 100%;\n  flex-basis: auto;\n}\n\n.GridContainer {\n  position: relative;\n  container-type: inline-size;\n  container-name: article;\n  border-radius: 15px;\n  color: #000;\n  overflow: hidden;\n}\n.GridContainer.FeaturedPost:first-child {\n  grid-column: 1/-1;\n  width: 100%;\n}\n.GridContainer .GridWrapper {\n  display: flex;\n  flex-direction: row;\n  height: 280px;\n  background: var(--emw--color-white, #FFFFFF);\n}\n.GridContainer .GridSector {\n  flex-basis: 50%;\n  position: relative;\n}\n.GridContainer .GridSector:first-of-type {\n  height: 280px;\n  display: flex;\n}\n.GridContainer .GridSector:last-of-type {\n  position: static;\n  padding: 20px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.GridContainer .VisualContent {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.GridContainer .BlogDate {\n  position: absolute;\n  bottom: 0px;\n  left: 30px;\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: #CD0B5E;\n  z-index: 1;\n  pointer-events: none;\n}\n.GridContainer .BlogTitle {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 400;\n  color: #000;\n  padding-bottom: 10px;\n}\n.GridContainer .BlogTitle .BlogCardLink {\n  display: block;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n}\n.GridContainer .BlogTitle .BlogCardLink::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n}\n.GridContainer .BlogContent {\n  margin: 0;\n  display: -webkit-box;\n  font-size: 14px;\n  line-height: 1.2em;\n  -webkit-line-clamp: 6;\n  color: #000;\n  -webkit-box-orient: vertical;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n.GridContainer .BlogLink {\n  color: #22B04E;\n  font-size: 14px;\n  position: absolute;\n  bottom: 16px;\n  padding-top: 2.5px;\n}\n\n@container article (max-width: 550px) {\n  .GridContainer .GridWrapper {\n    height: 380px;\n    flex-direction: column;\n  }\n  .GridContainer .GridWrapper .GridSector:first-of-type {\n    height: 120px;\n    flex-shrink: 0;\n    flex-basis: 150px;\n  }\n  .GridContainer .GridWrapper .GridSector:last-of-type {\n    padding: 20px 20px 40px;\n  }\n}\n.LoadingImage {\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n}\n\n.LoadingStripe {\n  border: 1px solid var(--emw--color-white, #FFFFFF);\n  height: 20%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n  margin-bottom: 5px;\n}\n\n.LoadingSmallStripe {\n  width: 40%;\n}\n\n.LoadingMediumStripe {\n  width: 70%;\n}\n\n.BlogLink.LoadingLongStripe {\n  position: static;\n  width: 100%;\n}\n\n.GridContainerWrapper.LoadingGrid .GridSector {\n  justify-content: space-around;\n}\n\n.GridContainerWrapper.LoadingGrid .LoadingImage, .GridContainerWrapper.LoadingGrid .LoadingStripe {\n  animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n  -webkit-animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n}\n\n@keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n@-webkit-keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}";
+const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 0.5rem;\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 40px auto 20px;\n  color: var(--emw--color-white, #FFFFFF);\n}\n.breadcrumb a {\n  color: inherit;\n}\n\n.BlogPageTitle {\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 0 auto;\n  color: var(--emw--color-primary);\n  font-size: 22px;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.BlogPageContainer {\n  background: #0A0A17;\n  padding: 20px;\n}\n\n.GridContainerWrapper {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n.BlogPage-0 .GridContainer.FeaturedPost:first-child {\n  width: 100%;\n  flex-basis: auto;\n}\n\n.GridContainer {\n  position: relative;\n  container-type: inline-size;\n  container-name: article;\n  border-radius: 15px;\n  color: #000;\n  overflow: hidden;\n}\n.GridContainer.FeaturedPost:first-child {\n  grid-column: 1/-1;\n  width: 100%;\n}\n.GridContainer .GridWrapper {\n  display: flex;\n  flex-direction: row;\n  height: 280px;\n  background: var(--emw--color-white, #FFFFFF);\n}\n.GridContainer .GridSector {\n  flex-basis: 50%;\n  position: relative;\n}\n.GridContainer .GridSector:first-of-type {\n  height: 280px;\n  display: flex;\n}\n.GridContainer .GridSector:last-of-type {\n  position: static;\n  padding: 20px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.GridContainer .VisualContent {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.GridContainer .BlogDate {\n  position: absolute;\n  bottom: 0px;\n  left: 30px;\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: #CD0B5E;\n  z-index: 1;\n  pointer-events: none;\n}\n.GridContainer .BlogTitle {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 400;\n  color: #000;\n  padding-bottom: 10px;\n}\n.GridContainer .BlogTitle .BlogCardLink {\n  display: block;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n}\n.GridContainer .BlogTitle .BlogCardLink::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n}\n.GridContainer .BlogContent {\n  margin: 0;\n  display: -webkit-box;\n  font-size: 14px;\n  line-height: 1.2em;\n  -webkit-line-clamp: 6;\n  color: #000;\n  -webkit-box-orient: vertical;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n.GridContainer .BlogLink {\n  color: #22B04E;\n  font-size: 14px;\n  position: absolute;\n  bottom: 16px;\n  padding-top: 2.5px;\n}\n\n@container article (max-width: 550px) {\n  .GridContainer .GridWrapper {\n    height: 380px;\n    flex-direction: column;\n  }\n  .GridContainer .GridWrapper .GridSector:first-of-type {\n    height: 120px;\n    flex-shrink: 0;\n    flex-basis: 150px;\n  }\n  .GridContainer .GridWrapper .GridSector:last-of-type {\n    padding: 20px 20px 40px;\n  }\n}\n.LoadingImage {\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n}\n\n.LoadingStripe {\n  border: 1px solid var(--emw--color-white, #FFFFFF);\n  height: 20%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n  margin-bottom: 5px;\n}\n\n.LoadingSmallStripe {\n  width: 40%;\n}\n\n.LoadingMediumStripe {\n  width: 70%;\n}\n\n.BlogLink.LoadingLongStripe {\n  position: static;\n  width: 100%;\n}\n\n.GridContainerWrapper.LoadingGrid .GridSector {\n  justify-content: space-around;\n}\n\n.GridContainerWrapper.LoadingGrid .LoadingImage, .GridContainerWrapper.LoadingGrid .LoadingStripe {\n  animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n  -webkit-animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n}\n\n@keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n@-webkit-keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n.BlogCategoriesWrapper {\n  margin-bottom: 24px;\n}\n\n.FilterLabel {\n  margin-bottom: 12px;\n  color: var(--emw--color-white, #fff);\n  font-weight: 600;\n}\n\n.CategoryButtons {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n}\n\n.CategoryButton {\n  padding: 10px 20px;\n  border-radius: 999px;\n  border: 1px solid currentColor;\n  background: transparent;\n  color: var(--emw--color-white, #fff);\n  cursor: pointer;\n  transition: all 0.2s ease;\n}\n\n.CategoryButton.active {\n  background: var(--emw--casino-color-primary, var(--emw--color-primary, #22B04E));\n  color: var(--emw--color-background, #fff);\n}";
 const BlogArticlesGridStyle0 = blogArticlesGridCss;
 
 const BlogArticlesGrid = class {
@@ -351,6 +351,7 @@ const BlogArticlesGrid = class {
         this.clientStyling = '';
         this.clientStylingUrl = '';
         this.showPublishingDate = true;
+        this.showBlogSubcategories = false;
         this.showImage = true;
         this.showTitle = true;
         this.showPageTitle = false;
@@ -384,6 +385,8 @@ const BlogArticlesGrid = class {
         this.allBlogResponse = undefined;
         this.totalBlogs = 0;
         this.customTranslations = {};
+        this.selectedCategory = 'all';
+        this.categories = [];
     }
     getArticleId(event, post) {
         var _a;
@@ -485,6 +488,14 @@ const BlogArticlesGrid = class {
     }
     async fetchBlogPosts(page, allPosts = false) {
         const url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);
+        if (this.showBlogSubcategories &&
+            this.selectedCategory &&
+            this.selectedCategory !== 'all') {
+            const category = this.categories.find(cat => cat.id == this.selectedCategory);
+            if (category) {
+                url.searchParams.append('category', category.name);
+            }
+        }
         url.searchParams.append('per_page', allPosts ? '300' : this.blogsLimit);
         url.searchParams.append('page', `${page ? page : this.currentPage + 1}`);
         url.searchParams.append('env', this.cmsEnv);
@@ -518,6 +529,26 @@ const BlogArticlesGrid = class {
             return {};
         });
     }
+    async fetchCategories() {
+        try {
+            const url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts/category`);
+            const response = await fetch(url.href);
+            if (!response.ok) {
+                throw new Error('Failed to fetch categories');
+            }
+            const categories = await response.json();
+            this.categories = [
+                {
+                    id: 'all',
+                    name: 'All',
+                },
+                ...categories,
+            ];
+        }
+        catch (error) {
+            console.error('Error fetching categories', error);
+        }
+    }
     async getBlogArticleGrid(forceFetch = false, page) {
         var _a, _b, _c, _d, _e, _f, _g;
         this.isLoading = true;
@@ -567,7 +598,9 @@ const BlogArticlesGrid = class {
             console.log('Error', err);
         }
     }
-    componentWillLoad() {
+    async componentWillLoad() {
+        if (this.showBlogSubcategories)
+            await this.fetchCategories();
         if (this.cmsEndpoint && this.language && this.blogsLimit) {
             if (this.page) {
                 this.currentPage = this.currentPage + +this.page - 1;
@@ -579,6 +612,12 @@ const BlogArticlesGrid = class {
         }
         return this.loadTranslations();
     }
+    async handleCategoryChange(categoryId) {
+        this.selectedCategory = categoryId;
+        this.currentPage = 0;
+        this.paginationBlogList = Object.assign(Object.assign({}, this.paginationBlogList), { offset: 0 });
+        await this.getBlogArticleGrid(true, 1);
+    }
     handleClientStyling() {
         if (window.emMessageBus !== undefined) {
             this.stylingSubscription = setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription, true);
@@ -628,7 +667,13 @@ const BlogArticlesGrid = class {
         }
         const showPagination = Boolean(this.paginationActive) && this.totalBlogs > +this.blogsLimit;
         const paginationClientStyling = !this.mbSource ? (this.clientStyling || this.paginationDefaultStyling) : undefined;
-        return (index.h("div", { ref: el => this.stylingContainer = el }, this.showBreadcrumb && (index.h("nav", { class: "breadcrumb", "aria-label": "Breadcrumb" }, index.h("a", { href: `/${encodeURIComponent(this.language)}` }, translate$1('home', this.language, this.customTranslations)), index.h("span", { "aria-hidden": "true" }, "\u203A"), index.h("span", { "aria-current": "page" }, translate$1('blog', this.language, this.customTranslations)))), this.showPageTitle && index.h("h1", { class: "BlogPageTitle" }, translate$1('blogPageTitle', this.language, this.customTranslations)), index.h("div", { class: "BlogPageContainer" }, index.h("div", { class: "BlogGridPaginationWrapper" }, showPagination && index.h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: parseInt(this.blogsLimit, 10), total: this.totalBlogs, language: this.language, "mb-source": this.mbSource, "client-styling": paginationClientStyling, "client-styling-url": this.clientStylingUrl, "arrows-active": this.arrowsActive, "secondary-arrows-active": this.secondaryArrowsActive, "numbered-nav-active": this.numberedNavActive, "page-query-param": this.pageQueryParam, page: +this.page || 1 })), (!this.isLoading) &&
+        return (index.h("div", { ref: el => this.stylingContainer = el }, this.showBreadcrumb && (index.h("nav", { class: "breadcrumb", "aria-label": "Breadcrumb" }, index.h("a", { href: `/${encodeURIComponent(this.language)}` }, translate$1('home', this.language, this.customTranslations)), index.h("span", { "aria-hidden": "true" }, "\u203A"), index.h("span", { "aria-current": "page" }, translate$1('blog', this.language, this.customTranslations)))), this.showPageTitle && index.h("h1", { class: "BlogPageTitle" }, translate$1('blogPageTitle', this.language, this.customTranslations)), index.h("div", { class: "BlogPageContainer" }, this.showBlogSubcategories &&
+            index.h("div", { class: "BlogCategoriesSliderWrapper" }, index.h("div", { class: "CarouselWrapper" }, index.h("div", { class: "CarouselContainer" }, index.h("div", { class: "BlogCategoriesWrapper" }, index.h("div", { class: "CategoryButtons" }, this.categories.map(category => (index.h("button", { key: category.id, class: {
+                    CategoryButton: true,
+                    active: this.selectedCategory === category.id,
+                }, onClick: () => {
+                    this.handleCategoryChange(category.id);
+                } }, category.name)))))))), index.h("div", { class: "BlogGridPaginationWrapper" }, showPagination && index.h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: parseInt(this.blogsLimit, 10), total: this.totalBlogs, language: this.language, "mb-source": this.mbSource, "client-styling": paginationClientStyling, "client-styling-url": this.clientStylingUrl, "arrows-active": this.arrowsActive, "secondary-arrows-active": this.secondaryArrowsActive, "numbered-nav-active": this.numberedNavActive, "page-query-param": this.pageQueryParam, page: +this.page || 1 })), (!this.isLoading) &&
             index.h("div", { class: `GridContainerWrapper BlogPage-${this.currentPage} ${this.device}` }, this.displayedBlogResponse && this.displayedBlogResponse.items.map((data) => {
                 var _a, _b;
                 return index.h("div", { key: data.postID, class: data.isFeaturedPost ? 'GridContainer FeaturedPost' : 'GridContainer' }, index.h("div", { class: "GridWrapper" }, index.h("div", { class: "GridSector" }, this.showPublishingDate &&

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
+  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showBlogSubcategories":[516,"show-blog-subcategories"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32],"selectedCategory":[32],"categories":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/blog-articles-grid/blog-articles-grid.css

@@ -203,4 +203,34 @@
   100% {
     opacity: 0.5;
   }
+}
+.BlogCategoriesWrapper {
+  margin-bottom: 24px;
+}
+
+.FilterLabel {
+  margin-bottom: 12px;
+  color: var(--emw--color-white, #fff);
+  font-weight: 600;
+}
+
+.CategoryButtons {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+}
+
+.CategoryButton {
+  padding: 10px 20px;
+  border-radius: 999px;
+  border: 1px solid currentColor;
+  background: transparent;
+  color: var(--emw--color-white, #fff);
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.CategoryButton.active {
+  background: var(--emw--casino-color-primary, var(--emw--color-primary, #22B04E));
+  color: var(--emw--color-background, #fff);
 }

package/dist/collection/components/blog-articles-grid/blog-articles-grid.js

@@ -74,6 +74,7 @@ export class BlogArticlesGrid {
         this.clientStyling = '';
         this.clientStylingUrl = '';
         this.showPublishingDate = true;
+        this.showBlogSubcategories = false;
         this.showImage = true;
         this.showTitle = true;
         this.showPageTitle = false;
@@ -107,6 +108,8 @@ export class BlogArticlesGrid {
         this.allBlogResponse = undefined;
         this.totalBlogs = 0;
         this.customTranslations = {};
+        this.selectedCategory = 'all';
+        this.categories = [];
     }
     getArticleId(event, post) {
         var _a;
@@ -208,6 +211,14 @@ export class BlogArticlesGrid {
     }
     async fetchBlogPosts(page, allPosts = false) {
         const url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);
+        if (this.showBlogSubcategories &&
+            this.selectedCategory &&
+            this.selectedCategory !== 'all') {
+            const category = this.categories.find(cat => cat.id == this.selectedCategory);
+            if (category) {
+                url.searchParams.append('category', category.name);
+            }
+        }
         url.searchParams.append('per_page', allPosts ? '300' : this.blogsLimit);
         url.searchParams.append('page', `${page ? page : this.currentPage + 1}`);
         url.searchParams.append('env', this.cmsEnv);
@@ -241,6 +252,26 @@ export class BlogArticlesGrid {
             return {};
         });
     }
+    async fetchCategories() {
+        try {
+            const url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts/category`);
+            const response = await fetch(url.href);
+            if (!response.ok) {
+                throw new Error('Failed to fetch categories');
+            }
+            const categories = await response.json();
+            this.categories = [
+                {
+                    id: 'all',
+                    name: 'All',
+                },
+                ...categories,
+            ];
+        }
+        catch (error) {
+            console.error('Error fetching categories', error);
+        }
+    }
     async getBlogArticleGrid(forceFetch = false, page) {
         var _a, _b, _c, _d, _e, _f, _g;
         this.isLoading = true;
@@ -290,7 +321,9 @@ export class BlogArticlesGrid {
             console.log('Error', err);
         }
     }
-    componentWillLoad() {
+    async componentWillLoad() {
+        if (this.showBlogSubcategories)
+            await this.fetchCategories();
         if (this.cmsEndpoint && this.language && this.blogsLimit) {
             if (this.page) {
                 this.currentPage = this.currentPage + +this.page - 1;
@@ -302,6 +335,12 @@ export class BlogArticlesGrid {
         }
         return this.loadTranslations();
     }
+    async handleCategoryChange(categoryId) {
+        this.selectedCategory = categoryId;
+        this.currentPage = 0;
+        this.paginationBlogList = Object.assign(Object.assign({}, this.paginationBlogList), { offset: 0 });
+        await this.getBlogArticleGrid(true, 1);
+    }
     handleClientStyling() {
         if (window.emMessageBus !== undefined) {
             this.stylingSubscription = setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription, true);
@@ -351,7 +390,13 @@ export class BlogArticlesGrid {
         }
         const showPagination = Boolean(this.paginationActive) && this.totalBlogs > +this.blogsLimit;
         const paginationClientStyling = !this.mbSource ? (this.clientStyling || this.paginationDefaultStyling) : undefined;
-        return (h("div", { ref: el => this.stylingContainer = el }, this.showBreadcrumb && (h("nav", { class: "breadcrumb", "aria-label": "Breadcrumb" }, h("a", { href: `/${encodeURIComponent(this.language)}` }, translate('home', this.language, this.customTranslations)), h("span", { "aria-hidden": "true" }, "\u203A"), h("span", { "aria-current": "page" }, translate('blog', this.language, this.customTranslations)))), this.showPageTitle && h("h1", { class: "BlogPageTitle" }, translate('blogPageTitle', this.language, this.customTranslations)), h("div", { class: "BlogPageContainer" }, h("div", { class: "BlogGridPaginationWrapper" }, showPagination && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: parseInt(this.blogsLimit, 10), total: this.totalBlogs, language: this.language, "mb-source": this.mbSource, "client-styling": paginationClientStyling, "client-styling-url": this.clientStylingUrl, "arrows-active": this.arrowsActive, "secondary-arrows-active": this.secondaryArrowsActive, "numbered-nav-active": this.numberedNavActive, "page-query-param": this.pageQueryParam, page: +this.page || 1 })), (!this.isLoading) &&
+        return (h("div", { ref: el => this.stylingContainer = el }, this.showBreadcrumb && (h("nav", { class: "breadcrumb", "aria-label": "Breadcrumb" }, h("a", { href: `/${encodeURIComponent(this.language)}` }, translate('home', this.language, this.customTranslations)), h("span", { "aria-hidden": "true" }, "\u203A"), h("span", { "aria-current": "page" }, translate('blog', this.language, this.customTranslations)))), this.showPageTitle && h("h1", { class: "BlogPageTitle" }, translate('blogPageTitle', this.language, this.customTranslations)), h("div", { class: "BlogPageContainer" }, this.showBlogSubcategories &&
+            h("div", { class: "BlogCategoriesSliderWrapper" }, h("div", { class: "CarouselWrapper" }, h("div", { class: "CarouselContainer" }, h("div", { class: "BlogCategoriesWrapper" }, h("div", { class: "CategoryButtons" }, this.categories.map(category => (h("button", { key: category.id, class: {
+                    CategoryButton: true,
+                    active: this.selectedCategory === category.id,
+                }, onClick: () => {
+                    this.handleCategoryChange(category.id);
+                } }, category.name)))))))), h("div", { class: "BlogGridPaginationWrapper" }, showPagination && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: parseInt(this.blogsLimit, 10), total: this.totalBlogs, language: this.language, "mb-source": this.mbSource, "client-styling": paginationClientStyling, "client-styling-url": this.clientStylingUrl, "arrows-active": this.arrowsActive, "secondary-arrows-active": this.secondaryArrowsActive, "numbered-nav-active": this.numberedNavActive, "page-query-param": this.pageQueryParam, page: +this.page || 1 })), (!this.isLoading) &&
             h("div", { class: `GridContainerWrapper BlogPage-${this.currentPage} ${this.device}` }, this.displayedBlogResponse && this.displayedBlogResponse.items.map((data) => {
                 var _a, _b;
                 return h("div", { key: data.postID, class: data.isFeaturedPost ? 'GridContainer FeaturedPost' : 'GridContainer' }, h("div", { class: "GridWrapper" }, h("div", { class: "GridSector" }, this.showPublishingDate &&
@@ -536,6 +581,24 @@ export class BlogArticlesGrid {
                 "reflect": true,
                 "defaultValue": "true"
             },
+            "showBlogSubcategories": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Property used to display the subcategories filters"
+                },
+                "attribute": "show-blog-subcategories",
+                "reflect": true,
+                "defaultValue": "false"
+            },
             "showImage": {
                 "type": "boolean",
                 "mutable": false,
@@ -872,7 +935,9 @@ export class BlogArticlesGrid {
             "paginationBlogResponse": {},
             "allBlogResponse": {},
             "totalBlogs": {},
-            "customTranslations": {}
+            "customTranslations": {},
+            "selectedCategory": {},
+            "categories": {}
         };
     }
     static get events() {

package/dist/esm/blog-articles-grid.js

@@ -16,5 +16,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
+  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showBlogSubcategories":[516,"show-blog-subcategories"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32],"selectedCategory":[32],"categories":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
 });

package/dist/esm/blog-articles-grid_2.entry.js

@@ -271,7 +271,7 @@ const getDevicePlatform = () => {
     return 'mtWeb';
 };
 
-const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 0.5rem;\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 40px auto 20px;\n  color: var(--emw--color-white, #FFFFFF);\n}\n.breadcrumb a {\n  color: inherit;\n}\n\n.BlogPageTitle {\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 0 auto;\n  color: var(--emw--color-primary);\n  font-size: 22px;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.BlogPageContainer {\n  background: #0A0A17;\n  padding: 20px;\n}\n\n.GridContainerWrapper {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n.BlogPage-0 .GridContainer.FeaturedPost:first-child {\n  width: 100%;\n  flex-basis: auto;\n}\n\n.GridContainer {\n  position: relative;\n  container-type: inline-size;\n  container-name: article;\n  border-radius: 15px;\n  color: #000;\n  overflow: hidden;\n}\n.GridContainer.FeaturedPost:first-child {\n  grid-column: 1/-1;\n  width: 100%;\n}\n.GridContainer .GridWrapper {\n  display: flex;\n  flex-direction: row;\n  height: 280px;\n  background: var(--emw--color-white, #FFFFFF);\n}\n.GridContainer .GridSector {\n  flex-basis: 50%;\n  position: relative;\n}\n.GridContainer .GridSector:first-of-type {\n  height: 280px;\n  display: flex;\n}\n.GridContainer .GridSector:last-of-type {\n  position: static;\n  padding: 20px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.GridContainer .VisualContent {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.GridContainer .BlogDate {\n  position: absolute;\n  bottom: 0px;\n  left: 30px;\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: #CD0B5E;\n  z-index: 1;\n  pointer-events: none;\n}\n.GridContainer .BlogTitle {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 400;\n  color: #000;\n  padding-bottom: 10px;\n}\n.GridContainer .BlogTitle .BlogCardLink {\n  display: block;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n}\n.GridContainer .BlogTitle .BlogCardLink::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n}\n.GridContainer .BlogContent {\n  margin: 0;\n  display: -webkit-box;\n  font-size: 14px;\n  line-height: 1.2em;\n  -webkit-line-clamp: 6;\n  color: #000;\n  -webkit-box-orient: vertical;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n.GridContainer .BlogLink {\n  color: #22B04E;\n  font-size: 14px;\n  position: absolute;\n  bottom: 16px;\n  padding-top: 2.5px;\n}\n\n@container article (max-width: 550px) {\n  .GridContainer .GridWrapper {\n    height: 380px;\n    flex-direction: column;\n  }\n  .GridContainer .GridWrapper .GridSector:first-of-type {\n    height: 120px;\n    flex-shrink: 0;\n    flex-basis: 150px;\n  }\n  .GridContainer .GridWrapper .GridSector:last-of-type {\n    padding: 20px 20px 40px;\n  }\n}\n.LoadingImage {\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n}\n\n.LoadingStripe {\n  border: 1px solid var(--emw--color-white, #FFFFFF);\n  height: 20%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n  margin-bottom: 5px;\n}\n\n.LoadingSmallStripe {\n  width: 40%;\n}\n\n.LoadingMediumStripe {\n  width: 70%;\n}\n\n.BlogLink.LoadingLongStripe {\n  position: static;\n  width: 100%;\n}\n\n.GridContainerWrapper.LoadingGrid .GridSector {\n  justify-content: space-around;\n}\n\n.GridContainerWrapper.LoadingGrid .LoadingImage, .GridContainerWrapper.LoadingGrid .LoadingStripe {\n  animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n  -webkit-animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n}\n\n@keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n@-webkit-keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}";
+const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.breadcrumb {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 0.5rem;\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 40px auto 20px;\n  color: var(--emw--color-white, #FFFFFF);\n}\n.breadcrumb a {\n  color: inherit;\n}\n\n.BlogPageTitle {\n  max-width: 1300px;\n  padding: 0 20px;\n  margin: 0 auto;\n  color: var(--emw--color-primary);\n  font-size: 22px;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.BlogPageContainer {\n  background: #0A0A17;\n  padding: 20px;\n}\n\n.GridContainerWrapper {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n.BlogPage-0 .GridContainer.FeaturedPost:first-child {\n  width: 100%;\n  flex-basis: auto;\n}\n\n.GridContainer {\n  position: relative;\n  container-type: inline-size;\n  container-name: article;\n  border-radius: 15px;\n  color: #000;\n  overflow: hidden;\n}\n.GridContainer.FeaturedPost:first-child {\n  grid-column: 1/-1;\n  width: 100%;\n}\n.GridContainer .GridWrapper {\n  display: flex;\n  flex-direction: row;\n  height: 280px;\n  background: var(--emw--color-white, #FFFFFF);\n}\n.GridContainer .GridSector {\n  flex-basis: 50%;\n  position: relative;\n}\n.GridContainer .GridSector:first-of-type {\n  height: 280px;\n  display: flex;\n}\n.GridContainer .GridSector:last-of-type {\n  position: static;\n  padding: 20px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.GridContainer .VisualContent {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.GridContainer .BlogDate {\n  position: absolute;\n  bottom: 0px;\n  left: 30px;\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: var(--emw--color-white, #FFFFFF);\n  background-color: #CD0B5E;\n  z-index: 1;\n  pointer-events: none;\n}\n.GridContainer .BlogTitle {\n  margin: 0;\n  font-size: 24px;\n  font-weight: 400;\n  color: #000;\n  padding-bottom: 10px;\n}\n.GridContainer .BlogTitle .BlogCardLink {\n  display: block;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n}\n.GridContainer .BlogTitle .BlogCardLink::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n}\n.GridContainer .BlogContent {\n  margin: 0;\n  display: -webkit-box;\n  font-size: 14px;\n  line-height: 1.2em;\n  -webkit-line-clamp: 6;\n  color: #000;\n  -webkit-box-orient: vertical;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  overflow: hidden;\n}\n.GridContainer .BlogLink {\n  color: #22B04E;\n  font-size: 14px;\n  position: absolute;\n  bottom: 16px;\n  padding-top: 2.5px;\n}\n\n@container article (max-width: 550px) {\n  .GridContainer .GridWrapper {\n    height: 380px;\n    flex-direction: column;\n  }\n  .GridContainer .GridWrapper .GridSector:first-of-type {\n    height: 120px;\n    flex-shrink: 0;\n    flex-basis: 150px;\n  }\n  .GridContainer .GridWrapper .GridSector:last-of-type {\n    padding: 20px 20px 40px;\n  }\n}\n.LoadingImage {\n  width: 100%;\n  height: 100%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n}\n\n.LoadingStripe {\n  border: 1px solid var(--emw--color-white, #FFFFFF);\n  height: 20%;\n  background-color: var(--emw--color-gray-100, #E6E6E6);\n  margin-bottom: 5px;\n}\n\n.LoadingSmallStripe {\n  width: 40%;\n}\n\n.LoadingMediumStripe {\n  width: 70%;\n}\n\n.BlogLink.LoadingLongStripe {\n  position: static;\n  width: 100%;\n}\n\n.GridContainerWrapper.LoadingGrid .GridSector {\n  justify-content: space-around;\n}\n\n.GridContainerWrapper.LoadingGrid .LoadingImage, .GridContainerWrapper.LoadingGrid .LoadingStripe {\n  animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n  -webkit-animation: pulsatingLoader 2s ease-in-out 0s infinite reverse;\n}\n\n@keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n@-webkit-keyframes pulsatingLoader {\n  0% {\n    opacity: 0.5;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.5;\n  }\n}\n.BlogCategoriesWrapper {\n  margin-bottom: 24px;\n}\n\n.FilterLabel {\n  margin-bottom: 12px;\n  color: var(--emw--color-white, #fff);\n  font-weight: 600;\n}\n\n.CategoryButtons {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n}\n\n.CategoryButton {\n  padding: 10px 20px;\n  border-radius: 999px;\n  border: 1px solid currentColor;\n  background: transparent;\n  color: var(--emw--color-white, #fff);\n  cursor: pointer;\n  transition: all 0.2s ease;\n}\n\n.CategoryButton.active {\n  background: var(--emw--casino-color-primary, var(--emw--color-primary, #22B04E));\n  color: var(--emw--color-background, #fff);\n}";
 const BlogArticlesGridStyle0 = blogArticlesGridCss;
 
 const BlogArticlesGrid = class {
@@ -347,6 +347,7 @@ const BlogArticlesGrid = class {
         this.clientStyling = '';
         this.clientStylingUrl = '';
         this.showPublishingDate = true;
+        this.showBlogSubcategories = false;
         this.showImage = true;
         this.showTitle = true;
         this.showPageTitle = false;
@@ -380,6 +381,8 @@ const BlogArticlesGrid = class {
         this.allBlogResponse = undefined;
         this.totalBlogs = 0;
         this.customTranslations = {};
+        this.selectedCategory = 'all';
+        this.categories = [];
     }
     getArticleId(event, post) {
         var _a;
@@ -481,6 +484,14 @@ const BlogArticlesGrid = class {
     }
     async fetchBlogPosts(page, allPosts = false) {
         const url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts`);
+        if (this.showBlogSubcategories &&
+            this.selectedCategory &&
+            this.selectedCategory !== 'all') {
+            const category = this.categories.find(cat => cat.id == this.selectedCategory);
+            if (category) {
+                url.searchParams.append('category', category.name);
+            }
+        }
         url.searchParams.append('per_page', allPosts ? '300' : this.blogsLimit);
         url.searchParams.append('page', `${page ? page : this.currentPage + 1}`);
         url.searchParams.append('env', this.cmsEnv);
@@ -514,6 +525,26 @@ const BlogArticlesGrid = class {
             return {};
         });
     }
+    async fetchCategories() {
+        try {
+            const url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts/category`);
+            const response = await fetch(url.href);
+            if (!response.ok) {
+                throw new Error('Failed to fetch categories');
+            }
+            const categories = await response.json();
+            this.categories = [
+                {
+                    id: 'all',
+                    name: 'All',
+                },
+                ...categories,
+            ];
+        }
+        catch (error) {
+            console.error('Error fetching categories', error);
+        }
+    }
     async getBlogArticleGrid(forceFetch = false, page) {
         var _a, _b, _c, _d, _e, _f, _g;
         this.isLoading = true;
@@ -563,7 +594,9 @@ const BlogArticlesGrid = class {
             console.log('Error', err);
         }
     }
-    componentWillLoad() {
+    async componentWillLoad() {
+        if (this.showBlogSubcategories)
+            await this.fetchCategories();
         if (this.cmsEndpoint && this.language && this.blogsLimit) {
             if (this.page) {
                 this.currentPage = this.currentPage + +this.page - 1;
@@ -575,6 +608,12 @@ const BlogArticlesGrid = class {
         }
         return this.loadTranslations();
     }
+    async handleCategoryChange(categoryId) {
+        this.selectedCategory = categoryId;
+        this.currentPage = 0;
+        this.paginationBlogList = Object.assign(Object.assign({}, this.paginationBlogList), { offset: 0 });
+        await this.getBlogArticleGrid(true, 1);
+    }
     handleClientStyling() {
         if (window.emMessageBus !== undefined) {
             this.stylingSubscription = setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription, true);
@@ -624,7 +663,13 @@ const BlogArticlesGrid = class {
         }
         const showPagination = Boolean(this.paginationActive) && this.totalBlogs > +this.blogsLimit;
         const paginationClientStyling = !this.mbSource ? (this.clientStyling || this.paginationDefaultStyling) : undefined;
-        return (h("div", { ref: el => this.stylingContainer = el }, this.showBreadcrumb && (h("nav", { class: "breadcrumb", "aria-label": "Breadcrumb" }, h("a", { href: `/${encodeURIComponent(this.language)}` }, translate$1('home', this.language, this.customTranslations)), h("span", { "aria-hidden": "true" }, "\u203A"), h("span", { "aria-current": "page" }, translate$1('blog', this.language, this.customTranslations)))), this.showPageTitle && h("h1", { class: "BlogPageTitle" }, translate$1('blogPageTitle', this.language, this.customTranslations)), h("div", { class: "BlogPageContainer" }, h("div", { class: "BlogGridPaginationWrapper" }, showPagination && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: parseInt(this.blogsLimit, 10), total: this.totalBlogs, language: this.language, "mb-source": this.mbSource, "client-styling": paginationClientStyling, "client-styling-url": this.clientStylingUrl, "arrows-active": this.arrowsActive, "secondary-arrows-active": this.secondaryArrowsActive, "numbered-nav-active": this.numberedNavActive, "page-query-param": this.pageQueryParam, page: +this.page || 1 })), (!this.isLoading) &&
+        return (h("div", { ref: el => this.stylingContainer = el }, this.showBreadcrumb && (h("nav", { class: "breadcrumb", "aria-label": "Breadcrumb" }, h("a", { href: `/${encodeURIComponent(this.language)}` }, translate$1('home', this.language, this.customTranslations)), h("span", { "aria-hidden": "true" }, "\u203A"), h("span", { "aria-current": "page" }, translate$1('blog', this.language, this.customTranslations)))), this.showPageTitle && h("h1", { class: "BlogPageTitle" }, translate$1('blogPageTitle', this.language, this.customTranslations)), h("div", { class: "BlogPageContainer" }, this.showBlogSubcategories &&
+            h("div", { class: "BlogCategoriesSliderWrapper" }, h("div", { class: "CarouselWrapper" }, h("div", { class: "CarouselContainer" }, h("div", { class: "BlogCategoriesWrapper" }, h("div", { class: "CategoryButtons" }, this.categories.map(category => (h("button", { key: category.id, class: {
+                    CategoryButton: true,
+                    active: this.selectedCategory === category.id,
+                }, onClick: () => {
+                    this.handleCategoryChange(category.id);
+                } }, category.name)))))))), h("div", { class: "BlogGridPaginationWrapper" }, showPagination && h("helper-pagination", { "next-page": this.nextPage, "prev-page": this.previousPage, offset: this.paginationBlogList.offset, limit: parseInt(this.blogsLimit, 10), total: this.totalBlogs, language: this.language, "mb-source": this.mbSource, "client-styling": paginationClientStyling, "client-styling-url": this.clientStylingUrl, "arrows-active": this.arrowsActive, "secondary-arrows-active": this.secondaryArrowsActive, "numbered-nav-active": this.numberedNavActive, "page-query-param": this.pageQueryParam, page: +this.page || 1 })), (!this.isLoading) &&
             h("div", { class: `GridContainerWrapper BlogPage-${this.currentPage} ${this.device}` }, this.displayedBlogResponse && this.displayedBlogResponse.items.map((data) => {
                 var _a, _b;
                 return h("div", { key: data.postID, class: data.isFeaturedPost ? 'GridContainer FeaturedPost' : 'GridContainer' }, h("div", { class: "GridWrapper" }, h("div", { class: "GridSector" }, this.showPublishingDate &&

package/dist/esm/loader.js

@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
+  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"translationUrl":[513,"translation-url"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showBlogSubcategories":[516,"show-blog-subcategories"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showPageTitle":[516,"show-page-title"],"showBreadcrumb":[516,"show-breadcrumb"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"hideError":[516,"hide-error"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[513,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"intlDateTimeFormat":[513,"intl-date-time-format"],"page":[513],"pageQueryParam":[1,"page-query-param"],"eventId":[513,"event-id"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32],"displayedBlogResponse":[32],"paginationBlogResponse":[32],"allBlogResponse":[32],"totalBlogs":[32],"customTranslations":[32],"selectedCategory":[32],"categories":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]],{"page":["watchEndpoint"],"hasErrors":["watchEndpoint"],"cmsEndpoint":["watchEndpoint"],"language":["watchEndpoint"],"cmsEnv":["watchEndpoint"],"userRoles":["watchEndpoint"],"blogsLimit":["watchEndpoint"],"eventId":["watchEndpoint"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["loadTranslations"]}],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"mbSource":[1,"mb-source"],"clientStyling":[1537,"client-styling"],"clientStylingUrl":[1537,"client-styling-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"pageQueryParam":[1,"page-query-param"],"page":[2],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/types/components/blog-articles-grid/blog-articles-grid.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { type Device } from "../../../../../../libs/common/src/device/index";
 import "../../../../../../dist/packages/stencil/helper-pagination/dist/types/index";
-import type { BlogPost, BlogPostResponse } from '../../utils/type';
+import type { BlogPost, BlogPostResponse, BlogCategory } from '../../utils/type';
 export declare class BlogArticlesGrid {
     /**
      * Endpoint URL for the source of data
@@ -39,6 +39,10 @@ export declare class BlogArticlesGrid {
      * Property used to display the publishing date
      */
     showPublishingDate: boolean;
+    /**
+     * Property used to display the subcategories filters
+     */
+    showBlogSubcategories: boolean;
     /**
     * Property used to display the image
     */
@@ -125,6 +129,8 @@ export declare class BlogArticlesGrid {
     private customTranslations;
     lastPage: number;
     private isInitialized;
+    selectedCategory: string;
+    categories: BlogCategory[];
     handleBannerReady(): void;
     watchEndpoint(newValue: string, oldValue: string): void;
     handleClientStylingChange(newValue: string, oldValue: string): void;
@@ -138,8 +144,10 @@ export declare class BlogArticlesGrid {
     findLatestFeatured(blogItems: BlogPost[]): BlogPost;
     moveLatestFeatureToStart(blogItems: BlogPost[], latestFeatured: BlogPost | null): BlogPost[];
     fetchBlogPosts(page?: number, allPosts?: boolean): Promise<BlogPostResponse>;
+    fetchCategories(): Promise<void>;
     getBlogArticleGrid(forceFetch?: boolean, page?: number): Promise<void>;
     componentWillLoad(): Promise<void>;
+    handleCategoryChange(categoryId: string): Promise<void>;
     handleClientStyling(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;

package/dist/types/components.d.ts

@@ -72,6 +72,10 @@ export namespace Components {
           * Customize pagination: Activate pagination secondary arrows
          */
         "secondaryArrowsActive": boolean;
+        /**
+          * Property used to display the subcategories filters
+         */
+        "showBlogSubcategories": boolean;
         /**
           * Display breadcrumb navigation
          */
@@ -208,6 +212,10 @@ declare namespace LocalJSX {
           * Customize pagination: Activate pagination secondary arrows
          */
         "secondaryArrowsActive"?: boolean;
+        /**
+          * Property used to display the subcategories filters
+         */
+        "showBlogSubcategories"?: boolean;
         /**
           * Display breadcrumb navigation
          */

package/dist/types/utils/type.d.ts

@@ -40,3 +40,8 @@ export type BlogPost = {
         };
     };
 };
+export type BlogCategory = {
+    id: string;
+    name: string;
+    count: number;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/blog-articles-grid",
-  "version": "1.98.30",
+  "version": "1.99.0",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",