@everymatrix/blog-articles-grid - npm Package Compare versions

Comparing version 1.13.15 to 1.13.16

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

@@ -1,1 +0,1 @@
-import{p as e,b as t}from"./p-ed2f13d0.js";(()=>{const t=import.meta.url,n={};return""!==t&&(n.resourcesUrl=new URL(".",t).href),e(n)})().then((e=>t([["p-341b0ae5",[[1,"blog-articles-grid",{cmsEndpoint:[1,"cms-endpoint"],language:[1],handleClick:[1,"handle-click"],clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],showPublishingDate:[4,"show-publishing-date"],showImage:[4,"show-image"],showTitle:[4,"show-title"],showContent:[4,"show-content"],showButton:[4,"show-button"],usePostmessage:[4,"use-postmessage"],postMessageEvent:[1,"post-message-event"],blogsLimit:[514,"blogs-limit"],paginationActive:[516,"pagination-active"],arrowsActive:[516,"arrows-active"],secondaryArrowsActive:[516,"secondary-arrows-active"],numberedNavActive:[516,"numbered-nav-active"],paginationBlogList:[32],currentPage:[32],hasErrors:[32],limitStylingAppends:[32],isLoading:[32],bannerMatrixReady:[32],nextPage:[32],previousPage:[32],device:[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{nextPage:[1537,"next-page"],prevPage:[1537,"prev-page"],offset:[1538],limit:[1538],total:[1538],language:[1537],clientStyling:[1537,"client-styling"],clientStylingUrlContent:[1537,"client-styling-url-content"],arrowsActive:[1540,"arrows-active"],secondaryArrowsActive:[1540,"secondary-arrows-active"],numberedNavActive:[1540,"numbered-nav-active"],offsetInt:[32],lastPage:[32],previousPage:[32],limitInt:[32],totalInt:[32],pagesArray:[32],endInt:[32],limitStylingAppends:[32]}]]]],e)));
+import{p as e,b as t}from"./p-ed2f13d0.js";(()=>{const t=import.meta.url,n={};return""!==t&&(n.resourcesUrl=new URL(".",t).href),e(n)})().then((e=>t([["p-ce775053",[[1,"blog-articles-grid",{cmsEndpoint:[513,"cms-endpoint"],language:[513],handleClick:[513,"handle-click"],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],showPublishingDate:[516,"show-publishing-date"],showImage:[516,"show-image"],showTitle:[516,"show-title"],showContent:[516,"show-content"],showButton:[516,"show-button"],usePostmessage:[516,"use-postmessage"],postMessageEvent:[513,"post-message-event"],blogsLimit:[514,"blogs-limit"],paginationActive:[516,"pagination-active"],arrowsActive:[516,"arrows-active"],secondaryArrowsActive:[516,"secondary-arrows-active"],numberedNavActive:[516,"numbered-nav-active"],userRoles:[513,"user-roles"],cmsStage:[513,"cms-stage"],paginationBlogList:[32],currentPage:[32],hasErrors:[32],limitStylingAppends:[32],isLoading:[32],bannerMatrixReady:[32],nextPage:[32],previousPage:[32],device:[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{firstPage:[1540,"first-page"],previousPage:[1540,"previous-page"],offset:[1538],limit:[1538],total:[1538],language:[1537],clientStyling:[1537,"client-styling"],clientStylingUrlContent:[1537,"client-styling-url-content"],arrowsActive:[1540,"arrows-active"],secondaryArrowsActive:[1540,"secondary-arrows-active"],numberedNavActive:[1540,"numbered-nav-active"],offsetInt:[32],lastPage:[32],limitInt:[32],totalInt:[32],pagesArray:[32],endInt:[32],limitStylingAppends:[32]}]]]],e)));

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

@@ -27,3 +27,3 @@ 'use strict';
   hu: {
-    error: 'Error',
+    error: 'خطأ',
     readmore: 'Read more',
@@ -54,2 +54,29 @@ }
 }
+const getDevice = () => {
+  let userAgent = window.navigator.userAgent;
+  if (userAgent.toLowerCase().match(/android/i)) {
+    return 'Android';
+  }
+  if (userAgent.toLowerCase().match(/iphone/i)) {
+    return 'iPhone';
+  }
+  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+    return 'iPad';
+  }
+  return 'PC';
+};
+const getDevicePlatform = () => {
+  const device = getDevice();
+  if (device) {
+    if (device === 'PC') {
+      return 'dk';
+    }
+    else if (device === 'iPad' || device === 'iPhone') {
+      return 'mtWeb';
+    }
+    else {
+      return 'mtWeb';
+    }
+  }
+};
 
