@ebrains/components 0.4.0-alpha.0 → 0.6.0-alpha.0

package/dist/components/eds-cookies-preference.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsCookiesPreference extends Components.EdsCookiesPreference, HTMLElement {}
+export const EdsCookiesPreference: {
+    prototype: EdsCookiesPreference;
+    new (): EdsCookiesPreference;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-cookies-preference.js

@@ -0,0 +1,88 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$6 } from './eds-accordion2.js';
+import { d as defineCustomElement$5 } from './eds-button2.js';
+import { d as defineCustomElement$4 } from './eds-icon-wrapper2.js';
+import { d as defineCustomElement$3 } from './eds-link2.js';
+import { d as defineCustomElement$2 } from './eds-matomo-notice2.js';
+
+const edsCookiesPreferenceCss = "";
+const EdsCookiesPreferenceStyle0 = edsCookiesPreferenceCss;
+
+const EdsCookiesPreference$1 = /*@__PURE__*/ proxyCustomElement(class EdsCookiesPreference extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.buttonText = 'Cookies Preferences';
+        this.intent = undefined;
+        this.showMatomoNotice = false;
+        this.noticeKey = 0;
+    }
+    /**
+     * Always shows the eds-matomo-notice popup.
+     * Every click removes the "matomo-deferred" key and forces a remount.
+     */
+    toggleCookiesPopup() {
+        // Remove the key from session storage so that the notice will run its checks (or be forced to show)
+        sessionStorage.removeItem('matomo-deferred');
+        if (this.showMatomoNotice) {
+            // Force a remount by changing the key
+            this.noticeKey = this.noticeKey + 1;
+        }
+        else {
+            this.showMatomoNotice = true;
+        }
+    }
+    render() {
+        return (h("div", { key: 'ca5d44522f94e9ea009c657c5eae6e357cd0d13a' }, h("eds-link", { key: '563a369e2ed44d08a6dd47922c1c1c888e81543a', size: "small", intent: this.intent, label: this.buttonText, onClick: () => this.toggleCookiesPopup() }), this.showMatomoNotice && h("eds-matomo-notice", { "force-show": true, key: this.noticeKey })));
+    }
+    static get style() { return EdsCookiesPreferenceStyle0; }
+}, [1, "eds-cookies-preference", {
+        "buttonText": [1, "button-text"],
+        "intent": [1],
+        "showMatomoNotice": [32],
+        "noticeKey": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-cookies-preference", "eds-accordion", "eds-button", "eds-icon-wrapper", "eds-link", "eds-matomo-notice"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-cookies-preference":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsCookiesPreference$1);
+            }
+            break;
+        case "eds-accordion":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "eds-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "eds-icon-wrapper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "eds-link":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "eds-matomo-notice":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const EdsCookiesPreference = EdsCookiesPreference$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsCookiesPreference, defineCustomElement };

package/dist/components/eds-docs-palettes.js

