@ebrains/components 1.0.0 → 1.1.0

package/dist/hydrate/index.mjs

@@ -2561,7 +2561,7 @@ const DocsReact = () => (hAsync("div", null,
     hAsync("eds-code-block", { code: "npm install @ebrains/react", language: "javascript", "copy-label": "Copy Code" }),
     hAsync("eds-section-core", { "section-title": "Example React App", "heading-level": "h3" },
         hAsync("p", null, "This code displays a Stencil-based splash screen that stays visible until an initialization promise resolves (or errors), then hides itself and reveals the main React app content."),
-        hAsync("eds-code-block", { code: "\nimport React, { useMemo, useState } from 'react';\nimport {\n  EdsHeader\n  EdsSplashScreen,\n  EdsMatomoNotice,\n  EdsSteps\n} from '@ebrains/react';\nimport './app.css';\n\n// simulate 2s\nfunction fakeInit(): Promise<void> {\n  return new Promise(resolve => setTimeout(resolve, 2000));\n}\n\nexport function App() {\n  // 1) create init promise\n  const initPromise = useMemo(() => fakeInit(), []);\n\n  // 2) is splash still visible\n  const [splashVisible, setSplashVisible] = useState(true);\n  const [initError, setInitError] = useState<string | null>(null);\n\n  // 3) show the UI after the splash has hidden\n  const showApp = !splashVisible && !initError;\n\n  return (\n    <div>\n      {splashVisible && (\n        <EdsSplashScreen\n          inverse={false}\n          initPromise={initPromise}\n          onSplash={(e: CustomEvent) => {\n            if (e.detail.type === 'hidden') {\n              setSplashVisible(false);\n            } else if (e.detail.type === 'error') {\n              setInitError(e.detail.message);\n              setSplashVisible(false);\n            }\n          }}\n        />\n      )}\n\n      {initError && (\n        <div className='error'>\n          Failed to initialize: {initError}\n        </div>\n      )}\n\n      {/* Show App only when ready */}\n      {showApp && (\n        <>\n          <EdsHeader></EdsHeader>\n          <EdsSteps\n            steps={[\n              {\n                title: 'Introduction',\n                content: 'Begin by familiarizing yourself with the overall process.'\n              },\n              {\n                title: 'Process Overview',\n                content: 'Review the detailed steps and understand the workflow.'\n              }\n            ]}\n            type='linear'\n          />\n\n          <EdsMatomoNotice />\n\n          <div id='root'></div>\n        </>\n      )}\n    </div>\n  );\n}\nexport default App;\n", language: "javascript", "copy-label": "Copy Code" }))));
+        hAsync("eds-code-block", { code: "\nimport React, { useMemo, useState } from 'react';\nimport {\n  EdsHeader,\n  EdsSplashScreen,\n  EdsMatomoNotice,\n  EdsSteps\n} from '@ebrains/react';\nimport './app.css';\n\n// simulate 2s\nfunction fakeInit(): Promise<void> {\n  return new Promise(resolve => setTimeout(resolve, 2000));\n}\n\nexport function App() {\n  // 1) create init promise\n  const initPromise = useMemo(() => fakeInit(), []);\n\n  // 2) is splash still visible\n  const [splashVisible, setSplashVisible] = useState(true);\n  const [initError, setInitError] = useState<string | null>(null);\n\n  // 3) show the UI after the splash has hidden\n  const showApp = !splashVisible && !initError;\n\n  return (\n    <div>\n      {splashVisible && (\n        <EdsSplashScreen\n          inverse={false}\n          initPromise={initPromise}\n          onSplash={(e: CustomEvent) => {\n            if (e.detail.type === 'hidden') {\n              setSplashVisible(false);\n            } else if (e.detail.type === 'error') {\n              setInitError(e.detail.message);\n              setSplashVisible(false);\n            }\n          }}\n        />\n      )}\n\n      {initError && (\n        <div className='error'>\n          Failed to initialize: {initError}\n        </div>\n      )}\n\n      {/* Show App only when ready */}\n      {showApp && (\n        <>\n          <EdsHeader></EdsHeader>\n          <EdsSteps\n            steps={[\n              {\n                title: 'Introduction',\n                content: 'Begin by familiarizing yourself with the overall process.'\n              },\n              {\n                title: 'Process Overview',\n                content: 'Review the detailed steps and understand the workflow.'\n              }\n            ]}\n            type='linear'\n          />\n\n          <EdsMatomoNotice />\n\n          <div id='root'></div>\n        </>\n      )}\n    </div>\n  );\n}\nexport default App;\n", language: "javascript", "copy-label": "Copy Code" }))));
 
 const DocsVue = () => (hAsync("div", null,
     hAsync("h2", null, "Vue Wrappers"),
@@ -2933,10 +2933,10 @@ class EdsAccordion {
      * Adjusts styles based on `switchBg`, `tiny`, `clampText`, and other props.
      */
     render() {
-        return (hAsync("div", { key: 'd2fcce2468130200dd1516902a203c4ca8ae543f', ref: (el) => (this.wrapperRef = el), class: `flex effect-color border-softer relative grid overflow-hidden rounded-lg border-2 p-16 
+        return (hAsync("div", { key: 'addeb5f79d497efcd3eab9f849890adf48a5e275', ref: (el) => (this.wrapperRef = el), class: `flex effect-color border-softer relative grid overflow-hidden rounded-lg border-2 p-16 
           ${this.switchBg && this.isExpanded ? 'bg-inverse' : 'bg-default'} 
           ${this.switchBg ? 'hover:bg-inverse' : ''}
-          ${this.description ? 'min-h-56' : ''}` }, hAsync("h3", { key: 'f59a85e886736b483f6a311a00426340a36dcb71', ref: (el) => (this.headerRef = el), class: "mr-auto f-heading-06 text-left absolute inset-x-16 break-words top-16 pr-40" }, this.heading), hAsync("div", { key: '9fe1d99f46f3c066bbb1e8f4ef695fe87e8fad54', class: "ml-auto" }, hAsync("eds-button", { key: '4d4c16a958df05f1e773fe74fa49647fc94766c7', id: "toggleAccordion", intent: "tertiary", "aria-expanded": this.isExpanded || this.shortContent, "aria-label": "Toggle accordion", "aria-controls": "accordionSection", class: `effect-color flex w-full items-center justify-between rounded-md outline-none focus:outline-none`, onClick: this.handleClick, icon: "chevron-down" })), hAsync("div", { key: '5d84ffe8032834575d165f7a5e097539de73350f', class: `w-full`, style: Number.isFinite(this.headerHeight) ? { marginTop: `${this.headerHeight}px` } : {} }, this.description ? (hAsync("span", { class: `text-light ${!this.isExpanded && this.clampText ? 'line-clamp-1' : ''}` }, this.description)) : null, hAsync("section", { key: '1813aea1369b8883cd45088799f9715cf8fc0556', id: "accordionSection", role: "region", "aria-labelledby": "accordionHeader", "aria-hidden": !this.isExpanded, class: `z-1 effect-height relative h-0 w-full ${!this.isExpanded && this.clampText ? 'overflow-hidden' : ''}`, style: { height: this.isExpanded ? 'auto' : '0' } }, hAsync("div", { key: 'a9a95adbb819530f426045c55ca1a02f3a778f0a', ref: (el) => (this.childContentRef = el), class: `accordion-content effect-color pt-4`, "aria-hidden": !this.isExpanded }, hAsync("span", { key: '2518e3243e0bd199061ac255922d661e0558bdc8', class: `${!this.isExpanded && this.clampText ? 'line-clamp-2' : ''}` }, hAsync("slot", { key: '3f3ab74926e7e45d4aacc4c7003c05be3c6b82c3' })))))));
+          ${this.description ? 'min-h-56' : ''}` }, hAsync("h3", { key: 'c522c074c205e471f9e95991a03f703bec8d3219', ref: (el) => (this.headerRef = el), class: "mr-auto f-heading-06 text-left absolute inset-x-16 break-words top-16 pr-40" }, this.heading), hAsync("div", { key: '5ee474856bf9a3cdc732c27c6fccb68c24e0dc3b', class: "ml-auto" }, hAsync("eds-button", { key: 'a274b1d82f30607f61103433aa6ceb745464f530', id: "toggleAccordion", intent: "tertiary", "aria-expanded": this.isExpanded || this.shortContent, "aria-label": "Toggle accordion", "aria-controls": "accordionSection", class: `effect-color flex w-full items-center justify-between rounded-md outline-none focus:outline-none`, onClick: this.handleClick, icon: "chevron-down" })), hAsync("div", { key: '69a638f2dc3c5ebff95fc4049c47abd4884b13ad', class: `w-full`, style: Number.isFinite(this.headerHeight) ? { marginTop: `${this.headerHeight}px` } : {} }, this.description ? (hAsync("span", { class: `text-light ${!this.isExpanded && this.clampText ? 'line-clamp-1' : ''}` }, this.description)) : null, hAsync("section", { key: '820f39174c6e6d42e7c4407a2a4175fb077f86ac', id: "accordionSection", role: "region", "aria-labelledby": "accordionHeader", "aria-hidden": !this.isExpanded, class: `z-1 effect-height relative h-0 w-full ${!this.isExpanded && this.clampText ? 'overflow-hidden' : ''}`, style: { height: this.isExpanded ? 'auto' : '0' } }, hAsync("div", { key: '3d9ea33856d350434d26c07ddc9d230e28d8c344', ref: (el) => (this.childContentRef = el), class: `accordion-content effect-color pt-4`, "aria-hidden": !this.isExpanded }, hAsync("span", { key: '1d0761d7894d5ba4d7c7f5051031857555ce0b0c', class: `${!this.isExpanded && this.clampText ? 'line-clamp-2' : ''}` }, hAsync("slot", { key: 'ed31f44736a8ce85a7df4216b2f90c2ca7d9b873' })))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsAccordionStyle0; }
@@ -3101,12 +3101,12 @@ class EdsAlert {
         linkElement.dispatchEvent(event);
     }
     render() {
-        return (hAsync("div", { key: '90eae6088fb792c671eca1d74d9a6e7d212c2c1c', class: alertStyles({
+        return (hAsync("div", { key: '5252aca583e87d8c3249c501e55368e340ef0d64', class: alertStyles({
                 intent: this.intent,
                 brd: this.brd,
                 direction: this.direction,
                 withBtn: this.withBtn
-            }), role: "alert" }, hAsync("p", { key: '201a9e6352350dbe9d4f1ab137a669f212519ea5', class: "f-ui-01 py-8", innerHTML: this.message }), this.withBtn &&
+            }), role: "alert" }, hAsync("p", { key: 'bb23c94e802ec5e287a2b8619277e83de173b498', class: "f-ui-01 py-8", innerHTML: this.message }), this.withBtn &&
             (this.pressableUrl ? (hAsync("eds-link", { class: "eds-alert-link", label: this.pressableLabel, url: this.pressableUrl, intent: "secondary", external: true })) : null)));
     }
     get el() { return getElement(this); }
@@ -3241,7 +3241,7 @@ class EdsAvatar {
      * @returns {JSX.Element} The rendered avatar component.
      */
     render() {
-        return (hAsync("div", { key: '7c207192778b86ce5a24816637cf6e6239310eca', class: this.containerClasses }, this.picture ? (hAsync("eds-img", { src: this.picture, width: 54, height: 54, sizes: "120px", alt: `${this.firstName} ${this.lastName}`, lazyload: true, withBg: true })) : (hAsync("abbr", { title: this.computedInitials || `${this.firstName} ${this.lastName}`, class: "!no-underline f-ui-01" }, this.computedInitials))));
+        return (hAsync("div", { key: 'b7eff7ae1a1dea3509041e39316b49b673dbdf17', class: this.containerClasses }, this.picture ? (hAsync("eds-img", { src: this.picture, width: 54, height: 54, sizes: "120px", alt: `${this.firstName} ${this.lastName}`, lazyload: true, withBg: true })) : (hAsync("abbr", { title: this.computedInitials || `${this.firstName} ${this.lastName}`, class: "!no-underline f-ui-01" }, this.computedInitials))));
     }
     static get style() { return EdsAvatarStyle0; }
     static get cmpMeta() { return {
@@ -3272,7 +3272,7 @@ class EdsBlockBreak {
         this.inverse = false;
     }
     render() {
-        return hAsync("hr", { key: 'fe48c93d6cb5648749bc050599fdfcb1712d1291', class: `${this.inverse ? 'border-default' : 'border-softer'}  my-16 inline-block w-full border-t-2` });
+        return hAsync("hr", { key: 'b604a776cae7edeee189e00af6993b42b57203f0', class: `${this.inverse ? 'border-default' : 'border-softer'}  my-16 inline-block w-full border-t-2` });
     }
     static get style() { return EdsBlockBreakStyle0; }
     static get cmpMeta() { return {
@@ -3432,7 +3432,7 @@ class EdsBreadcrumb {
      */
     render() {
         const itemsToRender = this.getTruncatedItems();
-        return (hAsync("nav", { key: '2651e18e4c157f49e1da2ef93d4f68b9497118e4', "aria-label": "Breadcrumb" }, hAsync("ol", { key: 'd1f5bb18bb35df9455a4c7a566850d59eb657242', class: "flex items-center space-x-2" }, itemsToRender.map((item, index) => {
+        return (hAsync("nav", { key: 'db769320b42e627fffd71676c1e0551646f1de70', "aria-label": "Breadcrumb" }, hAsync("ol", { key: '6cef8ed43cabcee73cb4ad4fb26f809d0690c0ec', class: "flex items-center space-x-2" }, itemsToRender.map((item, index) => {
             const isLast = index === itemsToRender.length - 1;
             return (hAsync("li", { class: "flex items-center" }, !item.isHidden ? ((() => {
                 const { fullLabel } = this.getLabels(item, isLast);
@@ -3639,7 +3639,7 @@ class EdsButton {
             iconSmall: this.iconSmall
         });
         const ElementType = this.elementType;
-        return (hAsync(ElementType, { key: 'b51281f8946bbf5a22b8fec9ec2d66ea4697bb23', "aria-label": this.label || this.ariaLabel || undefined, "aria-disabled": this.elementType === 'button' ? this.disabled : undefined, disabled: this.elementType === 'button' ? this.disabled : undefined, class: `${classes || ''} ${this.extraClass || ''}`, onClick: (event) => this.handleClick(event) }, this.label && hAsync("span", { key: 'c1df49fe70a7930d4c87f8130ef1102e503cd0fc', class: this.loading ? 'opacity-0' : '' }, this.label), this.loading && (hAsync("span", { key: 'e56515527843d11be53d66aa7598fc2fdf94d054', class: "absolute inset-0 flex items-center justify-center" }, hAsync("span", { key: 'a50932ac2d5db24d50a3b10a30d07043e0354c62', class: "loader", style: {
+        return (hAsync(ElementType, { key: 'ecdd901c70578c07ef094aadbcd287588d4ba705', "aria-label": this.label || this.ariaLabel || undefined, "aria-disabled": this.elementType === 'button' ? this.disabled : undefined, disabled: this.elementType === 'button' ? this.disabled : undefined, class: `${classes || ''} ${this.extraClass || ''}`, onClick: (event) => this.handleClick(event) }, this.label && hAsync("span", { key: 'af8d0ca1c5c3e54f9db3066931a69d3a5a812666', class: this.loading ? 'opacity-0' : '' }, this.label), this.loading && (hAsync("span", { key: '29b72c15e80f46e023f829568f58d8a8dca82b78', class: "absolute inset-0 flex items-center justify-center" }, hAsync("span", { key: 'bad8bd059b1312ca3f5ab173b1203eb395e9bbd8', class: "loader", style: {
                 border: `3px solid ${this.intent === 'secondary' ? 'rgba(255, 255, 255, .3)' : 'rgba(0, 0, 0, .3)'}`,
                 borderBottomColor: this.intent === 'secondary' ? '#fff' : '#000'
             } }))), this.icon ? (hAsync("eds-icon-wrapper", { class: `
@@ -3698,7 +3698,7 @@ class EdsCardDesc {
         return this.truncate && this.truncateLines ? `line-clamp-${this.truncateLines}` : '';
     }
     render() {
-        return (hAsync("p", { key: 'f2eec4a947de74a1e36bb13fdd2bfeb7a9f711b3', class: "text-light f-ui-03-light" }, hAsync("span", { key: '444ffa34c3e8cac12af2f396144fd182d49c6baa', class: this.getTruncateClass() }, this.description)));
+        return (hAsync("p", { key: '2421ea469339e3d56fc5c0ebbec213eeb1a2a9cf', class: "text-light f-ui-03-light" }, hAsync("span", { key: 'd024adda16a85bf2913803c06eb05af3b4af6bb9', class: this.getTruncateClass() }, this.description)));
     }
     static get style() { return EdsCardDescStyle0; }
     static get cmpMeta() { return {
@@ -4017,7 +4017,7 @@ class EdsCardProject {
             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 (hAsync("article", { key: '7a69b9f5fc30ce389267a064e82aa2cf78b676d1', class: cardClasses, onClick: (event) => this.handleClick(event) }, hAsync("div", { key: '8495c7b6655418741b1d208f06f003d4ec2eaf79', class: `flex grow flex-col ${this.vertical ? 'min-h-156' : ''}` }, hAsync("div", { key: '803b274d099072e055c484e818732a48ff27ebab', class: "lg:max-w-[720px]" }, hAsync("eds-card-title", { key: '18b1d058c9d92e3df264c5f60cec0adc8f14f19e', "heading-level": this.headingLevel, titleClass: this.image ? 'f-ui-01' : undefined, "card-title": this.titleProject, url: this.url }), this.editorialTitle && (hAsync("span", { key: '1854001686cae69c50a97ed50534ae4329d3017a', class: `block ${this.vertical ? 'f-ui-02' : 'mt-4 f-heading-06'}` }, this.editorialTitle))), this.categoryTitle && (hAsync("div", { key: 'a5e741ce22ace338988a1a0d6f0d5c2740eb685b', class: "mt-auto flex items-center gap-x-12 pt-12" }, ((_a = this.categoryTitle) === null || _a === void 0 ? void 0 : _a.length) && hAsync("eds-tag", { key: 'c1136aef565b3a35bee7d7c254434b6c06f3cf65', label: this.categoryTitle })))), this.parsedImage && (hAsync("div", { key: '531cb24eafadd52397a138735436e0501b45cf76', class: imageClasses }, hAsync("div", { key: 'c692a10bfa0032d4e43fe35090e38dde3e0401f3', class: "aspect-1x1 w-full" }, hAsync("eds-img", Object.assign({ key: '490983736b4cd9de3b2cfbafe11be15802746afe', sizes: this.vertical ? this.parsedImage.sizes || '' : '192px' }, this.parsedImage)))))));
+        return (hAsync("article", { key: '8b4707ad7689824c50db3112b5844e28beb31533', class: cardClasses, onClick: (event) => this.handleClick(event) }, hAsync("div", { key: '5cb7673378ab23826202b34034247145b7289bda', class: `flex grow flex-col ${this.vertical ? 'min-h-156' : ''}` }, hAsync("div", { key: '8111b523840c8b363bbb422c1f314ce07057ea92', class: "lg:max-w-[720px]" }, hAsync("eds-card-title", { key: 'a326e1384873edb9bfc86c33e3abeb95064cc8db', "heading-level": this.headingLevel, titleClass: this.image ? 'f-ui-01' : undefined, "card-title": this.titleProject, url: this.url }), this.editorialTitle && (hAsync("span", { key: '5e2de62642363533a950f3e923e3f4dfc64c56c1', class: `block ${this.vertical ? 'f-ui-02' : 'mt-4 f-heading-06'}` }, this.editorialTitle))), this.categoryTitle && (hAsync("div", { key: '424fed86ec4e714dc5f3644d85e5670d8be56d7f', class: "mt-auto flex items-center gap-x-12 pt-12" }, ((_a = this.categoryTitle) === null || _a === void 0 ? void 0 : _a.length) && hAsync("eds-tag", { key: 'b6961cc23835a9b3d1abae47e1c4224a29255164', label: this.categoryTitle })))), this.parsedImage && (hAsync("div", { key: '69564e0c65f6422a6ccc3957a8080e7e494461bb', class: imageClasses }, hAsync("div", { key: 'e47a21a5356459936b6f528a3aba50240851fcf2', class: "aspect-1x1 w-full" }, hAsync("eds-img", Object.assign({ key: 'f64af6387cdef28619aa8a0465d4a50ec3a95007', sizes: this.vertical ? this.parsedImage.sizes || '' : '192px' }, this.parsedImage)))))));
     }
     get el() { return getElement(this); }
     static get cmpMeta() { return {
@@ -4106,7 +4106,7 @@ class EdsCardTags {
         this.tags = [];
     }
     render() {
-        return (hAsync("div", { key: '7547e8ffafc22884fb26e7b5cd1da49e588fc590', class: "flex flex-wrap gap-y-4" }, this.tags.map((tag, index) => (hAsync("eds-tag", { key: index, intent: this.accent ? 'accent' : 'default', label: tag })))));
+        return (hAsync("div", { key: '5da9fcbc472476a7b438451e563586643a818bc0', class: "flex flex-wrap gap-y-4" }, this.tags.map((tag, index) => (hAsync("eds-tag", { key: index, intent: this.accent ? 'accent' : 'default', label: tag })))));
     }
     static get style() { return EdsCardTagsStyle0; }
     static get cmpMeta() { return {
@@ -4170,7 +4170,7 @@ class EdsCardTitle {
     render() {
         //const Tag = this.getTag();
         const Heading = this.headingLevel;
-        return (hAsync(Heading, { key: '9914950b1581456a3a875ed7383975710c05fa7f', class: this.getTitleClass() }, hAsync("a", { key: '9b3298d8bacd8fbaecd8c714329ef5e6ac7192c7', class: "break-words after:absolute after:inset-0 after:z-10 after:content-[''] focus:outline-none", href: this.url, target: this.externalLink ? '_blank' : undefined, rel: this.externalLink ? 'noopener noreferrer' : undefined }, this.cardTitle)));
+        return (hAsync(Heading, { key: '494d8b7ea90ccb93cf0395374951e90c89a59d3a', class: this.getTitleClass() }, hAsync("a", { key: 'ab739472fd796767cd6e7ab4f4c09bcf24ec200a', class: "break-words after:absolute after:inset-0 after:z-10 after:content-[''] focus:outline-none", href: this.url, target: this.externalLink ? '_blank' : undefined, rel: this.externalLink ? 'noopener noreferrer' : undefined }, this.cardTitle)));
     }
     static get style() { return EdsCardTitleStyle0; }
     static get cmpMeta() { return {
@@ -4258,7 +4258,7 @@ class EdsCardTool {
         });
     }
     render() {
-        return (hAsync("article", { key: 'b3f0c0f3588304fb36f1c395b69b723edbfa8c95', class: `${this.el.tagName.toLowerCase()} ${this.articleClasses()}`, onClick: () => this.handleClick() }, hAsync("eds-card-title", { key: '12f9d1363b3d171912eb00117d99056065fbcb33', "heading-level": this.headingLevel, titleClass: this.image ? 'f-ui-01' : undefined, "card-title": this.cardTitle, url: this.url, "external-link": this.external, hierarchy: this.hierarchy }), this.description && (hAsync("eds-card-desc", { key: '780c4b035e0fff1911ee4b8b04a0729cd182d877', class: "mt-8", "truncate-lines": "3", description: this.description })), this.image ? (hAsync("eds-img", { src: this.image, alt: "Sample Image", width: 200, height: 150 })) : this.avatar || this.shortAbbreviation ? (hAsync("eds-avatar", { class: "order-first mb-12", picture: this.avatar, initials: this.shortAbbreviation })) : null, hAsync("div", { key: 'a6878ba6bb2086a334282b10750234f4251c6334', class: "flex flex-wrap gap-y-4" }, this.parsedTags.map((tag, index) => (hAsync("eds-tag", { key: index, intent: tag.style, label: tag.label }))))));
+        return (hAsync("article", { key: '465a4593a4d28c5bfcef7325be7674b6301bc275', class: `${this.el.tagName.toLowerCase()} ${this.articleClasses()}`, onClick: () => this.handleClick() }, hAsync("eds-card-title", { key: '5d6c13f582bd89f03d95aa9027b83d8d4c4184ca', "heading-level": this.headingLevel, titleClass: this.image ? 'f-ui-01' : undefined, "card-title": this.cardTitle, url: this.url, "external-link": this.external, hierarchy: this.hierarchy }), this.description && (hAsync("eds-card-desc", { key: '4872956b7d97e222abd8e429c73a7e97fe1f7a06', class: "mt-8", "truncate-lines": "3", description: this.description })), this.image ? (hAsync("eds-img", { src: this.image, alt: "Sample Image", width: 200, height: 150 })) : this.avatar || this.shortAbbreviation ? (hAsync("eds-avatar", { class: "order-first mb-12", picture: this.avatar, initials: this.shortAbbreviation })) : null, hAsync("div", { key: '10c20ab24e836c06ba2da070cbcf21cf11537e17', class: "flex flex-wrap gap-y-4" }, this.parsedTags.map((tag, index) => (hAsync("eds-tag", { key: index, intent: tag.style, label: tag.label }))))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCardToolStyle0; }
@@ -6770,7 +6770,7 @@ class EdsCodeBlock {
         return this.code; // Fallback if language is not provided or unsupported
     }
     render() {
-        return (hAsync("div", { key: '6c1a418d4cf1d02ea9216f9196cbbdbfdf7f7315', class: "relative bg-stronger rounded-sm" }, hAsync("div", { key: '118cfa439e27f3b6c8ed7f3308535a744c1fac29', class: "text-inverse flex justify-between items-center p-8" }, this.language ? (hAsync("span", { class: "f-ui-03" }, this.language.toUpperCase())) : (hAsync("pre", { class: "bg-stronger pl-8", role: "region", "aria-label": "Code block without language" }, hAsync("code", { innerHTML: this.getHighlightedCode() }))), hAsync("span", { key: '5c557849fb320c69ec830f7028f9e0ee7099d5f1', "aria-hidden": "true", class: "w-20 h-20 mt-8" }, hAsync("eds-icon-wrapper", { key: 'c11a154a82a8b3eaff418f235a7820209579554b', icon: this.copied ? 'success' : 'copy', onClick: () => this.copyToClipboard() })), hAsync("span", { key: '9537d56544ca139ea847d34091c093c7f852f12c', class: "sr-only" }, "Copy Code")), this.language && (hAsync("pre", { key: '8cc48bb7da216db0e181587a33c25dc88b91bbbc', class: `language-${this.language} bg-stronger pl-8 pb-8`, role: "region", "aria-label": `Code block in ${this.language}` }, hAsync("code", { key: '7fd391c14a4344fd7e98ad5d32283a498085064d', innerHTML: this.getHighlightedCode() })))));
+        return (hAsync("div", { key: '7550f1c5e29a9be39614404d51dfec9a7aa194a9', class: "relative bg-stronger rounded-sm" }, hAsync("div", { key: '8e654051ec6105e051af723e056b4151afc4305c', class: "text-inverse flex justify-between items-center p-8" }, this.language ? (hAsync("span", { class: "f-ui-03" }, this.language.toUpperCase())) : (hAsync("pre", { class: "bg-stronger pl-8", role: "region", "aria-label": "Code block without language" }, hAsync("code", { innerHTML: this.getHighlightedCode() }))), hAsync("span", { key: '1f558301727adb451524850b352844d7658f33a8', "aria-hidden": "true", class: "w-20 h-20 mt-8" }, hAsync("eds-icon-wrapper", { key: '7def1f38f949c32d6138d88a0a7edf9655852491', icon: this.copied ? 'success' : 'copy', onClick: () => this.copyToClipboard() })), hAsync("span", { key: '9eabcd54f3bcdc1c4627a7ca7e22fd38e9755ca6', class: "sr-only" }, "Copy Code")), this.language && (hAsync("pre", { key: 'd15dce4b1692bf1956e1b3cb3586dde4d9561f1b', class: `language-${this.language} bg-stronger pl-8 pb-8`, role: "region", "aria-label": `Code block in ${this.language}` }, hAsync("code", { key: 'ad7eb7b40aaab69b6bc929c632ce4736fe3c39a5', innerHTML: this.getHighlightedCode() })))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsCodeBlockStyle0; }
@@ -6954,14 +6954,14 @@ class EdsDropdown {
      * @returns {JSX.Element} The rendered dropdown component.
      */
     render() {
-        return (hAsync("div", { key: 'c7044a1dabb4f65fe143ac3202dd0d1af4e706c2', class: "z-focus relative", ref: (el) => (this.dropdownContent = el) }, hAsync("eds-button", { key: 'fa5812e59ea886a0adcba75576f07e94e7b0f713', label: this.label, "aria-label": this.ariaLabel, icon: this.icon, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu" }), hAsync("nav", { key: 'c0daa734601dbfcd290d5db8cc25fcd4b82dfdad', role: "menu", class: {
+        return (hAsync("div", { key: 'eb48745937126e580737c1da6787c3f16c06ba9e', class: "z-focus relative", ref: (el) => (this.dropdownContent = el) }, hAsync("eds-button", { key: '3af6863201b1c25ad66e9f8c52d9e13505d742a3', label: this.label, "aria-label": this.ariaLabel, icon: this.icon, intent: this.intent, onClick: this.handleClick, "aria-expanded": this.isOpen.toString(), "aria-haspopup": "menu" }), hAsync("nav", { key: 'c225074b3fbee543966523f8cd1c146485bc04bd', role: "menu", class: {
                 'shadow-small bg-inverse border-softest z-10 z-on-top absolute top-full mt-4 flex flex-col gap-y-4 border-2 p-8': true,
                 'left-4': this.dropdownPos === 'left' && this.dropdownOffset,
                 'left-0': this.dropdownPos === 'left' && !this.dropdownOffset,
                 'right-4': this.dropdownPos === 'right' && this.dropdownOffset,
                 'right-0': this.dropdownPos === 'right' && !this.dropdownOffset,
                 'rounded-lg': this.rounded
-            }, style: { display: this.isOpen ? 'block' : 'none' }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, hAsync("slot", { key: '6ca4e774160924fa248db790f33b81e374653569' }))));
+            }, style: { display: this.isOpen ? 'block' : 'none' }, "aria-label": "Dropdown", "aria-hidden": !this.isOpen }, hAsync("slot", { key: '6a7ba94045d366d20c6618845692d977f20437e3' }))));
     }
     get host() { return getElement(this); }
     static get style() { return EdsDropdownStyle0; }
@@ -7114,9 +7114,9 @@ class EdsFooter {
      * @returns {JSX.Element} The rendered JSX for the footer component.
      */
     render() {
-        return (hAsync("footer", { key: '7bbc8cd8e0e3a153dc30bb3569e83afc0bc09b0a' }, this.social ? (hAsync("div", { class: "border-softest border-t-2 pt-20 md:pt-28" }, hAsync("div", { class: "container pb-20" }, hAsync("div", { class: "grid-layout" }, hAsync("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, hAsync("eds-social-networks", { class: "mt-28" })))))) : null, hAsync("div", { key: '9ee8ada698546344b18e557ee1de76042cd727ed', class: `border-softest ${this.social ? 'border-t-2' : ''} pb-28 pt-20 md:pt-28` }, hAsync("div", { key: 'e795e5bba0273b4147c66ed667142997bc0cbaff', class: "container flex items-center gap-20 lg:flex-nowrap" }, hAsync("div", { key: 'fa09a0dbccb035b1e4f496aa447aca241bcc2415', class: "flex items-center gap-x-12" }, hAsync("a", { key: '273bbee5c7353fa4ab0ac30f30a190bae250546c', target: "_blank", rel: "noopener noreferrer", class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-2020_en", "aria-label": "Learn about Horizon 2020 funding" }, hAsync("eds-img", { key: '4568610de97ad886e26195bde656609e2584b792', width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg", alt: "European Union Flag" }))), hAsync("div", { key: '65dc6a5b0da9d69b0b43ed738c9612293ef64e96' }, hAsync("div", { key: 'a89180b8f308502dfd864d5aab0702f262718cc8', class: "f-ui-04 text-light" }, hAsync("p", { key: '54a69763c38a7986008f9b553fb6b75e5a36d255' }, this.fundedBy), hAsync("div", { key: '9378c48e766a2df4d14805c8777d5d98a2d016ce', class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap inline-block" }, hAsync("span", { key: 'ef939799150dd7ea91f72de94b1e564039c1e900', class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline mr-4" }, "\u00A9 ", this.rightsReserved), this.enableCookiesSettings ? (hAsync("eds-link", { label: this.cookiesPreferences, intent: "underline", "extra-class": "f-ui-04", onClick: () => {
+        return (hAsync("footer", { key: '7bbc8cd8e0e3a153dc30bb3569e83afc0bc09b0a' }, this.social ? (hAsync("div", { class: "border-softest border-t-2 pt-20 md:pt-28" }, hAsync("div", { class: "container pb-20" }, hAsync("div", { class: "grid-layout" }, hAsync("div", { class: "grid-col-span-12 lg:grid-col-span-5" }, hAsync("eds-social-networks", { class: "mt-28" })))))) : null, hAsync("div", { key: '9ee8ada698546344b18e557ee1de76042cd727ed', class: `border-softest ${this.social ? 'border-t-2' : ''} pb-28 pt-20 md:pt-28` }, hAsync("div", { key: 'e795e5bba0273b4147c66ed667142997bc0cbaff', class: "container flex items-center gap-20 lg:flex-nowrap" }, hAsync("div", { key: 'fa09a0dbccb035b1e4f496aa447aca241bcc2415', class: "flex items-center gap-x-12" }, hAsync("a", { key: '578d6a8463e65d07278f8328c108ee266cfba2b8', target: "_blank", rel: "noopener noreferrer", class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0", href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-europe_en", "aria-label": "Learn about Horizon Europe funding" }, hAsync("eds-img", { key: '5b9e987c2ecf62fb4f44c1faacad7c569a149805', width: 54, height: 41, src: "https://www.ebrains.eu/flags/4x3/eu.svg", alt: "European Union Flag" }))), hAsync("div", { key: 'df75949c0718b8fb7dd449a6e7df39d332da366f' }, hAsync("div", { key: 'f83d31b16d0601cd456d5cb72e9fa2adb29a2b66', class: "f-ui-04 text-light" }, hAsync("p", { key: 'dcdf09d78ca64c5391d56fe5ed69bab987cbf67b' }, this.fundedBy), hAsync("div", { key: 'af279fb5dfdf0a8f1f85e6ce7446dc3a0eeac397', class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap inline-block" }, hAsync("span", { key: '026b41fa6162ffb6825ccf98364b4caf64b6457a', class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline mr-4" }, "\u00A9 ", this.rightsReserved), this.enableCookiesSettings ? (hAsync("eds-link", { label: this.cookiesPreferences, intent: "underline", "extra-class": "f-ui-04", onClick: () => {
                 this.toggleCookiesConsent();
-            } })) : null))), hAsync("div", { key: '3b5388855844f5857e4d6a2b8d19d204b681ca40', class: "ml-auto pl-12" }, this.enableScrollTop ? (hAsync("eds-button", { id: "backToTop", "aria-hidden": "true", "aria-label": this.backToTopAriaLabel, intent: "ghostInverse", icon: "chevron-up", onClick: this.backToTop, class: "transition-all transition duration-75 opacity-0 " })) : null)))));
+            } })) : null))), hAsync("div", { key: '27cb561815d6918567ab8cfa1148019aca8aeda0', class: "ml-auto pl-12" }, this.enableScrollTop ? (hAsync("eds-button", { id: "backToTop", "aria-hidden": "true", "aria-label": this.backToTopAriaLabel, intent: "ghostInverse", icon: "chevron-up", onClick: this.backToTop, class: "transition-all transition duration-75 opacity-0 " })) : null)))));
     }
     static get style() { return EdsFooterStyle0; }
     static get cmpMeta() { return {
@@ -7315,6 +7315,9 @@ class EdsForm {
         this.errors = {};
         this.parsedFields = [];
     }
+    async setData(newData) {
+        this.populateFormWithInitData(newData);
+    }
     componentWillLoad() {
         this.parseFields(this.fields);
         // Emit context for each eds-link element after the component is fully loaded
@@ -7487,6 +7490,14 @@ class EdsForm {
         // Update the errors state and the hasError flag.
         this.errors = newErrors;
         this.hasError = Object.keys(newErrors).length > 0;
+        // Emit the updated form state.
+        this.form.emit({
+            event: 'input',
+            field: field.name,
+            value: target.type === 'checkbox' ? this.values[field.name] : target.value,
+            message: `${field.name} updated`
+            //data: this.makeFormData()
+        });
     }
     handleSubmit() {
         var _a, _b;
@@ -7547,13 +7558,13 @@ class EdsForm {
     render() {
         const hiddenFields = this.parsedFields.filter((field) => field.type === 'hidden');
         const otherFields = this.parsedFields.filter((field) => field.type !== 'hidden');
-        return (hAsync("form", { key: '76fbc3f587eaac0bd53553663f072e5066914ae5', ref: (el) => (this.formEl = el), autocomplete: "on", onSubmit: this.handleSubmit }, hAsync("div", { key: '64d99d4ac7e1cb8e4bfe436bb236648201dcbc29' }, hAsync("slot", { key: '9c257d29146b620367773726e65eaf680d3d010b' }), hiddenFields.map((field, index) => (hAsync("eds-input", { key: index, type: "hidden", name: field.name, value: field.value }))), otherFields.map((field, index) => {
+        return (hAsync("form", { key: '1418bbac3ea7c994bf363602e6ddd18ed3c6c661', ref: (el) => (this.formEl = el), autocomplete: "on", onSubmit: this.handleSubmit }, hAsync("div", { key: 'ae6f05d50a1c32312e585d55f0b5d64b0dd1fc9c' }, hAsync("slot", { key: '09c9ddd0d3b77ae9cbcb54389b799af7a6fc6c9e' }), hiddenFields.map((field, index) => (hAsync("eds-input", { key: index, type: "hidden", name: field.name, value: field.value }))), otherFields.map((field, index) => {
             var _a, _b;
             if (!this.isFieldVisible(field)) {
                 return null;
             }
             return (hAsync("eds-input-field", { key: index, name: field.name, id: `${this.name}_${field.name}`, label: field.label, placeholder: field.placeholder, value: this.values[field.name] || null, type: field.type, icon: field.icon || null, disabled: field.disabled, required: field.required, maxLength: field.maxlength, hint: field.hint, link: field.link, message: field.message, error: ((_a = this.errors[field.name]) === null || _a === void 0 ? void 0 : _a.length) > 0, errorMessage: (_b = this.errors[field.name]) === null || _b === void 0 ? void 0 : _b.join('<br />'), onInput: (e) => this.handleInput(e, field), onChange: (e) => this.handleChange(e, field), class: index > 0 ? 'mt-20' : '', options: field.options }));
-        })), this.formBtn && (hAsync("div", { key: 'ba7908ab85c6368aeff6824fd402b78b514d2292', class: "mt-20" }, hAsync("eds-button", { key: '84efe452f55b2898e5747a01b0dc6033ba14da7a', intent: "primary", label: this.formBtnLabel, disabled: this.isSubmitting, loading: this.isSubmitting, onClick: () => this.handleSubmit() })))));
+        })), this.formBtn && (hAsync("div", { key: 'af6ce29d25ae2e7c71537618456308891ff8abf4', class: "mt-20" }, hAsync("eds-button", { key: '1442f4f6b924533f9aa46bd22e1d0adf69561370', intent: "primary", label: this.formBtnLabel, disabled: this.isSubmitting, loading: this.isSubmitting, onClick: () => this.handleSubmit() })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -7576,6 +7587,7 @@ class EdsForm {
             "hasError": [32],
             "errors": [32],
             "parsedFields": [32],
+            "setData": [64],
             "getData": [64]
         },
         "$listeners$": undefined,
@@ -7837,7 +7849,7 @@ class EdsGauge {
         const textStyle = {
             fontSize: `${fontSize}px`
         };
-        return (hAsync("div", { key: 'a549808bcd0fc64583f90f284a7b139386e71be7', role: "progressbar", "aria-valuemin": this.valueMin, "aria-valuemax": this.valueMax, "aria-valuenow": clamped, "aria-label": `Gauge value: ${clamped} of ${this.valueMax}`, class: "relative inline-block rounded-full overflow-hidden", style: containerStyle }, hAsync("div", { key: 'c3efb2d512f96e4c3a9371416c6d9bb938cab43e', class: "absolute bg-inverse rounded-full", style: maskStyle }), hAsync("div", { key: '7a6254e22240301b6716a2d6fed785196a39cdd8', class: "absolute inset-0 flex items-center justify-center" }, hAsync("span", { key: '78d8d1b7c442f75947b2813bbb569c566357c121', class: "f-body-01 text-default", style: textStyle }, clamped))));
+        return (hAsync("div", { key: '2918e034b24749fd1fcad84f4a8614043c6a9ea2', role: "progressbar", "aria-valuemin": this.valueMin, "aria-valuemax": this.valueMax, "aria-valuenow": clamped, "aria-label": `Gauge value: ${clamped} of ${this.valueMax}`, class: "relative inline-block rounded-full overflow-hidden", style: containerStyle }, hAsync("div", { key: 'a24d393bfcdbd45019f7a560c4af0330c720af0c', class: "absolute bg-inverse rounded-full", style: maskStyle }), hAsync("div", { key: '712fc9211b6e90afdf7063a4e6a6af74ec88dfdd', class: "absolute inset-0 flex items-center justify-center" }, hAsync("span", { key: '88d3ffc3fea9ff77247b4ecbb4af3a6ac39c1cb4', class: "f-body-01 text-default", style: textStyle }, clamped))));
     }
     static get style() { return EdsGaugeStyle0; }
     static get cmpMeta() { return {
@@ -9918,7 +9930,7 @@ class EdsIconArrowDiagonal {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '1c7405c12d1741c3dcfe117a04ea4ef5af200590', class: this.class, innerHTML: arrowDiagonal });
+        return hAsync("span", { key: 'd178d36fd0888a40da0873bfd8abe862770e06e9', class: this.class, innerHTML: arrowDiagonal });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9941,7 +9953,7 @@ class EdsIconArrowRight {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '557b38fd6253b4a29c4cf2ec2b9f79355ceca358', class: this.class, innerHTML: arrowRight });
+        return hAsync("span", { key: '4a2b33b86753acab8270a45c7b250603b128bc88', class: this.class, innerHTML: arrowRight });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9964,7 +9976,7 @@ class EdsIconBluesky {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '4eba69bfec926b7a3490feee15b5947a8ab8a7b9', class: this.class, innerHTML: bluesky });
+        return hAsync("span", { key: '68917ac759cd684a6f3f3f67cb174d7291841070', class: this.class, innerHTML: bluesky });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -9987,7 +9999,7 @@ class EdsIconBookmark {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '5978393f7c5bdc6a1a23b85ded49503dacab3ff2', class: this.class, innerHTML: bookmark });
+        return hAsync("span", { key: '61dd6e752db1c28d082d80aba71267f4e971492d', class: this.class, innerHTML: bookmark });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10010,7 +10022,7 @@ class EdsIconChevronDown {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '6c98bd673a1562fda009e95e4e4562d1e7f0ccfd', class: this.class, innerHTML: chevronDown });
+        return hAsync("span", { key: 'fa8022d27b91e909d4cd5522c6d0406be698a412', class: this.class, innerHTML: chevronDown });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10033,7 +10045,7 @@ class EdsIconChevronLeft {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '8a2d0acc90ce3515e059818d704d7ce427cdd56e', class: this.class, innerHTML: chevronLeft });
+        return hAsync("span", { key: 'c723d7f1bbd596063ae7e66123b8038af5320a54', class: this.class, innerHTML: chevronLeft });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10056,7 +10068,7 @@ class EdsIconChevronRight {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '8632a351612a4be6e47d4ff483717a2bda99a008', class: this.class, innerHTML: chevronRight });
+        return hAsync("span", { key: 'f770cd9151077e8708c76d2082613c65a20c420f', class: this.class, innerHTML: chevronRight });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10079,7 +10091,7 @@ class EdsIconChevronUp {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'cc552d780188b225d16fd18ec33a22b0fbbd9660', class: this.class, innerHTML: chevronUp });
+        return hAsync("span", { key: '40d18a840277f2aba5d314a36fca5c1f8fd99cc6', class: this.class, innerHTML: chevronUp });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10102,7 +10114,7 @@ class EdsIconClose {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '907eaa5d70add8ad62e9f071aacce359682969fe', class: this.class, innerHTML: close });
+        return hAsync("span", { key: '8e4dedef0fe684fdd6078db8005661e49207da55', class: this.class, innerHTML: close });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10125,7 +10137,7 @@ class EdsIconCopy {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'e31c2cd317654999670526469111fff23f66a6b4', class: this.class, innerHTML: copy });
+        return hAsync("span", { key: 'ff014a9761d8380a9fd8c97d3dd483b8d6fc786c', class: this.class, innerHTML: copy });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10148,7 +10160,7 @@ class EdsIconEu {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '94c3dbf77824b2e51627b8e2a2de9b7cfb1f24e0', class: this.class, innerHTML: euSvg });
+        return hAsync("span", { key: '3888f0338df2496c334d95dbcb52a0e39906362d', class: this.class, innerHTML: euSvg });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10171,7 +10183,7 @@ class EdsIconExternal {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '099d0118c7a4bfa2d8b5c21f45162080b31a2f7c', class: this.class, innerHTML: arrowDiagonal });
+        return hAsync("span", { key: '58d51f84a7b6326ef117a905f2c50d4fff6369c5', class: this.class, innerHTML: arrowDiagonal });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10194,7 +10206,7 @@ class EdsIconFacebook {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '72eb0709ccbfc7830ab146f936a2587407feb0bb', class: this.class, innerHTML: facebook });
+        return hAsync("span", { key: '3ea80799436c93b1c02ad177bd48910409aebf51', class: this.class, innerHTML: facebook });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10217,7 +10229,7 @@ class EdsIconGitlab {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '280eb778fd7028ef60305eee614213f8a39a35f2', class: this.class, innerHTML: gitlabBlack });
+        return hAsync("span", { key: 'a2f423ed9227463e27c0c698e6b4bba44cdc6263', class: this.class, innerHTML: gitlabBlack });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10240,7 +10252,7 @@ class EdsIconLinkedin {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '5388b5cef5d643984157e0bed9263e83934dc7e3', class: this.class, innerHTML: linkedin });
+        return hAsync("span", { key: '88852ca054a7e637efc7fe5b01f343a9b1798e41', class: this.class, innerHTML: linkedin });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10263,7 +10275,7 @@ class EdsIconLoader {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '808ce738f7812024a52b4875ae3d9070bc75c02d', class: this.class, innerHTML: loader });
+        return hAsync("span", { key: '283c8842f0f755074521fdcbae46969d87b86312', class: this.class, innerHTML: loader });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10286,7 +10298,7 @@ class EdsIconMastodon {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'b998a568e6f0f7811a4984817177c76842127298', class: this.class, innerHTML: mastodon });
+        return hAsync("span", { key: '5a5a90094c1f974dc7932654e97de04975e675bb', class: this.class, innerHTML: mastodon });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10309,7 +10321,7 @@ class EdsIconMenu {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'f9dcfa2e4c9cc938f3fd994ca3637c80f0495028', class: this.class, innerHTML: menu });
+        return hAsync("span", { key: 'dc06f1a54b9542cb2c0165fb3bdff960ecd81cc0', class: this.class, innerHTML: menu });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10332,7 +10344,7 @@ class EdsIconMinus {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '76fe78207051b486030fc1ef778d55ecfec2c3d2', class: this.class, innerHTML: minus });
+        return hAsync("span", { key: 'e76f56aaba4a67096e6314e61d53bc2512941552', class: this.class, innerHTML: minus });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10355,7 +10367,7 @@ class EdsIconMore {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '546f5d7c76d57c07c34b6455cb1df4fea6c57302', class: this.class, innerHTML: more });
+        return hAsync("span", { key: 'cb31d12146ff577195650b502f51005092404a30', class: this.class, innerHTML: more });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10378,7 +10390,7 @@ class EdsIconPaper {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'e9baa8e9d467104fdeac600678b800787ef7d736', class: this.class, innerHTML: paper });
+        return hAsync("span", { key: 'abc728a23571f7cc24f6d9d1dc5c72c397983aa3', class: this.class, innerHTML: paper });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10401,7 +10413,7 @@ class EdsIconPlus {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '7510fb2b948a83c216a375f2a84a16b10b38054e', class: this.class, innerHTML: plus });
+        return hAsync("span", { key: '35d8e069fbb1bdb01ae6f068c28edd19d299c7c3', class: this.class, innerHTML: plus });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10424,7 +10436,7 @@ class EdsIconPortal {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'c9f384bf790dd2eef9b84e757403106209f05c04', class: this.class, innerHTML: portal });
+        return hAsync("span", { key: '9383784da3e52d22395288f8eba5b6f4ee826aa5', class: this.class, innerHTML: portal });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10447,7 +10459,7 @@ class EdsIconPrivate {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'd03d51d5aee837edab83aa71cf82fd415a8c71c3', class: this.class, innerHTML: privat });
+        return hAsync("span", { key: '9466d1ce37e58f512579d63ec5049cc58e8b9836', class: this.class, innerHTML: privat });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10470,7 +10482,7 @@ class EdsIconPublic {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '94970e6d7f414cde04a3dae305f3dda43f477e55', class: this.class, innerHTML: pub });
+        return hAsync("span", { key: 'e4815b72c160ae98d66dbfa877f82f1d2f7c50b3', class: this.class, innerHTML: pub });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10493,7 +10505,7 @@ class EdsIconSearch {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '2c35a35b31a988ffa690816a8699d2aac43dd916', class: this.class, innerHTML: search });
+        return hAsync("span", { key: '6a35ea0c0de4916a867f760eb058a3cbb1bc218e', class: this.class, innerHTML: search });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10516,7 +10528,7 @@ class EdsIconStar {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'dc06f1a54b9542cb2c0165fb3bdff960ecd81cc0', class: this.class, innerHTML: star });
+        return hAsync("span", { key: 'f7ebc68658fcf8c0df627871481cce90cd7800fb', class: this.class, innerHTML: star });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10539,7 +10551,7 @@ class EdsIconSuccess {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '8b5d4cfeedf6d7e9bea48d7ba892527d484c858d', class: this.class, innerHTML: success });
+        return hAsync("span", { key: 'd78b06493302958306d408d823f4a7703d9b9adc', class: this.class, innerHTML: success });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10562,7 +10574,7 @@ class EdsIconThumbsDown {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'c60c3e5180cd900ce290448563fc476264ba1fe5', class: this.class, innerHTML: thumbsDown });
+        return hAsync("span", { key: '84e6d8cff80004a650c6d0fc6b9702cf1ca85ba2', class: this.class, innerHTML: thumbsDown });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10585,7 +10597,7 @@ class EdsIconThumbsUp {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'eee2fdd0cdf1e9735e90f34c6bb090f3df67eb49', class: this.class, innerHTML: thumbsUp });
+        return hAsync("span", { key: '5f5198ad92684dc173d603499b485e7d0ca8811b', class: this.class, innerHTML: thumbsUp });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10608,7 +10620,7 @@ class EdsIconTutorial {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '0e47e2af80487a28c96e8830dda102c23bff9e5c', class: this.class, innerHTML: tutorial });
+        return hAsync("span", { key: '8be08569144889cca6f801cdd31e4cc31fdc11e5', class: this.class, innerHTML: tutorial });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10631,7 +10643,7 @@ class EdsIconTwitter {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '1a7ad8d7cbef70822ebda2f152d8b537df1eaf27', class: this.class, innerHTML: twitter });
+        return hAsync("span", { key: 'c2ee643b5da517a53bd97ec6263161927ad229a7', class: this.class, innerHTML: twitter });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10654,7 +10666,7 @@ class EdsIconUnknown {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'a9145c4e133746c314a1ee34d36a5f19f3686565', class: this.class, innerHTML: unknown });
+        return hAsync("span", { key: '449cd62f697607ebb17bed06835ee9529d7e8999', class: this.class, innerHTML: unknown });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10677,7 +10689,7 @@ class EdsIconUpdown {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: 'b97da1b406718c7611d1e17d7a9c6b4670600740', class: this.class, innerHTML: upDonw });
+        return hAsync("span", { key: '5b0e914205c9f3fb5e216e0ccb16e350a4449c02', class: this.class, innerHTML: upDonw });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10700,7 +10712,7 @@ class EdsIconUser {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '4322703c9e449819dc30946118893d365fa20124', class: this.class, innerHTML: user });
+        return hAsync("span", { key: '297e73664320032b2f78dd3c43aa0852545c0723', class: this.class, innerHTML: user });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10779,7 +10791,7 @@ class EdsIconYoutube {
         this.class = '';
     }
     render() {
-        return hAsync("span", { key: '2236f8f5ede15d7eef54f2fd4fe6ca81c996166f', class: this.class, innerHTML: youtube });
+        return hAsync("span", { key: '0a6abd6b62e24c07b4338f0f1f6febbec876791f', class: this.class, innerHTML: youtube });
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -10855,10 +10867,10 @@ class EdsImg {
             imgOpts['loading'] = 'lazy';
             imgOpts['decoding'] = 'async';
         }
-        return (hAsync("div", { key: 'de3328e21b2b038984e74c08cd757cd85c7a7e01', class: {
+        return (hAsync("div", { key: '13ed3aa346c99321c609e49ce045b6361921350f', class: {
                 'items-center justify-center': true,
                 'effect-bg-pattern': this.lazyload && this.showBg
-            } }, hAsync("picture", { key: '4e623a25c64ce1b2c09adf3519f12bde04280ba3' }, this.formats.map((format) => (hAsync("source", { type: format.type, srcSet: format.srcset, media: format.media, sizes: this.sizes }))), hAsync("img", Object.assign({ key: '6d87af22189017aa1e158c01a8295c98381a1ba1', ref: (el) => (this.img = el), class: {
+            } }, hAsync("picture", { key: '56aa0ed8fd1ef8f9faf6ad576dd05edc34139c9b' }, this.formats.map((format) => (hAsync("source", { type: format.type, srcSet: format.srcset, media: format.media, sizes: this.sizes }))), hAsync("img", Object.assign({ key: '78e3ed9adcfe423d48388bf30140f4b70649faf7', ref: (el) => (this.img = el), class: {
                 'effect-opacity object-cover object-center': true,
                 'opacity-100': this.loaded,
                 'opacity-0': !this.loaded
@@ -10937,12 +10949,12 @@ class EdsInput {
     render() {
         const withIcon = !!this.icon;
         const describedBy = this.hasMessage || this.error ? `${this.name}-error` : '';
-        return (hAsync("div", { key: 'bb88b782042a37d2fcbd8a93f03056199d822559', class: "relative flex items-center" }, this.type === 'textarea' ? (hAsync("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' ? (hAsync("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) => (hAsync("option", { value: option.value, selected: option.value === this.innerVal, key: option.value }, option.label))))) : (hAsync("input", { 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, class: `
+        return (hAsync("div", { key: '5c66c14b19aa3d5fc37e7a77a2d1194fa0be9b8c', class: "relative flex items-center" }, this.type === 'textarea' ? (hAsync("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' ? (hAsync("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) => (hAsync("option", { value: option.value, selected: option.value === this.innerVal, key: option.value }, option.label))))) : (hAsync("input", { 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, class: `
               ${this.extraClass || ''} 
               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' && (hAsync("span", { key: '7b1cc490731455d00d500308458e6b2cd320fccf', class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}` }, this.maxLength)), this.icon && (hAsync("eds-icon-wrapper", { key: 'ce4d5548bc0fa1e681e3b74b03d071d73d8372d5', 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' && (hAsync("span", { key: '4326db3729dea8bbddb7a109a90424aa832aded7', class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}` }, this.maxLength)), this.icon && (hAsync("eds-icon-wrapper", { key: 'df2f5598aedd36b9cb2ce886fb8ea08da58dc5ff', class: `absolute top-1/2 left-[4px] -translate-y-1/2 ${this.disabled ? 'text-lightest' : 'text-lightest'}`, icon: this.icon }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -11074,7 +11086,7 @@ class EdsInputField {
             icon: this.icon,
             checked: this.checked
         };
-        return (hAsync("div", { key: '5243586c0bf3acc86d42684dbcd0288b3360b00c', class: "space-y-8" }, this.type === 'checkbox' || this.type === 'radio' ? (this.parsedOptions.length > 0 ? (hAsync("fieldset", { class: "space-y-4 mt-8" }, hAsync("div", { class: "flex justify-between" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.parsedOptions.map((option) => (hAsync("div", { class: "flex items-center gap-x-2", key: option.value }, hAsync("eds-input", Object.assign({}, inputOpts, { value: option.value, checked: (typeof this.value === 'string' ? this.value.split(',') : []).includes(String(option.value)) })), hAsync("eds-input-label", { name: `${this.name}-${option.value}`, label: option.label })))))) : (hAsync("div", { class: "flex items-center gap-x-8" }, hAsync("eds-input", Object.assign({}, inputOpts, { value: this.value, checked: this.value === 'on' })), this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required }))))) : (hAsync("div", null, hAsync("div", { class: "flex justify-between" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.type === 'select' ? (hAsync("eds-input-select", Object.assign({}, inputOpts, { options: this.parsedOptions }))) : this.type === 'file' ? (hAsync("input", { type: "file", id: this.inputId || this.name, name: this.name, onChange: this.onChange, disabled: this.disabled, required: this.required })) : this.type === 'search' ? (hAsync("eds-input-search", { name: "search-box" })) : this.type === 'range' ? ((() => {
+        return (hAsync("div", { key: 'e46f1b26212ee915c2fde3fa0c58a152005d2b50', class: "space-y-8" }, this.type === 'checkbox' || this.type === 'radio' ? (this.parsedOptions.length > 0 ? (hAsync("fieldset", { class: "space-y-4 mt-8" }, hAsync("div", { class: "flex justify-between" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.parsedOptions.map((option) => (hAsync("div", { class: "flex items-center gap-x-2", key: option.value }, hAsync("eds-input", Object.assign({}, inputOpts, { value: option.value, checked: (typeof this.value === 'string' ? this.value.split(',') : []).includes(String(option.value)) })), hAsync("eds-input-label", { name: `${this.name}-${option.value}`, label: option.label })))))) : (hAsync("div", { class: "flex items-center gap-x-8" }, hAsync("eds-input", Object.assign({}, inputOpts, { value: this.value, checked: this.value === 'on' })), this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required }))))) : (hAsync("div", null, hAsync("div", { class: "flex justify-between" }, this.label && (hAsync("eds-input-label", { name: this.inputId || this.name, label: this.label, disabled: this.disabled, required: this.required })), this.hint && (hAsync("p", { id: `${this.name}-hint`, class: "f-ui-05 text-lighter mt-8 ml-8" }, this.hint))), this.type === 'select' ? (hAsync("eds-input-select", Object.assign({}, inputOpts, { options: this.parsedOptions }))) : this.type === 'file' ? (hAsync("input", { type: "file", id: this.inputId || this.name, name: this.name, onChange: this.onChange, disabled: this.disabled, required: this.required })) : this.type === 'search' ? (hAsync("eds-input-search", { name: "search-box" })) : this.type === 'range' ? ((() => {
             var _a, _b, _c;
             const rangeProps = {
                 name: inputOpts.name,
@@ -11087,7 +11099,7 @@ class EdsInputField {
             const opt = this.parsedOptions;
             const numberValue = typeof this.value === 'string' ? parseFloat(this.value) : this.value || 0;
             return (hAsync("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 })));
-        })()) : (hAsync("eds-input", Object.assign({}, inputOpts))))), hAsync("eds-input-footer", { key: 'e4e1f28766471d5451f342aa4d60d58fca2ddd01', id: `${this.name}-footer`, name: this.name, message: this.message, "error-message": this.errorMessage, error: this.error, link: this.link })));
+        })()) : (hAsync("eds-input", Object.assign({}, inputOpts))))), hAsync("eds-input-footer", { key: 'ecf3ee5c0400749f1d89b53edfdee6fe62ca2a32', id: `${this.name}-footer`, name: this.name, message: this.message, "error-message": this.errorMessage, error: this.error, link: this.link })));
     }
     get hostEl() { return getElement(this); }
     static get style() { return EdsInputFieldStyle0; }
@@ -11135,7 +11147,7 @@ class EdsInputFooter {
         this.link = undefined;
     }
     render() {
-        return (hAsync("div", { key: 'c3dbdb05ce4cc9244a1ebc9f3ce5718742924ea1', class: "space-y-4 mt-4" }, this.error && this.errorMessage && (hAsync("div", { key: 'ccfde4960e1bec5697774de57da1a7948b5112c4', id: `error_${this.name}`, class: "text-error flex items-center" }, hAsync("eds-icon-wrapper", { key: 'cc7171c96a7251c064f7ce527fe715aaac9a74e2', icon: "warning" }), hAsync("p", { key: '99893066c8aeac76793fef4d5cf6d5b34dbbc25f', class: "f-ui-04 ml-4", innerHTML: this.errorMessage }))), this.message && hAsync("p", { key: '55a6881d02d06440e6adac174a43a1cd59adf34b', id: `desc_${this.name}`, class: "f-ui-05 text-lighter", innerHTML: this.message }), this.link && (hAsync("a", { key: 'bb84693685aedbe7ba28551a1d944c0e1d8eda57', href: this.link.url, class: "f-ui-05 effect-color hover:text-lighter underline underline-offset-4" }, this.link.label))));
+        return (hAsync("div", { key: 'd5424778da81d6558246efe97917d3e3ccfa9aaa', class: "space-y-4 mt-4" }, this.error && this.errorMessage && (hAsync("div", { key: 'e915fc1f4719f48eca5a831ac72913d2f91f633b', id: `error_${this.name}`, class: "text-error flex items-center" }, hAsync("eds-icon-wrapper", { key: '9cc87cfd4955766947a2581604fe1e072f8d82a9', icon: "warning" }), hAsync("p", { key: '564a2397fb7e8185e43e1c2be216c76060e7498e', class: "f-ui-04 ml-4", innerHTML: this.errorMessage }))), this.message && hAsync("p", { key: '24e0702df7e5c2fe4ef0cc6755159fefe76b70a7', id: `desc_${this.name}`, class: "f-ui-05 text-lighter", innerHTML: this.message }), this.link && (hAsync("a", { key: '9e3720a3ded9d755afd7755104df0942246f1fbe', href: this.link.url, class: "f-ui-05 effect-color hover:text-lighter underline underline-offset-4" }, this.link.label))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -11165,7 +11177,7 @@ class EdsInputLabel {
         this.disabled = false;
     }
     render() {
-        return (hAsync("label", { key: '815b70d78f4004afb77a0c01772f750478dea1b3', htmlFor: this.name, class: `input-label ${this.disabled ? 'text-lighter' : ''}` }, this.label, this.required && (hAsync("span", { key: 'de2cba1c7e89632b3aac40de573d730cf38a85c6' }, hAsync("span", { key: '58326fb23edd4521b0f1c6e67366e7c589217387', "aria-hidden": "true" }, "*"), hAsync("span", { key: 'e2208159652c9244e49c2c3d476a099a442d28ac', class: "sr-only" }, "required")))));
+        return (hAsync("label", { key: 'd700690a67a8348836aec27d2ff4f4d4ee18b9c8', htmlFor: this.name, class: `input-label ${this.disabled ? 'text-lighter' : ''}` }, this.label, this.required && (hAsync("span", { key: '9b52c053652db132a9bdb2d9fc64c569a529c2d9' }, hAsync("span", { key: 'cd17268b6048ebaa70dc7f905fc7f7bf3ed3fa34', "aria-hidden": "true" }, "*"), hAsync("span", { key: '352d7b5ef080336a5c7b53e0b710d5b0d7aa0efe', class: "sr-only" }, "required")))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -11230,7 +11242,7 @@ class EdsInputRange {
         return this.inputElement;
     }
     render() {
-        return (hAsync("div", { key: '9901432821b3dbdbf67e3b905c75acd7095ec8e9', class: "relative flex flex-col items-start space-y-2" }, hAsync("input", { key: '44023ef4a7e3fec22666103ccec3e2346aea885d', 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", "aria-describedby": `desc_${this.name}`, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.sliderVal, onInput: this.onInput, onChange: this.onChange }), hAsync("p", { key: 'b74e14f619acbe7b98966bac8ea2c5206d05ad62', id: `desc_${this.name}`, class: "block f-ui-05 text-lighter" }, "Current value: ", this.sliderVal)));
+        return (hAsync("div", { key: '5c55f65e2acd6f4554af7d8ba513c9d9dfd445eb', class: "relative flex flex-col items-start space-y-2" }, hAsync("input", { key: '4fcd0d3d978ddba7929958dd22a283c2ba61ee48', 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", "aria-describedby": `desc_${this.name}`, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.sliderVal, onInput: this.onInput, onChange: this.onChange }), hAsync("p", { key: 'c63b223e6af149efb68cabbe5228e77b09ca2168', id: `desc_${this.name}`, class: "block f-ui-05 text-lighter" }, "Current value: ", this.sliderVal)));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -11325,7 +11337,7 @@ class EdsInputSearch {
         return this.inputElement;
     }
     render() {
-        return (hAsync("div", { key: '2d74c44bf05f4ccbe81df14a3af112a763b01b5f', class: "relative flex items-center" }, hAsync("eds-icon-wrapper", { key: 'c7c7c479801a9c5e6da0b616448f7b89ba25b040', icon: "search", class: "absolute top-1/2 left-[4px] -translate-y-1/2 text-lightest", "aria-hidden": "true" }), hAsync("input", { key: '8e4954dc67ae59d46f2e3423325eccda0944363a', 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 (hAsync("div", { key: '27d6871df962e2bd27eac38b1a105142b1b68bab', class: "relative flex items-center" }, hAsync("eds-icon-wrapper", { key: 'b4b497cb435c673a550b169dea93fbc7006d0c5e', icon: "search", class: "absolute top-1/2 left-[4px] -translate-y-1/2 text-lightest", "aria-hidden": "true" }), hAsync("input", { key: '1419cd8f5b8791b5b812c57ba649567e1b6ec0bb', 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 })));
     }
@@ -11379,12 +11391,12 @@ class EdsInputSelect {
         const selectId = this.inputId || this.name;
         const placeholderText = this.placeholder || `Please select ${this.name}`;
         const describedBy = this.hasMessage || this.error ? `${this.name}-error` : undefined;
-        return (hAsync("div", { key: '0e1bf5f1ebf30d675e0b4927e7812a305f58d2b9', class: "relative" }, hAsync("select", { key: 'b92542caca12d77e3160baa84760b37bbbe172c7', id: selectId, name: this.name, class: {
+        return (hAsync("div", { key: '80cbdab87f5baa21df5edc857685c3af4dee3a58', class: "relative" }, hAsync("select", { key: '4e8f84fd9dbc63df7981898cadc24450f48aa92a', 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 }, hAsync("option", { key: 'fa911a07fd0053f6c7e5044aac3e6d0846344899', value: "", disabled: true, hidden: true }, placeholderText), this.options.map((opt, index) => (hAsync("option", { key: index, value: opt.value, selected: opt.value === this.value }, opt.label)))), hAsync("span", { key: 'afa3c7ad3c583dec2ffc2fd5087d7695509a2a25', class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center" }, hAsync("eds-icon-wrapper", { key: '1bb2a24fc9798a7359b9b45019b1432ff2e50e70', 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 }, hAsync("option", { key: '54b90339cae4c5c80711793a8c68c4587e0c2495', value: "", disabled: true, hidden: true }, placeholderText), this.options.map((opt, index) => (hAsync("option", { key: index, value: opt.value, selected: opt.value === this.value }, opt.label)))), hAsync("span", { key: '6c9f0a0606f1d6f282c756f84ace7618584d5fa3', class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center" }, hAsync("eds-icon-wrapper", { key: '4524af72468d3b37c01b0252d4b6b2bf7454514e', class: "w-20 h-20", icon: "chevron-right" }))));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -11625,7 +11637,7 @@ class EdsLink {
         const labelClasses = this.hideLabelOnSmallScreen
             ? 'hidden lg:flex' // Tailwind example: hidden on small screens, visible on larger
             : '';
-        return (hAsync(ComponentType, { key: 'ee6e8eeb12df62ee801164877a357c075590ebae', class: `${classes || ''} ${this.extraClass || ''}`, href: !this.disabled ? this.url : undefined, target: this.external && !this.disabled ? '_blank' : undefined, rel: this.external && !this.disabled ? 'noopener noreferrer' : undefined, "aria-label": computedAriaLabel, "aria-disabled": this.disabled ? 'true' : null, "aria-current": this.current ? 'page' : undefined, download: this.download ? '' : undefined, onClick: (event) => this.handleClick(event) }, hAsync("span", { key: '7b35e3ddca346ff09730aa332b9f47b6d6707721', class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), hAsync("span", { key: 'fe4201815e3791e6e3d6da8856d7a7a9e0211cfc', class: labelClasses }, this.label), this.renderRightIcon())));
+        return (hAsync(ComponentType, { key: '8c7ab8b80b9765e83e4e57d59ba1b45fe36f15b7', class: `${classes || ''} ${this.extraClass || ''}`, href: !this.disabled ? this.url : undefined, target: this.external && !this.disabled ? '_blank' : undefined, rel: this.external && !this.disabled ? 'noopener noreferrer' : undefined, "aria-label": computedAriaLabel, "aria-disabled": this.disabled ? 'true' : null, "aria-current": this.current ? 'page' : undefined, download: this.download ? '' : undefined, onClick: (event) => this.handleClick(event) }, hAsync("span", { key: '94284b425a331f6a56a3e63db89fed5fa1a207c1', class: "z-1 relative inline-flex items-center justify-center" }, this.renderLeftIcon(), hAsync("span", { key: '7496886c7c975d6795633c36b9cc8d31673d5a4b', class: labelClasses }, this.label), this.renderRightIcon())));
     }
     get el() { return getElement(this); }
     static get style() { return EdsLinkStyle0; }
@@ -11733,7 +11745,7 @@ class EdsLogo {
     }
     render() {
         const logoContent = this.getLogo();
-        return (hAsync("a", { key: 'a23e44227ebaa3b999c961e1354c268f2c916a6f', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, hAsync("div", { key: 'cba53a54e6d31aabfa62ddcd8aa53bda56b8b706', innerHTML: logoContent })));
+        return (hAsync("a", { key: 'ab11d53e1f417221dcca2de441c7b3efa96f99a5', href: this.href, onClick: () => this.handleClick(), class: "eds-logo-wrapper", "aria-label": this.label }, hAsync("div", { key: '0d4a6b970788534d34d55b28fe83407ce7c4e00e', innerHTML: logoContent })));
     }
     get el() { return getElement(this); }
     static get style() { return EdsLogoStyle0; }
@@ -12008,9 +12020,9 @@ 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 (hAsync("div", { key: '3a2446813eebf215f2c7aafc26d5688f58020c54', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999999 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (hAsync("div", { key: '7081928b01c09e692cac0f61dbc58b4f5578271d', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
+        return (hAsync("div", { key: 'affa340307adc5bdd637696b56a59e3f73cbf7e9', id: "eds-modal", class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999999 flex`, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId }, this.isOpen && (hAsync("div", { key: 'e4359b32052a155f879070deea34fbca2fb67e3b', class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
             ,
-            onClick: () => this.close() })), hAsync("div", { key: '0fc5f4716022cb01c2da9a28738586710625c70f', class: `container absolute bg-inverse z-10 ${this.getModalPositionClasses()} grow justify-center` }, hAsync("div", { key: '8e4bdffba2f69b18e8846e4c2709c5c423b0a99e', 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'}` }, hAsync("span", { key: '6e0d237fc95c1b74b1b0c0456848684578367302', id: titleId, class: `f-heading-04 ${this.getTruncateClass()}` }, this.heading), hAsync("eds-button", { key: '3499de216da4ba38edb66cdcd688872f51b41aaf', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8 text-default" })), hAsync("div", { key: 'f723dded796961e925cc2b046c31e7345fd3e159', class: "pt-8 px-20 py-20" }, hAsync("slot", { key: 'ffe1213b65e60dfaf7c220e3c7e3dd8495706dcf' })))));
+            onClick: () => this.close() })), hAsync("div", { key: 'ba95f463e8c807e2ac2e900b3167191908ca2f5d', class: `container absolute bg-inverse z-10 ${this.getModalPositionClasses()} grow justify-center` }, hAsync("div", { key: '1fc4649d6ba728745e4f1ed73e8fb8bdac6eda59', 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'}` }, hAsync("span", { key: '731e7cb6c7aaa36bcda8d1c32bd1b8da9d85f253', id: titleId, class: `f-heading-04 ${this.getTruncateClass()}` }, this.heading), hAsync("eds-button", { key: '89657ac29b27ce173569353f3101e998cb756eec', intent: "tertiary", icon: "close", "aria-label": "Close modal", onClick: () => this.close(), "extra-class": "ml-8 text-default" })), hAsync("div", { key: '2e39edaa1f5cc5389873e203c3e4294de8b56678', class: "pt-8 px-20 py-20" }, hAsync("slot", { key: '0fb09f52100042fc5f20f5f443a8f5cff381d944' })))));
     }
     get el() { return getElement(this); }
     static get style() { return EdsModalStyle0; }
@@ -12211,7 +12223,7 @@ class EdsPagination {
         }
     }
     render() {
-        return (hAsync("div", { key: '1d53f69179791434224f152503c0b81c4cfc7cd3' }, this.total > 0 && this.mode === 'default' && (hAsync("p", { key: '00ae324b49d62a74feee9d1cde21d67cd726ecf0', class: "f-ui-03 text-lightest mb-28 w-full text-center" }, hAsync("span", { key: 'dedf2ce2700eae9d1386b305ec1d1904b133f992', class: "sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (hAsync("nav", { "aria-label": "Pagination" }, hAsync("ul", { class: "flex items-center justify-center gap-x-8" }, hAsync("li", { class: "mr-auto" }, hAsync("eds-link", { label: this.prevLabel, url: this.mode === 'navigator'
+        return (hAsync("div", { key: '6377e0187e461bcbeac835dd7cb83e93ef199865' }, this.total > 0 && this.mode === 'default' && (hAsync("p", { key: 'ec2a6b6a40c76352743d012c51cda5d7fe1137df', class: "f-ui-03 text-lightest mb-28 w-full text-center" }, hAsync("span", { key: '3a23e3d156f87167b0dacb4085870958ce19e793', class: "sr-only" }, "Results:"), this.pageResults())), this.mode === 'navigator' || (this.lastPage && this.lastPage > 1) ? (hAsync("nav", { "aria-label": "Pagination" }, hAsync("ul", { class: "flex items-center justify-center gap-x-8" }, hAsync("li", { class: "mr-auto" }, hAsync("eds-link", { label: this.prevLabel, url: this.mode === 'navigator'
                 ? this.prevUrl || '#' // Use prevUrl if provided, otherwise disable with '#'
                 : this.isFirstPage()
                     ? '#'
@@ -12430,7 +12442,7 @@ class EdsProgressBar {
         ]
             .filter(Boolean)
             .join(' ');
-        return (hAsync("div", { key: '8760afff9f85f05fec52b0a7fb668661e49dc06f', role: "progressbar", "aria-valuemin": "0", "aria-valuemax": "100", "aria-valuenow": progressValue, "aria-valuetext": `${progressValue}%`, class: outerClasses }, hAsync("div", { key: '06165b69fe7e170f4f61d9f95b5a44342d4ee67a', class: fillClasses, style: { width: `${progressValue}%` } }), hAsync("div", { key: '0c48e65c5a6cb0b4dff7a7e3e248052cdc29957d', class: "absolute inset-0 flex items-center justify-center pointer-events-none z-10" }, hAsync("span", { key: 'fc6f7396cf741ba18d1b5d065bdd1b7bfff12abe', class: "text-default f-body-02" }, progressValue, "%"))));
+        return (hAsync("div", { key: '3360c1a9e61c83fee5312d007f6d2965a8983eba', role: "progressbar", "aria-valuemin": "0", "aria-valuemax": "100", "aria-valuenow": progressValue, "aria-valuetext": `${progressValue}%`, class: outerClasses }, hAsync("div", { key: '7210dc5931f08626b286c30ae790a3a864533632', class: fillClasses, style: { width: `${progressValue}%` } }), hAsync("div", { key: '7586cd593b4e851f4605ad33b96781841ee0b1aa', class: "absolute inset-0 flex items-center justify-center pointer-events-none z-10" }, hAsync("span", { key: '21fa3de543e5e717ed4fd76c689aa47c3fa6a853', class: "text-default f-body-02" }, progressValue, "%"))));
     }
     static get style() { return EdsProgressBarStyle0; }
     static get cmpMeta() { return {
@@ -12492,7 +12504,7 @@ class EdsRating {
         this.rating.emit(rating);
     }
     render() {
-        return (hAsync("div", { key: '685ac01e4db577b07d00030b0c25e10b9b0defa8', role: "radiogroup", class: "stars flex space-x-1 my-8" }, Array.from({ length: this.ratingCount }, (_, index) => {
+        return (hAsync("div", { key: '6686575f0b8b9017bf19b105208f6adbfd46dabd', role: "radiogroup", class: "stars flex space-x-1 my-8" }, Array.from({ length: this.ratingCount }, (_, index) => {
             const starRating = index + 1;
             const isSelected = starRating <= this.selectedRating;
             // Use the mapping text if available; otherwise, fall back to a generic label.
@@ -12541,7 +12553,7 @@ class EdsSectionCore {
     }
     render() {
         const TagType = this.tag; // Set dynamic tag type (div or section)
-        return (hAsync(TagType, { key: 'ff0b28dffb8aca2ad0ac1ee3eea7ebda75078f96' }, hAsync("eds-section-heading", { key: '23e9bb2b084c6b8a534dd310fbe10e0de0211187', headingLevel: this.headingLevel, sectionTitle: this.sectionTitle }), hAsync("slot", { key: '9cae6378bdb5304191d393967025570f94fdcdb2' })));
+        return (hAsync(TagType, { key: '43f8d599041ae0c9761988fdec4872ec4a8ca037' }, hAsync("eds-section-heading", { key: 'd120ddd851a0485e2edb43e2a6f508a661f35c07', headingLevel: this.headingLevel, sectionTitle: this.sectionTitle }), hAsync("slot", { key: '9818b82a3eebcb741f5bccc9781e4212f2c5fa3d' })));
     }
     static get style() { return EdsSectionCoreStyle0; }
     static get cmpMeta() { return {
@@ -12596,12 +12608,12 @@ class EdsSectionHeading {
     render() {
         const TagType = this.tag; // Dynamically set tag type for the container
         const HeadingTag = this.headingLevel; // Dynamically set heading level
-        return (hAsync(TagType, { key: 'bb32f87fd944ebf08ebcde3980c18cd4bed18783', class: {
+        return (hAsync(TagType, { key: '740ed8b3208e07091a1f4c79888e172dec33773a', class: {
                 'ui-section-header flex flex-wrap items-center justify-between gap-x-12 gap-y-8': true,
                 container: this.withContainer,
                 'pt-48': this.spacingLarge,
                 'pt-28': !this.spacingLarge
-            } }, hAsync(HeadingTag, { key: '0cd8ea8aada58e30675579c82ba130b40257c7c6', class: this.getHeadingClass() }, this.sectionTitle)));
+            } }, hAsync(HeadingTag, { key: '4d4ceef35b7cb06bfbff2fdae47e66dd7ac10c49', class: this.getHeadingClass() }, this.sectionTitle)));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -12734,7 +12746,7 @@ class EdsSpinner {
                 alignItems: 'center',
                 justifyContent: 'center'
             };
-        return (hAsync(Host, { key: '214876a56949c147e74c1a7072406234c2fb1a02' }, hAsync("div", { key: 'b75b639fa38aafaf13e1eb727e28c5e67f3edafe', class: "spinner-overlay", style: overlayStyle }, hAsync("span", { key: '87ba2ef7e1e9601ac0ae8132e9c891b4149a20b5', class: "spinner", style: spinnerStyle }))));
+        return (hAsync(Host, { key: 'f687ccbbb05840b7699202f3758ec4a8d0de1bc4' }, hAsync("div", { key: '4bb5c697f1ccd90d2d65d519fcfb3ec809b106ac', class: "spinner-overlay", style: overlayStyle }, hAsync("span", { key: 'a07722d9ee9c94d03d9766a4b297a498998c00be', class: "spinner", style: spinnerStyle }))));
     }
     static get style() { return EdsSpinnerStyle0; }
     static get cmpMeta() { return {
@@ -12898,10 +12910,10 @@ class EdsSteps {
     render() {
         const steps = this.parsedSteps;
         if (this.type === 'linear') {
-            return (hAsync("div", null, hAsync("div", { class: "steps" }, steps.map((step, index) => (hAsync("div", { class: "step mb-28", key: index }, hAsync("h3", { onClick: () => this.handleStepClick(index) }, step.title), this.activeStep === index && (hAsync("div", { class: "content" }, hAsync("div", { class: "f-body-02 text-lighter my-16" }, step.content), hAsync("eds-button", { label: index === steps.length - 1 ? 'Finish' : 'Continue', intent: "primary", class: "next-btn", onClick: this.handleNext }), hAsync("eds-button", { label: "Back", intent: "ghostInverse", onClick: this.handleBack, disabled: index === 0, "extra-class": index === 0 ? 'hidden' : 'ml-8 block' })))))))));
+            return (hAsync("div", null, hAsync("div", { class: "steps" }, steps.map((step, index) => (hAsync("div", { class: "step mb-28", key: index }, hAsync("h3", { onClick: () => this.handleStepClick(index) }, step.title), this.activeStep === index && (hAsync("div", { class: "content" }, hAsync("slot", { name: `step-${index}` }, hAsync("div", { class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16', innerHTML: step.content })), hAsync("eds-button", { label: index === steps.length - 1 ? 'Finish' : 'Continue', intent: "primary", class: "next-btn", onClick: this.handleNext }), hAsync("eds-button", { label: "Back", intent: "ghostInverse", onClick: this.handleBack, disabled: index === 0, "extra-class": index === 0 ? 'hidden' : 'ml-8 block' })))))))));
         }
         // Static mode: show all steps with their content, no navigation buttons.
-        return (hAsync("div", { class: "steps" }, steps.map((step, index) => (hAsync("div", { class: "step mb-28", key: index }, hAsync("h3", null, step.title), hAsync("div", { class: "content" }, hAsync("div", { class: "f-body-02 text-lighter my-16" }, step.content)))))));
+        return (hAsync("div", { class: "steps" }, steps.map((step, index) => (hAsync("div", { class: "step mb-28", key: index }, hAsync("h3", null, step.title), hAsync("div", { class: "content" }, hAsync("slot", { name: `step-${index}` }, hAsync("div", { class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16', innerHTML: step.content }))))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -12922,7 +12934,7 @@ class EdsSteps {
     }; }
 }
 
-const edsStepsV2Css = "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}.steps{position:sticky;margin-left:16px;border-left:1px solid var(--soft-color, #ddd);padding-left:23px;counter-reset:step}.steps h3{counter-increment:step;font-size:var(--f-heading-05-fontSize);font-weight:var(--f-heading-05-fontWeight);line-height:var(--f-heading-05-lineHeight);position:relative}.steps h3::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:1rem;border:1px solid #ccc;background:var(--grey-900);color:#fff;border-radius:50%}.steps h4{counter-increment:step;font-size:var(--f-heading-06-fontSize);font-weight:var(--f-heading-06-fontWeight);line-height:var(--f-heading-06-lineHeight);position:relative}.steps h4::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:0.875rem;border:1px solid #ccc;background:#333;color:#fff;border-radius:50%}.steps blockquote{margin-top:16px;margin-bottom:16px;font-style:italic;color:#aaa;padding-left:6px}.steps-img-placeholder{width:100%;height:200px;background:linear-gradient(to bottom, #9CE142, #00C959, #00A595);}.bg-\\[\\#00A595\\]{--tw-bg-opacity:1;background-color:rgb(0 165 149 / var(--tw-bg-opacity))}.relative{position:relative}.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-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)}.text-inverse{color:var(--white)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.w-full{width:100%}.h-52{height:3.25rem}.h-96{height:6rem}.h-\\[200px\\]{height:200px}.mt-16{margin-top:1rem}.mb-12{margin-bottom:0.75rem}.last\\:mb-0:last-child{margin-bottom:0rem}.last\\:mt-16:last-child{margin-top:1rem}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.relative{position:relative}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.rounded{border-radius:0.25rem}.rounded-lg{border-radius:16px}.rounded-t-lg{border-top-left-radius:16px;border-top-right-radius:16px}.border-2{border-width:2px}.p-8{padding:0.5rem}.p-24{padding:1.5rem}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.top-2{top:0.125rem}.bottom-2{bottom:0.125rem}.left-2{left:0.125rem}.right-2{right:0.125rem}.-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))}.overflow-hidden{overflow:hidden}";
+const edsStepsV2Css = "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}.steps{position:sticky;margin-left:16px;border-left:1px solid var(--soft-color, #ddd);padding-left:23px;counter-reset:step}.steps h3{counter-increment:step;font-size:var(--f-heading-05-fontSize);font-weight:var(--f-heading-05-fontWeight);line-height:var(--f-heading-05-lineHeight);position:relative}.steps h3::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:1rem;border:1px solid #ccc;background:var(--grey-900);color:#fff;border-radius:50%}.steps h4{counter-increment:step;font-size:var(--f-heading-06-fontSize);font-weight:var(--f-heading-06-fontWeight);line-height:var(--f-heading-06-lineHeight);position:relative}.steps h4::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:0.875rem;border:1px solid #ccc;background:#333;color:#fff;border-radius:50%}.steps blockquote{margin-top:16px;margin-bottom:16px;font-style:italic;color:#aaa;padding-left:6px}.steps-img-placeholder{width:100%;height:200px;background:linear-gradient(to bottom, #9CE142, #00C959, #00A595);}.bg-\\[\\#00A595\\]{--tw-bg-opacity:1;background-color:rgb(0 165 149 / var(--tw-bg-opacity))}.relative{position:relative}.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-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)}.text-inverse{color:var(--white)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.w-full{width:100%}.h-52{height:3.25rem}.h-96{height:6rem}.h-\\[200px\\]{height:200px}.mt-16{margin-top:1rem}.my-16{margin-top:1rem;margin-bottom:1rem}.mb-12{margin-bottom:0.75rem}.last\\:mb-0:last-child{margin-bottom:0rem}.last\\:mt-16:last-child{margin-top:1rem}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.relative{position:relative}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.rounded{border-radius:0.25rem}.rounded-lg{border-radius:16px}.rounded-t-lg{border-top-left-radius:16px;border-top-right-radius:16px}.border-2{border-width:2px}.p-8{padding:0.5rem}.p-24{padding:1.5rem}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.top-2{top:0.125rem}.bottom-2{bottom:0.125rem}.left-2{left:0.125rem}.right-2{right:0.125rem}.-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))}.overflow-hidden{overflow:hidden}.space-y-8{--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.space-y-16{--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}";
 var EdsStepsV2Style0 = edsStepsV2Css;
 
 class EdsStepsV2 {
@@ -12944,6 +12956,7 @@ class EdsStepsV2 {
         this.steps = [];
         this.type = 'static';
         this.imageSrc = undefined;
+        this.imageWidth = undefined;
         this.bg = true;
         this.message = undefined;
         this.activeStep = 0;
@@ -12999,9 +13012,9 @@ class EdsStepsV2 {
     }
     render() {
         const steps = this.parsedSteps;
-        return (hAsync("div", { key: 'e86620aed9aafbf0c8e0cde0230b2147df952379', class: this.articleClasses() }, this.imageSrc ? (hAsync("div", { class: "w-full mb-12 rounded-t-lg overflow-hidden border-2" }, hAsync("eds-img", { src: this.imageSrc, "with-bg": "true", "lazy-load": "true", alt: "Step illustration" }))) : (this.message && (hAsync("div", { class: "w-full bg-[#00A595] rounded-t-lg border-2" }, hAsync("div", { class: "p-24" }, hAsync("span", { class: "text-inverse f-heading-04 " }, this.message))))), hAsync("div", { key: '773e51621fbfbc7b828d196d1e64a9752d02e5a4', class: "p-8" }, this.type === 'linear' ? (hAsync("div", { class: "steps" }, steps.map((step, index) => (hAsync("div", { class: "step space-y-8", key: index }, hAsync("h3", { onClick: () => this.handleStepClick(index) }, step.title), this.activeStep === index && (hAsync("div", { class: "content" }, hAsync("div", { class: "f-body-02 text-lighter mt-16", innerHTML: step.content }), hAsync("eds-button", { label: index === steps.length - 1 ? 'Finish' : 'Continue', intent: "primary", class: "next-btn", onClick: this.handleNext }), hAsync("eds-button", { label: "Back", intent: "ghostInverse", onClick: this.handleBack, disabled: index === 0, "extra-class": index === 0 ? 'hidden' : 'ml-8 block' })))))))) : (
+        return (hAsync("div", { key: 'bbcec2dd9a5096eb0cecf0d413892e5708822f52', class: this.articleClasses() }, this.imageSrc ? (hAsync("div", { class: "w-full mb-12 rounded-t-lg overflow-hidden border-2" }, hAsync("eds-img", { src: this.imageSrc, width: this.imageWidth, "with-bg": "true", "lazy-load": "true", alt: "Step illustration" }))) : (this.message && (hAsync("div", { class: "w-full bg-[#00A595] rounded-t-lg border-2" }, hAsync("div", { class: "p-24" }, hAsync("span", { class: "text-inverse f-heading-04 " }, this.message))))), hAsync("div", { key: 'db0618aad7d5986fcb0889f1c439be73f83a00df', class: "p-8" }, this.type === 'linear' ? (hAsync("div", { class: "steps" }, steps.map((step, index) => (hAsync("div", { class: index === 0 ? 'step' : 'step space-y-16', key: index }, hAsync("h3", { onClick: () => this.handleStepClick(index) }, step.title), this.activeStep === index && (hAsync("div", { class: "content" }, hAsync("slot", { name: `step-${index}` }, hAsync("div", { class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16', innerHTML: step.content })), hAsync("eds-button", { label: index === steps.length - 1 ? 'Finish' : 'Continue', intent: "primary", class: "next-btn", onClick: this.handleNext }), hAsync("eds-button", { label: "Back", intent: "ghostInverse", onClick: this.handleBack, disabled: index === 0, "extra-class": index === 0 ? 'hidden' : 'ml-8 block' })))))))) : (
         // Static mode: show all steps with their content.
-        hAsync("div", { class: "steps space-y-8" }, steps.map((step, index) => (hAsync("div", { class: "step", key: index }, hAsync("h3", { onClick: () => this.handleStepClick(index) }, step.title), hAsync("div", { class: "content" }, hAsync("div", { class: "f-body-02 text-lighter mt-16", innerHTML: step.content }))))))))));
+        hAsync("div", { class: "steps space-y-8" }, steps.map((step, index) => (hAsync("div", { class: "step", key: index }, hAsync("h3", { onClick: () => this.handleStepClick(index) }, step.title), hAsync("div", { class: "content" }, hAsync("slot", { name: `step-${index}` }, hAsync("div", { class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16', innerHTML: step.content })))))))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -13015,6 +13028,7 @@ class EdsStepsV2 {
             "steps": [1],
             "type": [1],
             "imageSrc": [1, "image-src"],
+            "imageWidth": [2, "image-width"],
             "bg": [4],
             "message": [1],
             "activeStep": [32]
@@ -13053,11 +13067,11 @@ class EdsSwitch {
     render() {
         // Compute an accessible name based on state.
         const accessibleLabel = this.labelOn || this.labelOff ? (this.checked ? this.labelOn : this.labelOff) : 'Toggle switch';
-        return (hAsync("div", { key: '442876be1bad7ea8c9e383bc68b192a2744c38f9', class: "switch-container" }, this.labelOff && hAsync("span", { key: 'e4a7b01c0188d26e5b6524741b1c8ef66e357e35', class: "switch-label switch-label--off mr-8" }, this.labelOff), hAsync("button", { key: 'f56b3762622671acf793568a96567193c38999c7', type: "button", role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": accessibleLabel, class: {
+        return (hAsync("div", { key: '385c1463b11e83ff5b982218e0f28c54299210fd', class: "switch-container" }, this.labelOff && hAsync("span", { key: 'f7e825a34487a1cec466b5172d77c2802029607c', class: "switch-label switch-label--off mr-8" }, this.labelOff), hAsync("button", { key: 'fd1e8ffab675ee79edc6b99de4dfff42545d91af', type: "button", role: "switch", "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": accessibleLabel, class: {
                 switch: true,
                 'switch--checked': this.checked,
                 'switch--disabled': this.disabled
-            }, onClick: this.toggleSwitch, disabled: this.disabled }, hAsync("span", { key: 'b76e89a1e37130542dd86ce3aed8c5690aeeda63', class: "switch-handle" })), this.labelOn && hAsync("span", { key: '4e5d4f8a2f19bb612a17fa73e441e7e718b71508', class: "switch-label switch-label--on ml-8" }, this.labelOn)));
+            }, onClick: this.toggleSwitch, disabled: this.disabled }, hAsync("span", { key: '0d185957ffe2577ffc8798c298820c84c838a2a4', class: "switch-handle" })), this.labelOn && hAsync("span", { key: 'f12b752ff94a363bb9593bd00cf43e7110e4399e', class: "switch-label switch-label--on ml-8" }, this.labelOn)));
     }
     get el() { return getElement(this); }
     static get style() { return EdsSwitchStyle0; }
@@ -13076,7 +13090,7 @@ class EdsSwitch {
     }; }
 }
 
-const edsTableCss = "table{text-indent:0;border-color:inherit;border-collapse:collapse;}.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}.pt-32{padding-top:2rem}.pt-40{padding-top:2.5rem}.pt-48{padding-top:3rem}.pb-28{padding-bottom:1.75rem}.pb-60{padding-bottom:3.75rem}.mt-20{margin-top:1.25rem}.mt-28{margin-top:1.75rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.overflow-x-auto{overflow-x:auto}.mt-6{margin-top:0.375rem}.p-0{padding:0rem}.m-0{margin:0rem}.border{border-width:1px}.border-softer{border:1px solid rgba(0, 0, 0, .1)}.even\\:bg-inverse-softer:nth-child(even){background-color:rgba(255, 255, 255, .15)}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.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)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.break-words{overflow-wrap:anywhere}";
+const edsTableCss = "table{text-indent:0;border-color:inherit;border-collapse:collapse;}.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}.pt-32{padding-top:2rem}.pt-40{padding-top:2.5rem}.pt-48{padding-top:3rem}.pb-28{padding-bottom:1.75rem}.pb-60{padding-bottom:3.75rem}.mt-20{margin-top:1.25rem}.mt-28{margin-top:1.75rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.overflow-x-auto{overflow-x:auto}.mt-6{margin-top:0.375rem}.p-0{padding:0rem}.m-0{margin:0rem}.border{border-width:1px}.border-softer{border:1px solid rgba(0, 0, 0, .1)}.even\\:bg-inverse-softer:nth-child(even){background-color:rgba(255, 255, 255, .15)}.px-8{padding-left:0.5rem;padding-right:0.5rem}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.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)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.break-words{overflow-wrap:anywhere}";
 var EdsTableStyle0 = edsTableCss;
 
 /**
@@ -13093,6 +13107,7 @@ var EdsTableStyle0 = edsTableCss;
 class EdsTable {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.rowaction = createEvent(this, "rowaction", 7);
         this.handleResize = () => {
             this.updateContainerWidth();
         };
@@ -13104,6 +13119,10 @@ class EdsTable {
         this.searchEnabled = false;
         this.hostWidth = undefined;
         this.columnSize = 'default';
+        this.actions = [];
+        this.actionTemplate = undefined;
+        this.parsedActions = [];
+        this.dataColumns = [];
         this.tbData = [];
         this.columns = [];
         this.currentPage = 1;
@@ -13118,8 +13137,18 @@ class EdsTable {
     handleConfigChange() {
         this.parseConfig();
     }
+    handleActionsChange() {
+        try {
+            this.parsedActions = typeof this.actions === 'string' ? JSON.parse(this.actions) : this.actions;
+        }
+        catch (_a) {
+            console.error('Failed to parse actions JSON');
+            this.parsedActions = [];
+        }
+    }
     componentWillLoad() {
         this.parseConfig();
+        this.handleActionsChange();
         this.data ? this.parseData() : this.endpoint && this.fetchData();
     }
     componentDidLoad() {
@@ -13148,24 +13177,20 @@ class EdsTable {
     parseData() {
         try {
             this.tbData = parseData(this.data);
-            //this.tbData = typeof this.data === 'string' ? JSON.parse(this.data) : this.data || [];
             this.totalRows = this.tbData.length;
             this.updateColumns();
             this.currentPage = 1;
         }
         catch (error) {
-            // eslint-disable-next-line
             console.error('Failed to parse data:', error);
             this.tbData = [];
         }
     }
     parseConfig() {
         try {
-            //this.parsedConfig = parseData(this.config);
             this.parsedConfig = typeof this.config === 'string' ? JSON.parse(this.config) : this.config;
         }
         catch (error) {
-            // eslint-disable-next-line
             console.error('Failed to parse config:', error);
             this.parsedConfig = {};
         }
@@ -13177,7 +13202,6 @@ class EdsTable {
             this.data = data;
         }
         catch (error) {
-            // eslint-disable-next-line
             console.error('Failed to fetch data:', error);
         }
     }
@@ -13213,24 +13237,52 @@ class EdsTable {
     handleSearch(event) {
         this.searchQuery = event.target.value;
         this.currentPage = 1;
-        /*sendAnalytics({
-          category: 'ui-component',
-          parentContext: null,
-          tag: `${this.hostEl.tagName.toLowerCase()}/eds-input-field/search`,
-          name: `${this.searchQuery}` || '',
-          action: 'page'
-        });*/
     }
     renderCell(value, column) {
         var _a;
         const format = (_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.format;
         return format === 'uppercase' ? (value === null || value === void 0 ? void 0 : value.toString().toUpperCase()) : format === 'svg' ? (hAsync("div", { innerHTML: value })) : format === 'bold' ? (hAsync("strong", null, value)) : format === 'code' ? (hAsync("code", null, value)) : (value);
     }
+    /**
+     * Renders one action (button or checkbox) for a specific action‐name.
+     * Used by the “Actions” column below.
+     */
+    renderSingleActionCell(actionName, row) {
+        var _a;
+        const act = this.parsedActions.find((a) => a.name === actionName);
+        if (this.actionTemplate) {
+            return this.actionTemplate(row);
+        }
+        const type = act.type || 'button';
+        if (type === 'checkbox') {
+            const boundField = (_a = act.field) !== null && _a !== void 0 ? _a : act.name;
+            const checked = !!row[boundField];
+            return (hAsync("eds-input-field", { name: `chc-${actionName}`, label: act.label, type: "checkbox", checked: checked, onChange: (e) => this.emitAction(act.name, row, e.target.checked) }));
+        }
+        return hAsync("eds-link", { label: act.label, intent: "weak", onClick: () => this.emitAction(act.name, row) });
+    }
+    emitAction(actionName, row, checked) {
+        sendAnalytics({
+            category: 'ui-component',
+            parentContext: null,
+            tag: `${this.hostEl.tagName.toLowerCase()}/action`,
+            name: actionName,
+            action: 'click'
+        });
+        this.rowaction.emit({ action: actionName, row, checked: !!checked });
+    }
     shouldEnablePagination() {
         return this.paginationEnabled && this.totalRows > this.rowsPerPage;
     }
     updateColumns() {
+        var _a, _b;
+        // 1) Grab all data‐keys from the first row (if any) as before:
         this.columns = this.tbData.length > 0 ? Object.keys(this.tbData[0]) : [];
+        // 2) Instead of pushing each action.name, we add just a single “actions” column
+        //    (you can call it anything; we’ll detect it in render())
+        if (((_b = (_a = this.parsedActions) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0 && this.tbData.length > 0) {
+            this.columns.push('actions');
+        }
     }
     getVisibleColumnsCount() {
         return this.columns.filter((column) => { var _a; return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden); }).length;
@@ -13245,28 +13297,45 @@ class EdsTable {
         }
         return divisionFactor;
     }
+    capitalize(str) {
+        return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
+    }
     render() {
-        // Use containerWidth state that is updated on resize.
         const currentContainerWidth = this.hostWidth && this.hostWidth.trim() !== '' ? Number(this.hostWidth) : this.containerWidth || 400;
-        // Calculate the number of visible columns and the column width.
         const visibleColumnsCount = this.getVisibleColumnsCount();
         const columnWidth = visibleColumnsCount > 0 ? Math.floor((currentContainerWidth / visibleColumnsCount) * this.divisionFactor()) : 100;
         const paginatedRows = this.getPaginatedRows();
         const lastPage = Math.ceil(this.totalRows / this.rowsPerPage);
-        return (hAsync("div", { key: '81735ac374853c8c92b3f50e26263ff9d71b326c' }, this.searchEnabled && (hAsync("div", { key: '0b2ab8dbb343033f605e2028890bd963cd650998' }, hAsync("eds-input-field", { key: 1, name: "search", "aria-label": "Search", type: "text", placeholder: "Search...",
-            // @ts-ignore
-            onInput: (event) => this.handleSearch(event) }))), hAsync("div", { key: 'eb3eebe6fb124d4e1983b2fb7e636707817d36bd', class: "mt-20" }, hAsync("table", { key: '03b312ac20bdec28843a46907a3cc4fba69f62ae', class: "block overflow-x-auto mt-6 p-0" }, hAsync("thead", { key: 'ccab58dc46ae765df28da97ded6b1dd14d45d7f1' }, hAsync("tr", { key: '904a125aad610cebe42b0bce46615be38f0ee17a', class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((column) => {
+        return (hAsync("div", { key: '5034177431626ab2bfc5fd0118c006d11a4f6e96' }, this.searchEnabled && (hAsync("div", { key: '86e1a6ffc4bed69f290b3a53031341ab276eaf04' }, hAsync("eds-input-field", { key: 1, name: "search", "aria-label": "Search", type: "text", placeholder: "Search...", onInput: (event) => this.handleSearch(event) }))), hAsync("div", { key: 'bc11838d819ecf89c5ba1cc1cfe7ac0af0e82b59', class: "mt-20" }, hAsync("table", { key: '97f16b65eb1d9387e9ca7588184c9e68c1afcc2e', class: "block overflow-x-auto mt-6 p-0" }, hAsync("thead", { key: 'f4d64ada28c225db1b224277513e663a99de1cec' }, hAsync("tr", { key: 'c6a69e159cceada0f7143c0acb787e5c23242ae7', class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((col) => {
             var _a;
-            return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden) && (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words", style: { minWidth: `${columnWidth - 4}px` } }, column));
-        }))), hAsync("tbody", { key: 'a4c54c9c89d15546020dbb684e5486decde33f30' }, paginatedRows.map((row) => (hAsync("tr", { class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((column) => {
+            // 3) For the “actions” column, override the header to “Actions”
+            if (col === 'actions') {
+                // You can choose a smaller min‐width here if you wish:
+                return (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words", style: { minWidth: `${columnWidth - 4}px` } }, "Actions"));
+            }
+            // Otherwise, render column name or action label if you do want to override:
+            if (!((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden)) {
+                return (hAsync("th", { class: "m-0 py-8 border border-softer f-ui-02 break-words", style: { minWidth: `${columnWidth - 4}px` } }, this.capitalize(col)));
+            }
+            return null;
+        }))), hAsync("tbody", { key: '133af82fdd1f820e853734ab48123cb3db527e15' }, paginatedRows.map((row) => (hAsync("tr", { class: "m-0 p-0 border border-softer even:bg-inverse-softer" }, this.columns.map((col) => {
             var _a;
-            return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden) && (hAsync("td", { class: "text-center border border-softer m-0 py-8 f-ui-2 break-words", style: { minWidth: `${columnWidth - 4}px` } }, this.renderCell(row[column], column)));
-        }))))))), this.shouldEnablePagination() && (hAsync("div", { key: '2a248cbbe81ac8c1ad4dfbb49a9615f15931bac6', class: "mt-20" }, hAsync("eds-pagination", { key: '11701d81922ca4c8b36fe82be32316a175eddbcd', currentPage: this.currentPage, lastPage: lastPage, perPage: this.rowsPerPage, total: this.totalRows, mode: "default" })))));
+            if (col === 'actions') {
+                // 4) Render ALL actions inside a single <td> for this row:
+                return (hAsync("td", { class: "text-center border border-softer m-0 f-ui-02 break-words actions-cell", style: { minWidth: `${columnWidth - 4}px` } }, hAsync("div", { style: { display: 'flex', gap: '0.5rem', justifyContent: 'center', flexWrap: 'wrap' } }, this.parsedActions.map((act) => (hAsync("span", { style: { whiteSpace: 'nowrap' } }, this.renderSingleActionCell(act.name, row)))))));
+            }
+            if (!((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden)) {
+                // Regular data cell:
+                return (hAsync("td", { class: "text-center border border-softer m-0 py-8 f-ui-2 break-words", style: { minWidth: `${columnWidth - 4}px` } }, this.renderCell(row[col], col)));
+            }
+            return null;
+        }))))))), this.shouldEnablePagination() && (hAsync("div", { key: '85032d06cd0ac5dae9b504d423fceba3cd074861', class: "mt-20" }, hAsync("eds-pagination", { key: '8caf6f57960e222c04d45f57a5811cd7bd524f4c', currentPage: this.currentPage, lastPage: lastPage, perPage: this.rowsPerPage, total: this.totalRows, mode: "default" })))));
     }
     get hostEl() { return getElement(this); }
     static get watchers() { return {
         "data": ["handleDataChange", "parseData"],
-        "config": ["handleConfigChange"]
+        "config": ["handleConfigChange"],
+        "actions": ["handleActionsChange"]
     }; }
     static get style() { return EdsTableStyle0; }
     static get cmpMeta() { return {
@@ -13281,6 +13350,10 @@ class EdsTable {
             "searchEnabled": [4, "search-enabled"],
             "hostWidth": [1, "host-width"],
             "columnSize": [1, "column-size"],
+            "actions": [1],
+            "actionTemplate": [16],
+            "parsedActions": [32],
+            "dataColumns": [32],
             "tbData": [32],
             "columns": [32],
             "currentPage": [32],
@@ -13860,7 +13933,7 @@ class EdsUser {
     }
     render() {
         const user = this.parsedUser;
-        return (hAsync("div", { key: '9e2a8da09c2c15080e3b1ccf5b8e0e93b679d34b', class: "block" }, hAsync("div", { key: 'ccc34b3c7b0ab8d515eebfa1962264365d20c788', class: "flex items-center" }, hAsync("eds-dropdown", { key: '5283fb61297cd5f631d04da9ca19371a3778068c', label: `Welcome, ${user.preferred_username}`, intent: "tertiary", "aria-label": "User Menu", "dropdown-pos": "right", "dropdown-offset": "false", icon: "chevron-down", class: "text-default" }, hAsync("div", { key: 'd39e041e54fb59a409520e8b88f6f569d55cc6fc', class: "min-w-[280px] p-8" }, hAsync("div", { key: '50e571e30a6902b8443b9766dfb1018c76a2f68e', class: "flex gap-x-16" }, hAsync("eds-avatar", { key: '88a675a256466366aba1028831626253d11d2474', "first-name": user.given_name, "last-name": user.family_name, initials: this.initials, color: "grey" }), hAsync("div", { key: '99626794a7fa243bc599e9e77b0bc1b717d14c96', class: "max-w-full" }, user.name && hAsync("p", { key: '1f1e33e19fd2b266f442b596953100f6b5e6dfcd', class: "f-ui-01 text-default w-full text-ellipsis" }, user.name), user.preferred_username && hAsync("p", { key: 'a36ebac6fdae9fa059887f7cc5d1009179f8eef9', class: "f-ui-03-light text-light mt-4" }, user.preferred_username), user.email && hAsync("p", { key: '976cd925af318831a22f1d43242e0295614bb2a1', class: "f-ui-03-light text-light mt-4" }, user.email))), hAsync("eds-block-break", { key: '7d189caaab8a9b593017312d6e3d6943c36de22b' }), hAsync("div", { key: 'efcfc9a2c1f774abfab09b09682d7839bd1d5d2c', class: "text-default flex w-full flex-col gap-y-8" }, hAsync("slot", { key: 'f54425f35d804753b94bb61e1d8e211a1583ac3b' })))))));
+        return (hAsync("div", { key: '9e2a8da09c2c15080e3b1ccf5b8e0e93b679d34b', class: "block" }, hAsync("div", { key: 'ccc34b3c7b0ab8d515eebfa1962264365d20c788', class: "flex items-center" }, hAsync("eds-dropdown", { key: 'dc4920fd442baa9f13d9f2b9a21065b5184eba83', label: `Hi, ${user.preferred_username}`, intent: "tertiary", "aria-label": "User Menu", "dropdown-pos": "right", "dropdown-offset": "false", icon: "chevron-down", class: "text-default" }, hAsync("div", { key: '0522db7fc229186c645665a4c9eeedc46fb5823b', class: "min-w-[280px] p-8" }, hAsync("div", { key: 'af7b9daec713d24f8a1415415d19cdf48905c0cb', class: "flex gap-x-16" }, hAsync("eds-avatar", { key: 'c3ea7307d9beb597fe93d3942b7724f8526298ad', "first-name": user.given_name, "last-name": user.family_name, initials: this.initials, color: "grey" }), hAsync("div", { key: '7af823b5f38a3d7acf16c633471dcfe74bca5e3c', class: "max-w-full" }, user.name && hAsync("p", { key: '5973dfbac0efceeddb0dc211d9c502a1ad3b0dde', class: "f-ui-01 text-default w-full text-ellipsis" }, user.name), user.preferred_username && hAsync("p", { key: '5989927760ed2a2d1365661bbdc112a3a3d23bbf', class: "f-ui-03-light text-light mt-4" }, user.preferred_username), user.email && hAsync("p", { key: 'ee36be95298c0c7a748537012d48a85884955904', class: "f-ui-03-light text-light mt-4" }, user.email))), hAsync("eds-block-break", { key: 'fb3ef5cad6e81f51983e54914412131c3bd4cbc2' }), hAsync("div", { key: 'e3784f3f4931378bf55d766d4a1cf5e24a75d462', class: "text-default flex w-full flex-col gap-y-8" }, hAsync("slot", { key: 'c0052bb56286d9a3fdc686c8407e105499a38084' })))))));
     }
     get hostEl() { return getElement(this); }
     static get style() { return EdsUserStyle0; }