@@ -79,21 +106,29 @@ const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.GridContainerWrapper {\n  display: grid;\n}\n\n.GridContainer {\n  margin: auto;\n  width: 100%;\n  height: 280px;\n  border-radius: 15px;\n  background-color: #07072A;\n  margin-bottom: 20px;\n  display: grid;\n  gap: 30px;\n  grid-template-rows: 1fr 4fr 1fr 1fr;\n  grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n  grid-column: 1/3;\n  grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n  border-radius: 5px 0 0 5px;\n  width: 100%;\n  height: 280px;\n}\n.GridContainer .BlogDate {\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: #FFFFFF;\n  background-color: #0D0D4D;\n  grid-column: 2/2;\n  grid-row: 4/4;\n  z-index: 1;\n}\n.GridContainer .BlogTitle {\n  font-size: 24px;\n  color: #FFF;\n  margin-top: 20px;\n  grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n  font-size: 14px;\n  color: #FFF;\n  width: 90%;\n  max-height: 80px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n  grid-column: 3/5;\n  color: #FFF;\n}\n.GridContainer .BlogLink button {\n  font-size: 14px;\n  border: none;\n  padding: 0;\n  background: none;\n  color: #D0046C;\n  cursor: pointer;\n}\n\n@container (max-width: 475px) {\n  .GridContainerWrapper {\n    display: grid;\n  }\n\n  .GridContainer {\n    margin: auto;\n    width: 100%;\n    min-height: 400px;\n    gap: 10%;\n    padding-bottom: 30px;\n    border-radius: 5px;\n    background-color: #07072A;\n    margin-bottom: 20px;\n    display: grid;\n    grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n    grid-template-rows: auto auto auto 50px;\n    grid-template-columns: 15px auto auto 15px;\n    gap: 10px;\n  }\n  .GridContainer .BlogBanner {\n    grid-column: 1/5;\n    grid-row: 1/3;\n    margin: 0;\n  }\n  .GridContainer .BlogBanner img {\n    width: 100%;\n    height: 232px;\n    border-radius: 5px 5px 0 0;\n  }\n  .GridContainer .BlogDate {\n    grid-column: 2/3;\n    grid-row: 2/3;\n    font-size: 12px;\n    border-radius: 5px 5px 0 0;\n    padding: 10px;\n    width: fit-content;\n    text-align: center;\n    color: #FFFFFF;\n    background-color: #0D0D4D;\n    z-index: 1;\n  }\n  .GridContainer .BlogTitle {\n    grid-column: 2/4;\n    font-size: 24px;\n    color: #FFF;\n  }\n  .GridContainer .BlogContent {\n    grid-column: 2/4;\n    font-size: 14px;\n    color: #FFF;\n  }\n  .GridContainer .BlogLink {\n    grid-column: 2/4;\n    color: #FFF;\n    cursor: pointer;\n  }\n  .GridContainer .BlogLink button {\n    font-size: 14px;\n    border: none;\n    background: none;\n    color: #D0046C;\n    cursor: pointer;\n  }\n}";
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showImage = true;
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showTitle = true;
     /**
-   * Property used to display the description
-   */
+    * Property used to display the description
+    */
     this.showContent = true;
     /**
-   * Property used to display the button
-   */
+    * Property used to display the button
+    */
     this.showButton = true;
     /**
-     * Event name to be sent when the button is clicked
+    * Event name to be sent when the button is clicked
+    */
+    this.postMessageEvent = 'articleActionButton';
+    /**
+     * User roles
      */
-    this.postMessageEvent = 'articleActionButton';
+    this.userRoles = 'everyone';
+    /**
+     * CMS Endpoint stage
+     */
+    this.cmsStage = 'stage';
     this.paginationBlogList = {
@@ -262,2 +297,5 @@ offset: 0
     url.searchParams.append('page', JSON.stringify(this.currentPage + 1));
+    url.searchParams.append('env', this.cmsStage);
+    url.searchParams.append('userRoles', this.userRoles);
+    url.searchParams.append('platform', getDevicePlatform());
     fetch(url.href)
@@ -344,3 +382,3 @@ .then((res) => {
 const DEFAULT_LANGUAGE = 'en';
-const SUPPORTED_LANGUAGES = ['ro', 'en', 'hu'];
+const SUPPORTED_LANGUAGES = ['ro', 'en'];
 const TRANSLATIONS = {
@@ -370,8 +408,2 @@ en: {
     lastPage: 'Last'
-  },
-  hu: {
-    firstPage: 'First',
-    previousPage: 'Previous',
-    nextPage: 'Következő',
-    lastPage: 'Last'
   }
@@ -391,9 +423,9 @@ };
     /**
-     * Next page string value - determines if the next page is disabled or active
+     * First page boolean value - determines if the page is disabled or active
      */
-    this.nextPage = '';
+    this.firstPage = false;
     /**
-     * Previous page string value - determines if the previous page is disabled or active
+     * Previous page boolean value - determines if the page is disabled or active
      */
-    this.prevPage = '';
+    this.previousPage = false;
     /**
@@ -424,10 +456,2 @@ * The received offset
     /**
-     * Component working variable for last page
-     */
-    this.lastPage = false;
-    /**
-     * Component working variable for prvious page
-     */
-    this.previousPage = false;
-    /**
      * In component working variable for the array of pages
@@ -558,7 +582,7 @@ */
      */
-    let buttonSecondaryLeftSide = index.h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'firstPage') }, index.h("span", { class: "NavigationButton" }, translate('firstPage', this.language)), index.h("span", { class: "NavigationIcon" }));
-    let buttonsLeftSide = index.h("div", { class: "LeftItems" }, this.secondaryArrowsActive && buttonSecondaryLeftSide, index.h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'previousPage') }, index.h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), index.h("span", { class: "NavigationIcon" })));
+    let buttonSecondaryLeftSide = index.h("button", { disabled: !this.previousPage, onClick: this.navigateTo.bind(this, 'firstPage') }, index.h("span", { class: "NavigationButton" }, translate('firstPage', this.language)), index.h("span", { class: "NavigationIcon" }));
+    let buttonsLeftSide = index.h("div", { class: "LeftItems" }, this.secondaryArrowsActive && buttonSecondaryLeftSide, index.h("button", { disabled: !this.previousPage ? true : false, onClick: this.navigateTo.bind(this, 'previousPage') }, index.h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), index.h("span", { class: "NavigationIcon" })));
     if (isMobile(this.userAgent)) {
       buttonsLeftSide =
-        index.h("div", { class: "LeftItems" }, index.h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'previousPage') }, index.h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), index.h("span", { class: "NavigationIcon" })));
+        index.h("div", { class: "LeftItems" }, index.h("button", { disabled: !this.previousPage ? true : false, onClick: this.navigateTo.bind(this, 'previousPage') }, index.h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), index.h("span", { class: "NavigationIcon" })));
     }
