genesys-spark-components 4.199.1 → 4.199.2

package/dist/collection/components/legacy/gux-switch-legacy/gux-switch-item/gux-switch-item.js

@@ -13,7 +13,7 @@ export class GuxSwitchItem {
         }
     }
     render() {
-        return (h(Host, { key: '8b72df2f9868e4b2c20460af0a3ff1aff10a697c', class: { 'gux-selected': this.selected } }, h("button", { key: '539de63e8aa217c9556749e81809faed61e2a55d', "aria-current": this.selected.toString(), type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: 'b432beda91516d20edcd6d5c833cbebb8639dafe' }))));
+        return (h(Host, { key: 'b8aeaabdcc56dc2c2dd88e48ea66e74e73fd9a36', class: { 'gux-selected': this.selected } }, h("button", { key: '1442e755144c081e2993111b01bf45519719c61d', "aria-current": this.selected.toString(), type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: 'd4febff316d2eeae51b2226c479b79fdb3d4bb19' }))));
     }
     static get is() { return "gux-switch-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/legacy/gux-switch-legacy/gux-switch.js

@@ -30,7 +30,7 @@ export class GuxSwitch {
         });
     }
     render() {
-        return (h(Host, { key: 'fb01250fbd91cd4004e5885af79ddfb164b6f2b4', role: "group", class: `gux-${this.layout}` }, h("slot", { key: 'c3b650e13c270d34416ef5e44865d9302a8bd6d0', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: '4259e3aa5e18a54b8c5923b6d98ae70814127859', role: "group", class: `gux-${this.layout}` }, h("slot", { key: 'a2efc869fd19aa1f6b316965afa158ac46c51219', onSlotchange: this.slotChanged.bind(this) })));
     }
     static get is() { return "gux-switch-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-accordion/gux-accordion-section/gux-accordion-section.js

@@ -50,20 +50,20 @@ export class GuxAccordionSection {
         this.hasIconSlot = !!this.root.querySelector('[slot="icon"]');
     }
     render() {
-        return (h("section", { key: '5f6fbfed6b1749839798955d3ff9b47b1540cc7f', class: { 'gux-disabled': this.disabled } }, h("div", { key: 'e4279506105630d808901c7eb638d3e97c2442d9', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: '5d1a5ef4a257f581a2267767f92d6f5390ec2254', class: {
+        return (h("section", { key: '7a36dda42c5665bfb90062f5c9a7779d2ece2f1f', class: { 'gux-disabled': this.disabled } }, h("div", { key: 'a57a616a608c4d798e2e922e1e90068f81c6083f', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: 'f5c0bcde76bf3d876a3524b692ea597ad164a622', class: {
                 'gux-header': true,
                 'gux-reverse-headings': this.reverseHeadings
-            }, type: "button", "aria-expanded": this.open.toString(), "aria-controls": this.sectionId, disabled: this.disabled, onClick: this.toggle.bind(this) }, this.hasIconSlot && h("slot", { key: '7b6c53f3a7d869e461434ab41e3e0daaac42f329', name: "icon" }), h("div", { key: 'ab82e1c8c6d17d99f93da0347ffcf3b50aadffe6', class: {
+            }, type: "button", "aria-expanded": this.open.toString(), "aria-controls": this.sectionId, disabled: this.disabled, onClick: this.toggle.bind(this) }, this.hasIconSlot && h("slot", { key: '1e871497259e9cfd12e961a4e4e5e7ba39fab54e', name: "icon" }), h("div", { key: '4c37679e609366454aed59007ee834bcf9713289', class: {
                 'gux-header-text': true
-            } }, h("slot", { key: '9851b6acac5b60c2378b71d2409051e69da5ca2e', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: '4b761c850e50ef9b73daba6043b78b22ae89f743', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: '72834a00027374ab2cccdda2e89af435e801f54f', class: {
+            } }, h("slot", { key: 'a64c30daec40a93cd84a345edaf4f6a0c7c8d8da', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: '5d50e96774908737d166861ca7306222cef9ca36', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: '16d5f3c48a7896d8df83be98706edd821b1a8d9f', class: {
                 'gux-header-icon': true,
                 'gux-expanded': this.open,
                 'gux-arrow-position-start': this.isArrowPositionBeforeText()
-            } }, h("gux-icon", { key: '67b4447d2cbe2678ea172250b3c387f69eb0811b', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'd40e94866149954a8e664c3aec588b74e6b89ed6', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
+            } }, h("gux-icon", { key: '6329579c186313c2a09be2f8e7c165db0e19de05', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'b2473f6247c55baf2029f3726e3ee27a3374090a', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
                 'gux-content': true,
                 'gux-expanded': this.open,
                 'gux-text-content-layout': this.contentLayout === 'text'
-            } }, h("slot", { key: 'd39cbee9166f563135c04e3cb52ae467f077d563', name: "content" }))));
+            } }, h("slot", { key: 'f44baa77198ef6007b84cdece15855ac5eb542d7', name: "content" }))));
     }
     static get is() { return "gux-accordion-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-accordion/gux-accordion.js

@@ -36,7 +36,7 @@ export class GuxAccordion {
         }
     }
     render() {
-        return (h("slot", { key: '32ee82840ce880c41184207782dfeffab71c83bd' }));
+        return (h("slot", { key: '62afe840282269949f2f85a70733fc80240cd41d' }));
     }
     static get is() { return "gux-accordion"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-action-button/gux-action-button.js

@@ -138,7 +138,7 @@ export class GuxActionButton {
         this.i18n = await buildI18nForComponent(this.root, defaultResources);
     }
     render() {
-        return (h("div", { key: 'ab6651632d8c2c2053edded32302773689fbae3b', class: "gux-action-button-container" }, h("gux-popup", { key: '3a4f2a3ee0e74a29891a75b9b54980d902fb18ef', expanded: this.isOpen, disabled: this.disabled, placement: "bottom-end", "exceed-target-width": true }, h("div", { key: 'ab21d19adc79227f6cd77025941ef257a3ad8202', slot: "target", class: "gux-action-button-container" }, h("gux-button-slot", { key: '5daeb543bcd4bd4b5fee0f4834c3d7030cd9841d', class: "gux-action-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: 'a34e7510d3d05b51c7a17f5e65e4d1a381c22974', type: this.type, disabled: this.disabled, onClick: () => this.onActionClick(), "data-testid": "action-button" }, h("slot", { key: '60ff4588b12a00f89f8aacfcf599031108ba5b76', name: "title" }))), h("gux-button-slot", { key: '0295bb3572c175166668f51c9d61b3b7136db617', class: "gux-dropdown-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: 'ffe8eb7d4ea57866c01002f6219c0ea0e9bb9745', type: "button", disabled: this.disabled, ref: el => (this.dropdownButton = el), onMouseUp: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), "aria-label": this.i18n('moreOptions'), "data-testid": "dropdown-button" }, h("gux-icon", { key: '0d4286835f820099d577f2b7461937c2263b4e1c', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'f5ab23c3e725a03b0629292b20d0ad5f63ae7262', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: '75d5285b1c6f0841bf455cd72da14b00388d4e9e', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '42af4c5512d8e9e519321081c0e4bc9a6d0e3c70' }))))));
+        return (h("div", { key: '9fb75bfefeb4a11e607cfc238ba44a7d614f6aec', class: "gux-action-button-container" }, h("gux-popup", { key: '2c389c1470836be61de4527f775371ca96948c0c', expanded: this.isOpen, disabled: this.disabled, placement: "bottom-end", "exceed-target-width": true }, h("div", { key: '716b671dfe9ba9e0e6e17eb891a066f621ec5904', slot: "target", class: "gux-action-button-container" }, h("gux-button-slot", { key: 'd66da2901a1b7d6627a60d65834adf2e838614b0', class: "gux-action-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '442b1a98bc77f3ffd60c8a7caee6d18412c894de', type: this.type, disabled: this.disabled, onClick: () => this.onActionClick(), "data-testid": "action-button" }, h("slot", { key: '25441105f217180fe3ba4e714122894c4682251a', name: "title" }))), h("gux-button-slot", { key: 'cb6c2d6911075b2bc84a6beea752eb89e4ace912', class: "gux-dropdown-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '7c61e2bb65f8ef3f299d934f0e14fc24b56a2377', type: "button", disabled: this.disabled, ref: el => (this.dropdownButton = el), onMouseUp: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), "aria-label": this.i18n('moreOptions'), "data-testid": "dropdown-button" }, h("gux-icon", { key: 'da09cbac51f95be1a106ab1dc80254285b0c3e37', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'ea3a0980df79e10065f648406cdc2e44b43aba89', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: '8a5d0207687eecd2355c4aecdd46ba8ed265e327', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '7624cda20a147dc6f4508aa2efb59deda6ca441f' }))))));
     }
     static get is() { return "gux-action-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-badge/gux-badge.js

@@ -52,7 +52,7 @@ export class GuxBadge {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: 'cf8ba6c4cd676986da830cd74ead2a53a326d355', class: {
+        return (h("div", { key: 'c82a69b2ba883220c70047f4bb8e0143d64f5ab7', class: {
                 'gux-badge': true,
                 [`gux-${this.accent}`]: true,
                 'gux-bold': this.bold

package/dist/collection/components/stable/gux-blank-state/gux-blank-state.js

@@ -43,7 +43,7 @@ export class GuxBlankState {
         this.hasGuidance = hasSlot(this.root, 'additional-guidance');
     }
     render() {
-        return (h("div", { key: '7b2a305d3f96bc2ee89f0abb95e612f1d6cf63ad', class: "gux-container" }, h("div", { key: '1eb9e116c0ed3878c791f168b135fb1407b4b6f0', class: "gux-image" }, h("slot", { key: '2b42ea2ffd57b17045dc4b3144b17c1ee8db0866', name: "image" })), h("div", { key: '7eea5000800e7b2f21c8a065fec8ab0dc1258a2d', class: "gux-message" }, h("slot", { key: '7938cbcb0d2e37c8fc19113cdd81a47956916bda', name: "primary-message" })), this.renderGuidanceSlot(), this.renderCallToActionSlot()));
+        return (h("div", { key: '0a02b112b77744f869aca6dad69f9c3557aec550', class: "gux-container" }, h("div", { key: '5420c1ffa848a76c8bc5564ce46877d8dd506020', class: "gux-image" }, h("slot", { key: 'c79a013df93656c195b0a02f342d52ff88cf6d1e', name: "image" })), h("div", { key: 'cdab0c7570e102e7af161ae20973b27e50470a41', class: "gux-message" }, h("slot", { key: '587f0bb85fff1c5ed585e4e30494e8578788b16c', name: "primary-message" })), this.renderGuidanceSlot(), this.renderCallToActionSlot()));
     }
     static get is() { return "gux-blank-state"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-breadcrumbs/breadcrumb-item/gux-breadcrumb-item.js

@@ -35,7 +35,7 @@ export class GuxBreadcrumbItem {
     }
     render() {
         const accent = this.getAccent();
-        return (h(Host, { key: 'da70ca582d1e1643780fa1f1f35cce1381459d65', role: "listitem" }, h("span", { key: 'eab47a10ad0666b7013b961668ff36fe71cbabe1', class: `gux-breadcrumb-generation gux-${accent}` }, this.getBreadcrumb(accent), this.getSeparatorIcon())));
+        return (h(Host, { key: '57b4ece742278d8cfaa8807ca87d91d43c4990a8', role: "listitem" }, h("span", { key: '26d8eed82048367a36dae7582820d4c41306aec7', class: `gux-breadcrumb-generation gux-${accent}` }, this.getBreadcrumb(accent), this.getSeparatorIcon())));
     }
     static get is() { return "gux-breadcrumb-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-breadcrumbs/gux-breadcrumbs.js

@@ -19,7 +19,7 @@ export class GuxBreadcrumbs {
         Array.from(this.root.children).forEach(child => forceUpdate(child));
     }
     render() {
-        return (h("nav", { key: '82732dd5fcdd18158bcee8b8bdf9fd35652cb712', "aria-label": this.i18n('breadcrumbs') }, h("ol", { key: '57711a2233a7b7a77b5f88f9f6a812102a9e7ece' }, h("slot", { key: '19753c53e76e74c6fb83cf33bca8ba0a80b5b872', onSlotchange: this.onSlotChange.bind(this) }))));
+        return (h("nav", { key: 'a013e943aa3ac16f108f54a2cfc34add1cca65a3', "aria-label": this.i18n('breadcrumbs') }, h("ol", { key: 'a9d910293665b785f3a511c526f007481dce2408' }, h("slot", { key: 'fef8837cb85c9d4efadb8a41d2576be4f274d3ba', onSlotchange: this.onSlotChange.bind(this) }))));
     }
     static get is() { return "gux-breadcrumbs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-button/gux-button.js

@@ -26,10 +26,10 @@ export class GuxButton {
     }
     render() {
         return [
-            h("button", { key: '5dd72d4f34446bc522c5627ed1799d17adacbed1', id: this.buttonId, type: this.type, disabled: this.disabled, class: {
+            h("button", { key: 'e28c1a67ace4de6fef7cb98e203a49118fd2033e', id: this.buttonId, type: this.type, disabled: this.disabled, class: {
                     [`gux-${this.accent}`]: true,
                     'gux-icon-only': this.iconOnly
-                }, "aria-label": this.guxTitle, autofocus: this.autofocus }, h("slot", { key: '15e82ba7e44507807c4db0a0635abc72fb4d7185', onSlotchange: this.slotChanged.bind(this) })),
+                }, "aria-label": this.guxTitle, autofocus: this.autofocus }, h("slot", { key: '45020b966f76c9ad44524da5c7f13fdec6788475', onSlotchange: this.slotChanged.bind(this) })),
             this.renderTooltip()
         ];
     }

package/dist/collection/components/stable/gux-button-multi/gux-button-multi.js

@@ -126,7 +126,7 @@ export class GuxButtonMulti {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h("gux-popup", { key: 'ba05fdc3f9a8f0ca73acfeb8f28a710a3ab4e984', expanded: this.isOpen, "exceed-target-width": true, placement: "bottom-end" }, h("div", { key: '5272ebe9d1a123e90980e8de8b410a02b8e25c2f', slot: "target", class: "gux-button-multi-container" }, h("gux-button-slot", { key: '6cea1c008395653142b45e34587f0c627cc297ca', class: "gux-dropdown-button", accent: getGuxButtonMultiAccent(this.accent) }, h("button", { key: '27d9e8e9077aa02d1f6e07829d6602ae3555a848', type: "button", disabled: this.disabled, ref: el => (this.dropdownButton = el), onMouseUp: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), "aria-label": this.guxAriaLabel }, h("slot", { key: 'b43987ca80023b12d7c6748cbd4a7772dd9ba1ec', name: "title" }), h("gux-icon", { key: '3d6595a0e6549f7abbb707b3047c433d866edeee', size: "small", decorative: true, "icon-name": "custom/chevron-down-small-regular" })))), h("div", { key: '316fd58cf88dafb1e358d9cbc8d084af22670886', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: '938f1fb7bba1d82d3e559b7468a1515d9fe2beaf', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '90daa2a1c2d3945ced077c659555bbe2d6dc080b' })))));
+        return (h("gux-popup", { key: 'fdc223e8b845669f25dee4767f7b3e55d7be8f46', expanded: this.isOpen, "exceed-target-width": true, placement: "bottom-end" }, h("div", { key: 'e4448fb450b3ef6b5b606d648e410786963687a4', slot: "target", class: "gux-button-multi-container" }, h("gux-button-slot", { key: '5510f77ee06e42f70445d28ab4000c828fd99066', class: "gux-dropdown-button", accent: getGuxButtonMultiAccent(this.accent) }, h("button", { key: '186011c13f9ae63b7bc30ae4f9e5e5dd4c6375f3', type: "button", disabled: this.disabled, ref: el => (this.dropdownButton = el), onMouseUp: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), "aria-label": this.guxAriaLabel }, h("slot", { key: '7d012b95871cff16168048aaa5612427f24c847d', name: "title" }), h("gux-icon", { key: 'f222b55fe03b763fe1cb7fb3328eeed18c1f08cd', size: "small", decorative: true, "icon-name": "custom/chevron-down-small-regular" })))), h("div", { key: '78eb53fce33db4b8c7788c3d422cc9d4bb18e35e', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: 'f73bb9a97ecdb8ffcdb0846be121f735d37da83f', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '75bf49c2c67fc0a767f1325d400ce36a76dc18ac' })))));
     }
     static get is() { return "gux-button-multi"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-button-slot/gux-button-slot.js

@@ -31,7 +31,7 @@ export class GuxButtonSlot {
         this.validateSlotContent();
     }
     render() {
-        return (h(Host, { key: '012a2b88a20562e85b4714d987f7d54d541cd4a7', accent: this.accent, "icon-only": this.iconOnly }, h("slot", { key: '59a9dfb5a068b0fd3922b6a2739a212f8839c9c3' })));
+        return (h(Host, { key: '99df51793447c80e05a7e5bc0af1efac6a6aaa67', accent: this.accent, "icon-only": this.iconOnly }, h("slot", { key: '55fa33db37c115a75614bdf69b805fb65777310d' })));
     }
     static get is() { return "gux-button-slot"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-calendar/gux-calendar.js

@@ -344,7 +344,7 @@ export class GuxCalendar {
         return (h("table", null, h("tr", null, getWeekdays(this.locale, this.startDayOfWeek).map(day => (h("th", null, day)))), this.getMonthDays(index).map(week => (h("tr", null, week.map(day => (h("td", { tabindex: this.isFocusableDate(day) ? '0' : '-1', class: day.class, "aria-hidden": day.hidden ? 'true' : 'false', "aria-disabled": day.disabled ? 'true' : 'false', "data-date": day.date.getTime(), onClick: () => void this.onDateClick(day.date), onMouseEnter: () => this.onDateMouseEnter(day.date), onKeyDown: e => void this.onKeyDown(e) }, h("div", { class: "gux-date" }, day.date.getDate(), h("gux-screen-reader-beta", null, getDateMonthAndYearString(day.date, this.locale)))))))))));
     }
     render() {
-        return (h("div", { key: 'c49e026383fdaa7336ddb1108752e0d04647bd1d', class: "gux-calendar" }, h("div", { key: '09605bb71ea5864b3c971a571db18898aa72280d', class: "gux-header" }, h("button", { key: '9f04a6723891ae93f0ada14fdd524c776e2facb7', type: "button", class: "gux-left", "aria-label": this.i18n('previousMonth'), onClick: () => this.incrementPreviewDateByMonth(-1) }, h("gux-icon", { key: '8d25e532e0778ee93998fea97a753dea8a3c515f', size: "small", decorative: true, "icon-name": "custom/chevron-left-small-regular" })), this.renderMonthHeader(), h("button", { key: '0d0b85170e5053128a991da371fd5b0ff29fe0a6', type: "button", class: "gux-right", "aria-label": this.i18n('nextMonth'), onClick: () => this.incrementPreviewDateByMonth(1) }, h("gux-icon", { key: '36f7a2c49e54c56ff68244b18bac61840308cc35', size: "small", decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("div", { key: '9d135c3f15c968f16abe7b1a3d032a041cbe91ac', class: "gux-content" }, Array.from(Array(this.numberOfMonths).keys()).map(index => this.renderCalendarTable(index)))));
+        return (h("div", { key: 'c9b9ccdf18efa3ea27e3a636401b512c4389a89c', class: "gux-calendar" }, h("div", { key: '1afaafa4bcbf2b7dd9d99c3795665a1971f8720b', class: "gux-header" }, h("button", { key: 'e3da9e5a0335040fb3bb1bafdafb450119dc5eb1', type: "button", class: "gux-left", "aria-label": this.i18n('previousMonth'), onClick: () => this.incrementPreviewDateByMonth(-1) }, h("gux-icon", { key: '7390b76dc18e618b08e1865a9cf48fbc639607f0', size: "small", decorative: true, "icon-name": "custom/chevron-left-small-regular" })), this.renderMonthHeader(), h("button", { key: '8d06a9b0bc59c714068ece8c37aa328a81f0c8cd', type: "button", class: "gux-right", "aria-label": this.i18n('nextMonth'), onClick: () => this.incrementPreviewDateByMonth(1) }, h("gux-icon", { key: '757c5f1bbdbfbd67f72315158a7aa525237b834a', size: "small", decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("div", { key: 'd73926384152948cc0dd9e63cc0ba6dc2653ae33', class: "gux-content" }, Array.from(Array(this.numberOfMonths).keys()).map(index => this.renderCalendarTable(index)))));
     }
     static get is() { return "gux-calendar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-card/gux-card.js

@@ -14,10 +14,10 @@ export class GuxCard {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h("div", { key: 'b19df85238b29f2e108993a054d94f4be9fb4e62', class: {
+        return (h("div", { key: 'ac1982d547b7bc12a24055b66e87157f6e63ffe3', class: {
                 'gux-card': true,
                 [`gux-${this.accent}`]: true
-            } }, h("slot", { key: '67b57a5f325665ed97c19f92b23bfaccb7390a75' })));
+            } }, h("slot", { key: 'ffbe39af10ce841ceceb1b80093f9e891cd1e799' })));
     }
     static get is() { return "gux-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-column-manager/gux-column-manager-item/gux-column-manager-item.js

@@ -160,15 +160,15 @@ export class GuxColumnManagerItem {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h(Host, { key: '5d5cead78083e419c5ef5dd6eaaf1f9f93b22a7d', draggable: "true", onMouseUp: event => this.onMouseUp(event) }, h("div", { key: '1eaa69f78e2a8fb97b756ae29cc1e43ad1637955', class: {
+        return (h(Host, { key: '0bb8e7cbdb444f9121f835953d336706ee32c851', draggable: "true", onMouseUp: event => this.onMouseUp(event) }, h("div", { key: 'a66ed565c6ec89e205eff0dbb19064f0d8d650fd', class: {
                 'gux-container': true,
                 [`gux-drop-${this.pendingReorder}`]: true,
                 'gux-dragging': this.isDragging,
                 'gux-parent-reordering': this.isParentReordering
-            } }, h("button", { key: '955df1b8ecdf022a78aa1ca5be1c16f63f793190', class: {
+            } }, h("button", { key: '4f3626a007b2759c49570c392db4703faf08d2b9', class: {
                 'gux-reorder': true,
                 'gux-reordering': this.isReordering
-            }, type: "button", onClick: () => this.toggleReorderMode(), onMouseDown: () => this.onMouseDown(), onKeyDown: event => this.keyboardReorder(event), ref: el => (this.reorderButtonElement = el) }, h("gux-icon", { key: '302541e4e6561a0bae6a37aa301453ce19de69fe', "icon-name": "fa/grip-vertical-solid", decorative: true, size: "small" }), h("span", { key: '7d2945f43e56d227bf3edc385257345e9a80125f', class: "gux-sr-only" }, this.i18n('activateReordering', { columnName: this.text }))), h("div", { key: '92d1c26eb14034cf8d9b205b5e2e8847d472d78c', class: "gux-select" }, h("slot", { key: 'd8a9d897bff581ce232c34ef8e4a74b6cd1d57fd', onSlotchange: () => this.onSlotChange() }), h("gux-text-highlight", { key: '00313b556d4a8eba0d5ab6492cf97349834cf878', highlight: this.highlight, text: this.text, strategy: "contains", dimmed: !this.highlightActive })))));
+            }, type: "button", onClick: () => this.toggleReorderMode(), onMouseDown: () => this.onMouseDown(), onKeyDown: event => this.keyboardReorder(event), ref: el => (this.reorderButtonElement = el) }, h("gux-icon", { key: '4f74a4523f7bc606962ceaf55c3e71d2f49c43bb', "icon-name": "fa/grip-vertical-solid", decorative: true, size: "small" }), h("span", { key: 'd5078724571fdc889289d481d2ee7af72ad1837a', class: "gux-sr-only" }, this.i18n('activateReordering', { columnName: this.text }))), h("div", { key: 'b886cdbe68f7272fc856179b9795d89ea1765589', class: "gux-select" }, h("slot", { key: 'f38859d5960bd7d75ecba7f3287b45824ef83da9', onSlotchange: () => this.onSlotChange() }), h("gux-text-highlight", { key: '6867f4c085305555e914538bf5d7201a945cc305', highlight: this.highlight, text: this.text, strategy: "contains", dimmed: !this.highlightActive })))));
     }
     static get is() { return "gux-column-manager-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-column-manager/gux-column-manager.js

@@ -121,7 +121,7 @@ export class GuxColumnManager {
     render() {
         var _a;
         const isReordering = ((_a = this.keyboardOrderChange) === null || _a === void 0 ? void 0 : _a.oldIndex) !== null;
-        return (h(Host, { key: '2f65d1b779a4558eca9bd37b85d46da531f57d64', class: { 'gux-reordering': isReordering } }, h("div", { key: '6583f72901ad97faa415f08d4ece744a24cfe729', class: "gux-container" }, h("div", { key: '1c8c3ba5721f2dbadc1f2e7057ebb578140b0643', class: "gux-sr-only", "aria-live": "polite" }, `${this.highlightResults.matchCount} ${this.i18n('searchResults')}`), h("div", { key: 'f48a1bb067166a33eaa9113b98ceab98aeb9fd1b', class: "gux-search" }, h("gux-content-search", { key: '9709b2ac88faf9a8dfda06cc4b45fea91dc8620b', "match-count": this.highlightResults.matchCount, "current-match": this.highlightResults.currentMatch, onGuxcurrentmatchchanged: event => this.onGuxCurrentMatchChanged(event) }, h("input", { key: '2f998beca883c3eb115247d4b2a39dd866376875', type: "search", placeholder: this.i18n('search'), onInput: () => this.onSearchInput(), ref: el => (this.searchElement = el) }))), h("div", { key: '11f98380fa72214371749083f957582979958f23', class: "gux-select" }, h("gux-form-field-checkbox", { key: 'e0edb734ec544344e7954fdabbffda87abd08a76' }, h("input", { key: '35ab8cc8832afa14c02c9239680295eeabedeb80', slot: "input", type: "checkbox", ref: el => (this.mainCheckboxElement = el), onChange: () => this.onMainCheckboxChange() }), h("label", { key: 'd1b1bf2cf1b903f0182c3183dce4c6609dace63b', slot: "label" }, this.renderSelectedColumnCount()))), h("div", { key: '24ab1391b54b4f6e1dc473be036d669e1f5369e5', class: "gux-list", onChange: () => this.onListChange() }, h("slot", { key: 'd8b143e5dbb74d466f7e8e0a1397d1d02887b1ea', onSlotchange: () => this.onSlotChange() })), h("gux-announce-beta", { key: 'd20a3c9e64b4e28af1576bf6c0a47b498ebeef2c', ref: el => (this.announceElement = el) }))));
+        return (h(Host, { key: '9180140ef650eee47d235354b6033767e75e1509', class: { 'gux-reordering': isReordering } }, h("div", { key: 'fa0f8f4d88bf8d44f01918febf4961ef9ff59bd8', class: "gux-container" }, h("div", { key: '270743e0cb67516a1243dcaa26e835affdcbfa3f', class: "gux-sr-only", "aria-live": "polite" }, `${this.highlightResults.matchCount} ${this.i18n('searchResults')}`), h("div", { key: '4f20f66f0cec7fe077548e0ac24ba3f0253483c7', class: "gux-search" }, h("gux-content-search", { key: '3566d4d735dd6e4e506e3ee843d2b6d84b99a974', "match-count": this.highlightResults.matchCount, "current-match": this.highlightResults.currentMatch, onGuxcurrentmatchchanged: event => this.onGuxCurrentMatchChanged(event) }, h("input", { key: 'd3dd6ac8602b65a8fd1a61dc988cf4120ae97012', type: "search", placeholder: this.i18n('search'), onInput: () => this.onSearchInput(), ref: el => (this.searchElement = el) }))), h("div", { key: '2c76cde8312cf987062e63a85a66b1a6b150fd8b', class: "gux-select" }, h("gux-form-field-checkbox", { key: '9e263ce9d3b943c22ae8a253a9dadf7e090a2001' }, h("input", { key: '0e36f7d018153f2663a81041e9762958988e0600', slot: "input", type: "checkbox", ref: el => (this.mainCheckboxElement = el), onChange: () => this.onMainCheckboxChange() }), h("label", { key: '3a9000d7e24b67ea0e72a9ac9c24edd8afc458fc', slot: "label" }, this.renderSelectedColumnCount()))), h("div", { key: '814ae37aa105a28c07e0a593a9cbbcce596d7569', class: "gux-list", onChange: () => this.onListChange() }, h("slot", { key: '55f6147bc98fc223f1cda73697bc49ca8ee6eaee', onSlotchange: () => this.onSlotChange() })), h("gux-announce-beta", { key: '6fb042630df98775f6f621549d6ceacbef1ca421', ref: el => (this.announceElement = el) }))));
     }
     static get is() { return "gux-column-manager"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-content-search/gux-content-search.js

@@ -50,10 +50,10 @@ export class GuxContentSearch {
         }
     }
     render() {
-        return (h("div", { key: '52c6971f2da0ecbc95fba8eb9324737a6c690b36', class: {
+        return (h("div", { key: '0322d498380bf4142aae58c002d6e255c10b0d2a', class: {
                 'gux-content-search': true,
                 'gux-disabled': this.disabled
-            }, onClick: () => focusInputElement(this.inputSlottedElement) }, h("div", { key: 'eb6c7ddb2abc13dc0128ac29e51e35d962d2e7b4', class: "gux-search-icon" }, h("gux-icon", { key: 'dffb03e4342920424605ba52a99ccd79bbeda6ae', size: "small", decorative: true, "icon-name": "fa/magnifying-glass-regular" })), h("slot", { key: '9eb81ac4e434ac61dde816703be9fd47dbede9f9' }), this.getNavigationPanel()));
+            }, onClick: () => focusInputElement(this.inputSlottedElement) }, h("div", { key: '544452f5dade815dae33c8a750308f67ce5d7613', class: "gux-search-icon" }, h("gux-icon", { key: 'ee0d4eff05cbbfeb22b6c423e4f9a5fd46f90652', size: "small", decorative: true, "icon-name": "fa/magnifying-glass-regular" })), h("slot", { key: '06903a8957fbf65f3d72a55edeccbc6d4ff809bd' }), this.getNavigationPanel()));
     }
     getNavigationPanel() {
         if (this.showNavigationPanel()) {

package/dist/collection/components/stable/gux-context-menu/gux-context-menu.js

@@ -124,8 +124,8 @@ export class GuxContextMenu {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h(Host, { key: 'e1a0f86ff7f5628342de617743ea4f789d173b05' }, h("gux-popup", { key: 'dd2cfd053e6b69108b4ebecfd7db368f7a6c95e8', placement: this.placement, expanded: this.isOpen, offset: parsePxValue(uiTokens.dropdown['gap']), "exceed-target-width": true }, h("div", { key: '210acbac25411c5b03c7bb04610fd340b6404878', slot: "target", class: "gux-button-container" }, h("gux-button-slot", { key: 'c3985e8d204041c4484afb6875dbe8de2f2ccc82', accent: "ghost" }, h("button", { key: '53409d9d707eb98848f1ac4e9795dd1055cde0a3', type: "button", onClick: () => this.onButtonClick(), id: this.buttonId, class: { 'gux-compact': this.compact }, ref: el => (this.button = el), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), disabled: this.disabled }, h("gux-screen-reader-beta", { key: '92a71c4a539e19ceb47ca7c31499ac11fe35599e' }, this.screenreaderText ||
-            this.i18n('contextMenuScreenreaderText')), h("gux-icon", { key: '1901ae4b10c88f768810b0410ad248dce50c6377', "icon-name": "fa/ellipsis-vertical-regular", size: "small", decorative: true })))), h("div", { key: '8bfa4fca39690d6dd42855e2ed1391fe219457c1', slot: "popup", class: "gux-list-container" }, h("gux-list", { key: 'e8c30a20e430a79f59f93d43bb3c6c7f74f5486c', onClick: e => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: 'cb337637c12171feb30720168fcc22abb7592a06' }))))));
+        return (h(Host, { key: '81836c77be4c08e8a8064e5496b3a93d176bca94' }, h("gux-popup", { key: 'd1c0641894fa09c885f4081ef11c164d99a3173a', placement: this.placement, expanded: this.isOpen, offset: parsePxValue(uiTokens.dropdown['gap']), "exceed-target-width": true }, h("div", { key: '9c38589ae3493ac7213833d543d5358020ba3c99', slot: "target", class: "gux-button-container" }, h("gux-button-slot", { key: 'c1d9f87227a982aaff25c8039dd957c88f7e9445', accent: "ghost" }, h("button", { key: '935c5b453ddb4276f4cf33e704c2724dbd39b7f0', type: "button", onClick: () => this.onButtonClick(), id: this.buttonId, class: { 'gux-compact': this.compact }, ref: el => (this.button = el), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), disabled: this.disabled }, h("gux-screen-reader-beta", { key: '84bdd613ee3c688b7581c3945e6a9f813a424432' }, this.screenreaderText ||
+            this.i18n('contextMenuScreenreaderText')), h("gux-icon", { key: 'c51448b1ca8fc4cc549650de048955324163784a', "icon-name": "fa/ellipsis-vertical-regular", size: "small", decorative: true })))), h("div", { key: 'b2c8fac0ec29de0112892fb635a4d3d1dc67ce80', slot: "popup", class: "gux-list-container" }, h("gux-list", { key: 'd0321ba183384455f360acdabb28cd9131572aea', onClick: e => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '1cadfb8651d374fce5f451497fd1426e229959e6' }))))));
     }
     static get is() { return "gux-context-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-copy-to-clipboard/gux-copy-to-clipboard.js

@@ -52,7 +52,7 @@ export class GuxCopyToClipboard {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("button", { key: '08da9bc4513059d90d97e73fcc327bdf6ac469d8', class: "gux-copy-to-clipboard-wrapper", onClick: this.onCopyToClipboard.bind(this), "aria-label": getSlotTextContent(this.root, 'content') }, h("div", { key: 'd05708c37a89cb495ce0626e3bf4c3fdef22d744', class: "gux-copy-content" }, h("slot", { key: '040c1ab39fd7cb4d070319291af0147fcbe1a361', name: "content" }), h("gux-icon", { key: '0741dfb08eebe1917fd1f97ca9e78cc276bb8dfb', "icon-name": "fa/copy-regular", size: "small", decorative: true })), this.renderTooltip()));
+        return (h("button", { key: '47ceb34ec5e2f59f5248519ad89d942776dd86c9', class: "gux-copy-to-clipboard-wrapper", onClick: this.onCopyToClipboard.bind(this), "aria-label": getSlotTextContent(this.root, 'content') }, h("div", { key: '0be72c41a00e3e16ebde6533408b460a4d3d803b', class: "gux-copy-content" }, h("slot", { key: '93aa1cf91d2321ba0aed46bbb97d1bc7ee787738', name: "content" }), h("gux-icon", { key: 'd90d9cb3efdc100692d468fa69e464026cc126f4', "icon-name": "fa/copy-regular", size: "small", decorative: true })), this.renderTooltip()));
     }
     static get is() { return "gux-copy-to-clipboard"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-datepicker/gux-datepicker.js

@@ -566,7 +566,7 @@ export class GuxDatepicker {
             } }, h("label", { htmlFor: this.endInputId, class: "gux-datepicker-field-label" }, this.getCalendarLabels()[1]), h("div", { class: "gux-datepicker-field-input" }, h("div", { class: "gux-datepicker-field-text-input" }, h("input", { id: this.endInputId, type: "text", ref: (el) => (this.toInputElement = el), onMouseUp: e => this.onInputMouseUp(e), onFocusin: e => this.onInputFocusIn(e), onFocusout: () => this.onInputFocusOut(), value: this.toFormattedValue, disabled: this.disabled }), this.renderCalendarToggleButton()))));
     }
     render() {
-        return (h("div", { key: '753515db40b45f4e573cc7b09d094d2eaf7c8a95', class: {
+        return (h("div", { key: 'e2d2b71084dc77ee917998b8360c0339acf85a01', class: {
                 'gux-datepicker': true,
                 'gux-active': this.active,
                 'gux-disabled': this.disabled

package/dist/collection/components/stable/gux-dismiss-button/gux-dismiss-button.js

@@ -12,10 +12,10 @@ export class GuxDismissButton {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("gux-button-slot", { key: 'b7d20fcf144d85a77a59cd9e455de8be64a8ce8a', accent: "ghost", class: {
+        return (h("gux-button-slot", { key: '17d54102c6cd3b5be24e494dbb0e89a2828765cc', accent: "ghost", class: {
                 'gux-inherit': this.position == 'inherit',
                 'gux-dismiss-small': this.size == 'small'
-            } }, h("button", { key: '8e0c9014d7277227156b8a7512d1d6acf93fef89', type: "button", title: this.i18n('dismiss') }, h("div", { key: 'f6c1e74884c6c924f945ad274973a9553d937b11', class: "gux-icon-container" }, h("gux-icon", { key: 'c61ce0393b4827a3526cf0980fc8b6f48d1c9d3b', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" })))));
+            } }, h("button", { key: '7093ecf3f2e2ce68544f133aea9da1b22180d99e', type: "button", title: this.i18n('dismiss') }, h("div", { key: 'ce3aff7c04e157f98f239a0701e0b0f506fad86b', class: "gux-icon-container" }, h("gux-icon", { key: 'ba4c84e62cee99acaa05c5ca50868111d9b8791a', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" })))));
     }
     static get is() { return "gux-dismiss-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-dropdown/gux-dropdown.css

@@ -10,6 +10,7 @@
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
+  gap: var(--gse-ui-dropdown-gap);
   place-content: stretch center;
   align-items: center;
   inline-size: 100%;

package/dist/collection/components/stable/gux-dropdown/gux-dropdown.js

@@ -368,7 +368,7 @@ export class GuxDropdown {
         }
     }
     render() {
-        return (h("gux-popup", { key: 'e4781f02c135aac0d306241af4ff14ee576ef4b2', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()));
+        return (h("gux-popup", { key: '3adac9cd14b03a5770ebdaf54dd80ce3da53ca1f', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()));
     }
     static get is() { return "gux-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-dropdown-multi/gux-dropdown-multi-tag/gux-dropdown-multi-tag.js

@@ -36,7 +36,7 @@ export class GuxDropdownMultiTag {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: '2f9fddc813ba4ab7d367992ffedafc4b2f6af876', class: {
+        return (h("div", { key: 'a114a67321b30ec5eb27cad0b4b583cbf6040aec', class: {
                 'gux-tag': true,
                 'gux-disabled': this.disabled
             }, "aria-disabled": this.disabled.toString() }, this.numberSelected.toString(), this.renderRemoveButton()));

package/dist/collection/components/stable/gux-dropdown-multi/gux-dropdown-multi.css

@@ -23,6 +23,7 @@
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
+  gap: var(--gse-ui-dropdown-gap);
   place-content: stretch center;
   align-items: center;
   inline-size: 100%;

package/dist/collection/components/stable/gux-dropdown-multi/gux-dropdown-multi.js

@@ -416,7 +416,7 @@ export class GuxDropdownMulti {
     }
     render() {
         return [
-            h("div", { key: 'a3c7dfc5a088943e84e447052f7cba5b75d7bca3', class: "gux-dropdown-container" }, h("gux-popup", { key: '96de09c27ef9ddfac544bcb1823a41d2b1fc619e', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
+            h("div", { key: 'fbbbae3e6294e77e5c78212216d2c74db5c066f7', class: "gux-dropdown-container" }, h("gux-popup", { key: 'cf9e2b30bd0267b8206969c6c6b3079959a5adae', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
         ];
     }
     static get is() { return "gux-dropdown-multi"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-flyout-menu.js

@@ -183,10 +183,10 @@ export class GuxFlyoutMenu {
         }
     }
     render() {
-        return (h(Host, { key: 'd3b502f251376ed98562a513c4a91d20f4bbcff3', tabIndex: 0, "aria-haspopup": "true" }, h("gux-announce-beta", { key: '884ea314fb50cf835f4197f25915919058cf43c9', ref: el => (this.announceElement = el) }), h("span", { key: 'e3c698df869b2f4a7507f56ed5d8a170bd7cc794', ref: el => (this.targetElement = el) }, h("slot", { key: 'f823a69e0115c9a3dde93d78980581ff09311480', name: "target" })), h("div", { key: '25cd38a1fd9579145c77c889f6e8cced0a46a0c0', class: {
+        return (h(Host, { key: '5b2376413d40db8954a5f78630de79887d3e396c', tabIndex: 0, "aria-haspopup": "true" }, h("gux-announce-beta", { key: 'faafe424e69a4f34df4bd71bffa5268897667b61', ref: el => (this.announceElement = el) }), h("span", { key: '2c02399a516a80d0ba4f0b384b9983af38368f8b', ref: el => (this.targetElement = el) }, h("slot", { key: '1a60f90751608ae9838fcf6ae398ee1de2166f00', name: "target" })), h("div", { key: '0687d6e5959748eab76473146c5721f59b1e5ee7', class: {
                 'gux-flyout-menu-content': true,
                 'gux-shown': this.isShown
-            }, ref: el => (this.menuContentElement = el) }, h("div", { key: 'c99a3da87b6d48a55a71cd743074b52fcfb3d97e', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: '0f812f5a7f139561bee2f7715fc79aa15923ed14', class: "gux-arrow-caret" })), h("slot", { key: 'ce19c680e0fe591d3d7639fd50470d4682fa267c', name: "menu" }))));
+            }, ref: el => (this.menuContentElement = el) }, h("div", { key: '995da3807eda87a9a6d123b13fcd6bd97a9beeb6', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: 'e4a91985cf899690a720f9386cb7cfa051e0ee96', class: "gux-arrow-caret" })), h("slot", { key: '3cd07ce856ecaedfb774f0102d7f1c5c98d3c8a4', name: "menu" }))));
     }
     static get is() { return "gux-flyout-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-menu-option/gux-menu-option.js

@@ -31,7 +31,7 @@ export class GuxMenuOption {
         }
     }
     render() {
-        return (h("button", { key: '99c99960a717bd97309352856b96c4525885d018', type: "button", class: "gux-menu-option-button", "aria-haspopup": "false", tabIndex: -1, ref: el => (this.buttonElement = el) }, h("span", { key: '40e1abcd55204e90e12f4e7489ad2f5384225e3d', class: "gux-menu-option-button-text" }, h("slot", { key: '0093eac3e28b3b311fb0c006a176a2c39aa69403' }))));
+        return (h("button", { key: '7e623f4cfc8c062af7e400cc3f7b35d3c5a56ba8', type: "button", class: "gux-menu-option-button", "aria-haspopup": "false", tabIndex: -1, ref: el => (this.buttonElement = el) }, h("span", { key: 'e496c6c90aaf58b9fc41368a8d1240f7e959f571', class: "gux-menu-option-button-text" }, h("slot", { key: '2967b0a4be4ff7134cef373c696299d423dfac05' }))));
     }
     static get is() { return "gux-menu-option"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-menu.js

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class GuxMenu {
     render() {
-        return (h(Host, { key: '7cb0a4d8e89fdd8a2676dcdf3b4313fa6098bdf9', role: "menu" }, h("slot", { key: '139bb4b54ea6719824413ee230c5a6507d5ee26c' })));
+        return (h(Host, { key: 'a08c2ceb0b9d5b96c3f3754df88c314c54f8dc80', role: "menu" }, h("slot", { key: 'ba0ec3424e9866cfc72cbbc62ef60a405a54651e' })));
     }
     static get is() { return "gux-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-submenu/gux-submenu.js

@@ -142,13 +142,13 @@ export class GuxSubmenu {
         }
     }
     render() {
-        return (h(Host, { key: '22e556c84a88a5bdeb98c8c13d0b1c0ebbe7e045' }, h("button", { key: '806dbf6f2f1fc49eb94b60f682e92e066f0dddea', type: "button", class: {
+        return (h(Host, { key: '73a0569705273527edaa472e8d3ca5ae81b338b4' }, h("button", { key: 'ce927c57f2cead342640c0721cf5d7e5f6c2c7d5', type: "button", class: {
                 'gux-submenu-button': true,
                 'gux-submenu-button-active': this.isShown
-            }, role: "menuitem", tabIndex: -1, ref: el => (this.buttonElement = el), "aria-haspopup": "true", "aria-expanded": this.isShown.toString() }, h("span", { key: '4e05075439c9cd0a0a7a5a6039e99dfb15299146', class: "gux-submenu-button-text" }, this.label), h("gux-icon", { key: '14c7a8540ddf60fd6ccaf5418659713c71c97c0d', class: "gux-submenu-open-icon", "icon-name": "custom/chevron-right-small-regular", decorative: true, size: "small" })), h("div", { key: 'ba137f476cb82c339223a107bb2066b433c5da80', ref: el => (this.submenuElement = el), class: {
+            }, role: "menuitem", tabIndex: -1, ref: el => (this.buttonElement = el), "aria-haspopup": "true", "aria-expanded": this.isShown.toString() }, h("span", { key: '656c8e2916b3e14d0a19cf1bab1f80c230df47a3', class: "gux-submenu-button-text" }, this.label), h("gux-icon", { key: '46decffeaa2039497d6273cb99add54445c53c98', class: "gux-submenu-open-icon", "icon-name": "custom/chevron-right-small-regular", decorative: true, size: "small" })), h("div", { key: 'e757a658cdd2ad9c6a91cc010dfd8884305031bc', ref: el => (this.submenuElement = el), class: {
                 'gux-submenu-wrapper': true,
                 'gux-shown': this.isShown
-            } }, h("div", { key: '4ef378fa03703ab54b18db08775c65833ee44f5f', role: "menu", class: "gux-submenu-content", ref: el => (this.submenuContentElement = el) }, h("slot", { key: '66284f9f2dce85b25b84aad37c0dc995d1fbb450' })))));
+            } }, h("div", { key: '9d42563892b59960ab9f72fa80da773813598435', role: "menu", class: "gux-submenu-content", ref: el => (this.submenuContentElement = el) }, h("slot", { key: 'f9a42aaea9caed6302df9f9efed66eaa2339fb7d' })))));
     }
     static get is() { return "gux-submenu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox/gux-form-field-checkbox.js

@@ -47,10 +47,10 @@ export class GuxFormFieldCheckbox {
         }
     }
     render() {
-        return (h(Host, { key: '9a67611178b4fbab4de144aa1bdc1a72925ce901', class: {
+        return (h(Host, { key: 'fb7667a4463c699f3e73d3b19ce7ed8793526705', class: {
                 'gux-input-error': this.hasError || this.hasGroupError,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: 'e28cf023c99ed25ade7cf91cf611742b4010e327', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '96b73aadb08d2e30fc607238ebcac504fa272e59', class: "gux-input-label" }, h("div", { key: '0f651ffbfe26e03ff75c29ec1b12f9f34c54dc15', class: "gux-input" }, h("slot", { key: '852b28057e2de1f7f3143f43c399e80819848a8d', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '7f2955e54e31d1ca5f6e293f30b239a60600c06b', class: `gux-label-${this.labelPosition}`, "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: '878cbab4ced7c03cd8fcc5de5d3118d454e12890', name: "label" }))), h("div", { key: '6dbacbf57dbdd0effd2e432027bbab37a5da233f', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '1270122ffe746ffa8c391bf33247d392d660fa58', show: this.hasError }, h("slot", { key: 'd9bbfa0e6796cfbc007f36168e74020048ff3623', name: "error" })), h(GuxFormFieldHelp, { key: '9baab5c9ad95605d3f93edd9796867e92e86eb3d', show: !this.hasError && this.hasHelp }, h("slot", { key: '6a62b0006e15934e14097ea01e86026081087190', name: "help" }))))));
+            } }, h("div", { key: 'f5ccb8ab97b7eae908067a589383a7fa881926d9', class: "gux-form-field-container", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '92dc792e00087d796542d3018f0fde710e26edfb', class: "gux-input-label" }, h("div", { key: 'dac18e9f39ee86ad3823fd97b3379c43d09f47ea', class: "gux-input" }, h("slot", { key: 'decfc141738913059d30a0b9c82de9c61befcd4d', name: "input", onSlotchange: () => this.setInput() })), h("div", { key: '07ccac1d64fc67ec4a85647d290bab90e9cdc07c', class: `gux-label-${this.labelPosition}`, "aria-disabled": this.disabled ? 'true' : 'false' }, h("slot", { key: 'bedd05155c5de9a2b6a14682ee8ad59e381b69e9', name: "label" }))), h("div", { key: 'c4ccc766c03dab282e00997d62ab221d753b1754', class: "error-and-help-text" }, h(GuxFormFieldError, { key: '7cf7ba239d21281fb8b1fa7a28291194dc13022a', show: this.hasError }, h("slot", { key: '97bd4618a18760668146ce4a0616161a2742409b', name: "error" })), h(GuxFormFieldHelp, { key: '7903ba4214b3daab85f7d3344582cac557ee1641', show: !this.hasError && this.hasHelp }, h("slot", { key: 'd692786ed768ceb1ee76b1617dab2bc21e0b3830', name: "help" }))))));
     }
     get variant() {
         return this.labelPosition.toLowerCase();

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox-group/gux-form-field-checkbox-group.js

@@ -150,8 +150,8 @@ export class GuxFormFieldCheckboxGroupBeta {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '9ef89b47c90168ee012be4bbb8dacfd7732e229e', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '34f65b8c8f1cdc4b52b37f59db46baae2c412f4f' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), h(GuxFormFieldVisualLabel, { key: '3414234f6225cfd77b3c8b6046cf8c7014409cab', position: "above", required: this.required }, h("slot", { key: '0ab8c8a8cb183df2161768601429bf706a8355ab', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '9d074b28860c6250ba35a1df0d5a4f2cbe9673c2', variant: this.indicatorMark, required: this.required }), h("slot", { key: '02cfbeb4acaf746b626af70ed1056604620578ed', name: "group-label-info" })), h("slot", { key: '8f403408a080e0716ae357cc4b26b669b5fc7fce', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: '6a95327977757a855aede87d5ba3af76bd9fb955', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: '7f536cab854c95179b06523226d83f3f31d1e3ee', show: this.hasGroupError }, h("slot", { key: 'b9b685c48b351fc04ace61704bac3eb0503de957', name: "group-error" })), h(GuxFormFieldHelp, { key: '33002142c44e57e237077d3e2b4e31bb4ee8145e', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: '2717c87f3dc03abe96ab8cb20241b2dfddb62536', name: "group-help" }))));
+        return (h(GuxFormFieldFieldsetContainer, { key: '334076bd823a3b5140cc43883651cedf28f2f822', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '728fc91f5407db29a4cb9ea16c8f9131529ff890' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'group-error'), this.hasGroupError), this.renderText(getSlotTextContent(this.root, 'group-help'), this.hasGroupHelp), this.renderText(getSlotTextContent(this.root, 'group-label-info'), this.hasGroupLabelInfo)), h(GuxFormFieldVisualLabel, { key: 'dac5f516da5e894e64d34c94327ba7cb7ac6097d', position: "above", required: this.required }, h("slot", { key: '964570bb5e721990e4435e9bcb55885bf878b5ef', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'f453c38418fca06d897bdbbab31a0bff2e796609', variant: this.indicatorMark, required: this.required }), h("slot", { key: '8b4448bd354a82092af7b1f0362c9df2b45f5281', name: "group-label-info" })), h("slot", { key: '6a8d8db7d72f68b6189bc005787d6b378b6f02ee', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: 'b63701e72580fbe9a9bd1dd8705d22f125682669', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: 'c36ef89456b9f5c6fe5a88d4c24684a8ff06e301', show: this.hasGroupError }, h("slot", { key: '89334f9b85c25bea501140c1fe0102a126f66c0b', name: "group-error" })), h(GuxFormFieldHelp, { key: '76330fd2a2164c89eb39b9472d3a9602faea8670', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: '5ceafc970a9b5ed3339bb6fa04cb0b33c0903804', name: "group-help" }))));
     }
     setLabel() {
         this.label = this.root.querySelector('label[slot="group-label"]');

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-color/gux-form-field-color.js

@@ -88,13 +88,13 @@ export class GuxFormFieldColor {
         }
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '219f4a0718ad7ed67ac89a3350073c16f04f766a', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '70de9cc31cdc03faef8d81f206e78ae063e43c11', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '4d7498b7ccd9f49868e2bf53d80cd9d1b497ecad', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '2f9f04abceed2f9e91a7bbe1346047ac1aba656e', variant: this.indicatorMark, required: this.required }), h("slot", { key: '5a64d3c90fecfbdd18074c20b9885e04481575cc', name: "label-info" })), h("div", { key: '1aec60e34affb0f9ea19593837f2c3ecb2ea2949', class: "gux-input-and-error-container" }, h("div", { key: '7dec62b0d5140f5f8853b4a4abd6f110effb4663', class: {
+        return (h(GuxFormFieldContainer, { key: 'f6e7d7b1d7ccbfa8087781d93ce64b9da53f02c3', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: 'b162bf4dbb2543b9df9d19e7c5c3f1a3b4df1088', required: this.required, position: this.computedLabelPosition }, h("slot", { key: 'ca8607d663e927b1170e5253af4dbab440b82b45', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '4d3635b95c062dbacbdd2dfa44b86d178abb84ef', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'b7775bf07e9b5437f0450abe8e3424e3656aac72', name: "label-info" })), h("div", { key: '4417c4980e93577d3fc0f5b22eb1df92ebe5d457', class: "gux-input-and-error-container" }, h("div", { key: '51a8640109fb27494844e4a8239c37d19727a910', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("div", { key: '490065f61f0cc51fc90642fdee24716b1dcfac95', class: {
+            } }, h("div", { key: '8cfdfdb314b57acef65e2a2f3abbf75476cb3832', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled
-            } }, h("slot", { key: '766dc8fff8596545a4988bca32bea33ba4a6bcb5', name: "input", onSlotchange: () => this.setInput() }))), h(GuxFormFieldError, { key: 'f8fd59d01f3663807a434f67a0d013d33132bdcc', show: this.hasError }, h("slot", { key: '712b3728ff4fb0ae385ae49a2e3f52c02fdcd136', name: "error" })), h(GuxFormFieldHelp, { key: 'a8354fd6c4ab5cd377f3fe5f362f32712f829d0f', show: !this.hasError && this.hasHelp }, h("slot", { key: '8f5f5663bd83e0e33765b178981ed6bf0a2b0eda', name: "help" })))));
+            } }, h("slot", { key: '33297c844d90b74c7a396b144a898233313566b3', name: "input", onSlotchange: () => this.setInput() }))), h(GuxFormFieldError, { key: 'b5c589d33b9b8b22c531708f000609a6d24baaa3', show: this.hasError }, h("slot", { key: 'c45496e6f3c23011feeeb63d90fc08b4248fa5c4', name: "error" })), h(GuxFormFieldHelp, { key: 'e4a420035ff6ad3ab0829d2b52ef547667cf7047', show: !this.hasError && this.hasHelp }, h("slot", { key: '00496872cb32b3a0ed44d580c37ec48d8b3d73dd', name: "help" })))));
     }
     get variant() {
         return this.labelPosition ? this.labelPosition.toLowerCase() : 'none';

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-dropdown/gux-form-field-dropdown.js

@@ -102,11 +102,11 @@ export class GuxFormFieldDropdown {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: 'ec646997b4f8d98e72fd85fc1d733ad3ff86eb50', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '8a134b39c68bda760923a6f4e4b12e7b071cf935' }, (_a = this.label) === null || _a === void 0 ? void 0 :
-            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent(this.root, 'help'), this.hasHelp), this.renderText(getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), h(GuxFormFieldVisualLabel, { key: '1e1f058b1104a30a4ea06c3b77cb32206f2179b1', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '314afc1d4ab62e41398c05390a92a8910b736036', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'b793439b45a6a2343b06c93586c5d3281ba111bc', variant: this.indicatorMark, required: this.required }), h("slot", { key: '3a116c63e13c06e9521ae129ea5e3d5b0f1838ad', name: "label-info" })), h("div", { key: '023609836f4ae6c8561de81cf2b75e65aaf08e14', class: "gux-input-and-error-container" }, h("div", { key: '264577a04ad1ae9a60972c7bb08b4e4cb4136bd7', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: 'b5279e6991b68c0d3788e2e4c902ae6b2cc65260', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '703dd1c91d4c7034164d4d2e92db29bd70b51b6e' }, (_a = this.label) === null || _a === void 0 ? void 0 :
+            _a.textContent, this.renderText(this.getI18nValue('required'), this.required), this.renderText(getSlotTextContent(this.root, 'error'), this.hasError), this.renderText(getSlotTextContent(this.root, 'help'), this.hasHelp), this.renderText(getSlotTextContent(this.root, 'label-info'), this.hasLabelInfo)), h(GuxFormFieldVisualLabel, { key: 'bdfa6b8468dd12409a814e00cd790198c9f6b56d', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'ab67908202b76f6547b4f6e4bc143d3a3b320da3', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '93f93d39b1b483e12cd7890e15a47de11cfb2b2a', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'da298b1ca505d030657419b2096d59d5ed48e82e', name: "label-info" })), h("div", { key: '267ba02dac20ad18bbcc9c676d0e077ef694a245', class: "gux-input-and-error-container" }, h("div", { key: 'f94a983f649f8ae5fc37fb5ae5b101c04776b3a7', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("slot", { key: '4fca7d269966a355fc2fd8751b06e5e40bbfa7d2' })), h(GuxFormFieldError, { key: '81a77841c23ea807b4b4080be72e3e33036b874e', show: this.hasError }, h("slot", { key: 'bfe215d97a4ebb10c36d1c88e3ec6b0a395483e5', name: "error" })), h(GuxFormFieldHelp, { key: '3398463f4ebf6d648af038e4359fa5593ae1964d', show: !this.hasError && this.hasHelp }, h("slot", { key: '77c22b9f1015c351f9bd1ec8bb7b515b91383738', name: "help" })))));
+            } }, h("slot", { key: 'd05393461eedda9e96354f44bf1abadb3430bc8d' })), h(GuxFormFieldError, { key: '6e287057c3e2478f0c2ccaa7ec6acdaaafdb5aae', show: this.hasError }, h("slot", { key: 'd4f0b3ac5a20231c8567413f49f25d201c7c2d6d', name: "error" })), h(GuxFormFieldHelp, { key: '3b2ed746fff8b662269be05658de25da8a666d9d', show: !this.hasError && this.hasHelp }, h("slot", { key: '9a05538df97c8af1195141000d2197242df1d129', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file/gux-form-field-file.js

@@ -105,7 +105,7 @@ export class GuxFormFieldFile {
         return `${type}-${labelPositionVariant}`;
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'b332159adc6c4ee6ada7e9f03b33bb4a4f390410', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '8bcc9ff337c1bd08a9be8a9297aa995591f214d2', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '8bb7965a56e846f9a0e6cf3f1b1c92e204d6703b', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'ad45c2965c423367cdf58b057b2d8b9ea2b82a72', variant: this.indicatorMark, required: this.required }), h("slot", { key: '08e2fa920ffaa0b48ba279c6e34ddc8bf000a53e', name: "label-info" })), h("div", { key: '1593256c7e719413751798bb997b2b47a559dda6', class: "gux-input-and-error-container" }, h("slot", { key: 'b88b29a2b252658dbecb34a0cff3f5934a00b810', name: "input", onSlotchange: () => this.setInput() }), h(GuxFormFieldError, { key: 'ba275152daa1f92884dd719c173826d9f85db4ef', show: this.hasError }, h("slot", { key: '427d887d9f00f91cf2de1f315db158695ca7ba66', name: "error" })), h(GuxFormFieldHelp, { key: '77c2dc2ee4392bb73d6f3db9c3b630f1340ff05c', show: !this.hasError && this.hasHelp }, h("slot", { key: 'a3acd59c02593d0292c8b3907b7e341c2009a8c5', name: "help" })))));
+        return (h(GuxFormFieldContainer, { key: 'fcb5203150da6d16a097d3c1139b2ac45dce24a4', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '848e9d993bf460ab5a528683ab6a64da46517013', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'e3a93a05c3d57d18076b775d020021d744efbba1', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '0d004bbf500984c12f35599f137c976b9da571f8', variant: this.indicatorMark, required: this.required }), h("slot", { key: '3643a218d190d8b14fed4399c8c5d969a55f2477', name: "label-info" })), h("div", { key: '018444e358f77ad1c9a2b5e2c7d151addedf00f9', class: "gux-input-and-error-container" }, h("slot", { key: '2db769ce22592842976cf541ae61f35dc2d49612', name: "input", onSlotchange: () => this.setInput() }), h(GuxFormFieldError, { key: '65de0b91cebf616fd01fb0d72a1aed6194460aaf', show: this.hasError }, h("slot", { key: 'f9a1d3420ea4f8b65f5a55052b6a4878f79fac6e', name: "error" })), h(GuxFormFieldHelp, { key: '566ebf6959869b2953ccfcbb90609e30c64bea49', show: !this.hasError && this.hasHelp }, h("slot", { key: '5099d3f8d3b4b16f10510153e36afc36b3907a72', name: "help" })))));
     }
     static get is() { return "gux-form-field-file"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file-beta/components/gux-file-list-item/gux-file-list-item.js

@@ -11,11 +11,11 @@ export class GuxFileListItem {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: '00990d1ebf3b321209e6c62f45f15cf486485ba2', class: {
+        return (h("div", { key: 'db9fcf9dc789dd6fe5a74bebd6ef72e0666057d1', class: {
                 'gux-file-list-item': true,
                 [`gux-${this.status}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: '8089b456376230aacb9ebe4009d1cd0a659d9cf4', class: "gux-info" }, h("gux-truncate", { key: 'dbfc05cb6c2741c22d087c239f03ab79ee41f473' }, h("span", { key: 'c7c59a3f0c8c9911c72bfc883bdb673c07687606', class: "gux-file-name" }, this.name)), this.renderStatusIndicator(), this.renderFileRemoveButton()), this.renderAdditionalInfo()));
+            } }, h("div", { key: 'a53d203206e5351d12552af8ad649ffe9baacbbe', class: "gux-info" }, h("gux-truncate", { key: 'b2c3a410891aab4a1c818c7b2448186d2c3fe2dc' }, h("span", { key: 'af6f80b9cac6a7607582f1d1c304a0794cb121f2', class: "gux-file-name" }, this.name)), this.renderStatusIndicator(), this.renderFileRemoveButton()), this.renderAdditionalInfo()));
     }
     renderStatusIndicator() {
         switch (this.status) {

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-file-beta/gux-form-field-file.js

@@ -94,7 +94,7 @@ export class GuxFormFieldFileBeta {
         (_c = this.multipleObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: '0436c9af8c166d2eb58f513179c746964f5b20d7', labelPosition: "above" }, h(GuxFormFieldLabel, { key: 'e3e86c8aba35a07427731c7bc8dd1142c2cd1f3d', position: "above", required: this.required }, h("slot", { key: '79b4ae008d058d117dfe8bf77465c3646ef5a1c8', name: "label" }), h("gux-form-field-label-indicator", { key: 'd303918feff2a3c42a01350898765e2189b634fe', variant: this.indicatorMark, required: this.required }), h("slot", { key: '9a7b1ab0b500de60d2c331c8eb8451a8f0b661e1', name: "label-info" })), h("div", { key: '46862e36e14d6d8b2f2c734bdf4923187f4a6f06', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: 'f0bb5e0e3bb4af2c7d72405df9412a478ecb5559', show: this.hasHelp }, h("slot", { key: '11fc5aaa68b0b94cdd642db2c00749a8c2e7ee9d', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: 'a324982a5daf4bfe9d4b62d6cb4b77bc6d504f92', show: this.hasError }, h("slot", { key: '171e7ccc498134dc1514618201c24aaf83dabf62', name: "error" })), this.renderFileList())));
+        return (h(GuxFormFieldContainer, { key: '65a1932baf805737c18286dc72a3b7a23b80c00c', labelPosition: "above" }, h(GuxFormFieldLabel, { key: 'cde655eff45141e8ab9109c107261ab565ab82ab', position: "above", required: this.required }, h("slot", { key: 'd7dd60eaf3dd42178299085480cbf83c4d028cc6', name: "label" }), h("gux-form-field-label-indicator", { key: 'f274c7b9d3435530f3435e27a28b8aea36e839e5', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'd49ad17768c63669e986545460cdd8c26290715a', name: "label-info" })), h("div", { key: '94899fff1277f8af73e8dd20edc8dc574427c001', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: 'fe62ab96fdd29138b972259d2018cc423e3dd300', show: this.hasHelp }, h("slot", { key: 'c591507d2d2766d5381ebb7afc15ca1c7cd63d9a', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: '72c0bc32b52c1953a906430b2218f52a9b7bc9ef', show: this.hasError }, h("slot", { key: 'd7a37f74db27cd091539adc00645a546f3386474', name: "error" })), this.renderFileList())));
     }
     setInput() {
         this.input = getSlottedInput(this.root, 'input[type="file"][slot="input"]');