@ebrains/vue 0.3.0-alpha.0 → 0.5.0-alpha.0

package/{eds-avatar_17.entry-08AUpBqo.mjs → eds-alert_17.entry-IJq6baZd.mjs}

@@ -1,215 +1,704 @@
-import { r as t, h as e, g as s, c as g } from "./index-Dg2DO7q4.mjs";
-import { g as h, s as x } from "./color-0ba8ed56-D-UJpBQL.mjs";
-import { c } from "./index-39c58238-BwYCDOHZ.mjs";
-import { h as b } from "./logo-color-7f1fd803-CFgbXdt8.mjs";
-import { h as f, a as m, b as p, c as u, v as y, d as v, e as w, f as k, g as z } from "./logo-white-no-bg-f382f86f-YhfmNmGG.mjs";
-import { t as S } from "./toastManager-d9eee791-CEYNwx25.mjs";
-import { l as C, a as F, c as E, i as I, b as L, g as H } from "./keycloak-13893af6-BLzE1H6E.mjs";
-const A = `.border-inside {
-    position: relative;
-
-    &::after {
-        pointer-events: none;
-    }
-
-    &::after {
-        position: absolute;
-    }
-
-    &::after {
-        inset: 0rem;
-    }
+import { r as l, h as e, g as o, c as a } from "./index-C-Gy1Lax.mjs";
+import { c as d } from "./index-39c58238-BwYCDOHZ.mjs";
+import { s as c } from "./analytics-1cde8e4a-BDRcCMlV.mjs";
+import { h as g } from "./logo-color-7f1fd803-CFgbXdt8.mjs";
+import { h as b, a as h, b as f, c as m, v as p, d as u, e as y, f as v, g as w } from "./logo-white-no-bg-f382f86f-YhfmNmGG.mjs";
+import { t as k } from "./toastManager-d9eee791-CEYNwx25.mjs";
+const z = `:root {
+  font-optical-sizing: auto;
+}
+html,
+body {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+/*
+:focus[data-focus-method="mouse"],
+:focus[data-focus-method="touch"] {
+  outline: none !important;
+}
+*/
+/*FADE*/
+/*FADE TRANSLATE Y*/
+/*SLIDE LEFT*/
+/*SLIDE BOTTOM*/
+/*COLLAPSE Y*/
+*, ::before, ::after {
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+}
+::backdrop {
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+}
+/*
+! tailwindcss v3.4.13 | MIT License | https://tailwindcss.com
+*/
+/*
+1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+*/
+*,
+::before,
+::after {
+  box-sizing: border-box; /* 1 */
+  border-width: 0; /* 2 */
+  border-style: solid; /* 2 */
+  border-color: currentColor; /* 2 */
+}
+::before,
+::after {
+}
+/*
+1. Use a consistent sensible line-height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+3. Use a more readable tab size.
+4. Use the user's configured \`sans\` font-family by default.
+5. Use the user's configured \`sans\` font-feature-settings by default.
+6. Use the user's configured \`sans\` font-variation-settings by default.
+7. Disable tap highlights on iOS
+*/
+html {
+  line-height: 1.5; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+  -moz-tab-size: 4; /* 3 */
+  -o-tab-size: 4;
+     tab-size: 4; /* 3 */
+  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
+  font-feature-settings: normal; /* 5 */
+  font-variation-settings: normal; /* 6 */
+  -webkit-tap-highlight-color: transparent; /* 7 */
+}
+/*
+1. Remove the margin in all browsers.
+2. Inherit line-height from \`html\` so users can set them as a class directly on the \`html\` element.
+*/
+body {
+  margin: 0; /* 1 */
+  line-height: inherit; /* 2 */
+}
+/*
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+3. Ensure horizontal rules are visible by default.
+*/
+hr {
+  height: 0; /* 1 */
+  color: inherit; /* 2 */
+  border-top-width: 1px; /* 3 */
+}
+/*
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+abbr:where([title]) {
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+}
+/*
+Remove the default font size and weight for headings.
+*/
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+/*
+Reset links to optimize for opt-in styling instead of opt-out.
+*/
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+/*
+Add the correct font weight in Edge and Safari.
+*/
+b,
+strong {
+  font-weight: bolder;
+}
+/*
+1. Use the user's configured \`mono\` font-family by default.
+2. Use the user's configured \`mono\` font-feature-settings by default.
+3. Use the user's configured \`mono\` font-variation-settings by default.
+4. Correct the odd \`em\` font sizing in all browsers.
+*/
+code,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
+  font-feature-settings: normal; /* 2 */
+  font-variation-settings: normal; /* 3 */
+  font-size: 1em; /* 4 */
+}
+/*
+Add the correct font size in all browsers.
+*/
+small {
+  font-size: 80%;
+}
+/*
+Prevent \`sub\` and \`sup\` elements from affecting the line height in all browsers.
+*/
+sub {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+sub {
+  bottom: -0.25em;
+}
+/*
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+3. Remove gaps between table borders by default.
+*/
+table {
+  text-indent: 0; /* 1 */
+  border-color: inherit; /* 2 */
+  border-collapse: collapse; /* 3 */
+}
+/*
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+3. Remove default padding in all browsers.
+*/
+button,
+input,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-feature-settings: inherit; /* 1 */
+  font-variation-settings: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  font-weight: inherit; /* 1 */
+  line-height: inherit; /* 1 */
+  letter-spacing: inherit; /* 1 */
+  color: inherit; /* 1 */
+  margin: 0; /* 2 */
+  padding: 0; /* 3 */
+}
+/*
+Remove the inheritance of text transform in Edge and Firefox.
+*/
+button,
+select {
+  text-transform: none;
+}
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Remove default button styles.
+*/
+button,
+input:where([type='button']),
+input:where([type='submit']) {
+  -webkit-appearance: button; /* 1 */
+  background-color: transparent; /* 2 */
+  background-image: none; /* 2 */
+}
+/*
+Use the modern Firefox focus style for all focusable elements.
+*/
+/*
+Remove the additional \`:invalid\` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
+*/
+/*
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+/*
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+/*
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+[type='search'] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+/*
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to \`inherit\` in Safari.
+*/
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+/*
+Add the correct display in Chrome and Safari.
+*/
+/*
+Removes the default spacing and border for appropriate elements.
+*/
 
-    &::after {
-        z-index: 1;
-    }
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+p,
+pre {
+  margin: 0;
+}
+fieldset {
+  margin: 0;
+  padding: 0;
+}
+ol,
+ul,
+menu {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+/*
+Reset default styling for dialogs.
+*/
+dialog {
+  padding: 0;
+}
+/*
+Prevent resizing textareas horizontally by default.
+*/
+textarea {
+  resize: vertical;
+}
+/*
+1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
+2. Set the default placeholder color to the user's configured gray 400 color.
+*/
+input::-moz-placeholder, textarea::-moz-placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+input::placeholder,
+textarea::placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+/*
+Set the default cursor for buttons.
+*/
+button,
+[role="button"] {
+  cursor: pointer;
+}
+/*
+Make sure disabled buttons don't get the pointer cursor.
+*/
+/*
+1. Make replaced elements \`display: block\` by default. (https://github.com/mozdevs/cssremedy/issues/14)
+2. Add \`vertical-align: middle\` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design.
+*/
+img,
+iframe,
+object {
+  display: block; /* 1 */
+  vertical-align: middle; /* 2 */
+}
+/*
+Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
+*/
+img {
+  max-width: 100%;
+  height: auto;
+}
+/* Make elements with the HTML hidden attribute stay hidden by default */
+[hidden] {
+  display: none;
+}
+:root {
+  --inner-gutter: 8px;
+}
+@media (min-width: 750px) {
+  :root {
+    --inner-gutter: 12px;
+  }
+}
+@media (min-width: 900px) {
+  :root {
+    --inner-gutter: 16px;
+  }
+}
+@media (min-width: 1024px) {
+  :root {
+    --inner-gutter: 16px;
+  }
+}
+@media (min-width: 1280px) {
+  :root {
+    --inner-gutter: 16px;
+  }
+}
+@media (min-width: 2200px) {
+  :root {
+    --inner-gutter: 16px;
+  }
+}
+:root {
+}
+@media (min-width: 900px) {
+  :root {
+}
+}
+:root {
+  --sans: Inter, Helvetica, Arial, sans-serif;
+  --f-ui-01-fontFamily: var(--sans);
+  --f-ui-01-fontWeight: 800;
+  --f-ui-01-fontSize: 18px;
+  --f-ui-01-lineHeight: 110%;
+  --f-ui-01-letterSpacing: -0.01em;
+}
+.f-ui-01 {
+  font-family: var(--f-ui-01-fontFamily);
+  font-weight: var(--f-ui-01-fontWeight);
+  font-size: var(--f-ui-01-fontSize);
+  line-height: var(--f-ui-01-lineHeight);
+  letter-spacing: var(--f-ui-01-letterSpacing);
+}
+@media (min-width: 750px) {
+  :root {
+}
+}
+@media (min-width: 900px) {
+  :root {
+}
+}
+@media (min-width: 1024px) {
+  :root {
+}
+}
+.f-ui-01 b, .f-ui-01 strong {
+  font-weight: var(--f-ui-01---bold-weight, bold);
+}
+:root {
+  --grey-300: #e6e6e6;
+  --green-200: #d3ffdc;
+  --yellow-200: #ffffcb;
+  --red-200: #ffe0e1;
+}
+@media (min-width: 750px) {
+  .md\\:grid-line-x > *::before {
+    content: attr(👻);
+    inset-inline-start: 0;
+    inset-inline-end: 0;
+    top: 0;
+    bottom: calc(var(--inner-gutter) / -2);
+    border-top: 0 solid transparent;
+    border-bottom: 0 solid transparent;
+  }
+  .md\\:grid-line-xfull > *::before {
+    content: attr(👻);
+    inset-inline-start: calc(var(--inner-gutter) / -2);
+    inset-inline-end: calc(var(--inner-gutter) / -2);
+    top: 0;
+    bottom: calc(var(--inner-gutter) / -2);
+    border-top: 0 solid transparent;
+    border-bottom: 0 solid transparent;
+  }
+  .md\\:grid-line-x-0 > *::before {
+    content: none;
+  }
+  .md\\:grid-line-y > *::after {
+    content: attr(👻);
+    inset-inline-start: 0;
+    inset-inline-end: calc(var(--inner-gutter) / -2);
+    top: 0;
+    bottom: 0;
+    border-inline-start: 0 solid transparent;
+    border-inline-end: 0 solid transparent;
+  }
+  .md\\:grid-line-yfull > *::after {
+    content: attr(👻);
+    inset-inline-start: 0;
+    inset-inline-end: calc(var(--inner-gutter) / -2);
+    top: calc(var(--inner-gutter) / -1);
+    bottom: 0;
+    border-inline-start: 0 solid transparent;
+    border-inline-end: 0 solid transparent;
+  }
+  .md\\:grid-line-y-0 > *::after {
+    content: none;
+  }
+}
+@media (min-width: 900px) {
+  .lg\\:grid-line-x > *::before {
+    content: attr(👻);
+    inset-inline-start: 0;
+    inset-inline-end: 0;
+    top: 0;
+    bottom: calc(var(--inner-gutter) / -2);
+    border-top: 0 solid transparent;
+    border-bottom: 0 solid transparent;
+  }
+  .lg\\:grid-line-xfull > *::before {
+    content: attr(👻);
+    inset-inline-start: calc(var(--inner-gutter) / -2);
+    inset-inline-end: calc(var(--inner-gutter) / -2);
+    top: 0;
+    bottom: calc(var(--inner-gutter) / -2);
+    border-top: 0 solid transparent;
+    border-bottom: 0 solid transparent;
+  }
+  .lg\\:grid-line-x-0 > *::before {
+    content: none;
+  }
+  .lg\\:grid-line-y > *::after {
+    content: attr(👻);
+    inset-inline-start: 0;
+    inset-inline-end: calc(var(--inner-gutter) / -2);
+    top: 0;
+    bottom: 0;
+    border-inline-start: 0 solid transparent;
+    border-inline-end: 0 solid transparent;
+  }
+  .lg\\:grid-line-yfull > *::after {
+    content: attr(👻);
+    inset-inline-start: 0;
+    inset-inline-end: calc(var(--inner-gutter) / -2);
+    top: calc(var(--inner-gutter) / -1);
+    bottom: 0;
+    border-inline-start: 0 solid transparent;
+    border-inline-end: 0 solid transparent;
+  }
+  .lg\\:grid-line-y-0 > *::after {
+    content: none;
+  }
+}
+.border-inside {
+  position: relative;
 
     &::after {
-        border-radius: 8px;
-    }
+    pointer-events: none;
+  }
 
     &::after {
-        border-width: 1px;
-    }
+    position: absolute;
+  }
 
     &::after {
-        border-width: 2px;
-    }
+    inset: 0rem;
+  }
 
     &::after {
-        border: 2px solid rgba(0, 0, 0, .1);
-    }
+    z-index: 1;
+  }
 
     &::after {
-        content: '';
-    }
-}
+    border-radius: 8px;
+  }
 