@@ -568,7 +592,7 @@ /**
      */
-    let buttonSecondaryRightSide = index.h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'lastPage') }, index.h("span", { class: "NavigationButton" }, translate('lastPage', this.language)), index.h("span", { class: "NavigationIcon" }));
-    let buttonsRightSide = index.h("div", { class: "RightItems" }, index.h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'nextPage') }, index.h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), index.h("span", { class: "NavigationIcon" })), this.secondaryArrowsActive && buttonSecondaryRightSide);
+    let buttonSecondaryRightSide = index.h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'lastPage') }, index.h("span", { class: "NavigationButton" }, translate('lastPage', this.language)), index.h("span", { class: "NavigationIcon" }));
+    let buttonsRightSide = index.h("div", { class: "RightItems" }, index.h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'nextPage') }, index.h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), index.h("span", { class: "NavigationIcon" })), this.secondaryArrowsActive && buttonSecondaryRightSide);
     if (isMobile(this.userAgent)) {
       buttonsRightSide =
-        index.h("div", { class: "RightItems" }, index.h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'nextPage') }, index.h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), index.h("span", { class: "NavigationIcon" })));
+        index.h("div", { class: "RightItems" }, index.h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'nextPage') }, index.h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), index.h("span", { class: "NavigationIcon" })));
     }
@@ -575,0 +599,0 @@ return (index.h("div", { id: "PaginationContainer", ref: el => this.stylingContainer = el }, this.arrowsActive && buttonsLeftSide, this.numberedNavActive && navigationArea, this.arrowsActive && buttonsRightSide));

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

@@ -18,3 +18,3 @@ 'use strict';
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
+  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"handleClick":[513,"handle-click"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"userRoles":[513,"user-roles"],"cmsStage":[513,"cms-stage"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"firstPage":[1540,"first-page"],"previousPage":[1540,"previous-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
 });

dist/cjs/loader.cjs.js

@@ -17,3 +17,3 @@ 'use strict';
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
+  return index.bootstrapLazy([["blog-articles-grid_2.cjs",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"handleClick":[513,"handle-click"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"userRoles":[513,"user-roles"],"cmsStage":[513,"cms-stage"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"firstPage":[1540,"first-page"],"previousPage":[1540,"previous-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
   });
@@ -20,0 +20,0 @@ };

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

 import { Component, Prop, State, Event, Watch, h, Listen } from '@stencil/core';
 import { translate } from '../../utils/locale.utils';
-import { checkDeviceType } from '../../utils/utils';
+import { checkDeviceType, getDevicePlatform } from '../../utils/utils';
 import '@everymatrix/helper-pagination';
@@ -24,21 +24,29 @@ export class BlogArticlesGrid {
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showImage = true;
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showTitle = true;
     /**
-   * Property used to display the description
-   */
+    * Property used to display the description
+    */
     this.showContent = true;
     /**
-   * Property used to display the button
-   */
+    * Property used to display the button
+    */
     this.showButton = true;
     /**
-     * Event name to be sent when the button is clicked
+    * Event name to be sent when the button is clicked
+    */
+    this.postMessageEvent = 'articleActionButton';
+    /**
+     * User roles
      */
-    this.postMessageEvent = 'articleActionButton';
+    this.userRoles = 'everyone';
+    /**
+     * CMS Endpoint stage
+     */
+    this.cmsStage = 'stage';
     this.paginationBlogList = {
@@ -207,2 +215,5 @@ offset: 0
     url.searchParams.append('page', JSON.stringify(this.currentPage + 1));
+    url.searchParams.append('env', this.cmsStage);
+    url.searchParams.append('userRoles', this.userRoles);
+    url.searchParams.append('platform', getDevicePlatform());
     fetch(url.href)
@@ -301,3 +312,3 @@ .then((res) => {
       "attribute": "cms-endpoint",
-      "reflect": false
+      "reflect": true
     },
@@ -319,3 +330,3 @@ "language": {
       "attribute": "language",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "'en'"
@@ -338,3 +349,3 @@ },
       "attribute": "handle-click",
-      "reflect": false
+      "reflect": true
     },
@@ -356,3 +367,3 @@ "clientStyling": {
       "attribute": "client-styling",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "''"
@@ -375,3 +386,3 @@ },
       "attribute": "client-styling-url",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "''"
@@ -394,3 +405,3 @@ },
       "attribute": "show-publishing-date",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "true"
@@ -413,3 +424,3 @@ },
       "attribute": "show-image",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "true"
@@ -432,3 +443,3 @@ },
       "attribute": "show-title",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "true"
@@ -451,3 +462,3 @@ },
       "attribute": "show-content",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "true"
@@ -470,3 +481,3 @@ },
       "attribute": "show-button",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "true"
@@ -489,3 +500,3 @@ },
       "attribute": "use-postmessage",
-      "reflect": false
+      "reflect": true
     },
@@ -507,3 +518,3 @@ "postMessageEvent": {
       "attribute": "post-message-event",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "'articleActionButton'"
@@ -595,2 +606,38 @@ },
       "reflect": true
