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

package/dist/components/eds-accordion2.js

@@ -72,10 +72,10 @@ const EdsAccordion = /*@__PURE__*/ proxyCustomElement(class EdsAccordion extends
      */
     render() {
         const minHeightContentClass = this.minHeightContent ? 'min-h-56' : '';
-        return (h("div", { key: '00bd9a34ceb469bef74c827bd1f48bf3d4b545b6', ref: (el) => (this.wrapperRef = el), class: `container flex effect-color border-softer relative grid overflow-hidden rounded-lg border-2 p-16 
+        return (h("div", { key: '119e170f4a94d2fa476ba1ddd94bcad78bde347a', ref: (el) => (this.wrapperRef = el), class: `flex effect-color border-softer relative grid overflow-hidden rounded-lg border-2 p-16 
           ${this.switchBg && this.isExpanded ? 'bg-inverse' : 'bg-default'} 
           ${this.switchBg ? 'hover:bg-inverse' : ''} 
-          ${minHeightContentClass}` }, h("h3", { key: 'ab6a953797e0a8379a01a9a2f00a4988d4fc8357', class: "mr-auto f-heading-06 text-left absolute inset-x-16 top-16 line-clamp-1" }, this.title), h("div", { key: 'cfd6f4ad2ec5e412cdf2348d188dfcf90770012d', class: "ml-auto" }, h("eds-button", { key: 'beaee69d610727b397645fc0a507b234003fde5e', id: "toggleAccordion", intent: "tertiary", "aria-expanded": this.isExpanded || this.shortContent, "aria-label": "Toggle accordion", "aria-controls": "accordionSection", class: `effect-color flex w-full items-center justify-between rounded-md outline-none focus:outline-none`, onClick: this.handleClick, icon: "chevron-down" })), h("div", { key: '795f14c0930a0b0862a86451cc7b7e807cb79c37', class: `w-full` }, this.description ? (h("span", { class: `text-light ${!this.isExpanded && this.clampText ? 'line-clamp-1' : ''}` }, this.description)) : null, h("section", { key: '28f6cba233cdee58743faaacc992bf7497c2ff2e', id: "accordionSection", role: "region", "aria-labelledby": "accordionHeader", "aria-hidden": !this.isExpanded, class: `z-1 effect-height relative h-0 w-full ${!this.isExpanded && this.clampText ? 'overflow-hidden' : ''}`, style: { height: this.isExpanded ? 'auto' : '0' } }, h("div", { key: '939e442c55babfd3f1750d20d9b95f664c3a67c8', ref: (el) => (this.childContentRef = el), class: `accordion-content effect-color pt-20`, "aria-hidden": !this.isExpanded }, h("span", { key: '648d16ed84cb3da227a10e6370004c6479789aed', class: `${!this.isExpanded && this.clampText ? 'line-clamp-2' : ''}` }, h("slot", { key: '90ca94f15e408b4b05c0eac4bd20fa21766cbb19' })))))));
+          ${minHeightContentClass}` }, h("h3", { key: 'c93f007091b7e48cc5ba327b02ce30929c945be0', class: "mr-auto f-heading-06 text-left absolute inset-x-16 top-16 line-clamp-1" }, this.title), h("div", { key: '464f2e58964cd96a276fcec54fb951d6f5c8aa14', class: "ml-auto" }, h("eds-button", { key: '5d2867854444e860f32a0a5e06c582aa5337c3c9', id: "toggleAccordion", intent: "tertiary", "aria-expanded": this.isExpanded || this.shortContent, "aria-label": "Toggle accordion", "aria-controls": "accordionSection", class: `effect-color flex w-full items-center justify-between rounded-md outline-none focus:outline-none`, onClick: this.handleClick, icon: "chevron-down" })), h("div", { key: '5a19c1fb7eccb4453343d098d12f25ede1e6548e', class: `w-full` }, this.description ? (h("span", { class: `text-light ${!this.isExpanded && this.clampText ? 'line-clamp-1' : ''}` }, this.description)) : null, h("section", { key: '472253d4ec57f79252bf435aedd721e943766a43', id: "accordionSection", role: "region", "aria-labelledby": "accordionHeader", "aria-hidden": !this.isExpanded, class: `z-1 effect-height relative h-0 w-full ${!this.isExpanded && this.clampText ? 'overflow-hidden' : ''}`, style: { height: this.isExpanded ? 'auto' : '0' } }, h("div", { key: '3033975fb22d5a23fb9d058e89698f375afabb49', ref: (el) => (this.childContentRef = el), class: `accordion-content effect-color pt-20`, "aria-hidden": !this.isExpanded }, h("span", { key: 'd75abb7f99d2e0c539625852dffc42790226b5b6', class: `${!this.isExpanded && this.clampText ? 'line-clamp-2' : ''}` }, h("slot", { key: '472d88604a37dc8e061e657f83851515234ea760' })))))));
     }
     get el() { return this; }
     static get style() { return EdsAccordionStyle0; }

package/dist/components/eds-button2.js

@@ -161,6 +161,7 @@ const EdsButton = /*@__PURE__*/ proxyCustomElement(class EdsButton extends HTMLE
                 iconOnly: false
             }
         });
