genesys-spark-components 4.187.0 → 4.187.2

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

@@ -13,7 +13,7 @@ import { OnClickOutside } from "../../../utils/decorator/on-click-outside";
 import { whenEventIsFrom } from "../../../utils/dom/when-event-is-from";
 import { afterNextRenderTimeout } from "../../../utils/dom/after-next-render";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import defaultResources from "./i18n/en.json";
 import { getGuxActionButtonAccent } from "./gux-action-button.types";
 /**
@@ -138,7 +138,7 @@ export class GuxActionButton {
         this.i18n = await buildI18nForComponent(this.root, defaultResources);
     }
     render() {
-        return (h("div", { key: 'b6308dd635191c23f954547686876eeec7dca64d', class: "gux-action-button-container" }, h("gux-popup", { key: 'f4661e04ab24529a4efe418f0646b37e6a3011c3', expanded: this.isOpen, disabled: this.disabled, placement: "bottom-end", "exceed-target-width": true }, h("div", { key: 'db39cbc7f2495d221db17e4f3a392141f38cf996', slot: "target", class: "gux-action-button-container" }, h("gux-button-slot", { key: '628ca05ac04fef6c5973106c2c91e1016f9eb0aa', class: "gux-action-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '86f2672d18e10dab1059face5344d65717efc72f', type: this.type, disabled: this.disabled, onClick: () => this.onActionClick(), "data-testid": "action-button" }, h("slot", { key: '481981f2d1056f84dbf72b6a73ee3d706c3863b7', name: "title" }))), h("gux-button-slot", { key: '6e2f10c9518d689c57178310f1eeeb903c93117f', class: "gux-dropdown-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '484dc910df392cbc62edda7a1c31c474ff20dc44', 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: '175584542474cf263e24667e3475b3ca4c530559', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: '4226520caac5f3c3799fb28166e07bf00adea5a2', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: '6cf996b26515e0ce0f7a62e6b8b7ff41a72cec39', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: 'f8fbf2a0724b686bb2201fac848a98a1dfc170e7' }))))));
+        return (h("div", { key: 'fb822145ecba35ec0c5289bacd3be03df3ca6e0b', class: "gux-action-button-container" }, h("gux-popup", { key: 'bc35e449284fa1c3fac6a542ca4bcb2abaa4d685', expanded: this.isOpen, disabled: this.disabled, placement: "bottom-end", "exceed-target-width": true }, h("div", { key: '45c7e35216241551fab811ff692b66bbae67e329', slot: "target", class: "gux-action-button-container" }, h("gux-button-slot", { key: 'dd965b62c26cf58240d5626f9541045385db0b76', class: "gux-action-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: 'b5b2ad634828a352f314a3208baea1d74e42e4ba', type: this.type, disabled: this.disabled, onClick: () => this.onActionClick(), "data-testid": "action-button" }, h("slot", { key: '03f3892c9dc694c64f43c72275a3905566f827b1', name: "title" }))), h("gux-button-slot", { key: 'c68d7ff8884a1f7f2a212ecda296f597e2c811bc', class: "gux-dropdown-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '80bb3769c67f5420adb4398c2e20f8a7e2e190c0', 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: 'e0cb3617ad8b86e93d2edba74d56047e853705a5', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'fc9cc62f17f46662e79459d085e80644e84f6b3d', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: 'b5a5265ec1d399f405225e5299f829c16481372c', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: 'd473b24f6317fc24e025024a91fc6b533dcde244' }))))));
     }
     static get is() { return "gux-action-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -21,17 +21,6 @@
 .gux-badge gux-tooltip-title {
   white-space: nowrap;
 }
-.gux-badge .gux-sr-only {
-  /* stylelint-disable-next-line nesting-selector-no-missing-scoping-root */
-}
-.gux-badge .gux-sr-only:not(:focus):not(:active) {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
-  white-space: nowrap;
-  clip-path: inset(50%);
-}
 .gux-badge.gux-info {
   color: var(--gse-ui-badge-info-regular-foregroundColor);
   background-color: var(--gse-ui-badge-info-regular-backgroundColor);

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

@@ -10,7 +10,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { h } from "@stencil/core";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import translationResources from "./i18n/en.json";
 import { OnMutation } from "../../../utils/decorator/on-mutation";
 /**
@@ -40,7 +40,7 @@ export class GuxBadge {
         h("gux-tooltip-title", { "aria-hidden": "true" }, h("span", null, h("slot", { "aria-hidden": "true", onSlotchange: this.onSlotChange.bind(this) }))));
     }
     renderSrText() {
-        return (h("div", { class: "gux-sr-only" }, this.i18n(this.getVariant(), {
+        return (h("gux-screen-reader-beta", { "block-level": true }, this.i18n(this.getVariant(), {
             label: this.label
         })));
     }
@@ -52,7 +52,7 @@ export class GuxBadge {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: '1ae7ee1b9230d602745befe14c414a63cae92b21', class: {
+        return (h("div", { key: '9b42ffccb50cdf0259c3f6db19ec508a9dd9d7e7', class: {
                 'gux-badge': true,
                 [`gux-${this.accent}`]: true,
                 'gux-bold': this.bold

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

@@ -1,5 +1,5 @@
 import { h, forceUpdate } from "@stencil/core";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import { trackComponent } from "../../../utils/tracking/usage";
 import breadcrumbsResources from "./i18n/en.json";
 /**
@@ -19,7 +19,7 @@ export class GuxBreadcrumbs {
         Array.from(this.root.children).forEach(child => forceUpdate(child));
     }
     render() {
-        return (h("nav", { key: 'f88e1453059c33d40490b89dd34cc3a8e33ea923', "aria-label": this.i18n('breadcrumbs') }, h("ol", { key: '26b822edbc6d93eabb4dc97db340e4155ad02678' }, h("slot", { key: '2fab33cf5d08f62d8b4b215a3484094b2afef601', onSlotchange: this.onSlotChange.bind(this) }))));
+        return (h("nav", { key: 'ea6b93a54c1c8cfcf21365dacb4fc8bceaefff9b', "aria-label": this.i18n('breadcrumbs') }, h("ol", { key: 'c1a44ca6cbd884ea4713d06135d31643821522a5' }, h("slot", { key: '8adc5d5a7a336c40548fe5ae7975953eac36fa33', onSlotchange: this.onSlotChange.bind(this) }))));
     }
     static get is() { return "gux-breadcrumbs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -160,13 +160,4 @@
   border-radius: var(--gse-ui-calendarMenu-month-borderRadius);
   outline: var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);
   outline-offset: var(--gse-semantic-focusOutline-offset);
-}
-
-.gux-sr-only {
-  position: absolute;
-  top: auto;
-  left: -10000px;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
 }

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

@@ -3,7 +3,7 @@ import { afterNextRenderTimeout } from "../../../utils/dom/after-next-render";
 import { asIsoDateRange, asIsoDate, fromIsoDateRange, fromIsoDate } from "../../../utils/date/iso-dates";
 import { addClassToElements, removeClassToElements } from "../../../utils/dom/manipulate-elements-classes";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent, getDesiredLocale, getStartOfWeek } from "../../../i18n";
+import { buildI18nForComponent, getDesiredLocale, getStartOfWeek } from "../../../i18n/index";
 import translationResources from "./i18n/en.json";
 import { firstDateInMonth, getWeekdays, getOffsetMonthDate, getDateMonthAndYearString } from "./gux-calendar.service";
 export class GuxCalendar {
@@ -341,10 +341,10 @@ export class GuxCalendar {
         })));
     }
     renderCalendarTable(index) {
-        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("span", { class: "gux-sr-only" }, getDateMonthAndYearString(day.date, this.locale)))))))))));
+        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: '067cd81bad66f5a4dba8242370a3bae746ed77e8', class: "gux-calendar" }, h("div", { key: 'f903f7f60cccc0a3f6623e466fd0e124d3b093de', class: "gux-header" }, h("button", { key: '87ebd73f2815a7057c6f06864a32544ea8a91729', type: "button", class: "gux-left", "aria-label": this.i18n('previousMonth'), onClick: () => this.incrementPreviewDateByMonth(-1) }, h("gux-icon", { key: 'ba43661694f71dc600850afe21f78b96bed476d7', size: "small", decorative: true, "icon-name": "custom/chevron-left-small-regular" })), this.renderMonthHeader(), h("button", { key: 'cdcddaf9162eab54a9263295dfd54d7a0cdbb87a', type: "button", class: "gux-right", "aria-label": this.i18n('nextMonth'), onClick: () => this.incrementPreviewDateByMonth(1) }, h("gux-icon", { key: 'e0a2b4cd4b4454fe2fca83ebdb94a67cdeceacf2', size: "small", decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("div", { key: '8c3009f3e688993ba95bd8f96ecb79188ad04d98', class: "gux-content" }, Array.from(Array(this.numberOfMonths).keys()).map(index => this.renderCalendarTable(index)))));
+        return (h("div", { key: '032d8f640205190a50accc0e0ec207281837b192', class: "gux-calendar" }, h("div", { key: '609ddea253dc5519d475e5f76dd19662fc9a088c', class: "gux-header" }, h("button", { key: '5417571dec9cb6807408d0d86ff850026632792c', type: "button", class: "gux-left", "aria-label": this.i18n('previousMonth'), onClick: () => this.incrementPreviewDateByMonth(-1) }, h("gux-icon", { key: 'c64d3e6fb3778e17bd9519af36a818cbf5ea8456', size: "small", decorative: true, "icon-name": "custom/chevron-left-small-regular" })), this.renderMonthHeader(), h("button", { key: 'fb7339b1279e90a81f1f941ddb99f5b2edc718c4', type: "button", class: "gux-right", "aria-label": this.i18n('nextMonth'), onClick: () => this.incrementPreviewDateByMonth(1) }, h("gux-icon", { key: 'f3a51e4365bb254f3ef4a0f58ab72115282b231d', size: "small", decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("div", { key: '64769c9c22d6e7bc60efdadc33302d820b95eaad', 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-column-manager/gux-column-manager-item/gux-column-manager-item.js

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { buildI18nForComponent } from "../../../../i18n";
+import { buildI18nForComponent } from "../../../../i18n/index";
 import { getIndexInParent } from "../gux-column-manager.service";
 import { getNewIndex } from "./gux-column-manager-item.service";
 import translationResources from "./i18n/en.json";
@@ -124,14 +124,14 @@ export class GuxColumnManagerItem {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h(Host, { key: 'f2cd78c117f774e87a90de253a607ce1176ea52b', draggable: "true" }, h("div", { key: '828474c457c8c2603e8797afc13d47c3ce951458', class: {
+        return (h(Host, { key: 'd55753e1cc651b73233dd15ace2ecb8d346a4574', draggable: "true" }, h("div", { key: '9298c144266decf9799879a20fa0c134036b3ce0', class: {
                 'gux-container': true,
                 [`gux-drop-${this.pendingReorder}`]: true,
                 'gux-dragging': this.isDragging
-            } }, h("button", { key: '0783664045ca9999af0f767e635acbb2460f2f4b', class: {
+            } }, h("button", { key: '239abda7a6ea866813fc28f1483883a5d1239957', class: {
                 'gux-reorder': true,
                 'gux-reordering': this.isReordering
-            }, type: "button", onClick: () => this.toggleReorderMode(), onKeyDown: event => this.keyboardReorder(event), ref: el => (this.reorderButtonElement = el) }, h("gux-icon", { key: 'd6ae4ffe0dcc6be631da62f60a701a47836ea8e0', "icon-name": "fa/grip-vertical-solid", decorative: true, size: "small" }), h("span", { key: 'dcc7e788afd52e66291cdd925455f0a4d005f7eb', class: "gux-sr-only" }, this.i18n('activateReordering', { columnName: this.text }))), h("div", { key: '417c1440be57c011c1badc6daf3784e3aa8e1bf9', class: "gux-select" }, h("slot", { key: 'da570867c0909992d5f00c06ffd2c3717dd94198', onSlotchange: () => this.onSlotChange() }), h("gux-text-highlight", { key: '8a42e0702ccb7df121c1c8f98a26ed9d92d842a8', highlight: this.highlight, text: this.text, strategy: "contains", dimmed: !this.highlightActive })))));
+            }, type: "button", onClick: () => this.toggleReorderMode(), onKeyDown: event => this.keyboardReorder(event), ref: el => (this.reorderButtonElement = el) }, h("gux-icon", { key: '905538a42e996b039af53f9026cdc5286f623303', "icon-name": "fa/grip-vertical-solid", decorative: true, size: "small" }), h("span", { key: 'd5447c3b82ff2813e44d335d75f74dddf1945c23', class: "gux-sr-only" }, this.i18n('activateReordering', { columnName: this.text }))), h("div", { key: 'cd39ac1aa9e7231a885c8cb5a0122943761fd631', class: "gux-select" }, h("slot", { key: 'be1b15c377b74c09e40eb32fc2cbf7e2d84394ba', onSlotchange: () => this.onSlotChange() }), h("gux-text-highlight", { key: '2f1bbc3a44a26a2b32717471a06b306d4690fb34', 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

@@ -1,5 +1,5 @@
 import { h, forceUpdate } from "@stencil/core";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import { trackComponent } from "../../../utils/tracking/usage";
 import { getEmptyKeyboardOrderChange, getIndexInParent, getNewKeyboardOrderChange, getNewOrder, getSelectedColumnCount, setAllCheckboxInputs, setHighlights, setKeyboardReorderPositionIndicator, setMainCheckboxElementCheckedState } from "./gux-column-manager.service";
 import translationResources from "./i18n/en.json";
@@ -89,7 +89,7 @@ export class GuxColumnManager {
         return (h("div", null, h("span", { "aria-hidden": "true" }, this.i18n('selectedColumnCount', { count, total })), h("span", { class: "gux-sr-only" }, count === total ? (h("span", null, ": ", this.i18n('unselectAllColumnsScreenReader', { count, total }))) : (h("span", null, ": ", this.i18n('selectAllColumnsScreenReader', { count, total }))))));
     }
     render() {
-        return (h("div", { key: '0b2c8f0a66cca67325c3d58f325d1a2f5365612a', class: "gux-container" }, h("div", { key: '7bf3280cb92a91ca35a95e89ede8f3b622169a7d', class: "gux-sr-only", "aria-live": "polite" }, `${this.highlightResults.matchCount} ${this.i18n('searchResults')}`), h("div", { key: 'b54577048da6aaff0b13847761df5a01b6cbc2e2', class: "gux-search" }, h("gux-content-search", { key: '0a762fdeffef88877252832b6a6c342836c6c24c', "match-count": this.highlightResults.matchCount, "current-match": this.highlightResults.currentMatch, onGuxcurrentmatchchanged: event => this.onGuxCurrentMatchChanged(event) }, h("input", { key: 'b1dd9eaf293f4f6493b55977970a27b677b9951b', type: "search", placeholder: this.i18n('search'), onInput: () => this.onSearchInput(), ref: el => (this.searchElement = el) }))), h("div", { key: 'd13677890f61d9c2acfd205b9c5fcb637fbaa4e5', class: "gux-select" }, h("gux-form-field-checkbox", { key: 'd8d2c203dab6ada51ff810404e7d2c5234f7b8b0' }, h("input", { key: 'a9bae443ea1e263e71f76c806c4f8f97a03711c7', slot: "input", type: "checkbox", ref: el => (this.mainCheckboxElement = el), onChange: () => this.onMainCheckboxChange() }), h("label", { key: '906214e2ccd42eb232b3e0a709984eb361e28afe', slot: "label" }, this.renderSelectedColumnCount()))), h("div", { key: '484e7774568e0122aeafdee59d452dc47838e4a2', class: "gux-list", onChange: () => this.onListChange() }, h("slot", { key: 'a7632a59deb498f81d5f51a1a6e7596e167d4c53', onSlotchange: () => this.onSlotChange() })), h("gux-announce-beta", { key: 'b839ad07457d0404e3fe7d007fbd4437ce3a30b7', ref: el => (this.announceElement = el) })));
+        return (h("div", { key: '86ea203d2bc59f262613c1343a7d67f0873e624c', class: "gux-container" }, h("div", { key: 'b5df3967d80cb060dc11fb5792d7f5fe3d3bae87', class: "gux-sr-only", "aria-live": "polite" }, `${this.highlightResults.matchCount} ${this.i18n('searchResults')}`), h("div", { key: '36f262c62b4b29973b672f5ab914977f49582716', class: "gux-search" }, h("gux-content-search", { key: '8364d7aa5299ea32fd0e169fcceca1025e486e05', "match-count": this.highlightResults.matchCount, "current-match": this.highlightResults.currentMatch, onGuxcurrentmatchchanged: event => this.onGuxCurrentMatchChanged(event) }, h("input", { key: 'f4ceffb69a6360de9b2977462cae932357f9b04d', type: "search", placeholder: this.i18n('search'), onInput: () => this.onSearchInput(), ref: el => (this.searchElement = el) }))), h("div", { key: '84755123168c385dcb54ee82f1fc607350bf3133', class: "gux-select" }, h("gux-form-field-checkbox", { key: '12784281b13bd165fca5c5098ec53c13bbfa28fe' }, h("input", { key: '85b0f7fe1d879141797f50458db8084d5e357fe2', slot: "input", type: "checkbox", ref: el => (this.mainCheckboxElement = el), onChange: () => this.onMainCheckboxChange() }), h("label", { key: 'd631f892e0d2e5d11d106db7476e27d0021f2374', slot: "label" }, this.renderSelectedColumnCount()))), h("div", { key: '793a77429a1d800764a0ee52f464642615d7d05b', class: "gux-list", onChange: () => this.onListChange() }, h("slot", { key: '66ebc2049c3d05c66874f12666ea0376e9d52381', onSlotchange: () => this.onSlotChange() })), h("gux-announce-beta", { key: '7def738d9531f86410cc17ba78aa5443105934ed', 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

@@ -1,6 +1,6 @@
 import { h } from "@stencil/core";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import contentSearchResources from "./i18n/en.json";
 import { onDisabledChange } from "../../../utils/dom/on-attribute-change";
 import { focusInputElement } from "../../../utils/dom/focus-input-element";
@@ -50,10 +50,10 @@ export class GuxContentSearch {
         }
     }
     render() {
-        return (h("div", { key: '7aaeebd634cc4867e69b12a05c509e876e65f74f', class: {
+        return (h("div", { key: '73e492c9ba5084ab4a9be67042f9e2e6f9ecd2f0', class: {
                 'gux-content-search': true,
                 'gux-disabled': this.disabled
-            }, onClick: () => focusInputElement(this.inputSlottedElement) }, h("div", { key: '359b4f7bab27f2405f921c1dd0c0a7b906f300c5', class: "gux-search-icon" }, h("gux-icon", { key: 'b2c55637d3cb011938208976fef8db8e24da5fcf', size: "small", decorative: true, "icon-name": "fa/magnifying-glass-regular" })), h("slot", { key: '7032861829a3edd04d7d527415b447112e1747c7' }), this.getNavigationPanel()));
+            }, onClick: () => focusInputElement(this.inputSlottedElement) }, h("div", { key: '178f17dd1987bbcd12b610777ea84060de86c0ca', class: "gux-search-icon" }, h("gux-icon", { key: 'ccdaa14da8cf64122b5c736fc9cd16c7fc0a5a58', size: "small", decorative: true, "icon-name": "fa/magnifying-glass-regular" })), h("slot", { key: '4d853841ba463423b737f9d9976d61902065a18a' }), this.getNavigationPanel()));
     }
     getNavigationPanel() {
         if (this.showNavigationPanel()) {

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

@@ -12,7 +12,7 @@ import { h, Host } from "@stencil/core";
 import uiTokens from "genesys-spark-tokens/dist/json/gse-ui-flare-light.json";
 import { randomHTMLId } from "../../../utils/dom/random-html-";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import translationResources from "./i18n/en.json";
 import { OnClickOutside } from "../../../utils/decorator/on-click-outside";
 import { afterNextRender } from "../../../utils/dom/after-next-render";
@@ -124,8 +124,8 @@ export class GuxContextMenu {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h(Host, { key: 'ec21cee5229d03d954215fa1cd9c7d4b0d13bc5c' }, h("gux-popup", { key: '9a7913e35b2d0d589b17450e8351670927d2be37', placement: this.placement, expanded: this.isOpen, offset: parsePxValue(uiTokens.dropdown['gap']), "exceed-target-width": true }, h("div", { key: '3e3e37be9a5c16bf503aacdd1f33d8fcc2e8b10d', slot: "target", class: "gux-button-container" }, h("gux-button-slot", { key: 'ff699d4e303a6792ab4c943255c10d30f732501e', accent: "ghost" }, h("button", { key: 'a64f24c3a96e547fc3922f965ac55895397f83e1', 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: 'ad3cba0c48dd03055f0c421aa1c579b6a8f9f141' }, this.screenreaderText ||
-            this.i18n('contextMenuScreenreaderText')), h("gux-icon", { key: '355308539f9feb0272213912070a5a83b67ff3c8', "icon-name": "fa/ellipsis-vertical-regular", size: "small", decorative: true })))), h("div", { key: '8dcc7575c24e8fa73f54929da55ad607c483f568', slot: "popup", class: "gux-list-container" }, h("gux-list", { key: 'de92533b2acffee5b5cff4842be78210a29bfd40', onClick: e => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '4eb78e3b5e73f013ecbda35005fafba6d5e93dd6' }))))));
+        return (h(Host, { key: '6bf1dded894b9382b71146ae5a0465308f68ad24' }, h("gux-popup", { key: '27adba7de5bb4a24c2ee5fc6390776bf70862484', placement: this.placement, expanded: this.isOpen, offset: parsePxValue(uiTokens.dropdown['gap']), "exceed-target-width": true }, h("div", { key: '0c170d5c4880e3727dcf25c06c490dc34390baee', slot: "target", class: "gux-button-container" }, h("gux-button-slot", { key: '732c1cc18d8fe2ccf719b2bd01c39c1204cbc61c', accent: "ghost" }, h("button", { key: 'ba31c6798868884b53e5517b4af1a1cc0465a54d', 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: '72f174c5762a0fb71a416c46dc49b5635028f068' }, this.screenreaderText ||
+            this.i18n('contextMenuScreenreaderText')), h("gux-icon", { key: 'ccbb8956af52d338731ad4fe3c2954d4df6eca78', "icon-name": "fa/ellipsis-vertical-regular", size: "small", decorative: true })))), h("div", { key: '392bd0f492eae53922c1c8117d826be892e03535', slot: "popup", class: "gux-list-container" }, h("gux-list", { key: 'e9e82dc1deaabbce994df45873ce4fdc5a557712', onClick: e => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '9a7b3defb1fd59b6dad1e969ecd658728d18a2e3' }))))));
     }
     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

@@ -1,6 +1,6 @@
 import { h } from "@stencil/core";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import translationResources from "./i18n/en.json";
 import { getSlotTextContent } from "../../../utils/dom/get-slot-text-content";
 /**
@@ -52,7 +52,7 @@ export class GuxCopyToClipboard {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("button", { key: 'e4ab87600485394543ac4e08917231bc6199a9d1', class: "gux-copy-to-clipboard-wrapper", onClick: this.onCopyToClipboard.bind(this), "aria-label": getSlotTextContent(this.root, 'content') }, h("div", { key: '792fdd6405f84d3812701cb3c5858136aaaeef10', class: "gux-copy-content" }, h("slot", { key: '61acedea804d404d08ec6802f6f632d66c556f5b', name: "content" }), h("gux-icon", { key: '0e4960438dce436f33bba049e6bdb6509d23d5ed', "icon-name": "fa/copy-regular", size: "small", decorative: true })), this.renderTooltip()));
+        return (h("button", { key: '1592818b2015620fd238f12d6fa106116a2e9761', class: "gux-copy-to-clipboard-wrapper", onClick: this.onCopyToClipboard.bind(this), "aria-label": getSlotTextContent(this.root, 'content') }, h("div", { key: '30bec5ad4cb71ac0b6b2a8e70e16560fbdaf244f', class: "gux-copy-content" }, h("slot", { key: 'ada4edc6d77df5166fce89d552252ad5eea927c2', name: "content" }), h("gux-icon", { key: '25e6862f0c01542570d9493bb08c3cc3da4ebc4f', "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

@@ -15,7 +15,7 @@ import { afterNextRenderTimeout } from "../../../utils/dom/after-next-render";
 import { asIsoDateRange, asIsoDate, fromIsoDateRange, fromIsoDate } from "../../../utils/date/iso-dates";
 import { OnClickOutside } from "../../../utils/decorator/on-click-outside";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import { sparkIntl } from "genesys-spark-utils";
 // Remove with this ticket https://inindca.atlassian.net/browse/COMUI-2657
 import { useRegionalDates } from "../../../i18n/use-regional-dates";
@@ -294,12 +294,19 @@ export class GuxDatepicker {
         if (this.mode === "range" /* CalendarModes.Range */) {
             const fromValue = this.stringToDate(this.inputElement.value);
             const toValue = this.stringToDate(this.toInputElement.value);
+            if (!this.isValidDateFormat(fromValue) ||
+                !this.isValidDateFormat(toValue)) {
+                return;
+            }
             this.value = asIsoDateRange(fromValue, toValue);
             this.updateDate();
             void this.calendarElement.setValue([fromValue, toValue]);
         }
         else {
             const date = this.stringToDate(this.inputElement.value);
+            if (!this.isValidDateFormat(date)) {
+                return;
+            }
             this.value = asIsoDate(date);
             this.updateDate();
             void this.calendarElement.setValue(date);
@@ -365,6 +372,15 @@ export class GuxDatepicker {
             regexp
         };
     }