+    },
+    "userRoles": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "User roles"
+      },
+      "attribute": "user-roles",
+      "reflect": true,
+      "defaultValue": "'everyone'"
+    },
+    "cmsStage": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "CMS Endpoint stage"
+      },
+      "attribute": "cms-stage",
+      "reflect": true,
+      "defaultValue": "'stage'"
     }
@@ -597,0 +644,0 @@ }; }

dist/collection/utils/locale.utils.js

@@ -21,3 +21,3 @@ const DEFAULT_LANGUAGE = 'en';
   hu: {
-    error: 'Error',
+    error: 'خطأ',
     readmore: 'Read more',
@@ -24,0 +24,0 @@ }

dist/collection/utils/utils.js

@@ -18,1 +18,28 @@ export function checkDeviceType() {
 }
+export const getDevice = () => {
+  let userAgent = window.navigator.userAgent;
+  if (userAgent.toLowerCase().match(/android/i)) {
+    return 'Android';
+  }
+  if (userAgent.toLowerCase().match(/iphone/i)) {
+    return 'iPhone';
+  }
+  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+    return 'iPad';
+  }
+  return 'PC';
+};
+export const getDevicePlatform = () => {
+  const device = getDevice();
+  if (device) {
+    if (device === 'PC') {
+      return 'dk';
+    }
+    else if (device === 'iPad' || device === 'iPhone') {
+      return 'mtWeb';
+    }
+    else {
+      return 'mtWeb';
+    }
+  }
+};

dist/components/blog-articles-grid.js

@@ -24,3 +24,3 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
   hu: {
-    error: 'Error',
+    error: 'خطأ',
     readmore: 'Read more',
@@ -51,2 +51,29 @@ }
 }
+const getDevice = () => {
+  let userAgent = window.navigator.userAgent;
+  if (userAgent.toLowerCase().match(/android/i)) {
+    return 'Android';
+  }
+  if (userAgent.toLowerCase().match(/iphone/i)) {
+    return 'iPhone';
+  }
+  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+    return 'iPad';
+  }
+  return 'PC';
+};
+const getDevicePlatform = () => {
+  const device = getDevice();
+  if (device) {
+    if (device === 'PC') {
+      return 'dk';
+    }
+    else if (device === 'iPad' || device === 'iPhone') {
+      return 'mtWeb';
+    }
+    else {
+      return 'mtWeb';
+    }
+  }
+};
 
