New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@everymatrix/blog-article-details

Package Overview
Dependencies
Maintainers
13
Versions
198
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@everymatrix/blog-article-details - npm Package Compare versions

Comparing version

1.27.3
to
1.27.4

dist/blog-article-details/p-df1f1274.entry.js
dist/types/Users/dragos.bodea/Documents/everymatrix-prjs/emfe-widgets/widgets-stencil/packages/blog-article-details/.stencil/packages/blog-article-details/stencil.config.d.ts

2

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

@@ -1,1 +0,1 @@

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

19

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

@@ -74,3 +74,3 @@ 'use strict';

const blogArticleDetailsCss = ":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 text-wrap: nowrap;\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}";
const blogArticleDetailsCss = ":host {\n display: block;\n}\n\n.DetailsContainer {\n background-color: #07072A;\n color: #fff;\n display: flex;\n flex-direction: column;\n}\n.DetailsContainer .BlogBanner div {\n height: 400px;\n}\n.DetailsContainer .DetailsHeadWrapper {\n position: relative;\n}\n.DetailsContainer .DetailsBodyWrapper {\n padding: 30px;\n}\n.DetailsContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n background-color: #0D0D4D;\n z-index: 1;\n text-wrap: nowrap;\n position: absolute;\n bottom: 0;\n left: 30px;\n}\n.DetailsContainer .BlogTitle {\n font-size: 24px;\n}\n.DetailsContainer .BlogContent {\n font-size: 14px;\n}\n.DetailsContainer .BlogContent p:last-child {\n margin-bottom: 0;\n}\n\n@container (max-width: 475px) {\n .DetailsContainer {\n font-size: 12px;\n }\n}";

@@ -117,6 +117,2 @@ const BlogArticleDetails = class {

/**
* Event name to be sent when the button is clicked
*/
this.postMessageEvent = 'articleActionButton';
/**
* Intl date format

@@ -184,3 +180,3 @@ */

connectedCallback() {
if (this.cmsEndpoint && this.language) {
if (this.cmsEndpoint && this.language && (this.postCustomPath || this.postSlug || this.postId)) {
this.getBlogArticleDetails();

@@ -195,3 +191,3 @@ }

this.isLoading = true;
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : this.postSlug || this.postId}`);
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : '/' + this.postSlug || '/' + this.postId}`);
url.searchParams.append('env', this.cmsEnv);

@@ -264,8 +260,11 @@ url.searchParams.append('userRoles', this.userRoles);

if (!this.isLoading) {
return (index.h("div", { ref: el => this.stylingContainer = el }, index.h("div", { class: "GridContainer" }, this.showPublishingDate &&
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.setImage(this.blogData.image), alt: this.blogData.image.slug })) : (((_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))));
return (index.h("div", { ref: el => this.stylingContainer = el }, index.h("div", { class: "DetailsContainer" }, index.h("div", { class: "DetailsHeadWrapper" }, this.showPublishingDate &&
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("div", { style: { background: `url(${this.setImage(this.blogData.image)}) no-repeat center center / cover` } })) : (((_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")))))), index.h("div", { class: "DetailsBodyWrapper" }, 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)))));
}
}
static get watchers() { return {
"postId": ["watchEndpoint"],
"postSlug": ["watchEndpoint"],
"postCustomPath": ["watchEndpoint"],
"cmsEndpoint": ["watchEndpoint"],

@@ -272,0 +271,0 @@ "language": ["watchEndpoint"]

2

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

@@ -18,3 +18,3 @@ 'use strict';

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"],"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"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"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"],"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"],"postId":[514,"post-id"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
});

2

dist/cjs/loader.cjs.js

@@ -17,3 +17,3 @@ 'use strict';

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"],"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"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"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"],"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"],"postId":[514,"post-id"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
});

@@ -20,0 +20,0 @@ };

51

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

@@ -43,6 +43,2 @@ import { Component, Prop, State, Watch, h, Listen } from '@stencil/core';

/**
* Event name to be sent when the button is clicked
*/
this.postMessageEvent = 'articleActionButton';
/**
* Intl date format

@@ -110,3 +106,3 @@ */

connectedCallback() {
if (this.cmsEndpoint && this.language) {
if (this.cmsEndpoint && this.language && (this.postCustomPath || this.postSlug || this.postId)) {
this.getBlogArticleDetails();

@@ -121,3 +117,3 @@ }

this.isLoading = true;
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : this.postSlug || this.postId}`);
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : '/' + this.postSlug || '/' + this.postId}`);
url.searchParams.append('env', this.cmsEnv);

@@ -193,9 +189,11 @@ url.searchParams.append('userRoles', this.userRoles);

return (h("div", { ref: el => this.stylingContainer = el },
h("div", { class: "GridContainer" },
this.showPublishingDate &&
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.setImage(this.blogData.image), alt: this.blogData.image.slug })) : (((_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))));
h("div", { class: "DetailsContainer" },
h("div", { class: "DetailsHeadWrapper" },
this.showPublishingDate &&
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("div", { style: { background: `url(${this.setImage(this.blogData.image)}) no-repeat center center / cover` } })) : (((_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")))))),
h("div", { class: "DetailsBodyWrapper" },
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)))));
}

