@ebrains/react 1.3.0 → 2.0.0

package/svg-repository.entry.esm.js

@@ -37,6 +37,10 @@ import { p as privat } from './private-1c25ff8e.esm.js';
 import { p as pub } from './public-d4d8c585.esm.js';
 import { t as tutorial } from './tutotial-150ee1fd.esm.js';
 import { u as upDonw } from './up-and-down-d747abee.esm.js';
+import { b as bin } from './bin-37cad2f0.esm.js';
+import { s as start } from './start-65126a4f.esm.js';
+import { d as draft } from './draft-dd5dada2.esm.js';
+import { e as edit } from './edit-1dc8d11b.esm.js';
 import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
@@ -284,7 +288,11 @@ const svgs = /*#__PURE__*/Object.freeze({
   thumbsUp: thumbsUp,
   thumbsDown: thumbsDown,
   star: star,
-  external: arrowExternal
+  external: arrowExternal,
+  bin: bin,
+  start: start,
+  draft: draft,
+  edit: edit
 });
 const svgRepositoryCss = ":host,.full-width{display:block;width:100%}";
 const SvgRepositoryStyle0 = svgRepositoryCss;
@@ -317,10 +325,10 @@ const SvgRepository = class {
       }
     };
     return h("div", {
-      key: 'c8c6a714522ff3e122b58c4bb931af7f95d281fa',
+      key: '4f51504595167008271a6dce4d43c2988394fc8a',
       class: "full-width"
     }, h("eds-table", {
-      key: 'f3251327f43c5b18f7677738f37b60ff0e604c3f',
+      key: '3cd08a72250aeb7f98fe1b68349bd7de6acb9079',
       "table-data": JSON.stringify(svgData),
       config: JSON.stringify(tableConfig),
       "rows-per-page": 10,

package/token-list_3.entry.esm.js

@@ -296,7 +296,7 @@ const TokenList = class {
       [this.show]: colors[this.show]
     } : colors;
     return h("section", {
-      key: '0ba9dbb1b98cb398c2eb989391f6e978f9dc21ef',
+      key: '8fab4b610ad73943d9884c9b091f8ae0b85fec02',
       class: "w-full mt-28"
     }, Object.entries(sectionsToDisplay).map(([sectionName, sectionContent]) =>
     // Only render sections that exist in `colors`
@@ -317,10 +317,10 @@ const TokenRadii = class {
   }
   render() {
     return h("section", {
-      key: '0b0ccb9adcfa77ea898828ddbb244e959f93e2e4',
+      key: '990ac7f9b888a50dfefb06d0999c845796e82db4',
       class: "w-full mt-28"
     }, h("ul", {
-      key: '94f17ad36ec9fcc47b645e323c7e5a8f3e040dda',
+      key: '447642ed7c23039532564cf640994c1ac9a1d1de',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(radii).map(([key, value]) => h("li", {
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
@@ -358,10 +358,10 @@ const TokenShadows = class {
   }
   render() {
     return h("section", {
-      key: '18d2b4cdcc3b6d6ce8864a9c36e869be9b9e5cb4',
+      key: '481c1eed906cfd2ec0a071fde52bd284dc689583',
       class: "w-full mt-28"
     }, h("ul", {
-      key: '63e646788009d3315d2f4e03f1a780811486d9a0',
+      key: 'bf3c4068320755df5df76fd40a5f533c2814e398',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(shadowTokens).map(([category, tokens]) => Object.entries(tokens).map(([key, value]) => h("li", {
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col items-center mt-16"

package/token-ratios.entry.esm.js

@@ -17,15 +17,15 @@ const TokenRatios = class {
   }
   render() {
     return h("section", {
-      key: '0fb029d34cba573e04e15030b3fdd1497ac9974e',
+      key: 'be577f9c398a29f5bd996a68d102017488f8ac17',
       class: "w-full"
     }, h("eds-section-core", {
-      key: 'd6914b95ef74d590d58b0c90600fc44f5d9d6678',
+      key: '291b8f1692e0ba050c0871af65429db95733990c',
       tag: "div",
       "section-title": "Aspect Ratios",
       "heading-level": "h3"
     }, h("ul", {
-      key: 'f08511f07380707795b810fd0f34c1acdc47d37d',
+      key: '2ac59025091444b8e14b5106d8909c54fa8227aa',
       class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(ratios).map(([key, value]) => h("li", {
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"

package/token-spacing.entry.esm.js

@@ -9,82 +9,82 @@ const TokenSpacing = class {
   }
   render() {
     return h("div", {
-      key: '144e643ff3f26d09b932b3bfa2086164134728c0',
+      key: 'ccc58496f0918a9da7f1d4412391613f3f568cc9',
       class: "w-full"
     }, h("ul", {
-      key: 'fabddc807bcd5cefbfced6391117e9eb065ffff0',
+      key: 'e5a8d47319a9c994e7755d3576d71b634ab20063',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'cc0fba19927a1c3ad33008dc1087ee75e0c9fe2d',
+      key: '3d0a29e2c91d351ab116ce416e00c42590d035b3',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '328054d7cfe6a0678e9e592b91dba6a8524c2039',
+      key: 'd2d85017b45172a0b0b092de400d9151ef539ef8',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: 'e50e3533e36feb7021cac8ac10cc9a05e7f24c0a',
+      key: '88de94aaba4d635cc525a67542b5d472cd896c5d',
       class: "spacing-sample m-16 bg-strong"
     }, h("span", {
-      key: '87165037495881426a3c9848953e049ec7e96b7a',
+      key: 'b59a5fa9df2d4083fa06c9a258ec5ba5ccf60c0a',
       class: "f-body-01 text-inverse"
     }, "Margin: 1rem / m-16")))), h("li", {
-      key: 'a6a98204655e53b6ef9ce9f2fd90b561c79c185d',
+      key: '70767120c9cd4be53f96f375fd329703a963b63a',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '385ae898ce1f1f96cbb236ded619a05d8326c304',
+      key: '855d6bacf1b1423485fbf4a6d57eaae41a7a1444',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: '4e6c11ae90e22efa73fb6c9481ee2c1511365394',
+      key: '7857867bba76856db7530bacd73f142a2b503c51',
       class: "spacing-sample ml-64 bg-strong"
     }, h("span", {
-      key: 'a13a1886b5019ca48a19d24ba03b3caa1c51bc3f',
+      key: '14b4241fc260b9d6b690dbd141098dc61a5eded9',
       class: "f-body-01 text-inverse"
     }, "Margin Left: 4rem / ml-64")))), h("li", {
-      key: '7b2f325ced5281668e6ece98d56caf864b34c7e8',
+      key: 'fa5b994aab19f80b3fa26393844b0bed46ecfa64',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '3e1a69b9983bc993686426ec84dd70b4803538a6',
+      key: '3c600983badcd59dcf5735e9a4c42c87a306236b',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: '66804ce21771e53210bc385ac8cefce4c554d188',
+      key: '77abcf6391bc3fe5f798a7837e12e9f3581213d0',
       class: "spacing-sample mt-32 bg-strong"
     }, h("span", {
-      key: '91cee3a9cf00777f1d2b4cde4ce484fcddef52f5',
+      key: 'd4626346b81f99c4690853d00c097d523616db1f',
       class: "f-body-01 text-inverse"
     }, "Margin Top: 2rem / mt-32")))), h("li", {
-      key: '9d9074db464e7ecc36977c69b0fdd053e8025dec',
+      key: '2ce80fc1b53afa0e157f4b185ae70f16779b9f3f',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: 'e6a2d7d1ded9c92ca41d211dca3dcca9f03ad707',
+      key: '95f69eac2055d60ae42808fa09f4f6a68bdff4f6',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: 'c87e88d711ec5298525f1d901958a035837b3db0',
+      key: 'e553f7c58b018cba77b7141be6142d3c7b34194a',
       class: "spacing-sample p-32 bg-strong"
     }, h("span", {
-      key: '6276cb3c19a8fd1262c5002e682099f13d38b512',
+      key: '13450e5d8c07cbeb640e0b3aea1e526365f0f743',
       class: "f-body-01 text-inverse"
     }, "Padding: 2rem / p-32")))), h("li", {
-      key: 'c8614add23a4802ccbb3086c74ac2871ad0a0340',
+      key: 'dce557ae08a4800fd5d98c91b5675d4839da622f',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '68b73e788596e32a696e012d08ec11cf479a5d45',
+      key: '9a134b12e3829b5529921ee24ba095231ea9a70f',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: 'b057f25cdeda7c6cc3f0ce21e199d84d90bb0bfa',
+      key: '2f30c7339974f96fa881b43f8b7ec9a018c2f372',
       class: "spacing-sample pt-32 bg-strong"
     }, h("span", {
-      key: 'a72e385bdaed3c6c8a06fb7951f6b326eb8f2e4f',
+      key: '663a2b9a903effbd5eb1988d6803934c41a26b93',
       class: "f-body-01 text-inverse"
     }, "Padding Top: 2rem / pt-32")))), h("li", {
-      key: '11be77901177c2372b29076072dd7544f7371aa4',
+      key: '363143700c339ab934b466ef9f84f257be3adbbc',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '5606d88389c6aaa16a9941fefe2bc34e881b22a3',
+      key: 'e72006b92c553dfb7c3df21cbbea3a7234cbf725',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: '1341d44c62567c8b5078046644cda8ddcec59809',
+      key: '251e68c910ee1d0485d630fde091e6790183f4f9',
       class: "spacing-sample pl-32 bg-strong"
     }, h("span", {
-      key: 'b9208571277fced609ea55a113a30dc7a424c2a8',
+      key: 'cf2f10404629bf2e7ab10d51b2917361cf93279b',
       class: "f-body-01 text-inverse"
     }, "Padding Left: 2rem / pl-32"))))));
   }

package/token-typography.entry.esm.js

@@ -202,10 +202,10 @@ const TokenTypography = class {
   }
   render() {
     return h("section", {
-      key: 'b831c9707b00d17768f585e2015de8a7289b11d2',
+      key: '62bc664d442830ac40bc6aae9a5dbd38f5d18f05',
       class: "w-full"
     }, h("ul", {
-      key: '472e46f2c903597d24e8f24cf28b6f475c7d7a82',
+      key: 'e8a97077420f77631e75ec99e14b22fd77a36c11',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(typography.typesets).filter(([typeKey]) => typeKey !== 'displays') // Exclude "displays"
     .flatMap(([typeKey, typeValues]) => Object.entries(typeValues).map(([size, style]) => h("li", {

package/eds-rating.entry.esm.js

@@ -1,79 +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 edsRatingCss = ":host{display:inline-block}.block{display:block}.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)}.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}.my-4{margin-top:0.25rem;margin-bottom:0.25rem}.my-8{margin-top:0.5rem;margin-bottom:0.5rem}.my-16{margin-top:1rem;margin-bottom:1rem}.my-20{margin-top:1.25rem;margin-bottom:1.25rem}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.0625rem * var(--tw-space-x-reverse));margin-left:calc(0.0625rem * calc(1 - var(--tw-space-x-reverse)))}";
-const EdsRatingStyle0 = edsRatingCss;
-const EdsRating = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.rating = createEvent(this, "rating", 7);
-    this.ratingType = 'star';
-    this.ratingCount = 5;
-    this.selectedRating = 0;
-  }
-  /**
-   * Lifecycle method that runs when the component has fully loaded.
-   * It emits a custom event for each `eds-button` element contained within the breadcrumb.
-   */
-  componentDidLoad() {
-    const btns = this.el.shadowRoot.querySelectorAll('eds-button');
-    btns.forEach(btn => {
-      this.emitContext(btn);
-    });
-  }
-  /**
-   * Emits a custom event called `parentContext` for a given link element.
-   * This event provides context information about the breadcrumb component.
-   *
-   * @param btnElement - The link element to which the event will be dispatched.
-   */
-  emitContext(btnElement) {
-    const event = new CustomEvent('parentContext', {
-      detail: {
-        componentName: this.el.tagName.toLowerCase(),
-        identifier: this.selectedRating
-      }
-    });
-    btnElement.dispatchEvent(event);
-  }
-  /**
-   * Handles the click event on a star.
-   * @param rating - The selected rating value.
-   */
-  handleClick(rating) {
-    this.selectedRating = rating;
-    this.rating.emit(rating);
-  }
-  render() {
-    return h("div", {
-      key: 'ece1af90e2dea3f69dfef822d7f4f55f76866cbd',
-      role: "radiogroup",
-      class: "stars flex space-x-1 my-8"
-    }, Array.from({
-      length: this.ratingCount
-    }, (_, index) => {
-      const starRating = index + 1;
-      const isSelected = starRating <= this.selectedRating;
-      // Use the mapping text if available; otherwise, fall back to a generic label.
-      return h("eds-button", {
-        icon: this.ratingType,
-        role: "radio",
-        "aria-checked": isSelected ? 'true' : 'false',
-        "aria-label": this.ratingType,
-        onClick: () => this.handleClick(starRating),
-        tabIndex: this.selectedRating === 0 && index === 0 ? 0 : isSelected ? 0 : -1,
-        intent: isSelected ? 'primary' : 'ghost',
-        size: "large",
-        "extra-class": "p-2" // Optional padding or styling for the star button
-      });
-    }));
-  }
-  get el() {
-    return getElement(this);
-  }
-};
-EdsRating.style = EdsRatingStyle0;
-
-export { EdsRating as eds_rating };

package/eds-toast.entry.esm.js

@@ -1,93 +0,0 @@
-import { r as registerInstance, h, g as getElement } from './index.esm2.js';
-import { c as cva } from './index-39c58238.esm.js';
-import 'react';
-import 'react/jsx-runtime';
-import 'react-dom';
-
-const edsToastCss = ".relative{position:relative}.right-4{right:0.25rem}.bottom-4{bottom:0.25rem}.w-auto{width:auto}.flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-4{gap:0.25rem}.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)}.ml-8{margin-left:0.5rem}.p-12{padding:0.75rem}.rounded-lg{border-radius:16px}.shadow-md{--tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),\n        0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),\n        var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.bg-dark{background-color:var(--grey-300)}.bg-success{background-color:var(--green-200)}.bg-error{background-color:var(--red-200)}.bg-warning{background-color:var(--yellow-200)}.text-light{color:var(--grey-700)}.text-current{color:currentColor}.text-default{color:var(--black)}";
-const EdsToastStyle0 = edsToastCss;
-const toastStyles = cva(['relative right-4 bottom-4 w-auto p-12 rounded-lg shadow-md'], {
-  variants: {
-    intent: {
-      default: 'bg-dark text-light',
-      success: 'bg-success text-dark',
-      error: 'bg-error text-light',
-      warning: 'bg-warning text-dark'
-    }
-  },
-  defaultVariants: {
-    intent: 'default'
-  }
-});
-const EdsToast = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /**
-     * Dismisses the toast.
-     */
-    this.dismissToast = () => {
-      this.visible = false;
-    };
-    this.message = undefined;
-    this.intent = 'default';
-    this.duration = undefined;
-    this.visible = true;
-  }
-  componentDidLoad() {
-    const btn = this.el.shadowRoot.querySelector('eds-button');
-    this.emitContext(btn);
-  }
-  /**
-   * Emits a custom event called `parentContext` for a given button element.
-   * This event provides context information about the toast component.
-   *
-   * @param btnElement - The link element to which the event will be dispatched.
-   */
-  emitContext(btnElement) {
-    const event = new CustomEvent('parentContext', {
-      detail: {
-        componentName: this.el.tagName.toLowerCase(),
-        identifier: null
-      }
-    });
-    btnElement.dispatchEvent(event);
-  }
-  connectedCallback() {
-    if (this.duration && this.duration > 0) {
-      this.dismissTimeout = setTimeout(this.dismissToast, this.duration);
-    }
-  }
-  disconnectedCallback() {
-    // Clear the timeout when the component is removed
-    clearTimeout(this.dismissTimeout);
-  }
-  render() {
-    if (!this.visible) {
-      return null;
-    }
-    const classes = toastStyles({
-      intent: this.intent
-    });
-    return h("div", {
-      class: classes,
-      role: "alert",
-      "aria-live": "assertive"
-    }, h("div", {
-      class: "flex items-center justify-between gap-4"
-    }, h("span", {
-      class: "f-ui-01"
-    }, this.message), h("eds-button", {
-      intent: "tertiary",
-      icon: "close",
-      "aria-label": "Close Toast",
-      onClick: () => this.dismissToast(),
-      "extra-class": "ml-8"
-    })));
-  }
-  get el() {
-    return getElement(this);
-  }
-};
-EdsToast.style = EdsToastStyle0;
-
-export { EdsToast as eds_toast };