-.border-inside-pill {
     &::after {
-        border-radius: 100px;
-    }
+    border-width: 1px;
+  }
 
     &::after {
-        content: '';
-    }
-}
+    border-width: 2px;
+  }
 
-.border-inside-inverse {
     &::after {
-        border: 2px solid rgba(255, 255, 255, 0.3);
-    }
+    border-color: rgba(0, 0, 0, .1 );
+  }
 
     &::after {
-        content: '';
+      content: '';
     }
 }
-
-.aspect-1x1 {
-    aspect-ratio: 1/1;
-}
-
+/** region TRANSITIONS */
+/** endregion */
+/* region FOCUS */
+/* endregion */
+/* region BG */
+/* endregion */
+/*region shadow*/
+/*endregion*/
 .flex {
-    display: flex;
+  display: flex;
 }
-
-.inline-flex {
-    display: inline-flex;
+.w-full {
+  width: 100%;
+}
+.flex-row {
+  flex-direction: row;
 }
-
 .items-center {
-    align-items: center;
+  align-items: center;
 }
-
-.justify-center {
-    justify-content: center;
+.justify-between {
+  justify-content: space-between;
 }
-
-.overflow-hidden {
-    overflow: hidden;
+.gap-x-12 {
+  -moz-column-gap: 0.75rem;
+       column-gap: 0.75rem;
 }
-
-.px-4 {
-    padding-left: 0.25rem;
-    padding-right: 0.25rem;
+.space-y-12 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
 }
-
-.rounded-pill {
-    border-radius: 100px;
+.rounded-lg {
+  border-radius: 16px;
 }
-
-.rounded-sm {
-    border-radius: 8px;
+.bg-dark {
+  background-color: var(--grey-300);
 }
-
-.rounded-xs {
-    border-radius: 4px;
+.bg-error {
+  background-color: var(--red-200);
 }
-
-
-.bg-dark {
-    background-color: var(--grey-300);
+.bg-success {
+  background-color: var(--green-200);
 }
-
-.bg-darker {
-    background-color: var(--grey-400);
+.bg-warning {
+  background-color: var(--yellow-200);
 }
-
-.bg-stronger {
-    background-color: var(--grey-900);
+.p-16 {
+  padding: 1rem;
 }
-
-.bg-strongest {
-    background-color: var(--black);
+.p-20 {
+  padding: 1.25rem;
 }
-
-.text-accent {
-    color: var(--green-500);
+.px-12 {
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
 }
-
-.text-default {
-    color: var(--black);
+.px-20 {
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
 }
-
-.\\!no-underline {
-    text-decoration-line: none !important;
+.py-12 {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
 }
-
-.f-ui-01 {
-    font-family: var(--f-ui-01-fontFamily);
-    font-weight: var(--f-ui-01-fontWeight);
-    font-size: var(--f-ui-01-fontSize);
-    line-height: var(--f-ui-01-lineHeight);
-    letter-spacing: var(--f-ui-01-letterSpacing);
+.py-20 {
+  padding-top: 1.25rem;
+  padding-bottom: 1.25rem;
 }
-
-.w-32 {
-    width: 2rem;
+.py-8 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
 }
-
-.w-44 {
-    width: 2.75rem;
+.pr-12 {
+  padding-right: 0.75rem;
 }
-
-.w-\\[54px\\] {
-    width: 54px;
-}`, W = A, j = class {
+.shadow {
+  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+[class*=underline-] {
+  text-decoration-line: underline;
+}
+.after\\:rounded-lg::after {
+  border-radius: 16px;
+}
+.after\\:border-softest::after {
+  border-color: rgba(0, 0, 0, .05 );
+}
+`, S = z, C = d(["w-full bg-dark rounded-lg border-inside after:border-softest after:rounded-lg"], {
+  variants: {
+    intent: {
+      default: "",
+      warning: "bg-warning",
+      error: "bg-error",
+      success: "bg-success"
+    },
+    direction: {
+      vertical: "space-y-12",
+      horizontal: "flex flex-row items-center justify-between gap-x-12"
+    },
+    withBtn: {
+      false: "",
+      true: ""
+    }
+  },
+  compoundVariants: [
+    {
+      direction: "horizontal",
+      withBtn: !0,
+      class: "px-20 pr-12 py-12"
+    },
+    {
+      direction: "horizontal",
+      withBtn: !1,
+      class: "p-20"
+    },
+    {
+      direction: "vertical",
+      withBtn: !0,
+      class: "p-16"
+    },
+    {
+      direction: "vertical",
+      withBtn: !1,
+      class: "px-12 py-20"
+    }
+  ],
+  defaultVariants: {
+    intent: "default",
+    direction: "horizontal"
+  }
+}), F = class {
   constructor(n) {
-    t(this, n), this.firstName = void 0, this.lastName = void 0, this.picture = void 0, this.initials = void 0, this.color = void 0, this.rounded = !1, this.initialsStrong = !1;
+    l(this, n), this.message = void 0, this.pressableLabel = void 0, this.pressableUrl = void 0, this.direction = "horizontal", this.intent = "default", this.withBtn = !1;
   }
-  /**
-   * Computed initials based on the provided `initials` prop or derived from `firstName` and `lastName`.
-   * @returns {string | undefined} Initials for display in the avatar.
-   */
-  get computedInitials() {
-    if (this.initials)
-      return (this.initials.match(/.{1,3}/g) || [])[0] || "";
-    if (this.firstName && this.lastName)
-      return `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`.toUpperCase();
+  componentWillLoad() {
+    this.withBtn = !!this.pressableLabel;
   }
-  /**
-   * Computes the CSS classes for the avatar container based on provided props like `rounded`, `color`, and `picture`.
-   * @returns {string} List of CSS classes to apply to the avatar container.
-   */
-  get containerClasses() {
-    return [
-      "border-inside",
-      "aspect-1x1",
-      "flex",
-      "items-center",
-      "justify-center",
-      "overflow-hidden",
-      this.picture ? "" : "px-4",
-      this.rounded ? "rounded-pill border-inside-pill w-32" : "w-[54px] rounded-sm",
-      this.color ? "border-inside-inverse" : "",
-      this.color === "grey" ? "bg-dark" : this.color && !this.picture ? h({
-        color: this.color,
-        direction: "top",
-        pseudo: !1
-      }) : this.picture ? "" : "bg-strongest text-accent"
-    ].join(" ");
+  componentDidLoad() {
+    var n;
+    const i = (n = this.el.shadowRoot) === null || n === void 0 ? void 0 : n.querySelector("eds-link");
+    i && this.emitContext(i);
+  }
+  emitContext(n) {
+    const i = new CustomEvent("parentContext", {
+      detail: {
+        componentName: this.el.tagName.toLowerCase(),
+        identifier: null
+      }
+    });
+    n.dispatchEvent(i);
   }
-  /**
-   * Renders the avatar component. Displays either an image using `eds-img` or initials depending on whether `picture` or `computedInitials` is set.
-   * @returns {JSX.Element} The rendered avatar component.
-   */
   render() {
-    return e("div", { key: "716279a35cc9235da991563d5f84d2dedbdae001", class: this.containerClasses }, this.picture ? e("eds-img", { src: this.picture, width: 54, height: 54, sizes: "120px", alt: `${this.firstName} ${this.lastName}`, lazyload: !0, withBg: !0 }) : e("abbr", { title: this.computedInitials || `${this.firstName} ${this.lastName}`, class: "!no-underline f-ui-01" }, this.computedInitials));
+    return e("div", { key: "519742081f681d6d67bc1b42c89fe1b6d005fe0f", class: C({
+      intent: this.intent,
+      direction: this.direction,
+      withBtn: this.withBtn
+    }), role: "alert" }, e("p", { key: "6a5d11fdc2a975512b12c307286b0a8b06998bec", class: "f-ui-01 py-8" }, this.message), this.withBtn && (this.pressableUrl ? e("eds-link", { class: "eds-alert-link", label: this.pressableLabel, url: this.pressableUrl, intent: "secondary", external: !0 }) : null));
+  }
+  get el() {
+    return o(this);
   }
 };
-j.style = W;
-const O = ".border-soft{border-color:rgba(0, 0, 0, .15)}.border-softer{border-color:rgba(0, 0, 0, .1)}.border-softest{border-color:rgba(0, 0, 0, .05)}.my-16{margin-top:1rem;margin-bottom:1rem}.my-20{margin-top:1.25rem;margin-bottom:1.25rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.w-full{width:100%}.border-t-2{border-top-width:2px}", U = O, T = class {
+F.style = S;
+const E = ".border-soft{border-color:rgba(0, 0, 0, .15)}.border-softer{border-color:rgba(0, 0, 0, .1)}.border-softest{border-color:rgba(0, 0, 0, .05)}.my-16{margin-top:1rem;margin-bottom:1rem}.my-20{margin-top:1.25rem;margin-bottom:1.25rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.w-full{width:100%}.border-t-2{border-top-width:2px}", L = E, H = class {
   constructor(n) {
-    t(this, n), this.extraClass = "";
+    l(this, n), this.extraClass = "";
   }
   render() {
-    return e("hr", { key: "85b5253d4abb77072424452d2ff6a0d631e67652", class: `border-softer my-20 inline-block w-full border-t-2 ${this.extraClass}` });
+    return e("hr", { key: "8cb39dda5d7f909b459390fe7e3f86dfd147ba98", class: `border-softer my-20 inline-block w-full border-t-2 ${this.extraClass}` });
   }
 };
-T.style = U;
-const B = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}.hidden{display:none}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.125rem * var(--tw-space-x-reverse));margin-left:calc(0.125rem * calc(1 - var(--tw-space-x-reverse)))}.px-2{padding-left:0.125rem;padding-right:0.125rem}.w-20{width:1.25rem}.w-28{width:1.75rem}.w-32{width:2rem}.w-44{width:2.75rem}.h-20{height:1.25rem}.h-24{height:1.5rem}.h-28{height:1.75rem}.h-32{height:2rem}@media (min-width: 750px){.md\\:block{display:block}}", M = B, R = class {
+H.style = L;
+const I = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}.hidden{display:none}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.125rem * var(--tw-space-x-reverse));margin-left:calc(0.125rem * calc(1 - var(--tw-space-x-reverse)))}.px-2{padding-left:0.125rem;padding-right:0.125rem}.w-20{width:1.25rem}.w-28{width:1.75rem}.w-32{width:2rem}.w-44{width:2.75rem}.h-20{height:1.25rem}.h-24{height:1.5rem}.h-28{height:1.75rem}.h-32{height:2rem}@media (min-width: 750px){.md\\:block{display:block}}", W = I, j = class {
   constructor(n) {
-    t(this, n), this.updateScreenSize = () => {
+    l(this, n), this.updateScreenSize = () => {
       const i = window.innerWidth;
       i < 769 ? (this.maxVisibleItems = 3, this.isSmallScreen = !0) : i <= 1024 ? (this.maxVisibleItems = 4, this.isSmallScreen = !0) : (this.maxVisibleItems = 6, this.isSmallScreen = !1);
     }, this.items = [], this.intent = "ghost", this.parsedItems = [], this.isSmallScreen = !1, this.maxVisibleItems = 6;
@@ -222,8 +711,8 @@ const B = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{
       try {
         const i = JSON.parse(n);
         this.parsedItems = Array.isArray(i) ? i : [];
-      } catch (i) {
-        console.error("Error parsing breadcrumb items:", i), this.parsedItems = [];
+      } catch {
+        this.parsedItems = [];
       }
     else Array.isArray(n) ? this.parsedItems = n : this.parsedItems = [];
   }
@@ -242,8 +731,10 @@ const B = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{
    * It emits a custom event for each `eds-link` element contained within the breadcrumb.
    */
   componentDidLoad() {
-    this.el.shadowRoot.querySelectorAll("eds-link").forEach((i) => {
-      this.emitContext(i);
+    var n;
+    const i = (n = this.el.shadowRoot) === null || n === void 0 ? void 0 : n.querySelectorAll("eds-link");
+    i == null || i.forEach((r) => {
+      this.emitContext(r);
     });
   }
   /**
@@ -262,52 +753,47 @@ const B = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{
     n.dispatchEvent(i);
   }
   /**
-   * Truncates breadcrumb items based on the maxVisibleItems value.
-   * Truncates `label` to 10 characters if `isSmallScreen` is true, except for the last label.
+   * Returns breadcrumb items with potential truncation if there are too many.
+   * It inserts an ellipsis item where necessary.
    */
   getTruncatedItems() {
-    const n = this.parsedItems.length;
+    const n = this.parsedItems.length, i = { label: "...", url: "", isHidden: !0 };
     if (n > this.maxVisibleItems) {
-      const i = this.parsedItems[0], r = this.parsedItems.slice(-2), l = { label: "...", url: "", isHidden: !0 };
+      const r = this.parsedItems[0], t = this.parsedItems.slice(-2);
       if (this.maxVisibleItems === 3)
-        return [
-          this.truncateLabel(i),
-          l,
-          ...r.map((o, d) => d === r.length - 1 ? o : this.truncateLabel(o))
-        ];
+        return [r, i, ...t];
       if (this.maxVisibleItems === 4) {
-        const o = this.parsedItems[Math.floor(n / 2)];
-        return [
-          this.truncateLabel(i),
-          this.truncateLabel(o),
-          l,
-          ...r.map((d, a) => a === r.length - 1 ? d : this.truncateLabel(d))
-        ];
+        const s = this.parsedItems[Math.floor(n / 2)];
+        return [r, s, i, ...t];
       }
     }
-    return this.parsedItems.map((i, r) => r === this.parsedItems.length - 1 ? i : this.truncateLabel(i));
+    return this.parsedItems;
   }
   /**
-   * Truncates the label of a breadcrumb item to a maximum of 10 characters
-   * if the screen is small.
+   * Helper to determine the display label and full label.
+   * If the label is longer than 15 characters and the item is not the current (last) item,
+   * we display a truncated version but use the full label for aria attributes.
    */
-  truncateLabel(n) {
-    return n.label.length > 15 ? Object.assign(Object.assign({}, n), { label: `${n.label.slice(0, 15)}...` }) : n;
+  getLabels(n, i) {
+    return !i && n.label.length > 15 ? { displayLabel: `${n.label.slice(0, 15)}...`, fullLabel: n.label } : { displayLabel: n.label, fullLabel: n.label };
   }
   /**
    * Render method for the breadcrumb component.
    * It creates a navigation element with an ordered list of breadcrumb links.
-   * The last link is disabled and marked as the current page.
+   * The last link is marked as the current page.
    */
   render() {
     const n = this.getTruncatedItems();
-    return e("nav", { key: "1491f7e548ba859e0661129de2ec320552a2bb42", "aria-label": "Breadcrumb" }, e("ol", { key: "93525aad588295e9f2a3f02d143824c7c58ea512", class: "flex items-center space-x-2" }, n.map((i, r) => {
-      const l = r === n.length - 1;
-      return e("li", { class: "flex items-center" }, i.isHidden ? e("span", { class: "truncate px-2 ", "aria-hidden": "true" }, "...") : e("eds-link", { label: i.label, url: i.url, intent: this.intent, current: l, "aria-label": i.label, size: "small", "icon-small": "false" }), !l && !i.isHidden && e("eds-icon-wrapper", { icon: "chevron-right", class: "w-20 h-20" }));
+    return e("nav", { key: "d177957e1b3218c21991bbdc9636a8e32befe990", "aria-label": "Breadcrumb" }, e("ol", { key: "d10336ddee99b9fb84d17e53093c57c6a025982f", class: "flex items-center space-x-2" }, n.map((i, r) => {
+      const t = r === n.length - 1;
+      return e("li", { class: "flex items-center" }, i.isHidden ? e("span", { class: "truncate px-2", "aria-hidden": "true" }, "...") : (() => {
+        const { displayLabel: s, fullLabel: x } = this.getLabels(i, t);
+        return e("eds-link", Object.assign({ label: s, url: i.url, intent: this.intent, current: t, "aria-label": x, size: "small", "icon-small": "false" }, t ? { "aria-current": "page" } : {}));
+      })(), !t && !i.isHidden && e("eds-icon-wrapper", { icon: "chevron-right", class: "w-20 h-20" }));
     })));
   }
   get el() {
-    return s(this);
+    return o(this);
   }
   static get watchers() {
     return {
@@ -315,8 +801,8 @@ const B = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{
     };
   }
 };
-R.style = M;
-const D = `@font-face {
+j.style = W;
+const A = `@font-face {
     font-family: "Inter";
     font-weight: 100 900;
     font-display: swap;
@@ -7455,9 +7941,9 @@ const D = `@font-face {
       padding-right: 0rem;
     }
   }
-  `, _ = D, N = class {
+  `, O = A, R = class {
   constructor(n) {
-    t(this, n), this.button = c([
+    l(this, n), this.button = d([
       "relative inline-flex items-center",
       "py-8",
       "effect-focus effect-color",
@@ -7555,7 +8041,7 @@ const D = `@font-face {
         pill: !1,
         size: "small"
       }
-    }), this.iconCva = c(["flex inline-flex items-center justify-center"], {
+    }), this.iconCva = d(["flex inline-flex items-center justify-center"], {
       variants: {
         size: {
           large: "",
@@ -7605,20 +8091,30 @@ const D = `@font-face {
         size: "small",
         iconOnly: !1
       }
-    }), this.parentContext = null, this.label = void 0, this.ariaLabel = void 0, this.elementType = "button", this.intent = "secondary", this.loading = !1, this.disabled = !1, this.pill = !1, this.icon = void 0, this.size = "small", this.iconPos = "right", this.iconSmall = !1, this.extraClass = void 0, this.triggerClick = void 0;
-  }
-  handleParentContext(n) {
-    n.target === this.el && (this.parentContext = n.detail, n.stopPropagation());
+    }), this.label = void 0, this.ariaLabel = "Button", this.elementType = "button", this.intent = "secondary", this.loading = !1, this.disabled = !1, this.pill = !1, this.icon = void 0, this.size = "small", this.iconPos = "right", this.iconSmall = !1, this.extraClass = void 0, this.triggerClick = void 0;
   }
+  /*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();
+    }
+    */
   handleClick(n) {
     var i, r;
     if (this.disabled) {
       n.preventDefault();
       return;
     }
-    x({
+    c({
       category: "ui-component",
-      parentContext: this.parentContext,
+      parentContext: null,
       tag: this.el.tagName.toLowerCase(),
       name: ((i = this.label) === null || i === void 0 ? void 0 : i.toLowerCase()) || ((r = this.ariaLabel) === null || r === void 0 ? void 0 : r.toLowerCase()) || "",
       action: "click"
@@ -7639,107 +8135,19 @@ const D = `@font-face {
       iconOnly: !this.label,
       show: !this.loading
     }), r = this.elementType;
-    return e(r, { key: "1053db0332f574db35e58453d789567eaf235d30", "aria-label": this.label || this.ariaLabel || void 0, "aria-disabled": this.elementType === "button" ? this.disabled : void 0, disabled: this.elementType === "button" ? this.disabled : void 0, class: `${n || ""} ${this.extraClass || ""}`, onClick: (l) => this.handleClick(l) }, this.label && e("span", { key: "ff95b889b008075d46b89a1d23e51ad8afa20918", class: this.loading ? "opacity-0" : "" }, this.label), this.loading && e("span", { key: "942f3fffcaef08defd3d0ef0dbb275b9d189c907", class: "absolute inset-0 flex items-center justify-center" }, e("span", { key: "91e53dcee9d4f2a842ea922498c9da7f15ffe109", class: "loader", style: {
+    return e(r, { key: "52cda715164eeca59e35b45f617a2d6d1b05a94c", "aria-label": this.label || this.ariaLabel || void 0, "aria-disabled": this.elementType === "button" ? this.disabled : void 0, disabled: this.elementType === "button" ? this.disabled : void 0, class: `${n || ""} ${this.extraClass || ""}`, onClick: (t) => this.handleClick(t) }, this.label && e("span", { key: "866cd0272d9f381b3ecb892e588c860ca8b41051", class: this.loading ? "opacity-0" : "" }, this.label), this.loading && e("span", { key: "fcba01e3404724869c59f4e21bd5db459643d840", class: "absolute inset-0 flex items-center justify-center" }, e("span", { key: "e44955e5641e757e66eb4961097fb4d60e4def7c", 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 ? e("eds-icon-wrapper", { class: i, icon: this.icon }) : null);
   }
   get el() {
-    return s(this);
-  }
-};
-N.style = _;
-const P = ".z-focus{z-index:99}.relative{position:relative}.shadow-small{--tw-shadow:0px 1.5px 2px rgba(0, 0, 0, 0.1);--tw-shadow-colored:0px 1.5px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.bg-inverse{background-color:var(--white)}.border-softest{border:2px solid rgba(0, 0, 0, .05)}.z-10{z-index:10}.z-on-top{z-index:99999}.absolute{position:absolute}.top-full{top:100%}.mt-4{margin-top:0.25rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.gap-y-4{row-gap:0.25rem}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-8{padding:0.5rem}.left-0{left:0rem}.left-1\\/2{left:50%}.left-4{left:0.25rem}.left-\\[4px\\]{left:4px}.right-0{right:0rem}.right-4{right:0.25rem}.right-8{right:0.5rem}", Y = P, $ = class {
-  constructor(n) {
-    t(this, n), this.focusableItems = [], this.handleClick = () => {
-      this.isOpen = !this.isOpen, this.isOpen ? (this.focusIndex = 0, this.focusItem()) : this.closeDropdown();
-    }, this.icon = "chevron-down", this.label = void 0, this.rounded = !1, this.ariaLabel = "Open dropdown", this.asNav = !0, this.dropdownPos = "left", this.dropdownOffset = !0, this.intent = "tertiary", this.isOpen = !1, this.focusIndex = -1;
-  }
-  /**
-   * Closes the dropdown when a click occurs outside of it.
-   * @param {Event} e - The click event.
-   */
-  handleWindowClick(n) {
-    this.host.contains(n.target) || this.closeDropdown();
-  }
-  /**
-   * Handles keyboard navigation and accessibility within the dropdown.
-   * @param {KeyboardEvent} event - The keyboard event.
-   */
-  handleKeyDown(n) {
-    if (this.isOpen)
-      switch (n.key) {
-        case "Tab":
-          this.closeDropdown();
-          break;
-        case "ArrowUp":
-          n.preventDefault(), this.focusIndex = (this.focusIndex - 1 + this.focusableItems.length) % this.focusableItems.length, this.focusItem();
-          break;
-        case "ArrowDown":
-          n.preventDefault(), this.focusIndex = (this.focusIndex + 1) % this.focusableItems.length, this.focusItem();
-          break;
-      }
-  }
-  /**
-   * Closes the dropdown and resets focus.
-   */
-  closeDropdown() {
-    this.isOpen = !1, this.focusIndex = -1;
-  }
-  /**
-   * Sets focus on the currently selected item in the dropdown.
-   */
-  focusItem() {
-    var n;
-    (n = this.focusableItems[this.focusIndex]) === null || n === void 0 || n.focus();
-  }
-  /**
-   * Lifecycle method that runs after the component has been added to the DOM.
-   * Initializes focusable items within the dropdown.
-   */
-  componentDidLoad() {
-    var n;
-    this.focusableItems = Array.from(((n = this.dropdownContent) === null || n === void 0 ? void 0 : n.querySelectorAll("a, button")) || []), this.host.shadowRoot.querySelectorAll("eds-button").forEach((r) => {
-      this.emitContext(r);
-    });
-  }
-  /**
-   * Emits a custom event called `parentContext` for a given button element.
-   * Provides context information about the dropdown component.
-   *
-   * @param linkElement - The button element to which the event will be dispatched.
-   */
-  emitContext(n) {
-    const i = new CustomEvent("parentContext", {
-      detail: {
-        componentName: this.host.tagName.toLowerCase(),
-        identifier: null
-      }
-    });
-    n.dispatchEvent(i);
-  }
-  /**
-   * Renders the dropdown component and displays its content when open.
-   * @returns {JSX.Element} The rendered dropdown component.
-   */
-  render() {
-    return e("div", { key: "d49e23ee208cfb000baba83795899487e4d94af7", class: "z-focus relative", ref: (n) => this.dropdownContent = n }, e("eds-button", { key: "6647007c34b47558873e470890893ae4f8e18b5c", label: this.label, "aria-label": this.ariaLabel, icon: this.icon, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu" }), e("nav", { key: "41bbd4e2bf02345393aaa97101b2c3aca2fa4085", class: {
-      "shadow-small bg-inverse border-softest z-10 z-on-top absolute top-full mt-4 flex flex-col gap-y-4 border-2 p-8": !0,
-      "left-4": this.dropdownPos === "left" && this.dropdownOffset,
-      "left-0": this.dropdownPos === "left" && !this.dropdownOffset,
-      "right-4": this.dropdownPos === "right" && this.dropdownOffset,
-      "right-0": this.dropdownPos === "right" && !this.dropdownOffset,
-      "rounded-lg": this.rounded
-    }, style: { display: this.isOpen ? "block" : "none" }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, e("slot", { key: "714bad9f5a8ddf6d5ea246044a83b0a5102494c4" })));
-  }
-  get host() {
-    return s(this);
+    return o(this);
   }
 };
-$.style = Y;
-const X = "", V = X, q = class {
+R.style = O;
+const B = "", M = B, T = class {
   constructor(n) {
-    t(this, n), this.backToTop = () => {
+    l(this, n), this.backToTop = () => {
       window.scrollTo({ top: 0, behavior: "smooth" });
     }, this.extraClass = "", this.social = !1, this.hasCookiesSetUp = !1, this.enableScrollTop = !1, this.fundedBy = "EBRAINS is funded by the Horizon Europe Framework Programme.", this.rightsReserved = `${(/* @__PURE__ */ new Date()).getFullYear()} EBRAINS. All rights reserved.`, this.cookiesPreference = "Cookies Preferences";
   }
@@ -7758,13 +8166,13 @@ const X = "", V = X, q = class {
    * @returns {JSX.Element} The rendered JSX for the footer component.
    */
   render() {
-    return e("footer", { key: "8d3d1b5d2acd76f56b2bc12539cb7d277b4dcd7f", class: `${this.extraClass} pb-banner` }, this.social ? e("div", { class: "border-softest border-t-2 pt-20 pb-28 md:pt-28" }, e("div", { class: "container pb-20 xl:pb-40 " }, e("div", { class: "grid-layout" }, e("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, e("eds-social-networks", { class: "mt-28" })), e("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, e("div", { key: "7d6e3a414ec8e8f8e2b795faf639948f8819f5cb", class: `border-softest ${this.social ? "border-t-2" : ""} pt-20 pb-28 md:pt-28` }, e("div", { key: "9a475fd146ac0e1bc78c43940ee24ec31212fcb9", class: "container flex flex-wrap items-center gap-20 lg:flex-nowrap" }, e("div", { key: "4b465113cdb882f919fba15e944eb56edbe3c570", class: "flex items-center gap-x-12" }, e("a", { key: "1a8ad1ee5f4dfb77da036b03d0770cba8e5d725e", target: "_blank", rel: "noopener noreferrer", class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-2020_en" }, e("eds-img", { key: "4714ea1a01b7b7eef8b3af0c04ffe793d51c4d5e", width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg" }))), e("div", { key: "c4db6bab70e570e337c82136a0d9d6dad01c1039", class: "f-ui-04 text-light order-last w-full lg:order-none lg:w-auto" }, e("p", { key: "0b030a92c12a3a96fe2baacc13ac21f5bd708a50" }, this.fundedBy), e("div", { key: "4714d0ccf0e3912ae330a6f39ed3607caf2b51a4", class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap" }, e("span", { key: "b4bc2d45871c7d1f9de1d6090959b12fd5246f01", class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline" }, "© ", this.rightsReserved), this.hasCookiesSetUp && e("button", { key: "98b56eee7be6bc1558821933cebf2853b3bb68fc", class: "effect-focus !no-underline underline-offset-4 hover:!underline", onClick: () => this.toggleCookiesPopup() }, this.cookiesPreference))), e("div", { key: "f4bf4a0c99f3be920dd15f68e6f7e390cd85ecce", class: "ml-auto pl-12" }, this.enableScrollTop ? e("eds-button", { "aria-label": "Back to top", intent: "ghostInverse", icon: "chevron-up", onClick: this.backToTop }) : null))));
+    return e("footer", { key: "ba6500548e8f719b8670063918c61b391ddb8387", class: `${this.extraClass} pb-banner` }, this.social ? e("div", { class: "border-softest border-t-2 pt-20 pb-28 md:pt-28" }, e("div", { class: "container pb-20 xl:pb-40 " }, e("div", { class: "grid-layout" }, e("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, e("eds-social-networks", { class: "mt-28" })), e("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, e("div", { key: "1221cca6d40c4de8ed7ceefa84198817bf904630", class: `border-softest ${this.social ? "border-t-2" : ""} pt-20 pb-28 md:pt-28` }, e("div", { key: "ad55b938fb2961074822d6bf458f0ea7a15baa84", class: "container flex flex-wrap items-center gap-20 lg:flex-nowrap" }, e("div", { key: "91c13fdd98508a812e5dcfa86056b5adc035623d", class: "flex items-center gap-x-12" }, e("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" }, e("eds-img", { key: "df5f16284084d9171cd3d567dd249a0ef98bde79", width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg" }))), e("div", { key: "0ff4328cc30f06c1a85ffc726d5b6b0dc53e49b9", class: "f-ui-04 text-light order-last w-full lg:order-none lg:w-auto" }, e("p", { key: "2cb2b4f072a141e58c9a2185c9179d475f9690bd" }, this.fundedBy), e("div", { key: "b31d1e18933fb1be11d8454f9a5301dedc839015", class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap" }, e("span", { key: "aab95785cfb2bc7d490ac9426ef5e421f9418dc9", class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline" }, "© ", this.rightsReserved), this.hasCookiesSetUp && e("button", { key: "fbd5bf3560faf0ee34d740bda423595c3cd21ad8", class: "effect-focus !no-underline underline-offset-4 hover:!underline", onClick: () => this.toggleCookiesPopup() }, this.cookiesPreference))), e("div", { key: "0427234b6679ae05b673a5c6efb8447306f61876", class: "ml-auto pl-12" }, this.enableScrollTop ? e("eds-button", { "aria-label": "Back to top", intent: "ghostInverse", icon: "chevron-up", onClick: this.backToTop }) : null))));
   }
 };
-q.style = V;
-const J = "", G = J, K = class {
+T.style = M;
+const U = "", D = U, N = class {
   constructor(n) {
-    t(this, n), this.menuClose = g(this, "menuClose", 7), this.links = void 0, this.menuLinks = void 0, this.homeUrl = "/", this.inverseHeader = !1, this.isMenuOpen = !1;
+    l(this, n), this.menuClose = a(this, "menuClose", 7), this.links = void 0, this.menuLinks = void 0, this.homeUrl = "/", this.inverseHeader = !1, this.isMenuOpen = !1;
   }
   /**
    * Listens for the toggleMenu event to open or close the menu.
@@ -7831,10 +8239,10 @@ const J = "", G = J, K = class {
     return this.isMenuOpen ? e("div", { class: "eds-full-screen bg-default fixed inset-0 z-[999999] overflow-y-scroll" }, e("div", { class: "flex min-h-full flex-col" }, e("div", { class: `bg-default w-full sticky top-0 ${this.inverseHeader ? "bg-strongest" : "bg-default"}` }, e("div", { class: "mx-auto flex items-center justify-between" }, e("div", { class: "mr-auto w-[200px] h-[85px]" }, e("eds-logo", { type: this.inverseHeader ? "color-white" : "color", href: this.homeUrl })), e("div", { class: "px-16" }, e("eds-button", { "aria-label": "Close menu", intent: "ghostInverse", icon: "close", onClick: () => this.closeMenu() })))), e("div", { class: "py-16 px-16" }, e("nav", { class: "mt-28 flex flex-col gap-y-8" }, this.parsedLinks.map((n, i) => e("eds-link", { label: n.label, key: i, url: n.url, intent: "tertiary", size: "large", class: "effect-color effect-focus rounded-xs f-heading-02 hover:text-lighter w-fit", onClick: () => this.closeMenu(), icon: "arrow-right" }))), e("eds-block-break", null), e("nav", { class: "mt-28 flex flex-col gap-y-8" }, this.parsedMenuLinks.map((n, i) => e("eds-link", { label: n.label, key: i, url: n.url, intent: "tertiary", size: "large", class: "effect-color effect-focus rounded-xs f-heading-02 hover:text-lighter w-fit", onClick: () => this.closeMenu(), icon: "chevron-right" })))), e("div", { class: "mt-auto" }, e("eds-footer", { social: !0, "extra-class": "bg-darker" })))) : null;
   }
 };
-K.style = G;
-const Q = "", Z = Q, nn = class {
+N.style = D;
+const P = "", Y = P, _ = class {
   constructor(n) {
-    t(this, n), this.toggleMenu = g(this, "toggleMenu", 7), this.homeUrl = "/", this.links = void 0, this.inverseHeader = !1, this.userFeature = !1, this.menuEnabled = !1, this.keycloakUrl = void 0, this.keycloakRealm = void 0, this.keycloakClientId = void 0, this.isMenuOpen = !1, this.isUserMenuOpen = !1, this.isAuthenticated = !1;
+    l(this, n), this.toggleMenu = a(this, "toggleMenu", 7), this.homeUrl = "/", this.links = void 0, this.inverseHeader = !1, this.menuEnabled = !1, this.isMenuOpen = !1, this.isUserMenuOpen = !1, this.isAuthenticated = !1;
   }
   onAuthStatusChanged(n) {
     var i;
@@ -7895,17 +8303,17 @@ const Q = "", Z = Q, nn = class {
     return [];
   }
   render() {
-    return e("header", { key: "b16e5e84ba7565ebf4ea5892a9a1af84fc94769d", class: `flex items-center justify-between relative z-10
-       ${this.inverseHeader ? "text-inverse bg-strongest" : "text-default bg-dark"}` }, e("div", { key: "00206a2714dedfe205151002cc10c430e75814fb", class: "mr-auto w-[200px] h-[85px]" }, e("eds-logo", { key: "25fc6207d61bb4cc06877dd0b15bf56392b50255", type: this.inverseHeader ? "color-white" : "color", href: this.homeUrl })), this.parsedLinks && e("nav", { key: "8d1ee2947db26e5acb556da845fe1b811a8d18b2", class: "absolute left-1/2 top-1/2 grow -translate-x-1/2 -translate-y-1/2 justify-center hidden md:flex" }, e("ul", { key: "5c70e48f3a617a6abe402659b37741e657440cbc", class: "flex gap-x-2" }, this.parsedLinks.map((n) => e("eds-link", { label: n.label, "aria-label": n.label, url: n.url, intent: "ghost", size: "small", icon: n.icon, external: n.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" })))), e("slot", { key: "773b60e90ecfe336fede86ea6e3b0ec2fd10bd72" }), this.userFeature ? e("div", { class: "px-16" }, e("eds-user", { "keycloak-url": this.keycloakUrl, "keycloak-realm": this.keycloakRealm, "keycloak-client-id": this.keycloakClientId })) : null, this.menuEnabled ? e("div", { class: "md:hidden flex overflow-hidden px-16" }, e("eds-button", { "aria-label": "Menu", intent: "ghostInverse", icon: "menu", size: "small", onClick: () => this.handleToggleMenu() })) : null);
+    return e("header", { key: "ce002da29cee5446f64694ba93ec67f89c180ac4", class: `flex items-center justify-between relative z-10
+       ${this.inverseHeader ? "text-inverse bg-strongest" : "text-default bg-dark"}` }, e("div", { key: "579593f3180b27d129fd9ca380d6b74d0efcbd1e", class: "mr-auto w-[200px] h-[85px]" }, e("eds-logo", { key: "c72d87a2ff7cd1ea2b0390cd364e376d1f52c67f", type: this.inverseHeader ? "color-white" : "color", href: this.homeUrl })), this.parsedLinks && e("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" }, e("ul", { key: "390f9b6c6c950719598eec88b4befb4224cb0c03", class: "flex gap-x-2" }, this.parsedLinks.map((n) => e("eds-link", { label: n.label, "aria-label": n.label, url: n.url, intent: "ghost", size: "small", icon: n.icon, external: n.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" })))), e("slot", { key: "bc7b093739cc3058e4eb3d4eddbb0b49856b5710" }), this.menuEnabled ? e("div", { class: "md:hidden flex overflow-hidden px-16" }, e("eds-button", { "aria-label": "Menu", intent: "ghostInverse", icon: "menu", size: "small", onClick: () => this.handleToggleMenu() })) : null);
   }
   get hostEl() {
-    return s(this);
+    return o(this);
   }
 };
-nn.style = Z;
-const En = class {
+_.style = Y;
+const Sn = class {
   constructor(n) {
-    t(this, n), this.TagName = null, this.icon = "arrow-right", this.class = "", this.IconComponent = null;
+    l(this, n), this.TagName = null, this.icon = "arrow-right", this.class = "", this.IconComponent = null;
   }
   componentWillLoad() {
     this.loadIconComponent(this.icon);
@@ -7929,7 +8337,7 @@ const En = class {
       icon: ["iconChanged"]
     };
   }
-}, en = `/*
+}, X = `/*
 1. Make replaced elements \`display: block\` by default. (https://github.com/mozdevs/cssremedy/issues/14)
 2. Add \`vertical-align: middle\` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
    This can trigger a poorly considered lint error in some tools but is included by design.
@@ -8011,34 +8419,36 @@ video {
 
 .opacity-100 {
     opacity: 1;
-}`, rn = en, ln = class {
+}`, V = X, $ = class {
   constructor(n) {
-    t(this, n), this.img = null, this.handleLoad = () => {
+    l(this, n), this.img = null, this.handleLoad = () => {
+      this.loaded = !0, this.showBg = !1;
+    }, this.handleError = () => {
       this.loaded = !0, this.showBg = !1;
     }, this.handleTransitionEnd = () => {
       this.showBg = !1;
-    }, this.src = void 0, this.alt = void 0, this.width = void 0, this.height = void 0, this.srcset = void 0, this.sizes = void 0, this.formats = [], this.lazyload = !0, this.withBg = !0, this.loaded = !this.lazyload, this.showBg = this.withBg;
+    }, this.src = void 0, this.alt = "", this.width = void 0, this.height = void 0, this.srcset = void 0, this.sizes = void 0, this.formats = [], this.lazyload = !0, this.withBg = !0, this.loaded = !this.lazyload, this.showBg = this.withBg;
   }
   componentDidLoad() {
     this.img && this.img.complete && (this.loaded = !0, this.showBg = !1);
   }
   render() {
     const n = {};
-    return this.lazyload && (n.loading = "lazy", n.decoding = "async"), e("div", { key: "fde8a77bb251e3be2ec3a42b8d83f585eae65b2c", class: {
+    return this.lazyload && (n.loading = "lazy", n.decoding = "async"), e("div", { key: "733be8df2b9e3db1b5b13aaa47c16a9c26f345d7", class: {
       "items-center justify-center": !0,
       "effect-bg-pattern": this.lazyload && this.showBg
-    } }, e("picture", { key: "e512cbd9134f14f5418856cf451cddfb93ca1760" }, this.formats.map((i) => e("source", { type: i.type, srcSet: i.srcset, media: i.media, sizes: this.sizes })), e("img", Object.assign({ key: "98339035b8d055d8bb8de654ce1f4ba410ef3865", ref: (i) => this.img = i, class: {
+    } }, e("picture", { key: "3a6a0289bcf8a2851278eb6c6fbe64bfe7004014" }, this.formats.map((i) => e("source", { type: i.type, srcSet: i.srcset, media: i.media, sizes: this.sizes })), e("img", Object.assign({ key: "b5d92e20a28f67a13d926f081b5f85dbd981ff78", ref: (i) => this.img = i, class: {
       "effect-opacity object-cover object-center": !0,
       "opacity-100": this.loaded,
       "opacity-0": !this.loaded
-    }, width: this.width, height: this.height, sizes: this.sizes, src: this.src, srcSet: this.srcset, alt: this.alt }, n, { onLoad: this.handleLoad, onTransitionEnd: this.handleTransitionEnd }))));
+    }, width: this.width, height: this.height, sizes: this.sizes, src: this.src, srcSet: this.srcset, alt: this.alt }, n, { onLoad: this.handleLoad, onError: this.handleError, onTransitionEnd: this.handleTransitionEnd }))));
   }
   get imgElement() {
-    return s(this);
+    return o(this);
   }
 };
-ln.style = rn;
-const tn = `@font-face {
+$.style = V;
+const q = `@font-face {
     font-family: "Inter";
     font-weight: 100 900;
     font-display: swap;
@@ -15201,7 +15611,7 @@ const tn = `@font-face {
     align-items: center;
   }
   
-  `, on = tn, sn = c([
+  `, J = q, G = d([
   "relative inline-flex justify-center items-center py-8 rounded-sm",
   "effect-color effect-focus aria-disabled:text-lightest",
   "aria-disabled:bg-dark aria-disabled:cursor-not-allowed aria-disabled:!border-transparent aria-disabled:after:!border-transparent"
@@ -15318,11 +15728,11 @@ const tn = `@font-face {
     iconSmall: !1,
     size: "small"
   }
-}), dn = class {
+}), Q = class {
   constructor(n) {
-    t(this, n), this.parentContext = null, this.label = void 0, this.intent = void 0, this.icon = void 0, this.iconPos = "right", this.iconSmall = !1, this.size = "small", this.external = !1, this.current = !1, this.download = !1, this.url = void 0, this.ariaLabel = void 0, this.disabled = !1, this.hideLabelOnSmallScreen = !1, this.extraClass = void 0;
+    l(this, n), this.parentContext = null, this.label = void 0, this.intent = void 0, this.icon = void 0, this.iconPos = "right", this.iconSmall = !1, this.size = "small", this.external = !1, this.current = !1, this.download = !1, this.url = void 0, this.ariaLabel = void 0, this.disabled = !1, this.hideLabelOnSmallScreen = !1, this.extraClass = void 0;
   }
-  handleBreadcrumbContext(n) {
+  handleParentContext(n) {
     n.target === this.el && (this.parentContext = n.detail, n.stopPropagation());
   }
   handleClick(n) {
@@ -15331,7 +15741,7 @@ const tn = `@font-face {
       n.preventDefault();
       return;
     }
-    x({
+    c({
       category: "ui-component",
       parentContext: this.parentContext,
       tag: this.el.tagName.toLowerCase(),
@@ -15349,28 +15759,28 @@ const tn = `@font-face {
             `, icon: this.icon })) : null;
   }
   renderRightIcon() {
-    return this.icon && this.iconPos === "right" ? e("span", { class: !this.external && !this.label ? "" : "flex" }, e("eds-icon-wrapper", { class: `
+    return this.icon && this.iconPos === "right" ? e("span", { class: !this.external && !this.label ? "" : "flex ml-4" }, e("eds-icon-wrapper", { class: `
               flex inline-flex items-center justify-center
               ${this.size === "large" ? "h-32 w-32" : "h-20 w-20"}
             `, icon: this.icon })) : null;
   }
   render() {
-    const n = this.disabled ? "span" : "a", i = sn({
+    const n = this.disabled ? "span" : "a", i = G({
       intent: this.intent,
       size: this.getLinkSize(),
       iconSmall: this.iconSmall,
       isActive: this.current
-    }), r = this.hideLabelOnSmallScreen ? "hidden lg:flex" : "";
-    return e(n, { key: "287497bf5ba99fe467ba08d59f65d24204fbecbc", class: `${i || ""} ${this.extraClass || ""}`, href: this.disabled ? void 0 : this.url, target: this.external && !this.disabled ? "_blank" : void 0, rel: this.external && !this.disabled ? "noopener noreferrer" : void 0, "aria-label": this.label || this.ariaLabel || void 0, "aria-disabled": this.disabled ? "true" : null, download: this.download ? "" : void 0, onClick: (l) => this.handleClick(l) }, e("span", { key: "a244b21dffaad38cb149a925df1feb3d78beed03", class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), e("span", { key: "2ef69a91351ea622d6425699b90b45a0bd5989b1", class: r }, this.label), this.renderRightIcon()));
+    }), r = this.ariaLabel || this.label || "link", t = this.hideLabelOnSmallScreen ? "hidden lg:flex" : "";
+    return e(n, { key: "965b2bf54c59752e7ed3cafbc167a8f2d1a2a9b1", class: `${i || ""} ${this.extraClass || ""}`, href: this.disabled ? void 0 : this.url, target: this.external && !this.disabled ? "_blank" : void 0, rel: this.external && !this.disabled ? "noopener noreferrer" : void 0, "aria-label": r, "aria-disabled": this.disabled ? "true" : null, "aria-current": this.current ? "page" : void 0, download: this.download ? "" : void 0, onClick: (s) => this.handleClick(s) }, e("span", { key: "7df72410c98bab3c0ef204e5cd33f1e069976d24", class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), e("span", { key: "208b4fa88695bd8e8ed961d4c7639b117341110c", class: t }, this.label), this.renderRightIcon()));
   }
   get el() {
-    return s(this);
+    return o(this);
   }
 };
-dn.style = on;
-const an = ".w-\\[130px\\]{width:130px}.mr-auto{margin-right:auto}.text-current{color:currentColor}.text-default{color:var(--black)}.text-inverse{color:var(--white)}.h-full{height:100%}.w-full{width:100%}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}@media (min-width: 900px){.lg\\:w-\\[150px\\]{width:150px}}", cn = an, gn = class {
+Q.style = J;
+const K = ".w-\\[130px\\]{width:130px}.mr-auto{margin-right:auto}.text-current{color:currentColor}.text-default{color:var(--black)}.text-inverse{color:var(--white)}.h-full{height:100%}.w-full{width:100%}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}@media (min-width: 900px){.lg\\:w-\\[150px\\]{width:150px}}", Z = K, nn = class {
   constructor(n) {
-    t(this, n), this.href = "/", this.orientation = "horizontal", this.type = void 0;
+    l(this, n), this.href = "/", this.orientation = "horizontal", this.type = void 0, this.label = "Home";
   }
   /**
    * Handles the click event on the logo link.
@@ -15381,7 +15791,7 @@ const an = ".w-\\[130px\\]{width:130px}.mr-auto{margin-right:auto}.text-current{
    * - `action`: The action, set as "click".
    */
   handleClick() {
-    x({
+    c({
       category: "ui-component",
       tag: this.el.tagName.toLowerCase(),
       name: "logo",
@@ -15394,37 +15804,81 @@ const an = ".w-\\[130px\\]{width:130px}.mr-auto{margin-right:auto}.text-current{
   getLogo() {
     const i = {
       horizontal: {
-        color: b,
-        black: f,
-        "color-white": m,
-        white: p,
-        "no-bg": u
+        color: g,
+        black: b,
+        "color-white": h,
+        white: f,
+        "no-bg": m
       },
       vertical: {
-        color: y,
-        black: v,
-        "color-white": w,
-        white: k,
-        "no-bg": z
+        color: p,
+        black: u,
+        "color-white": y,
+        white: v,
+        "no-bg": w
       }
     }[this.orientation];
     if (!i)
-      return b;
+      return g;
     const r = i[this.type];
     return r || i.color;
   }
   render() {
     const n = this.getLogo();
-    return e("a", { key: "3d9435fbc45427865bfa7bacb36bea4c34f08c4e", href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper" }, e("div", { key: "662122c4b687a082c930c034b033e9732ef611be", innerHTML: n }));
+    return e("a", { key: "ee8de4071b0137020341982b4c5cb2c938f1c4df", href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, e("div", { key: "1eb620afbcc5a2a5c6914cc1c91a45ca62d0068c", innerHTML: n }));
   }
   get el() {
-    return s(this);
+    return o(this);
   }
 };
-gn.style = cn;
-const xn = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.f-ui-02-light{font-family:var(--f-ui-02-light-fontFamily);font-weight:var(--f-ui-02-light-fontWeight);font-size:var(--f-ui-02-light-fontSize);line-height:var(--f-ui-02-light-lineHeight);letter-spacing:var(--f-ui-02-light-letterSpacing)}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.mt-12{margin-top:0.75rem}.mt-16{margin-top:1rem}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.gap-4{gap:0.25rem}.effect-color{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.effect-focus{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.hover\\:text-default:hover{color:var(--black)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.rounded-sm{border-radius:8px}", bn = xn, hn = class {
+nn.style = Z;
+const en = ":host{display:inline-block;font-size:2rem}.stars{display:flex;gap:0.25rem;cursor:pointer}.star{color:var(--star-empty-color, #ccc);transition:color 0.2s ease-in-out}.star.filled{color:var(--green-500);}.star:hover,.star.filled:hover{transform:scale(1.2)}.f-heading-02{font-family:var(--f-heading-02-fontFamily);font-weight:var(--f-heading-02-fontWeight);font-size:var(--f-heading-02-fontSize);line-height:var(--f-heading-02-lineHeight);letter-spacing:var(--f-heading-02-letterSpacing)}.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)}.f-heading-06{font-family:var(--f-heading-06-fontFamily);font-weight:var(--f-heading-06-fontWeight);font-size:var(--f-heading-06-fontSize);line-height:var(--f-heading-06-lineHeight);letter-spacing:var(--f-heading-06-letterSpacing)}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.f-ui-04{font-family:var(--f-ui-04-fontFamily);font-weight:var(--f-ui-04-fontWeight);font-size:var(--f-ui-04-fontSize);line-height:var(--f-ui-04-lineHeight);letter-spacing:var(--f-ui-04-letterSpacing)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.mt-4{margin-top:0.25rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}", rn = en, ln = class {
   constructor(n) {
-    t(this, n), this.socialNetworks = [
+    l(this, n), this.ratingChange = a(this, "ratingChange", 7), this.stars = 5, this.label = "Rate your experience", this.textMapping = ["Very Poor", "Poor", "Average", "Good", "Excellent"], this.selectedRating = 0;
+  }
+  /**
+   * Parses the `textMapping` prop into an array of strings.
+   */
+  get parsedMappings() {
+    if (typeof this.textMapping == "object")
+      return this.textMapping;
+    if (typeof this.textMapping == "string")
+      try {
+        return JSON.parse(this.textMapping);
+      } catch {
+        return [];
+      }
+    return [];
+  }
+  /**
+   * Handles the click event on a star.
+   * @param rating - The selected rating value.
+   */
+  handleClick(n) {
+    this.selectedRating = n, this.ratingChange.emit(n);
+  }
+  render() {
+    return e("div", { key: "b613863ad54ae9b381a5741bce4b188eff806ef0", class: "relative w-full flex flex-col" }, e("span", { key: "f35cef9c3691aab73995e2ca6e2554cc19bae837", class: "f-heading-05" }, this.label), e("div", { key: "37082eb4bbadf5c211c197f3f81501d0b0e61404", role: "radiogroup", "aria-label": this.label, class: "stars flex space-x-2" }, Array.from({ length: this.stars }, (n, i) => {
+      const r = i + 1, t = r <= this.selectedRating, s = this.parsedMappings[r - 1] || `Rating ${r}`;
+      return e("eds-button", {
+        label: "★",
+        role: "radio",
+        "aria-checked": t ? "true" : "false",
+        "aria-label": s,
+        onClick: () => this.handleClick(r),
+        tabIndex: this.selectedRating === 0 && i === 0 || t ? 0 : -1,
+        intent: t ? "primary" : "ghost",
+        size: "small",
+        "extra-class": "p-2"
+        // Optional padding or styling for the star button
+      });
+    })), this.selectedRating > 0 && this.parsedMappings[this.selectedRating - 1] && e("span", { key: "61b4b92e476cfa0dd9bf405cb080dedd995ff9c6", class: "f-ui-04 text-lighter mt-4" }, this.parsedMappings[this.selectedRating - 1]));
+  }
+};
+ln.style = rn;
+const tn = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.f-ui-02-light{font-family:var(--f-ui-02-light-fontFamily);font-weight:var(--f-ui-02-light-fontWeight);font-size:var(--f-ui-02-light-fontSize);line-height:var(--f-ui-02-light-lineHeight);letter-spacing:var(--f-ui-02-light-letterSpacing)}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.mt-12{margin-top:0.75rem}.mt-16{margin-top:1rem}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.gap-4{gap:0.25rem}.effect-color{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.effect-focus{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.hover\\:text-default:hover{color:var(--black)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.rounded-sm{border-radius:8px}", on = tn, sn = class {
+  constructor(n) {
+    l(this, n), this.socialNetworks = [
       {
         label: "Twitter",
         url: "https://twitter.com/ebrains_eu",
@@ -15464,11 +15918,59 @@ const xn = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset
    * @returns {JSX.Element} The rendered JSX for the component.
    */
   render() {
-    return e("div", { key: "a6a3e2084eb01def71f6fee67ebe8c5f4f613c89" }, e("p", { key: "43b92e9c33f8abef6070a6a3cd77f7573e2ab454", class: "f-ui-02" }, this.title), e("ul", { key: "c0e0dfdeff373885f62250c8bf4385268410406c", class: "mt-12 flex gap-4" }, this.socialNetworks.map((n, i) => e("li", { key: i }, e("eds-link", { "extra-class": "effect-color effect-focus text-lighter hover:text-default flex items-center justify-center rounded-sm", external: !0, "aria-label": n.label, url: n.url, icon: n.icon, intent: "strong" })))));
+    return e("div", { key: "615a7cb2c26060d2d4cde875291a081b7de12e19" }, e("p", { key: "9e19ad59fcc94508cb60cd4aafa87c3878fb2ebc", class: "f-ui-02" }, this.title), e("ul", { key: "a4811d16447ab148a7c129f188405f3f7050df70", class: "mt-12 flex gap-4" }, this.socialNetworks.map((n, i) => e("li", { key: i }, e("eds-link", { "extra-class": "effect-color effect-focus text-lighter hover:text-default flex items-center justify-center rounded-sm", external: !0, "aria-label": n.label, url: n.url, icon: n.icon, intent: "strong" })))));
+  }
+};
+sn.style = on;
+const dn = ".steps{position:sticky;margin-left:16px;margin-bottom:12px;border-left:1px solid var(--soft-color, #ddd);padding-left:24px;counter-reset:step}.steps h3{counter-increment:step;font-size:var(--f-heading-05-fontSize);font-weight:var(--f-heading-05-fontWeight);line-height:var(--f-heading-05-lineHeight);position:relative}.steps h3::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:1rem;border:1px solid #ccc;background:var(--grey-900);color:#fff;border-radius:50%}.steps h4{counter-increment:step;font-size:1.125rem;font-weight:500;position:relative;margin-top:1em;margin-bottom:1em}.steps h4::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:0.875rem;border:1px solid #ccc;background:#333;color:#fff;border-radius:50%}.steps blockquote{margin-top:16px;margin-bottom:16px;font-style:italic;color:#aaa;padding-left:6px}", an = dn, cn = class {
+  constructor(n) {
+    l(this, n), this.stepClick = a(this, "stepClick", 7), this.handleNext = () => {
+      this.activeStep < this.parsedSteps.length && (this.activeStep = this.activeStep + 1);
+    }, this.handleBack = () => {
+      this.activeStep > 0 && (this.activeStep = this.activeStep - 1);
+    }, this.handleReset = () => {
+      this.activeStep = 0;
+    }, this.steps = [], this.type = "static", this.activeStep = 0;
+  }
+  handleStepClick(n) {
+    this.stepClick.emit(n), this.type === "linear" && (this.activeStep = n);
+  }
+  /**
+   * Parse the JSON string into an array of steps.
+   */
+  get parsedSteps() {
+    if (typeof this.steps == "string")
+      try {
+        const n = this.steps;
+        return JSON.parse(n);
+      } catch {
+        return [];
+      }
+    return this.steps;
+  }
+  render() {
+    const n = this.parsedSteps;
+    return this.type === "linear" ? e("div", null, e("div", { class: "steps" }, n.map((i, r) => e("div", { class: "step mb-28", key: r }, e("h3", { onClick: () => this.handleStepClick(r) }, i.title), this.activeStep === r && e("div", { class: "content" }, e("div", { class: "f-body-02 text-lighter my-16" }, i.content), e("eds-button", { label: r === n.length - 1 ? "Finish" : "Continue", class: "next-btn", onClick: this.handleNext }), e("eds-button", { label: "Back", intent: "ghostInverse", onClick: this.handleBack, disabled: r === 0, "extra-class": r === 0 ? "hidden" : "ml-8 block" }))))), this.activeStep === n.length && e("div", { class: "completed" }, e("eds-alert", { intent: "success", message: "All steps completed - you're finished!" }), e("eds-button", { label: "Start again", onClick: this.handleReset, "extra-class": "mt-4" }))) : e("div", { class: "steps" }, n.map((i, r) => e("div", { class: "step mb-28", key: r }, e("h3", null, i.title), e("div", { class: "content" }, e("div", { class: "f-body-02 text-lighter my-16" }, i.content)))));
   }
 };
-hn.style = bn;
-const fn = c(["relative right-4 bottom-4 w-auto p-12 rounded-lg shadow-md"], {
+cn.style = an;
+const gn = ":host{display:inline-block}.switch-container{display:inline-flex;align-items:center}.switch-label{font-size:14px;margin:0 8px}button.switch{position:relative;display:inline-flex;align-items:center;width:50px;height:26px;border:none;border-radius:13px;background-color:#ccc;padding:0;cursor:pointer;transition:background-color 0.2s}button.switch:focus{outline:none;box-shadow:0 0 0 2px #007aff}button.switch.switch--checked{background-color:var(--green-500)}button.switch.switch--disabled{opacity:0.6;cursor:not-allowed}.switch-handle{position:absolute;width:22px;height:22px;border-radius:50%;background-color:#fff;top:2px;left:2px;transition:transform 0.2s}button.switch.switch--checked .switch-handle{transform:translateX(24px)}", xn = gn, bn = class {
+  constructor(n) {
+    l(this, n), this.change = a(this, "change", 7), this.toggleSwitch = () => {
+      this.disabled || (this.checked = !this.checked, this.change.emit(this.checked));
+    }, this.checked = !1, this.disabled = !1, this.labelOn = "", this.labelOff = "";
+  }
+  render() {
+    const n = this.labelOn || this.labelOff ? this.checked ? this.labelOn : this.labelOff : "Toggle switch";
+    return e("div", { key: "d4c727cbb562921b2bcba269e84f25c359c7061b", class: "switch-container" }, this.labelOff && e("span", { key: "90b18fff27bd21501466deb5879e5fe6ff607043", class: "switch-label switch-label--off" }, this.labelOff), e("button", { key: "8675f5d9f972d3932710fa7f9b28f74f95a83003", type: "button", role: "switch", "aria-checked": this.checked ? "true" : "false", "aria-disabled": this.disabled ? "true" : "false", "aria-label": n, class: {
+      switch: !0,
+      "switch--checked": this.checked,
+      "switch--disabled": this.disabled
+    }, onClick: this.toggleSwitch, disabled: this.disabled }, e("span", { key: "26aa30a01b10419c1665b1fd58b5696a02d1504a", class: "switch-handle" })), this.labelOn && e("span", { key: "3680d67555e9193a97e129c0639b411263e070a8", class: "switch-label switch-label--on" }, this.labelOn));
+  }
+};
+bn.style = xn;
+const hn = d(["relative right-4 bottom-4 w-auto p-12 rounded-lg shadow-md"], {
   variants: {
     intent: {
       default: "bg-dark text-light",
@@ -15480,12 +15982,32 @@ const fn = c(["relative right-4 bottom-4 w-auto p-12 rounded-lg shadow-md"], {
   defaultVariants: {
     intent: "default"
   }
-}), In = class {
+}), Cn = class {
   constructor(n) {
-    t(this, n), this.dismissToast = () => {
+    l(this, n), this.dismissToast = () => {
       this.visible = !1;
     }, this.message = void 0, this.intent = "default", this.duration = 5e3, this.visible = !0;
   }
+  /**
+   * Lifecycle method that sets up the initial panel height and adds a resize event listener
+   * to recalculate height on window resize.
+   */
+  componentDidLoad() {
+    const n = this.el.querySelector("eds-button");
+    this.emitContext(n);
+  }
+  /**
+   * Emits a custom event called `parentContext` for a given button element.
+   */
+  emitContext(n) {
+    const i = new CustomEvent("parentContext", {
+      detail: {
+        componentName: this.el.tagName.toLowerCase(),
+        identifier: null
+      }
+    });
+    n.dispatchEvent(i);
+  }
   connectedCallback() {
     this.dismissTimeout = setTimeout(this.dismissToast, this.duration);
   }
@@ -15495,18 +16017,18 @@ const fn = c(["relative right-4 bottom-4 w-auto p-12 rounded-lg shadow-md"], {
   render() {
     if (!this.visible)
       return null;
-    const n = fn({ intent: this.intent });
-    return e("div", { class: n }, e("div", { class: "flex items-center justify-between gap-4" }, e("p", { class: "f-ui-01" }, this.message), e("eds-button", { intent: "tertiary", icon: "close", "aria-label": "Close Toast", onClick: () => this.dismissToast(), "extra-class": "ml-8" })));
+    const n = hn({ intent: this.intent });
+    return e("div", { class: n, role: "alert", "aria-live": "assertive" }, e("div", { class: "flex items-center justify-between gap-4" }, e("p", { class: "f-ui-01" }, this.message), e("eds-button", { intent: "tertiary", icon: "close", "aria-label": "Close Toast", onClick: () => this.dismissToast(), "extra-class": "ml-8" })));
   }
   get el() {
-    return s(this);
+    return o(this);
   }
-}, mn = ".toast-container{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:50;display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:36rem;}.toast-wrapper{width:100%;padding:0 1rem;}.eds-toast{box-shadow:0px 4px 6px rgba(0, 0, 0, 0.1);border-radius:0.5rem;animation:fade-in 0.3s ease-out;}@keyframes fade-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}", pn = mn, un = class {
+}, fn = ".toast-container{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:50;display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:36rem;}.toast-wrapper{width:100%;padding:0 1rem;}.eds-toast{box-shadow:0px 4px 6px rgba(0, 0, 0, 0.1);border-radius:0.5rem;animation:fade-in 0.3s ease-out;}@keyframes fade-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}", mn = fn, pn = class {
   constructor(n) {
-    t(this, n), this.toastId = 0, this.toasts = [];
+    l(this, n), this.toastId = 0, this.toasts = [];
   }
   connectedCallback() {
-    S.init(this.hostElement), this.hostElement.addEventListener("show-toast", (n) => {
+    k.init(this.hostElement), this.hostElement.addEventListener("show-toast", (n) => {
       const { message: i, intent: r } = n.detail;
       this.addToast(i, r);
     });
@@ -15525,106 +16047,29 @@ const fn = c(["relative right-4 bottom-4 w-auto p-12 rounded-lg shadow-md"], {
     this.toasts = this.toasts.filter((i) => i.id !== n);
   }
   render() {
-    return e("div", { key: "459148404380e386117387f42183e24a069b2de6", class: "toast-container" }, this.toasts.map((n) => e("div", { key: n.id }, e("eds-toast", { message: n.message, intent: n.intent, onClick: () => this.removeToast(n.id) }))));
+    return e("div", { key: "22cb79fd617ca1701fba63d3d4bf04f73ce1ac77", class: "toast-container" }, this.toasts.map((n) => e("div", { key: n.id }, e("eds-toast", { message: n.message, intent: n.intent, onClick: () => this.removeToast(n.id) }))));
   }
   get hostElement() {
-    return s(this);
-  }
-};
-un.style = pn;
-const Ln = class {
-  constructor(n) {
-    t(this, n), this.authStatusChanged = g(this, "authStatusChanged", 7), this.handleLogin = () => {
-      this.authenticated || C();
-    }, this.handleLogout = () => {
-      F(), this.authenticated = !1, this.user = null;
-    }, this.keycloakUrl = void 0, this.keycloakRealm = void 0, this.keycloakClientId = void 0, this.user = null, this.authenticated = !1, this.serverAvailable = !1, this.username = "";
-  }
-  /**
-   * Lifecycle method that runs when the component is about to load.
-   * It initializes authentication by calling the `initAuth` method.
-   */
-  async componentWillLoad() {
-    if (!this.keycloakUrl || !this.keycloakRealm || !this.keycloakClientId) {
-      console.error("Keycloak configuration props are missing.");
-      return;
-    }
-    this.serverAvailable = await E(`${this.keycloakUrl}/realms/${this.keycloakRealm}`), this.serverAvailable && 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 n = {
-        url: this.keycloakUrl,
-        realm: this.keycloakRealm,
-        clientId: this.keycloakClientId
-      };
-      await I(n, !0), L() && (this.user = H(), this.authenticated = !0), this.authStatusChanged.emit({
-        authenticated: this.authenticated,
-        user: this.user
-      });
-    } catch (n) {
-      console.error("Keycloak initialization failed:", n);
-    }
-  }
-  render() {
-    var n;
-    return this.serverAvailable ? e("div", { class: "block" }, this.authenticated ? e("div", { class: "flex items-center" }, e("eds-dropdown", { label: `Welcome, ${(n = this.user) === null || n === void 0 ? void 0 : n.username}`, intent: "tertiary", "aria-label": "User Menu", "dropdown-pos": "right", "dropdown-offset": "false", icon: "chevron-down", class: "text-default" }, e("eds-user-modal", { user: JSON.stringify(this.user), onLogout: this.handleLogout.bind(this) }))) : e("eds-button", { label: "Login", intent: "primary", onClick: this.handleLogin, "extra-class": "text-default" })) : null;
-  }
-  get hostEl() {
-    return s(this);
-  }
-}, Hn = class {
-  constructor(n) {
-    t(this, n), this.user = void 0, this.links = void 0, this.onLogout = void 0, this.parsedUser = {}, this.parsedLinks = [];
-  }
-  parseUserProp(n) {
-    this.parsedUser = typeof n == "string" ? JSON.parse(n) : n;
-  }
-  parseLinksProp(n) {
-    this.parsedLinks = typeof n == "string" ? JSON.parse(n) : n;
-  }
-  componentWillLoad() {
-    this.parseUserProp(this.user), this.parseLinksProp(this.links);
-  }
-  get initials() {
-    var n, i, r, l, o, d, a;
-    return `${((i = (n = this.parsedUser) === null || n === void 0 ? void 0 : n.firstname) === null || i === void 0 ? void 0 : i.charAt(0)) || ""}${((l = (r = this.parsedUser) === null || r === void 0 ? void 0 : r.lastname) === null || l === void 0 ? void 0 : l.charAt(0)) || ""}`.toUpperCase() || ((a = (d = (o = this.parsedUser) === null || o === void 0 ? void 0 : o.fullname) === null || d === void 0 ? void 0 : d.charAt(0)) === null || a === void 0 ? void 0 : a.toUpperCase()) || "";
-  }
-  get hasLogout() {
-    return typeof this.onLogout == "function";
-  }
-  render() {
-    var n, i, r, l, o;
-    return e("div", { key: "ad99ddd7c2710ef90840a5571ab6a161178cacc0", class: "min-w-[280px] p-8" }, e("div", { key: "d1da12f3a965fa7503fb3e00566db0796b803352", class: "flex gap-x-16 pb-16 border-b-2 border-softer" }, e("eds-avatar", { key: "c3d3ca80a9d23cc88f8ee6801b29995138c9b7c6", "first-name": (n = this.parsedUser) === null || n === void 0 ? void 0 : n.firstname, "last-name": (i = this.parsedUser) === null || i === void 0 ? void 0 : i.lastname, initials: this.initials, color: "grey", rounded: !0, "initials-strong": !0 }), e("div", { key: "4efe378b3a9ce76d35e642db150be13d0434db72", class: "max-w-full" }, ((r = this.parsedUser) === null || r === void 0 ? void 0 : r.fullname) && e("p", { key: "1068082a2894e3c3e3f77d1eea923f9c39d8766c", class: "f-ui-01 text-default w-full text-ellipsis" }, this.parsedUser.fullname), ((l = this.parsedUser) === null || l === void 0 ? void 0 : l.username) && e("p", { key: "b86e08b806a37c9957bca7f9ee268303e7ace134", class: "f-ui-03-light text-light mt-4" }, this.parsedUser.username), ((o = this.parsedUser) === null || o === void 0 ? void 0 : o.email) && e("p", { key: "b3514920e1eb4906cb7f7705bfbc986166e84946", class: "f-ui-03-light text-light mt-4" }, this.parsedUser.email))), e("div", { key: "61941fa0a19a19087da886a73d85d7e438d2c0b0", class: "text-default mt-16 flex w-full flex-col gap-y-8" }, e("div", { key: "5ad2be1763726c9d794b78a2593106fd8ba1dc7b", class: "border-softer mb-10 border-b-2 pb-16" }, e("eds-link", { key: "dbe3a9de56bf5ccc26426ddb831f2d1a27a0e6ff", label: "My EBRAINS", "aria-label": "My EBRAINS", url: "https://www.ebrains.eu/dashboard", intent: "primary", "extra-class": "w-full", external: !0 })), e("eds-link", { key: 1, label: "Account Settings", url: "https://iam.ebrains.eu/auth/realms/hbp/account/", intent: "secondary", icon: "arrow-diagonal", external: !0, "extra-class": "w-full" }), this.hasLogout && e("eds-link", { key: "642890827e2fa6735bc616e680dbda481c2c0053", label: "Sign out", intent: "tertiary", "extra-class": "w-full justify-center", onClick: () => this.onLogout && this.onLogout() })));
-  }
-  static get watchers() {
-    return {
-      user: ["parseUserProp"],
-      links: ["parseLinksProp"]
-    };
+    return o(this);
   }
 };
+pn.style = mn;
 export {
-  j as eds_avatar,
-  T as eds_block_break,
-  R as eds_breadcrumb,
-  N as eds_button,
-  $ as eds_dropdown,
-  q as eds_footer,
-  K as eds_fullscreen_menu,
-  nn as eds_header,
-  En as eds_icon_wrapper,
-  ln as eds_img,
-  dn as eds_link,
-  gn as eds_logo,
-  hn as eds_social_networks,
-  In as eds_toast,
-  un as eds_toast_manager,
-  Ln as eds_user,
-  Hn as eds_user_modal
+  F as eds_alert,
+  H as eds_block_break,
+  j as eds_breadcrumb,
+  R as eds_button,
+  T as eds_footer,
+  N as eds_fullscreen_menu,
+  _ as eds_header,
+  Sn as eds_icon_wrapper,
+  $ as eds_img,
+  Q as eds_link,
+  nn as eds_logo,
+  ln as eds_rating,
+  sn as eds_social_networks,
+  cn as eds_steps,
+  bn as eds_switch,
+  Cn as eds_toast,
+  pn as eds_toast_manager
 };