+        this.parentContext = null; // Accepts the entire event detail or null
         this.label = undefined;
         this.ariaLabel = 'Button';
         this.elementType = 'button';
@@ -175,19 +176,14 @@ const EdsButton = /*@__PURE__*/ proxyCustomElement(class EdsButton extends HTMLE
         this.extraClass = undefined;
         this.triggerClick = undefined;
     }
-    /*private parentContext: ParentContextDetail | null = null; // Accepts the entire event detail or null
-  
-    @Listen('parentContext')
-    handleParentContext(event: CustomEvent) {
-      if (event.target !== this.el) {
-        // Ignore the event if it's not targeted at this specific instance
-        return;
-      }
-      //console.log(event.detail);
-      this.parentContext = event.detail;
-      event.stopPropagation();
+    handleParentContext(event) {
+        if (event.target !== this.el) {
+            // Ignore the event if it's not targeted at this specific instance
+            return;
+        }
+        this.parentContext = event.detail;
+        event.stopPropagation();
     }
-    */
     handleClick(event) {
         var _a, _b;
         if (this.disabled) {
@@ -197,7 +193,7 @@ const EdsButton = /*@__PURE__*/ proxyCustomElement(class EdsButton extends HTMLE
         }
         sendAnalytics({
             category: 'ui-component',
-            parentContext: null,
+            parentContext: this.parentContext,
             tag: this.el.tagName.toLowerCase(),
             name: ((_a = this.label) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || ((_b = this.ariaLabel) === null || _b === void 0 ? void 0 : _b.toLowerCase()) || '',
             action: 'click'
@@ -224,7 +220,7 @@ const EdsButton = /*@__PURE__*/ proxyCustomElement(class EdsButton extends HTMLE
             show: !this.loading
         });
         const ElementType = this.elementType;
-        return (h(ElementType, { key: '52cda715164eeca59e35b45f617a2d6d1b05a94c', "aria-label": this.label || this.ariaLabel || undefined, "aria-disabled": this.elementType === 'button' ? this.disabled : undefined, disabled: this.elementType === 'button' ? this.disabled : undefined, class: `${classes || ''} ${this.extraClass || ''}`, onClick: (event) => this.handleClick(event) }, this.label && h("span", { key: '866cd0272d9f381b3ecb892e588c860ca8b41051', class: this.loading ? 'opacity-0' : '' }, this.label), this.loading && (h("span", { key: 'fcba01e3404724869c59f4e21bd5db459643d840', class: "absolute inset-0 flex items-center justify-center" }, h("span", { key: 'e44955e5641e757e66eb4961097fb4d60e4def7c', class: "loader", style: {
+        return (h(ElementType, { key: '8bd80319c1b541b6dd6628357b8e2e1333a8d15b', "aria-label": this.label || this.ariaLabel || undefined, "aria-disabled": this.elementType === 'button' ? this.disabled : undefined, disabled: this.elementType === 'button' ? this.disabled : undefined, class: `${classes || ''} ${this.extraClass || ''}`, onClick: (event) => this.handleClick(event) }, this.label && h("span", { key: '9d86a1bdf96422e0857759afe4741e523223d7d7', class: this.loading ? 'opacity-0' : '' }, this.label), this.loading && (h("span", { key: '8e4611bba4214889eef58052c56dc46b826ff86c', class: "absolute inset-0 flex items-center justify-center" }, h("span", { key: 'cfc49250bf9f1b65965bf5b2d497a33174a82291', class: "loader", style: {
                 border: `3px solid ${this.intent === 'secondary' ? 'rgba(255, 255, 255, .3)' : 'rgba(0, 0, 0, .3)'}`,
                 borderBottomColor: this.intent === 'secondary' ? '#fff' : '#000'
             } }))), this.icon ? h("eds-icon-wrapper", { class: iconClasses, icon: this.icon }) : null));
@@ -245,7 +241,7 @@ const EdsButton = /*@__PURE__*/ proxyCustomElement(class EdsButton extends HTMLE
         "iconSmall": [4, "icon-small"],
         "extraClass": [1, "extra-class"],
         "triggerClick": [16]
-    }]);
+    }, [[0, "parentContext", "handleParentContext"]]]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;

package/dist/components/eds-card-section.js

@@ -6,7 +6,7 @@ import { d as defineCustomElement$4 } from './eds-card-title2.js';
 import { d as defineCustomElement$3 } from './eds-img2.js';
 import { d as defineCustomElement$2 } from './eds-tag2.js';
 
-const edsCardSectionCss = ".w-full{width:100%}.grid-layout{display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-col-span-12{--container-grid-columns:12;grid-column:span 12 / span 12}.gap-y-4{row-gap:0.25rem}.gap-y-8{row-gap:0.5rem}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}@media (min-width: 750px){.md\\:flex{display:flex}.md\\:hidden{display:none}.md\\:gap-y-12{row-gap:0.75rem}.md\\:pt-28{padding-top:1.75rem}}@media (min-width: 750px){.md\\:grid-col-span-4{--container-grid-columns:4;grid-column:span 4 / span 4}.md\\:grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.md\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.md\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.md\\:w-10-cols>*{--container-grid-columns:10}}@media (min-width: 900px){.lg\\:grid-col-span-5{--container-grid-columns:5;grid-column:span 5 / span 5}.lg\\:grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.lg\\:grid-col-start-7{grid-column-start:7}.lg\\:w-8-cols{width:calc(((8 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (8 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.lg\\:w-8-cols{width:calc(((8 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (8 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.lg\\:w-8-cols>*{--container-grid-columns:8}.lg\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.lg\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.lg\\:w-10-cols>*{--container-grid-columns:10}}@media (min-width: 900px){.lg\\:order-last{order:9999}.lg\\:order-none{order:0}.lg\\:mt-0{margin-top:0rem}.lg\\:block{display:block}.lg\\:flex{display:flex}.lg\\:hidden{display:none}.lg\\:w-\\[150px\\]{width:150px}.lg\\:w-auto{width:auto}.lg\\:max-w-\\[720px\\]{max-width:720px}.lg\\:flex-row{flex-direction:row}.lg\\:flex-nowrap{flex-wrap:nowrap}.lg\\:gap-y-16{row-gap:1rem}.lg\\:px-28{padding-left:1.75rem;padding-right:1.75rem}.lg\\:\\!pl-12{padding-left:0.75rem !important}.lg\\:\\!pr-12{padding-right:0.75rem !important}}";
+const edsCardSectionCss = "ol,ul,menu{list-style:none;margin:0;padding:0}.w-full{width:100%}.grid-layout{display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.grid-cols-4[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-4[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+1)::before{inset-inline-start:0}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+4)::before{inset-inline-end:0}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+1):nth-last-child(-n+4)::before{border-bottom-width:0}.grid-cols-4[class*=\"grid-line-x\"]>*:nth-child(4n+1):nth-last-child(-n+4)~*::before{border-bottom-width:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(4n+4)::after{border-inline-end-width:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+4)::after{top:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(4n+1):nth-last-child(-n+4)::after{bottom:0}.grid-cols-4[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(4n+1):nth-last-child(-n+4)~li::after{bottom:0}.grid-col-span-4{--container-grid-columns:4;grid-column:span 4 / span 4}.gap-y-4{row-gap:0.25rem}.gap-y-8{row-gap:0.5rem}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}@media (min-width: 750px){.md\\:flex{display:flex}.md\\:hidden{display:none}.md\\:gap-y-12{row-gap:0.75rem}.md\\:pt-28{padding-top:1.75rem}}@media (min-width: 750px){.md\\:grid-col-span-1{--container-grid-columns:1;grid-column:span 1 / span 1}.md\\:grid-col-span-2{--container-grid-columns:2;grid-column:span 2 / span 2}.md\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}.md\\:grid-col-span-4{--container-grid-columns:4;grid-column:span 4 / span 4}.md\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.md\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.md\\:w-10-cols>*{--container-grid-columns:10}}@media (min-width: 900px){.lg\\:grid-col-span-5{--container-grid-columns:5;grid-column:span 5 / span 5}.lg\\:grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.lg\\:grid-col-start-7{grid-column-start:7}.lg\\:w-8-cols{width:calc(((8 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (8 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.lg\\:w-8-cols{width:calc(((8 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (8 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.lg\\:w-8-cols>*{--container-grid-columns:8}.lg\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * 100%) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.cols-container>.lg\\:w-10-cols{width:calc(((10 / var(--container-grid-columns, var(--grid-columns))) * (100% - var(--inner-gutter))) - (var(--inner-gutter) - (10 / var(--container-grid-columns, var(--grid-columns)) * var(--inner-gutter))))}.lg\\:w-10-cols>*{--container-grid-columns:10}}@media (min-width: 900px){.lg\\:order-last{order:9999}.lg\\:order-none{order:0}.lg\\:mt-0{margin-top:0rem}.lg\\:block{display:block}.lg\\:flex{display:flex}.lg\\:hidden{display:none}.lg\\:w-\\[150px\\]{width:150px}.lg\\:w-auto{width:auto}.lg\\:max-w-\\[720px\\]{max-width:720px}.lg\\:flex-row{flex-direction:row}.lg\\:flex-nowrap{flex-wrap:nowrap}.lg\\:gap-y-16{row-gap:1rem}.lg\\:px-28{padding-left:1.75rem;padding-right:1.75rem}.lg\\:\\!pl-12{padding-left:0.75rem !important}.lg\\:\\!pr-12{padding-right:0.75rem !important}}";
 const EdsCardSectionStyle0 = edsCardSectionCss;
 
 const EdsCardSection$1 = /*@__PURE__*/ proxyCustomElement(class EdsCardSection extends HTMLElement {
@@ -15,7 +15,7 @@ const EdsCardSection$1 = /*@__PURE__*/ proxyCustomElement(class EdsCardSection e
         this.__registerHost();
         this.__attachShadow();
         this.cards = [];
-        this.cols = 4;
+        this.occupyCols = 1;
     }
     /**
      * Parses the `cards` JSON string prop into an array of card objects.
@@ -51,12 +51,12 @@ const EdsCardSection$1 = /*@__PURE__*/ proxyCustomElement(class EdsCardSection e
      * @returns {JSX.Element} The rendered section containing a list of cards.
      */
     render() {
-        return (h("section", { key: '1f221e1ec7c3cdd0e3aed18f6f930c2c5456c64b', class: "w-full" }, h("ul", { key: '36f984994bb2dc247475c20422f7e6e7da7d058d', class: "grid-layout gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.parsedCards.map((card) => (h("li", { class: `grid-col-span-12 md:grid-col-span-${this.cols} flex flex-col` }, h("eds-card-generic", { cardTitle: card.title, description: card.description, avatar: card.avatar, headingLevel: card.headingLevel, tags: card.tags, url: card.url, bg: card.bg, tiny: card.tiny, image: card.image, withHover: card.withHover })))))));
+        return (h("section", { key: '6c7067186b4afd873992008311ef65434e2860ef', class: "w-full" }, h("ul", { key: '186f5dc40e4d68c7565ba104dec900c707a59bc5', class: "grid-layout grid-cols-4 gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.parsedCards.map((card) => (h("li", { class: `grid-col-span-4 md:grid-col-span-${this.occupyCols} flex flex-col` }, h("eds-card-generic", { cardTitle: card.title, description: card.description, avatar: card.avatar, headingLevel: card.headingLevel, tags: card.tags, url: card.url, bg: card.bg, tiny: card.tiny, image: card.image, withHover: card.withHover })))))));
     }
     static get style() { return EdsCardSectionStyle0; }
 }, [1, "eds-card-section", {
         "cards": [1],
-        "cols": [2]
+        "occupyCols": [2, "occupy-cols"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

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-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: 'ba6500548e8f719b8670063918c61b391ddb8387', 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: '1221cca6d40c4de8ed7ceefa84198817bf904630', class: `border-softest ${this.social ? 'border-t-2' : ''} pt-20 pb-28 md:pt-28` }, h("div", { key: 'ad55b938fb2961074822d6bf458f0ea7a15baa84', class: "container flex flex-wrap items-center gap-20 lg:flex-nowrap" }, h("div", { key: '91c13fdd98508a812e5dcfa86056b5adc035623d', class: "flex items-center gap-x-12" }, h("a", { key: '4ddd8715a5cabbff2209f8ceb389900c9eddcd74', 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: 'df5f16284084d9171cd3d567dd249a0ef98bde79', width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg" }))), h("div", { key: '0ff4328cc30f06c1a85ffc726d5b6b0dc53e49b9', class: "f-ui-04 text-light order-last w-full lg:order-none lg:w-auto" }, h("p", { key: '2cb2b4f072a141e58c9a2185c9179d475f9690bd' }, this.fundedBy), h("div", { key: 'b31d1e18933fb1be11d8454f9a5301dedc839015', class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap" }, h("span", { key: 'aab95785cfb2bc7d490ac9426ef5e421f9418dc9', class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline" }, "\u00A9 ", this.rightsReserved), this.hasCookiesSetUp && (h("button", { key: 'fbd5bf3560faf0ee34d740bda423595c3cd21ad8', class: "effect-focus !no-underline underline-offset-4 hover:!underline", onClick: () => this.toggleCookiesPopup() }, this.cookiesPreference)))), h("div", { key: '0427234b6679ae05b673a5c6efb8447306f61876', 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-header.js

@@ -88,8 +88,8 @@ const EdsHeader$1 = /*@__PURE__*/ proxyCustomElement(class EdsHeader extends HTM
         return [];
     }
     render() {
-        return (h("header", { key: 'ce002da29cee5446f64694ba93ec67f89c180ac4', class: `flex items-center justify-between relative z-10
-       ${this.inverseHeader ? 'text-inverse bg-strongest' : 'text-default bg-dark'}` }, h("div", { key: '579593f3180b27d129fd9ca380d6b74d0efcbd1e', class: "mr-auto w-[200px] h-[85px]" }, h("eds-logo", { key: 'c72d87a2ff7cd1ea2b0390cd364e376d1f52c67f', type: this.inverseHeader ? 'color-white' : 'color', href: this.homeUrl })), this.parsedLinks && (h("nav", { key: '6755e304c48624049af8426d4d9b19d0cb156dda', 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: '390f9b6c6c950719598eec88b4befb4224cb0c03', 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: 'bc7b093739cc3058e4eb3d4eddbb0b49856b5710' }), 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; }