@@ -78,21 +105,29 @@ const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.GridContainerWrapper {\n  display: grid;\n}\n\n.GridContainer {\n  margin: auto;\n  width: 100%;\n  height: 280px;\n  border-radius: 15px;\n  background-color: #07072A;\n  margin-bottom: 20px;\n  display: grid;\n  gap: 30px;\n  grid-template-rows: 1fr 4fr 1fr 1fr;\n  grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n  grid-column: 1/3;\n  grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n  border-radius: 5px 0 0 5px;\n  width: 100%;\n  height: 280px;\n}\n.GridContainer .BlogDate {\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: #FFFFFF;\n  background-color: #0D0D4D;\n  grid-column: 2/2;\n  grid-row: 4/4;\n  z-index: 1;\n}\n.GridContainer .BlogTitle {\n  font-size: 24px;\n  color: #FFF;\n  margin-top: 20px;\n  grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n  font-size: 14px;\n  color: #FFF;\n  width: 90%;\n  max-height: 80px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n  grid-column: 3/5;\n  color: #FFF;\n}\n.GridContainer .BlogLink button {\n  font-size: 14px;\n  border: none;\n  padding: 0;\n  background: none;\n  color: #D0046C;\n  cursor: pointer;\n}\n\n@container (max-width: 475px) {\n  .GridContainerWrapper {\n    display: grid;\n  }\n\n  .GridContainer {\n    margin: auto;\n    width: 100%;\n    min-height: 400px;\n    gap: 10%;\n    padding-bottom: 30px;\n    border-radius: 5px;\n    background-color: #07072A;\n    margin-bottom: 20px;\n    display: grid;\n    grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n    grid-template-rows: auto auto auto 50px;\n    grid-template-columns: 15px auto auto 15px;\n    gap: 10px;\n  }\n  .GridContainer .BlogBanner {\n    grid-column: 1/5;\n    grid-row: 1/3;\n    margin: 0;\n  }\n  .GridContainer .BlogBanner img {\n    width: 100%;\n    height: 232px;\n    border-radius: 5px 5px 0 0;\n  }\n  .GridContainer .BlogDate {\n    grid-column: 2/3;\n    grid-row: 2/3;\n    font-size: 12px;\n    border-radius: 5px 5px 0 0;\n    padding: 10px;\n    width: fit-content;\n    text-align: center;\n    color: #FFFFFF;\n    background-color: #0D0D4D;\n    z-index: 1;\n  }\n  .GridContainer .BlogTitle {\n    grid-column: 2/4;\n    font-size: 24px;\n    color: #FFF;\n  }\n  .GridContainer .BlogContent {\n    grid-column: 2/4;\n    font-size: 14px;\n    color: #FFF;\n  }\n  .GridContainer .BlogLink {\n    grid-column: 2/4;\n    color: #FFF;\n    cursor: pointer;\n  }\n  .GridContainer .BlogLink button {\n    font-size: 14px;\n    border: none;\n    background: none;\n    color: #D0046C;\n    cursor: pointer;\n  }\n}";
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showImage = true;
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showTitle = true;
     /**
-   * Property used to display the description
-   */
+    * Property used to display the description
+    */
     this.showContent = true;
     /**
-   * Property used to display the button
-   */
+    * Property used to display the button
+    */
     this.showButton = true;
     /**
-     * Event name to be sent when the button is clicked
+    * Event name to be sent when the button is clicked
+    */
+    this.postMessageEvent = 'articleActionButton';
+    /**
+     * User roles
      */
-    this.postMessageEvent = 'articleActionButton';
+    this.userRoles = 'everyone';
+    /**
+     * CMS Endpoint stage
+     */
+    this.cmsStage = 'stage';
     this.paginationBlogList = {
@@ -261,2 +296,5 @@ offset: 0
     url.searchParams.append('page', JSON.stringify(this.currentPage + 1));
+    url.searchParams.append('env', this.cmsStage);
+    url.searchParams.append('userRoles', this.userRoles);
+    url.searchParams.append('platform', getDevicePlatform());
     fetch(url.href)
@@ -328,14 +366,14 @@ .then((res) => {
 }, [1, "blog-articles-grid", {
-    "cmsEndpoint": [1, "cms-endpoint"],
-    "language": [1],
-    "handleClick": [1, "handle-click"],
-    "clientStyling": [1, "client-styling"],
-    "clientStylingUrl": [1, "client-styling-url"],
-    "showPublishingDate": [4, "show-publishing-date"],
-    "showImage": [4, "show-image"],
-    "showTitle": [4, "show-title"],
-    "showContent": [4, "show-content"],
-    "showButton": [4, "show-button"],
-    "usePostmessage": [4, "use-postmessage"],
-    "postMessageEvent": [1, "post-message-event"],
+    "cmsEndpoint": [513, "cms-endpoint"],
+    "language": [513],
+    "handleClick": [513, "handle-click"],
+    "clientStyling": [513, "client-styling"],
+    "clientStylingUrl": [513, "client-styling-url"],
+    "showPublishingDate": [516, "show-publishing-date"],
+    "showImage": [516, "show-image"],
+    "showTitle": [516, "show-title"],
+    "showContent": [516, "show-content"],
+    "showButton": [516, "show-button"],
+    "usePostmessage": [516, "use-postmessage"],
+    "postMessageEvent": [513, "post-message-event"],
     "blogsLimit": [514, "blogs-limit"],
@@ -346,2 +384,4 @@ "paginationActive": [516, "pagination-active"],
     "numberedNavActive": [516, "numbered-nav-active"],
+    "userRoles": [513, "user-roles"],
+    "cmsStage": [513, "cms-stage"],
     "paginationBlogList": [32],
@@ -348,0 +388,0 @@ "currentPage": [32],

dist/components/helper-pagination2.js

@@ -17,3 +17,3 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 const DEFAULT_LANGUAGE = 'en';
-const SUPPORTED_LANGUAGES = ['ro', 'en', 'hu'];
+const SUPPORTED_LANGUAGES = ['ro', 'en'];
 const TRANSLATIONS = {
@@ -43,8 +43,2 @@ en: {
     lastPage: 'Last'
-  },
-  hu: {
-    firstPage: 'First',
-    previousPage: 'Previous',
-    nextPage: 'Következő',
-    lastPage: 'Last'
   }
@@ -66,9 +60,9 @@ };
     /**
-     * Next page string value - determines if the next page is disabled or active
+     * First page boolean value - determines if the page is disabled or active
      */
-    this.nextPage = '';
+    this.firstPage = false;
     /**
-     * Previous page string value - determines if the previous page is disabled or active
+     * Previous page boolean value - determines if the page is disabled or active
      */
-    this.prevPage = '';
+    this.previousPage = false;
     /**
@@ -99,10 +93,2 @@ * The received offset
     /**
-     * Component working variable for last page
-     */
-    this.lastPage = false;
-    /**
-     * Component working variable for prvious page
-     */
-    this.previousPage = false;
-    /**
      * In component working variable for the array of pages
@@ -233,7 +219,7 @@ */
      */
-    let buttonSecondaryLeftSide = h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'firstPage') }, h("span", { class: "NavigationButton" }, translate('firstPage', this.language)), h("span", { class: "NavigationIcon" }));
-    let buttonsLeftSide = h("div", { class: "LeftItems" }, this.secondaryArrowsActive && buttonSecondaryLeftSide, h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
+    let buttonSecondaryLeftSide = h("button", { disabled: !this.previousPage, onClick: this.navigateTo.bind(this, 'firstPage') }, h("span", { class: "NavigationButton" }, translate('firstPage', this.language)), h("span", { class: "NavigationIcon" }));
+    let buttonsLeftSide = h("div", { class: "LeftItems" }, this.secondaryArrowsActive && buttonSecondaryLeftSide, h("button", { disabled: !this.previousPage ? true : false, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
     if (isMobile(this.userAgent)) {
       buttonsLeftSide =
-        h("div", { class: "LeftItems" }, h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
+        h("div", { class: "LeftItems" }, h("button", { disabled: !this.previousPage ? true : false, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
     }
@@ -243,7 +229,7 @@ /**
      */
-    let buttonSecondaryRightSide = h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'lastPage') }, h("span", { class: "NavigationButton" }, translate('lastPage', this.language)), h("span", { class: "NavigationIcon" }));
-    let buttonsRightSide = h("div", { class: "RightItems" }, h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })), this.secondaryArrowsActive && buttonSecondaryRightSide);
+    let buttonSecondaryRightSide = h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'lastPage') }, h("span", { class: "NavigationButton" }, translate('lastPage', this.language)), h("span", { class: "NavigationIcon" }));
+    let buttonsRightSide = h("div", { class: "RightItems" }, h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })), this.secondaryArrowsActive && buttonSecondaryRightSide);
     if (isMobile(this.userAgent)) {
       buttonsRightSide =
-        h("div", { class: "RightItems" }, h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })));
+        h("div", { class: "RightItems" }, h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })));
     }
