@ebrains/components 0.8.0-alpha.0 → 0.9.0-beta

package/dist/cjs/eds-matomo-notice.cjs.entry.js

@@ -0,0 +1,123 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-2f63169d.js');
+const analytics = require('./analytics-d8fb3fdd.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}.z-\\[999999\\]{z-index:999999}.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 = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.consent = index.createEvent(this, "consent", 7);
+        this.title = 'Analytics Consent';
+        this.description = "We use anonymous analytics to improve our services. No data is collected unless you give your consent. If you don't wish to send data right now, you can always re-enable analytics later by clicking the Cookies Preference button in the footer. However, by opting in today, you're joining a community that shapes our product's future—all while keeping your data completely anonymous.";
+        this.optOutMessage = "You are already part of our community, and your anonymous data helps shape our product's future! Rest assured, your privacy is fully protected.";
+        this.forceShow = false;
+        this.showNotice = true;
+    }
+    /**
+     * Listens for global custom events to open the matomo-consent.
+     */
+    toggleCookiesConsent() {
+        this.showNotice = !this.showNotice;
+    }
+    /**
+     * Checks if the consent cookie exists.
+     */
+    hasCookieConsent() {
+        return !!document.cookie.split('; ').find((row) => row.startsWith('mtm_consent='));
+    }
+    /**
+     * Checks if the user has opted out after has opted in.
+     */
+    optedOut() {
+        return !!document.cookie.split('; ').find((row) => row.startsWith('mtm_consent_removed'));
+    }
+    /**
+     * 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 a decision has been made previously (opted in or out), don't show the notice.
+        const consentGiven = localStorage.getItem('matomo-consent-given');
+        if (consentGiven === 'out' || this.optedOut()) {
+            this.showNotice = false;
+            return;
+        }
+        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() {
+        analytics.matomoOptIn();
+        localStorage.removeItem('matomo-consent-given');
+        this.hideNotice();
+        this.consent.emit('in');
+    }
+    optOutAnalytics() {
+        analytics.matomoOptOut();
+        this.hideNotice();
+        this.consent.emit('out');
+    }
+    noThanks() {
+        localStorage.setItem('matomo-consent-given', 'out');
+        this.hideNotice();
+    }
+    deferDecision() {
+        sessionStorage.setItem(this.getStorageKey(), 'true');
+        this.hideNotice();
+        this.consent.emit('defer');
+    }
+    keepMeIn() {
+        this.hideNotice();
+    }
+    hideNotice() {
+        this.showNotice = false;
+    }
+    render() {
+        if (!this.showNotice) {
+            return null;
+        }
+        return (index.h("div", { class: "fixed bottom-0 p-8 z-[999999] grow md:left-1/2 md:-translate-x-1/2 md:-translate-y-1/2 justify-center" }, index.h("eds-accordion", { title: this.title, description: this.hasCookieConsent() ? this.optOutMessage : this.description, switchBg: true, expanded: true }, this.hasCookieConsent() ? (index.h("div", { class: "flex items-center gap-4" }, this.optedOut() ? (index.h("eds-button", { intent: "primary", label: "Opt me in again", "aria-label": "Opt me in again", onClick: () => this.optInAnalytics() })) : (index.h("eds-button", { intent: "primary", label: "Keep Me In", "aria-label": "Keep Me In", onClick: () => this.keepMeIn() })), index.h("eds-button", { intent: "ghostInverse", label: "Opt-out", "aria-label": "Opt-out from analytics", onClick: () => this.optOutAnalytics() }))) : (index.h("div", { class: "flex items-center gap-4" }, index.h("eds-button", { intent: "primary", label: "I agree", "aria-label": "Opt-in for analytics", onClick: () => this.optInAnalytics() }), index.h("eds-button", { intent: "ghost", label: "No, thanks", "aria-label": "Opt-out from analytics", onClick: () => this.noThanks() }), index.h("eds-button", { intent: "ghost", label: "Ask me later", "aria-label": "Defer analytics decision", onClick: () => this.deferDecision() }))))));
+    }
+    get el() { return index.getElement(this); }
+};
+EdsMatomoNotice.style = EdsMatomoNoticeStyle0;
+
+exports.eds_matomo_notice = EdsMatomoNotice;

package/dist/cjs/eds-modal.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-2f63169d.js');
 const analytics = require('./analytics-d8fb3fdd.js');
 
-const edsModalCss = ".block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.fixed{position:fixed}.inset-0{inset:0rem}.z-10{z-index:10}.z-50{z-index:50}.max-w-full{max-width:100%}.absolute{position:absolute}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-20{padding-top:1.25rem;padding-bottom:1.25rem}.bg-inverse{background-color:var(--white)}.bg-dark{background-color:var(--grey-300)}.rounded-lg{border-radius:16px}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.backdrop-blur{--tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.p-6{padding:0.375rem}.p-8{padding:0.5rem}.left-1\\/2{left:50%}.left-20{left:1.25rem}.right-20{right:1.25rem}.top-1\\/2{top:50%}.top-20{top:1.25rem}.bottom-20{bottom:1.25rem}.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}.border-b-2{border-bottom-width:2px}.border-softer{border-color:rgba(0, 0, 0, .1)}.pb-8{padding-bottom:0.5rem}.f-heading-03{font-family:var(--f-heading-03-fontFamily);font-weight:var(--f-heading-03-fontWeight);font-size:var(--f-heading-03-fontSize);line-height:var(--f-heading-03-lineHeight);letter-spacing:var(--f-heading-03-letterSpacing)}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:var(--f-heading-04-fontWeight);font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-heading-05{font-family:var(--f-heading-05-fontFamily);font-weight:var(--f-heading-05-fontWeight);font-size:var(--f-heading-05-fontSize);line-height:var(--f-heading-05-lineHeight);letter-spacing:var(--f-heading-05-letterSpacing)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.ml-8{margin-left:0.5rem}.pt-8{padding-top:0.5rem}.bg-opacity-90{opacity:0.9}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}";
+const edsModalCss = ".block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.fixed{position:fixed}.inset-0{inset:0rem}.z-10{z-index:10}.z-50{z-index:50}.z-50{z-index:50}.z-9999999{z-index:9999999}.max-w-full{max-width:100%}.absolute{position:absolute}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-20{padding-top:1.25rem;padding-bottom:1.25rem}.bg-inverse{background-color:var(--white)}.bg-dark{background-color:var(--grey-300)}.rounded-lg{border-radius:16px}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.backdrop-blur{--tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.p-6{padding:0.375rem}.p-8{padding:0.5rem}.left-1\\/2{left:50%}.left-20{left:1.25rem}.right-20{right:1.25rem}.top-1\\/2{top:50%}.top-20{top:1.25rem}.bottom-20{bottom:1.25rem}.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}.border-b-2{border-bottom-width:2px}.border-softer{border-color:rgba(0, 0, 0, .1)}.pb-8{padding-bottom:0.5rem}.f-heading-03{font-family:var(--f-heading-03-fontFamily);font-weight:var(--f-heading-03-fontWeight);font-size:var(--f-heading-03-fontSize);line-height:var(--f-heading-03-lineHeight);letter-spacing:var(--f-heading-03-letterSpacing)}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:var(--f-heading-04-fontWeight);font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-heading-05{font-family:var(--f-heading-05-fontFamily);font-weight:var(--f-heading-05-fontWeight);font-size:var(--f-heading-05-fontSize);line-height:var(--f-heading-05-lineHeight);letter-spacing:var(--f-heading-05-letterSpacing)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.ml-8{margin-left:0.5rem}.pt-8{padding-top:0.5rem}.bg-opacity-90{opacity:0.9}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}@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))}.md\\:gap-y-12{row-gap:0.75rem}}";
 const EdsModalStyle0 = edsModalCss;
 
 const EdsModal = class {
@@ -29,16 +29,16 @@ const EdsModal = class {
     getModalPositionClasses() {
         switch (this.position) {
             case 'top':
-                return 'left-1/2 top-20 -translate-x-1/2';
+                return 'md:left-1/2 top-20 md:-translate-x-1/2';
             case 'bottom':
-                return 'left-1/2 bottom-20 -translate-x-1/2';
+                return 'md:left-1/2 bottom-20 md:-translate-x-1/2';
             case 'left':
                 return 'left-20 top-1/2 -translate-y-1/2';
             case 'right':
                 return 'right-20 top-1/2 -translate-y-1/2';
             case 'middle':
             default:
-                return 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2';
+                return 'md:left-1/2 top-1/2 md:-translate-x-1/2 -translate-y-1/2';
         }
     }
     /**
@@ -98,9 +98,9 @@ const EdsModal = class {
     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 (index.h("div", { key: '456972d43bddeec93053c1518ca35dff028f0416', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-50 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (index.h("div", { key: 'f3b84d1086f70f7863691835fe8984a4ff091b8f', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
+        return (index.h("div", { key: 'eb2b985e84912dabea52a9a62eb908087004c958', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999999 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (index.h("div", { key: 'ad47334539d1a8a8694f34ba1e90a38b7dce07ab', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
             ,
-            onClick: () => this.close() })), index.h("div", { key: '5038d3564881f4580e63a1afd883affa0aee8750', class: `container max-w-full absolute px-20 py-20 bg-inverse rounded-lg shadow-lg z-10 ${this.getModalPositionClasses()} grow justify-center` }, index.h("div", { key: '4ce4d6f11afc552579a35f23901bc79e2ae19274', class: "flex justify-between items-center border-b-2 border-softer pb-8" }, index.h("span", { key: 'a9475d9cdcd4d3a1d68bce973f672621a30c53d4', id: titleId, class: `f-heading-04 text-lighter ${this.getTruncateClass()}` }, this.title), index.h("eds-button", { key: 'c1e32fb266333856de6f0e63757fca02778330a9', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8" })), index.h("div", { key: '58b1d9a3228516a1de31a81c6cd3a2696c65ce5f', class: "pt-8" }, index.h("slot", { key: '0d81e88fcaa138bd746cc894543f264e4a3afb2f' })))));
+            onClick: () => this.close() })), index.h("div", { key: '69d449b6ec986b5cfd73e50cc060363236035915', class: `container max-w-full absolute px-20 py-20 bg-inverse rounded-lg shadow-lg z-10 ${this.getModalPositionClasses()} grow justify-center` }, index.h("div", { key: '17395806ef17a06b5465174055087178db9f5356', class: "flex justify-between items-center border-b-2 border-softer pb-8" }, index.h("span", { key: 'daa5d63b73eab57b9b58ca06d0197f1a7002ca15', id: titleId, class: `f-heading-04 text-lighter ${this.getTruncateClass()}` }, this.title), index.h("eds-button", { key: '267ee7d1f10819c19af5eed6715465f2ba5f4831', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8" })), index.h("div", { key: 'fbd3351c851ab1089035117cca2b3ad769c26d18', class: "pt-8" }, index.h("slot", { key: '9958a61e24320183bef12aef381791f11e421597' })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/eds-pagination_2.cjs.entry.js

@@ -174,7 +174,7 @@ const EdsPagination = class {
         }
     }
     render() {
-        return (index.h("div", { key: '4ebae5738982b21456e2852babeef2f5e2b4b1e0' }, this.total > 0 && this.mode === 'default' && (index.h("p", { key: '9c18413928a471adb2b6964c78ea3339f251c81b', class: "f-ui-03 text-lightest mb-28 w-full text-center" }, index.h("span", { key: '3d9d08eaaf7944ef1a6aba9b0912b7d9ebb58e28', class: "sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (index.h("nav", { "aria-label": "Pagination" }, index.h("ul", { class: "flex items-center justify-center gap-x-8" }, index.h("li", { class: "mr-auto" }, index.h("eds-link", { label: this.prevLabel, url: this.mode === 'navigator'
+        return (index.h("div", { key: 'b33415e05457ccc78ea3744a1baa9affbf38ca4a' }, this.total > 0 && this.mode === 'default' && (index.h("p", { key: 'e555e94a3fd13cf0d57108bd2cca3fb97cd0c688', class: "f-ui-03 text-lightest mb-28 w-full text-center" }, index.h("span", { key: 'c63f1d5aa6154a23d714c74dcd9a0a75b68df579', class: "sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (index.h("nav", { "aria-label": "Pagination" }, index.h("ul", { class: "flex items-center justify-center gap-x-8" }, index.h("li", { class: "mr-auto" }, index.h("eds-link", { label: this.prevLabel, url: this.mode === 'navigator'
                 ? this.prevUrl || '#' // Use prevUrl if provided, otherwise disable with '#'
                 : this.isFirstPage()
                     ? '#'
@@ -381,15 +381,15 @@ const EdsTable = class {
         const columnWidth = visibleColumnsCount > 0 ? Math.floor((currentContainerWidth / visibleColumnsCount) * this.divisionFactor()) : 100;
         const paginatedRows = this.getPaginatedRows();
         const lastPage = Math.ceil(this.totalRows / this.rowsPerPage);
-        return (index.h("div", { key: 'a9df6351c49bb17abebfaf3640c71a7c7d15cb61' }, this.searchEnabled && (index.h("div", { key: 'feb5708050593e791835456e6d2244332cee6062' }, index.h("eds-input-field", { key: 1, name: "search", "aria-label": "Search", type: "text", placeholder: "Search...",
+        return (index.h("div", { key: '43add2309d8e2c85c98676709cd87fc07e4de017' }, this.searchEnabled && (index.h("div", { key: '1213d8aaa8a2402bd1705e03375d17f570877d5e' }, index.h("eds-input-field", { key: 1, name: "search", "aria-label": "Search", type: "text", placeholder: "Search...",
             // @ts-ignore
-            onInput: (event) => this.handleSearch(event) }))), index.h("div", { key: '88dcb3d9e984a77f54735fa352c811dbf4745838', class: "mt-20" }, index.h("table", { key: '32ff7b76066a96bce51f885e8339c258fdecd0c6', class: "block overflow-x-auto mt-6 p-0" }, index.h("thead", { key: '9f4bbf0725c618c8c2f8a3b90d6d2f2a7f9c0186' }, index.h("tr", { key: 'd8f24a31aad07b667ae9cc06257ddddf529f8e31', class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((column) => {
+            onInput: (event) => this.handleSearch(event) }))), index.h("div", { key: 'a2ec6392ed99a527e4de46a9018bc1ea9b383ecb', class: "mt-20" }, index.h("table", { key: 'ef79ce872f0cb1439dd6a7987f24cac005ac23ea', class: "block overflow-x-auto mt-6 p-0" }, index.h("thead", { key: '0853a09e45f748b4bc85e319cbb08efd97426617' }, index.h("tr", { key: '64e114ae3661a027e9ab744ba45801d98f2faee9', class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((column) => {
             var _a;
             return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden) && (index.h("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words", style: { minWidth: `${columnWidth - 4}px` } }, column));
-        }))), index.h("tbody", { key: '932e2f9cbd51d1115eef42f8b1acb7bb58ccdab7' }, paginatedRows.map((row) => (index.h("tr", { class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((column) => {
+        }))), index.h("tbody", { key: '1afd468551bab11221bbfc70d0f19f4e105e7432' }, paginatedRows.map((row) => (index.h("tr", { class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((column) => {
             var _a;
             return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden) && (index.h("td", { class: "text-center border border-softer m-0 py-8 f-ui-2 break-words", style: { minWidth: `${columnWidth - 4}px` } }, this.renderCell(row[column], column)));
-        }))))))), this.shouldEnablePagination() && (index.h("div", { key: '6368d38cec298dc8efa1a790d6b0cb93357f0ae5', class: "mt-20" }, index.h("eds-pagination", { key: '2183eb4a6861a0e42538706bd0c9fe10a1e5d8bd', currentPage: this.currentPage, lastPage: lastPage, perPage: this.rowsPerPage, total: this.totalRows, mode: "default" })))));
+        }))))))), this.shouldEnablePagination() && (index.h("div", { key: 'c415ded700580eec2464a72a1659bd8be5bcacb3', class: "mt-20" }, index.h("eds-pagination", { key: '81088574b7c7fd254e07761ceed6cd1d69c2f2ed', currentPage: this.currentPage, lastPage: lastPage, perPage: this.rowsPerPage, total: this.totalRows, mode: "default" })))));
     }
     get hostEl() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/eds-progress-bar.cjs.entry.js

@@ -21,7 +21,7 @@ const EdsProgressBar = class {
     }
     render() {
         const progressValue = this.value;
-        return (index.h("div", { key: '259c247cbf6269d1118b652c70cc45e6ea9192b5', 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" }, index.h("div", { key: 'e6141a6aa1eb8d1f9562028d95f6dfffc2777b11', 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 (index.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" }, index.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, "%")));
     }
 };
 EdsProgressBar.style = EdsProgressBarStyle0;

package/dist/cjs/eds-rating.cjs.entry.js

@@ -49,7 +49,7 @@ const EdsRating = class {
         this.rating.emit(rating);
     }
     render() {
-        return (index.h("div", { key: '34344f12d4ca8a80fe7c96537d417c199421e139', role: "radiogroup", class: "stars flex space-x-1 my-8" }, Array.from({ length: this.ratingCount }, (_, index$1) => {
+        return (index.h("div", { key: '2ab4f3dbc4cc3dd5272143e99c67b23086b03e18', role: "radiogroup", class: "stars flex space-x-1 my-8" }, Array.from({ length: this.ratingCount }, (_, index$1) => {
             const starRating = index$1 + 1;
             const isSelected = starRating <= this.selectedRating;
             // Use the mapping text if available; otherwise, fall back to a generic label.

package/dist/cjs/eds-section-core_2.cjs.entry.js

@@ -16,7 +16,7 @@ const EdsSectionCore = class {
     }
     render() {
         const TagType = this.tag; // Set dynamic tag type (div or section)
-        return (index.h(TagType, { key: '81d5d6f6010c56bb217b32fa520fdaf96e1c7adc' }, index.h("eds-section-heading", { key: 'c47dda41c2f553ef87f432109ead4bd0debcd99c', headingLevel: this.headingLevel, sectionTitle: this.sectionTitle }), index.h("slot", { key: '9276798e2c581440c46ff9914809e87203a86b1b' })));
+        return (index.h(TagType, { key: '39c4280156ca46b83538de499baa9b152360b1b4' }, index.h("eds-section-heading", { key: '34da742e606f0e9bb485faac8aba1519eccc8934', headingLevel: this.headingLevel, sectionTitle: this.sectionTitle }), index.h("slot", { key: '517b8ecc112565e8c6bb0bf85b02525deaa6f9df' })));
     }
 };
 EdsSectionCore.style = EdsSectionCoreStyle0;
@@ -46,12 +46,12 @@ const EdsSectionHeading = class {
     render() {
         const TagType = this.tag; // Dynamically set tag type for the container
         const HeadingTag = this.headingLevel; // Dynamically set heading level
-        return (index.h(TagType, { key: '6741f5bbede7d44109c5e60f92290d4b2eda4d42', class: {
+        return (index.h(TagType, { key: '961a672dc3b656b0a308131a2d334aca51df77f6', class: {
                 'ui-section-header flex flex-wrap items-center justify-between gap-x-12 gap-y-8': true,
                 container: this.withContainer,
                 'pt-48': this.spacingLarge,
                 'pt-28': !this.spacingLarge
-            } }, index.h(HeadingTag, { key: 'cc65df919db1dc1d5725116ce1ab473319185901', class: this.getHeadingClass() }, this.sectionTitle)));
+            } }, index.h(HeadingTag, { key: '42eb2ccfba8c83cf140967e39fead6ebddc3a279', class: this.getHeadingClass() }, this.sectionTitle)));
     }
 };
 

package/dist/cjs/eds-spinner.cjs.entry.js

@@ -46,7 +46,7 @@ const EdsSpinner = class {
                 alignItems: 'center',
                 justifyContent: 'center'
             };
-        return (index.h(index.Host, { key: '49a825afb039ee46b26609eea60109e0a060c104' }, index.h("div", { key: '6445a4e7f1e7c553bdee660c42f1db0e011443f2', class: "spinner-overlay", style: overlayStyle }, index.h("span", { key: '07feeb7736e6d306e2b7baf5d253b2ce96bb2c9e', class: "spinner", style: spinnerStyle }))));
+        return (index.h(index.Host, { key: '1e1e4ea2734fff8a680e55ca5163e69d2000a55d' }, index.h("div", { key: 'acf09f69d43404f317240c0d24e644ec0d046cd7', class: "spinner-overlay", style: overlayStyle }, index.h("span", { key: '3728629fdff738a0b753cd499dc26052b1e3cb7b', class: "spinner", style: spinnerStyle }))));
     }
 };
 EdsSpinner.style = EdsSpinnerStyle0;

package/dist/cjs/eds-switch.cjs.entry.js

@@ -26,11 +26,11 @@ const EdsSwitch = class {
     render() {
         // Compute an accessible name based on state.
         const accessibleLabel = this.labelOn || this.labelOff ? (this.checked ? this.labelOn : this.labelOff) : 'Toggle switch';
-        return (index.h("div", { key: 'd9e216919a58d90017b6fec249e7fc811c4fb681', class: "switch-container" }, this.labelOff && index.h("span", { key: '161bca12a4c6eebf4240ea0bdd07fd1acba35228', class: "switch-label switch-label--off" }, this.labelOff), index.h("button", { key: '855477e89765d01d5a52f3d9db279a1e5c56ea9d', type: "button", role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": accessibleLabel, class: {
+        return (index.h("div", { key: '842d7ecb771ab848481c9f1f6a1aa2f5f04505a7', class: "switch-container" }, this.labelOff && index.h("span", { key: 'f20f4293896dcbde94346e82d10ed748bdeae0f6', class: "switch-label switch-label--off" }, this.labelOff), index.h("button", { key: 'ac485fe118bae7f6a42ddb9f7edeccba2224312c', type: "button", role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": accessibleLabel, class: {
                 switch: true,
                 'switch--checked': this.checked,
                 'switch--disabled': this.disabled
-            }, onClick: this.toggleSwitch, disabled: this.disabled }, index.h("span", { key: '4486e5f54ee75b95fd174291e1f5d67e181f3243', class: "switch-handle" })), this.labelOn && index.h("span", { key: '702e5385f6e941dcb67eecdd766725c4b04b8b7c', class: "switch-label switch-label--on" }, this.labelOn)));
+            }, onClick: this.toggleSwitch, disabled: this.disabled }, index.h("span", { key: '3701615162b3b8946fa5b9040e77dfa20b7de3fe', class: "switch-handle" })), this.labelOn && index.h("span", { key: 'b57bd428c7d6818bcec1f069a920a7aa2a2e776d', class: "switch-label switch-label--on" }, this.labelOn)));
     }
 };
 EdsSwitch.style = EdsSwitchStyle0;