@ebrains/components 0.5.0-alpha.0 → 0.7.0-alpha.0

package/dist/components/eds-login.js

@@ -1,121 +1,4 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { l as login, a as logout, i as initKeycloak, b as isAuthenticated, g as getUser } from './keycloak.js';
-import { t as toast } from './toastManager.js';
-import { d as defineCustomElement$3 } from './eds-button2.js';
-import { d as defineCustomElement$2 } from './eds-icon-wrapper2.js';
-
-const EdsLogin$1 = /*@__PURE__*/ proxyCustomElement(class EdsLogin extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.authStatusChanged = createEvent(this, "authStatusChanged", 7);
-        /**
-         * Handles user login by invoking the Keycloak `login` function.
-         * Only triggers login if the user is not already authenticated.
-         */
-        this.handleLogin = async () => {
-            if (!this.authenticated) {
-                try {
-                    await login();
-                    toast.show('You are authenticated', 'success');
-                }
-                catch (error) {
-                    toast.show(error.message, 'error');
-                }
-            }
-        };
-        /**
-         * Handles user logout by invoking the Keycloak `logout` function.
-         * Resets the `authenticated` state to `false` after logout.
-         */
-        this.handleLogout = async () => {
-            try {
-                await logout();
-            }
-            catch (error) {
-                toast.show(error.message, 'error');
-            }
-            this.authenticated = false;
-            this.user = null;
-        };
-        this.keycloakUrl = undefined;
-        this.keycloakRealm = undefined;
-        this.keycloakClientId = undefined;
-        this.authenticated = false;
-        this.user = null;
-    }
-    /**
-     * Lifecycle method that runs when the component is about to load.
-     * It initializes authentication by calling the `initAuth` method.
-     */
-    async componentWillLoad() {
-        // Check if required props are provided (optional check)
-        if (!this.keycloakUrl || !this.keycloakRealm || !this.keycloakClientId) {
-            // eslint-disable-next-line
-            console.error('Keycloak configuration props are missing.');
-            return;
-        }
-        await this.initAuth();
-    }
-    /**
-     * Initializes the Keycloak authentication by configuring Keycloak with the provided props.
-     * Sets the `authenticated` state and `user` data if the user is authenticated.
-     * Emits `authStatusChanged` event with the authentication status.
-     */
-    async initAuth() {
-        try {
-            await initKeycloak({
-                url: this.keycloakUrl,
-                realm: this.keycloakRealm,
-                clientId: this.keycloakClientId
-            }, true);
-            if (isAuthenticated()) {
-                this.user = getUser();
-                this.authenticated = true;
-                this.authStatusChanged.emit({
-                    authenticated: this.authenticated,
-                    user: this.user
-                }); // Emit auth status change
-            }
-        }
-        catch (error) {
-            toast.show(error.message, 'error');
-        }
-    }
-    render() {
-        return (h("div", { key: 'cd30a135920ae77959330a43a8544bb9c231986e', class: "block" }, !this.authenticated && (h("eds-button", { key: '98fa63c46b063a67c215ff9160c6dfbfee2265f7', label: "Login", intent: "primary", "extra-class": "text-default", "aria-label": "Login", triggerClick: this.handleLogin.bind(this) }))));
-    }
-}, [1, "eds-login", {
-        "keycloakUrl": [1, "keycloak-url"],
-        "keycloakRealm": [1, "keycloak-realm"],
-        "keycloakClientId": [1, "keycloak-client-id"],
-        "authenticated": [32],
-        "user": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["eds-login", "eds-button", "eds-icon-wrapper"];
-    components.forEach(tagName => { switch (tagName) {
-        case "eds-login":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, EdsLogin$1);
-            }
-            break;
-        case "eds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "eds-icon-wrapper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
+import { E as EdsLogin$1, d as defineCustomElement$1 } from './eds-login2.js';
 
 const EdsLogin = EdsLogin$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/{cjs/keycloak-93fc0315.js → components/eds-login2.js}

@@ -1,4 +1,7 @@
-'use strict';
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { t as toast } from './toastManager.js';
+import { d as defineCustomElement$2 } from './eds-button2.js';
+import { d as defineCustomElement$1 } from './eds-icon-wrapper2.js';
 
 /*
  * Copyright 2016 Red Hat, Inc. and/or its affiliates
@@ -1947,9 +1950,127 @@ async function checkServerAvailability(url) {
     }
 }
 
-exports.checkServerAvailability = checkServerAvailability;
-exports.getUser = getUser;
-exports.initKeycloak = initKeycloak;
-exports.isAuthenticated = isAuthenticated;
-exports.login = login;
-exports.logout = logout;
+const EdsLogin = /*@__PURE__*/ proxyCustomElement(class EdsLogin extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.keycloak = createEvent(this, "keycloak", 7);
+        this.auth = createEvent(this, "auth", 7);
+        /**
+         * Handles user login by invoking the Keycloak `login` function.
+         * Only triggers login if the user is not already authenticated.
+         */
+        this.handleLogin = async () => {
+            if (!this.authenticated) {
+                try {
+                    await login();
+                }
+                catch (error) {
+                    toast.show(error.message, 'error');
+                }
+            }
+        };
+        /**
+         * Handles user logout by invoking the Keycloak `logout` function.
+         * Resets the `authenticated` state to `false` after logout.
+         */
+        this.handleLogout = async () => {
+            try {
+                await logout();
+            }
+            catch (error) {
+                toast.show(error.message, 'error');
+            }
+            this.authenticated = false;
+            this.user = null;
+        };
+        this.keycloakUrl = undefined;
+        this.keycloakRealm = undefined;
+        this.keycloakClientId = undefined;
+        this.authenticated = false;
+        this.user = null;
+        this.serverAvailable = false;
+    }
+    /**
+     * Lifecycle method that runs when the component is about to load.
+     * It initializes authentication by calling the `initAuth` method.
+     */
+    async componentWillLoad() {
+        // Check if required props are provided (optional check)
+        if (!this.keycloakUrl || !this.keycloakRealm || !this.keycloakClientId) {
+            // eslint-disable-next-line
+            console.error('Keycloak configuration props are missing.');
+            return;
+        }
+        this.serverAvailable = await checkServerAvailability(`${this.keycloakUrl}/realms/${this.keycloakRealm}`);
+        if (!this.serverAvailable) {
+            toast.show('Keycloak server is unavailable.', 'error');
+            return; // Do not proceed further
+        }
+        await this.initAuth();
+    }
+    /**
+     * Initializes the Keycloak authentication by configuring Keycloak with the provided props.
+     * Sets the `authenticated` state and `user` data if the user is authenticated.
+     * Emits `authStatusChanged` event with the authentication status.
+     */
+    async initAuth() {
+        try {
+            const res = await initKeycloak({
+                url: this.keycloakUrl,
+                realm: this.keycloakRealm,
+                clientId: this.keycloakClientId
+            }, true);
+            this.keycloak.emit({
+                init: res
+            });
+            if (isAuthenticated()) {
+                this.user = getUser();
+                this.authenticated = true;
+                this.auth.emit({
+                    authenticated: this.authenticated,
+                    user: this.user
+                }); // Emit auth status change
+            }
+        }
+        catch (error) {
+            toast.show(error.message, 'error');
+        }
+    }
+    render() {
+        return (h("div", { key: '074566b791eeb9ea4a0558b4ed83a96e4b673356', class: "block" }, !this.authenticated && (h("eds-button", { key: '3a05ff97a90d73204eb77c5dad0d328294d72d3e', label: "Login", intent: "primary", "extra-class": "text-default", "aria-label": "Login", triggerClick: this.handleLogin.bind(this) }))));
+    }
+}, [1, "eds-login", {
+        "keycloakUrl": [1, "keycloak-url"],
+        "keycloakRealm": [1, "keycloak-realm"],
+        "keycloakClientId": [1, "keycloak-client-id"],
+        "authenticated": [32],
+        "user": [32],
+        "serverAvailable": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-login", "eds-button", "eds-icon-wrapper"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-login":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsLogin);
+            }
+            break;
+        case "eds-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "eds-icon-wrapper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { EdsLogin as E, defineCustomElement as d };

package/dist/components/eds-logo-variations.js

@@ -20,7 +20,7 @@ const EdsLogoVariations$1 = /*@__PURE__*/ proxyCustomElement(class EdsLogoVariat
         }
     }
     render() {
-        return h("div", { key: '0494cbb3e7b4902e91a0c78c691bc3405b9f11cc', class: "container" }, this.renderContent());
+        return h("div", { key: '0b23fee608fcbe7059fce155bd65a0c0a4d16e07', class: "container" }, this.renderContent());
     }
 }, [0, "eds-logo-variations", {
         "tabIndex": [2, "tab-index"]

package/dist/components/eds-logo2.js

@@ -67,7 +67,7 @@ const EdsLogo = /*@__PURE__*/ proxyCustomElement(class EdsLogo extends HTMLEleme
     }
     render() {
         const logoContent = this.getLogo();
-        return (h("a", { key: 'ee8de4071b0137020341982b4c5cb2c938f1c4df', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, h("div", { key: '1eb620afbcc5a2a5c6914cc1c91a45ca62d0068c', innerHTML: logoContent })));
+        return (h("a", { key: '5656cc942833ab3f5511ab634c502d694e982db7', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, h("div", { key: '3e0763fdd94b7624182af3aee50b314c81f064d6', innerHTML: logoContent })));
     }
     get el() { return this; }
     static get style() { return EdsLogoStyle0; }

package/dist/components/eds-matomo-notice.js

@@ -1,143 +1,4 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { t as toast } from './toastManager.js';
-import { m as matomoOptIn } from './analytics.js';
-import { d as defineCustomElement$4 } from './eds-accordion2.js';
-import { d as defineCustomElement$3 } from './eds-button2.js';
-import { d as defineCustomElement$2 } from './eds-icon-wrapper2.js';
-
-const edsMatomoNoticeCss = ".fixed{position:fixed}.absolute{position:absolute}.w-full{width:100%}.bottom-0{bottom:0rem}.bottom-4{bottom:0.25rem}.p-4{padding:0.25rem}.p-6{padding:0.375rem}.p-8{padding:0.5rem}.z-10{z-index:10}.left-0{left:0rem}.left-1\\/2{left:50%}.grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex{display:flex}.gap-12{gap:0.75rem}.gap-20{gap:1.25rem}.gap-4{gap:0.25rem}@media (min-width: 750px){.md\\:left-1\\/2{left:50%}.md\\:flex{display:flex}.md\\:hidden{display:none}.md\\:-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.md\\:-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}}";
-const EdsMatomoNoticeStyle0 = edsMatomoNoticeCss;
-
-const EdsMatomoNotice$1 = /*@__PURE__*/ proxyCustomElement(class EdsMatomoNotice extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.title = 'Analytics Consent';
-        this.description = 'We use anonymous analytics to improve our services. No personal data is collected unless you give your consent.';
-        this.showNotice = true;
-    }
-    /**
-     * Lifecycle method called before the component is rendered.
-     * Checks for the presence of the "mtm_consent" cookie to determine
-     * if the notice should be displayed.
-     */
-    componentWillLoad() {
-        this.checkConsentCookie();
-    }
-    /**
-     * Lifecycle method called after the component has been rendered.
-     * Emits `parentContext` events for each `eds-button` in the shadow DOM.
-     */
-    componentDidLoad() {
-        const btns = this.el.shadowRoot.querySelectorAll('eds-button');
-        btns.forEach((b) => {
-            this.emitContext(b);
-        });
-    }
-    /**
-     * Emits a custom `parentContext` event for a given button element.
-     * This can be used to provide context information about the component.
-     *
-     * @param linkElement - The button element to which the event will be dispatched.
-     */
-    emitContext(linkElement) {
-        const event = new CustomEvent('parentContext', {
-            detail: {
-                componentName: this.el.tagName.toLowerCase(),
-                identifier: null
-            }
-        });
-        linkElement.dispatchEvent(event);
-    }
-    /**
-     * Checks if the Matomo "mtm_consent" cookie exists in the browser.
-     * If the cookie is found, the notice is hidden.
-     */
-    checkConsentCookie() {
-        const consentCookie = document.cookie.split('; ').find((row) => row.startsWith('mtm_consent='));
-        //this.showNotice = !consentCookie;
-        const sessionDeferred = sessionStorage.getItem('matomo-deferred');
-        this.showNotice = !consentCookie && !sessionDeferred;
-    }
-    /**
-     * Handles user consent for analytics tracking.
-     * Calls the `matomoOptIn` utility and shows a success toast notification.
-     */
-    optInAnalytics() {
-        matomoOptIn();
-        toast.show('You have opted in to analytics.', 'success');
-        this.hideNotice();
-    }
-    /**
-     * Handles user opt-out from analytics tracking.
-     * Calls the `matomoOptOut` utility and shows a warning toast notification.
-     
-    private optOutAnalytics() {
-      matomoOptOut();
-      toast.show('You have opted out of analytics.', 'warning');
-      this.hideNotice();
-    }*/
-    /**
-     * Handles "Ask me later" action by storing a session storage entry
-     * and hiding the notice for the rest of the session.
-     */
-    deferDecision() {
-        sessionStorage.setItem('matomo-deferred', 'true');
-        toast.show('You can decide later.', 'warning');
-        this.hideNotice();
-    }
-    /**
-     * Hides the notice by updating the `showNotice` state.
-     */
-    hideNotice() {
-        this.showNotice = false;
-    }
-    /**
-     * Renders the Matomo consent notice with user options.
-     * Includes an accordion for the description and two buttons for user consent.
-     */
-    render() {
-        if (!this.showNotice) {
-            return null;
-        }
-        return (h("div", { class: "fixed bottom-0 p-8 z-10 grow md:left-1/2 md:-translate-x-1/2 md:-translate-y-1/2 justify-center" }, h("eds-accordion", { title: this.title, description: this.description, switchBg: true, expanded: true }, h("div", { class: "flex items-center gap-4" }, h("eds-button", { intent: "primary", label: "Yes, I agree", "aria-label": "Opt-in for analytics", onClick: () => this.optInAnalytics() }), h("eds-button", { intent: "ghost", label: "Ask me later", "aria-label": "Defer analytics decision", onClick: () => this.deferDecision() })))));
-    }
-    get el() { return this; }
-    static get style() { return EdsMatomoNoticeStyle0; }
-}, [1, "eds-matomo-notice", {
-        "title": [1],
-        "description": [1],
-        "showNotice": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["eds-matomo-notice", "eds-accordion", "eds-button", "eds-icon-wrapper"];
-    components.forEach(tagName => { switch (tagName) {
-        case "eds-matomo-notice":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, EdsMatomoNotice$1);
-            }
-            break;
-        case "eds-accordion":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "eds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "eds-icon-wrapper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
+import { E as EdsMatomoNotice$1, d as defineCustomElement$1 } from './eds-matomo-notice2.js';
 
 const EdsMatomoNotice = EdsMatomoNotice$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/eds-matomo-notice2.js

@@ -0,0 +1,130 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { m as matomoOptIn, a as matomoOptOut } from './analytics.js';
+import { d as defineCustomElement$3 } from './eds-accordion2.js';
+import { d as defineCustomElement$2 } from './eds-button2.js';
+import { d as defineCustomElement$1 } from './eds-icon-wrapper2.js';
+
+const edsMatomoNoticeCss = ".fixed{position:fixed}.absolute{position:absolute}.w-full{width:100%}.bottom-0{bottom:0rem}.bottom-4{bottom:0.25rem}.p-4{padding:0.25rem}.p-6{padding:0.375rem}.p-8{padding:0.5rem}.z-10{z-index:10}.left-0{left:0rem}.left-1\\/2{left:50%}.grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex{display:flex}.gap-12{gap:0.75rem}.gap-20{gap:1.25rem}.gap-4{gap:0.25rem}@media (min-width: 750px){.md\\:left-1\\/2{left:50%}.md\\:flex{display:flex}.md\\:hidden{display:none}.md\\:-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.md\\:-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}}";
+const EdsMatomoNoticeStyle0 = edsMatomoNoticeCss;
+
+const EdsMatomoNotice = /*@__PURE__*/ proxyCustomElement(class EdsMatomoNotice extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.consent = createEvent(this, "consent", 7);
+        this.title = 'Analytics Consent';
+        this.description = 'We use anonymous analytics to improve our services. No personal data is collected unless you give your consent.';
+        this.forceShow = false;
+        this.showNotice = true;
+    }
+    /**
+     * Checks if the consent cookie exists.
+     */
+    hasCookieConsent() {
+        return !!document.cookie.split('; ').find((row) => row.startsWith('mtm_consent='));
+    }
+    /**
+     * Generate a unique storage key based on appId or the app's domain.
+     */
+    getStorageKey() {
+        return `${window.location.host}-matomo-deferred`;
+    }
+    /**
+     * Check cookies and sessionStorage (unless forceShow is true) to decide if the notice should be shown.
+     */
+    componentWillLoad() {
+        if (this.forceShow) {
+            // If forceShow is true, always show the notice
+            this.showNotice = true;
+        }
+        else {
+            // If user has already consented, hide the notice
+            // eslint-disable-next-line
+            if (this.hasCookieConsent()) {
+                this.showNotice = false;
+            }
+            else {
+                // Otherwise check if user deferred in this session
+                const sessionDeferred = sessionStorage.getItem(this.getStorageKey());
+                this.showNotice = !sessionDeferred;
+            }
+        }
+    }
+    componentDidLoad() {
+        const btns = this.el.shadowRoot.querySelectorAll('eds-button');
+        btns.forEach((b) => {
+            this.emitContext(b);
+        });
+    }
+    emitContext(linkElement) {
+        const event = new CustomEvent('parentContext', {
+            detail: {
+                componentName: this.el.tagName.toLowerCase(),
+                identifier: null
+            }
+        });
+        linkElement.dispatchEvent(event);
+    }
+    optInAnalytics() {
+        matomoOptIn();
+        this.hideNotice();
+        this.consent.emit('in');
+    }
+    optOutAnalytics() {
+        matomoOptOut();
+        this.hideNotice();
+        this.consent.emit('out');
+    }
+    deferDecision() {
+        sessionStorage.setItem(this.getStorageKey(), 'true');
+        this.hideNotice();
+        this.consent.emit('defer');
+    }
+    hideNotice() {
+        this.showNotice = false;
+    }
+    render() {
+        if (!this.showNotice) {
+            return null;
+        }
+        return (h("div", { class: "fixed bottom-0 p-8 z-10 grow md:left-1/2 md:-translate-x-1/2 md:-translate-y-1/2 justify-center" }, h("eds-accordion", { title: this.title, description: this.description, switchBg: true, expanded: true }, h("div", { class: "flex items-center gap-4" }, this.hasCookieConsent() ? (h("eds-button", { intent: "primary", label: "Opt-out", "aria-label": "Opt-out from analytics", onClick: () => this.optOutAnalytics() })) : (h("eds-button", { intent: "primary", label: "Yes, I agree", "aria-label": "Opt-in for analytics", onClick: () => this.optInAnalytics() })), h("eds-button", { intent: "ghost", label: "Ask me later", "aria-label": "Defer analytics decision", onClick: () => this.deferDecision() })))));
+    }
+    get el() { return this; }
+    static get style() { return EdsMatomoNoticeStyle0; }
+}, [1, "eds-matomo-notice", {
+        "title": [1],
+        "description": [1],
+        "forceShow": [4, "force-show"],
+        "showNotice": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-matomo-notice", "eds-accordion", "eds-button", "eds-icon-wrapper"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-matomo-notice":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsMatomoNotice);
+            }
+            break;
+        case "eds-accordion":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "eds-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "eds-icon-wrapper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { EdsMatomoNotice as E, defineCustomElement as d };

package/dist/components/eds-modal.js

@@ -75,6 +75,18 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
     async toggle() {
         this.isOpen = !this.isOpen;
     }
+    /**
+     * Listens for global custom events to open the modal.
+     */
+    handleGlobalOpen() {
+        this.open();
+    }
+    /**
+     * Listens for global custom events to close the modal.
+     */
+    handleGlobalClose() {
+        this.close();
+    }
     /**
      * Closes the modal when the Escape key is pressed.
      */
@@ -86,9 +98,9 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
     render() {
         // Generate a unique id for the title so we can reference it for aria-labelledby.
         const titleId = `modal-title-${this.el.tagName.toLowerCase()}`;
-        return (h("div", { key: 'cd976fb0cd0c0663279dcd4dbd5823e26b6c32f7', class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-50 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (h("div", { key: '40a2febed5d0ec15d5370183c97cfd05abd72007', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
+        return (h("div", { key: '980f396b79c32a36005b5f7813cc52b2e97457fa', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-50 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (h("div", { key: 'a2e4bb022c17c66266809f1a8dd706523a6ff07b', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
             ,
-            onClick: () => this.close() })), h("div", { key: '50f2c23d80a2007aca4d0a8911816141e43b71ee', class: `max-w-full absolute px-20 py-20 bg-inverse rounded-lg shadow-lg z-10 ${this.getModalPositionClasses()} grow justify-center` }, h("div", { key: 'e1cba5879bc488a99b896c48c8a780336b2195e7', class: "flex justify-between items-center border-b-2 border-softer pb-8" }, h("span", { key: '8f018e3d2890346d23e7dcb115676051048bcacb', id: titleId, class: `f-heading-04 text-lighter ${this.getTruncateClass()}` }, this.title), h("eds-button", { key: '4ae4013dd45573648817ac95ee4370ed615aa6a0', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8" })), h("div", { key: 'ac4e3d8f273d04ad02e0123c23b36b89bfc89db2', class: "pt-8" }, h("slot", { key: '60917e9f750bfd7948e580acc817cffe6424608a' })))));
+            onClick: () => this.close() })), h("div", { key: '53c0c2a9559a6a5116f88caa2a7d92810560521e', class: `container max-w-full absolute px-20 py-20 bg-inverse rounded-lg shadow-lg z-10 ${this.getModalPositionClasses()} grow justify-center` }, h("div", { key: '576b58f6bd78a969436c6a892f4dfec84a486cc4', class: "flex justify-between items-center border-b-2 border-softer pb-8" }, h("span", { key: '63e682d4297a346426dc7559cf0d80e21cc51f4c', id: titleId, class: `f-heading-04 text-lighter ${this.getTruncateClass()}` }, this.title), h("eds-button", { key: 'eed35b30903d65694f2944431e7f387a8ef3f3e9', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8" })), h("div", { key: '6c6e673640ed2ef2ae6139ae1931a4b0a0db9aa9', class: "pt-8" }, h("slot", { key: 'eaaf2c17470681dc799b74f5eaebbe2496564c0e' })))));
     }
     get el() { return this; }
     static get style() { return EdsModalStyle0; }
@@ -101,7 +113,7 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
         "open": [64],
         "close": [64],
         "toggle": [64]
-    }, [[8, "keydown", "handleKeyDown"]]]);
+    }, [[0, "eds-modal-open", "handleGlobalOpen"], [0, "eds-modal-close", "handleGlobalClose"], [8, "keydown", "handleKeyDown"]]]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;

package/dist/components/eds-pagination2.js

@@ -162,7 +162,7 @@ const EdsPagination = /*@__PURE__*/ proxyCustomElement(class EdsPagination exten
         event.preventDefault(); // Prevent default link navigation
         if (newPage !== this.currentPage) {
             this.links = this.links.map((link) => typeof link === 'object' ? Object.assign(Object.assign({}, link), { current: parseInt(link.label) === newPage }) : link);
-            const pageChangeEvent = new CustomEvent('pageChange', {
+            const pageChangeEvent = new CustomEvent('page', {
                 detail: newPage,
                 bubbles: true,
                 composed: true
@@ -172,7 +172,7 @@ const EdsPagination = /*@__PURE__*/ proxyCustomElement(class EdsPagination exten
         }
     }
     render() {
-        return (h("div", { key: '8c8418eec263acc153a928b752775458f897504f' }, this.total > 0 && this.mode === 'default' && (h("p", { key: '02a5a69772a4812f10b29e8df117b72df210614d', class: "f-ui-03 text-lightest mb-28 w-full text-center" }, h("span", { key: 'ef9804843100c722643c24e31a05f86f2d55efa0', class: "sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (h("nav", { "aria-label": "Pagination" }, h("ul", { class: "flex items-center justify-center gap-x-8" }, h("li", { class: "mr-auto" }, h("eds-link", { label: this.prevLabel, url: this.mode === 'navigator'
+        return (h("div", { key: 'b33415e05457ccc78ea3744a1baa9affbf38ca4a' }, this.total > 0 && this.mode === 'default' && (h("p", { key: 'e555e94a3fd13cf0d57108bd2cca3fb97cd0c688', class: "f-ui-03 text-lightest mb-28 w-full text-center" }, h("span", { key: 'c63f1d5aa6154a23d714c74dcd9a0a75b68df579', class: "sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (h("nav", { "aria-label": "Pagination" }, h("ul", { class: "flex items-center justify-center gap-x-8" }, h("li", { class: "mr-auto" }, h("eds-link", { label: this.prevLabel, url: this.mode === 'navigator'
                 ? this.prevUrl || '#' // Use prevUrl if provided, otherwise disable with '#'
                 : this.isFirstPage()
                     ? '#'

package/dist/components/eds-progress-bar2.js

@@ -19,7 +19,7 @@ const EdsProgressBar = /*@__PURE__*/ proxyCustomElement(class EdsProgressBar ext
     }
     render() {
         const progressValue = this.value;
-        return (h("div", { key: '0f47fedbf9d44887f65b399e184215f0937b1df1', role: "progressbar", "aria-valuemin": "0", "aria-valuemax": "100", "aria-valuenow": progressValue, "aria-valuetext": `${progressValue}%`, class: "outer w-full bg-default rounded-lg h-24 border border-softer overflow-hidden" }, h("div", { key: 'a2d095d778842c969832ea6b1ba7f7ef917d1390', class: `inner h-full rounded-lg bg-accent transition-all duration-300 flex items-center justify-center text-default f-body-02`, style: { width: `${progressValue}%` } }, progressValue, "%")));
+        return (h("div", { key: '9a7fa42058034305b22818d464e7b633d7831d67', role: "progressbar", "aria-valuemin": "0", "aria-valuemax": "100", "aria-valuenow": progressValue, "aria-valuetext": `${progressValue}%`, class: "outer w-full bg-default rounded-lg h-24 border border-softer overflow-hidden" }, h("div", { key: '90b0ac9a538b575a30163c0dbbf437e1cfe8ce39', class: `inner h-full rounded-lg bg-accent transition-all duration-300 flex items-center justify-center text-default f-body-02`, style: { width: `${progressValue}%` } }, progressValue, "%")));
     }
     static get style() { return EdsProgressBarStyle0; }
 }, [1, "eds-progress-bar", {