@everymatrix/general-about-us 1.74.8 → 1.75.0

package/dist/esm/general-about-us.entry.js

@@ -1,296 +0,0 @@
-import { r as registerInstance, h } from './index-75dfea3e.js';
-
-const DEFAULT_LANGUAGE = 'en';
-const TRANSLATIONS = {
-    en: {
-        error: 'Error',
-        noResults: 'Loading, please wait ...',
-    },
-    hu: {
-        error: 'Error',
-        noResults: 'Loading, please wait ...',
-    },
-    ro: {
-        error: 'Eroare',
-        noResults: 'Loading, please wait ...',
-    },
-    fr: {
-        error: 'Error',
-        noResults: 'Loading, please wait ...',
-    },
-    ar: {
-        error: 'خطأ',
-        noResults: 'Loading, please wait ...',
-    },
-    hr: {
-        error: 'Greška',
-        noResults: 'Učitavanje, molimo pričekajte ...',
-    }
-};
-const translate = (key, customLang) => {
-    const lang = customLang;
-    return TRANSLATIONS[(lang !== undefined) && (lang in TRANSLATIONS) ? lang : DEFAULT_LANGUAGE][key];
-};
-
-/**
- * @name setClientStyling
- * @description Method used to create and append to the passed element of the widget a style element with the content received
- * @param {HTMLElement} stylingContainer The reference element of the widget
- * @param {string} clientStyling The style content
- */
-function setClientStyling(stylingContainer, clientStyling) {
-  if (stylingContainer) {
-    const sheet = document.createElement('style');
-    sheet.innerHTML = clientStyling;
-    stylingContainer.appendChild(sheet);
-  }
-}
-
-/**
- * @name setClientStylingURL
- * @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
- * @param {HTMLElement} stylingContainer The reference element of the widget
- * @param {string} clientStylingUrl The URL of the style content
- */
-function setClientStylingURL(stylingContainer, clientStylingUrl) {
-  const url = new URL(clientStylingUrl);
-
-  fetch(url.href)
-    .then((res) => res.text())
-    .then((data) => {
-      const cssFile = document.createElement('style');
-      cssFile.innerHTML = data;
-      if (stylingContainer) {
-        stylingContainer.appendChild(cssFile);
-      }
-    })
-    .catch((err) => {
-      console.error('There was an error while trying to load client styling from URL', err);
-    });
-}
-
-/**
- * @name setStreamLibrary
- * @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
- * @param {HTMLElement} stylingContainer The highest element of the widget
- * @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
- * @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
- */
-function setStreamStyling(stylingContainer, domain, subscription) {
-  if (window.emMessageBus) {
-    const sheet = document.createElement('style');
-
-    window.emMessageBus.subscribe(domain, (data) => {
-      sheet.innerHTML = data;
-      if (stylingContainer) {
-        stylingContainer.appendChild(sheet);
-      }
-    });
-  }
-}
-
-function checkDeviceType() {
-    const userAgent = navigator.userAgent.toLowerCase();
-    const width = screen.availWidth;
-    const height = screen.availHeight;
-    if (userAgent.includes('iphone')) {
-        return 'mobile';
-    }
-    if (userAgent.includes('android')) {
-        if (height > width && width < 800) {
-            return 'mobile';
-        }
-        if (width > height && height < 800) {
-            return 'tablet';
-        }
-    }
-    return 'desktop';
-}
-function checkCustomDeviceWidth() {
-    const width = screen.availWidth;
-    if (width < 600) {
-        return 'mobile';
-    }
-    else if (width >= 600 && width < 1100) {
-        return 'tablet';
-    }
-}
-function getDeviceCustom() {
-    const userAgent = navigator.userAgent.toLowerCase();
-    let source = '';
-    source = (userAgent.includes('android') || userAgent.includes('iphone') || userAgent.includes('ipad')) ? checkCustomDeviceWidth() : 'desktop';
-    return source;
-}
-const getDevice = () => {
-    let userAgent = window.navigator.userAgent.toLocaleLowerCase();
-    if (userAgent.includes('android/i'))
-        return 'android';
-    if (userAgent.includes('iphone/i'))
-        return 'iPhone';
-    if (userAgent.includes('ipad/i') || userAgent.includes('ipod/i'))
-        return 'iPad';
-    return 'PC';
-};
-const getDevicePlatform = () => {
-    const device = getDevice();
-    if (device) {
-        if (device === 'PC') {
-            return 'dk';
-        }
-        else if (device === 'iPad' || device === 'iPhone') {
-            return 'mtWeb';
-        }
-        else {
-            return 'mtWeb';
-        }
-    }
-};
-
-const chevronSvg = 'data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBoZWlnaHQ9IjY0cHgiIHdpZHRoPSI2NHB4IiB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZpZXdCb3g9IjAgMCAxODUuMzQzIDE4NS4zNDMiIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNENUYzREYiIHN0cm9rZT0iI0Q1RjNERiI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxnPiA8Zz4gPHBhdGggc3R5bGU9ImZpbGw6I2VjZjlmMDsiIGQ9Ik01MS43MDcsMTg1LjM0M2MtMi43NDEsMC01LjQ5My0xLjA0NC03LjU5My0zLjE0OWMtNC4xOTQtNC4xOTQtNC4xOTQtMTAuOTgxLDAtMTUuMTc1IGw3NC4zNTItNzQuMzQ3TDQ0LjExNCwxOC4zMmMtNC4xOTQtNC4xOTQtNC4xOTQtMTAuOTg3LDAtMTUuMTc1YzQuMTk0LTQuMTk0LDEwLjk4Ny00LjE5NCwxNS4xOCwwbDgxLjkzNCw4MS45MzQgYzQuMTk0LDQuMTk0LDQuMTk0LDEwLjk4NywwLDE1LjE3NWwtODEuOTM0LDgxLjkzOUM1Ny4yMDEsMTg0LjI5Myw1NC40NTQsMTg1LjM0Myw1MS43MDcsMTg1LjM0M3oiLz4gPC9nPiA8L2c+IDwvZz4KDTwvc3ZnPg==';
-
-const generalAboutUsCss = ":host {\n  display: block;\n  font-family: inherit;\n}\n\np {\n  margin: 0;\n  padding: 0;\n  font-family: inherit;\n}\n\nbutton {\n  font-family: inherit;\n}\n\n.AboutUsError .ErrorInfo {\n  color: var(--emw--color-error, #ed0909);\n}\n\n.AboutUsWrapper {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  background-color: var(--emw--color-background, #000000);\n  width: 100%;\n  border-radius: var(--emw--border-radius-large, 15px);\n  animation: fadeInAnimation ease 1.5s;\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n}\n\n@keyframes fadeInAnimation {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n.ItemImage {\n  position: relative;\n  width: 100%;\n  max-width: 100%;\n  height: auto;\n  border-radius: var(--emw--border-radius-large, 10px);\n  background: var(--emw--color-background, black);\n}\n.ItemImage .ForegroundImage {\n  z-index: 3;\n  pointer-events: none;\n  opacity: 1;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  transition: opacity 0.5s ease, filter 0.5s ease;\n  border-radius: var(--emw--border-radius-large, 10px);\n}\n.ItemImage .BackgroundImage {\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  transition: opacity 0.5s ease, filter 0.5s ease;\n  border-radius: var(--emw--border-radius-large, 10px);\n  z-index: 2;\n  top: 20px;\n  filter: blur(16px);\n  opacity: 0.7;\n  transform: scale(1.01);\n}\n.ItemImage .ItemDetails {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 16px;\n  width: 60%;\n  padding: 40px;\n}\n.ItemImage .ItemDetails > div {\n  position: relative;\n  height: auto;\n  z-index: 10;\n  overflow: hidden;\n}\n.ItemImage .Title {\n  padding: 20px 0px 10px 0px;\n  font-size: var(--emw--font-size-x-large, 38px);\n  font-weight: var(--emw--font-weight-bold, 700);\n  color: var(--emw--color-typography, white);\n}\n.ItemImage .Title .FirstWord {\n  text-transform: uppercase;\n  letter-spacing: 1px;\n  background: var(--emw--color-primary, #1EC450);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n}\n.ItemImage .Description {\n  font-size: var(--emw--font-size-small-plus, 16px);\n  font-weight: var(--emw--font-weight-normal, 400);\n  color: var(--emw--color-gray-100, #D1D1D2);\n}\n.ItemImage button {\n  position: relative;\n  width: auto;\n  padding: 10px 24px;\n  color: var(--emw--button-text-color, white);\n  font-size: var(--emw--font-size-small, 16px);\n  border: var(--emw--button-border, 3px solid) var(--emw--button-border-color, #063B17);\n  border-radius: var(--emw--button-border-radius, 10px);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  z-index: 20;\n  animation: ButtonEffect 4s linear infinite;\n  background-image: linear-gradient(to right, var(--emw--color-primary, #22B04E), color-mix(in srgb, var(--emw--color-primary, #22B04E), black 30%), var(--emw--color-primary, #22B04E));\n  background-size: 300% 100%;\n}\n.ItemImage button:hover {\n  opacity: 0.8;\n}\n.ItemImage button img.Chevron {\n  position: relative;\n  height: var(--emw--size-standard, 12px);\n  margin-left: var(--emw--spacing-small-minus, 6px);\n}\n@keyframes ButtonEffect {\n  0% {\n    background-position: 0% 50%;\n  }\n  33% {\n    background-position: 100% 50%;\n  }\n  66% {\n    background-position: 200% 50%;\n  }\n  100% {\n    background-position: 300% 50%;\n  }\n}\n\n@container (max-width: 475px) {\n  .AboutUsWrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    flex-wrap: wrap;\n    gap: var(--emw--spacing-small-minus, 10px);\n    max-width: 100%;\n    background-color: var(--emw--color-background, #000000);\n    animation: fadeInAnimation ease 1.5s;\n    animation-iteration-count: 1;\n    animation-fill-mode: forwards;\n  }\n  .AboutUsWrapper .ItemDetails {\n    padding: 30px;\n  }\n  .AboutUsWrapper .ItemDetails .Title {\n    font-size: var(--emw--font-size-large, 28px);\n    padding: 0;\n  }\n  .AboutUsWrapper .ItemDetails .Button {\n    font-size: var(--emw--font-size-small, 14px);\n    padding: 8px 20px;\n  }\n  .AboutUsWrapper .ItemDetails > div {\n    border-radius: var(--emw--border-radius-medium, 5px);\n    gap: var(--emw--spacing-2x-small, 4px);\n  }\n  .AboutUsWrapper .Description {\n    text-align: left;\n    font-size: var(--emw--font-size-small, 14px);\n    font-weight: var(--emw--font-weight-normal, 400);\n  }\n  .AboutUsWrapper button {\n    padding-bottom: 10px;\n    line-height: 15px;\n    padding: 10px;\n  }\n}\n@container (max-width: 800px) {\n  .Title {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n}";
-const GeneralAboutUsStyle0 = generalAboutUsCss;
-
-const GeneralAboutUs = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.handleClick = (url, target, location, isExternal) => {
-            window.postMessage({ type: 'NavigateTo', path: url, target: target, locations: location, externalLink: isExternal || false }, window.location.href);
-            // @ts-ignore Analytics event
-            if (typeof gtag == 'function') {
-                // @ts-ignore
-                gtag('event', 'GeneralAboutUs', {
-                    'context': 'AboutUsContent'
-                });
-            }
-        };
-        this.setImage = (image) => {
-            let source = '';
-            this.device = checkDeviceType();
-            switch (this.device) {
-                case 'mobile':
-                    source = image.imageMobile;
-                    break;
-                case 'tablet':
-                    source = image.imageTablet;
-                    break;
-                case 'desktop':
-                    source = image.imageDesktop;
-                    break;
-            }
-            return source;
-        };
-        this.formatTitle = (title, language) => {
-            let firstWord, restOfTitle;
-            // Check for common languages that do not use space - here: Chinese, Japanese, Thai
-            if (['zh', 'ja', 'th'].includes(language)) {
-                firstWord = title.substring(0, 1);
-                restOfTitle = title.substring(1);
-            }
-            else {
-                const words = title.split(' ');
-                firstWord = words.shift();
-                restOfTitle = words.join(' ');
-            }
-            return h("div", { class: "Title" }, h("span", { class: "FirstWord" }, firstWord, " "), h("span", null, restOfTitle));
-        };
-        this.cmsEndpoint = undefined;
-        this.language = 'en';
-        this.userRoles = 'everyone';
-        this.cmsEnv = 'stage';
-        this.mbSource = undefined;
-        this.clientStyling = '';
-        this.clientStylingUrl = '';
-        this.hasErrors = false;
-        this.isLoading = true;
-        this.device = '';
-    }
-    watchEndpoint(newValue, oldValue) {
-        if (newValue && newValue != oldValue && this.cmsEndpoint) {
-            this.getAboutUs();
-        }
-    }
-    handleClientStylingChange(newValue, oldValue) {
-        if (newValue != oldValue) {
-            setClientStyling(this.stylingContainer, this.clientStyling);
-        }
-    }
-    handleClientStylingChangeURL(newValue, oldValue) {
-        if (newValue != oldValue) {
-            if (this.clientStylingUrl)
-                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
-        }
-    }
-    componentWillLoad() {
-        if (this.cmsEndpoint && this.language) {
-            return this.getAboutUs();
-        }
-    }
-    componentDidLoad() {
-        this.device = getDeviceCustom();
-        if (this.stylingContainer) {
-            if (window.emMessageBus != undefined) {
-                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
-            }
-            else {
-                if (this.clientStyling)
-                    setClientStyling(this.stylingContainer, this.clientStyling);
-                if (this.clientStylingUrl)
-                    setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
-            }
-        }
-    }
-    disconnectedCallback() {
-        this.stylingSubscription && this.stylingSubscription.unsubscribe();
-    }
-    getAboutUs() {
-        let url = new URL(`${this.cmsEndpoint}/${this.language}/homepage`);
-        url.searchParams.append('env', this.cmsEnv);
-        url.searchParams.append('userRoles', this.userRoles);
-        url.searchParams.append('device', getDevicePlatform());
-        return new Promise((resolve, reject) => {
-            this.isLoading = true;
-            fetch(url.href)
-                .then((res) => res.json())
-                .then((aboutUsContent) => {
-                const keysToKeep = ['title', 'description', 'images', 'button', 'externalLink', 'targetType', 'locations'];
-                const aboutUsArrContent = Object.entries(aboutUsContent)
-                    .filter(([key]) => keysToKeep.includes(key))
-                    .reduce((acc, [key, value]) => {
-                    acc[key] = value;
-                    return acc;
-                }, {});
-                this.aboutUsData = aboutUsArrContent;
-                resolve(aboutUsArrContent);
-            }).catch((err) => {
-                console.error(err);
-                this.hasErrors = true;
-                reject(err);
-            }).finally(() => {
-                this.isLoading = false;
-            });
-        });
-    }
-    render() {
-        var _a, _b, _c, _d, _e;
-        return (h("div", { key: '92051e1b64b1668fc702bb339e4bfc47b24d9406', ref: el => this.stylingContainer = el }, this.hasErrors ? (h("div", { class: "AboutUsError" }, h("div", { class: "ErrorInfo" }, translate('error', this.language)))) : !this.isLoading ? (h("div", { class: "AboutUsWrapper" }, h("div", { class: "ItemImage" }, h("div", { class: "ForegroundImage", style: { background: `linear-gradient(to left, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.6) 100%),
-                              linear-gradient(to bottom left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 1) 100%),
-                              linear-gradient(to bottom, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.6) 100%),
-                              url(${this.setImage((_a = this.aboutUsData) === null || _a === void 0 ? void 0 : _a.images)}) no-repeat center center / cover` } }), h("img", { class: "BackgroundImage", src: this.setImage(this.aboutUsData.images), alt: "image" }), h("div", { class: "ItemDetails" }, this.formatTitle((_b = this.aboutUsData) === null || _b === void 0 ? void 0 : _b.title, this.language), h("div", { class: "Description", innerHTML: (_c = this.aboutUsData) === null || _c === void 0 ? void 0 : _c.description }), h("button", { class: "Button", onClick: () => {
-                var _a, _b, _c, _d, _e;
-                return this.handleClick((_b = (_a = this.aboutUsData) === null || _a === void 0 ? void 0 : _a.button) === null || _b === void 0 ? void 0 : _b.buttonUrl, (_c = this.aboutUsData) === null || _c === void 0 ? void 0 : _c.targetType, (_d = this.aboutUsData) === null || _d === void 0 ? void 0 : _d.locations, (_e = this.aboutUsData) === null || _e === void 0 ? void 0 : _e.externalLink);
-            } }, (_e = (_d = this.aboutUsData) === null || _d === void 0 ? void 0 : _d.button) === null || _e === void 0 ? void 0 :
-            _e.buttonText, h("img", { src: chevronSvg, alt: "right chevron", class: "Chevron" })))))) : null));
-    }
-    static get watchers() { return {
-        "cmsEndpoint": ["watchEndpoint"],
-        "language": ["watchEndpoint"],
-        "userRoles": ["watchEndpoint"],
-        "device": ["watchEndpoint"],
-        "clientStyling": ["handleClientStylingChange"],
-        "clientStylingUrl": ["handleClientStylingChangeURL"]
-    }; }
-};
-GeneralAboutUs.style = GeneralAboutUsStyle0;
-
-export { GeneralAboutUs as general_about_us };

