@everymatrix/blog-article-details 1.13.21 → 1.13.23

package/dist/blog-article-details/blog-article-details.esm.js

@@ -1 +1 @@
-import{p as e,b as n}from"./p-68e0210a.js";(()=>{const n=import.meta.url,s={};return""!==n&&(s.resourcesUrl=new URL(".",n).href),e(s)})().then((e=>n([["p-27fa1c04",[[1,"blog-article-details",{cmsEndpoint:[513,"cms-endpoint"],language:[513],userRoles:[513,"user-roles"],cmsEnv:[513,"cms-env"],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"],postMessageEvent:[513,"post-message-event"],postId:[514,"post-id"],hasErrors:[32],limitStylingAppends:[32],isLoading:[32],bannerMatrixReady:[32],device:[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]],e)));
+import{p as e,b as t}from"./p-68e0210a.js";(()=>{const t=import.meta.url,n={};return""!==t&&(n.resourcesUrl=new URL(".",t).href),e(n)})().then((e=>t([["p-2ce77338",[[1,"blog-article-details",{cmsEndpoint:[513,"cms-endpoint"],language:[513],userRoles:[513,"user-roles"],cmsEnv:[513,"cms-env"],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"],postMessageEvent:[513,"post-message-event"],postId:[514,"post-id"],intlDateTimeFormat:[1,"intl-date-time-format"],hasErrors:[32],limitStylingAppends:[32],isLoading:[32],bannerMatrixReady:[32],device:[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]],e)));

package/dist/blog-article-details/p-2ce77338.entry.js

@@ -0,0 +1 @@
+import{r as t,h as i}from"./p-68e0210a.js";const n=["ro","en","fr","ar"],r={en:{error:"Error"},ro:{error:"Eroare"},fr:{error:"Error"},ar:{error:"خطأ"}},e=class{constructor(n){t(this,n),this.language="en",this.userRoles="everyone",this.cmsEnv="stage",this.clientStyling="",this.clientStylingUrl="",this.showPublishingDate=!0,this.showImage=!0,this.showTitle=!0,this.showContent=!0,this.postMessageEvent="articleActionButton",this.intlDateTimeFormat="",this.hasErrors=!1,this.limitStylingAppends=!1,this.isLoading=!0,this.bannerMatrixReady=!1,this.device="",this.setClientStyling=()=>{let t=document.createElement("style");t.innerHTML=this.clientStyling,this.stylingContainer.prepend(t)},this.setClientStylingURL=()=>{let t=new URL(this.clientStylingUrl),i=document.createElement("style");fetch(t.href).then((t=>t.text())).then((t=>{i.innerHTML=t,setTimeout((()=>{this.stylingContainer.prepend(i)}),1)})).catch((t=>{console.log("error ",t)}))},this.renderContentConditionally=t=>-1!==(null==t?void 0:t.indexOf("<bannermatrix-banner"))?this.bannerMatrixReady?i("div",{class:"BlogContent",innerHTML:t}):null:i("div",{class:"BlogContent",innerHTML:t})}handleBannerReady(){this.bannerMatrixReady=!0}watchEndpoint(t,i){t&&t!=i&&this.cmsEndpoint&&this.getBlogArticleDetails()}connectedCallback(){this.cmsEndpoint&&this.language&&this.getBlogArticleDetails()}getBlogArticleDetails(){if(!this.postId&&isNaN(this.postId))throw this.hasErrors=!0,new Error("The postId parameter is missing!");this.isLoading=!0;let t=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts/${this.postId}`);t.searchParams.append("env",this.cmsEnv),t.searchParams.append("userRoles",this.userRoles),t.searchParams.append("device",(()=>{const t=(()=>{let t=window.navigator.userAgent;return t.toLowerCase().match(/android/i)?"Android":t.toLowerCase().match(/iphone/i)?"iPhone":t.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})();if(t)return"PC"===t?"dk":"mtWeb"})()),fetch(t.href).then((t=>{if(t.status>=300)throw this.hasErrors=!0,new Error("There was an error while fetching the data");return t.json()})).then((t=>{this.blogData=t,this.blogData.publishingDate=new Date(this.blogData.publishingDate).toLocaleDateString(),this.isLoading=!1})).catch((t=>{this.hasErrors=!0,console.log("Error",t)})).finally((()=>this.isLoading=!1))}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}componentDidLoad(){this.detectAndAlertDeviceType()}detectAndAlertDeviceType(){this.device=function(){const t=navigator.userAgent.toLowerCase(),i=screen.availWidth,n=screen.availHeight;if(t.includes("iphone"))return"mobile";if(t.includes("android")){if(n>i&&i<800)return"mobile";if(i>n&&n<800)return"tablet"}return"desktop"}()}formatDate(t){return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(new Date(t))}render(){var t,e,o,s,h;return this.hasErrors?i("div",{class:"BlogArticleDetails"},i("div",{class:"Title"},(()=>{const t=this.language;return r[void 0!==t&&n.includes(t)?t:"en"].error})())):this.isLoading?void 0:i("div",{ref:t=>this.stylingContainer=t},i("div",{class:"GridContainer"},this.showPublishingDate&&i("div",{class:"BlogDate"},this.formatDate(null===(t=this.blogData)||void 0===t?void 0:t.publishingDate)),this.showImage&&i("div",{class:"BlogBanner"},(null===(e=this.blogData.image)||void 0===e?void 0:e.src)?i("img",{src:this.blogData.image.src,alt:this.blogData.image.src}):(null===(o=this.blogData.video)||void 0===o?void 0:o.sources[this.device])?i("video",{src:this.blogData.video.sources[this.device],controls:!0}):i("h1",{style:{color:"white"}},"No Image")),this.showTitle&&i("div",{class:"BlogTitle"},null===(s=this.blogData)||void 0===s?void 0:s.title),this.showContent&&this.renderContentConditionally(null===(h=this.blogData)||void 0===h?void 0:h.content)))}static get watchers(){return{cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"]}}};e.style=":host {\n  display: block;\n}\n\n.GridContainer {\n  overflow: auto;\n  margin: auto;\n  width: 100%;\n  padding-bottom: 30px;\n  background-color: #07072A;\n  display: grid;\n  grid-template-rows: auto;\n  grid-template-columns: 30px 60px 1fr 30px;\n  gap: 10px;\n}\n.GridContainer .BlogBanner {\n  grid-column: 1/5;\n  grid-row: 1/3;\n}\n.GridContainer .BlogBanner img {\n  width: 100%;\n  height: auto;\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: #FFF;\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\n@container (max-width: 475px) {\n  .GridContainer {\n    font-size: 12px;\n  }\n}";export{e as blog_article_details}

package/dist/cjs/blog-article-details.cjs.entry.js

@@ -115,6 +115,10 @@ const BlogArticleDetails = class {
      * Event name to be sent when the button is clicked
      */
     this.postMessageEvent = 'articleActionButton';
+    /**
+     * Intl date format
+     */
+    this.intlDateTimeFormat = '';
     this.hasErrors = false;
     this.limitStylingAppends = false;
     this.isLoading = true;
@@ -209,6 +213,9 @@ const BlogArticleDetails = class {
   detectAndAlertDeviceType() {
     this.device = checkDeviceType();
   }
+  formatDate(dateString) {
+    return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(new Date(dateString));
+  }
   render() {
     var _a, _b, _c, _d, _e;
     if (this.hasErrors) {
@@ -216,7 +223,7 @@ const BlogArticleDetails = class {
     }
     if (!this.isLoading) {
       return (index.h("div", { ref: el => this.stylingContainer = el }, index.h("div", { class: "GridContainer" }, this.showPublishingDate &&
-        index.h("div", { class: "BlogDate" }, (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate), this.showImage && (index.h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (index.h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (index.h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (index.h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
+        index.h("div", { class: "BlogDate" }, this.formatDate((_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate)), this.showImage && (index.h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (index.h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (index.h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (index.h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
         index.h("div", { class: "BlogTitle" }, (_d = this.blogData) === null || _d === void 0 ? void 0 : _d.title), this.showContent && this.renderContentConditionally((_e = this.blogData) === null || _e === void 0 ? void 0 : _e.content))));
     }
   }

package/dist/cjs/blog-article-details.cjs.js

@@ -15,5 +15,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["blog-article-details.cjs",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
+  return index.bootstrapLazy([["blog-article-details.cjs",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
 });

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["blog-article-details.cjs",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
+  return index.bootstrapLazy([["blog-article-details.cjs",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
   });
 };
 

package/dist/collection/components/blog-article-details/blog-article-details.js

@@ -43,6 +43,10 @@ export class BlogArticleDetails {
      * Event name to be sent when the button is clicked
      */
     this.postMessageEvent = 'articleActionButton';
+    /**
+     * Intl date format
+     */
+    this.intlDateTimeFormat = '';
     this.hasErrors = false;
     this.limitStylingAppends = false;
     this.isLoading = true;
@@ -137,6 +141,9 @@ export class BlogArticleDetails {
   detectAndAlertDeviceType() {
     this.device = checkDeviceType();
   }
+  formatDate(dateString) {
+    return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(new Date(dateString));
+  }
   render() {
     var _a, _b, _c, _d, _e;
     if (this.hasErrors) {
@@ -147,7 +154,7 @@ export class BlogArticleDetails {
       return (h("div", { ref: el => this.stylingContainer = el },
         h("div", { class: "GridContainer" },
           this.showPublishingDate &&
-            h("div", { class: "BlogDate" }, (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate),
+            h("div", { class: "BlogDate" }, this.formatDate((_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate)),
           this.showImage && (h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))),
           this.showTitle &&
             h("div", { class: "BlogTitle" }, (_d = this.blogData) === null || _d === void 0 ? void 0 : _d.title),
@@ -393,6 +400,24 @@ export class BlogArticleDetails {
       },
       "attribute": "post-id",
       "reflect": true
+    },
+    "intlDateTimeFormat": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Intl date format"
+      },
+      "attribute": "intl-date-time-format",
+      "reflect": false,
+      "defaultValue": "''"
     }
   }; }
   static get states() { return {

package/dist/components/blog-article-details.js

@@ -113,6 +113,10 @@ const BlogArticleDetails$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
      * Event name to be sent when the button is clicked
      */
     this.postMessageEvent = 'articleActionButton';
+    /**
+     * Intl date format
+     */
+    this.intlDateTimeFormat = '';
     this.hasErrors = false;
     this.limitStylingAppends = false;
     this.isLoading = true;
@@ -207,6 +211,9 @@ const BlogArticleDetails$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
   detectAndAlertDeviceType() {
     this.device = checkDeviceType();
   }
+  formatDate(dateString) {
+    return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(new Date(dateString));
+  }
   render() {
     var _a, _b, _c, _d, _e;
     if (this.hasErrors) {
@@ -214,7 +221,7 @@ const BlogArticleDetails$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     }
     if (!this.isLoading) {
       return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GridContainer" }, this.showPublishingDate &&
-        h("div", { class: "BlogDate" }, (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate), this.showImage && (h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
+        h("div", { class: "BlogDate" }, this.formatDate((_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate)), this.showImage && (h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
         h("div", { class: "BlogTitle" }, (_d = this.blogData) === null || _d === void 0 ? void 0 : _d.title), this.showContent && this.renderContentConditionally((_e = this.blogData) === null || _e === void 0 ? void 0 : _e.content))));
     }
   }
@@ -237,6 +244,7 @@ const BlogArticleDetails$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     "showContent": [516, "show-content"],
     "postMessageEvent": [513, "post-message-event"],
     "postId": [514, "post-id"],
+    "intlDateTimeFormat": [1, "intl-date-time-format"],
     "hasErrors": [32],
     "limitStylingAppends": [32],
     "isLoading": [32],

package/dist/esm/blog-article-details.entry.js

@@ -111,6 +111,10 @@ const BlogArticleDetails = class {
      * Event name to be sent when the button is clicked
      */
     this.postMessageEvent = 'articleActionButton';
+    /**
+     * Intl date format
+     */
+    this.intlDateTimeFormat = '';
     this.hasErrors = false;
     this.limitStylingAppends = false;
     this.isLoading = true;
@@ -205,6 +209,9 @@ const BlogArticleDetails = class {
   detectAndAlertDeviceType() {
     this.device = checkDeviceType();
   }
+  formatDate(dateString) {
+    return new Intl.DateTimeFormat(this.intlDateTimeFormat).format(new Date(dateString));
+  }
   render() {
     var _a, _b, _c, _d, _e;
     if (this.hasErrors) {
@@ -212,7 +219,7 @@ const BlogArticleDetails = class {
     }
     if (!this.isLoading) {
       return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GridContainer" }, this.showPublishingDate &&
-        h("div", { class: "BlogDate" }, (_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate), this.showImage && (h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
+        h("div", { class: "BlogDate" }, this.formatDate((_a = this.blogData) === null || _a === void 0 ? void 0 : _a.publishingDate)), this.showImage && (h("div", { class: "BlogBanner" }, ((_b = this.blogData.image) === null || _b === void 0 ? void 0 : _b.src) ? (h("img", { src: this.blogData.image.src, alt: this.blogData.image.src })) : (((_c = this.blogData.video) === null || _c === void 0 ? void 0 : _c.sources[this.device]) ? (h("video", { src: this.blogData.video.sources[this.device], controls: true })) : (h("h1", { style: { color: "white" } }, "No Image"))))), this.showTitle &&
         h("div", { class: "BlogTitle" }, (_d = this.blogData) === null || _d === void 0 ? void 0 : _d.title), this.showContent && this.renderContentConditionally((_e = this.blogData) === null || _e === void 0 ? void 0 : _e.content))));
     }
   }

package/dist/esm/blog-article-details.js

@@ -13,5 +13,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["blog-article-details",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
+  return bootstrapLazy([["blog-article-details",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
 });

package/dist/esm/loader.js

@@ -10,7 +10,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["blog-article-details",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
+  return bootstrapLazy([["blog-article-details",[[1,"blog-article-details",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"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"],"postMessageEvent":[513,"post-message-event"],"postId":[514,"post-id"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
   });
 };
 

package/dist/types/Users/cristian.taloi/work/widgets-stencil/packages/blog-article-details/.stencil/packages/blog-article-details/stencil.config.d.ts

@@ -0,0 +1,2 @@
+import { Config } from '../../../../../../../../../stencil-public-runtime';
+export declare const config: Config;

package/dist/types/components/blog-article-details/blog-article-details.d.ts

@@ -51,6 +51,10 @@ export declare class BlogArticleDetails {
    * Showing post ID parameter
    */
   postId: number;
+  /**
+   * Intl date format
+   */
+  intlDateTimeFormat: string;
   private hasErrors;
   private limitStylingAppends;
   private isLoading;
@@ -67,6 +71,7 @@ export declare class BlogArticleDetails {
   detectAndAlertDeviceType(): void;
   setClientStyling: () => void;
   setClientStylingURL: () => void;
+  formatDate(dateString: any): string;
   renderContentConditionally: (content: string) => HTMLElement;
   render(): void;
 }

package/dist/types/components.d.ts

@@ -27,6 +27,10 @@ export namespace Components {
           * Handle when you click on show more button
          */
         "handleClick": string;
+        /**
+          * Intl date format
+         */
+        "intlDateTimeFormat": string;
         /**
           * Language of the widget
          */
@@ -94,6 +98,10 @@ declare namespace LocalJSX {
           * Handle when you click on show more button
          */
         "handleClick"?: string;
+        /**
+          * Intl date format
+         */
+        "intlDateTimeFormat"?: string;
         /**
           * Language of the widget
          */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/blog-article-details",
-  "version": "1.13.21",
+  "version": "1.13.23",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",

package/dist/blog-article-details/p-27fa1c04.entry.js

@@ -1 +0,0 @@
-import{r as i,h as t}from"./p-68e0210a.js";const n=["ro","en","fr","ar"],r={en:{error:"Error"},ro:{error:"Eroare"},fr:{error:"Error"},ar:{error:"خطأ"}},e=class{constructor(n){i(this,n),this.language="en",this.userRoles="everyone",this.cmsEnv="stage",this.clientStyling="",this.clientStylingUrl="",this.showPublishingDate=!0,this.showImage=!0,this.showTitle=!0,this.showContent=!0,this.postMessageEvent="articleActionButton",this.hasErrors=!1,this.limitStylingAppends=!1,this.isLoading=!0,this.bannerMatrixReady=!1,this.device="",this.setClientStyling=()=>{let i=document.createElement("style");i.innerHTML=this.clientStyling,this.stylingContainer.prepend(i)},this.setClientStylingURL=()=>{let i=new URL(this.clientStylingUrl),t=document.createElement("style");fetch(i.href).then((i=>i.text())).then((i=>{t.innerHTML=i,setTimeout((()=>{this.stylingContainer.prepend(t)}),1)})).catch((i=>{console.log("error ",i)}))},this.renderContentConditionally=i=>-1!==(null==i?void 0:i.indexOf("<bannermatrix-banner"))?this.bannerMatrixReady?t("div",{class:"BlogContent",innerHTML:i}):null:t("div",{class:"BlogContent",innerHTML:i})}handleBannerReady(){this.bannerMatrixReady=!0}watchEndpoint(i,t){i&&i!=t&&this.cmsEndpoint&&this.getBlogArticleDetails()}connectedCallback(){this.cmsEndpoint&&this.language&&this.getBlogArticleDetails()}getBlogArticleDetails(){if(!this.postId&&isNaN(this.postId))throw this.hasErrors=!0,new Error("The postId parameter is missing!");this.isLoading=!0;let i=new URL(`${this.cmsEndpoint}/${this.language}/blog-posts/${this.postId}`);i.searchParams.append("env",this.cmsEnv),i.searchParams.append("userRoles",this.userRoles),i.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)return"PC"===i?"dk":"mtWeb"})()),fetch(i.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=>{this.blogData=i,this.blogData.publishingDate=new Date(this.blogData.publishingDate).toLocaleDateString(),this.isLoading=!1})).catch((i=>{this.hasErrors=!0,console.log("Error",i)})).finally((()=>this.isLoading=!1))}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.clientStylingUrl&&this.setClientStylingURL(),this.limitStylingAppends=!0)}componentDidLoad(){this.detectAndAlertDeviceType()}detectAndAlertDeviceType(){this.device=function(){const i=navigator.userAgent.toLowerCase(),t=screen.availWidth,n=screen.availHeight;if(i.includes("iphone"))return"mobile";if(i.includes("android")){if(n>t&&t<800)return"mobile";if(t>n&&n<800)return"tablet"}return"desktop"}()}render(){var i,e,o,s,h;return this.hasErrors?t("div",{class:"BlogArticleDetails"},t("div",{class:"Title"},(()=>{const i=this.language;return r[void 0!==i&&n.includes(i)?i:"en"].error})())):this.isLoading?void 0:t("div",{ref:i=>this.stylingContainer=i},t("div",{class:"GridContainer"},this.showPublishingDate&&t("div",{class:"BlogDate"},null===(i=this.blogData)||void 0===i?void 0:i.publishingDate),this.showImage&&t("div",{class:"BlogBanner"},(null===(e=this.blogData.image)||void 0===e?void 0:e.src)?t("img",{src:this.blogData.image.src,alt:this.blogData.image.src}):(null===(o=this.blogData.video)||void 0===o?void 0:o.sources[this.device])?t("video",{src:this.blogData.video.sources[this.device],controls:!0}):t("h1",{style:{color:"white"}},"No Image")),this.showTitle&&t("div",{class:"BlogTitle"},null===(s=this.blogData)||void 0===s?void 0:s.title),this.showContent&&this.renderContentConditionally(null===(h=this.blogData)||void 0===h?void 0:h.content)))}static get watchers(){return{cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"]}}};e.style=":host {\n  display: block;\n}\n\n.GridContainer {\n  overflow: auto;\n  margin: auto;\n  width: 100%;\n  padding-bottom: 30px;\n  background-color: #07072A;\n  display: grid;\n  grid-template-rows: auto;\n  grid-template-columns: 30px 60px 1fr 30px;\n  gap: 10px;\n}\n.GridContainer .BlogBanner {\n  grid-column: 1/5;\n  grid-row: 1/3;\n}\n.GridContainer .BlogBanner img {\n  width: 100%;\n  height: auto;\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: #FFF;\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\n@container (max-width: 475px) {\n  .GridContainer {\n    font-size: 12px;\n  }\n}";export{e as blog_article_details}

package/dist/types/Users/adrian.pripon/Documents/Work/stencil/widgets-stencil/packages/blog-article-details/.stencil/packages/blog-article-details/stencil.config.d.ts

@@ -1,2 +0,0 @@
-import { Config } from '../../../../../../../../../../../stencil-public-runtime';
-export declare const config: Config;