@ebrains/react 0.6.0-alpha.0 → 0.7.0-alpha.0

package/eds-block-break.entry.esm.js

@@ -1,22 +0,0 @@
-import { r as registerInstance, h } from './index.esm2.js';
-import 'react';
-import 'react/jsx-runtime';
-import 'react-dom';
-
-const edsBlockBreakCss = ".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}";
-const EdsBlockBreakStyle0 = edsBlockBreakCss;
-const EdsBlockBreak = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.extraClass = '';
-  }
-  render() {
-    return h("hr", {
-      key: '8cb39dda5d7f909b459390fe7e3f86dfd147ba98',
-      class: `border-softer my-20 inline-block w-full border-t-2 ${this.extraClass}`
-    });
-  }
-};
-EdsBlockBreak.style = EdsBlockBreakStyle0;
-
-export { EdsBlockBreak as eds_block_break };

package/eds-footer.entry.esm.js

@@ -1,102 +0,0 @@
-import { r as registerInstance, h } from './index.esm2.js';
-import 'react';
-import 'react/jsx-runtime';
-import 'react-dom';
-
-const edsFooterCss = "";
-const EdsFooterStyle0 = edsFooterCss;
-const EdsFooter = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /**
-     * Scrolls the page smoothly back to the top.
-     * Called when the "Back to top" button is clicked.
-     * @private
-     */
-    this.backToTop = () => {
-      window.scrollTo({
-        top: 0,
-        behavior: 'smooth'
-      });
-    };
-    this.extraClass = '';
-    this.social = false;
-    this.enableScrollTop = false;
-    this.fundedBy = 'EBRAINS is funded by the Horizon Europe Framework Programme.';
-    this.rightsReserved = `${new Date().getFullYear()} EBRAINS. All rights reserved.`;
-    this.showMatomoNotice = false;
-  }
-  /**
-   * Renders the footer component with optional sections and elements,
-   * including social network links, a Horizon Europe funding acknowledgment, and
-   * legal links such as "Cookies Preferences" and copyright information.
-   *
-   * @returns {JSX.Element} The rendered JSX for the footer component.
-   */
-  render() {
-    return h("footer", {
-      key: '9a7256325386a5072e9f1e391d838bb38458d99f',
-      class: `${this.extraClass} pb-banner`
-    }, this.social ? h("div", {
-      class: "border-softest border-t-2 pt-20 pb-28 md:pt-28"
-    }, h("div", {
-      class: "container pb-20 xl:pb-40 "
-    }, h("div", {
-      class: "grid-layout"
-    }, h("div", {
-      class: "grid-col-span-12 lg:grid-col-span-5"
-    }, h("eds-social-networks", {
-      class: "mt-28"
-    })), h("nav", {
-      "aria-label": "Secondary nav",
-      class: "grid-col-span-12 lg:grid-col-span-6 lg:grid-col-start-7 grid-layout mt-28 gap-y-12 lg:mt-0"
-    })))) : null, h("div", {
-      key: '747d4708e90c13fe9e5aa234eaba182df100fca9',
-      class: `border-softest ${this.social ? 'border-t-2' : ''} pt-20 pb-28 md:pt-28`
-    }, h("div", {
-      key: '3fecf340c536bb64aa98fd04c26c5b47d146630b',
-      class: "container flex flex-wrap items-center gap-20 lg:flex-nowrap"
-    }, h("div", {
-      key: '6b7f167ac50c6aef9c76e56634a7228585c211db',
-      class: "flex items-center gap-x-12"
-    }, h("a", {
-      key: '8e496d31c4b883a867b5f2c6a5fab8a60899470a',
-      target: "_blank",
-      rel: "noopener noreferrer",
-      class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0",
-      href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-2020_en",
-      "aria-label": "Learn about Horizon 2020 funding"
-    }, h("eds-img", {
-      key: 'b3cdfc2cc428951d58fe5ae4f1fe1992fbded7f7',
-      width: 54,
-      height: 41,
-      src: "https://www.ebrains.eu/flags/4x3/eu.svg",
-      alt: "European Union Flag"
-    }))), h("div", {
-      key: '8c3a9f55f07b44ad633b11a1d4faa8396a5ae30a',
-      class: "order-last w-full lg:order-none lg:w-auto"
-    }, h("div", {
-      key: 'c268c107f6be692756d15a8f096e1a86df7bb62a',
-      class: "f-ui-04 text-light"
-    }, h("p", {
-      key: '528014cafcd1b498efa01482934b54c44dd03bd6'
-    }, this.fundedBy), h("div", {
-      key: 'ee5baffcf8f801b7480c8158b30777329699f57f',
-      class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap inline-block"
-    }, h("span", {
-      key: '79e600b799480904f47261be78262f344ada967b',
-      class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline"
-    }, "\u00A9 ", this.rightsReserved)))), h("div", {
-      key: '6bde5399c1044e0d85b71c9fab7e3e4c8b93e224',
-      class: "ml-auto pl-12"
-    }, this.enableScrollTop ? h("eds-button", {
-      "aria-label": "Back to top",
-      intent: "ghostInverse",
-      icon: "chevron-up",
-      onClick: this.backToTop
-    }) : null))));
-  }
-};
-EdsFooter.style = EdsFooterStyle0;
-
-export { EdsFooter as eds_footer };

