@ebrains/components 0.7.0-alpha.1 → 0.9.0-beta

package/dist/components/eds-frame.js

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/clien
 import { d as defineCustomElement$3 } from './eds-icon-wrapper2.js';
 import { d as defineCustomElement$2 } from './eds-link2.js';
 
-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$1 = /*@__PURE__*/ proxyCustomElement(class EdsFrame extends HTMLElement {
@@ -11,10 +11,10 @@ const EdsFrame$1 = /*@__PURE__*/ proxyCustomElement(class EdsFrame extends HTMLE
         this.__registerHost();
         this.__attachShadow();
         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;
@@ -47,7 +47,7 @@ const EdsFrame$1 = /*@__PURE__*/ proxyCustomElement(class EdsFrame extends HTMLE
     articleClasses() {
         return [
             'bg-inverse min-h-156 rounded border-softer effect-focus-within relative flex grow flex-col border-2',
-            'w-full h-full'
+            'w-full h-auto'
         ].join(' ');
     }
     getFrameHeight() {
@@ -75,23 +75,17 @@ const EdsFrame$1 = /*@__PURE__*/ proxyCustomElement(class EdsFrame extends HTMLE
             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', class: this.articleClasses() }, h("div", { key: 'f8643db32120c14dd18b3d44ae530a83e81e59e0', class: "effect-height flex items-center justify-between py-8 px-12" }, h("span", { key: '7b40c644e142e6a6356e4d6a683b9c1c57104f5d', class: "f-ui-02" }, this.frameLabel), !this.iframeError ? (h("eds-link", { label: this.urlLabel, url: this.storyLink, intent: this.intent, class: "ml-auto", external: true, disabled: false, icon: "arrow-diagonal" })) : null), h("div", { key: '8a1fe80134dadd38d113968ad0c825a6f9426921', class: "border-softer" }, this.iframeError ? (h("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage)) : (h("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: true })))));
+        return (h("div", { key: 'b26229611868992daf5f4ca5037e1e10b2540ee5', class: this.articleClasses() }, h("div", { key: '4cf9ff78b27ce7f88db50feccc9d267c2e727a2c', class: "effect-height flex items-center justify-between py-8 px-12" }, h("span", { key: 'bf2c1607d3fcbbf152691ec4e6134e737f6d1082', class: "f-ui-02" }, this.frameLabel), !this.iframeError ? (h("eds-link", { label: this.urlLabel, url: this.url, intent: this.intent, class: "ml-auto", external: true, disabled: false, icon: "arrow-diagonal" })) : null), h("div", { key: 'd9f059766c509d7325ea734c63e29d7995cc8065', class: "border-softer" }, this.iframeError ? (h("div", { class: "container ml-8 mr-8 mt-16" }, this.errorMessage)) : (h("iframe", { src: this.frameSrc, width: "100%", height: this.getFrameHeight(), title: this.frameLabel, frameBorder: "0", allowFullScreen: true })))));
     }
     get el() { return this; }
     static get style() { return EdsFrameStyle0; }
 }, [1, "eds-frame", {
         "frameLabel": [1, "frame-label"],
+        "frameSrc": [1, "frame-src"],
         "urlLabel": [1, "url-label"],
         "errorMessage": [1, "error-message"],
-        "storybookUrl": [1, "storybook-url"],
-        "storyPath": [1, "story-path"],
+        "url": [1],
         "intent": [1],
         "size": [1],
         "iframeError": [32]

package/dist/components/eds-fullscreen-menu.js

@@ -9,13 +9,14 @@ import { d as defineCustomElement$4 } from './eds-link2.js';
 import { d as defineCustomElement$3 } from './eds-logo2.js';
 import { d as defineCustomElement$2 } from './eds-social-networks2.js';
 
-const edsFullscreenMenuCss = "";
+const edsFullscreenMenuCss = ".bg-default{background-color:var(--grey-200)}.bg-darker{background-color:var(--grey-400)}.bg-inverse{background-color:var(--white)}.bg-strongest{background-color:var(--black)}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0rem}.z-\\[999999\\]{z-index:999999}.overflow-y-scroll{overflow-y:scroll}.flex{display:flex}.inline-flex{display:inline-flex}.min-h-full{min-height:100%}.flex-col{flex-direction:column}.w-full{width:100%}.top-0{top:0rem}.mx-auto{margin-left:auto;margin-right:auto}.mt-auto{margin-top:auto}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.mr-auto{margin-right:auto}.w-\\[200px\\]{width:200px}.h-\\[85px\\]{height:85px}.px-16{padding-left:1rem;padding-right:1rem}.py-16{padding-top:1rem;padding-bottom:1rem}.mt-28{margin-top:1.75rem}.gap-y-8{row-gap:0.5rem}.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)}.rounded-xs{border-radius:4px}.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)}.hover\\:text-lighter:hover{color:var(--grey-600)}.w-fit{width:-moz-fit-content;width:fit-content}";
 const EdsFullscreenMenuStyle0 = edsFullscreenMenuCss;
 
 const EdsFullscreenMenu$1 = /*@__PURE__*/ proxyCustomElement(class EdsFullscreenMenu extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+        this.__attachShadow();
         this.menuClose = createEvent(this, "menuClose", 7);
         this.links = undefined;
         this.menuLinks = undefined;
@@ -72,10 +73,10 @@ const EdsFullscreenMenu$1 = /*@__PURE__*/ proxyCustomElement(class EdsFullscreen
         return parseData(this.menuLinks);
     }
     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;
+        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: `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;
     }
     static get style() { return EdsFullscreenMenuStyle0; }
-}, [0, "eds-fullscreen-menu", {
+}, [1, "eds-fullscreen-menu", {
         "links": [1],
         "menuLinks": [1, "menu-links"],
         "homeUrl": [1, "home-url"],

package/dist/components/eds-header.js

@@ -5,13 +5,14 @@ import { d as defineCustomElement$4 } from './eds-icon-wrapper2.js';
 import { d as defineCustomElement$3 } from './eds-link2.js';
 import { d as defineCustomElement$2 } from './eds-logo2.js';
 
-const edsHeaderCss = "";
+const edsHeaderCss = ".block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.z-10{z-index:10}.text-default{color:var(--black)}.text-inverse{color:var(--white)}.bg-dark{background-color:var(--grey-300)}.bg-strongest{background-color:var(--black)}.mr-auto{margin-right:auto}.w-\\[200px\\]{width:200px}.h-\\[85px\\]{height:85px}.left-1\\/2{left:50%}.top-1\\/2{top:50%}.grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hidden{display:none}.gap-x-2{-moz-column-gap:0.125rem;column-gap:0.125rem}.after\\:effect-opacity::after{transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.whitespace-nowrap{white-space:nowrap}.\\!text-current{color:currentColor !important}.overflow-hidden{overflow:hidden}.after\\:\\!border-transparent::after{border-color:var(--transparent) !important}.hover\\:after\\:\\!border-transparent:hover::after{border-color:var(--transparent) !important}.after\\:opacity-0::after{opacity:0}.hover\\:after\\:opacity-100:hover::after{opacity:1}.px-16{padding-left:1rem;padding-right:1rem}@media (min-width: 750px){.md\\:flex{display:flex}.md\\:hidden{display:none}}";
 const EdsHeaderStyle0 = edsHeaderCss;
 
 const EdsHeader$1 = /*@__PURE__*/ proxyCustomElement(class EdsHeader extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
+        this.__attachShadow();
         this.toggleMenu = createEvent(this, "toggleMenu", 7);
         this.homeUrl = '/';
         this.links = undefined;
@@ -72,12 +73,12 @@ const EdsHeader$1 = /*@__PURE__*/ proxyCustomElement(class EdsHeader extends HTM
         return parseData(this.links);
     }
     render() {
-        return (h("header", { key: '2e39471507762066b258c72da9690f3001ca9a94', class: `flex items-center justify-between relative z-10
-       ${this.inverseHeader ? 'text-inverse bg-strongest' : 'text-default bg-dark'}` }, h("div", { key: '75a52a092065c2f3f65f7d8a388b887d3991497e', class: "mr-auto w-[200px] h-[85px]" }, h("eds-logo", { key: '632c71d268929e06bc507573db21e04da4c60c67', type: this.inverseHeader ? 'color-white' : 'color', href: this.homeUrl })), this.parsedLinks && (h("nav", { key: '2a1bb9a64ea5731ea3a8c1537b1d95b28b2368f5', 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: '6cecbd7d268cd2aef5b7b117df422128c7dc994d', 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: 'b352a1456858d5190a6268928d2f92ddebdf99c2' }), 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));
+        return (h("header", { key: 'eabb97331efd8b4aee5e1f249ebc60d38926eb5e', class: `flex items-center justify-between relative z-10
+       ${this.inverseHeader ? 'text-inverse bg-strongest' : 'text-default bg-dark'}` }, h("div", { key: 'b561941a2e10252a45526e565e9711be6a0d2f41', class: "mr-auto w-[200px] h-[85px]" }, h("eds-logo", { key: 'fa1350f9b9584f7b5d128facd8077efcf117abe7', type: this.inverseHeader ? 'color-white' : 'color', href: this.homeUrl })), this.parsedLinks && (h("nav", { key: '6cc3c1b32250b671b394f0ac65b52e9b4491c57f', 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: 'ce1277ca3a9082e1b639ae42b96bbc1d3d665edc', 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: "large", 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: '7a1d67916c63dcab3d46d1223805a3c20af65d97' }), 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 this; }
     static get style() { return EdsHeaderStyle0; }
-}, [4, "eds-header", {
+}, [1, "eds-header", {
         "homeUrl": [513, "home-url"],
         "links": [1],
         "inverseHeader": [4, "inverse-header"],

package/dist/components/eds-icon-arrow-diagonal.js

@@ -5,13 +5,13 @@ const EdsIconArrowDiagonal$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconArr
     constructor() {
         super();
         this.__registerHost();
-        this.addClass = '';
+        this.class = '';
     }
     render() {
-        return h("span", { key: '61fba958a683480dfd28e503b65a7dceb6640f46', class: this.addClass, innerHTML: arrowDiagonal });
+        return h("span", { key: 'd19f08d99908a8e47198e49b91a213aadb1dd619', class: this.class, innerHTML: arrowDiagonal });
     }
 }, [0, "eds-icon-arrow-diagonal", {
-        "addClass": [1, "add-class"]
+        "class": [1]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/dist/components/eds-icon-arrow-right.js

@@ -8,7 +8,7 @@ const EdsIconArrowRight$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconArrowR
         this.class = '';
     }
     render() {
-        return h("span", { key: '823be807e649d4ddbd41c0628e2fda249a8c6f74', class: this.class, innerHTML: arrowRight });
+        return h("span", { key: '399c8c70c1d875f35b7f4f578efe8072fb59d008', class: this.class, innerHTML: arrowRight });
     }
 }, [0, "eds-icon-arrow-right", {
         "class": [1]

package/dist/components/{eds-docs-palettes.d.ts → eds-icon-bookmark.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface EdsDocsPalettes extends Components.EdsDocsPalettes, HTMLElement {}
-export const EdsDocsPalettes: {
-    prototype: EdsDocsPalettes;
-    new (): EdsDocsPalettes;
+interface EdsIconBookmark extends Components.EdsIconBookmark, HTMLElement {}
+export const EdsIconBookmark: {
+    prototype: EdsIconBookmark;
+    new (): EdsIconBookmark;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/eds-icon-bookmark.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { b as bookmark } from './bookmark.js';
+
+const EdsIconBookmark$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconBookmark extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: '9cc4aa1805e43ca6275305e26d2fff79e2818862', class: this.class, innerHTML: bookmark });
+    }
+}, [0, "eds-icon-bookmark", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-bookmark"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-bookmark":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconBookmark$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconBookmark = EdsIconBookmark$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconBookmark, defineCustomElement };

package/dist/components/eds-icon-chevron-down.js

@@ -8,7 +8,7 @@ const EdsIconChevronDown$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChevr
         this.class = '';
     }
     render() {
-        return h("span", { key: 'c723d7f1bbd596063ae7e66123b8038af5320a54', class: this.class, innerHTML: chevronDown });
+        return h("span", { key: 'd6251250a9c47acceb68dee74c53fca873671878', class: this.class, innerHTML: chevronDown });
     }
 }, [0, "eds-icon-chevron-down", {
         "class": [1]

package/dist/components/eds-icon-chevron-left.js

@@ -8,7 +8,7 @@ const EdsIconChevronLeft$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChevr
         this.class = '';
     }
     render() {
-        return h("span", { key: '5547e9d98f781dc03e88a014f726b3a402e6425d', class: this.class, innerHTML: chevronLeft });
+        return h("span", { key: '6c98bd673a1562fda009e95e4e4562d1e7f0ccfd', class: this.class, innerHTML: chevronLeft });
     }
 }, [0, "eds-icon-chevron-left", {
         "class": [1]

package/dist/components/eds-icon-chevron-right.js

@@ -8,7 +8,7 @@ const EdsIconChevronRight$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChev
         this.class = '';
     }
     render() {
-        return h("span", { key: '177f447969a48957c54d011bfb72693731ecc1cf', class: this.class, innerHTML: chevronRight });
+        return h("span", { key: '418c8476ddb31b876a047a7e9de8841865ea5b81', class: this.class, innerHTML: chevronRight });
     }
 }, [0, "eds-icon-chevron-right", {
         "class": [1]

package/dist/components/eds-icon-chevron-up.js

@@ -8,7 +8,7 @@ const EdsIconChevronUp$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconChevron
         this.class = '';
     }
     render() {
-        return h("span", { key: '7b8f0aa2da992611e0c908ca0785abce6e1ae189', class: this.class, innerHTML: chevronUp });
+        return h("span", { key: '3484b9074d724ddee4141ff561e568284737ef43', class: this.class, innerHTML: chevronUp });
     }
 }, [0, "eds-icon-chevron-up", {
         "class": [1]

package/dist/components/eds-icon-close.js

@@ -8,7 +8,7 @@ const EdsIconClose$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconClose exten
         this.class = '';
     }
     render() {
-        return h("span", { key: '8e4dedef0fe684fdd6078db8005661e49207da55', class: this.class, innerHTML: close });
+        return h("span", { key: '95690e0a265a88172a33edfa456de45a9943578f', class: this.class, innerHTML: close });
     }
 }, [0, "eds-icon-close", {
         "class": [1]

package/dist/components/eds-icon-copy.js

@@ -8,7 +8,7 @@ const EdsIconCopy$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconCopy extends
         this.class = '';
     }
     render() {
-        return h("span", { key: 'ff014a9761d8380a9fd8c97d3dd483b8d6fc786c', class: this.class, innerHTML: copy });
+        return h("span", { key: '2f2e67b6792ca2c4aa711526a3d69e7a9779e159', class: this.class, innerHTML: copy });
     }
 }, [0, "eds-icon-copy", {
         "class": [1]

package/dist/components/eds-icon-eu.js

@@ -8,7 +8,7 @@ const EdsIconEu$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconEu extends HTM
         this.class = '';
     }
     render() {
-        return h("span", { key: '3888f0338df2496c334d95dbcb52a0e39906362d', class: this.class, innerHTML: euSvg });
+        return h("span", { key: '9758d733a6bdc751f059588ca8c3bc916f430968', class: this.class, innerHTML: euSvg });
     }
 }, [0, "eds-icon-eu", {
         "class": [1]

package/dist/components/eds-icon-external.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsIconExternal extends Components.EdsIconExternal, HTMLElement {}
+export const EdsIconExternal: {
+    prototype: EdsIconExternal;
+    new (): EdsIconExternal;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-icon-external.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { a as arrowDiagonal } from './arrow-diagonal-black.js';
+
+const EdsIconExternal$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconExternal extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: '8b5169456f56b7294d86af4e75a9aeec20a20174', class: this.class, innerHTML: arrowDiagonal });
+    }
+}, [0, "eds-icon-external", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-external"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-external":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconExternal$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconExternal = EdsIconExternal$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconExternal, defineCustomElement };

package/dist/components/eds-icon-gitlab.js

@@ -8,7 +8,7 @@ const EdsIconGitlab$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconGitlab ext
         this.class = '';
     }
     render() {
-        return h("span", { key: '54ba107f89476040a8efb43b9e1239316c81a43f', class: this.class, innerHTML: gitlabBlack });
+        return h("span", { key: '804e76ad1a00913b2e5ac695e43eeb33f1fd9727', class: this.class, innerHTML: gitlabBlack });
     }
 }, [0, "eds-icon-gitlab", {
         "class": [1]

package/dist/components/eds-icon-loader.js

@@ -8,7 +8,7 @@ const EdsIconLoader$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconLoader ext
         this.class = '';
     }
     render() {
-        return h("span", { key: '484dd0712392f0ea05389a0fc0039580f69ca37c', class: this.class, innerHTML: loader });
+        return h("span", { key: 'c7d6b2dae9717ba0e99a8ecb98e4f9b02c45be6d', class: this.class, innerHTML: loader });
     }
 }, [0, "eds-icon-loader", {
         "class": [1]

package/dist/components/eds-icon-menu.js

@@ -8,7 +8,7 @@ const EdsIconMenu$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconMenu extends
         this.class = '';
     }
     render() {
-        return h("span", { key: 'dd9df55fa03c1b27f2f931c7d07ccc69ee940ff4', class: this.class, innerHTML: menu });
+        return h("span", { key: '3fcbaa6aba76b06be9f4e72bf7c61a0c3fbae9fd', class: this.class, innerHTML: menu });
     }
 }, [0, "eds-icon-menu", {
         "class": [1]

package/dist/components/eds-icon-minus.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsIconMinus extends Components.EdsIconMinus, HTMLElement {}
+export const EdsIconMinus: {
+    prototype: EdsIconMinus;
+    new (): EdsIconMinus;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-icon-minus.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { m as minus } from './minus.js';
+
+const EdsIconMinus$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconMinus extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: 'e615c57f7195878310f596124ede34304fcce5e1', class: this.class, innerHTML: minus });
+    }
+}, [0, "eds-icon-minus", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-minus"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-minus":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconMinus$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconMinus = EdsIconMinus$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconMinus, defineCustomElement };

package/dist/components/eds-icon-more.js

@@ -8,7 +8,7 @@ const EdsIconMore$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconMore extends
         this.class = '';
     }
     render() {
-        return h("span", { key: 'dc06f1a54b9542cb2c0165fb3bdff960ecd81cc0', class: this.class, innerHTML: more });
+        return h("span", { key: '770c34b98ec0e0a7e16de4d7b5b41b4afec9911e', class: this.class, innerHTML: more });
     }
 }, [0, "eds-icon-more", {
         "class": [1]

package/dist/components/eds-icon-paper.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsIconPaper extends Components.EdsIconPaper, HTMLElement {}
+export const EdsIconPaper: {
+    prototype: EdsIconPaper;
+    new (): EdsIconPaper;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-icon-paper.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { p as paper } from './paper.js';
+
+const EdsIconPaper$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconPaper extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: 'cb9f7af8825527f86c200203611dae752cb3d647', class: this.class, innerHTML: paper });
+    }
+}, [0, "eds-icon-paper", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-paper"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-paper":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconPaper$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconPaper = EdsIconPaper$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconPaper, defineCustomElement };

package/dist/components/eds-icon-plus.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsIconPlus extends Components.EdsIconPlus, HTMLElement {}
+export const EdsIconPlus: {
+    prototype: EdsIconPlus;
+    new (): EdsIconPlus;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-icon-plus.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { p as plus } from './plus.js';
+
+const EdsIconPlus$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconPlus extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: '75a9d03500e01cc9d5f7b19a5afd2491ad2e6fee', class: this.class, innerHTML: plus });
+    }
+}, [0, "eds-icon-plus", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-plus"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-plus":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconPlus$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconPlus = EdsIconPlus$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconPlus, defineCustomElement };

package/dist/components/{eds-docs-tokens.d.ts → eds-icon-portal.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface EdsDocsTokens extends Components.EdsDocsTokens, HTMLElement {}
-export const EdsDocsTokens: {
-    prototype: EdsDocsTokens;
-    new (): EdsDocsTokens;
+interface EdsIconPortal extends Components.EdsIconPortal, HTMLElement {}
+export const EdsIconPortal: {
+    prototype: EdsIconPortal;
+    new (): EdsIconPortal;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/eds-icon-portal.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { p as portal } from './portal.js';
+
+const EdsIconPortal$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconPortal extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: '260c4eeb69ff79d943571c1461346b9019ea513a', class: this.class, innerHTML: portal });
+    }
+}, [0, "eds-icon-portal", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-portal"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-portal":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconPortal$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconPortal = EdsIconPortal$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconPortal, defineCustomElement };

package/dist/components/eds-icon-private.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsIconPrivate extends Components.EdsIconPrivate, HTMLElement {}
+export const EdsIconPrivate: {
+    prototype: EdsIconPrivate;
+    new (): EdsIconPrivate;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-icon-private.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { p as privat } from './private.js';
+
+const EdsIconPrivate$1 = /*@__PURE__*/ proxyCustomElement(class EdsIconPrivate extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.class = '';
+    }
+    render() {
+        return h("span", { key: 'd57700e721a421e4c970a1e643d92548fcf2b18c', class: this.class, innerHTML: privat });
+    }
+}, [0, "eds-icon-private", {
+        "class": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-icon-private"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-icon-private":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsIconPrivate$1);
+            }
+            break;
+    } });
+}
+
+const EdsIconPrivate = EdsIconPrivate$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsIconPrivate, defineCustomElement };

package/dist/components/eds-icon-public.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsIconPublic extends Components.EdsIconPublic, HTMLElement {}
+export const EdsIconPublic: {
+    prototype: EdsIconPublic;
+    new (): EdsIconPublic;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;