+    isValidDateFormat(dateValue) {
+        const { map: map3 } = this.getMapAndRegexFromField(dateValue);
+        if (this.yearFormat === 'yyyy') {
+            return map3.yyyy.length === 4;
+        }
+        else {
+            return map3.yy.length === 2;
+        }
+    }
     updateDate() {
         if (this.mode === "range" /* CalendarModes.Range */) {
             const [from, to] = fromIsoDateRange(this.value);
@@ -539,7 +555,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: 'e44976f9fc47f907642306ee3caa6a5426756c20', class: {
+        return (h("div", { key: '87ba4fb1f5dab50e710194e0a083729097ce5c23', class: {
                 'gux-datepicker': true,
                 'gux-active': this.active,
                 'gux-disabled': this.disabled

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

@@ -1,6 +1,6 @@
 import { h } from "@stencil/core";
 import { trackComponent } from "../../../utils/tracking/usage";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import translationResources from "./i18n/en.json";
 export class GuxDismissButton {
     constructor() {
@@ -12,10 +12,10 @@ export class GuxDismissButton {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("gux-button-slot", { key: '4dd36dc32b0affd8026366ae45220e9e2b4bcb33', accent: "ghost", class: {
+        return (h("gux-button-slot", { key: '52a32d2f44a4ea6d98c7978aae6cdcd6e23ddfb7', accent: "ghost", class: {
                 'gux-inherit': this.position == 'inherit',
                 'gux-dismiss-small': this.size == 'small'
-            } }, h("button", { key: '44e2ba7d724cce5d899af0b64bba18ededfbac2e', type: "button", title: this.i18n('dismiss') }, h("div", { key: 'a12e9252fc5d7740a431e93a47c1559b7ab9150a', class: "gux-icon-container" }, h("gux-icon", { key: '6c95aeb37174259a4dd9cf6b13db5d6418bedc0b', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" })))));
+            } }, h("button", { key: '1a291cbdbee48b4c20bf4651bc30d875c35f9da0', type: "button", title: this.i18n('dismiss') }, h("div", { key: 'e47fbada9557f20098c5304452fc607f174a9ea3', class: "gux-icon-container" }, h("gux-icon", { key: 'b3872a8afe53a3c97adfd5071e6657c92fb234ab', "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.js

@@ -10,7 +10,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { forceUpdate, h } from "@stencil/core";
 import { OnClickOutside } from "../../../utils/decorator/on-click-outside";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import simulateNativeEvent from "../../../utils/dom/simulate-native-event";
 import { calculateInputDisabledState } from "../../../utils/dom/calculate-input-disabled-state";
 import { onInputDisabledStateChange } from "../../../utils/dom/on-input-disabled-state-change";
@@ -368,7 +368,7 @@ export class GuxDropdown {
         }
     }
     render() {
-        return (h("gux-popup", { key: '2bb3ff99d9c209b939208b34e0b1ce31085deb6e', 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: '9e7bd1a3ef412ee6ac9548e1822e7ae1c75808b2', 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

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { buildI18nForComponent } from "../../../../i18n";
+import { buildI18nForComponent } from "../../../../i18n/index";
 import translationResources from "./i18n/en.json";
 export class GuxDropdownMultiTag {
     constructor() {
@@ -36,7 +36,7 @@ export class GuxDropdownMultiTag {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: 'f0c0d9968836e31c4c6ba96fcdbcfc28c514c3ac', class: {
+        return (h("div", { key: '4a4ed523b1fa1d5b0b13392febeaec12ca1355de', 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

@@ -68,21 +68,6 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
-.gux-field .gux-field-content .gux-filter .gux-sr-only,
-.gux-field .gux-field-content .gux-selected-option .gux-sr-only,
-.gux-field .gux-field-content .gux-placeholder .gux-sr-only {
-  /* stylelint-disable-next-line nesting-selector-no-missing-scoping-root */
-}
-.gux-field .gux-field-content .gux-filter .gux-sr-only:not(:focus):not(:active),
-.gux-field .gux-field-content .gux-selected-option .gux-sr-only:not(:focus):not(:active),
-.gux-field .gux-field-content .gux-placeholder .gux-sr-only:not(:focus):not(:active) {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
-  white-space: nowrap;
-  clip-path: inset(50%);
-}
 .gux-field .gux-field-content .gux-filter {
   position: relative;
   block-size: 100%;

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

@@ -10,7 +10,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { forceUpdate, h } from "@stencil/core";
 import { OnClickOutside } from "../../../utils/decorator/on-click-outside";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 import simulateNativeEvent from "../../../utils/dom/simulate-native-event";
 import { afterNextRender } from "../../../utils/dom/after-next-render";
 import { onInputDisabledStateChange } from "../../../utils/dom/on-input-disabled-state-change";
@@ -348,7 +348,7 @@ export class GuxDropdownMulti {
         return selectedElementString
             ? [
                 selectedElementString,
-                h("span", { class: "gux-sr-only" }, this.placeholder)
+                h("gux-screen-reader-beta", null, this.placeholder)
             ]
             : false;
     }
@@ -362,7 +362,7 @@ export class GuxDropdownMulti {
     getSrSelectedText() {
         const selectedListboxOptionElement = this.getOptionElementByValue(this.value);
         if (selectedListboxOptionElement.length) {
-            return (h("span", { class: "gux-sr-only" }, this.i18n('numberSelected', {
+            return (h("gux-screen-reader-beta", null, this.i18n('numberSelected', {
                 numberSelected: selectedListboxOptionElement.length.toString()
             })));
         }
@@ -416,7 +416,7 @@ export class GuxDropdownMulti {
     }
     render() {
         return [
-            h("div", { key: '49ec4d58b2ba018871c575ed610666305957df7a', class: "gux-dropdown-container" }, h("gux-popup", { key: '2aca6903d81aec24795163038b47812a2214fb89', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
+            h("div", { key: '3d7e026e163c18fe00c3222e3a62284523f65427', class: "gux-dropdown-container" }, h("gux-popup", { key: 'd66ea9ce9cce8447d86e146067b268f06f64c090', 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

@@ -4,7 +4,7 @@ import { afterNextRenderTimeout } from "../../../utils/dom/after-next-render";
 import { trackComponent } from "../../../utils/tracking/usage";
 import { hideDelay } from "./gux-menu/gux-menu.common";
 import translationResources from "./i18n/en.json";
-import { buildI18nForComponent } from "../../../i18n";
+import { buildI18nForComponent } from "../../../i18n/index";
 /**
  * @slot target - target element
  * @slot menu - gux-menu element
@@ -183,10 +183,10 @@ export class GuxFlyoutMenu {
         }
     }
     render() {
-        return (h(Host, { key: 'f44087172d523b19565862d887af62c87703d195', tabIndex: 0, "aria-haspopup": "true" }, h("gux-announce-beta", { key: '3c7a54c210b50b5d865ae63ce946ad1cea19f4d8', ref: el => (this.announceElement = el) }), h("span", { key: '5b993a7d3d0b5ecb0de0c7775a102a5ff48e4f13', ref: el => (this.targetElement = el) }, h("slot", { key: 'fd2317898eeace1aace1e1100d7c4cb62cccaf08', name: "target" })), h("div", { key: '33fef6a19029d6f52e0b751bae14001ab43ea3ac', class: {
+        return (h(Host, { key: 'f7af5f029afc5a78013950650d3f38235c5d83c5', tabIndex: 0, "aria-haspopup": "true" }, h("gux-announce-beta", { key: 'ebb453f9409ccc1202d0ab1a9a80a6f0b13f9747', ref: el => (this.announceElement = el) }), h("span", { key: '54493f4a40de77bd5d02e11c4dbefb9c25474855', ref: el => (this.targetElement = el) }, h("slot", { key: '0f9375667e4fa5d88426ce22804284e48cff3c4d', name: "target" })), h("div", { key: '2cb8985112e63facc42bc8ae9763f45600a354e8', class: {
                 'gux-flyout-menu-content': true,
                 'gux-shown': this.isShown
-            }, ref: el => (this.menuContentElement = el) }, h("div", { key: '9124f04d2e45a8def507545d4d85c923ad63851e', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: '0ec8d0aa4c296241ca7849f787b39de7988c6e58', class: "gux-arrow-caret" })), h("slot", { key: '88c0caad6367e10633cb003f2e6f2c974e88a77a', name: "menu" }))));
+            }, ref: el => (this.menuContentElement = el) }, h("div", { key: '5757dfd8b8ba8d81d2b6261557bceed20403af02', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, h("div", { key: '982cd1c491a0b4760587738f95075fdb79811611', class: "gux-arrow-caret" })), h("slot", { key: '9fd12909b2da4d8d2cf7b17035db595444608ce4', name: "menu" }))));
     }
     static get is() { return "gux-flyout-menu"; }
     static get encapsulation() { return "shadow"; }

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

@@ -12,7 +12,7 @@ import { forceUpdate, h } from "@stencil/core";
 import { OnMutation } from "../../../../../utils/decorator/on-mutation";
 import { hasSlot } from "../../../../../utils/dom/has-slot";
 import { logWarn } from "../../../../../utils/error/log-error";
-import { buildI18nForComponent } from "../../../../../i18n";
+import { buildI18nForComponent } from "../../../../../i18n/index";
 import { setAllCheckboxInputs, setParentCheckboxElementCheckedState } from "./gux-form-field-checkbox-group.service";
 import { GuxFormFieldError, GuxFormFieldHelp, GuxFormFieldScreenreaderLabel, GuxFormFieldVisualLabel, GuxFormFieldFieldsetContainer } from "../../functional-components/functional-components";
 import { getSlotTextContent } from "../../../../../utils/dom/get-slot-text-content";
@@ -150,8 +150,8 @@ export class GuxFormFieldCheckboxGroupBeta {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '0008f4306145c9b51e9d946841c2ca1eeef7717a', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '3cb512f031a686e2b7dbbea0e53cf2e97f36602a' }, (_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: '016ad5f0eae620e3a7303fc54425ed36d69bfd32', position: "above", required: this.required }, h("slot", { key: '5a311e17c633931176d3cd58f8db53fc17da5b34', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '6547086df5b74d8c3d8d87be3ea47cb5d6e004d9', variant: this.indicatorMark, required: this.required }), h("slot", { key: '81b27b9717495e267b11f5dec0d8723c46d6e7ce', name: "group-label-info" })), h("slot", { key: '584266bcedb775c2c9b27dedecde891a90b91992', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: '86eb6597cb91cde530d564c99f6d971f600eeb0c', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: 'c875b2f283b6040e19cd0fa245db6ad160ebbb84', show: this.hasGroupError }, h("slot", { key: 'c421bad73080cf0156215ae3caa225fe7bfafc5a', name: "group-error" })), h(GuxFormFieldHelp, { key: '7bff612fbfe739d91631d2c810df2c2672151b6d', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: '5d23155a3bbb4edec3cf985bc19c88ba3d924544', name: "group-help" }))));
+        return (h(GuxFormFieldFieldsetContainer, { key: '399d41ad13dd4ed186f354287c59c6729b5e3ef9', labelPosition: "above" }, h(GuxFormFieldScreenreaderLabel, { key: '762b773f81ce1403e6f2791df8266f5691c653c5' }, (_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: '3bbc293ac496b877d5d147bba7189e3158b5d0ad', position: "above", required: this.required }, h("slot", { key: '25a3b6493e4a9c921950fc08383cb640f639e3f0', name: "group-label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'dcfd98494e6eca217d14b89a63d3bb86d9fe3dfb', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ed183232ef0880790e62d650f83221b049dc6abd', name: "group-label-info" })), h("slot", { key: 'eb50a04b9990f406807d59d0d1b18dbe3f54e305', onSlotchange: () => this.setupNestedCheckboxes(), name: "group-checkbox" }), h("slot", { key: 'e049cf31ede4b3bc76b99e0afe635ca8b9a18ee6', onSlotchange: () => this.updateMainCheckbox() }), h(GuxFormFieldError, { key: 'b066d0fd7c0a67ebc26b98e9fc4f7b8c54e2ab9e', show: this.hasGroupError }, h("slot", { key: 'b11e8bcd41dd40908f09662914e70133168abdd4', name: "group-error" })), h(GuxFormFieldHelp, { key: '34f97f6c1f1a7f22f4f450fc5f6cf2e5aa3f014f', show: !this.hasGroupError && this.hasGroupHelp }, h("slot", { key: 'fac350ea567fdd8ce10d70bed481cd5b6d8caff2', 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-dropdown/gux-form-field-dropdown.js

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { h } from "@stencil/core";
-import { buildI18nForComponent } from "../../../../../i18n";
+import { buildI18nForComponent } from "../../../../../i18n/index";
 import { OnMutation } from "../../../../../utils/decorator/on-mutation";
 import { onRequiredChange } from "../../../../../utils/dom/on-attribute-change";
 import { hasSlot } from "../../../../../utils/dom/has-slot";
@@ -102,11 +102,11 @@ export class GuxFormFieldDropdown {
     }
     render() {
         var _a;
-        return (h(GuxFormFieldFieldsetContainer, { key: '9b8e6f530c3b896b9a177f39a86dd342ad0fc88e', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '031877e650e52579b04c750a86f1381e8b700311' }, (_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: '8f60ccb8842ade0059c9998f881b1001ef2fb346', position: this.computedLabelPosition, required: this.required }, h("slot", { key: 'c1c402deebbf59c0977b0ddefefc27ac905ca3bd', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '359e75b7f0559b66d23da4ffb7564227be74a73c', variant: this.indicatorMark, required: this.required }), h("slot", { key: '356139fb417dae95e36187d8535b485a075cd198', name: "label-info" })), h("div", { key: '74355f1c441d776bbdf7066b66333d3258e29e8a', class: "gux-input-and-error-container" }, h("div", { key: '74964d2a08702dafcd6e65143c555629150441bf', class: {
+        return (h(GuxFormFieldFieldsetContainer, { key: '95cf0334aae89c2b185512975a3caa46b616f319', labelPosition: this.computedLabelPosition }, h(GuxFormFieldScreenreaderLabel, { key: '17a7d9db1d359d99b375e659d74e8ee198fead89' }, (_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: 'e0c6290b8960073a60caed07a95761b489572569', position: this.computedLabelPosition, required: this.required }, h("slot", { key: '093143723c654b514a86d9ba11bdd669343e678a', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'b5c53840b29e7edb7016fd655ef325af5c4613c8', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ad3d8db913a2054061a2cf17e55221e8f547df6f', name: "label-info" })), h("div", { key: 'b9d47e7fd0f101bd2bf50d7d8a5aaf5560d4a7d3', class: "gux-input-and-error-container" }, h("div", { key: '5f924b84c374f4eab9a5af090faa0b6dd5c0ae96', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            } }, h("slot", { key: 'ae25e5ca93f4829c3454214a901fed8ff5491d4f' })), h(GuxFormFieldError, { key: '0bc8594363370e78b6253133c0753a5deda48ed4', show: this.hasError }, h("slot", { key: '0ee66b41925aac4e6471b7558df0317a9f2178fe', name: "error" })), h(GuxFormFieldHelp, { key: '0602a0988288d08558c9953b50fcb47cc9045dd6', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ef1bdf9597df3d19c6f065127a832abb2acff611', name: "help" })))));
+            } }, h("slot", { key: 'e38e6e5580339bd8124d850064478838ed91fd4f' })), h(GuxFormFieldError, { key: 'f59489537e647d013f7cbb29765edc9f233126e8', show: this.hasError }, h("slot", { key: 'b238051d5d4c804cdd2bd80ab039c285a51cd24b', name: "error" })), h(GuxFormFieldHelp, { key: '49f27c2c46e71f7708fde91c35562a836f1dc9f2', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ead90e5f779f712ea1156e111b543e733e949eb2', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition

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

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { buildI18nForComponent } from "../../../../../../../i18n";
+import { buildI18nForComponent } from "../../../../../../../i18n/index";
 import { trackComponent } from "../../../../../../../utils/tracking/usage";
 import componentResources from "./i18n/en.json";
 export class GuxFileListItem {
@@ -11,11 +11,11 @@ export class GuxFileListItem {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: 'b47aba3e75a09821c83dcc3499298ab6a98b38ed', class: {
+        return (h("div", { key: '09ee5fd05bcb70aafea251c390baa7a5a8d3a784', class: {
                 'gux-file-list-item': true,
                 [`gux-${this.status}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: 'b36058c180ead4995b4bc14ac607f59b979cf75d', class: "gux-info" }, h("gux-truncate", { key: 'd8683f76ea7ec4f85f81b5e369bf344ef4c112a6' }, h("span", { key: '080063807fb5d76643be9d75614fcff140183695', class: "gux-file-name" }, this.name)), this.renderStatusIndicator(), this.renderFileRemoveButton()), this.renderAdditionalInfo()));
+            } }, h("div", { key: '7ac3f917cb8060f4beff69db1b287caad6967d7c', class: "gux-info" }, h("gux-truncate", { key: '270073a4d92044a3730ab8215f7a02d2ce06b7d3' }, h("span", { key: '87dc4ff844480d7ee736d2f77b9161e4152bdfd6', 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

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { h, forceUpdate } from "@stencil/core";
-import { buildI18nForComponent } from "../../../../../i18n";
+import { buildI18nForComponent } from "../../../../../i18n/index";
 import { OnMutation } from "../../../../../utils/decorator/on-mutation";
 import { hasSlot } from "../../../../../utils/dom/has-slot";
 import { trackComponent } from "../../../../../utils/tracking/usage";
@@ -94,7 +94,7 @@ export class GuxFormFieldFileBeta {
         (_c = this.multipleObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
     }
     render() {
-        return (h(GuxFormFieldContainer, { key: 'ba38fda53131cdb2eeee7f2373c79ce06d437dfa', labelPosition: "above" }, h(GuxFormFieldLabel, { key: '3aa225ef2b476e13565ec227a88b2a765e703304', position: "above", required: this.required }, h("slot", { key: '897b7e8e9a445ff71d2c7771ba80a7507ced4112', name: "label" }), h("gux-form-field-label-indicator", { key: '27af774a5a6b8f57a03a302c9e47aa37085adce5', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'a764e9b5f5e41b5577faa39817b231bb1a7a4816', name: "label-info" })), h("div", { key: '07a739ceefce691a6fb1fabfa7387a541810aabf', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: '6313af94988ede0ca0d93e5f0d9f0921200b0724', show: this.hasHelp }, h("slot", { key: '90b799ab83fb1f358a0018479279679f240d4526', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: 'e5365d0a9baf0f49e6a48995efe38c00269bc59d', show: this.hasError }, h("slot", { key: 'dd23717f4779bbfe80c34d5434aee22d3bc35cf4', name: "error" })), this.renderFileList())));
+        return (h(GuxFormFieldContainer, { key: '08375562c5f4fccba27ae887e75286a0c8316209', labelPosition: "above" }, h(GuxFormFieldLabel, { key: '2da1a8ccfb6fb0ffad13d6b7e17eb8c006ec3fec', position: "above", required: this.required }, h("slot", { key: '86c7bf4b43eac86d082075326f247da876690128', name: "label" }), h("gux-form-field-label-indicator", { key: '13ff56e6483c61e4f698c69a51adb0e8d37b4929', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'a23675a2164c4080677980f3d6aa55ea1b05c163', name: "label-info" })), h("div", { key: '269ea5528a86db45b366c8f6f0528aeeb6636ba0', class: "gux-input-and-error-container" }, h(GuxFormFieldHelp, { key: 'e1afa7df59e08f6820097d88fbe542e7ddbfcb09', show: this.hasHelp }, h("slot", { key: '176674d3b557f621f8c28d67fc7d8843be91623c', name: "help" })), this.renderInputSlot(), h(GuxFormFieldError, { key: '4dd69a7d5c0c9dbfe3129c24773d6efdc082d35b', show: this.hasError }, h("slot", { key: '4ac9a75500eb2fde0de2809718dd02f16c2eaf3f', name: "error" })), this.renderFileList())));
     }
     setInput() {
         this.input = getSlottedInput(this.root, 'input[type="file"][slot="input"]');

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

@@ -9,7 +9,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { forceUpdate, h } from "@stencil/core";
-import { buildI18nForComponent } from "../../../../../i18n";
+import { buildI18nForComponent } from "../../../../../i18n/index";
 import { calculateInputDisabledState } from "../../../../../utils/dom/calculate-input-disabled-state";
 import { onInputDisabledStateChange } from "../../../../../utils/dom/on-input-disabled-state-change";
 import { OnMutation } from "../../../../../utils/decorator/on-mutation";
@@ -105,14 +105,14 @@ export class GuxFormFieldNumber {
     }
     render() {
         const showClearButton = this.clearable && this.hasContent && !this.disabled;
-        return (h(GuxFormFieldContainer, { key: '40d793883c8f040b7e3399f5dfdda555c0e7972a', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '1b604aa8139b9362e4f787500ebb3838bd6e9cf0', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '50064a567caa548d4cefff7e5963d41b5a4680dd', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: '65d9d8b7e703e86ef01302dbf0fa4b7d45550d94', variant: this.indicatorMark, required: this.required }), h("slot", { key: 'ac085c68d1768253901ee34c7c820db90e1b5e4d', name: "label-info" })), h("div", { key: 'b2b70118cd411ff4bec29d713d8245401bb275e6', class: "gux-input-and-error-container" }, h("div", { key: 'bd3e135957ea883d7a57542ce5331646372265f5', class: {
+        return (h(GuxFormFieldContainer, { key: '137a3979f9996ba04d92dd420167dd84d8bd678b', labelPosition: this.computedLabelPosition }, h(GuxFormFieldLabel, { key: '7d5bf5c68f8537a328d7c1b8e7a2c366cdce2128', required: this.required, position: this.computedLabelPosition }, h("slot", { key: '102f722e3e88f68a49e11133c227c892032a28cf', name: "label", onSlotchange: () => this.setLabel() }), h("gux-form-field-label-indicator", { key: 'd88bf90fa98f018248a28f08ed9e217466ddce18', variant: this.indicatorMark, required: this.required }), h("slot", { key: '37df5a0dd779d9da8cf3b60f84d5e52115e1fa46', name: "label-info" })), h("div", { key: '5937c320d96258cde309337a7e055d42790b54fb', class: "gux-input-and-error-container" }, h("div", { key: 'd8391d88ec67783d1259f2e4942392db97e67904', class: {
                 'gux-input': true,
                 'gux-input-error': this.hasError
-            }, part: "input-section" }, h("div", { key: '6c32d2d104f8ddaa794f54c8a0fc96b62eac436c', class: {
+            }, part: "input-section" }, h("div", { key: 'ab857c5c2c6e1123c881ac599a508554ce6b4b7c', class: {
                 'gux-input-container': true,
                 'gux-disabled': this.disabled,
                 'gux-clear': showClearButton
-            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '87a517880ad729b124482492b042e99a0feed57b', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { key: 'd80d8f20482130340656cdde698fc64e21644e55', onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: 'da6c9f11abef8a656e9a38e20b0b9f2747ef9338', show: this.hasError }, h("slot", { key: 'f1ba52ae2d311e30774ac2f595988c546118d8c4', name: "error" })), h(GuxFormFieldHelp, { key: '326888d9072b6c9fcc50d5a300195d1282282b4e', show: !this.hasError && this.hasHelp }, h("slot", { key: '9d28cede3745ca43c5e6a7ede988d96748af41b3', name: "help" })))));
+            }, onClick: () => focusInputElement(this.input) }, h("slot", { key: '92c76a08f4e0cce0f905c06451e4c08c208813e6', name: "input", onSlotchange: () => this.setInput() }), showClearButton && (h("gux-form-field-input-clear-button", { key: '958fb87df1cb20157aaa4238422bc1e957ebd830', onClick: () => clearInput(this.input) }))), this.renderStepButtons(this.input, this.getI18nValue, this.disabled)), h(GuxFormFieldError, { key: '73894cf0dd8900be644733ace75042f75db6f8da', show: this.hasError }, h("slot", { key: 'abf56087a30c56684cd3992365f9d1bd6be9129b', name: "error" })), h(GuxFormFieldHelp, { key: 'a9d02d2ae53c77fd0866b60ab1f88addf9c42673', show: !this.hasError && this.hasHelp }, h("slot", { key: 'ce70b5209a863db0f86ebe207e0cce4c9bc34f31', name: "help" })))));
     }
     get variant() {
         const labelPositionVariant = this.labelPosition