@everymatrix/general-footer-template 1.61.1 → 1.62.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/custom-content-section.cjs.entry.js +1 -1
- package/dist/cjs/general-footer-template.cjs.js +1 -1
- package/dist/cjs/image-list.cjs.entry.js +2 -27
- package/dist/cjs/link-section-list.cjs.entry.js +3 -28
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/ui-image_2.cjs.entry.js +8 -10
- package/dist/collection/components/custom-content-section/custom-content-section.js +1 -2
- package/dist/collection/components/general-footer-template/general-footer-template.js +1 -1
- package/dist/collection/components/image-list/image-list.js +2 -32
- package/dist/collection/components/link-section-list/link-section-list.js +4 -33
- package/dist/esm/custom-content-section.entry.js +1 -1
- package/dist/esm/general-footer-template.js +1 -1
- package/dist/esm/image-list.entry.js +3 -28
- package/dist/esm/link-section-list.entry.js +4 -29
- package/dist/esm/loader.js +1 -1
- package/dist/esm/ui-image_2.entry.js +9 -11
- package/dist/general-footer-template/general-footer-template.esm.js +1 -1
- package/dist/general-footer-template/p-1535f1fd.entry.js +1 -0
- package/dist/general-footer-template/p-3f9e0e81.entry.js +1 -0
- package/dist/general-footer-template/p-9c2e6761.entry.js +1 -0
- package/dist/general-footer-template/{p-bafd9490.entry.js → p-b09d1ead.entry.js} +1 -1
- package/dist/types/components/custom-content-section/custom-content-section.d.ts +0 -1
- package/dist/types/components/general-footer-template/general-footer-template.d.ts +1 -1
- package/dist/types/components/image-list/image-list.d.ts +0 -8
- package/dist/types/components/link-section-list/link-section-list.d.ts +1 -8
- package/package.json +1 -1
- package/dist/general-footer-template/p-99c0545b.entry.js +0 -1
- package/dist/general-footer-template/p-d6f0d5e4.entry.js +0 -1
- package/dist/general-footer-template/p-fef8e428.entry.js +0 -1
|
@@ -9549,7 +9549,7 @@ const CustomContentSection = class {
|
|
|
9549
9549
|
a: ['href', 'target', 'rel']
|
|
9550
9550
|
}
|
|
9551
9551
|
});
|
|
9552
|
-
return index$2.h("div", { key: '
|
|
9552
|
+
return index$2.h("div", { key: 'a4613d65e38bb44dacda6d6d1df9a3cf32845167', class: "CustomContentSectionContainer" }, index$2.h("div", { key: 'f6704f1e13d3a5dd188318cad51babdd8af8b2f1', class: "CustomContentSectionWrapper" }, index$2.h("div", { key: 'e818696e2ef290f92905adbac46fdd9f5ddf3e6c', class: "CustomContentSectionContent", innerHTML: clean }), this.repeaterContent ? index$2.h("image-list", { style: { width: "100%" }, repeaterContent: this.repeaterContent ? this.repeaterContent : null, "navigate-via-event": this.navigateViaEvent, "post-message-event": this.postMessageEvent }) : ''));
|
|
9553
9553
|
}
|
|
9554
9554
|
};
|
|
9555
9555
|
CustomContentSection.style = CustomContentSectionStyle0;
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["custom-content-section.cjs",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list.cjs",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]
|
|
22
|
+
return index.bootstrapLazy([["custom-content-section.cjs",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list.cjs",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["custom-clock.cjs",[[2,"custom-clock",{"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"translationUrl":[513,"translation-url"],"language":[513],"timeString":[32]},null,{"translationUrl":["handleNewTranslations"]}]]],["general-footer-template.cjs",[[1,"general-footer-template",{"language":[513],"sections":[513],"endpoint":[513],"env":[513],"userRoles":[513,"user-roles"],"userid":[513],"session":[513],"baseUrl":[513,"base-url"],"navigateViaEvent":[513,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"mbSource":[513,"mb-source"],"hasErrors":[32]}]]],["ui-image_2.cjs",[[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}]]],["image-list.cjs",[[2,"image-list",{"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -13,41 +13,16 @@ const ImageList = class {
|
|
|
13
13
|
this.navigateLink = (url, target, externalLink) => {
|
|
14
14
|
window.postMessage({ type: this.postMessageEvent, path: url, url, target, externalLink }, window.location.href);
|
|
15
15
|
};
|
|
16
|
-
this.onImageLoad = () => {
|
|
17
|
-
this.removeLoadingState();
|
|
18
|
-
this.cleanupListeners();
|
|
19
|
-
};
|
|
20
16
|
this.repeaterContent = undefined;
|
|
21
17
|
this.navigateViaEvent = false;
|
|
22
18
|
this.postMessageEvent = '';
|
|
23
|
-
this.skeletonLoading = true;
|
|
24
|
-
}
|
|
25
|
-
componentDidLoad() {
|
|
26
|
-
this.initImageListeners();
|
|
27
|
-
}
|
|
28
|
-
initImageListeners() {
|
|
29
|
-
if (!this.imgRef)
|
|
30
|
-
return;
|
|
31
|
-
if (this.imgRef.complete) {
|
|
32
|
-
this.onImageLoad();
|
|
33
|
-
return;
|
|
34
|
-
}
|
|
35
|
-
this.imgRef.addEventListener('load', this.onImageLoad);
|
|
36
|
-
}
|
|
37
|
-
removeLoadingState() {
|
|
38
|
-
this.skeletonLoading = false;
|
|
39
|
-
}
|
|
40
|
-
cleanupListeners() {
|
|
41
|
-
var _a;
|
|
42
|
-
(_a = this.imgRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('load', this.onImageLoad);
|
|
43
19
|
}
|
|
44
20
|
render() {
|
|
45
21
|
var _a, _b, _c, _d;
|
|
46
|
-
return ((_a = this.repeaterContent) === null || _a === void 0 ? void 0 : _a.content.length) > 0 && index.h("div", { key: '
|
|
47
|
-
return (index.h("div", { class: 'ImageListIcon' }, this.navigateViaEvent === true ? (index.h("div", { class: 'ImageListIcon', style: { cursor: 'pointer' }, onClick: () => this.navigateLink(repeater === null || repeater === void 0 ? void 0 : repeater.url, repeater === null || repeater === void 0 ? void 0 : repeater.target, repeater === null || repeater === void 0 ? void 0 : repeater.isExternalLink) }, index.h("div", { class: "ContainerImage" }, index.h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon"
|
|
22
|
+
return ((_a = this.repeaterContent) === null || _a === void 0 ? void 0 : _a.content.length) > 0 && index.h("div", { key: 'e7604ed1dcace3e2bd67c74e677e5c849c9c8407', class: "ImageListContainer" }, index.h("div", { key: '985672261fcfeac501d1182f5ab9f20e82307cc7', class: "ImageListWrapper" }, index.h("div", { key: '29b903e7bd639b8eb782d5aa6b646098ceee1ced', class: "ImageListSectionTitle" }, (_b = this.repeaterContent) === null || _b === void 0 ? void 0 : _b.categoryTitle), index.h("div", { key: '6cf6da5d3480a5f6d25c9d106e143dbb222e3b74', class: "ImageListLineup" }, (_d = (_c = this.repeaterContent) === null || _c === void 0 ? void 0 : _c.content) === null || _d === void 0 ? void 0 : _d.map(repeater => {
|
|
23
|
+
return (index.h("div", { class: 'ImageListIcon' }, this.navigateViaEvent === true ? (index.h("div", { class: 'ImageListIcon', style: { cursor: 'pointer' }, onClick: () => this.navigateLink(repeater === null || repeater === void 0 ? void 0 : repeater.url, repeater === null || repeater === void 0 ? void 0 : repeater.target, repeater === null || repeater === void 0 ? void 0 : repeater.isExternalLink) }, index.h("div", { class: "ContainerImage" }, index.h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon" })), index.h("p", null, repeater === null || repeater === void 0 ? void 0 : repeater.title))) : (index.h("a", { href: (repeater === null || repeater === void 0 ? void 0 : repeater.url) || 'javascript:void(0)', target: (repeater === null || repeater === void 0 ? void 0 : repeater.target) || '_parent' }, index.h("div", { class: "ContainerImage" }, index.h("div", { class: "ImageListPositioner" }, index.h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon" }))), index.h("p", null, repeater === null || repeater === void 0 ? void 0 : repeater.title)))));
|
|
48
24
|
}))));
|
|
49
25
|
}
|
|
50
|
-
get el() { return index.getElement(this); }
|
|
51
26
|
};
|
|
52
27
|
ImageList.style = ImageListStyle0;
|
|
53
28
|
|
|
@@ -10,35 +10,11 @@ const LinkSectionListStyle0 = linkSectionListCss;
|
|
|
10
10
|
const LinkSectionList = class {
|
|
11
11
|
constructor(hostRef) {
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
|
-
this.onImageLoad = () => {
|
|
14
|
-
this.removeLoadingState();
|
|
15
|
-
this.cleanupListeners();
|
|
16
|
-
};
|
|
17
13
|
this.repeaterContent = undefined;
|
|
18
14
|
this.baseUrl = undefined;
|
|
19
15
|
this.language = undefined;
|
|
20
16
|
this.navigateViaEvent = false;
|
|
21
17
|
this.postMessageEvent = '';
|
|
22
|
-
this.skeletonLoading = true;
|
|
23
|
-
}
|
|
24
|
-
componentDidLoad() {
|
|
25
|
-
this.initImageListeners();
|
|
26
|
-
}
|
|
27
|
-
initImageListeners() {
|
|
28
|
-
if (!this.imgRef)
|
|
29
|
-
return;
|
|
30
|
-
if (this.imgRef.complete) {
|
|
31
|
-
this.onImageLoad();
|
|
32
|
-
return;
|
|
33
|
-
}
|
|
34
|
-
this.imgRef.addEventListener('load', this.onImageLoad);
|
|
35
|
-
}
|
|
36
|
-
removeLoadingState() {
|
|
37
|
-
this.skeletonLoading = false;
|
|
38
|
-
}
|
|
39
|
-
cleanupListeners() {
|
|
40
|
-
var _a;
|
|
41
|
-
(_a = this.imgRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('load', this.onImageLoad);
|
|
42
18
|
}
|
|
43
19
|
navigateLink(link) {
|
|
44
20
|
window.postMessage({ type: this.postMessageEvent, path: link.linkUrl, url: link.linkUrl, target: link.target, externalLink: link.externalLink }, window.location.href);
|
|
@@ -72,15 +48,14 @@ const LinkSectionList = class {
|
|
|
72
48
|
}
|
|
73
49
|
return obj;
|
|
74
50
|
}, []);
|
|
75
|
-
return index.h("div", { class: "LinkSectionListContainer" }, index.h("div", { class: "LinkSectionListWrapper" }, this.repeaterContent.categoryTitle && index.h("h2", { class: "LinkSectionListTitle" }, this.repeaterContent.categoryTitle), linkSections.map(category => index.h("ul", null, category.categoryTitle && index.h("p", null, category.categoryTitle), category.links.map(link => index.h("li", { class: "LinkSectionListLink", key: link.linkName }, this.navigateViaEvent === true ? (index.h("span", null, link.linkName && link.icon ? (index.h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, index.h("div", { class: "ContainerImage" }, index.h("
|
|
51
|
+
return index.h("div", { class: "LinkSectionListContainer" }, index.h("div", { class: "LinkSectionListWrapper" }, this.repeaterContent.categoryTitle && index.h("h2", { class: "LinkSectionListTitle" }, this.repeaterContent.categoryTitle), linkSections.map(category => index.h("ul", null, category.categoryTitle && index.h("p", null, category.categoryTitle), category.links.map(link => index.h("li", { class: "LinkSectionListLink", key: link.linkName }, this.navigateViaEvent === true ? (index.h("span", null, link.linkName && link.icon ? (index.h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, index.h("div", { class: "ContainerImage" }, index.h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })), index.h("span", { class: '' }, link.linkName, " "))) :
|
|
76
52
|
link.linkName ?
|
|
77
53
|
index.h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, index.h("span", null, link.linkName, " "))
|
|
78
54
|
:
|
|
79
|
-
index.h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, index.h("div", { class: "ContainerImage" }, index.h("
|
|
55
|
+
index.h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, index.h("div", { class: "ContainerImage" }, index.h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" }))))) : (index.h("a", { class: "LinkSectionListLink", href: link.externalLink ? link.linkUrl : `${this.baseUrl}/${this.language}${link.linkUrl}`, target: link.target || '_blank' }, link.linkName && link.icon ? (index.h("span", { class: "LinkSectionListLinkText" }, index.h("div", { class: "ContainerImage" }, index.h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })), index.h("span", null, link.linkName))) :
|
|
80
56
|
link.linkName ? (index.h("span", { class: "LinkSectionListLinkText" }, index.h("span", null, link.linkName))) :
|
|
81
|
-
index.h("span", { class: "LinkSectionListLinkText" }, index.h("div", { class: "ContainerImage" }, index.h("
|
|
57
|
+
index.h("span", { class: "LinkSectionListLinkText" }, index.h("div", { class: "ContainerImage" }, index.h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })))))))))));
|
|
82
58
|
}
|
|
83
|
-
get el() { return index.getElement(this); }
|
|
84
59
|
};
|
|
85
60
|
LinkSectionList.style = LinkSectionListStyle0;
|
|
86
61
|
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
|
|
|
8
8
|
const defineCustomElements = async (win, options) => {
|
|
9
9
|
if (typeof window === 'undefined') return undefined;
|
|
10
10
|
await appGlobals.globalScripts();
|
|
11
|
-
return index.bootstrapLazy([["custom-content-section.cjs",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list.cjs",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]
|
|
11
|
+
return index.bootstrapLazy([["custom-content-section.cjs",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list.cjs",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["custom-clock.cjs",[[2,"custom-clock",{"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"translationUrl":[513,"translation-url"],"language":[513],"timeString":[32]},null,{"translationUrl":["handleNewTranslations"]}]]],["general-footer-template.cjs",[[1,"general-footer-template",{"language":[513],"sections":[513],"endpoint":[513],"env":[513],"userRoles":[513,"user-roles"],"userid":[513],"session":[513],"baseUrl":[513,"base-url"],"navigateViaEvent":[513,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"mbSource":[513,"mb-source"],"hasErrors":[32]}]]],["ui-image_2.cjs",[[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}]]],["image-list.cjs",[[2,"image-list",{"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]]], options);
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
exports.setNonce = index.setNonce;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-4f1d0ebb.js');
|
|
6
6
|
|
|
7
|
-
const uiImageCss = "
|
|
7
|
+
const uiImageCss = ".HostContainer{display:block}.UiContainer{height:100%;width:100%;border-radius:inherit}.UiContainer .Image{border-radius:inherit}.Hidden{opacity:0;transition:opacity 0.5s ease-in-out}.Visible{opacity:1;transition:opacity 0.5s ease-in-out}";
|
|
8
8
|
const UiImageStyle0 = uiImageCss;
|
|
9
9
|
|
|
10
10
|
const UiImage = class {
|
|
@@ -14,7 +14,6 @@ const UiImage = class {
|
|
|
14
14
|
this.width = undefined;
|
|
15
15
|
this.height = undefined;
|
|
16
16
|
this.alt = undefined;
|
|
17
|
-
this.imgClass = '';
|
|
18
17
|
this.styles = undefined;
|
|
19
18
|
this.detectDistance = '200px';
|
|
20
19
|
this.imgLoaded = false;
|
|
@@ -24,15 +23,14 @@ const UiImage = class {
|
|
|
24
23
|
if (!this.shouldLoad) {
|
|
25
24
|
return;
|
|
26
25
|
}
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
tempImage.onload = () => {
|
|
26
|
+
const preloadedImage = new Image();
|
|
27
|
+
preloadedImage.onload = () => {
|
|
30
28
|
if (this.image) {
|
|
31
29
|
this.image.src = this.src;
|
|
32
30
|
this.imgLoaded = true;
|
|
33
|
-
this.el.dispatchEvent(new CustomEvent('load', { bubbles: true }));
|
|
34
31
|
}
|
|
35
32
|
};
|
|
33
|
+
preloadedImage.src = this.src;
|
|
36
34
|
}
|
|
37
35
|
componentDidLoad() {
|
|
38
36
|
if ('IntersectionObserver' in window) {
|
|
@@ -59,7 +57,7 @@ const UiImage = class {
|
|
|
59
57
|
}
|
|
60
58
|
}
|
|
61
59
|
render() {
|
|
62
|
-
return (index.h("img", { key: '
|
|
60
|
+
return (index.h(index.Host, { key: '527318220c6b48375943e897fe0e53e0f33e67ed', class: "HostContainer" }, !this.imgLoaded && (index.h("ui-skeleton", { key: 'e5c49a781ff2fac5c796cb6a3f8d334dce7be35b', class: "UiContainer", structure: "image", width: "100%", height: "100%" })), index.h("img", { key: '09dfbf8f52c2c899246590790f2780a84bdeefc3', ref: (el) => (this.image = el), src: this.shouldLoad ? this.src : undefined, onLoad: () => (this.imgLoaded = true), style: this.styles, class: `UiContainer ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" })));
|
|
63
61
|
}
|
|
64
62
|
get el() { return index.getElement(this); }
|
|
65
63
|
static get watchers() { return {
|
|
@@ -68,7 +66,7 @@ const UiImage = class {
|
|
|
68
66
|
};
|
|
69
67
|
UiImage.style = UiImageStyle0;
|
|
70
68
|
|
|
71
|
-
const uiSkeletonCss = ":host{display:block;--emw-skeleton-rectangle-background:#c2c2c2;--emw-skeleton-circle-background:#c2c2c2;--emw-skeleton-text-background:#c2c2c2;--emw-skeleton-title-background:#c2c2c2;--emw-skeleton-image-background:#c2c2c2;--emw-skeleton-logo-background:#c2c2c2;--emw-skeleton-primary-color:#e0e0e0;--emw-skeleton-secondary-color:#f0f0f0}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 2px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 5px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:var(--emw-skeleton-text-width-100, 300px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 5px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width,
|
|
69
|
+
const uiSkeletonCss = ":host{display:block;--emw-skeleton-rectangle-background:#c2c2c2;--emw-skeleton-circle-background:#c2c2c2;--emw-skeleton-text-background:#c2c2c2;--emw-skeleton-title-background:#c2c2c2;--emw-skeleton-image-background:#c2c2c2;--emw-skeleton-logo-background:#c2c2c2;--emw-skeleton-primary-color:#e0e0e0;--emw-skeleton-secondary-color:#f0f0f0}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 2px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 5px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:var(--emw-skeleton-text-width-100, 300px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 5px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, inherit)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 5px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, var(--emw-skeleton-color-0, #c2c2c2))}100%{background-color:var(--emw-skeleton-secondary-color, var(--emw-skeleton-color-100, #f0f0f0))}}";
|
|
72
70
|
const UiSkeletonStyle0 = uiSkeletonCss;
|
|
73
71
|
|
|
74
72
|
const UiSkeleton = class {
|
|
@@ -116,7 +114,7 @@ const UiSkeleton = class {
|
|
|
116
114
|
return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: "Logo " + (this.animation ? 'Skeleton' : '') })));
|
|
117
115
|
}
|
|
118
116
|
renderImage() {
|
|
119
|
-
return (index.h("div", { class: "
|
|
117
|
+
return (index.h("div", { class: "Image " + (this.animation ? 'Skeleton' : '') }));
|
|
120
118
|
}
|
|
121
119
|
renderTitle() {
|
|
122
120
|
return (index.h("div", { class: "SkeletonContainer" }, index.h("div", { class: "Title " + (this.animation ? 'Skeleton' : '') })));
|
|
@@ -226,7 +224,7 @@ const UiSkeleton = class {
|
|
|
226
224
|
default:
|
|
227
225
|
styleBlock = '';
|
|
228
226
|
}
|
|
229
|
-
return (index.h(index.Host, { key: '
|
|
227
|
+
return (index.h(index.Host, { key: '3bb792a149db7fe732d5cbfa092cdb4d6ca0689e' }, index.h("style", { key: 'a4607599b60659f385ae2660513e38b383739674' }, styleBlock), this.handleStructure(this.structure)));
|
|
230
228
|
}
|
|
231
229
|
static get watchers() { return {
|
|
232
230
|
"structure": ["handleStructureChange"]
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
import sanitizeHtml from "sanitize-html";
|
|
3
|
-
import "../../../../../ui-skeleton/dist/types/index";
|
|
4
3
|
export class CustomContentSection {
|
|
5
4
|
constructor() {
|
|
6
5
|
this.customContent = undefined;
|
|
@@ -16,7 +15,7 @@ export class CustomContentSection {
|
|
|
16
15
|
a: ['href', 'target', 'rel']
|
|
17
16
|
}
|
|
18
17
|
});
|
|
19
|
-
return h("div", { key: '
|
|
18
|
+
return h("div", { key: 'a4613d65e38bb44dacda6d6d1df9a3cf32845167', class: "CustomContentSectionContainer" }, h("div", { key: 'f6704f1e13d3a5dd188318cad51babdd8af8b2f1', class: "CustomContentSectionWrapper" }, h("div", { key: 'e818696e2ef290f92905adbac46fdd9f5ddf3e6c', class: "CustomContentSectionContent", innerHTML: clean }), this.repeaterContent ? h("image-list", { style: { width: "100%" }, repeaterContent: this.repeaterContent ? this.repeaterContent : null, "navigate-via-event": this.navigateViaEvent, "post-message-event": this.postMessageEvent }) : ''));
|
|
20
19
|
}
|
|
21
20
|
static get is() { return "custom-content-section"; }
|
|
22
21
|
static get encapsulation() { return "scoped"; }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
import { componentRules, normalizeRepeaterContent, getDevicePlatform } from "../../utils/utils";
|
|
3
3
|
import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
|
|
4
|
-
import "../../../../../ui-
|
|
4
|
+
import "../../../../../ui-image/dist/types/index";
|
|
5
5
|
export class GeneralFooterTemplate {
|
|
6
6
|
constructor() {
|
|
7
7
|
this.platform = getDevicePlatform();
|
|
@@ -5,38 +5,14 @@ export class ImageList {
|
|
|
5
5
|
this.navigateLink = (url, target, externalLink) => {
|
|
6
6
|
window.postMessage({ type: this.postMessageEvent, path: url, url, target, externalLink }, window.location.href);
|
|
7
7
|
};
|
|
8
|
-
this.onImageLoad = () => {
|
|
9
|
-
this.removeLoadingState();
|
|
10
|
-
this.cleanupListeners();
|
|
11
|
-
};
|
|
12
8
|
this.repeaterContent = undefined;
|
|
13
9
|
this.navigateViaEvent = false;
|
|
14
10
|
this.postMessageEvent = '';
|
|
15
|
-
this.skeletonLoading = true;
|
|
16
|
-
}
|
|
17
|
-
componentDidLoad() {
|
|
18
|
-
this.initImageListeners();
|
|
19
|
-
}
|
|
20
|
-
initImageListeners() {
|
|
21
|
-
if (!this.imgRef)
|
|
22
|
-
return;
|
|
23
|
-
if (this.imgRef.complete) {
|
|
24
|
-
this.onImageLoad();
|
|
25
|
-
return;
|
|
26
|
-
}
|
|
27
|
-
this.imgRef.addEventListener('load', this.onImageLoad);
|
|
28
|
-
}
|
|
29
|
-
removeLoadingState() {
|
|
30
|
-
this.skeletonLoading = false;
|
|
31
|
-
}
|
|
32
|
-
cleanupListeners() {
|
|
33
|
-
var _a;
|
|
34
|
-
(_a = this.imgRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('load', this.onImageLoad);
|
|
35
11
|
}
|
|
36
12
|
render() {
|
|
37
13
|
var _a, _b, _c, _d;
|
|
38
|
-
return ((_a = this.repeaterContent) === null || _a === void 0 ? void 0 : _a.content.length) > 0 && h("div", { key: '
|
|
39
|
-
return (h("div", { class: 'ImageListIcon' }, this.navigateViaEvent === true ? (h("div", { class: 'ImageListIcon', style: { cursor: 'pointer' }, onClick: () => this.navigateLink(repeater === null || repeater === void 0 ? void 0 : repeater.url, repeater === null || repeater === void 0 ? void 0 : repeater.target, repeater === null || repeater === void 0 ? void 0 : repeater.isExternalLink) }, h("div", { class: "ContainerImage" }, h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon"
|
|
14
|
+
return ((_a = this.repeaterContent) === null || _a === void 0 ? void 0 : _a.content.length) > 0 && h("div", { key: 'e7604ed1dcace3e2bd67c74e677e5c849c9c8407', class: "ImageListContainer" }, h("div", { key: '985672261fcfeac501d1182f5ab9f20e82307cc7', class: "ImageListWrapper" }, h("div", { key: '29b903e7bd639b8eb782d5aa6b646098ceee1ced', class: "ImageListSectionTitle" }, (_b = this.repeaterContent) === null || _b === void 0 ? void 0 : _b.categoryTitle), h("div", { key: '6cf6da5d3480a5f6d25c9d106e143dbb222e3b74', class: "ImageListLineup" }, (_d = (_c = this.repeaterContent) === null || _c === void 0 ? void 0 : _c.content) === null || _d === void 0 ? void 0 : _d.map(repeater => {
|
|
15
|
+
return (h("div", { class: 'ImageListIcon' }, this.navigateViaEvent === true ? (h("div", { class: 'ImageListIcon', style: { cursor: 'pointer' }, onClick: () => this.navigateLink(repeater === null || repeater === void 0 ? void 0 : repeater.url, repeater === null || repeater === void 0 ? void 0 : repeater.target, repeater === null || repeater === void 0 ? void 0 : repeater.isExternalLink) }, h("div", { class: "ContainerImage" }, h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon" })), h("p", null, repeater === null || repeater === void 0 ? void 0 : repeater.title))) : (h("a", { href: (repeater === null || repeater === void 0 ? void 0 : repeater.url) || 'javascript:void(0)', target: (repeater === null || repeater === void 0 ? void 0 : repeater.target) || '_parent' }, h("div", { class: "ContainerImage" }, h("div", { class: "ImageListPositioner" }, h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon" }))), h("p", null, repeater === null || repeater === void 0 ? void 0 : repeater.title)))));
|
|
40
16
|
}))));
|
|
41
17
|
}
|
|
42
18
|
static get is() { return "image-list"; }
|
|
@@ -108,10 +84,4 @@ export class ImageList {
|
|
|
108
84
|
}
|
|
109
85
|
};
|
|
110
86
|
}
|
|
111
|
-
static get states() {
|
|
112
|
-
return {
|
|
113
|
-
"skeletonLoading": {}
|
|
114
|
-
};
|
|
115
|
-
}
|
|
116
|
-
static get elementRef() { return "el"; }
|
|
117
87
|
}
|
|
@@ -1,35 +1,12 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
|
+
import "../../../../../ui-image/dist/types/index";
|
|
2
3
|
export class LinkSectionList {
|
|
3
4
|
constructor() {
|
|
4
|
-
this.onImageLoad = () => {
|
|
5
|
-
this.removeLoadingState();
|
|
6
|
-
this.cleanupListeners();
|
|
7
|
-
};
|
|
8
5
|
this.repeaterContent = undefined;
|
|
9
6
|
this.baseUrl = undefined;
|
|
10
7
|
this.language = undefined;
|
|
11
8
|
this.navigateViaEvent = false;
|
|
12
9
|
this.postMessageEvent = '';
|
|
13
|
-
this.skeletonLoading = true;
|
|
14
|
-
}
|
|
15
|
-
componentDidLoad() {
|
|
16
|
-
this.initImageListeners();
|
|
17
|
-
}
|
|
18
|
-
initImageListeners() {
|
|
19
|
-
if (!this.imgRef)
|
|
20
|
-
return;
|
|
21
|
-
if (this.imgRef.complete) {
|
|
22
|
-
this.onImageLoad();
|
|
23
|
-
return;
|
|
24
|
-
}
|
|
25
|
-
this.imgRef.addEventListener('load', this.onImageLoad);
|
|
26
|
-
}
|
|
27
|
-
removeLoadingState() {
|
|
28
|
-
this.skeletonLoading = false;
|
|
29
|
-
}
|
|
30
|
-
cleanupListeners() {
|
|
31
|
-
var _a;
|
|
32
|
-
(_a = this.imgRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('load', this.onImageLoad);
|
|
33
10
|
}
|
|
34
11
|
navigateLink(link) {
|
|
35
12
|
window.postMessage({ type: this.postMessageEvent, path: link.linkUrl, url: link.linkUrl, target: link.target, externalLink: link.externalLink }, window.location.href);
|
|
@@ -63,13 +40,13 @@ export class LinkSectionList {
|
|
|
63
40
|
}
|
|
64
41
|
return obj;
|
|
65
42
|
}, []);
|
|
66
|
-
return h("div", { class: "LinkSectionListContainer" }, h("div", { class: "LinkSectionListWrapper" }, this.repeaterContent.categoryTitle && h("h2", { class: "LinkSectionListTitle" }, this.repeaterContent.categoryTitle), linkSections.map(category => h("ul", null, category.categoryTitle && h("p", null, category.categoryTitle), category.links.map(link => h("li", { class: "LinkSectionListLink", key: link.linkName }, this.navigateViaEvent === true ? (h("span", null, link.linkName && link.icon ? (h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("
|
|
43
|
+
return h("div", { class: "LinkSectionListContainer" }, h("div", { class: "LinkSectionListWrapper" }, this.repeaterContent.categoryTitle && h("h2", { class: "LinkSectionListTitle" }, this.repeaterContent.categoryTitle), linkSections.map(category => h("ul", null, category.categoryTitle && h("p", null, category.categoryTitle), category.links.map(link => h("li", { class: "LinkSectionListLink", key: link.linkName }, this.navigateViaEvent === true ? (h("span", null, link.linkName && link.icon ? (h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })), h("span", { class: '' }, link.linkName, " "))) :
|
|
67
44
|
link.linkName ?
|
|
68
45
|
h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("span", null, link.linkName, " "))
|
|
69
46
|
:
|
|
70
|
-
h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("
|
|
47
|
+
h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" }))))) : (h("a", { class: "LinkSectionListLink", href: link.externalLink ? link.linkUrl : `${this.baseUrl}/${this.language}${link.linkUrl}`, target: link.target || '_blank' }, link.linkName && link.icon ? (h("span", { class: "LinkSectionListLinkText" }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })), h("span", null, link.linkName))) :
|
|
71
48
|
link.linkName ? (h("span", { class: "LinkSectionListLinkText" }, h("span", null, link.linkName))) :
|
|
72
|
-
h("span", { class: "LinkSectionListLinkText" }, h("div", { class: "ContainerImage" }, h("
|
|
49
|
+
h("span", { class: "LinkSectionListLinkText" }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })))))))))));
|
|
73
50
|
}
|
|
74
51
|
static get is() { return "link-section-list"; }
|
|
75
52
|
static get originalStyleUrls() {
|
|
@@ -173,10 +150,4 @@ export class LinkSectionList {
|
|
|
173
150
|
}
|
|
174
151
|
};
|
|
175
152
|
}
|
|
176
|
-
static get states() {
|
|
177
|
-
return {
|
|
178
|
-
"skeletonLoading": {}
|
|
179
|
-
};
|
|
180
|
-
}
|
|
181
|
-
static get elementRef() { return "el"; }
|
|
182
153
|
}
|
|
@@ -9545,7 +9545,7 @@ const CustomContentSection = class {
|
|
|
9545
9545
|
a: ['href', 'target', 'rel']
|
|
9546
9546
|
}
|
|
9547
9547
|
});
|
|
9548
|
-
return h("div", { key: '
|
|
9548
|
+
return h("div", { key: 'a4613d65e38bb44dacda6d6d1df9a3cf32845167', class: "CustomContentSectionContainer" }, h("div", { key: 'f6704f1e13d3a5dd188318cad51babdd8af8b2f1', class: "CustomContentSectionWrapper" }, h("div", { key: 'e818696e2ef290f92905adbac46fdd9f5ddf3e6c', class: "CustomContentSectionContent", innerHTML: clean }), this.repeaterContent ? h("image-list", { style: { width: "100%" }, repeaterContent: this.repeaterContent ? this.repeaterContent : null, "navigate-via-event": this.navigateViaEvent, "post-message-event": this.postMessageEvent }) : ''));
|
|
9549
9549
|
}
|
|
9550
9550
|
};
|
|
9551
9551
|
CustomContentSection.style = CustomContentSectionStyle0;
|
|
@@ -16,5 +16,5 @@ var patchBrowser = () => {
|
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(async (options) => {
|
|
18
18
|
await globalScripts();
|
|
19
|
-
return bootstrapLazy([["custom-content-section",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]
|
|
19
|
+
return bootstrapLazy([["custom-content-section",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["custom-clock",[[2,"custom-clock",{"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"translationUrl":[513,"translation-url"],"language":[513],"timeString":[32]},null,{"translationUrl":["handleNewTranslations"]}]]],["general-footer-template",[[1,"general-footer-template",{"language":[513],"sections":[513],"endpoint":[513],"env":[513],"userRoles":[513,"user-roles"],"userid":[513],"session":[513],"baseUrl":[513,"base-url"],"navigateViaEvent":[513,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"mbSource":[513,"mb-source"],"hasErrors":[32]}]]],["ui-image_2",[[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}]]],["image-list",[[2,"image-list",{"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]]], options);
|
|
20
20
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { r as registerInstance, h
|
|
1
|
+
import { r as registerInstance, h } from './index-83985f06.js';
|
|
2
2
|
|
|
3
3
|
const imageListCss = ".sc-image-list-h {\n display: block;\n margin: 0;\n padding: 0;\n}\n\n.ContainerImage.sc-image-list {\n position: relative;\n display: inline-block;\n width: 100%;\n}\n\n.SkeletonWrapper.sc-image-list {\n background-color: #f0f0f0;\n width: 50px;\n height: 40px;\n}\n\n.ImageListContainer.sc-image-list {\n height: 100%;\n}\n.ImageListWrapper.sc-image-list {\n box-sizing: border-box;\n height: 100%;\n display: flex;\n flex-direction: column;\n max-width: 90%;\n margin: auto;\n padding: var(--emw--spacing-large, 20px) 0;\n}\n.ImageListSectionTitle.sc-image-list {\n width: 100%;\n display: flex;\n justify-content: left;\n align-content: center;\n padding: var(--emw--spacing-large, 20px) var(--emw--spacing-medium, 14px) var(--emw--spacing-x-large, 30px);\n color: var(--emw--footer-typography, var(--emw--color-thpography, #fff));\n text-transform: uppercase;\n font-size: 24px;\n font-weight: 100;\n}\n.ImageListLineup.sc-image-list {\n box-sizing: border-box;\n display: flex;\n flex-wrap: wrap;\n gap: var(--emw--spacing-x-large, 30px);\n justify-content: left;\n align-items: flex-start;\n padding-left: var(--emw--spacing-large, 20px);\n}\n.ImageListIcon.sc-image-list img.sc-image-list {\n max-height: var(--emw--size-medium-2x-minus, 40px);\n}\n\na.sc-image-list {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-end;\n text-decoration: none;\n}\n\na.sc-image-list p.sc-image-list {\n text-decoration: none;\n color: var(--emw--color-gray-100, #666);\n margin: 0;\n}\n\n@container (max-width: 750px) {\n .ImageListSectionTitle.sc-image-list {\n justify-content: center;\n font-size: var(--emw--font-size-medium, 16px);\n color: var(--emw--footer-typography, var(--emw--color-thpography, #fff));\n padding: var(--emw--spacing-large, 20px) 0 var(--emw--spacing-x-large, 30px);\n justify-content: center;\n }\n .ImageListLineup.sc-image-list {\n justify-content: center;\n padding: 0;\n }\n}";
|
|
4
4
|
const ImageListStyle0 = imageListCss;
|
|
@@ -9,41 +9,16 @@ const ImageList = class {
|
|
|
9
9
|
this.navigateLink = (url, target, externalLink) => {
|
|
10
10
|
window.postMessage({ type: this.postMessageEvent, path: url, url, target, externalLink }, window.location.href);
|
|
11
11
|
};
|
|
12
|
-
this.onImageLoad = () => {
|
|
13
|
-
this.removeLoadingState();
|
|
14
|
-
this.cleanupListeners();
|
|
15
|
-
};
|
|
16
12
|
this.repeaterContent = undefined;
|
|
17
13
|
this.navigateViaEvent = false;
|
|
18
14
|
this.postMessageEvent = '';
|
|
19
|
-
this.skeletonLoading = true;
|
|
20
|
-
}
|
|
21
|
-
componentDidLoad() {
|
|
22
|
-
this.initImageListeners();
|
|
23
|
-
}
|
|
24
|
-
initImageListeners() {
|
|
25
|
-
if (!this.imgRef)
|
|
26
|
-
return;
|
|
27
|
-
if (this.imgRef.complete) {
|
|
28
|
-
this.onImageLoad();
|
|
29
|
-
return;
|
|
30
|
-
}
|
|
31
|
-
this.imgRef.addEventListener('load', this.onImageLoad);
|
|
32
|
-
}
|
|
33
|
-
removeLoadingState() {
|
|
34
|
-
this.skeletonLoading = false;
|
|
35
|
-
}
|
|
36
|
-
cleanupListeners() {
|
|
37
|
-
var _a;
|
|
38
|
-
(_a = this.imgRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('load', this.onImageLoad);
|
|
39
15
|
}
|
|
40
16
|
render() {
|
|
41
17
|
var _a, _b, _c, _d;
|
|
42
|
-
return ((_a = this.repeaterContent) === null || _a === void 0 ? void 0 : _a.content.length) > 0 && h("div", { key: '
|
|
43
|
-
return (h("div", { class: 'ImageListIcon' }, this.navigateViaEvent === true ? (h("div", { class: 'ImageListIcon', style: { cursor: 'pointer' }, onClick: () => this.navigateLink(repeater === null || repeater === void 0 ? void 0 : repeater.url, repeater === null || repeater === void 0 ? void 0 : repeater.target, repeater === null || repeater === void 0 ? void 0 : repeater.isExternalLink) }, h("div", { class: "ContainerImage" }, h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon"
|
|
18
|
+
return ((_a = this.repeaterContent) === null || _a === void 0 ? void 0 : _a.content.length) > 0 && h("div", { key: 'e7604ed1dcace3e2bd67c74e677e5c849c9c8407', class: "ImageListContainer" }, h("div", { key: '985672261fcfeac501d1182f5ab9f20e82307cc7', class: "ImageListWrapper" }, h("div", { key: '29b903e7bd639b8eb782d5aa6b646098ceee1ced', class: "ImageListSectionTitle" }, (_b = this.repeaterContent) === null || _b === void 0 ? void 0 : _b.categoryTitle), h("div", { key: '6cf6da5d3480a5f6d25c9d106e143dbb222e3b74', class: "ImageListLineup" }, (_d = (_c = this.repeaterContent) === null || _c === void 0 ? void 0 : _c.content) === null || _d === void 0 ? void 0 : _d.map(repeater => {
|
|
19
|
+
return (h("div", { class: 'ImageListIcon' }, this.navigateViaEvent === true ? (h("div", { class: 'ImageListIcon', style: { cursor: 'pointer' }, onClick: () => this.navigateLink(repeater === null || repeater === void 0 ? void 0 : repeater.url, repeater === null || repeater === void 0 ? void 0 : repeater.target, repeater === null || repeater === void 0 ? void 0 : repeater.isExternalLink) }, h("div", { class: "ContainerImage" }, h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon" })), h("p", null, repeater === null || repeater === void 0 ? void 0 : repeater.title))) : (h("a", { href: (repeater === null || repeater === void 0 ? void 0 : repeater.url) || 'javascript:void(0)', target: (repeater === null || repeater === void 0 ? void 0 : repeater.target) || '_parent' }, h("div", { class: "ContainerImage" }, h("div", { class: "ImageListPositioner" }, h("ui-image", { src: repeater === null || repeater === void 0 ? void 0 : repeater.image, alt: "icon" }))), h("p", null, repeater === null || repeater === void 0 ? void 0 : repeater.title)))));
|
|
44
20
|
}))));
|
|
45
21
|
}
|
|
46
|
-
get el() { return getElement(this); }
|
|
47
22
|
};
|
|
48
23
|
ImageList.style = ImageListStyle0;
|
|
49
24
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { r as registerInstance, h
|
|
1
|
+
import { r as registerInstance, h } from './index-83985f06.js';
|
|
2
2
|
|
|
3
3
|
const linkSectionListCss = ":host {\n display: block;\n margin: 0;\n padding: 0;\n}\n\n.SkeletonWrapper {\n width: 25px;\n height: 25px;\n}\n\n.LinkSectionListContainer {\n display: block;\n container-type: inline-size;\n}\n.LinkSectionListWrapper {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n grid-template-columns: 1fr;\n}\n.LinkSectionListTitle {\n font-weight: var(--emw--font-weight-semibold, 500);\n text-transform: uppercase;\n}\n.LinkSectionListLink {\n font-weight: var(--emw--font-weight-light, 300);\n}\n\nul {\n width: fit-content;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: var(--emw--spacing-medium, 16px);\n padding-left: var(--emw--spacing-small-minus, 10px);\n font-size: var(--emw--font-size-small, 16px);\n text-transform: uppercase;\n}\nul li {\n list-style: disc;\n display: flex;\n align-items: center;\n position: relative;\n}\nul li .LinkSectionListLinkText {\n display: flex;\n gap: 5px;\n flex-direction: row;\n align-items: center;\n}\nul li .LinkSectionListLinkText span {\n text-align: center;\n cursor: pointer;\n}\nul li .LinkSectionListLinkText img.LinkSectionIcon {\n position: relative;\n height: 25px;\n}\n\na {\n color: inherit;\n}\n\n@container (min-width: 280px) {\n .LinkSectionListWrapper {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n@container (min-width: 650px) {\n .LinkSectionListWrapper {\n grid-gap: 2rem;\n grid-template-columns: repeat(4, 1fr);\n grid-template-rows: 1fr;\n }\n}";
|
|
4
4
|
const LinkSectionListStyle0 = linkSectionListCss;
|
|
@@ -6,35 +6,11 @@ const LinkSectionListStyle0 = linkSectionListCss;
|
|
|
6
6
|
const LinkSectionList = class {
|
|
7
7
|
constructor(hostRef) {
|
|
8
8
|
registerInstance(this, hostRef);
|
|
9
|
-
this.onImageLoad = () => {
|
|
10
|
-
this.removeLoadingState();
|
|
11
|
-
this.cleanupListeners();
|
|
12
|
-
};
|
|
13
9
|
this.repeaterContent = undefined;
|
|
14
10
|
this.baseUrl = undefined;
|
|
15
11
|
this.language = undefined;
|
|
16
12
|
this.navigateViaEvent = false;
|
|
17
13
|
this.postMessageEvent = '';
|
|
18
|
-
this.skeletonLoading = true;
|
|
19
|
-
}
|
|
20
|
-
componentDidLoad() {
|
|
21
|
-
this.initImageListeners();
|
|
22
|
-
}
|
|
23
|
-
initImageListeners() {
|
|
24
|
-
if (!this.imgRef)
|
|
25
|
-
return;
|
|
26
|
-
if (this.imgRef.complete) {
|
|
27
|
-
this.onImageLoad();
|
|
28
|
-
return;
|
|
29
|
-
}
|
|
30
|
-
this.imgRef.addEventListener('load', this.onImageLoad);
|
|
31
|
-
}
|
|
32
|
-
removeLoadingState() {
|
|
33
|
-
this.skeletonLoading = false;
|
|
34
|
-
}
|
|
35
|
-
cleanupListeners() {
|
|
36
|
-
var _a;
|
|
37
|
-
(_a = this.imgRef) === null || _a === void 0 ? void 0 : _a.removeEventListener('load', this.onImageLoad);
|
|
38
14
|
}
|
|
39
15
|
navigateLink(link) {
|
|
40
16
|
window.postMessage({ type: this.postMessageEvent, path: link.linkUrl, url: link.linkUrl, target: link.target, externalLink: link.externalLink }, window.location.href);
|
|
@@ -68,15 +44,14 @@ const LinkSectionList = class {
|
|
|
68
44
|
}
|
|
69
45
|
return obj;
|
|
70
46
|
}, []);
|
|
71
|
-
return h("div", { class: "LinkSectionListContainer" }, h("div", { class: "LinkSectionListWrapper" }, this.repeaterContent.categoryTitle && h("h2", { class: "LinkSectionListTitle" }, this.repeaterContent.categoryTitle), linkSections.map(category => h("ul", null, category.categoryTitle && h("p", null, category.categoryTitle), category.links.map(link => h("li", { class: "LinkSectionListLink", key: link.linkName }, this.navigateViaEvent === true ? (h("span", null, link.linkName && link.icon ? (h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("
|
|
47
|
+
return h("div", { class: "LinkSectionListContainer" }, h("div", { class: "LinkSectionListWrapper" }, this.repeaterContent.categoryTitle && h("h2", { class: "LinkSectionListTitle" }, this.repeaterContent.categoryTitle), linkSections.map(category => h("ul", null, category.categoryTitle && h("p", null, category.categoryTitle), category.links.map(link => h("li", { class: "LinkSectionListLink", key: link.linkName }, this.navigateViaEvent === true ? (h("span", null, link.linkName && link.icon ? (h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })), h("span", { class: '' }, link.linkName, " "))) :
|
|
72
48
|
link.linkName ?
|
|
73
49
|
h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("span", null, link.linkName, " "))
|
|
74
50
|
:
|
|
75
|
-
h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("
|
|
51
|
+
h("span", { class: "LinkSectionListLinkText", onClick: () => this.navigateLink(link) }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" }))))) : (h("a", { class: "LinkSectionListLink", href: link.externalLink ? link.linkUrl : `${this.baseUrl}/${this.language}${link.linkUrl}`, target: link.target || '_blank' }, link.linkName && link.icon ? (h("span", { class: "LinkSectionListLinkText" }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })), h("span", null, link.linkName))) :
|
|
76
52
|
link.linkName ? (h("span", { class: "LinkSectionListLinkText" }, h("span", null, link.linkName))) :
|
|
77
|
-
h("span", { class: "LinkSectionListLinkText" }, h("div", { class: "ContainerImage" }, h("
|
|
53
|
+
h("span", { class: "LinkSectionListLinkText" }, h("div", { class: "ContainerImage" }, h("ui-image", { class: "LinkSectionIcon", src: link.icon, alt: "icon" })))))))))));
|
|
78
54
|
}
|
|
79
|
-
get el() { return getElement(this); }
|
|
80
55
|
};
|
|
81
56
|
LinkSectionList.style = LinkSectionListStyle0;
|
|
82
57
|
|
package/dist/esm/loader.js
CHANGED
|
@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
|
|
|
5
5
|
const defineCustomElements = async (win, options) => {
|
|
6
6
|
if (typeof window === 'undefined') return undefined;
|
|
7
7
|
await globalScripts();
|
|
8
|
-
return bootstrapLazy([["custom-content-section",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]
|
|
8
|
+
return bootstrapLazy([["custom-content-section",[[2,"custom-content-section",{"customContent":[1,"custom-content"],"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[516,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["link-section-list",[[0,"link-section-list",{"repeaterContent":[8,"repeater-content"],"baseUrl":[513,"base-url"],"language":[513],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]],["custom-clock",[[2,"custom-clock",{"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"translationUrl":[513,"translation-url"],"language":[513],"timeString":[32]},null,{"translationUrl":["handleNewTranslations"]}]]],["general-footer-template",[[1,"general-footer-template",{"language":[513],"sections":[513],"endpoint":[513],"env":[513],"userRoles":[513,"user-roles"],"userid":[513],"session":[513],"baseUrl":[513,"base-url"],"navigateViaEvent":[513,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"clockFormat":[513,"clock-format"],"timeZone":[513,"time-zone"],"mbSource":[513,"mb-source"],"hasErrors":[32]}]]],["ui-image_2",[[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[2,"border-radius"],"marginBottom":[2,"margin-bottom"],"marginTop":[2,"margin-top"],"marginLeft":[2,"margin-left"],"marginRight":[2,"margin-right"],"animation":[4],"rows":[2],"size":[1],"color":[1],"primaryColor":[1,"primary-color"],"secondaryColor":[1,"secondary-color"]},null,{"structure":["handleStructureChange"]}]]],["image-list",[[2,"image-list",{"repeaterContent":[8,"repeater-content"],"navigateViaEvent":[4,"navigate-via-event"],"postMessageEvent":[513,"post-message-event"]}]]]], options);
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
export { defineCustomElements };
|