@@ -391,20 +389,2 @@ }

},
"postMessageEvent": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "Event name to be sent when the button is clicked"
},
"attribute": "post-message-event",
"reflect": true,
"defaultValue": "'articleActionButton'"
},
"postId": {

@@ -488,2 +468,11 @@ "type": "number",

static get watchers() { return [{
"propName": "postId",
"methodName": "watchEndpoint"
}, {
"propName": "postSlug",
"methodName": "watchEndpoint"
}, {
"propName": "postCustomPath",
"methodName": "watchEndpoint"
}, {
"propName": "cmsEndpoint",

@@ -490,0 +479,0 @@ "methodName": "watchEndpoint"

20

dist/components/blog-article-details.js

@@ -70,3 +70,3 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';

const blogArticleDetailsCss = ":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 text-wrap: nowrap;\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}";
const blogArticleDetailsCss = ":host {\n display: block;\n}\n\n.DetailsContainer {\n background-color: #07072A;\n color: #fff;\n display: flex;\n flex-direction: column;\n}\n.DetailsContainer .BlogBanner div {\n height: 400px;\n}\n.DetailsContainer .DetailsHeadWrapper {\n position: relative;\n}\n.DetailsContainer .DetailsBodyWrapper {\n padding: 30px;\n}\n.DetailsContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n background-color: #0D0D4D;\n z-index: 1;\n text-wrap: nowrap;\n position: absolute;\n bottom: 0;\n left: 30px;\n}\n.DetailsContainer .BlogTitle {\n font-size: 24px;\n}\n.DetailsContainer .BlogContent {\n font-size: 14px;\n}\n.DetailsContainer .BlogContent p:last-child {\n margin-bottom: 0;\n}\n\n@container (max-width: 475px) {\n .DetailsContainer {\n font-size: 12px;\n }\n}";

@@ -115,6 +115,2 @@ const BlogArticleDetails$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {

/**
* Event name to be sent when the button is clicked
*/
this.postMessageEvent = 'articleActionButton';
/**
* Intl date format

@@ -182,3 +178,3 @@ */

connectedCallback() {
if (this.cmsEndpoint && this.language) {
if (this.cmsEndpoint && this.language && (this.postCustomPath || this.postSlug || this.postId)) {
this.getBlogArticleDetails();

@@ -193,3 +189,3 @@ }

this.isLoading = true;
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : this.postSlug || this.postId}`);
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : '/' + this.postSlug || '/' + this.postId}`);
url.searchParams.append('env', this.cmsEnv);

@@ -262,8 +258,11 @@ url.searchParams.append('userRoles', this.userRoles);

if (!this.isLoading) {
return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GridContainer" }, this.showPublishingDate &&
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.setImage(this.blogData.image), alt: this.blogData.image.slug })) : (((_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))));
return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "DetailsContainer" }, h("div", { class: "DetailsHeadWrapper" }, this.showPublishingDate &&
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("div", { style: { background: `url(${this.setImage(this.blogData.image)}) no-repeat center center / cover` } })) : (((_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")))))), h("div", { class: "DetailsBodyWrapper" }, 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)))));
}
}
static get watchers() { return {
"postId": ["watchEndpoint"],
"postSlug": ["watchEndpoint"],
"postCustomPath": ["watchEndpoint"],
"cmsEndpoint": ["watchEndpoint"],

@@ -284,3 +283,2 @@ "language": ["watchEndpoint"]

"showContent": [516, "show-content"],
"postMessageEvent": [513, "post-message-event"],
"postId": [514, "post-id"],

@@ -287,0 +285,0 @@ "postSlug": [513, "post-slug"],

19

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

@@ -70,3 +70,3 @@ import { r as registerInstance, h } from './index-a6d43dfd.js';

const blogArticleDetailsCss = ":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 text-wrap: nowrap;\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}";
const blogArticleDetailsCss = ":host {\n display: block;\n}\n\n.DetailsContainer {\n background-color: #07072A;\n color: #fff;\n display: flex;\n flex-direction: column;\n}\n.DetailsContainer .BlogBanner div {\n height: 400px;\n}\n.DetailsContainer .DetailsHeadWrapper {\n position: relative;\n}\n.DetailsContainer .DetailsBodyWrapper {\n padding: 30px;\n}\n.DetailsContainer .BlogDate {\n font-size: 12px;\n border-radius: 5px 5px 0 0;\n padding: 10px;\n width: fit-content;\n text-align: center;\n background-color: #0D0D4D;\n z-index: 1;\n text-wrap: nowrap;\n position: absolute;\n bottom: 0;\n left: 30px;\n}\n.DetailsContainer .BlogTitle {\n font-size: 24px;\n}\n.DetailsContainer .BlogContent {\n font-size: 14px;\n}\n.DetailsContainer .BlogContent p:last-child {\n margin-bottom: 0;\n}\n\n@container (max-width: 475px) {\n .DetailsContainer {\n font-size: 12px;\n }\n}";

@@ -113,6 +113,2 @@ const BlogArticleDetails = class {

/**
* Event name to be sent when the button is clicked
*/
this.postMessageEvent = 'articleActionButton';
/**
* Intl date format

@@ -180,3 +176,3 @@ */

connectedCallback() {
if (this.cmsEndpoint && this.language) {
if (this.cmsEndpoint && this.language && (this.postCustomPath || this.postSlug || this.postId)) {
this.getBlogArticleDetails();

@@ -191,3 +187,3 @@ }

this.isLoading = true;
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : this.postSlug || this.postId}`);
let url = new URL(`${this.cmsEndpoint}/${this.language}/blog-posts${this.postCustomPath ? '' : '/' + this.postSlug || '/' + this.postId}`);
url.searchParams.append('env', this.cmsEnv);

@@ -260,8 +256,11 @@ url.searchParams.append('userRoles', this.userRoles);

if (!this.isLoading) {
return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GridContainer" }, this.showPublishingDate &&
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.setImage(this.blogData.image), alt: this.blogData.image.slug })) : (((_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))));
return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "DetailsContainer" }, h("div", { class: "DetailsHeadWrapper" }, this.showPublishingDate &&
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("div", { style: { background: `url(${this.setImage(this.blogData.image)}) no-repeat center center / cover` } })) : (((_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")))))), h("div", { class: "DetailsBodyWrapper" }, 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)))));
}
}
static get watchers() { return {
"postId": ["watchEndpoint"],
"postSlug": ["watchEndpoint"],
"postCustomPath": ["watchEndpoint"],
"cmsEndpoint": ["watchEndpoint"],

@@ -268,0 +267,0 @@ "language": ["watchEndpoint"]

2

dist/esm/blog-article-details.js

@@ -16,3 +16,3 @@ import { p as promiseResolve, b as bootstrapLazy } from './index-a6d43dfd.js';

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"],"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"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"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"],"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"],"postId":[514,"post-id"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
});

2

dist/esm/loader.js

@@ -13,3 +13,3 @@ import { p as promiseResolve, b as bootstrapLazy } from './index-a6d43dfd.js';

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"],"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"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"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"],"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"],"postId":[514,"post-id"],"postSlug":[513,"post-slug"],"postCustomPath":[513,"post-custom-path"],"intlDateTimeFormat":[1,"intl-date-time-format"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"bannerMatrixReady":[32],"device":[32]},[[8,"BannerMatrixReady","handleBannerReady"]]]]]], options);
});

@@ -16,0 +16,0 @@ };

8

dist/types/components.d.ts

@@ -43,6 +43,2 @@ /* eslint-disable */

/**
* Event name to be sent when the button is clicked
*/
"postMessageEvent": string;
/**
* Slug of post

@@ -119,6 +115,2 @@ */

/**
* Event name to be sent when the button is clicked
*/
"postMessageEvent"?: string;
/**
* Slug of post

@@ -125,0 +117,0 @@ */

4

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

@@ -43,6 +43,2 @@ export declare class BlogArticleDetails {

/**
* Event name to be sent when the button is clicked
*/
postMessageEvent: string;
/**
* Showing post ID parameter

@@ -49,0 +45,0 @@ */

2

package.json
{
"name": "@everymatrix/blog-article-details",
"version": "1.27.3",
"version": "1.27.4",
"main": "./dist/index.cjs.js",

@@ -5,0 +5,0 @@ "module": "./dist/index.js",

dist/blog-article-details/p-9d4b45aa.entry.js
dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/blog-article-details/.stencil/packages/blog-article-details/stencil.config.d.ts
dist/collection/components/blog-article-details/blog-article-details.css

Sorry, the diff of this file is not supported yet