@ebrains/components 2.2.0 → 2.3.0

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

@@ -8,7 +8,7 @@ export class EdsIconExternal {
         this.class = '';
     }
     render() {
-        return h("span", { key: '1abc7edbab033c99ffaede9ebe0f210849fe8d61', class: this.class, innerHTML: arrowDiagonal });
+        return h("span", { key: '0825d1c73c5f311f7a9d5394542f6fd74791a543', class: this.class, innerHTML: arrowDiagonal });
     }
     static get is() { return "eds-icon-external"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconGitlab {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'b35f2e94d903549d867579f2e008c323a441019c', class: this.class, innerHTML: gitlabBlack });
+        return h("span", { key: '4c0a731d1a67884107112bc5941faf2001dbbfd5', class: this.class, innerHTML: gitlabBlack });
     }
     static get is() { return "eds-icon-gitlab"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconLoader {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'b97da1b406718c7611d1e17d7a9c6b4670600740', class: this.class, innerHTML: loader });
+        return h("span", { key: '2207bbac640cf28a2d6d5d725f681e56c8c53011', class: this.class, innerHTML: loader });
     }
     static get is() { return "eds-icon-loader"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconMenu {
         this.class = '';
     }
     render() {
-        return h("span", { key: '4322703c9e449819dc30946118893d365fa20124', class: this.class, innerHTML: menu });
+        return h("span", { key: '5f14cbe4b3ca88f7301c1561c092278b31d04326', class: this.class, innerHTML: menu });
     }
     static get is() { return "eds-icon-menu"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconMinus {
         this.class = '';
     }
     render() {
-        return h("span", { key: '9b9efb71d724cc1eb0e9bebd7256fe11b39e4da3', class: this.class, innerHTML: minus });
+        return h("span", { key: 'b19c12426db0068934252c6197ba04789d42f5e2', class: this.class, innerHTML: minus });
     }
     static get is() { return "eds-icon-minus"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconMore {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'f7ebc68658fcf8c0df627871481cce90cd7800fb', class: this.class, innerHTML: more });
+        return h("span", { key: 'b6d2b6d7d156c715e2f7d2192d93a4326b22dfc5', class: this.class, innerHTML: more });
     }
     static get is() { return "eds-icon-more"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconPaper {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'eaa676b09d81da31b600a910b99b416c1a5420d3', class: this.class, innerHTML: paper });
+        return h("span", { key: '497345c7f18b9cceaf00030b7b3ab052f482c7bf', class: this.class, innerHTML: paper });
     }
     static get is() { return "eds-icon-paper"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconPlus {
         this.class = '';
     }
     render() {
-        return h("span", { key: '825957824697ceeec9d6f81007c4dd1dfc208b28', class: this.class, innerHTML: plus });
+        return h("span", { key: 'd9fdc443e6da9465453f5f201b5782437a45402e', class: this.class, innerHTML: plus });
     }
     static get is() { return "eds-icon-plus"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconPortal {
         this.class = '';
     }
     render() {
-        return h("span", { key: '4c557c9fe9168f361c55aae7a7c6874d78ec620d', class: this.class, innerHTML: portal });
+        return h("span", { key: '27be525d5922ed05755e207adc914c7e86fb7033', class: this.class, innerHTML: portal });
     }
     static get is() { return "eds-icon-portal"; }
     static get properties() {

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

@@ -8,7 +8,7 @@ export class EdsIconPrivate {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'fe423636431e96ce42d0b8236b04c11c92633a18', class: this.class, innerHTML: privat });
+        return h("span", { key: '16aa24573646bd0002f9b259dba4ab7bb150d12e', class: this.class, innerHTML: privat });
     }
     static get is() { return "eds-icon-private"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-public/eds-icon-public.js

@@ -8,7 +8,7 @@ export class EdsIconPublic {
         this.class = '';
     }
     render() {
-        return h("span", { key: '4c0a1ff37a1bfa79173c6b91da33fb808ef1b918', class: this.class, innerHTML: pub });
+        return h("span", { key: '1aedbead2feca84807fa4dd3d10092c3a4632365', class: this.class, innerHTML: pub });
     }
     static get is() { return "eds-icon-public"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-search/eds-icon-search.js

@@ -8,7 +8,7 @@ export class EdsIconSearch {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'c788833c6a51e489ca432697a9c46d9b5756a519', class: this.class, innerHTML: search });
+        return h("span", { key: '4d7a6781f65c4fc7159dd29a9d02b2d5333915fd', class: this.class, innerHTML: search });
     }
     static get is() { return "eds-icon-search"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-star/eds-icon-star.js

@@ -8,7 +8,7 @@ export class EdsIconStar {
         this.class = '';
     }
     render() {
-        return h("span", { key: '297e73664320032b2f78dd3c43aa0852545c0723', class: this.class, innerHTML: star });
+        return h("span", { key: '4410f1ce5f3b350e75b31ba6089540a9281e474b', class: this.class, innerHTML: star });
     }
     static get is() { return "eds-icon-star"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-start/eds-icon-start.js

@@ -8,7 +8,7 @@ export class EdsIconStart {
         this.class = '';
     }
     render() {
-        return h("span", { key: '360d1178d8f9f8485718f5ab1ed823ac16be2987', class: this.class, innerHTML: start });
+        return h("span", { key: '3f33c676334b9e7dd18708459ebfb3e3a9cf12a4', class: this.class, innerHTML: start });
     }
     static get is() { return "eds-icon-start"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-success/eds-icon-success.js

@@ -8,7 +8,7 @@ export class EdsIconSuccess {
         this.class = '';
     }
     render() {
-        return h("span", { key: '281f7141b6b45b60e8f11f85430af0cd8364d91f', class: this.class, innerHTML: success });
+        return h("span", { key: '0130a392a537a653154383ccd21a1516100459e3', class: this.class, innerHTML: success });
     }
     static get is() { return "eds-icon-success"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-thumbs-down/eds-icon-thumbs-down.js

@@ -8,7 +8,7 @@ export class EdsIconThumbsDown {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'b119fa870a00fbad7cffeb30b0ab76d2165eb76d', class: this.class, innerHTML: thumbsDown });
+        return h("span", { key: '747187922f5c94e96c67f5455e4ed3b8afd47885', class: this.class, innerHTML: thumbsDown });
     }
     static get is() { return "eds-icon-thumbs-down"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-thumbs-up/eds-icon-thumbs-up.js

@@ -8,7 +8,7 @@ export class EdsIconThumbsUp {
         this.class = '';
     }
     render() {
-        return h("span", { key: '86834f96ac586f4bd7404ebdcd8ac0e496f063bb', class: this.class, innerHTML: thumbsUp });
+        return h("span", { key: '051029abca2749f24ae3407ff3ae36b20007c924', class: this.class, innerHTML: thumbsUp });
     }
     static get is() { return "eds-icon-thumbs-up"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-tutorial/eds-icon-tutorial.js

@@ -8,7 +8,7 @@ export class EdsIconTutorial {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'f7457ee049fe477b51776527b58d459312c52cf4', class: this.class, innerHTML: tutorial });
+        return h("span", { key: '3d0f88fa7ebbec278f9cc1394ed87809ff7c49d1', class: this.class, innerHTML: tutorial });
     }
     static get is() { return "eds-icon-tutorial"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-unknown/eds-icon-unknown.js

@@ -8,7 +8,7 @@ export class EdsIconUnknown {
         this.class = '';
     }
     render() {
-        return h("span", { key: '3b2750a85a74227efe458ceaa2d0995ab0c472b3', class: this.class, innerHTML: unknown });
+        return h("span", { key: '27f8330b13ebecd974913f83e3ae142406d08712', class: this.class, innerHTML: unknown });
     }
     static get is() { return "eds-icon-unknown"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-updown/eds-icon-updown.js

@@ -8,7 +8,7 @@ export class EdsIconUpdown {
         this.class = '';
     }
     render() {
-        return h("span", { key: '1768da9f606b60dd3dc1c8ef76673c6b17eb1b37', class: this.class, innerHTML: upDonw });
+        return h("span", { key: 'ef19f500cdd0289666d512e73952e6ae1ba9e7dc', class: this.class, innerHTML: upDonw });
     }
     static get is() { return "eds-icon-updown"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-user/eds-icon-user.js

@@ -8,7 +8,7 @@ export class EdsIconUser {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'ccb41b3ad799e44dab0664dadd5407f6aef9b39c', class: this.class, innerHTML: user });
+        return h("span", { key: '134abbd42c49915f772f5d2aed7b53ecc5a0bd8a', class: this.class, innerHTML: user });
     }
     static get is() { return "eds-icon-user"; }
     static get properties() {

package/dist/collection/components/eds-icons/eds-icon-view/eds-icon-view.js

@@ -8,7 +8,7 @@ export class EdsIconView {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'af0fae74516d7f51af3616aa09c16b80b603504f', class: this.class, innerHTML: view });
+        return h("span", { key: '5725348031c6f0b6944e765b1b52e7f5759493aa', class: this.class, innerHTML: view });
     }
     static get is() { return "eds-icon-view"; }
     static get properties() {

package/dist/collection/components/eds-icons/social/eds-icon-bluesky/eds-icon-bluesky.js

@@ -8,7 +8,7 @@ export class EdsIconBluesky {
         this.class = '';
     }
     render() {
-        return h("span", { key: 'dd1f0043450c0970da5487a4c7c69859d3d97e2f', class: this.class, innerHTML: bluesky });
+        return h("span", { key: 'b42f25c9a2405c94d83c917026f376c9803058d1', class: this.class, innerHTML: bluesky });
     }
     static get is() { return "eds-icon-bluesky"; }
     static get properties() {

package/dist/collection/components/eds-icons/social/eds-icon-facebook/eds-icon-facebook.js

@@ -8,7 +8,7 @@ export class EdsIconFacebook {
         this.class = '';
     }
     render() {
-        return h("span", { key: '1981b2c066cfa5f0fb4326017df4bfbdfff09873', class: this.class, innerHTML: facebook });
+        return h("span", { key: '8bba88cba6d29b204b4a4ceae3c41129bb6edcaa', class: this.class, innerHTML: facebook });
     }
     static get is() { return "eds-icon-facebook"; }
     static get properties() {

package/dist/collection/components/eds-icons/social/eds-icon-linkedin/eds-icon-linkedin.js

@@ -8,7 +8,7 @@ export class EdsIconLinkedin {
         this.class = '';
     }
     render() {
-        return h("span", { key: '8bba88cba6d29b204b4a4ceae3c41129bb6edcaa', class: this.class, innerHTML: linkedin });
+        return h("span", { key: '36bf44e06217f9b2521f374028a1316fb17ff21a', class: this.class, innerHTML: linkedin });
     }
     static get is() { return "eds-icon-linkedin"; }
     static get properties() {

package/dist/collection/components/eds-icons/social/eds-icon-mastodon/eds-icon-mastodon.js

@@ -8,7 +8,7 @@ export class EdsIconMastodon {
         this.class = '';
     }
     render() {
-        return h("span", { key: '36bf44e06217f9b2521f374028a1316fb17ff21a', class: this.class, innerHTML: mastodon });
+        return h("span", { key: 'b7ba0f10df196243538aaeefe3db0ee5f594f885', class: this.class, innerHTML: mastodon });
     }
     static get is() { return "eds-icon-mastodon"; }
     static get properties() {

package/dist/collection/components/eds-icons/social/eds-icon-twitter/eds-icon-twitter.js

@@ -8,7 +8,7 @@ export class EdsIconTwitter {
         this.class = '';
     }
     render() {
-        return h("span", { key: '6f1d0b5e073ef4d754aecb600a8578fc59950496', class: this.class, innerHTML: twitter });
+        return h("span", { key: '063a941c7795658f2dd79fbdafd7ea1f8ed4b2f4', class: this.class, innerHTML: twitter });
     }
     static get is() { return "eds-icon-twitter"; }
     static get properties() {

package/dist/collection/components/eds-icons/social/eds-icon-youtube/eds-icon-youtube.js

@@ -8,7 +8,7 @@ export class EdsIconYoutube {
         this.class = '';
     }
     render() {
-        return h("span", { key: '063a941c7795658f2dd79fbdafd7ea1f8ed4b2f4', class: this.class, innerHTML: youtube });
+        return h("span", { key: '7c8d8693dc6e0a03af0b0a68190d451fee84a013', class: this.class, innerHTML: youtube });
     }
     static get is() { return "eds-icon-youtube"; }
     static get properties() {

package/dist/collection/components/eds-img/eds-img.js

@@ -57,10 +57,10 @@ export class EdsImg {
             imgOpts['loading'] = 'lazy';
             imgOpts['decoding'] = 'async';
         }
-        return (h("div", { key: 'fec0dcf2ec178a953f4ced8a71b037030983670d', class: {
+        return (h("div", { key: '7d704bdd14072d6ce69632d6f2de3270ff393b87', class: {
                 'items-center justify-center': true,
                 'effect-bg-pattern': this.lazyload && this.showBg
-            } }, h("picture", { key: '0df010a6ed50519be0a2017bf12db7d1ab2fb208' }, this.formats.map((format) => (h("source", { type: format.type, srcSet: format.srcset, media: format.media, sizes: this.sizes }))), h("img", Object.assign({ key: 'ea4275b2cc6be0cce5ab63f97d05454e3c4ee1dc', ref: (el) => (this.img = el), class: {
+            } }, h("picture", { key: '724f384b7b9f112727d3ab4ecdab5f769e581b26' }, this.formats.map((format) => (h("source", { type: format.type, srcSet: format.srcset, media: format.media, sizes: this.sizes }))), h("img", Object.assign({ key: '8b12b640a9d66fba117676e6bd81659c72a8e15c', ref: (el) => (this.img = el), class: {
                 'effect-opacity object-cover object-center': true,
                 'opacity-100': this.loaded,
                 'opacity-0': !this.loaded

package/dist/collection/components/eds-input-elements/eds-input/eds-input.js

@@ -50,7 +50,7 @@ export class EdsInput {
     render() {
         const withIcon = !!this.icon;
         const describedBy = this.hasMessage || this.error ? `${this.name}-error` : '';
-        return (h("div", { key: '0a6386205f78655569bf93960a4e2664563e4014', class: "relative flex items-center" }, this.type === 'textarea' ? (h("textarea", { id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, class: `min-h-80 input input-textarea ${withIcon ? 'input-with-icon' : ''} ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput })) : this.type === 'select' ? (h("select", { id: this.inputId || this.name, name: this.name, required: this.required, disabled: this.disabled, class: `input input-select ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, onInput: this.handleInput, onChange: this.handleInput }, this.options.map((option) => (h("option", { value: option.value, selected: option.value === this.innerVal, key: option.value }, option.label))))) : (h("input", Object.assign({ id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, type: this.type, checked: ['radio', 'checkbox'].includes(this.type) ? this.checked : undefined }, (this.type === 'number'
+        return (h("div", { key: '4c49edfceefe448b6f5bb29284f0b757342a6003', class: "relative flex items-center" }, this.type === 'textarea' ? (h("textarea", { id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, class: `min-h-80 input input-textarea ${withIcon ? 'input-with-icon' : ''} ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput })) : this.type === 'select' ? (h("select", { id: this.inputId || this.name, name: this.name, required: this.required, disabled: this.disabled, class: `input input-select ${this.error ? 'input-error' : ''} ${this.extraClass}`, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, onInput: this.handleInput, onChange: this.handleInput }, this.options.map((option) => (h("option", { value: option.value, selected: option.value === this.innerVal, key: option.value }, option.label))))) : (h("input", Object.assign({ id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.innerVal.toString(), required: this.required, disabled: this.disabled, type: this.type, checked: ['radio', 'checkbox'].includes(this.type) ? this.checked : undefined }, (this.type === 'number'
             ? {
                 min: this.min,
                 max: this.max,
@@ -61,7 +61,7 @@ export class EdsInput {
               input ${this.type === 'radio' ? 'input-radio' : this.type === 'checkbox' ? 'input-checkbox' : ''}
               ${withIcon && this.type !== 'radio' && this.type !== 'checkbox' ? 'input-icon pl-36' : ''} 
               ${this.error ? 'input-error' : ''}
-              `, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput }))), this.maxLength && this.type === 'textarea' && (h("span", { key: 'c78bf1501f682cde9a193ea6726baf2433566516', class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}` }, this.maxLength)), this.icon && (h("eds-icon-wrapper", { key: 'c07e7d5d8394292cf365f32838dfd837ccf168d6', class: `absolute top-1/2 left-[4px] -translate-y-1/2 ${this.disabled ? 'text-lightest' : 'text-lightest'}`, icon: this.icon }))));
+              `, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, maxlength: this.maxLength, onInput: this.handleInput, onChange: this.handleInput }))), this.maxLength && this.type === 'textarea' && (h("span", { key: 'df877332c68d4783d5f0f8d8beb94c1859cd00da', class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}` }, this.maxLength)), this.icon && (h("eds-icon-wrapper", { key: '94f7d3d75f5c578c10ab72b6140785b0b5988a13', class: `absolute top-1/2 left-[4px] -translate-y-1/2 ${this.disabled ? 'text-lightest' : 'text-lightest'}`, icon: this.icon }))));
     }
     static get is() { return "eds-input"; }
     static get properties() {

package/dist/collection/components/eds-input-elements/eds-input-footer/eds-input-footer.js

@@ -8,7 +8,7 @@ export class EdsInputFooter {
         this.link = undefined;
     }
     render() {
-        return (h("div", { key: '54571d8f3c08a7a4f12e40728e02a7210ab0d345' }, this.error && this.errorMessage && (h("div", { key: 'db35f0c0dfa931d55d57a9c4ad3fffaeb4cea914', id: `error_${this.name}`, class: "text-error flex items-center" }, h("eds-icon-wrapper", { key: '63e401d86876829d8d2bbab887a66ef0dbd1837f', icon: "warning" }), h("p", { key: '81f8b0819a7cb119353c8ac38ab1df0cafb9d36f', class: "f-ui-04 ml-4 mb-4", innerHTML: this.errorMessage }))), this.message && h("p", { key: 'e5018623e2d8578864dc1f0b06d54e4a60ff9020', id: `desc_${this.name}`, class: "f-ui-05 text-lighter", innerHTML: this.message }), this.link && (h("a", { key: 'e7b6bde26ae02cf07ac8b8e6461282a4ba1355ed', href: this.link.url, class: "f-ui-05 effect-color hover:text-lighter underline underline-offset-4" }, this.link.label))));
+        return (h("div", { key: '4c3c1cc26e2b003f49b3cfd1c2388833c305781b' }, this.error && this.errorMessage && (h("div", { key: '7e14e3a77c99ee2700fd0cd8cb1e738c11e34823', id: `error_${this.name}`, class: "text-error flex items-center" }, h("eds-icon-wrapper", { key: '700bc9b58a15e985903fc91abe4e41847d1cf761', icon: "warning" }), h("p", { key: 'a90a0fb49221c15125a54a0413a926174c065319', class: "f-ui-04 ml-4 mb-4", innerHTML: this.errorMessage }))), this.message && h("p", { key: '24d7c4fb5de1bb54237282edf6e51a16f0475474', id: `desc_${this.name}`, class: "f-ui-05 text-lighter", innerHTML: this.message }), this.link && (h("a", { key: '2f01a63b36409dfddd19416777f88008f358b1cb', href: this.link.url, class: "f-ui-05 effect-color hover:text-lighter underline underline-offset-4" }, this.link.label))));
     }
     static get is() { return "eds-input-footer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eds-input-elements/eds-input-label/eds-input-label.js

@@ -7,7 +7,7 @@ export class EdsInputLabel {
         this.disabled = false;
     }
     render() {
-        return (h("label", { key: '90e0659383fd3be9a166457de5429385fe3bfe02', htmlFor: this.name, class: `input-label ${this.disabled ? 'text-lighter' : ''}` }, this.label, this.required && (h("span", { key: '4d417c45dd636bfd5872d846e5eb89ff3694a4d4' }, h("span", { key: '3924011891ee03e530fe25b269bf4231f3acd9cb', "aria-hidden": "true" }, "*"), h("span", { key: '2f343b6b4ab4cbd538189cfa404210cf676eefe7', class: "sr-only" }, "required")))));
+        return (h("label", { key: '51cf53579cea9effbf421c4f4ab45ef63f6770bf', htmlFor: this.name, class: `input-label ${this.disabled ? 'text-lighter' : ''}` }, this.label, this.required && (h("span", { key: '381c4e1e014d43f726e997767c76565a1979e54a' }, h("span", { key: '08102ef7990f262bf56b6f5bcf70e2ef6ecb0670', "aria-hidden": "true" }, "*"), h("span", { key: '6d3c6f3af5a06c5a1ee2245240cb3fbbef6cf9a8', class: "sr-only" }, "required")))));
     }
     static get is() { return "eds-input-label"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eds-input-elements/eds-input-range/eds-input-range.js

@@ -45,7 +45,7 @@ export class EdsInputRange {
         return this.inputElement;
     }
     render() {
-        return (h("div", { key: '3fa2ef579847e66bcacc35afe202192b78a06975', class: "relative flex flex-col items-start" }, h("input", { key: '669cc03e44dfa1ae8eae758f82f41939de1be625', id: this.inputId || this.name, name: this.name, min: this.min, max: this.max, step: this.step, value: this.sliderVal, required: this.required, disabled: this.disabled, type: "range", class: "w-full py-6 input", tabindex: "0", role: "slider", "aria-describedby": `desc_${this.name}`, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.sliderVal, onInput: this.onInput, onChange: this.onChange }), h("p", { key: 'b3865e1bfacb423da277f4b76dfd0f3294f96cc6', id: `desc_${this.name}`, class: "block f-ui-05 mt-4 text-lighter" }, "Current value: ", this.sliderVal)));
+        return (h("div", { key: 'c4ce20af554533837b8fc3f7bf69bd649e26b574', class: "relative flex flex-col items-start" }, h("input", { key: '924b247fd81481e648bbf44fec22185284014254', id: this.inputId || this.name, name: this.name, min: this.min, max: this.max, step: this.step, value: this.sliderVal, required: this.required, disabled: this.disabled, type: "range", class: "w-full py-6 input", tabindex: "0", role: "slider", "aria-describedby": `desc_${this.name}`, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.sliderVal, onInput: this.onInput, onChange: this.onChange }), h("p", { key: 'a3acfa464938748480e259cac4376a2be3512e6e', id: `desc_${this.name}`, class: "block f-ui-05 mt-4 text-lighter" }, "Current value: ", this.sliderVal)));
     }
     static get is() { return "eds-input-range"; }
     static get properties() {

package/dist/collection/components/eds-input-elements/eds-input-search/eds-input-search.js

@@ -66,7 +66,7 @@ export class EdsInputSearch {
         return this.inputElement;
     }
     render() {
-        return (h("div", { key: 'ad7c42baf7c54ede5dca7dd2a6916557f46d33d6', class: "relative flex items-center" }, h("eds-icon-wrapper", { key: '6de80c397bae5e541de1ce3c2937bed860b58363', icon: "search", class: "absolute top-1/2 left-[4px] -translate-y-1/2 text-lightest", "aria-hidden": "true" }), h("input", { key: '9637c5569c97061fde3735ecb58b6a6f81a10e15', id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.value || '', required: this.required, disabled: this.disabled, type: "search", "aria-label": this.placeholder, class: `input pl-36 ${this.decorate}`,
+        return (h("div", { key: 'b1232c04e55c9f0bd7b864271ca855a3de242a73', class: "relative flex items-center" }, h("eds-icon-wrapper", { key: '67e51a49b994fc00cb48f2b55f54217097f4d837', icon: "search", class: "absolute top-1/2 left-[4px] -translate-y-1/2 text-lightest", "aria-hidden": "true" }), h("input", { key: 'a6526f68a35145631254e4a0380a1298242c592e', id: this.inputId || this.name, name: this.name, placeholder: this.placeholder, value: this.value || '', required: this.required, disabled: this.disabled, type: "search", "aria-label": this.placeholder, class: `input pl-36 ${this.decorate}`,
             //onInput={this.onInput}
             onChange: this.onChange })));
     }

package/dist/collection/components/eds-input-elements/eds-input-select/eds-input-select.js

@@ -26,12 +26,12 @@ export class EdsInputSelect {
         const selectId = this.inputId || this.name;
         const placeholderText = this.placeholder || `Pick from the list`;
         const describedBy = this.hasMessage || this.error ? `${this.name}-error` : undefined;
-        return (h("div", { key: '06be08db809ec9970ca4d7bdbdcdf1c8f2bc8840', class: "relative" }, h("select", { key: 'e4319592e6c2f0c71e0dc75ca2d854506bda70bc', id: selectId, name: this.name, class: {
+        return (h("div", { key: 'b28b21c38ed5848cf08c0bc626f4ce32eddfb775', class: "relative" }, h("select", { key: '727f578d43cf12568d3d3b35548a30972fc46300', id: selectId, name: this.name, class: {
                 input: true,
                 'input-error': this.error,
                 'px-4': true,
                 'py-2': true
-            }, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, disabled: this.disabled, required: this.required, onChange: this.handleChange }, h("option", { key: 'a0ece38948f84a10ea8cd4c0a01b3f8b9730c7ef', value: "", disabled: true, hidden: true }, placeholderText), this.options.map((opt, index) => (h("option", { key: index, value: opt.value, selected: opt.value === this.value }, opt.label)))), h("span", { key: '8ce085e43d0ba6340e52b0666dc0a31abbf1a2f9', class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center" }, h("eds-icon-wrapper", { key: '8b91b3fa3a819d04ede5d7816fcb2f04e66fd03b', class: "w-20 h-20", icon: "chevron-right" }))));
+            }, "aria-invalid": this.error ? 'true' : 'false', "aria-describedby": describedBy, disabled: this.disabled, required: this.required, onChange: this.handleChange }, h("option", { key: '9283f69f3c723d65243d8f38b92ee2fcd16d187e', value: "", disabled: true, hidden: true }, placeholderText), this.options.map((opt, index) => (h("option", { key: index, value: opt.value, selected: opt.value === this.value }, opt.label)))), h("span", { key: '63a0a9fc049f10141697028195aa28abb8d246f2', class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center" }, h("eds-icon-wrapper", { key: 'aa756ea1d279a03ca7919518a15cd63b368a20a0', class: "w-20 h-20", icon: "chevron-right" }))));
     }
     static get is() { return "eds-input-select"; }
     static get properties() {

package/dist/collection/components/eds-input-field/eds-input-field.js

@@ -96,7 +96,7 @@ export class EdsInputField {
     }
     render() {
         const inputOpts = Object.assign({ name: this.name, id: this.inputId, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleNativeInput, onChange: this.handleNativeChange, type: this.type, required: this.required, value: this.value, error: this.error, icon: this.icon, checked: this.checked }, (this.type === 'number' ? { min: this.min, max: this.max, step: this.step } : {}));
-        return (h("div", { key: 'eaa1d9c1095204c82bd01eab0f19f80eeee64d05' }, this.type === 'checkbox' || this.type === 'radio' ? (this.parsedOptions.length > 0 ? (h("fieldset", { class: "space-y-4 mt-8" }, h("div", { class: "flex justify-between mb-4" }, this.label && (h("eds-input-label", { name: this.inputId || this.name, label: this.label, required: this.required })), this.hint && (h("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.parsedOptions.map((option) => (h("div", { class: "flex items-center gap-x-4 gap-y-4", key: option.value }, h("eds-input", Object.assign({}, inputOpts, { value: option.value, checked: typeof this.value === 'string' && this.value.split(',').includes(String(option.value)) })), h("label", { htmlFor: this.name, class: `input-label-options ${this.disabled ? 'text-lighter' : ''}` }, option.label)))))) : (h("div", { class: "flex items-center gap-x-8" }, h("eds-input", Object.assign({}, inputOpts, { value: this.value, checked: this.value === 'on' || this.checked })), this.label && (h("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required }))))) : (h("div", null, h("div", { class: "flex justify-between mb-4" }, this.label && (h("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required })), this.hint && (h("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.type === 'select' ? (h("eds-input-select", Object.assign({}, inputOpts, { options: this.parsedOptions }))) : this.type === 'file' ? (h("input", { type: "file", id: this.inputId || this.name, name: this.name, onChange: this.onChangeNative, disabled: this.disabled, required: this.required })) : this.type === 'search' ? (h("eds-input-search", { name: "search-box" })) : this.type === 'range' ? ((() => {
+        return (h("div", { key: '8351609cb76699040d692f3a99746970a1498bea' }, this.type === 'checkbox' || this.type === 'radio' ? (this.parsedOptions.length > 0 ? (h("fieldset", { class: "space-y-4" }, h("div", { class: "flex justify-between mb-4" }, this.label && (h("eds-input-label", { name: this.inputId || this.name, label: this.label, required: this.required })), this.hint && (h("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.parsedOptions.map((option) => (h("div", { class: "flex items-center gap-x-4 gap-y-4", key: option.value }, h("eds-input", Object.assign({}, inputOpts, { value: option.value, checked: typeof this.value === 'string' && this.value.split(',').includes(String(option.value)) })), h("label", { htmlFor: this.name, class: `input-label-options ${this.disabled ? 'text-lighter' : ''}` }, option.label)))))) : (h("div", { class: "flex items-center gap-x-8" }, h("eds-input", Object.assign({}, inputOpts, { value: this.value, checked: this.value === 'on' || this.checked })), this.label && (h("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required }))))) : (h("div", null, h("div", { class: "flex justify-between mb-4" }, this.label && (h("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required })), this.hint && (h("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.type === 'select' ? (h("eds-input-select", Object.assign({}, inputOpts, { options: this.parsedOptions }))) : this.type === 'file' ? (h("input", { type: "file", id: this.inputId || this.name, name: this.name, onChange: this.onChangeNative, disabled: this.disabled, required: this.required })) : this.type === 'search' ? (h("eds-input-search", { name: "search-box" })) : this.type === 'range' ? ((() => {
             var _a, _b, _c;
             const rangeProps = {
                 name: inputOpts.name,
@@ -109,7 +109,7 @@ export class EdsInputField {
             const opt = this.parsedOptions;
             const numberValue = typeof this.value === 'string' ? parseFloat(this.value) : this.value || 0;
             return (h("eds-input-range", Object.assign({}, rangeProps, { min: (_a = opt[0]) === null || _a === void 0 ? void 0 : _a.value, max: (_b = opt[1]) === null || _b === void 0 ? void 0 : _b.value, step: (_c = opt[2]) === null || _c === void 0 ? void 0 : _c.value, value: numberValue })));
-        })()) : (h("eds-input", Object.assign({}, inputOpts))))), h("div", { key: '60e6c848d41591b2e9ec8c5cf8dd656ec8562c38', class: "mt-6" }, h("eds-input-footer", { key: 'e9298e01dbab9aa6a98a486286b32024766348d1', id: `${this.name}-footer`, name: this.name, message: this.message, "error-message": this.errorMessage, error: this.error, link: this.link }))));
+        })()) : (h("eds-input", Object.assign({}, inputOpts))))), h("div", { key: '171ca8dfbf4b30a62a05d00f5296b1aaa3d964bd', class: "mt-6" }, h("eds-input-footer", { key: 'c6b7d0a9dc574a5e0dba1e62ff77934e96b4dec1', id: `${this.name}-footer`, name: this.name, message: this.message, "error-message": this.errorMessage, error: this.error, link: this.link }))));
     }
     static get is() { return "eds-input-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eds-link/eds-link.js

@@ -236,7 +236,7 @@ export class EdsLink {
         const labelClasses = this.hideLabelOnSmallScreen
             ? 'hidden lg:flex' // Tailwind example: hidden on small screens, visible on larger
             : '';
-        return (h("a", { key: 'bc82c9ea21f98ed71c812c8366ba8368c3ac5bf4', class: `${classes || ''} ${this.extraClass || ''}`, href: isInteractive ? this.url : undefined, target: this.external && isInteractive ? '_blank' : undefined, rel: this.external && isInteractive ? 'noopener noreferrer' : undefined, tabIndex: isInteractive ? 0 : -1, "aria-label": isIconOnly ? this.ariaLabel || 'Link' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-current": this.current ? 'page' : undefined, role: this.disabled ? 'link' : undefined, download: this.download ? '' : undefined, onClick: (event) => this.handleClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, h("span", { key: 'eed89377d27a476a7d7e70a8c40f3100b8089a0b', class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), this.label && h("span", { key: 'c6d09f0c54e092e53350014d6d89b67c35a8be71', class: labelClasses }, this.label), this.renderRightIcon())));
+        return (h("a", { key: 'c09fd68443e1c98a1bfb679b669f9fecfb349548', class: `${classes || ''} ${this.extraClass || ''}`, href: isInteractive ? this.url : undefined, target: this.external && isInteractive ? '_blank' : undefined, rel: this.external && isInteractive ? 'noopener noreferrer' : undefined, tabIndex: isInteractive ? 0 : -1, "aria-label": isIconOnly ? this.ariaLabel || 'Link' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-current": this.current ? 'page' : undefined, role: this.disabled ? 'link' : undefined, download: this.download ? '' : undefined, onClick: (event) => this.handleClick(event), onKeyDown: (event) => this.handleKeyDown(event) }, h("span", { key: '5bf88be39965ca8693daa611b4ca9a85cefb30d3', class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), this.label && h("span", { key: 'd92b36812200d809cbccfd9da7f2387a7de80699', class: labelClasses }, this.label), this.renderRightIcon())));
     }
     static get is() { return "eds-link"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eds-logo/eds-logo.js

@@ -76,7 +76,7 @@ export class EdsLogo {
     }
     render() {
         const logoContent = this.getLogo();
-        return (h("a", { key: 'e5c4e4701d698282dc85561c8c434f0790fb2401', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, h("div", { key: '32cc8649fe67b6c4a874b5c1aaa6d4d793b4c4c7', innerHTML: logoContent })));
+        return (h("a", { key: '550cb4d73702a6a7053adfb5ebe67ff4201e98ad', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, h("div", { key: '141b0faa05a2d51d3ca97242aa910e53e910ad9d', innerHTML: logoContent })));
     }
     static get is() { return "eds-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eds-modal/eds-modal.css

@@ -42,12 +42,14 @@
     z-index: 50;
 }
 
-.z-9999999 {
-    z-index: 9999999;
+.z-9999991 {
+    z-index: 9999991;
 }
+
 .w-full {
     width: 100%;
-  }
+}
+
 .min-w-full {
     min-width: 100%;
 }
@@ -120,16 +122,20 @@
 
 .top-0 {
     top: 0rem;
-  }
-  .left-0 {
+}
+
+.left-0 {
     left: 0rem;
-  }
+}
+
 .top-20 {
     top: 1.25rem;
 }
+
 .bottom-0 {
     bottom: 0rem;
-  }
+}
+
 .bottom-20 {
     bottom: 1.25rem;
 }
@@ -271,34 +277,47 @@
 @media (min-width: 750px) {
     .md\:bottom-20 {
         bottom: 1.25rem;
-      }
+    }
+
     .md\:w-auto {
         width: auto;
-      }
-      .md\:top-20 {
+    }
+    
+    .md\:min-w-\[500px\] {
+        width: 500px;
+    }
+
+    .md\:top-20 {
         top: 1.25rem;
-      }
-      .md\:top-1\/2 {
+    }
+
+    .md\:top-1\/2 {
         top: 50%;
-      }
+    }
+
     .md\:left-1\/2 {
-      left: 50%;
+        left: 50%;
     }
+
     .md\:flex {
-      display: flex;
+        display: flex;
     }
+
     .md\:hidden {
-      display: none;
+        display: none;
     }
+
     .md\:-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));
+        --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));
     }
+
     .md\:-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));
+        --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));
     }
+
     .md\:gap-y-12 {
-      row-gap: 0.75rem;
+        row-gap: 0.75rem;
     }
-  }
+}

package/dist/collection/components/eds-modal/eds-modal.js

@@ -121,9 +121,9 @@ export class EdsModal {
     render() {
         // Generate a unique id for the title so we can reference it for aria-labelledby.
         const titleId = `modal-title-${this.el.tagName.toLowerCase()}`;
-        return (h("div", { key: '29700a7b84c8728c11232aaaa526638dc6cd3156', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999999 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (h("div", { key: '0cc973541fcde90a0b69a8d3b8a95e54d987fd7d', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
+        return (h("div", { key: 'e0f35ad87e3b21b98d8d37640f660f2fd490d748', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999991 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (h("div", { key: 'cd0bc54ff3e25545709c26f19b2a30f838423250', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
             ,
-            onClick: () => this.close() })), h("div", { key: 'd69445a547c27fccc868bee1dae9537e3e4c9d68', class: `container absolute bg-inverse z-10 ${this.getModalPositionClasses()} grow justify-center` }, h("div", { key: 'e4d3ddcadf49051ebb0fe5c1d12d40f8992a5549', class: `flex justify-between items-center border-b-2 border-softer px-20 py-20  ${this.inverseHeader ? 'bg-strongest text-inverse' : 'bg-dark text-default'}` }, h("span", { key: '6a9e5c1cb187e4684b267859f2150f485d6fcced', id: titleId, class: `f-heading-04 ${this.getTruncateClass()}` }, this.heading), h("eds-button", { key: '7c9cd571b76cc87e13f9b153c4d24844b40e47c7', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8 text-default" })), h("div", { key: '150e61106d25a1a0ecf470abf14ac5c5ba836b64', class: "pt-8 px-20 py-20" }, h("slot", { key: '30100f97aa7504023e43b51fc9bebad20097b480' })))));
+            onClick: () => this.close() })), h("div", { key: '314c45094d1f3b7d1b725341a3294fdca9732a26', class: `container absolute bg-inverse z-10 ${this.getModalPositionClasses()} grow justify-center` }, h("div", { key: '8401bca8601d7681d641c04d16a4efe7ba1a4a9f', class: `flex justify-between items-center border-b-2 border-softer px-20 py-20  ${this.inverseHeader ? 'bg-strongest text-inverse' : 'bg-dark text-default'}` }, h("span", { key: '9a761bf7dc2a97d192a0d280533e6bbcba1871d2', id: titleId, class: `f-heading-04 ${this.getTruncateClass()}` }, this.heading), h("eds-button", { key: '631a15d8b010215d68243bcd43ec5c45899474bf', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8 text-default" })), h("div", { key: '6718fd42a10f6f861fb910e1b32d42607cf8b7bf', class: "pt-8 px-20 py-20" }, h("slot", { key: 'ac9289dd32dcd985d79c882cddb3203b57f42101' })))));
     }
     static get is() { return "eds-modal"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eds-nps/eds-nps.js

@@ -62,12 +62,12 @@ export class EdsNps {
     render() {
         const count = this.max - this.min + 1;
         //onst fallback = 0;
-        return (h("div", { key: '3831baab086cbf44a3d1511885f15bbab23c9cd2', class: "eds-nps" }, h("eds-input-label", { key: 'f9bd8a812d1b65a634dfaa7aae704218dc79468c', id: "nps-question", name: "nps-question", label: this.question }), h("div", { key: '398f5225c5b4071c2570a74a9e642f5059bb7813', role: "group", id: "nps-buttons", "aria-labelledby": "nps-question", class: "grid grid-cols-11", onKeyDown: (e) => this.handleKeyNav(e) }, Array.from({ length: count }, (_, i) => {
+        return (h("div", { key: '51e0d272693fd42d1f239f8498d9a5744dead8d7', class: "eds-nps" }, h("eds-input-label", { key: 'f9d3b65985e221f9608da3aba22cc1dc4dd54417', id: "nps-question", name: "nps-question", label: this.question }), h("div", { key: '00b22eff70fd1dd3d210e17aaef5df2057f99bb7', role: "group", id: "nps-buttons", "aria-labelledby": "nps-question", class: "grid grid-cols-11", onKeyDown: (e) => this.handleKeyNav(e) }, Array.from({ length: count }, (_, i) => {
             const val = this.min + i;
             const isSelected = val === this.selectedValue;
             const tabIndex = isSelected ? 0 : -1;
             return (h("div", { class: "grid-col-span-1", key: val }, h("eds-button", { tabindex: tabIndex, label: `${val}`, "aria-label": `${val}`, intent: isSelected ? 'primary' : 'ghost', "extra-class": "!block !px-0 w-full", triggerClick: () => this.handleClick(val) })));
-        })), h("div", { key: '0acafaae3f2ce522ffbc245c5733ca509d4bf3c1', class: "flex justify-between mt-8" }, h("span", { key: '001e0be00b07ae2e831ea6af0c577a5eeecb9a56', class: "f-ui-04 text-light ml-4" }, this.leftLabel), h("span", { key: '99a12d89ea577fb2bb9c34241a2b9f0f254c284a', class: "f-ui-04 text-light mr-4" }, this.rightLabel))));
+        })), h("div", { key: '7289bd6476a2080be3c02011240e2493b84079e5', class: "flex justify-between mt-8" }, h("span", { key: 'ebfcebd9aa3d11cf298e44987debd8edef1f6e40', class: "f-ui-04 text-light ml-4" }, this.leftLabel), h("span", { key: '002f9878b267439af9f83f9ffd1b52eaef46b929', class: "f-ui-04 text-light mr-4" }, this.rightLabel))));
     }
     static get is() { return "eds-nps"; }
     static get encapsulation() { return "shadow"; }