@ebrains/react 0.9.3-beta → 1.0.0

package/eds-toast-manager.entry.esm.js

@@ -1,9 +1,40 @@
 import { r as registerInstance, h, g as getElement } from './index.esm2.js';
-import { t as toast } from './toastManager-d9eee791.esm.js';
 import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
 
+class ToastManager {
+  constructor() {
+    this.toastManagerElement = null;
+  }
+  /**
+   * Initialize the ToastManager with a reference to the `eds-toast-manager` component.
+   */
+  init(toastManagerElement) {
+    this.toastManagerElement = toastManagerElement;
+  }
+  /**
+   * Display a toast.
+   * @param message - The message to display.
+   * @param intent - The type of the toast ('success', 'error', 'warning', 'default').
+   */
+  show(message, intent = 'default') {
+    if (!this.toastManagerElement) {
+      // eslint-disable-next-line
+      console.error('ToastManager is not initialized. Ensure <eds-toast-manager> is rendered.');
+      return;
+    }
+    const event = new CustomEvent('show-toast', {
+      detail: {
+        message,
+        intent
+      }
+    });
+    this.toastManagerElement.dispatchEvent(event);
+  }
+}
+// Export a singleton instance
+const toast = new ToastManager();
 const edsToastManagerCss = ".toast-container{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:99999;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)}}";
 const EdsToastManagerStyle0 = edsToastManagerCss;
 const EdsToastManager = class {
@@ -43,7 +74,7 @@ const EdsToastManager = class {
   }
   render() {
     return h("div", {
-      key: 'cc2aa94e01507dc8c27e82dfa550af5da6eaba3e',
+      key: 'b86b71e71fa88b56acab6d7060e7b05beec344e1',
       class: "toast-container"
     }, this.toasts.map(t => h("div", {
       key: t.id

package/eds-toast.entry.esm.js

@@ -30,7 +30,7 @@ const EdsToast = class {
     };
     this.message = undefined;
     this.intent = 'default';
-    this.duration = 5000;
+    this.duration = undefined;
     this.visible = true;
   }
   componentDidLoad() {
@@ -53,8 +53,9 @@ const EdsToast = class {
     btnElement.dispatchEvent(event);
   }
   connectedCallback() {
-    // Auto-dismiss the toast after the specified duration
-    this.dismissTimeout = setTimeout(this.dismissToast, this.duration);
+    if (this.duration && this.duration > 0) {
+      this.dismissTimeout = setTimeout(this.dismissToast, this.duration);
+    }
   }
   disconnectedCallback() {
     // Clear the timeout when the component is removed

package/eds-trl.entry.esm.js

@@ -51,10 +51,10 @@ const EdsTrl = class {
       }
     };
     return h("div", {
-      key: '7f2775e107e053cf1e8091f97915e6bc372c3954',
+      key: '8a798c644632d3168af51aa8a0775b7455ab5b52',
       class: "container mx-auto px-4 py-8"
     }, h("eds-table", {
-      key: '9576b1c5dc72335ef0f7158fa4eaa44835acd8db',
+      key: '82a692c0f7e46fe7438a594a7b5c567855c0e308',
       "table-data": JSON.stringify(tableData),
       config: JSON.stringify(tableConfig),
       "rows-per-page": "2",

package/incorrect-use-of-colors.entry.esm.js

@@ -29,20 +29,23 @@ const IncorrectUseOfColors = class {
   }
   render() {
     return h("div", {
-      key: '1cfc3c78012371498476886214e85fbf6e387626',
+      key: '3503dcc0e2d3f5b08eec400e74484e5725d7b4af',
       class: "container"
+    }, h("div", {
+      key: '657857e8826e60c498450326306234c59b4e770b',
+      class: "mb-8"
     }, h("eds-alert", {
-      key: '33449eeae0bca270a82d32de75d5d7c54d8b8c6c',
+      key: '88512240affc65314593f8573b3a13f58fb2806d',
       message: "Note that, each of the four colour tones cannot be mixed in the same composition.",
       intent: "error"
-    }), h("div", {
-      key: 'd436f34bf074c175c6308b822c820604a5e272bc',
+    })), h("div", {
+      key: '8614d445187d2614e5833b8c89c66b178762574e',
       class: "flex"
     }, h("div", {
-      key: '5f839c0f214b774f13af1499fe3e5f8485f959c5',
+      key: '1b36d52dbcbb65e1edb4513899ec898d691193c0',
       class: "w-full"
     }, h("ul", {
-      key: '5cbb81288c0e61431aed523d77f2c6d231c8ce7e',
+      key: '13fb2eaca0ad3fb93487f6c0c976142a18870b4d',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, primary.map(color => h("li", {
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
@@ -52,10 +55,10 @@ const IncorrectUseOfColors = class {
         backgroundColor: color.background
       }
     }))))), h("div", {
-      key: '3622c7c8376208843d3e59c6548e41d9ca8c2b21',
+      key: 'adec93113e4c02168906e1da65f48c20e9b2c7dc',
       class: "w-full"
     }, h("ul", {
-      key: 'd74e34f45e1d377be5f1087a345dee219b1fc5a3',
+      key: 'd0b43589866f53c92084b270afb3571ed2723fc8',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, incorrect.map(color => h("li", {
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"

package/index.esm.js

@@ -1,4 +1,4 @@
-export { E as EdsAccordion, a as EdsAlert, b as EdsAvatar, d as EdsBlockBreak, e as EdsBreadcrumb, f as EdsButton, i as EdsCardGeneric, j as EdsCardSection, k as EdsCodeBlock, l as EdsDropdown, m as EdsFeedback, n as EdsFooter, o as EdsForm, p as EdsFullscreenMenu, q as EdsHeader, s as EdsIconWrapper, t as EdsImg, u as EdsInputField, v as EdsLink, w as EdsLogo, x as EdsMatomoNotice, y as EdsModal, z as EdsPagination, A as EdsProgressBar, B as EdsRating, C as EdsSectionCore, D as EdsSocialNetworks, F as EdsSpinner, G as EdsSplashScreen, I as EdsSteps, J as EdsStepsV2, K as EdsSwitch, L as EdsTable, M as EdsTabs, N as EdsTag, O as EdsTimeline, P as EdsToast, Q as EdsTooltip, R as EdsUser } from './index.esm2.js';
+export { E as EdsAccordion, a as EdsAlert, b as EdsAvatar, d as EdsBlockBreak, e as EdsBreadcrumb, f as EdsButton, i as EdsCardGeneric, j as EdsCardSection, k as EdsCodeBlock, l as EdsDropdown, m as EdsFeedback, n as EdsFooter, o as EdsForm, p as EdsFullscreenMenu, q as EdsGauge, s as EdsHeader, t as EdsIconWrapper, u as EdsImg, v as EdsInputField, w as EdsLink, x as EdsLogo, y as EdsMatomoNotice, z as EdsModal, A as EdsPagination, B as EdsPie, C as EdsProgressBar, D as EdsRating, F as EdsSocialNetworks, G as EdsSpinner, I as EdsSplashScreen, J as EdsSteps, K as EdsStepsV2, L as EdsSwitch, M as EdsTable, N as EdsTabs, O as EdsTag, P as EdsToast, Q as EdsTooltip, R as EdsUser } from './index.esm2.js';
 import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';