@ebrains/components 0.9.0-beta → 0.9.1-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +9 -0
- package/dist/cjs/components.cjs.js +1 -1
- package/dist/cjs/eds-accordion.cjs.entry.js +4 -4
- package/dist/cjs/{eds-avatar_24.cjs.entry.js → eds-avatar_26.cjs.entry.js} +186 -5
- package/dist/cjs/{eds-card-desc_3.cjs.entry.js → eds-card-desc_2.cjs.entry.js} +0 -35
- package/dist/cjs/eds-card-generic.cjs.entry.js +2 -2
- package/dist/cjs/eds-matomo-notice.cjs.entry.js +2 -2
- package/dist/cjs/eds-modal.cjs.entry.js +5 -5
- package/dist/cjs/eds-section-core_2.cjs.entry.js +2 -2
- package/dist/cjs/eds-switch.cjs.entry.js +2 -2
- package/dist/cjs/eds-tabs.cjs.entry.js +5 -5
- package/dist/cjs/eds-timeline.cjs.entry.js +1 -1
- package/dist/cjs/index-2f63169d.js +4 -8
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/eds-accordion/eds-accordion.js +5 -5
- package/dist/collection/components/eds-breadcrump/eds-breadcrump.js +8 -1
- package/dist/collection/components/eds-cards/eds-card-generic/eds-card-generic.css +5 -0
- package/dist/collection/components/eds-cards/eds-card-generic/eds-card-generic.js +1 -1
- package/dist/collection/components/eds-link/eds-link.css +6 -6
- package/dist/collection/components/eds-modal/eds-modal.js +6 -6
- package/dist/collection/components/eds-section/eds-section-heading/eds-section-heading.js +5 -2
- package/dist/collection/components/eds-switch/eds-switch.js +3 -3
- package/dist/collection/components/eds-tag/eds-tag.css +45 -0
- package/dist/collection/components/eds-tag/eds-tag.js +31 -5
- package/dist/collection/components/eds-tag/eds-tag.stories.js +11 -4
- package/dist/collection/components/eds-timeline/eds-timeline.css +20 -0
- package/dist/collection/shared-ui/eds-matomo-notice/eds-matomo-notice.js +3 -3
- package/dist/collection/shared-ui/eds-social-networks/eds-social-networks.js +3 -3
- package/dist/collection/shared-ui/eds-tabs/eds-tabs.css +20 -0
- package/dist/collection/shared-ui/eds-tabs/eds-tabs.js +5 -5
- package/dist/collection/shared-ui/eds-user/eds-user.css +20 -0
- package/dist/components/components.css +20 -0
- package/dist/components/components.esm.js +1 -1
- package/dist/components/eds-accordion2.js +5 -5
- package/dist/components/eds-breadcrumb.js +8 -1
- package/dist/components/eds-card-generic2.js +2 -2
- package/dist/components/eds-link2.js +1 -1
- package/dist/components/eds-matomo-notice2.js +3 -3
- package/dist/components/eds-modal.js +6 -6
- package/dist/components/eds-section-heading2.js +2 -2
- package/dist/components/eds-social-networks2.js +3 -3
- package/dist/components/eds-switch.js +2 -2
- package/dist/components/eds-tabs.js +6 -6
- package/dist/components/eds-tag2.js +15 -6
- package/dist/components/eds-timeline.js +1 -1
- package/dist/components/eds-user.js +1 -1
- package/dist/components/p-0467ceb5.entry.js +1 -0
- package/dist/components/{p-424ba743.entry.js → p-1309a74c.entry.js} +1 -1
- package/dist/components/p-4620ebf5.entry.js +1 -0
- package/dist/components/{p-bcbc7b7f.entry.js → p-94b1f974.entry.js} +1 -1
- package/dist/components/p-b931a634.entry.js +1 -0
- package/dist/components/{p-9cbcccf8.entry.js → p-c5c782e7.entry.js} +1 -1
- package/dist/components/p-c99745a8.entry.js +1 -0
- package/dist/components/p-e42eb100.entry.js +1 -0
- package/dist/components/{p-59d963d1.entry.js → p-e710c860.entry.js} +1 -1
- package/dist/components/p-f4ce515a.entry.js +1 -0
- package/dist/esm/components.js +1 -1
- package/dist/esm/eds-accordion.entry.js +4 -4
- package/dist/esm/{eds-avatar_24.entry.js → eds-avatar_26.entry.js} +185 -6
- package/dist/esm/{eds-card-desc_3.entry.js → eds-card-desc_2.entry.js} +1 -35
- package/dist/esm/eds-card-generic.entry.js +2 -2
- package/dist/esm/eds-matomo-notice.entry.js +2 -2
- package/dist/esm/eds-modal.entry.js +5 -5
- package/dist/esm/eds-section-core_2.entry.js +2 -2
- package/dist/esm/eds-switch.entry.js +2 -2
- package/dist/esm/eds-tabs.entry.js +5 -5
- package/dist/esm/eds-timeline.entry.js +1 -1
- package/dist/esm/index-8a71b9a7.js +4 -8
- package/dist/esm/loader.js +1 -1
- package/dist/hydrate/index.js +59 -40
- package/dist/hydrate/index.mjs +59 -40
- package/dist/stencil.config.js +16 -1
- package/dist/types/components/eds-accordion/eds-accordion.d.ts +1 -1
- package/dist/types/components/eds-modal/eds-modal.d.ts +1 -1
- package/dist/types/components/eds-section/eds-section-heading/eds-section-heading.d.ts +3 -0
- package/dist/types/components/eds-switch/eds-switch.d.ts +1 -1
- package/dist/types/components/eds-tag/eds-tag.d.ts +5 -1
- package/dist/types/components/eds-tag/eds-tag.stories.d.ts +7 -0
- package/dist/types/components.d.ts +40 -64
- package/dist/types/shared-ui/eds-matomo-notice/eds-matomo-notice.d.ts +1 -1
- package/dist/types/shared-ui/eds-social-networks/eds-social-networks.d.ts +1 -1
- package/dist/types/shared-ui/eds-tabs/eds-tabs.d.ts +1 -1
- package/package.json +3 -3
- package/dist/cjs/eds-breadcrumb.cjs.entry.js +0 -139
- package/dist/components/p-032f9f64.entry.js +0 -1
- package/dist/components/p-058cf100.entry.js +0 -1
- package/dist/components/p-1b4e9576.entry.js +0 -1
- package/dist/components/p-30a319d5.entry.js +0 -1
- package/dist/components/p-85ad681a.entry.js +0 -1
- package/dist/components/p-b47d115d.entry.js +0 -1
- package/dist/components/p-b55b0091.entry.js +0 -1
- package/dist/esm/eds-breadcrumb.entry.js +0 -135
|
@@ -13,7 +13,7 @@ const EdsMatomoNotice = /*@__PURE__*/ proxyCustomElement(class EdsMatomoNotice e
|
|
|
13
13
|
this.__registerHost();
|
|
14
14
|
this.__attachShadow();
|
|
15
15
|
this.consent = createEvent(this, "consent", 7);
|
|
16
|
-
this.
|
|
16
|
+
this.heading = 'Analytics Consent';
|
|
17
17
|
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.";
|
|
18
18
|
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.";
|
|
19
19
|
this.forceShow = false;
|
|
@@ -115,12 +115,12 @@ const EdsMatomoNotice = /*@__PURE__*/ proxyCustomElement(class EdsMatomoNotice e
|
|
|
115
115
|
if (!this.showNotice) {
|
|
116
116
|
return null;
|
|
117
117
|
}
|
|
118
|
-
return (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" }, h("eds-accordion", { title: this.
|
|
118
|
+
return (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" }, h("eds-accordion", { title: this.heading, description: this.hasCookieConsent() ? this.optOutMessage : this.description, switchBg: true, expanded: true }, this.hasCookieConsent() ? (h("div", { class: "flex items-center gap-4" }, this.optedOut() ? (h("eds-button", { intent: "primary", label: "Opt me in again", "aria-label": "Opt me in again", onClick: () => this.optInAnalytics() })) : (h("eds-button", { intent: "primary", label: "Keep Me In", "aria-label": "Keep Me In", onClick: () => this.keepMeIn() })), h("eds-button", { intent: "ghostInverse", label: "Opt-out", "aria-label": "Opt-out from analytics", onClick: () => this.optOutAnalytics() }))) : (h("div", { class: "flex items-center gap-4" }, h("eds-button", { intent: "primary", label: "I agree", "aria-label": "Opt-in for analytics", onClick: () => this.optInAnalytics() }), h("eds-button", { intent: "ghost", label: "No, thanks", "aria-label": "Opt-out from analytics", onClick: () => this.noThanks() }), h("eds-button", { intent: "ghost", label: "Ask me later", "aria-label": "Defer analytics decision", onClick: () => this.deferDecision() }))))));
|
|
119
119
|
}
|
|
120
120
|
get el() { return this; }
|
|
121
121
|
static get style() { return EdsMatomoNoticeStyle0; }
|
|
122
122
|
}, [1, "eds-matomo-notice", {
|
|
123
|
-
"
|
|
123
|
+
"heading": [1, "title"],
|
|
124
124
|
"description": [1],
|
|
125
125
|
"optOutMessage": [1, "opt-out-message"],
|
|
126
126
|
"forceShow": [4, "force-show"],
|
|
@@ -12,7 +12,7 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
|
|
|
12
12
|
this.__registerHost();
|
|
13
13
|
this.__attachShadow();
|
|
14
14
|
this.isOpen = false;
|
|
15
|
-
this.
|
|
15
|
+
this.heading = '';
|
|
16
16
|
this.truncate = true;
|
|
17
17
|
this.truncateLines = '1';
|
|
18
18
|
this.position = 'middle';
|
|
@@ -51,7 +51,7 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
|
|
|
51
51
|
category: 'ui-component',
|
|
52
52
|
parentContext: null,
|
|
53
53
|
tag: this.el.tagName.toLowerCase(),
|
|
54
|
-
name: ((_a = this.
|
|
54
|
+
name: ((_a = this.heading) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
|
|
55
55
|
action: 'opened'
|
|
56
56
|
});
|
|
57
57
|
}
|
|
@@ -65,7 +65,7 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
|
|
|
65
65
|
category: 'ui-component',
|
|
66
66
|
parentContext: null,
|
|
67
67
|
tag: this.el.tagName.toLowerCase(),
|
|
68
|
-
name: ((_a = this.
|
|
68
|
+
name: ((_a = this.heading) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
|
|
69
69
|
action: 'closed'
|
|
70
70
|
});
|
|
71
71
|
}
|
|
@@ -98,14 +98,14 @@ const EdsModal$1 = /*@__PURE__*/ proxyCustomElement(class EdsModal extends HTMLE
|
|
|
98
98
|
render() {
|
|
99
99
|
// Generate a unique id for the title so we can reference it for aria-labelledby.
|
|
100
100
|
const titleId = `modal-title-${this.el.tagName.toLowerCase()}`;
|
|
101
|
-
return (h("div", { key: '
|
|
101
|
+
return (h("div", { key: '3965b74182a1015d34ebc0d5692ab89de44774e6', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999999 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (h("div", { key: 'c0df46234deb0945ba266e8f36a0b3944bd6d7bd', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
|
|
102
102
|
,
|
|
103
|
-
onClick: () => this.close() })), h("div", { key: '
|
|
103
|
+
onClick: () => this.close() })), h("div", { key: '7fd65a4651ca67101b3a3e08ffd439070ccb8a96', 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: '80102734c692934c486fd2e2d707286dd5660c69', class: "flex justify-between items-center border-b-2 border-softer pb-8" }, h("span", { key: 'b98138881f6eb4ee1fad3614eda4c91e5349b563', id: titleId, class: `f-heading-04 text-lighter ${this.getTruncateClass()}` }, this.heading), h("eds-button", { key: '82f08e8ec6cbcb291c5d984ae97622d364bff5d0', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8" })), h("div", { key: '2ea2fc21a8b734c40b1de4a20025a50f7369d375', class: "pt-8" }, h("slot", { key: 'ca0fa40b4076af9eea37c6b088d26751173e815c' })))));
|
|
104
104
|
}
|
|
105
105
|
get el() { return this; }
|
|
106
106
|
static get style() { return EdsModalStyle0; }
|
|
107
107
|
}, [1, "eds-modal", {
|
|
108
|
-
"
|
|
108
|
+
"heading": [1, "title"],
|
|
109
109
|
"truncate": [4],
|
|
110
110
|
"truncateLines": [1, "truncate-lines"],
|
|
111
111
|
"position": [1],
|
|
@@ -26,12 +26,12 @@ const EdsSectionHeading = /*@__PURE__*/ proxyCustomElement(class EdsSectionHeadi
|
|
|
26
26
|
render() {
|
|
27
27
|
const TagType = this.tag; // Dynamically set tag type for the container
|
|
28
28
|
const HeadingTag = this.headingLevel; // Dynamically set heading level
|
|
29
|
-
return (h(TagType, { key: '
|
|
29
|
+
return (h(TagType, { key: '346654c0118e056276162b42723c6c163712ab4f', class: {
|
|
30
30
|
'ui-section-header flex flex-wrap items-center justify-between gap-x-12 gap-y-8': true,
|
|
31
31
|
container: this.withContainer,
|
|
32
32
|
'pt-48': this.spacingLarge,
|
|
33
33
|
'pt-28': !this.spacingLarge
|
|
34
|
-
} }, h(HeadingTag, { key: '
|
|
34
|
+
} }, h(HeadingTag, { key: 'c7d17fc22b3926495c799da0bc8bde7dc949e46a', class: this.getHeadingClass() }, this.sectionTitle)));
|
|
35
35
|
}
|
|
36
36
|
}, [0, "eds-section-heading", {
|
|
37
37
|
"sectionTitle": [1, "section-title"],
|
|
@@ -49,7 +49,7 @@ const EdsSocialNetworks = /*@__PURE__*/ proxyCustomElement(class EdsSocialNetwor
|
|
|
49
49
|
icon: 'bluesky'
|
|
50
50
|
}
|
|
51
51
|
];
|
|
52
|
-
this.
|
|
52
|
+
this.heading = 'Follow EBRAINS to keep up-to-date';
|
|
53
53
|
}
|
|
54
54
|
/**
|
|
55
55
|
* Renders the component's HTML structure with links to EBRAINS social profiles.
|
|
@@ -58,11 +58,11 @@ const EdsSocialNetworks = /*@__PURE__*/ proxyCustomElement(class EdsSocialNetwor
|
|
|
58
58
|
* @returns {JSX.Element} The rendered JSX for the component.
|
|
59
59
|
*/
|
|
60
60
|
render() {
|
|
61
|
-
return (h("div", { key: '
|
|
61
|
+
return (h("div", { key: '830f2648d282b24630f9266bc07dcf9d1fb528de' }, h("p", { key: '14d58e971d0ca585376d21400258742d2067471d', class: "f-ui-02" }, this.heading), h("ul", { key: 'd5ff24b6dbcfa25bae9b863b64e635e5c838db50', class: "mt-12 flex gap-4" }, this.socialNetworks.map((network, index) => (h("li", { key: index }, h("eds-link", { "extra-class": "effect-color effect-focus text-lighter hover:text-default flex items-center justify-center rounded-sm", external: true, "aria-label": network.label, url: network.url, icon: network.icon, intent: "strong" })))))));
|
|
62
62
|
}
|
|
63
63
|
static get style() { return EdsSocialNetworksStyle0; }
|
|
64
64
|
}, [1, "eds-social-networks", {
|
|
65
|
-
"
|
|
65
|
+
"heading": [1, "title"]
|
|
66
66
|
}]);
|
|
67
67
|
function defineCustomElement() {
|
|
68
68
|
if (typeof customElements === "undefined") {
|
|
@@ -8,13 +8,13 @@ const EdsSwitch$1 = /*@__PURE__*/ proxyCustomElement(class EdsSwitch extends HTM
|
|
|
8
8
|
super();
|
|
9
9
|
this.__registerHost();
|
|
10
10
|
this.__attachShadow();
|
|
11
|
-
this.
|
|
11
|
+
this.toggle = createEvent(this, "toggle", 7);
|
|
12
12
|
this.toggleSwitch = () => {
|
|
13
13
|
if (this.disabled) {
|
|
14
14
|
return;
|
|
15
15
|
}
|
|
16
16
|
this.checked = !this.checked;
|
|
17
|
-
this.
|
|
17
|
+
this.toggle.emit(this.checked);
|
|
18
18
|
};
|
|
19
19
|
this.checked = false;
|
|
20
20
|
this.disabled = false;
|