package/eds-fullscreen-menu.entry.esm.js

@@ -1,143 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './index.esm2.js';
-import 'react';
-import 'react/jsx-runtime';
-import 'react-dom';
-
-const edsFullscreenMenuCss = "";
-const EdsFullscreenMenuStyle0 = edsFullscreenMenuCss;
-const EdsFullscreenMenu = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.menuClose = createEvent(this, "menuClose", 7);
-    this.links = undefined;
-    this.menuLinks = undefined;
-    this.homeUrl = '/';
-    this.inverseHeader = false;
-    this.isMenuOpen = false;
-  }
-  /**
-   * Listens for the toggleMenu event to open or close the menu.
-   * This event is emitted by the eds-header component.
-   */
-  handleToggleMenu(event) {
-    this.isMenuOpen = event.detail; // Set isMenuOpen based on the event payload
-  }
-  /** Opens the menu */
-  openMenu() {
-    this.isMenuOpen = true;
-  }
-  /** Closes the menu */
-  closeMenu() {
-    this.isMenuOpen = false;
-    this.menuClose.emit();
-  }
-  // Lifecycle method to add the resize event listener when component loads
-  componentDidLoad() {
-    window.addEventListener('resize', this.handleResize.bind(this));
-  }
-  // Lifecycle method to remove the resize event listener when component unloads
-  disconnectedCallback() {
-    window.removeEventListener('resize', this.handleResize.bind(this));
-  }
-  // Function to close the menu if screen width is larger than a defined breakpoint (1024px)
-  handleResize() {
-    if (window.innerWidth >= 1024) {
-      this.isMenuOpen = false;
-    }
-  }
-  /**
-   * Parses the `links` prop into an array of link objects.
-   * Returns an empty array if parsing fails or if `links` is not a valid JSON string or object.
-   *
-   * @returns {any[]} Array of parsed link objects
-   */
-  get parsedLinks() {
-    if (typeof this.links === 'object') {
-      return this.links;
-    } else if (typeof this.links === 'string') {
-      try {
-        return JSON.parse(this.links);
-      } catch (e) {
-        // eslint-disable-next-line
-        console.error('Error parsing links prop:', e);
-        return [];
-      }
-    }
-    return [];
-  }
-  /**
-   * Parses the `menuLinks` prop into an array of link objects.
-   * Returns an empty array if parsing fails or if `menuLinks` is not a valid JSON string or object.
-   *
-   * @returns {any[]} Array of parsed menu link objects
-   */
-  get parsedMenuLinks() {
-    if (typeof this.menuLinks === 'object') {
-      return this.menuLinks;
-    } else if (typeof this.menuLinks === 'string') {
-      try {
-        return JSON.parse(this.menuLinks);
-      } catch (e) {
-        // eslint-disable-next-line
-        console.error('Error parsing menuLinks prop:', e);
-        return [];
-      }
-    }
-    return [];
-  }
-  render() {
-    return this.isMenuOpen ? h("div", {
-      class: "eds-full-screen bg-default fixed inset-0 z-[999999] overflow-y-scroll"
-    }, h("div", {
-      class: "flex min-h-full flex-col"
-    }, h("div", {
-      class: `bg-default w-full sticky top-0 ${this.inverseHeader ? 'bg-strongest' : 'bg-default'}`
-    }, h("div", {
-      class: "mx-auto flex items-center justify-between"
-    }, h("div", {
-      class: "mr-auto w-[200px] h-[85px]"
-    }, h("eds-logo", {
-      type: this.inverseHeader ? 'color-white' : 'color',
-      href: this.homeUrl
-    })), h("div", {
-      class: "px-16"
-    }, h("eds-button", {
-      "aria-label": "Close menu",
-      intent: "ghostInverse",
-      icon: "close",
-      onClick: () => this.closeMenu()
-    })))), h("div", {
-      class: "py-16 px-16"
-    }, h("nav", {
-      class: "mt-28 flex flex-col gap-y-8"
-    }, this.parsedLinks.map((link, index) => h("eds-link", {
-      label: link.label,
-      key: index,
-      url: link.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"
-    }))), h("eds-block-break", null), h("nav", {
-      class: "mt-28 flex flex-col gap-y-8"
-    }, this.parsedMenuLinks.map((link, index) => h("eds-link", {
-      label: link.label,
-      key: index,
-      url: link.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"
-    })))), h("div", {
-      class: "mt-auto"
-    }, h("eds-footer", {
-      social: true,
-      "extra-class": "bg-darker"
-    })))) : null;
-  }
-};
-EdsFullscreenMenu.style = EdsFullscreenMenuStyle0;
-
-export { EdsFullscreenMenu as eds_fullscreen_menu };