@@ -254,4 +240,4 @@ return (h("div", { id: "PaginationContainer", ref: el => this.stylingContainer = el }, this.arrowsActive && buttonsLeftSide, this.numberedNavActive && navigationArea, this.arrowsActive && buttonsRightSide));
 }, [1, "helper-pagination", {
-    "nextPage": [1537, "next-page"],
-    "prevPage": [1537, "prev-page"],
+    "firstPage": [1540, "first-page"],
+    "previousPage": [1540, "previous-page"],
     "offset": [1538],
@@ -268,3 +254,2 @@ "limit": [1538],
     "lastPage": [32],
-    "previousPage": [32],
     "limitInt": [32],
@@ -271,0 +256,0 @@ "totalInt": [32],

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

@@ -23,3 +23,3 @@ import { r as registerInstance, c as createEvent, h } from './index-c02b7464.js';
   hu: {
-    error: 'Error',
+    error: 'خطأ',
     readmore: 'Read more',
@@ -50,2 +50,29 @@ }
 }
+const getDevice = () => {
+  let userAgent = window.navigator.userAgent;
+  if (userAgent.toLowerCase().match(/android/i)) {
+    return 'Android';
+  }
+  if (userAgent.toLowerCase().match(/iphone/i)) {
+    return 'iPhone';
+  }
+  if (userAgent.toLowerCase().match(/ipad|ipod/i)) {
+    return 'iPad';
+  }
+  return 'PC';
+};
+const getDevicePlatform = () => {
+  const device = getDevice();
+  if (device) {
+    if (device === 'PC') {
+      return 'dk';
+    }
+    else if (device === 'iPad' || device === 'iPhone') {
+      return 'mtWeb';
+    }
+    else {
+      return 'mtWeb';
+    }
+  }
+};
 
@@ -75,21 +102,29 @@ const blogArticlesGridCss = ":host {\n  display: block;\n}\n\n.GridContainerWrapper {\n  display: grid;\n}\n\n.GridContainer {\n  margin: auto;\n  width: 100%;\n  height: 280px;\n  border-radius: 15px;\n  background-color: #07072A;\n  margin-bottom: 20px;\n  display: grid;\n  gap: 30px;\n  grid-template-rows: 1fr 4fr 1fr 1fr;\n  grid-template-columns: 30px 1fr 1fr 30px;\n}\n.GridContainer .BlogBanner {\n  grid-column: 1/3;\n  grid-row: 1/5;\n}\n.GridContainer .BlogBanner img {\n  border-radius: 5px 0 0 5px;\n  width: 100%;\n  height: 280px;\n}\n.GridContainer .BlogDate {\n  font-size: 12px;\n  border-radius: 5px 5px 0 0;\n  padding: 10px;\n  width: fit-content;\n  text-align: center;\n  color: #FFFFFF;\n  background-color: #0D0D4D;\n  grid-column: 2/2;\n  grid-row: 4/4;\n  z-index: 1;\n}\n.GridContainer .BlogTitle {\n  font-size: 24px;\n  color: #FFF;\n  margin-top: 20px;\n  grid-column: 3/5;\n}\n.GridContainer .BlogContent {\n  font-size: 14px;\n  color: #FFF;\n  width: 90%;\n  max-height: 80px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  grid-column: 3/5;\n}\n.GridContainer .BlogLink {\n  grid-column: 3/5;\n  color: #FFF;\n}\n.GridContainer .BlogLink button {\n  font-size: 14px;\n  border: none;\n  padding: 0;\n  background: none;\n  color: #D0046C;\n  cursor: pointer;\n}\n\n@container (max-width: 475px) {\n  .GridContainerWrapper {\n    display: grid;\n  }\n\n  .GridContainer {\n    margin: auto;\n    width: 100%;\n    min-height: 400px;\n    gap: 10%;\n    padding-bottom: 30px;\n    border-radius: 5px;\n    background-color: #07072A;\n    margin-bottom: 20px;\n    display: grid;\n    grid-template-rows: repeat(auto-fit, minmax(50px, 1fr));\n    grid-template-rows: auto auto auto 50px;\n    grid-template-columns: 15px auto auto 15px;\n    gap: 10px;\n  }\n  .GridContainer .BlogBanner {\n    grid-column: 1/5;\n    grid-row: 1/3;\n    margin: 0;\n  }\n  .GridContainer .BlogBanner img {\n    width: 100%;\n    height: 232px;\n    border-radius: 5px 5px 0 0;\n  }\n  .GridContainer .BlogDate {\n    grid-column: 2/3;\n    grid-row: 2/3;\n    font-size: 12px;\n    border-radius: 5px 5px 0 0;\n    padding: 10px;\n    width: fit-content;\n    text-align: center;\n    color: #FFFFFF;\n    background-color: #0D0D4D;\n    z-index: 1;\n  }\n  .GridContainer .BlogTitle {\n    grid-column: 2/4;\n    font-size: 24px;\n    color: #FFF;\n  }\n  .GridContainer .BlogContent {\n    grid-column: 2/4;\n    font-size: 14px;\n    color: #FFF;\n  }\n  .GridContainer .BlogLink {\n    grid-column: 2/4;\n    color: #FFF;\n    cursor: pointer;\n  }\n  .GridContainer .BlogLink button {\n    font-size: 14px;\n    border: none;\n    background: none;\n    color: #D0046C;\n    cursor: pointer;\n  }\n}";
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showImage = true;
     /**
-   * Property used to display the image
-   */
+    * Property used to display the image
+    */
     this.showTitle = true;
     /**
-   * Property used to display the description
-   */
+    * Property used to display the description
+    */
     this.showContent = true;
     /**
-   * Property used to display the button
-   */
+    * Property used to display the button
+    */
     this.showButton = true;
     /**
-     * Event name to be sent when the button is clicked
+    * Event name to be sent when the button is clicked
+    */
+    this.postMessageEvent = 'articleActionButton';
+    /**
+     * User roles
      */
-    this.postMessageEvent = 'articleActionButton';
+    this.userRoles = 'everyone';
+    /**
+     * CMS Endpoint stage
+     */
+    this.cmsStage = 'stage';
     this.paginationBlogList = {
@@ -258,2 +293,5 @@ offset: 0
     url.searchParams.append('page', JSON.stringify(this.currentPage + 1));
+    url.searchParams.append('env', this.cmsStage);
+    url.searchParams.append('userRoles', this.userRoles);
+    url.searchParams.append('platform', getDevicePlatform());
     fetch(url.href)
@@ -340,3 +378,3 @@ .then((res) => {
 const DEFAULT_LANGUAGE = 'en';
-const SUPPORTED_LANGUAGES = ['ro', 'en', 'hu'];
+const SUPPORTED_LANGUAGES = ['ro', 'en'];
 const TRANSLATIONS = {
@@ -366,8 +404,2 @@ en: {
     lastPage: 'Last'
-  },
-  hu: {
-    firstPage: 'First',
-    previousPage: 'Previous',
-    nextPage: 'Következő',
-    lastPage: 'Last'
   }
@@ -387,9 +419,9 @@ };
     /**
-     * Next page string value - determines if the next page is disabled or active
+     * First page boolean value - determines if the page is disabled or active
      */
-    this.nextPage = '';
+    this.firstPage = false;
     /**
-     * Previous page string value - determines if the previous page is disabled or active
+     * Previous page boolean value - determines if the page is disabled or active
      */
-    this.prevPage = '';
+    this.previousPage = false;
     /**
@@ -420,10 +452,2 @@ * The received offset
     /**
-     * Component working variable for last page
-     */
-    this.lastPage = false;
-    /**
-     * Component working variable for prvious page
-     */
-    this.previousPage = false;
-    /**
      * In component working variable for the array of pages
@@ -554,7 +578,7 @@ */
      */
-    let buttonSecondaryLeftSide = h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'firstPage') }, h("span", { class: "NavigationButton" }, translate('firstPage', this.language)), h("span", { class: "NavigationIcon" }));
-    let buttonsLeftSide = h("div", { class: "LeftItems" }, this.secondaryArrowsActive && buttonSecondaryLeftSide, h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
+    let buttonSecondaryLeftSide = h("button", { disabled: !this.previousPage, onClick: this.navigateTo.bind(this, 'firstPage') }, h("span", { class: "NavigationButton" }, translate('firstPage', this.language)), h("span", { class: "NavigationIcon" }));
+    let buttonsLeftSide = h("div", { class: "LeftItems" }, this.secondaryArrowsActive && buttonSecondaryLeftSide, h("button", { disabled: !this.previousPage ? true : false, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
     if (isMobile(this.userAgent)) {
       buttonsLeftSide =
-        h("div", { class: "LeftItems" }, h("button", { disabled: this.prevPage ? false : true, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
+        h("div", { class: "LeftItems" }, h("button", { disabled: !this.previousPage ? true : false, onClick: this.navigateTo.bind(this, 'previousPage') }, h("span", { class: "NavigationButton" }, translate('previousPage', this.language)), h("span", { class: "NavigationIcon" })));
     }
@@ -564,7 +588,7 @@ /**
      */
-    let buttonSecondaryRightSide = h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'lastPage') }, h("span", { class: "NavigationButton" }, translate('lastPage', this.language)), h("span", { class: "NavigationIcon" }));
-    let buttonsRightSide = h("div", { class: "RightItems" }, h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })), this.secondaryArrowsActive && buttonSecondaryRightSide);
+    let buttonSecondaryRightSide = h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'lastPage') }, h("span", { class: "NavigationButton" }, translate('lastPage', this.language)), h("span", { class: "NavigationIcon" }));
+    let buttonsRightSide = h("div", { class: "RightItems" }, h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })), this.secondaryArrowsActive && buttonSecondaryRightSide);
     if (isMobile(this.userAgent)) {
       buttonsRightSide =
-        h("div", { class: "RightItems" }, h("button", { disabled: this.nextPage ? false : true, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })));
+        h("div", { class: "RightItems" }, h("button", { disabled: !this.lastPage ? true : false, onClick: this.navigateTo.bind(this, 'nextPage') }, h("span", { class: "NavigationButton" }, translate('nextPage', this.language)), h("span", { class: "NavigationIcon" })));
     }