@@ -26,7 +26,7 @@ const EdsDocsPalettes$1 = /*@__PURE__*/ proxyCustomElement(class EdsDocsPalettes
         }
     }
     render() {
-        return h("div", { key: '42f0a4598c64661d98054522e88366ec591a2cb3', class: "container" }, this.renderContent());
+        return h("div", { key: 'e8cd71caa7b23cc4dc28c694ecb9f13e3fd4170a', class: "container" }, this.renderContent());
     }
 }, [0, "eds-docs-palettes", {
         "tabIndex": [2, "tab-index"]

package/dist/components/eds-docs-tokens.js

@@ -30,7 +30,7 @@ const EdsDocsContent = /*@__PURE__*/ proxyCustomElement(class EdsDocsContent ext
         }
     }
     render() {
-        return h("div", { key: '10708d591c4077e4e1fe94073322f01121253bdb', class: "container" }, this.renderContent());
+        return h("div", { key: 'b140f7650e5e01711dc0778b04af83f9d004efc7', class: "container" }, this.renderContent());
     }
 }, [0, "eds-docs-tokens", {
         "tabIndex": [2, "tab-index"]

package/dist/components/eds-dropdown2.js

@@ -1,5 +1,4 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import './color.js';
 import { s as sendAnalytics } from './analytics.js';
 import { d as defineCustomElement$2 } from './eds-button2.js';
 import { d as defineCustomElement$1 } from './eds-icon-wrapper2.js';
@@ -105,14 +104,14 @@ const EdsDropdown = /*@__PURE__*/ proxyCustomElement(class EdsDropdown extends H
      * @returns {JSX.Element} The rendered dropdown component.
      */
     render() {
-        return (h("div", { key: '809cb733330db434f94f854ed4d1ee375f598297', class: "z-focus relative", ref: (el) => (this.dropdownContent = el) }, h("eds-button", { key: 'c80f2930b335708a2a01d06b565673597bd8d926', label: this.label, "aria-label": this.ariaLabel, icon: this.icon, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu" }), h("nav", { key: '7b3ccb2ab29474a4795d5491960e0713aefcd624', class: {
+        return (h("div", { key: '84f4cea78ea1c40c7897a356fe03ac83922fccb8', class: "z-focus relative", ref: (el) => (this.dropdownContent = el) }, h("eds-button", { key: '99dc51632dc82830054502a2d6d77d9fcefe9337', label: this.label, "aria-label": this.ariaLabel, icon: this.icon, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu" }), h("nav", { key: 'a63613a7ecf709fd1d22d77da4b2d286905fef3e', role: "menu", class: {
                 'shadow-small bg-inverse border-softest z-10 z-on-top absolute top-full mt-4 flex flex-col gap-y-4 border-2 p-8': true,
                 'left-4': this.dropdownPos === 'left' && this.dropdownOffset,
                 'left-0': this.dropdownPos === 'left' && !this.dropdownOffset,
                 'right-4': this.dropdownPos === 'right' && this.dropdownOffset,
                 'right-0': this.dropdownPos === 'right' && !this.dropdownOffset,
                 'rounded-lg': this.rounded
-            }, style: { display: this.isOpen ? 'block' : 'none' }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, h("slot", { key: 'c514c5dca893708fd1660a61cfeb1607229bbff5' }))));
+            }, style: { display: this.isOpen ? 'block' : 'none' }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, h("slot", { key: 'dda70b865ed03dc7ad36a32934587bbcb0a16c1b' }))));
     }
     get host() { return this; }
     static get style() { return EdsDropdownStyle0; }

package/dist/components/eds-footer2.js

@@ -22,19 +22,10 @@ const EdsFooter = /*@__PURE__*/ proxyCustomElement(class EdsFooter extends HTMLE
         };
         this.extraClass = '';
         this.social = false;
-        this.hasCookiesSetUp = false;
         this.enableScrollTop = false;
         this.fundedBy = 'EBRAINS is funded by the Horizon Europe Framework Programme.';
         this.rightsReserved = `${new Date().getFullYear()} EBRAINS. All rights reserved.`;
-        this.cookiesPreference = 'Cookies Preferences';
-    }
-    /**
-     * Toggles the cookie preferences popup, if available.
-     * The actual implementation for handling cookie preferences should be defined here.
-     * @private
-     */
-    toggleCookiesPopup() {
-        // Implement logic for handling cookie preferences
+        this.showMatomoNotice = false;
     }
     /**
      * Renders the footer component with optional sections and elements,
@@ -44,17 +35,16 @@ const EdsFooter = /*@__PURE__*/ proxyCustomElement(class EdsFooter extends HTMLE
      * @returns {JSX.Element} The rendered JSX for the footer component.
      */
     render() {
-        return (h("footer", { key: '8d3d1b5d2acd76f56b2bc12539cb7d277b4dcd7f', class: `${this.extraClass} pb-banner` }, this.social ? (h("div", { class: "border-softest border-t-2 pt-20 pb-28 md:pt-28" }, h("div", { class: "container pb-20 xl:pb-40 " }, h("div", { class: "grid-layout" }, h("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, h("eds-social-networks", { class: "mt-28" })), h("nav", { "aria-label": "Secondary nav", class: "grid-col-span-12 lg:grid-col-span-6 lg:grid-col-start-7 grid-layout mt-28 gap-y-12 lg:mt-0" }))))) : null, h("div", { key: '7d6e3a414ec8e8f8e2b795faf639948f8819f5cb', class: `border-softest ${this.social ? 'border-t-2' : ''} pt-20 pb-28 md:pt-28` }, h("div", { key: '9a475fd146ac0e1bc78c43940ee24ec31212fcb9', class: "container flex flex-wrap items-center gap-20 lg:flex-nowrap" }, h("div", { key: '4b465113cdb882f919fba15e944eb56edbe3c570', class: "flex items-center gap-x-12" }, h("a", { key: '1a8ad1ee5f4dfb77da036b03d0770cba8e5d725e', target: "_blank", rel: "noopener noreferrer", class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-2020_en" }, h("eds-img", { key: '4714ea1a01b7b7eef8b3af0c04ffe793d51c4d5e', width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg" }))), h("div", { key: 'c4db6bab70e570e337c82136a0d9d6dad01c1039', class: "f-ui-04 text-light order-last w-full lg:order-none lg:w-auto" }, h("p", { key: '0b030a92c12a3a96fe2baacc13ac21f5bd708a50' }, this.fundedBy), h("div", { key: '4714d0ccf0e3912ae330a6f39ed3607caf2b51a4', class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap" }, h("span", { key: 'b4bc2d45871c7d1f9de1d6090959b12fd5246f01', class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline" }, "\u00A9 ", this.rightsReserved), this.hasCookiesSetUp && (h("button", { key: '98b56eee7be6bc1558821933cebf2853b3bb68fc', class: "effect-focus !no-underline underline-offset-4 hover:!underline", onClick: () => this.toggleCookiesPopup() }, this.cookiesPreference)))), h("div", { key: 'f4bf4a0c99f3be920dd15f68e6f7e390cd85ecce', class: "ml-auto pl-12" }, this.enableScrollTop ? (h("eds-button", { "aria-label": "Back to top", intent: "ghostInverse", icon: "chevron-up", onClick: this.backToTop })) : null)))));
+        return (h("footer", { key: '9a7256325386a5072e9f1e391d838bb38458d99f', class: `${this.extraClass} pb-banner` }, this.social ? (h("div", { class: "border-softest border-t-2 pt-20 pb-28 md:pt-28" }, h("div", { class: "container pb-20 xl:pb-40 " }, h("div", { class: "grid-layout" }, h("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, h("eds-social-networks", { class: "mt-28" })), h("nav", { "aria-label": "Secondary nav", class: "grid-col-span-12 lg:grid-col-span-6 lg:grid-col-start-7 grid-layout mt-28 gap-y-12 lg:mt-0" }))))) : null, h("div", { key: '747d4708e90c13fe9e5aa234eaba182df100fca9', class: `border-softest ${this.social ? 'border-t-2' : ''} pt-20 pb-28 md:pt-28` }, h("div", { key: '3fecf340c536bb64aa98fd04c26c5b47d146630b', class: "container flex flex-wrap items-center gap-20 lg:flex-nowrap" }, h("div", { key: '6b7f167ac50c6aef9c76e56634a7228585c211db', class: "flex items-center gap-x-12" }, h("a", { key: '8e496d31c4b883a867b5f2c6a5fab8a60899470a', target: "_blank", rel: "noopener noreferrer", class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-2020_en", "aria-label": "Learn about Horizon 2020 funding" }, h("eds-img", { key: 'b3cdfc2cc428951d58fe5ae4f1fe1992fbded7f7', width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg", alt: "European Union Flag" }))), h("div", { key: '8c3a9f55f07b44ad633b11a1d4faa8396a5ae30a', class: "order-last w-full lg:order-none lg:w-auto" }, h("div", { key: 'c268c107f6be692756d15a8f096e1a86df7bb62a', class: "f-ui-04 text-light" }, h("p", { key: '528014cafcd1b498efa01482934b54c44dd03bd6' }, this.fundedBy), h("div", { key: 'ee5baffcf8f801b7480c8158b30777329699f57f', class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap inline-block" }, h("span", { key: '79e600b799480904f47261be78262f344ada967b', class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline" }, "\u00A9 ", this.rightsReserved)))), h("div", { key: '6bde5399c1044e0d85b71c9fab7e3e4c8b93e224', class: "ml-auto pl-12" }, this.enableScrollTop ? (h("eds-button", { "aria-label": "Back to top", intent: "ghostInverse", icon: "chevron-up", onClick: this.backToTop })) : null)))));
     }
     static get style() { return EdsFooterStyle0; }
 }, [0, "eds-footer", {
         "extraClass": [1, "extra-class"],
         "social": [4],
-        "hasCookiesSetUp": [4, "has-cookies-set-up"],
         "enableScrollTop": [4, "enable-scroll-top"],
         "fundedBy": [1, "funded-by"],
         "rightsReserved": [1, "rights-reserved"],
-        "cookiesPreference": [1, "cookies-preference"]
+        "showMatomoNotice": [32]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/eds-form.js

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { t as toast } from './toastManager.js';
+import { s as sendAnalytics } from './analytics.js';
 import { d as defineCustomElement$c } from './eds-alert2.js';
 import { d as defineCustomElement$b } from './eds-button2.js';
 import { d as defineCustomElement$a } from './eds-icon-wrapper2.js';
@@ -64,13 +65,20 @@ const EdsForm$1 = /*@__PURE__*/ proxyCustomElement(class EdsForm extends HTMLEle
             this.hasError = Object.keys(newErrors).length > 0;
         };
         this.handleSubmit = async (e) => {
-            var _a;
+            var _a, _b, _c;
             e.preventDefault();
             if (this.isSubmitting) {
                 return;
             }
             this.validateForm();
             if (this.hasError) {
+                sendAnalytics({
+                    category: 'ui-component',
+                    parentContext: null,
+                    tag: this.el.tagName.toLowerCase(),
+                    name: `${(_a = this.submitBtnLabel) === null || _a === void 0 ? void 0 : _a.toLowerCase()}/error` || '',
+                    action: 'click'
+                });
                 this.alertMessage = this.errorMessage;
                 return;
             }
@@ -91,7 +99,7 @@ const EdsForm$1 = /*@__PURE__*/ proxyCustomElement(class EdsForm extends HTMLEle
                 formData.set('form_url', window.location.href);
             }
             if (this.authUser) {
-                formData.set('form_user', (_a = this.authUser) === null || _a === void 0 ? void 0 : _a.email);
+                formData.set('form_user', (_b = this.authUser) === null || _b === void 0 ? void 0 : _b.email);
             }
             /*const formDataObject = Object.fromEntries((formData as any).entries());
             console.log(JSON.stringify(formDataObject));*/
@@ -117,6 +125,13 @@ const EdsForm$1 = /*@__PURE__*/ proxyCustomElement(class EdsForm extends HTMLEle
                 //this.alertMessage = data.message || this.successMessage;
                 toast.show(data.message || this.successMessage, 'success');
                 this.formEl.reset();
+                sendAnalytics({
+                    category: 'ui-component',
+                    parentContext: null,
+                    tag: this.el.tagName.toLowerCase(),
+                    name: `${(_c = this.submitBtnLabel) === null || _c === void 0 ? void 0 : _c.toLowerCase()}/success` || '',
+                    action: 'click'
+                });
             }
             catch (err) {
                 this.hasError = true;
@@ -157,20 +172,21 @@ const EdsForm$1 = /*@__PURE__*/ proxyCustomElement(class EdsForm extends HTMLEle
     componentDidLoad() {
         this.parseFields(this.fields);
         // Emit context for each eds-link element after the component is fully loaded
-        const links = this.el.querySelectorAll('eds-button');
+        /*const links = this.el.querySelectorAll('eds-button');
         links.forEach((link) => {
-            this.emitContext(link);
-        });
-    }
-    emitContext(linkElement) {
-        const event = new CustomEvent('parentContext', {
-            detail: {
-                componentName: this.el.tagName.toLowerCase(),
-                identifier: null
-            }
-        });
-        linkElement.dispatchEvent(event);
+          this.emitContext(link);
+        });*/
     }
+    /*emitContext(linkElement: HTMLElement) {
+      const event = new CustomEvent<ParentContextDetail>('parentContext', {
+        detail: {
+          componentName: this.el.tagName.toLowerCase(),
+          identifier: null
+        }
+      });
+  
+      linkElement.dispatchEvent(event);
+    }*/
     // Visibility helper
     isFieldVisible(field) {
         if (!field.condition) {
@@ -335,13 +351,13 @@ const EdsForm$1 = /*@__PURE__*/ proxyCustomElement(class EdsForm extends HTMLEle
     render() {
         const hiddenFields = this.parsedFields.filter((field) => field.type === 'hidden');
         const otherFields = this.parsedFields.filter((field) => field.type !== 'hidden');
-        return (h("form", { key: '0a106caa8aa9f056b55acf6fecfbc7090c4411d2', ref: (el) => (this.formEl = el), enctype: "multipart/form-data", autocomplete: "on", method: "post", onSubmit: this.handleSubmit }, h("div", { key: '3478d82640378d9a1c0c09394453e2118b1b3ca9' }, h("slot", { key: '9bc37f54c03b2b0f831da917b6ce6bab2ec11084' }), hiddenFields.map((field, index) => (h("eds-input", { key: index, type: "hidden", name: field.name, value: field.value }))), otherFields.map((field, index) => {
+        return (h("form", { key: '3d4ae34d48c0551f9de6dacb50ceee15b487b5de', ref: (el) => (this.formEl = el), enctype: "multipart/form-data", autocomplete: "on", method: "post", onSubmit: this.handleSubmit }, h("div", { key: '344c56dcba3de5a1b55255d794a78fb0f19d04b5' }, h("slot", { key: '3ca6d203458d67fa66840fac55f94d71acc2ee4d' }), hiddenFields.map((field, index) => (h("eds-input", { key: index, type: "hidden", name: field.name, value: field.value }))), otherFields.map((field, index) => {
             var _a, _b;
             if (!this.isFieldVisible(field)) {
                 return null;
             }
             return (h("eds-input-field", { key: index, name: field.name, id: `${this.name}_${field.name}`, label: field.label, type: field.type, icon: field.icon || null, required: field.required, maxLength: field.maxlength, hint: field.hint, error: ((_a = this.errors[field.name]) === null || _a === void 0 ? void 0 : _a.length) > 0, errorMessage: (_b = this.errors[field.name]) === null || _b === void 0 ? void 0 : _b.join('<br />'), onInput: (e) => this.handleChange(e, field), class: index > 0 ? 'mt-20' : '', options: field.options }));
-        })), this.submitBtn && (h("div", { key: 'ca221e8c5c18cf4a107581736728f84cea7831d0', class: "mt-20" }, h("eds-button", { key: 'eef3cf052beb62703c1df74d142650194d60c501', intent: "primary", label: this.submitBtnLabel, disabled: this.isSubmitting || (this.coupleAuth && !this.isAuthenticated), loading: this.isSubmitting, onClick: (e) => this.handleSubmit(e) }), this.coupleAuth && !this.isAuthenticated ? (h("p", { class: "f-ui-05 text-lighter mt-8 ml-8" }, this.submitBtnHintMessage)) : null)), this.alertMessage && (this.formSubmitted || this.hasError) && (h("div", { key: '69861c8776b99e26a08585a5a8c893c85a2d9999', class: "mt-20" }, h("eds-alert", { key: 'b4d225d8efcbe6cde95789c367f0ecf94f217c9c', message: this.alertMessage, intent: this.hasError ? 'error' : 'success', direction: "horizontal" })))));
+        })), this.submitBtn && (h("div", { key: '22915285f3522f6d260e358eea964c59a9557a55', class: "mt-20" }, h("eds-button", { key: '9e2191ba8cc49d7ac2a6588c0fa468214773c791', intent: "primary", label: this.submitBtnLabel, disabled: this.isSubmitting || (this.coupleAuth && !this.isAuthenticated), loading: this.isSubmitting, onClick: (e) => this.handleSubmit(e) }), this.coupleAuth && !this.isAuthenticated ? (h("p", { class: "f-ui-05 text-lighter mt-8 ml-8" }, this.submitBtnHintMessage)) : null)), this.alertMessage && (this.formSubmitted || this.hasError) && (h("div", { key: '8045c3dff26286a6735157b82afd56ec9001ba14', class: "mt-20" }, h("eds-alert", { key: 'dc8c8f74e8aada9023f110bb862afee1fb629601', message: this.alertMessage, intent: this.hasError ? 'error' : 'success', direction: "horizontal" })))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/eds-frame.js

@@ -82,7 +82,7 @@ const EdsFrame$1 = /*@__PURE__*/ proxyCustomElement(class EdsFrame extends HTMLE
         return `${this.storybookUrl}/iframe.html?id=${this.storyPath}&viewMode=story`;
     }
     render() {
-        return (h("div", { key: '0c3a43efc1a125af5999af88c4eb071b5c3bc6c5', class: this.articleClasses() }, h("div", { key: '32303d5e2c2f3b01efe1ceaf828346f873bea6b6', class: "effect-height flex items-center justify-between py-8 px-12" }, h("span", { key: '75f7f6750413dad4af2ea62c12ffb994491d5d01', class: "f-ui-02" }, this.frameLabel), !this.iframeError ? (h("eds-link", { label: this.urlLabel, url: this.storyLink, intent: this.intent, class: "ml-auto", external: true, disabled: false, icon: "arrow-diagonal" })) : null), h("div", { key: '1fd99f6eda026814910b0cd93635616b7d3ffe09', class: "border-softer border-t-2" }, this.iframeError ? (h("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage)) : (h("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: true })))));
+        return (h("div", { key: '20786dd40414d29f98d496e29720bd78b9d7cf8e', class: this.articleClasses() }, h("div", { key: '208612330c9d2872c68aeb310e164c8a915a51ef', class: "effect-height flex items-center justify-between py-8 px-12" }, h("span", { key: 'ada2a40384ffaffadc8887580aa6184422008a68', class: "f-ui-02" }, this.frameLabel), !this.iframeError ? (h("eds-link", { label: this.urlLabel, url: this.storyLink, intent: this.intent, class: "ml-auto", external: true, disabled: false, icon: "arrow-diagonal" })) : null), h("div", { key: '26a5ae1c81b60b05b6f4859ffa4dbd13bb2557f3', class: "border-softer border-t-2" }, this.iframeError ? (h("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage)) : (h("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: true })))));
     }
     get el() { return this; }
 }, [0, "eds-frame", {

package/dist/components/eds-header.js

@@ -1,13 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { d as defineCustomElement$a } from './eds-avatar2.js';
-import { d as defineCustomElement$9 } from './eds-button2.js';
-import { d as defineCustomElement$8 } from './eds-dropdown2.js';
-import { d as defineCustomElement$7 } from './eds-icon-wrapper2.js';
-import { d as defineCustomElement$6 } from './eds-img2.js';
-import { d as defineCustomElement$5 } from './eds-link2.js';
-import { d as defineCustomElement$4 } from './eds-logo2.js';
-import { d as defineCustomElement$3 } from './eds-user2.js';
-import { d as defineCustomElement$2 } from './eds-user-modal2.js';
+import { d as defineCustomElement$5 } from './eds-button2.js';
+import { d as defineCustomElement$4 } from './eds-icon-wrapper2.js';
+import { d as defineCustomElement$3 } from './eds-link2.js';
+import { d as defineCustomElement$2 } from './eds-logo2.js';
 
 const edsHeaderCss = "";
 const EdsHeaderStyle0 = edsHeaderCss;
@@ -20,11 +15,7 @@ const EdsHeader$1 = /*@__PURE__*/ proxyCustomElement(class EdsHeader extends HTM
         this.homeUrl = '/';
         this.links = undefined;
         this.inverseHeader = false;
-        this.userFeature = false;
         this.menuEnabled = false;
-        this.keycloakUrl = undefined;
-        this.keycloakRealm = undefined;
-        this.keycloakClientId = undefined;
         this.isMenuOpen = false;
         this.isUserMenuOpen = false;
         this.isAuthenticated = false;
@@ -97,8 +88,8 @@ const EdsHeader$1 = /*@__PURE__*/ proxyCustomElement(class EdsHeader extends HTM
         return [];
     }
     render() {
-        return (h("header", { key: 'b16e5e84ba7565ebf4ea5892a9a1af84fc94769d', class: `flex items-center justify-between relative z-10
-       ${this.inverseHeader ? 'text-inverse bg-strongest' : 'text-default bg-dark'}` }, h("div", { key: '00206a2714dedfe205151002cc10c430e75814fb', class: "mr-auto w-[200px] h-[85px]" }, h("eds-logo", { key: '25fc6207d61bb4cc06877dd0b15bf56392b50255', type: this.inverseHeader ? 'color-white' : 'color', href: this.homeUrl })), this.parsedLinks && (h("nav", { key: '8d1ee2947db26e5acb556da845fe1b811a8d18b2', class: "absolute left-1/2 top-1/2 grow -translate-x-1/2 -translate-y-1/2 justify-center hidden md:flex" }, h("ul", { key: '5c70e48f3a617a6abe402659b37741e657440cbc', class: "flex gap-x-2" }, this.parsedLinks.map((link) => (h("eds-link", { label: link.label, "aria-label": link.label, url: link.url, intent: "ghost", size: "small", icon: link.icon, external: link.external, "extra-class": "after:effect-opacity aria-current-page:bg-darker whitespace-nowrap !text-current after:!border-transparent after:opacity-0 hover:after:!border-transparent hover:after:opacity-100" })))))), h("slot", { key: '773b60e90ecfe336fede86ea6e3b0ec2fd10bd72' }), this.userFeature ? (h("div", { class: "px-16" }, h("eds-user", { "keycloak-url": this.keycloakUrl, "keycloak-realm": this.keycloakRealm, "keycloak-client-id": this.keycloakClientId }))) : null, this.menuEnabled ? (h("div", { class: "md:hidden flex overflow-hidden px-16" }, h("eds-button", { "aria-label": "Menu", intent: "ghostInverse", icon: "menu", size: "small", onClick: () => this.handleToggleMenu() }))) : null));
+        return (h("header", { key: '8447435914bd3cdf61ce03f2a6bc646fd6b39b01', class: `flex items-center justify-between relative z-10
+       ${this.inverseHeader ? 'text-inverse bg-strongest' : 'text-default bg-dark'}` }, h("div", { key: '2a7a525d9ec5f86437212ab5b6c60c901e1f69a8', class: "mr-auto w-[200px] h-[85px]" }, h("eds-logo", { key: '29381ef7d9f600690a373a09be30b2dea6d5b936', type: this.inverseHeader ? 'color-white' : 'color', href: this.homeUrl })), this.parsedLinks && (h("nav", { key: '8085c6dfa6dadce3d7eefb45505e9c9404fd422d', class: "absolute left-1/2 top-1/2 grow -translate-x-1/2 -translate-y-1/2 justify-center hidden md:flex" }, h("ul", { key: 'cb8442be1efc058dc46c283c85e50c58dd627f3e', class: "flex gap-x-2" }, this.parsedLinks.map((link) => (h("eds-link", { label: link.label, "aria-label": link.label, url: link.url, intent: "ghost", size: "small", icon: link.icon, external: link.external, "extra-class": "after:effect-opacity aria-current-page:bg-darker whitespace-nowrap !text-current after:!border-transparent after:opacity-0 hover:after:!border-transparent hover:after:opacity-100" })))))), h("slot", { key: '5d39561f4f43641640cc3f5d01edd35ebde794e3' }), this.menuEnabled ? (h("div", { class: "md:hidden flex overflow-hidden px-16" }, h("eds-button", { "aria-label": "Menu", intent: "ghostInverse", icon: "menu", size: "small", onClick: () => this.handleToggleMenu() }))) : null));
     }
     get hostEl() { return this; }
     static get style() { return EdsHeaderStyle0; }
@@ -106,11 +97,7 @@ const EdsHeader$1 = /*@__PURE__*/ proxyCustomElement(class EdsHeader extends HTM
         "homeUrl": [513, "home-url"],
         "links": [1],
         "inverseHeader": [4, "inverse-header"],
-        "userFeature": [4, "user-feature"],
         "menuEnabled": [4, "menu-enabled"],
-        "keycloakUrl": [1, "keycloak-url"],
-        "keycloakRealm": [1, "keycloak-realm"],
-        "keycloakClientId": [1, "keycloak-client-id"],
         "isMenuOpen": [32],
         "isUserMenuOpen": [32],
         "isAuthenticated": [32]
@@ -119,54 +106,29 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["eds-header", "eds-avatar", "eds-button", "eds-dropdown", "eds-icon-wrapper", "eds-img", "eds-link", "eds-logo", "eds-user", "eds-user-modal"];
+    const components = ["eds-header", "eds-button", "eds-icon-wrapper", "eds-link", "eds-logo"];
     components.forEach(tagName => { switch (tagName) {
         case "eds-header":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, EdsHeader$1);
             }
             break;
-        case "eds-avatar":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$a();
-            }
-            break;
         case "eds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "eds-dropdown":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "eds-icon-wrapper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "eds-img":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "eds-link":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }
             break;
-        case "eds-logo":
+        case "eds-icon-wrapper":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }
             break;
-        case "eds-user":
+        case "eds-link":
             if (!customElements.get(tagName)) {
                 defineCustomElement$3();
             }
             break;
-        case "eds-user-modal":
+        case "eds-logo":
             if (!customElements.get(tagName)) {
                 defineCustomElement$2();
             }

package/dist/components/eds-icon-arrow-diagonal.js

@@ -8,7 +8,7 @@ const EdsIconArrowDiagonal$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconArr
         this.addClass = '';
     }
     render() {
-        return h("span", { key: '08ebdce5cfbe75bf4bfab8f72493e2178be55c3c', class: this.addClass, innerHTML: arrowDiagonal });
+        return h("span", { key: 'd85a4d425e0c255efe4763d4a13f13b6ff727c2c', class: this.addClass, innerHTML: arrowDiagonal });
     }
 }, [0, "eds-icon-arrow-diagonal", {
         "addClass": [1, "add-class"]

package/dist/components/eds-icon-arrow-right.js

@@ -8,7 +8,7 @@ const EdsIconArrowRight$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconArrowR
         this.class = '';
     }
     render() {
-        return h("span", { key: '6d704324784e6c3d9c221dcaf83bd86a8a6a94ab', class: this.class, innerHTML: arrowRight });
+        return h("span", { key: '4a2b33b86753acab8270a45c7b250603b128bc88', class: this.class, innerHTML: arrowRight });
     }
 }, [0, "eds-icon-arrow-right", {
         "class": [1]

package/dist/components/eds-icon-bluesky.js

@@ -8,7 +8,7 @@ const EdsIconBluesky$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconBluesky e
         this.class = '';
     }
     render() {
-        return h("span", { key: '8b5d4cfeedf6d7e9bea48d7ba892527d484c858d', class: this.class, innerHTML: bluesky });
+        return h("span", { key: '845a157678b9d059b2c9bd8a6265d3a62f33c31a', class: this.class, innerHTML: bluesky });
     }
 }, [0, "eds-icon-bluesky", {
         "class": [1]

package/dist/components/eds-icon-chevron-down.js

@@ -8,7 +8,7 @@ const EdsIconChevronDown$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChevr
         this.class = '';
     }
     render() {
-        return h("span", { key: 'bc01e9e10033245e02403b6b919911018eef9919', class: this.class, innerHTML: chevronDown });
+        return h("span", { key: 'fa8022d27b91e909d4cd5522c6d0406be698a412', class: this.class, innerHTML: chevronDown });
     }
 }, [0, "eds-icon-chevron-down", {
         "class": [1]

package/dist/components/eds-icon-chevron-left.js

@@ -8,7 +8,7 @@ const EdsIconChevronLeft$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChevr
         this.class = '';
     }
     render() {
-        return h("span", { key: 'd74bd0b2ddfd5bd61c97309aebb71d7c29f0cf43', class: this.class, innerHTML: chevronLeft });
+        return h("span", { key: 'c723d7f1bbd596063ae7e66123b8038af5320a54', class: this.class, innerHTML: chevronLeft });
     }
 }, [0, "eds-icon-chevron-left", {
         "class": [1]

package/dist/components/eds-icon-chevron-right.js

@@ -8,7 +8,7 @@ const EdsIconChevronRight$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChev
         this.class = '';
     }
     render() {
-        return h("span", { key: '998491aed74bd3edd1fb8545f85ab52cf2703b3f', class: this.class, innerHTML: chevronRight });
+        return h("span", { key: 'f770cd9151077e8708c76d2082613c65a20c420f', class: this.class, innerHTML: chevronRight });
     }
 }, [0, "eds-icon-chevron-right", {
         "class": [1]

package/dist/components/eds-icon-chevron-up.js

@@ -8,7 +8,7 @@ const EdsIconChevronUp$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChevron
         this.class = '';
     }
     render() {
-        return h("span", { key: 'd0723afa766fc6dac454ec84602bd50ba4e49950', class: this.class, innerHTML: chevronUp });
+        return h("span", { key: '40d18a840277f2aba5d314a36fca5c1f8fd99cc6', class: this.class, innerHTML: chevronUp });
     }
 }, [0, "eds-icon-chevron-up", {
         "class": [1]

package/dist/components/eds-icon-close.js

@@ -8,7 +8,7 @@ const EdsIconClose$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconClose exten
         this.class = '';
     }
     render() {
-        return h("span", { key: '365ad476b1be9c708e73598cad1dd42a908fa1cd', class: this.class, innerHTML: close });
+        return h("span", { key: '947f6615e8ee155be98b379a9c771cc0d453becd', class: this.class, innerHTML: close });
     }
 }, [0, "eds-icon-close", {
         "class": [1]

package/dist/components/eds-icon-copy.js

@@ -8,7 +8,7 @@ const EdsIconCopy$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconCopy extends
         this.class = '';
     }
     render() {
-        return h("span", { key: '770c34b98ec0e0a7e16de4d7b5b41b4afec9911e', class: this.class, innerHTML: copy });
+        return h("span", { key: '1e23d4493d5a1d07bc794da20cc4e445a87d56b0', class: this.class, innerHTML: copy });
     }
 }, [0, "eds-icon-copy", {
         "class": [1]

package/dist/components/eds-icon-eu.js

@@ -8,7 +8,7 @@ const EdsIconEu$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconEu extends HTM
         this.class = '';
     }
     render() {
-        return h("span", { key: 'cc6e5f7d7333ff7ed4a6f716e0ee90806fa782f9', class: this.class, innerHTML: euSvg });
+        return h("span", { key: '14254e1b9d43562e6f3f943de22aa8dd4d89a044', class: this.class, innerHTML: euSvg });
     }
 }, [0, "eds-icon-eu", {
         "class": [1]

package/dist/components/eds-icon-facebook.js

@@ -8,7 +8,7 @@ const EdsIconFacebook$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconFacebook
         this.class = '';
     }
     render() {
-        return h("span", { key: 'f859db4f8b6679e138e6d72d1d0f5e5bd1bcf997', class: this.class, innerHTML: facebook });
+        return h("span", { key: '902598891dfe926f92ce5d30dc135896c6eccd43', class: this.class, innerHTML: facebook });
     }
 }, [0, "eds-icon-facebook", {
         "class": [1]

package/dist/components/eds-icon-gitlab.js

@@ -8,7 +8,7 @@ const EdsIconGitlab$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconGitlab ext
         this.class = '';
     }
     render() {
-        return h("span", { key: '5a91cfc15c4dec2b50ce57fb0f1d6cc8f57b03e8', class: this.class, innerHTML: gitlabBlack });
+        return h("span", { key: '128f9265dfc1aee95586ba0a3fd20dd131678893', class: this.class, innerHTML: gitlabBlack });
     }
 }, [0, "eds-icon-gitlab", {
         "class": [1]

package/dist/components/eds-icon-linkedin.js

@@ -8,7 +8,7 @@ const EdsIconLinkedin$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconLinkedin
         this.class = '';
     }
     render() {
-        return h("span", { key: 'b8e0661a74a92c72b6db109cb48db12da48dcf92', class: this.class, innerHTML: linkedin });
+        return h("span", { key: '0f9675a371ca7bb460882c04bf2bb0c103273a0d', class: this.class, innerHTML: linkedin });
     }
 }, [0, "eds-icon-linkedin", {
         "class": [1]

package/dist/components/eds-icon-loader.js

@@ -8,7 +8,7 @@ const EdsIconLoader$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconLoader ext
         this.class = '';
     }
     render() {
-        return h("span", { key: '260c4eeb69ff79d943571c1461346b9019ea513a', class: this.class, innerHTML: loader });
+        return h("span", { key: 'f11c60068baa2d2398056b3d7f04129d9deb4517', class: this.class, innerHTML: loader });
     }
 }, [0, "eds-icon-loader", {
         "class": [1]

package/dist/components/eds-icon-mastodon.js

@@ -8,7 +8,7 @@ const EdsIconMastodon$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconMastodon
         this.class = '';
     }
     render() {
-        return h("span", { key: '902598891dfe926f92ce5d30dc135896c6eccd43', class: this.class, innerHTML: mastodon });
+        return h("span", { key: '1f68e5d0b6f8455f40bf94f6095eceff00b7887e', class: this.class, innerHTML: mastodon });
     }
 }, [0, "eds-icon-mastodon", {
         "class": [1]

package/dist/components/eds-icon-menu.js

@@ -8,7 +8,7 @@ const EdsIconMenu$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconMenu extends
         this.class = '';
     }
     render() {
-        return h("span", { key: '9d15be28017eb074a69846a2a639861de997130b', class: this.class, innerHTML: menu });
+        return h("span", { key: '0084602c8e870b70caa66479f71bed3bd0cce94e', class: this.class, innerHTML: menu });
     }
 }, [0, "eds-icon-menu", {
         "class": [1]

package/dist/components/eds-icon-more.js

@@ -8,7 +8,7 @@ const EdsIconMore$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconMore extends
         this.class = '';
     }
     render() {
-        return h("span", { key: '0f7d61104f8f2b0a83c5b60a6ce81c6ab91ecb9c', class: this.class, innerHTML: more });
+        return h("span", { key: 'dd9df55fa03c1b27f2f931c7d07ccc69ee940ff4', class: this.class, innerHTML: more });
     }
 }, [0, "eds-icon-more", {
         "class": [1]

package/dist/components/eds-icon-search.js

@@ -8,7 +8,7 @@ const EdsIconSearch$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconSearch ext
         this.class = '';
     }
     render() {
-        return h("span", { key: '6795d973d3a1fff27c2fd6181235d0284abaf3b7', class: this.class, innerHTML: search });
+        return h("span", { key: '42acc730afd956c2884b0789b3ea37ccf323630b', class: this.class, innerHTML: search });
     }
 }, [0, "eds-icon-search", {
         "class": [1]

package/dist/components/eds-icon-success.js

@@ -8,7 +8,7 @@ const EdsIconSuccess$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconSuccess e
         this.class = '';
     }
     render() {
-        return h("span", { key: '15e428fd72496249adfe372847d5c683cd3412b1', class: this.class, innerHTML: success });
+        return h("span", { key: '8b5d4cfeedf6d7e9bea48d7ba892527d484c858d', class: this.class, innerHTML: success });
     }
 }, [0, "eds-icon-success", {
         "class": [1]