@ebrains/react 0.7.0-alpha.0 → 0.9.0-beta

package/eds-breadcrumb.entry.esm.js

@@ -18,8 +18,11 @@ const EdsBreadcrumb = class {
         this.maxVisibleItems = 3;
         this.isSmallScreen = true;
       } else if (width <= 1024) {
-        this.maxVisibleItems = 4;
+        this.maxVisibleItems = 3;
         this.isSmallScreen = true;
+      } else if (width <= 2200) {
+        this.maxVisibleItems = 4;
+        this.isSmallScreen = false;
       } else {
         this.maxVisibleItems = 6;
         this.isSmallScreen = false;
@@ -123,10 +126,10 @@ const EdsBreadcrumb = class {
   render() {
     const itemsToRender = this.getTruncatedItems();
     return h("nav", {
-      key: '02537ec4208124f8a5ba564f7487f6fad552f7da',
+      key: '75bb5629a10de2a2a7bd0b2bbef04e5f699f5fe2',
       "aria-label": "Breadcrumb"
     }, h("ol", {
-      key: 'ac6e2ecd59a8ddef52e004d95fbb492f78a9b248',
+      key: '7a5cc115b70d60bc878aa3d865802662f30948c1',
       class: "flex items-center space-x-2"
     }, itemsToRender.map((item, index) => {
       const isLast = index === itemsToRender.length - 1;

package/{eds-avatar_4.entry.esm.js → eds-card-desc_3.entry.esm.js}

@@ -1,69 +1,9 @@
 import { r as registerInstance, h } from './index.esm2.js';
-import { g as gradientBGColorVariants } from './color-2554aad6.esm.js';
 import { c as cva } from './index-39c58238.esm.js';
 import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
 
-const edsAvatarCss = ".border-inside {\n    position: relative;\n\n    &::after {\n        pointer-events: none;\n    }\n\n    &::after {\n        position: absolute;\n    }\n\n    &::after {\n        inset: 0rem;\n    }\n\n    &::after {\n        z-index: 1;\n    }\n\n    &::after {\n        border-radius: 8px;\n    }\n\n    &::after {\n        border-width: 1px;\n    }\n\n    &::after {\n        border-width: 2px;\n    }\n\n    &::after {\n        border: 2px solid rgba(0, 0, 0, .1);\n    }\n\n    &::after {\n        content: '';\n    }\n}\n\n.border-inside-pill {\n    &::after {\n        border-radius: 100px;\n    }\n\n    &::after {\n        content: '';\n    }\n}\n\n.border-inside-inverse {\n    &::after {\n        border: 2px solid rgba(255, 255, 255, 0.3);\n    }\n\n    &::after {\n        content: '';\n    }\n}\n\n.aspect-1x1 {\n    aspect-ratio: 1/1;\n}\n\n.flex {\n    display: flex;\n}\n\n.inline-flex {\n    display: inline-flex;\n}\n\n.items-center {\n    align-items: center;\n}\n\n.justify-center {\n    justify-content: center;\n}\n\n.overflow-hidden {\n    overflow: hidden;\n}\n\n.px-4 {\n    padding-left: 0.25rem;\n    padding-right: 0.25rem;\n}\n\n.rounded-pill {\n    border-radius: 100px;\n}\n\n.rounded-sm {\n    border-radius: 8px;\n}\n\n.rounded-xs {\n    border-radius: 4px;\n}\n\n\n.bg-dark {\n    background-color: var(--grey-300);\n}\n\n.bg-darker {\n    background-color: var(--grey-400);\n}\n\n.bg-stronger {\n    background-color: var(--grey-900);\n}\n\n.bg-strongest {\n    background-color: var(--black);\n}\n\n.text-accent {\n    color: var(--green-500);\n}\n\n.text-default {\n    color: var(--black);\n}\n\n.\\!no-underline {\n    text-decoration-line: none !important;\n}\n\n.f-ui-01 {\n    font-family: var(--f-ui-01-fontFamily);\n    font-weight: var(--f-ui-01-fontWeight);\n    font-size: var(--f-ui-01-fontSize);\n    line-height: var(--f-ui-01-lineHeight);\n    letter-spacing: var(--f-ui-01-letterSpacing);\n}\n\n.w-32 {\n    width: 2rem;\n}\n\n.w-44 {\n    width: 2.75rem;\n}\n\n.w-\\[54px\\] {\n    width: 54px;\n}";
-const EdsAvatarStyle0 = edsAvatarCss;
-const EdsAvatar = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.firstName = 'User';
-    this.lastName = 'Avatar';
-    this.picture = undefined;
-    this.initials = undefined;
-    this.color = undefined;
-    this.rounded = false;
-    this.initialsStrong = false;
-  }
-  /**
-   * 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] || '';
-    } else if (this.firstName && this.lastName) {
-      return `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`.toUpperCase();
-    }
-    return undefined;
-  }
-  /**
-   * 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 ? gradientBGColorVariants({
-      color: this.color,
-      direction: 'top',
-      pseudo: false
-    }) : !this.picture ? 'bg-strongest text-accent' : ''].join(' ');
-  }
-  /**
-   * 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 h("div", {
-      key: '47ee5ffd12c0f90c536dea77b3ffa9120d67f37f',
-      class: this.containerClasses
-    }, this.picture ? h("eds-img", {
-      src: this.picture,
-      width: 54,
-      height: 54,
-      sizes: "120px",
-      alt: `${this.firstName} ${this.lastName}`,
-      lazyload: true,
-      withBg: true
-    }) : h("abbr", {
-      title: this.computedInitials || `${this.firstName} ${this.lastName}`,
-      class: "!no-underline f-ui-01"
-    }, this.computedInitials));
-  }
-};
-EdsAvatar.style = EdsAvatarStyle0;
 const edsCardDescCss = ".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-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.text-light{color:var(--grey-700)}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}";
 const EdsCardDescStyle0 = edsCardDescCss;
 const EdsCardDesc = class {
@@ -79,10 +19,10 @@ const EdsCardDesc = class {
   }
   render() {
     return h("p", {
-      key: '71495cbd6ef4e7d66c4c22a37f8120624ecf57fb',
+      key: '96ba520be4ef9acf871a6e992d5ea74aaf17c962',
       class: `text-light ${this.descClass}`
     }, h("span", {
-      key: '8708178f7b48cc1f31aac749f50fe92b72c39ab8',
+      key: '951358bd0c992426175e3c1b3c580f2f9be4027f',
       class: this.getTruncateClass()
     }, this.description));
   }
@@ -131,10 +71,10 @@ const EdsCardTitle = class {
     //const Tag = this.getTag();
     const Heading = this.headingLevel;
     return h(Heading, {
-      key: 'bb97dc6dd53adda14ef251b2ec32952791438986',
+      key: '57ce97f35ee52623d32fac0b6b1a576ca8b5aa70',
       class: this.getTitleClass()
     }, h("a", {
-      key: '37b6ac0668257d27fb3f03a6225a2d48e1fd1f79',
+      key: '60fb313d2b8753974658f73aaddd359a63548a79',
       class: "break-words after:absolute after:inset-0 after:z-10 after:content-[''] focus:outline-none",
       href: this.url,
       target: this.externalLink ? '_blank' : undefined,
@@ -175,11 +115,11 @@ const EdsTag = class {
       intent: this.intent
     });
     return h("span", {
-      key: '2f4b0011094538aaa0a7cc855eadc1b39c9dc028',
+      key: '55a6039b040436e5dded9aaf1007668b97091ba3',
       class: classes
     }, this.label);
   }
 };
 EdsTag.style = EdsTagStyle0;
 
-export { EdsAvatar as eds_avatar, EdsCardDesc as eds_card_desc, EdsCardTitle as eds_card_title, EdsTag as eds_tag };
+export { EdsCardDesc as eds_card_desc, EdsCardTitle as eds_card_title, EdsTag as eds_tag };

package/eds-card-generic.entry.esm.js

@@ -5,7 +5,7 @@ import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
 
-const edsCardGenericCss = ".h-auto{height:auto}.h-full{height:100%}.\\!min-h-20{min-height:1.25rem !important}.min-h-120{min-height:120px}.min-h-156{min-height:156px}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:shadow-hover:hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.border-soft{border-color:rgba(0, 0, 0, .15 )}.border-softer{border:2px solid rgba(0, 0, 0, .1 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-12{padding:0.75rem}.p-16{padding:1rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.gap-y-4{row-gap:0.25rem}.order-first{order:-9999}.mb-10{margin-bottom:0.625rem}.mb-12{margin-bottom:0.75rem}";
+const edsCardGenericCss = ".h-auto{height:auto}.h-full{height:100%}.\\!min-h-20{min-height:1.25rem !important}.min-h-120{min-height:120px}.min-h-156{min-height:156px}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:shadow-hover:hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.border-soft{border-color:rgba(0, 0, 0, .15)}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-12{padding:0.75rem}.p-16{padding:1rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.gap-y-4{row-gap:0.25rem}.order-first{order:-9999}.mb-10{margin-bottom:0.625rem}.mb-12{margin-bottom:0.75rem}";
 const EdsCardGenericStyle0 = edsCardGenericCss;
 const EdsCardGeneric = class {
   constructor(hostRef) {

package/eds-card-project.entry.esm.js

@@ -50,38 +50,38 @@ const EdsCardProject = class {
     }) : 'bg-default', this.bgOnHover && this.color ? 'effect-background bg-default focus-within:bg-transparent hover:bg-transparent' : 'effect-background hover:bg-default', this.vertical ? 'flex-col gap-y-16' : 'flex-col gap-x-16 gap-y-12 lg:flex-row'].join(' ');
     const imageClasses = this.vertical ? '' : 'max-w-120 @md:max-w-192 order-first w-full lg:order-last';
     return h("article", {
-      key: '98c5dbd033ec05d08965559e00f32d9fe18698ef',
+      key: '067a30c2b0860d71dc13d1d3d875a7e288de842b',
       class: cardClasses,
       onClick: event => this.handleClick(event)
     }, h("div", {
-      key: 'e083c43e38c3c24fcd996a90267f7cd92d3651b3',
+      key: '3e2e62ecc9ad5973c359b7bbceefd8c2ac682d0b',
       class: `flex grow flex-col ${this.vertical ? 'min-h-156' : ''}`
     }, h("div", {
-      key: '37de1e46023b533fd8595a3077c4e68c11fb01af',
+      key: 'e07a666f80d6955b5cf16c18a999a756dcfe10f0',
       class: "lg:max-w-[720px]"
     }, h("eds-card-title", {
-      key: 'ee31ae2804d2c17c82e8f4c0c3269ac8254331df',
+      key: 'b1ef62c888e9d69f1146fc218a7012015ddc78e1',
       "heading-level": this.headingLevel,
       titleClass: this.image ? 'f-ui-01' : undefined,
       "card-title": this.titleProject,
       url: this.url
     }), this.editorialTitle && h("span", {
-      key: 'c6f74ba9b5b522f713e25d3339f541efa68cdddd',
+      key: '79cf1af876a0a358a9f65036a1ff1c4944604435',
       class: `block ${this.vertical ? 'f-ui-02' : 'mt-4 f-heading-06'}`
     }, this.editorialTitle)), this.categoryTitle && h("div", {
-      key: 'ab18e55046777cf4a4f58ebd057641db9b9e0328',
+      key: 'ce7e525b0bdbbc94d3e2ec8055c692be9d521042',
       class: "mt-auto flex items-center gap-x-12 pt-12"
     }, ((_a = this.categoryTitle) === null || _a === void 0 ? void 0 : _a.length) && h("eds-tag", {
-      key: '3714ee86a74dce7f33a8f953fd726db349ba9271',
+      key: '23e3527a3772970642dcb07a4abc381415132155',
       label: this.categoryTitle
     }))), this.parsedImage && h("div", {
-      key: '2818d15f7ab671b7b2dfb34ec3085b390150f38d',
+      key: '178ef2273b2506070c045c3f2e7a287d4b175414',
       class: imageClasses
     }, h("div", {
-      key: '5166feef3674631298f699449b956655f38f0db9',
+      key: 'f77fb56cd2ed1bdcafd07db9adcf0f7b6a44cdb7',
       class: "aspect-1x1 w-full"
     }, h("eds-img", Object.assign({
-      key: '86555a43491da5b2aa3b287e539e603a2c2adaf3',
+      key: 'b9734f48ab685280b801cfb75cc96f5aa109ca6f',
       sizes: this.vertical ? this.parsedImage.sizes || '' : '192px'
     }, this.parsedImage)))));
   }

package/eds-card-tags.entry.esm.js

@@ -13,7 +13,7 @@ const EdsCardTags = class {
   }
   render() {
     return h("div", {
-      key: '272d53abb9be9086881cb2f8e99f7fb7aae1bb59',
+      key: 'df8937e32907eb978f27565d04f7ca56f2485c87',
       class: "flex flex-wrap gap-y-4"
     }, this.tags.map((tag, index) => h("eds-tag", {
       key: index,

package/eds-card-tool.entry.esm.js

@@ -62,11 +62,11 @@ const EdsCardTool = class {
   }
   render() {
     return h("article", {
-      key: 'da61b384e966b148cd1f77eec59671bc4d92e259',
+      key: '5ecce6667d066e78586f795ab260bed569434c4f',
       class: `${this.el.tagName.toLowerCase()} ${this.articleClasses()}`,
       onClick: () => this.handleClick()
     }, h("eds-card-title", {
-      key: '00702d032bc25f52b2a2c98255ceb60a1d314f4d',
+      key: 'a6ff863ade669db7494c763d563809dbfddb3f2c',
       "heading-level": this.headingLevel,
       titleClass: this.image ? 'f-ui-01' : undefined,
       "card-title": this.cardTitle,
@@ -74,7 +74,7 @@ const EdsCardTool = class {
       "external-link": this.external,
       hierarchy: this.hierarchy
     }), this.description && h("eds-card-desc", {
-      key: 'd2b135ed422fb64f142af71330dc666e2f0c2b1f',
+      key: '6f5328fba79a564e6e0d737b2d64a31e50ea6434',
       class: "mt-8",
       "truncate-lines": "3",
       description: this.description
@@ -88,7 +88,7 @@ const EdsCardTool = class {
       picture: this.avatar,
       initials: this.shortAbbreviation
     }) : null, h("div", {
-      key: '54111e90175754cb0c1f2eb339e86926914ca0e7',
+      key: 'b1a42a1db9274ebf1098143d56e1ad8a08825c4c',
       class: "flex flex-wrap gap-y-4"
     }, this.parsedTags.map((tag, index) => h("eds-tag", {
       key: index,

package/eds-card-wrapper.entry.esm.js

@@ -19,15 +19,15 @@ const EdsCardWrapper = class {
   render() {
     const articleClasses = [this.tiny ? 'min-h-120' : 'min-h-156', this.withBg ? 'bg-inverse' : 'bg-default', this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '', 'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'].join(' ');
     return h("article", {
-      key: 'f21cc9703011026652765b399e2b87b1ef80d220',
+      key: 'b860e65a1a943216793a5ce2f5a08d01249fc671',
       class: articleClasses
     }, h("slot", {
-      key: '9a37adad73d2d49edcc9ca9222d5b188202c5612'
+      key: '3ea351da205f375ed746695762efc1f28d1fc3f0'
     }), this.hasSlot('footer') && h("div", {
-      key: '87addfc052ed4ae33736724fbd8fbc8aca873b4d',
+      key: '84d24bd248033d4855dd63dfa5042585ae61d64d',
       class: "mt-auto"
     }, h("slot", {
-      key: '2e48677f42ac2aa951bc1a82afa9291fea3ddd72',
+      key: 'c7a2530d70a93705097b9ac3b8be1a21551dd1fb',
       name: "footer"
     })));
   }

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

@@ -2247,10 +2247,10 @@ const EdsCodeBlock = class {
   }
   render() {
     return h("div", {
-      key: 'cb379e82bcf71345945b0b88397650ecd4992770',
+      key: '98f5fe5e215e87c1eb024969b5e4f3ae1bd0cb0d',
       class: "relative bg-stronger rounded-sm"
     }, h("div", {
-      key: '945046d4fd747cd64a83155b421a897e380cc612',
+      key: '173be873a0f41398bd080758d5a0bbdcc977dcf5',
       class: "text-inverse flex justify-between items-center p-8"
     }, this.language ? h("span", {
       class: "f-ui-03"
@@ -2261,23 +2261,23 @@ const EdsCodeBlock = class {
     }, h("code", {
       innerHTML: this.getHighlightedCode()
     })), h("span", {
-      key: '3f6c7e996101f0bb83fb8c9e6991a205a0b268c8',
+      key: 'f8cb36cf89d19bf306c57168e61ccfde9a4d18ff',
       "aria-hidden": "true",
       class: "w-20 h-20 mt-8"
     }, h("eds-icon-wrapper", {
-      key: '8ad9beb61058f29e688f6777233c61f7fb3ccfe8',
+      key: '74f214c47dc647c2c254f3f9f96fba71e35133df',
       icon: this.copied ? 'success' : 'copy',
       onClick: () => this.copyToClipboard()
     })), h("span", {
-      key: 'a4f9a07906e1c2d9febb7ae789a3eed76dc422e9',
+      key: '74e628574b481d68c2d2132a12fd07bb62c86fde',
       class: "sr-only"
     }, "Copy Code")), this.language && h("pre", {
-      key: 'e31339126dd3cc885511aaa2bdf6f06f3a113c74',
+      key: '19d2b813b6e86451a8a9047b954d99340fc3cd85',
       class: `language-${this.language} bg-stronger pl-8 pb-8`,
       role: "region",
       "aria-label": `Code block in ${this.language}`
     }, h("code", {
-      key: '7efacd276f26a00f0f61793f6b8748259e1614b5',
+      key: '974eb2e2ef0d7dc90e012e421d64bf5b735761d1',
       innerHTML: this.getHighlightedCode()
     })));
   }

package/eds-cookies-preference.entry.esm.js

@@ -29,9 +29,9 @@ const EdsCookiesPreference = class {
   }
   render() {
     return h("div", {
-      key: '48f67648644ae9c8e645791ad3cbba5491866dc5'
+      key: 'fe3330180b8f3a5ff6b02156f5d76afb8cdf7edd'
     }, h("eds-link", {
-      key: '50154721f0f44e811ebe362e18bcf8cfb77b8f64',
+      key: 'c5d63e486cb63bcb28b89babe606ac1eae525fe0',
       size: "small",
       intent: this.intent,
       label: this.buttonText,

package/eds-feedback.entry.esm.js

@@ -4,7 +4,7 @@ import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
 
-const edsFeedbackCss = "h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.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-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)}.inline{display:inline}.grid{display:grid}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.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}";
+const edsFeedbackCss = "h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.text-lightest{color:var(--grey-500)}.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-heading-01{font-family:var(--f-heading-01-fontFamily);font-weight:var(--f-heading-01-fontWeight);font-size:var(--f-heading-01-fontSize);line-height:var(--f-heading-01-lineHeight);letter-spacing:var(--f-heading-01-letterSpacing)}.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)}.inline{display:inline}.grid{display:grid}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.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}";
 const EdsFeedbackStyle0 = edsFeedbackCss;
 const EdsFeedback = class {
   constructor(hostRef) {
@@ -56,20 +56,20 @@ const EdsFeedback = class {
   }
   render() {
     return h("div", {
-      key: '125299e9780486a10213fc3c59b15e7a4fb62616',
+      key: '5fbf2af8386c318134b64c1323553bc00ee2fe2c',
       class: "grid inline"
-    }, h("p", {
-      key: '6a02d78d34a590bc213cd5bf311ec8bed44f8959',
-      class: "f-heading-03 my-4"
+    }, h("h1", {
+      key: 'f5ec1e3cbbfa9c1d549a69c76e01609253c6dfea',
+      class: "f-heading-01 my-4"
     }, this.label), h("p", {
-      key: '76146fbade2f864ba7b72429a85218ebf6a24ea7',
-      class: "f-body-02 text-light"
+      key: '60348466e10a5295fdb861f512c1037cdf8fbf27',
+      class: "f-body-01 text-light"
     }, this.description), h("eds-rating", {
-      key: '38e0ec9219adaf85f674fab6be471112f06e42ff',
+      key: 'ed559e7844c20081e82ccc0cddd4a34691a7ad1d',
       "rating-type": this.type,
       "rating-count": this.count
     }), this.selectedRating > 0 && this.parsedMappings[this.selectedRating - 1] && h("span", {
-      key: 'beab34888d3db63ca2ee374a2d10d407bfc948cc',
+      key: 'b4ab49d3c936649c75714ef2cd9fc09f9a213437',
       class: "f-ui-04 text-lighter"
     }, this.parsedMappings[this.selectedRating - 1]));
   }

package/eds-frame.entry.esm.js

@@ -3,16 +3,16 @@ import 'react';
 import 'react/jsx-runtime';
 import 'react-dom';
 
-const edsFrameCss = ".bg-inverse{background-color:var(--white)}.min-h-156{min-height:156px}.rounded{border-radius:0.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:16px}.rounded-md{border-radius:12px}.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 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.relative{position:relative}.flex{display:flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.border-2{border-width:2px}.w-full{width:100%}.h-full{height:100%}.effect-height{transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-property:height}.items-center{align-items:center}.justify-between{justify-content:space-between}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.px-12{padding-left:0.75rem;padding-right:0.75rem}.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)}.ml-auto{margin-left:auto}.border-t-2{border-top-width:2px}.border{border:1px solid rgba(0, 0, 0, .1 )}.border-2{border:1px solid rgba(0, 0, 0, .1 )}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.ml-8{margin-left:0.5rem}.mr-8{margin-right:0.5rem}.mt-16{margin-top:1rem}";
+const edsFrameCss = ".bg-inverse{background-color:var(--white)}.min-h-156{min-height:156px}.rounded{border-radius:0.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:16px}.rounded-md{border-radius:12px}.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 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.relative{position:relative}.flex{display:flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.border-2{border-width:2px}.w-full{width:100%}.h-full{height:100%}.h-auto{height:auto}.effect-height{transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-property:height}.items-center{align-items:center}.justify-between{justify-content:space-between}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.px-12{padding-left:0.75rem;padding-right:0.75rem}.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)}.ml-auto{margin-left:auto}.border-t-2{border-top-width:2px}.border{border:1px solid rgba(0, 0, 0, .1 )}.border-2{border:1px solid rgba(0, 0, 0, .1 )}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.ml-8{margin-left:0.5rem}.mr-8{margin-right:0.5rem}.mt-16{margin-top:1rem}";
 const EdsFrameStyle0 = edsFrameCss;
 const EdsFrame = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.frameLabel = undefined;
-    this.urlLabel = 'Open in Storybook';
-    this.errorMessage = 'Could not load the requested Storybook content. Please check the URL or try again later.';
-    this.storybookUrl = undefined;
-    this.storyPath = undefined;
+    this.frameSrc = undefined;
+    this.urlLabel = 'Open';
+    this.errorMessage = 'Could not load the requested content. Please check the URL or try again later.';
+    this.url = undefined;
     this.intent = 'strong';
     this.size = 'auto';
     this.iframeError = false;
@@ -43,7 +43,7 @@ const EdsFrame = class {
     linkElement.dispatchEvent(event);
   }
   articleClasses() {
-    return ['bg-inverse min-h-156 rounded border-softer effect-focus-within relative flex grow flex-col border-2', 'w-full h-full'].join(' ');
+    return ['bg-inverse min-h-156 rounded border-softer effect-focus-within relative flex grow flex-col border-2', 'w-full h-auto'].join(' ');
   }
   getFrameHeight() {
     switch (this.size) {
@@ -71,32 +71,26 @@ const EdsFrame = class {
       this.iframeError = true;
     }
   }
-  get storyLink() {
-    return `${this.storybookUrl}/?path=/story/${this.storyPath}`;
-  }
-  get frameSrc() {
-    return `${this.storybookUrl}/iframe.html?id=${this.storyPath}&viewMode=story`;
-  }
   render() {
     return h("div", {
-      key: 'e4b72fab30dcf1eeee6fdf3c63719599eafedb6d',
+      key: 'b26229611868992daf5f4ca5037e1e10b2540ee5',
       class: this.articleClasses()
     }, h("div", {
-      key: 'f8643db32120c14dd18b3d44ae530a83e81e59e0',
+      key: '4cf9ff78b27ce7f88db50feccc9d267c2e727a2c',
       class: "effect-height flex items-center justify-between py-8 px-12"
     }, h("span", {
-      key: '7b40c644e142e6a6356e4d6a683b9c1c57104f5d',
+      key: 'bf2c1607d3fcbbf152691ec4e6134e737f6d1082',
       class: "f-ui-02"
     }, this.frameLabel), !this.iframeError ? h("eds-link", {
       label: this.urlLabel,
-      url: this.storyLink,
+      url: this.url,
       intent: this.intent,
       class: "ml-auto",
       external: true,
       disabled: false,
       icon: "arrow-diagonal"
     }) : null), h("div", {
-      key: '8a1fe80134dadd38d113968ad0c825a6f9426921',
+      key: 'd9f059766c509d7325ea734c63e29d7995cc8065',
       class: "border-softer"
     }, this.iframeError ? h("div", {
       class: "container ml-8 mr-8 mt-16"

package/eds-icon-arrow-diagonal.entry.esm.js

@@ -7,12 +7,12 @@ import 'react-dom';
 const EdsIconArrowDiagonal = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.addClass = '';
+    this.class = '';
   }
   render() {
     return h("span", {
-      key: '61fba958a683480dfd28e503b65a7dceb6640f46',
-      class: this.addClass,
+      key: 'd19f08d99908a8e47198e49b91a213aadb1dd619',
+      class: this.class,
       innerHTML: arrowDiagonal
     });
   }

package/eds-icon-arrow-right.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconArrowRight = class {
   }
   render() {
     return h("span", {
-      key: '823be807e649d4ddbd41c0628e2fda249a8c6f74',
+      key: '399c8c70c1d875f35b7f4f578efe8072fb59d008',
       class: this.class,
       innerHTML: arrowRight
     });

package/eds-icon-bookmark.entry.esm.js

@@ -0,0 +1,21 @@
+import { r as registerInstance, h } from './index.esm2.js';
+import { b as bookmark } from './bookmark-c200037c.esm.js';
+import 'react';
+import 'react/jsx-runtime';
+import 'react-dom';
+
+const EdsIconBookmark = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.class = '';
+  }
+  render() {
+    return h("span", {
+      key: '9cc4aa1805e43ca6275305e26d2fff79e2818862',
+      class: this.class,
+      innerHTML: bookmark
+    });
+  }
+};
+
+export { EdsIconBookmark as eds_icon_bookmark };

package/eds-icon-chevron-down.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconChevronDown = class {
   }
   render() {
     return h("span", {
-      key: 'c723d7f1bbd596063ae7e66123b8038af5320a54',
+      key: 'd6251250a9c47acceb68dee74c53fca873671878',
       class: this.class,
       innerHTML: chevronDown
     });

package/eds-icon-chevron-left.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconChevronLeft = class {
   }
   render() {
     return h("span", {
-      key: '5547e9d98f781dc03e88a014f726b3a402e6425d',
+      key: '6c98bd673a1562fda009e95e4e4562d1e7f0ccfd',
       class: this.class,
       innerHTML: chevronLeft
     });

package/eds-icon-chevron-right.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconChevronRight = class {
   }
   render() {
     return h("span", {
-      key: '177f447969a48957c54d011bfb72693731ecc1cf',
+      key: '418c8476ddb31b876a047a7e9de8841865ea5b81',
       class: this.class,
       innerHTML: chevronRight
     });

package/eds-icon-chevron-up.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconChevronUp = class {
   }
   render() {
     return h("span", {
-      key: '7b8f0aa2da992611e0c908ca0785abce6e1ae189',
+      key: '3484b9074d724ddee4141ff561e568284737ef43',
       class: this.class,
       innerHTML: chevronUp
     });

package/eds-icon-close.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconClose = class {
   }
   render() {
     return h("span", {
-      key: '8e4dedef0fe684fdd6078db8005661e49207da55',
+      key: '95690e0a265a88172a33edfa456de45a9943578f',
       class: this.class,
       innerHTML: close
     });

package/eds-icon-copy.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconCopy = class {
   }
   render() {
     return h("span", {
-      key: 'ff014a9761d8380a9fd8c97d3dd483b8d6fc786c',
+      key: '2f2e67b6792ca2c4aa711526a3d69e7a9779e159',
       class: this.class,
       innerHTML: copy
     });

package/eds-icon-eu.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconEu = class {
   }
   render() {
     return h("span", {
-      key: '3888f0338df2496c334d95dbcb52a0e39906362d',
+      key: '9758d733a6bdc751f059588ca8c3bc916f430968',
       class: this.class,
       innerHTML: euSvg
     });

package/eds-icon-external.entry.esm.js

@@ -0,0 +1,21 @@
+import { r as registerInstance, h } from './index.esm2.js';
+import { a as arrowDiagonal } from './arrow-diagonal-black-8f0494c3.esm.js';
+import 'react';
+import 'react/jsx-runtime';
+import 'react-dom';
+
+const EdsIconExternal = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.class = '';
+  }
+  render() {
+    return h("span", {
+      key: '8b5169456f56b7294d86af4e75a9aeec20a20174',
+      class: this.class,
+      innerHTML: arrowDiagonal
+    });
+  }
+};
+
+export { EdsIconExternal as eds_icon_external };

package/eds-icon-gitlab.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconGitlab = class {
   }
   render() {
     return h("span", {
-      key: '54ba107f89476040a8efb43b9e1239316c81a43f',
+      key: '804e76ad1a00913b2e5ac695e43eeb33f1fd9727',
       class: this.class,
       innerHTML: gitlabBlack
     });

package/eds-icon-loader.entry.esm.js

@@ -11,7 +11,7 @@ const EdsIconLoader = class {
   }
   render() {
     return h("span", {
-      key: '484dd0712392f0ea05389a0fc0039580f69ca37c',
+      key: 'c7d6b2dae9717ba0e99a8ecb98e4f9b02c45be6d',
       class: this.class,
       innerHTML: loader
     });

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

@@ -11,7 +11,7 @@ const EdsIconMenu = class {
   }
   render() {
     return h("span", {
-      key: 'dd9df55fa03c1b27f2f931c7d07ccc69ee940ff4',
+      key: '3fcbaa6aba76b06be9f4e72bf7c61a0c3fbae9fd',
       class: this.class,
       innerHTML: menu
     });

package/eds-icon-minus.entry.esm.js

@@ -0,0 +1,21 @@
+import { r as registerInstance, h } from './index.esm2.js';
+import { m as minus } from './minus-b30a7c71.esm.js';
+import 'react';
+import 'react/jsx-runtime';
+import 'react-dom';
+
+const EdsIconMinus = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.class = '';
+  }
+  render() {
+    return h("span", {
+      key: 'e615c57f7195878310f596124ede34304fcce5e1',
+      class: this.class,
+      innerHTML: minus
+    });
+  }
+};
+
+export { EdsIconMinus as eds_icon_minus };