@@ -571,0 +595,0 @@ return (h("div", { id: "PaginationContainer", ref: el => this.stylingContainer = el }, this.arrowsActive && buttonsLeftSide, this.numberedNavActive && navigationArea, this.arrowsActive && buttonsRightSide));

dist/esm/blog-articles-grid.js

@@ -16,3 +16,3 @@ import { p as promiseResolve, b as bootstrapLazy } from './index-c02b7464.js';
 patchBrowser().then(options => {
-  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
+  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"handleClick":[513,"handle-click"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"userRoles":[513,"user-roles"],"cmsStage":[513,"cms-stage"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"firstPage":[1540,"first-page"],"previousPage":[1540,"previous-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
 });

dist/esm/loader.js

@@ -13,3 +13,3 @@ import { p as promiseResolve, b as bootstrapLazy } from './index-c02b7464.js';
   return patchEsm().then(() => {
-  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[1,"cms-endpoint"],"language":[1],"handleClick":[1,"handle-click"],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"showPublishingDate":[4,"show-publishing-date"],"showImage":[4,"show-image"],"showTitle":[4,"show-title"],"showContent":[4,"show-content"],"showButton":[4,"show-button"],"usePostmessage":[4,"use-postmessage"],"postMessageEvent":[1,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"nextPage":[1537,"next-page"],"prevPage":[1537,"prev-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"previousPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
+  return bootstrapLazy([["blog-articles-grid_2",[[1,"blog-articles-grid",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"handleClick":[513,"handle-click"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"showPublishingDate":[516,"show-publishing-date"],"showImage":[516,"show-image"],"showTitle":[516,"show-title"],"showContent":[516,"show-content"],"showButton":[516,"show-button"],"usePostmessage":[516,"use-postmessage"],"postMessageEvent":[513,"post-message-event"],"blogsLimit":[514,"blogs-limit"],"paginationActive":[516,"pagination-active"],"arrowsActive":[516,"arrows-active"],"secondaryArrowsActive":[516,"secondary-arrows-active"],"numberedNavActive":[516,"numbered-nav-active"],"userRoles":[513,"user-roles"],"cmsStage":[513,"cms-stage"],"paginationBlogList":[32],"currentPage":[32],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"nextPage":[32],"previousPage":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"],[0,"hpPageChange","hpPageChange"]]],[1,"helper-pagination",{"firstPage":[1540,"first-page"],"previousPage":[1540,"previous-page"],"offset":[1538],"limit":[1538],"total":[1538],"language":[1537],"clientStyling":[1537,"client-styling"],"clientStylingUrlContent":[1537,"client-styling-url-content"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"numberedNavActive":[1540,"numbered-nav-active"],"offsetInt":[32],"lastPage":[32],"limitInt":[32],"totalInt":[32],"pagesArray":[32],"endInt":[32],"limitStylingAppends":[32]}]]]], options);
   });
@@ -16,0 +16,0 @@ };

dist/types/components.d.ts

@@ -31,2 +31,6 @@ /* eslint-disable */
         /**
+          * CMS Endpoint stage
+         */
+        "cmsStage": string;
+        /**
           * Handle when you click on shome more button
@@ -79,2 +83,6 @@ */
         "usePostmessage": boolean;
+        /**
+          * User roles
+         */
+        "userRoles": string;
     }
@@ -116,2 +124,6 @@ }
         /**
+          * CMS Endpoint stage
+         */
+        "cmsStage"?: string;
+        /**
           * Handle when you click on shome more button
@@ -165,2 +177,6 @@ */
         "usePostmessage": boolean;
+        /**
+          * User roles
+         */
+        "userRoles"?: string;
     }
@@ -167,0 +183,0 @@ interface IntrinsicElements {

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

@@ -5,4 +5,4 @@ import { EventEmitter } from '../../stencil-public-runtime';
   /**
- * Endpoint URL for the source of data
- */
+   * Endpoint URL for the source of data
+   */
   cmsEndpoint: string;
@@ -30,28 +30,28 @@ /**
   /**
- * Property used to display the image
- */
+  * Property used to display the image
+  */
   showImage: boolean;
   /**
- * Property used to display the image
- */
+  * Property used to display the image
+  */
   showTitle: boolean;
   /**
- * Property used to display the description
- */
+  * Property used to display the description
+  */
   showContent: boolean;
   /**
- * Property used to display the button
- */
+  * Property used to display the button
+  */
   showButton: boolean;
   /**
-   * Use postMessage event to communicate
-   */
+  * Use postMessage event to communicate
+  */
   usePostmessage: boolean;
   /**
-   * Event name to be sent when the button is clicked
-   */
+  * Event name to be sent when the button is clicked
+  */
   postMessageEvent: string;
   /**
-   * Customize pagination: Activate pagination numbered navigation
-   */
+  * Customize pagination: Activate pagination numbered navigation
+  */
   blogsLimit: number;
@@ -74,2 +74,10 @@ /**
   numberedNavActive: boolean;
+  /**
+   * User roles
+   */
+  userRoles: string;
+  /**
+   * CMS Endpoint stage
+   */
+  cmsStage: string;
   articleActionButton: EventEmitter<Object>;
@@ -76,0 +84,0 @@ getArticleId(postId: number): void;

dist/types/utils/utils.d.ts

 export declare function checkDeviceType(): 'mobile' | 'tablet' | 'desktop';
+export declare const getDevice: () => "Android" | "iPhone" | "iPad" | "PC";
+export declare const getDevicePlatform: () => "dk" | "mtWeb";

package.json

 {
   "name": "@everymatrix/blog-articles-grid",
-  "version": "1.13.15",
+  "version": "1.13.16",
   "main": "./dist/index.cjs.js",
@@ -5,0 +5,0 @@ "module": "./dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

448966

increased by1.08%

Lines of code

7982

increased by2.28%

No dependency changes