package/eds-header.entry.esm.js

@@ -1,130 +0,0 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index.esm2.js';
-import 'react';
-import 'react/jsx-runtime';
-import 'react-dom';
-
-const edsHeaderCss = "";
-const EdsHeaderStyle0 = edsHeaderCss;
-const EdsHeader = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.toggleMenu = createEvent(this, "toggleMenu", 7);
-    this.homeUrl = '/';
-    this.links = undefined;
-    this.inverseHeader = false;
-    this.menuEnabled = false;
-    this.isMenuOpen = false;
-    this.isUserMenuOpen = false;
-    this.isAuthenticated = false;
-  }
-  onAuthStatusChanged(event) {
-    var _a;
-    this.isAuthenticated = (_a = event.detail) === null || _a === void 0 ? void 0 : _a.authenticated;
-  }
-  /**
-   * Lifecycle method that runs when the component has fully loaded.
-   * It emits a custom event for each `eds-link` element contained within the breadcrumb.
-   */
-  componentDidLoad() {
-    // Emit context for each eds-link element after the component is fully loaded
-    const links = this.hostEl.querySelectorAll('eds-link');
-    links.forEach(link => {
-      this.emitContext(link);
-    });
-  }
-  /**
-   * Emits a custom event called `parentContext` for a given link element.
-   * This event provides context information about the breadcrumb component.
-   *
-   * @param linkElement - The link element to which the event will be dispatched.
-   */
-  emitContext(linkElement) {
-    const event = new CustomEvent('parentContext', {
-      detail: {
-        componentName: this.hostEl.tagName.toLowerCase(),
-        identifier: null
-      }
-    });
-    linkElement.dispatchEvent(event);
-  }
-  /** Emits an event to open or close the menu */
-  handleToggleMenu() {
-    this.toggleMenu.emit(!this.isMenuOpen);
-  }
-  /**
-   * Toggles the visibility of the user menu.
-   * Opens the user menu if closed, and closes it if open.
-   */
-  toggleUserMenu() {
-    this.isUserMenuOpen = !this.isUserMenuOpen;
-  }
-  /**
-   * Parses the `links` prop into an array of link objects.
-   * Returns an empty array if parsing fails or if `links` is not a valid JSON string or object.
-   *
-   * @returns {any[]} Array of parsed link objects
-   */
-  get parsedLinks() {
-    // If it's already an array, return it immediately.
-    if (Array.isArray(this.links)) {
-      return this.links;
-    }
-    if (typeof this.links === 'object') {
-      return this.links;
-    } else if (typeof this.links === 'string') {
-      try {
-        return JSON.parse(this.links);
-      } catch (e) {
-        // eslint-disable-next-line
-        console.error('Error parsing links prop:', e);
-        return [];
-      }
-    }
-    return [];
-  }
-  render() {
-    return h("header", {
-      key: '8447435914bd3cdf61ce03f2a6bc646fd6b39b01',
-      class: `flex items-center justify-between relative z-10
-       ${this.inverseHeader ? 'text-inverse bg-strongest' : 'text-default bg-dark'}`
-    }, h("div", {
-      key: '2a7a525d9ec5f86437212ab5b6c60c901e1f69a8',
-      class: "mr-auto w-[200px] h-[85px]"
-    }, h("eds-logo", {
-      key: '29381ef7d9f600690a373a09be30b2dea6d5b936',
-      type: this.inverseHeader ? 'color-white' : 'color',
-      href: this.homeUrl
-    })), this.parsedLinks && h("nav", {
-      key: '8085c6dfa6dadce3d7eefb45505e9c9404fd422d',
-      class: "absolute left-1/2 top-1/2 grow -translate-x-1/2 -translate-y-1/2 justify-center hidden md:flex"
-    }, h("ul", {
-      key: 'cb8442be1efc058dc46c283c85e50c58dd627f3e',
-      class: "flex gap-x-2"
-    }, this.parsedLinks.map(link => h("eds-link", {
-      label: link.label,
-      "aria-label": link.label,
-      url: link.url,
-      intent: "ghost",
-      size: "small",
-      icon: link.icon,
-      external: link.external,
-      "extra-class": "after:effect-opacity aria-current-page:bg-darker whitespace-nowrap !text-current after:!border-transparent after:opacity-0 hover:after:!border-transparent hover:after:opacity-100"
-    })))), h("slot", {
-      key: '5d39561f4f43641640cc3f5d01edd35ebde794e3'
-    }), this.menuEnabled ? h("div", {
-      class: "md:hidden flex overflow-hidden px-16"
-    }, h("eds-button", {
-      "aria-label": "Menu",
-      intent: "ghostInverse",
-      icon: "menu",
-      size: "small",
-      onClick: () => this.handleToggleMenu()
-    })) : null);
-  }
-  get hostEl() {
-    return getElement(this);
-  }
-};
-EdsHeader.style = EdsHeaderStyle0;
-
-export { EdsHeader as eds_header };