package/dist/general-about-us/general-about-us.entry.js

@@ -1 +0,0 @@
-import{r as n,h as t}from"./index-75dfea3e.js";const i={en:{error:"Error",noResults:"Loading, please wait ..."},hu:{error:"Error",noResults:"Loading, please wait ..."},ro:{error:"Eroare",noResults:"Loading, please wait ..."},fr:{error:"Error",noResults:"Loading, please wait ..."},ar:{error:"خطأ",noResults:"Loading, please wait ..."},hr:{error:"Greška",noResults:"Učitavanje, molimo pričekajte ..."}};function e(n,t){if(n){const i=document.createElement("style");i.innerHTML=t,n.appendChild(i)}}function o(n,t){const i=new URL(t);fetch(i.href).then((n=>n.text())).then((t=>{const i=document.createElement("style");i.innerHTML=t,n&&n.appendChild(i)})).catch((n=>{console.error("There was an error while trying to load client styling from URL",n)}))}const r=class{constructor(i){n(this,i),this.handleClick=(n,t,i,e)=>{window.postMessage({type:"NavigateTo",path:n,target:t,locations:i,externalLink:e||!1},window.location.href),"function"==typeof gtag&&gtag("event","GeneralAboutUs",{context:"AboutUsContent"})},this.setImage=n=>{let t="";switch(this.device=function(){const n=navigator.userAgent.toLowerCase(),t=screen.availWidth,i=screen.availHeight;if(n.includes("iphone"))return"mobile";if(n.includes("android")){if(i>t&&t<800)return"mobile";if(t>i&&i<800)return"tablet"}return"desktop"}(),this.device){case"mobile":t=n.imageMobile;break;case"tablet":t=n.imageTablet;break;case"desktop":t=n.imageDesktop}return t},this.formatTitle=(n,i)=>{let e,o;if(["zh","ja","th"].includes(i))e=n.substring(0,1),o=n.substring(1);else{const t=n.split(" ");e=t.shift(),o=t.join(" ")}return t("div",{class:"Title"},t("span",{class:"FirstWord"},e," "),t("span",null,o))},this.cmsEndpoint=void 0,this.language="en",this.userRoles="everyone",this.cmsEnv="stage",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.hasErrors=!1,this.isLoading=!0,this.device=""}watchEndpoint(n,t){n&&n!=t&&this.cmsEndpoint&&this.getAboutUs()}handleClientStylingChange(n,t){n!=t&&e(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(n,t){n!=t&&this.clientStylingUrl&&o(this.stylingContainer,this.clientStylingUrl)}componentWillLoad(){if(this.cmsEndpoint&&this.language)return this.getAboutUs()}componentDidLoad(){this.device=function(){const n=navigator.userAgent.toLowerCase();let t="";return t=n.includes("android")||n.includes("iphone")||n.includes("ipad")?function(){const n=screen.availWidth;return n<600?"mobile":n>=600&&n<1100?"tablet":void 0}():"desktop",t}(),this.stylingContainer&&(null!=window.emMessageBus?function(n,t){if(window.emMessageBus){const i=document.createElement("style");window.emMessageBus.subscribe(t,(t=>{i.innerHTML=t,n&&n.appendChild(i)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&e(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&o(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}getAboutUs(){let n=new URL(`${this.cmsEndpoint}/${this.language}/homepage`);return n.searchParams.append("env",this.cmsEnv),n.searchParams.append("userRoles",this.userRoles),n.searchParams.append("device",(()=>{const n=(()=>{let n=window.navigator.userAgent.toLocaleLowerCase();return n.includes("android/i")?"android":n.includes("iphone/i")?"iPhone":n.includes("ipad/i")||n.includes("ipod/i")?"iPad":"PC"})();if(n)return"PC"===n?"dk":"mtWeb"})()),new Promise(((t,i)=>{this.isLoading=!0,fetch(n.href).then((n=>n.json())).then((n=>{const i=["title","description","images","button","externalLink","targetType","locations"],e=Object.entries(n).filter((([n])=>i.includes(n))).reduce(((n,[t,i])=>(n[t]=i,n)),{});this.aboutUsData=e,t(e)})).catch((n=>{console.error(n),this.hasErrors=!0,i(n)})).finally((()=>{this.isLoading=!1}))}))}render(){var n,e,o,r,a,s;return t("div",{key:"92051e1b64b1668fc702bb339e4bfc47b24d9406",ref:n=>this.stylingContainer=n},this.hasErrors?t("div",{class:"AboutUsError"},t("div",{class:"ErrorInfo"},i[void 0!==(s=this.language)&&s in i?s:"en"].error)):this.isLoading?null:t("div",{class:"AboutUsWrapper"},t("div",{class:"ItemImage"},t("div",{class:"ForegroundImage",style:{background:`linear-gradient(to left, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.6) 100%),\n                              linear-gradient(to bottom left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 1) 100%),\n                              linear-gradient(to bottom, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.6) 100%),\n                              url(${this.setImage(null===(n=this.aboutUsData)||void 0===n?void 0:n.images)}) no-repeat center center / cover`}}),t("img",{class:"BackgroundImage",src:this.setImage(this.aboutUsData.images),alt:"image"}),t("div",{class:"ItemDetails"},this.formatTitle(null===(e=this.aboutUsData)||void 0===e?void 0:e.title,this.language),t("div",{class:"Description",innerHTML:null===(o=this.aboutUsData)||void 0===o?void 0:o.description}),t("button",{class:"Button",onClick:()=>{var n,t,i,e,o;return this.handleClick(null===(t=null===(n=this.aboutUsData)||void 0===n?void 0:n.button)||void 0===t?void 0:t.buttonUrl,null===(i=this.aboutUsData)||void 0===i?void 0:i.targetType,null===(e=this.aboutUsData)||void 0===e?void 0:e.locations,null===(o=this.aboutUsData)||void 0===o?void 0:o.externalLink)}},null===(a=null===(r=this.aboutUsData)||void 0===r?void 0:r.button)||void 0===a?void 0:a.buttonText,t("img",{src:"data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBoZWlnaHQ9IjY0cHgiIHdpZHRoPSI2NHB4IiB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZpZXdCb3g9IjAgMCAxODUuMzQzIDE4NS4zNDMiIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNENUYzREYiIHN0cm9rZT0iI0Q1RjNERiI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxnPiA8Zz4gPHBhdGggc3R5bGU9ImZpbGw6I2VjZjlmMDsiIGQ9Ik01MS43MDcsMTg1LjM0M2MtMi43NDEsMC01LjQ5My0xLjA0NC03LjU5My0zLjE0OWMtNC4xOTQtNC4xOTQtNC4xOTQtMTAuOTgxLDAtMTUuMTc1IGw3NC4zNTItNzQuMzQ3TDQ0LjExNCwxOC4zMmMtNC4xOTQtNC4xOTQtNC4xOTQtMTAuOTg3LDAtMTUuMTc1YzQuMTk0LTQuMTk0LDEwLjk4Ny00LjE5NCwxNS4xOCwwbDgxLjkzNCw4MS45MzQgYzQuMTk0LDQuMTk0LDQuMTk0LDEwLjk4NywwLDE1LjE3NWwtODEuOTM0LDgxLjkzOUM1Ny4yMDEsMTg0LjI5Myw1NC40NTQsMTg1LjM0Myw1MS43MDcsMTg1LjM0M3oiLz4gPC9nPiA8L2c+IDwvZz4KDTwvc3ZnPg==",alt:"right chevron",class:"Chevron"}))))))}static get watchers(){return{cmsEndpoint:["watchEndpoint"],language:["watchEndpoint"],userRoles:["watchEndpoint"],device:["watchEndpoint"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"]}}};r.style=":host {\n  display: block;\n  font-family: inherit;\n}\n\np {\n  margin: 0;\n  padding: 0;\n  font-family: inherit;\n}\n\nbutton {\n  font-family: inherit;\n}\n\n.AboutUsError .ErrorInfo {\n  color: var(--emw--color-error, #ed0909);\n}\n\n.AboutUsWrapper {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  background-color: var(--emw--color-background, #000000);\n  width: 100%;\n  border-radius: var(--emw--border-radius-large, 15px);\n  animation: fadeInAnimation ease 1.5s;\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n}\n\n@keyframes fadeInAnimation {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n.ItemImage {\n  position: relative;\n  width: 100%;\n  max-width: 100%;\n  height: auto;\n  border-radius: var(--emw--border-radius-large, 10px);\n  background: var(--emw--color-background, black);\n}\n.ItemImage .ForegroundImage {\n  z-index: 3;\n  pointer-events: none;\n  opacity: 1;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  transition: opacity 0.5s ease, filter 0.5s ease;\n  border-radius: var(--emw--border-radius-large, 10px);\n}\n.ItemImage .BackgroundImage {\n  position: absolute;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  transition: opacity 0.5s ease, filter 0.5s ease;\n  border-radius: var(--emw--border-radius-large, 10px);\n  z-index: 2;\n  top: 20px;\n  filter: blur(16px);\n  opacity: 0.7;\n  transform: scale(1.01);\n}\n.ItemImage .ItemDetails {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 16px;\n  width: 60%;\n  padding: 40px;\n}\n.ItemImage .ItemDetails > div {\n  position: relative;\n  height: auto;\n  z-index: 10;\n  overflow: hidden;\n}\n.ItemImage .Title {\n  padding: 20px 0px 10px 0px;\n  font-size: var(--emw--font-size-x-large, 38px);\n  font-weight: var(--emw--font-weight-bold, 700);\n  color: var(--emw--color-typography, white);\n}\n.ItemImage .Title .FirstWord {\n  text-transform: uppercase;\n  letter-spacing: 1px;\n  background: var(--emw--color-primary, #1EC450);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n}\n.ItemImage .Description {\n  font-size: var(--emw--font-size-small-plus, 16px);\n  font-weight: var(--emw--font-weight-normal, 400);\n  color: var(--emw--color-gray-100, #D1D1D2);\n}\n.ItemImage button {\n  position: relative;\n  width: auto;\n  padding: 10px 24px;\n  color: var(--emw--button-text-color, white);\n  font-size: var(--emw--font-size-small, 16px);\n  border: var(--emw--button-border, 3px solid) var(--emw--button-border-color, #063B17);\n  border-radius: var(--emw--button-border-radius, 10px);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  z-index: 20;\n  animation: ButtonEffect 4s linear infinite;\n  background-image: linear-gradient(to right, var(--emw--color-primary, #22B04E), color-mix(in srgb, var(--emw--color-primary, #22B04E), black 30%), var(--emw--color-primary, #22B04E));\n  background-size: 300% 100%;\n}\n.ItemImage button:hover {\n  opacity: 0.8;\n}\n.ItemImage button img.Chevron {\n  position: relative;\n  height: var(--emw--size-standard, 12px);\n  margin-left: var(--emw--spacing-small-minus, 6px);\n}\n@keyframes ButtonEffect {\n  0% {\n    background-position: 0% 50%;\n  }\n  33% {\n    background-position: 100% 50%;\n  }\n  66% {\n    background-position: 200% 50%;\n  }\n  100% {\n    background-position: 300% 50%;\n  }\n}\n\n@container (max-width: 475px) {\n  .AboutUsWrapper {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    flex-wrap: wrap;\n    gap: var(--emw--spacing-small-minus, 10px);\n    max-width: 100%;\n    background-color: var(--emw--color-background, #000000);\n    animation: fadeInAnimation ease 1.5s;\n    animation-iteration-count: 1;\n    animation-fill-mode: forwards;\n  }\n  .AboutUsWrapper .ItemDetails {\n    padding: 30px;\n  }\n  .AboutUsWrapper .ItemDetails .Title {\n    font-size: var(--emw--font-size-large, 28px);\n    padding: 0;\n  }\n  .AboutUsWrapper .ItemDetails .Button {\n    font-size: var(--emw--font-size-small, 14px);\n    padding: 8px 20px;\n  }\n  .AboutUsWrapper .ItemDetails > div {\n    border-radius: var(--emw--border-radius-medium, 5px);\n    gap: var(--emw--spacing-2x-small, 4px);\n  }\n  .AboutUsWrapper .Description {\n    text-align: left;\n    font-size: var(--emw--font-size-small, 14px);\n    font-weight: var(--emw--font-weight-normal, 400);\n  }\n  .AboutUsWrapper button {\n    padding-bottom: 10px;\n    line-height: 15px;\n    padding: 10px;\n  }\n}\n@container (max-width: 800px) {\n  .Title {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n}";export{r as general_about_us}