genesys-spark-components 4.138.5 → 4.140.0

package/dist/collection/components/beta/gux-time/gux-time.js

@@ -43,7 +43,7 @@ export class GuxTime {
         }
     }
     render() {
-        return (h(Host, { key: '1e2d860f385c841609856eadc9c4041ea8a38725' }, this.renderTime()));
+        return (h(Host, { key: '2a9c1458c092543436ad93329af035318e1603f6' }, this.renderTime()));
     }
     static get is() { return "gux-time-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-time-zone/gux-time-zone.js

@@ -25,7 +25,7 @@ export class GuxTimeZoneBeta {
         this.i18n = await buildI18nForComponent(this.root, translationResources, 'gux-time-zone-picker');
     }
     render() {
-        return (h(Host, { key: 'e68e14ac762297aa69d0258cb37dfe15a2fa12ed' }, this.renderZoneDisplay()));
+        return (h(Host, { key: '14713114b34655e4e23c8ef552df7edd5f0c65a4' }, this.renderZoneDisplay()));
     }
     static get is() { return "gux-time-zone-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-time-zone-picker/gux-time-zone-picker.js

@@ -143,11 +143,11 @@ export class GuxTimeZonePickerBeta {
         return (h("gux-option-group-beta", { label: this.i18n('all') }, this.timeZoneOptionElements));
     }
     render() {
-        return (h("gux-dropdown", { key: 'c34c6efd43cb91ccf3fea9b5187cbfd7f7ee9c71', class: {
+        return (h("gux-dropdown", { key: '8a65b11f06a8db17793321e05242e60a47534433', class: {
                 'has-defaults': !!this.workspaceDefault ||
                     !!this.localDefault ||
                     !!this.customDefault
-            }, "filter-type": "custom", placeholder: this.i18n('selectZone'), value: this.value, hasError: this.hasError, disabled: this.disabled }, h("gux-listbox", { key: 'a217c92a154dc582a90716828ee5651e7b7d6caf', "aria-label": this.i18n('timeZones') }, this.renderDefaultsList(), this.renderAllTimeZoneOptionsList())));
+            }, "filter-type": "custom", placeholder: this.i18n('selectZone'), value: this.value, hasError: this.hasError, disabled: this.disabled }, h("gux-listbox", { key: '8bd6a6825e0d50b49e3d6b32acb89fe645de9ea0', "aria-label": this.i18n('timeZones') }, this.renderDefaultsList(), this.renderAllTimeZoneOptionsList())));
     }
     static get is() { return "gux-time-zone-picker-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-tooltip-base/gux-tooltip-base.js

@@ -167,10 +167,10 @@ export class GuxTooltipBase {
         this.disconnectForElement();
     }
     render() {
-        return (h(Host, { key: '4e7c0cf62fae55affefec3c26c6f09e1a7a31edd', id: this.tooltipId ? undefined : this.id, role: this.tooltipId && !this.isShown ? undefined : 'tooltip', class: { 'gux-show': this.isShown }, "aria-hidden": this.visualOnly }, h("div", { key: '5331c5c37ba1c7fff188e3aab855d8ed0abbd921', class: {
+        return (h(Host, { key: '3c039f88acd3b9d8860760bcb6ff4075abc3bd62', id: this.tooltipId ? undefined : this.id, role: this.tooltipId && !this.isShown ? undefined : 'tooltip', class: { 'gux-show': this.isShown }, "aria-hidden": this.visualOnly }, h("div", { key: 'cf5f9b2030131f9040c04c3e7da86c69cbfe3782', class: {
                 'gux-container': true,
                 [`gux-${this.accent}`]: true
-            }, "data-placement": this.placement }, h("slot", { key: '70e9076b53ea55109e601bc5f6f9a8eca82ff3c8', name: "content" }))));
+            }, "data-placement": this.placement }, h("slot", { key: 'b3c61648c3e2839430688254dabd7436670b772e', name: "content" }))));
     }
     static get is() { return "gux-tooltip-base-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-tooltip-beta/gux-tooltip.js

@@ -76,7 +76,7 @@ export class GuxTooltip {
         }
     }
     render() {
-        return (h(Host, { key: '39759a12861d98e00fe221320c70eeec572d9a5d', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: '9652ad62b51d30b360ac8caa089158a50e2f247a', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el) }, h("span", { key: 'de2a76685d4eba0581c6808e9b08ac3a077c3840', slot: "content" }, h("slot", { key: 'a101c8ccf58d4e1a82e4164bfd1b388b27a28f7d', name: "content" }, h("slot", { key: '5649a672ea4f1602e9a22dddf29861641e5a7c03' }))))));
+        return (h(Host, { key: '50151fd382b63c55c2b424dec466f987d04ac916', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: '0378c9890690a342661bc89f501ad90952ec6250', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el) }, h("span", { key: '12ca9a8bd32c5346dbd56b7885d5770f2c7fb699', slot: "content" }, h("slot", { key: '2cfd4dcb8a7a22783d097aea03d299b470bb904c', name: "content" }, h("slot", { key: '01fc9311d1a9f916d5acb12b7958708ced498242' }))))));
     }
     static get is() { return "gux-tooltip-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-tooltip-pointer-beta/gux-tooltip-pointer.js

@@ -73,7 +73,7 @@ export class GuxTooltipPointer {
         }
     }
     render() {
-        return (h(Host, { key: 'fb000951b9b468e71d44773cb2cf78f25fd1fb34', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: 'dfbeb8488b7e9c18c4a6a9d562bfc759bc7e7441', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el), followMouse: true }, h("span", { key: '1c339b9f6a987e8995b667e80ad1341a5b226f1d', slot: "content" }, h("slot", { key: '5cfe0123dce5e4ed2b9bacf0fc8f9f33539798e8', name: "content" }, h("slot", { key: '02e85502243c4d20b447ef4e192c1b581d8ed1e9' }))))));
+        return (h(Host, { key: 'c86496d311a4534afaaa6cfda427a88166031784', id: this.id, role: this.role }, h("gux-tooltip-base-beta", { key: 'da31182737a8e4eb0d706d5ef19c623d98e8da7a', forElement: this.forElement, placement: this.placement, accent: this.accent, tooltipId: this.id, visualOnly: this.visualOnly, ref: el => (this.baseTooltip = el), followMouse: true }, h("span", { key: '2b59d473043f3b4a1aec814b0514a6eb46798d9c', slot: "content" }, h("slot", { key: '8cf5c44bb75c3ad6c067cfcc63a7c690f54e5003', name: "content" }, h("slot", { key: 'df3bbae316eaa88cce8f2a129c026fa3d4f6090d' }))))));
     }
     static get is() { return "gux-tooltip-pointer-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-action-toast-legacy/gux-action-toast.css

@@ -13,9 +13,9 @@
   width: 270px;
   padding: 20px 24px;
   margin-bottom: 4px;
-  color: #2e394c;
-  background: #f6f7f9;
-  border: 1px solid #b4bccb;
+  color: var(--gse-ui-toast-success-foregroundColor);
+  background: var(--gse-ui-toast-success-backgroundColor);
+  border: 1px solid var(--gse-ui-card-default-border-color);
   border-radius: 4px;
   box-shadow: 0 2px 4px rgba(32, 41, 55, 0.24);
 }
@@ -38,7 +38,7 @@
   flex: 0 1 auto;
   align-self: auto;
   order: 0;
-  color: #1da8b3;
+  color: var(--gse-core-colorLegacy-secondary-aquaGreen);
 }
 .gux-header .gux-icon ::slotted(gux-icon) {
   width: 32px !important;

package/dist/collection/components/legacy/gux-action-toast-legacy/gux-action-toast.js

@@ -12,7 +12,7 @@ export class GuxActionToast {
         trackComponent(this.root);
     }
     render() {
-        return (h(Host, { key: '1a8af93ebf97822103c278b6e1acf302d6fac828' }, h("div", { key: '690645f09dfbbf533a000b8e573a8eea7077eb0f', class: "gux-header" }, h("div", { key: '13d314e118929340e9f229fd4efbdd90342b7778', class: "gux-icon" }, h("slot", { key: 'dac24e0dcb852921e631e7e24ae8b283fb3dc348', name: "icon" })), h("div", { key: 'd0c423a9f94f4cc2c2a0d9e42f28c0350c6eaebe', class: "gux-title" }, h("slot", { key: '4dc1946758a1644e5a8f5f852e93205386f8dc5e', name: "title" }))), h("div", { key: '633d576934edbef111e81a4291c0586a831f8127', class: "gux-message" }, h("slot", { key: '78830fba4de476e503b0bf6774c9453d3b7f589d', name: "message" })), h("div", { key: 'ede5f36a0f0dfcfe3c57563813dcfb88754f9e1c', class: "gux-action-buttons" }, h("div", { key: '6d4c629edce80fe5bb17af72eb20569c92afb8d2', class: "gux-positive-button" }, h("slot", { key: '5d7ba5a7a8700b0258f38631f41a451f9229eea3', name: "positive-button" })), h("div", { key: 'f004a4f6eff0999ace5bd07b5613c7e848f4b0c7', class: "gux-negative-button" }, h("slot", { key: '45311073079442b62fa1580cb14cc4f0b4643cf4', name: "negative-button" })))));
+        return (h(Host, { key: '5d7be20ea53282aef79c15e42517b144b0cbfd5b' }, h("div", { key: 'fbb672040f9b00139370de77842f763d7c444d82', class: "gux-header" }, h("div", { key: '46df3ad076b750f44376e487d233d7be2ef14b01', class: "gux-icon" }, h("slot", { key: 'dc0730150a9af5ad75aad9db5d33bc909c714047', name: "icon" })), h("div", { key: 'd1f9a0c574c16e676eb92645c9e51b597edd886c', class: "gux-title" }, h("slot", { key: '9372dabc098635cc19ad656311f30c62ba1a5565', name: "title" }))), h("div", { key: 'd2ae69071c50cce8e798935738921287a2facd93', class: "gux-message" }, h("slot", { key: 'ab78c36d967882fb610a218578b5e0210ad1f653', name: "message" })), h("div", { key: '60a7954ddd8e6a8df9e7f33b9756cd17a1907e50', class: "gux-action-buttons" }, h("div", { key: 'a046473821a2859c475988b28a20cff06b46d529', class: "gux-positive-button" }, h("slot", { key: '6a1f75aab4d30d5e55e5b9a0a4a5b3d2af879fd1', name: "positive-button" })), h("div", { key: 'd0c0656c38ccaf912c339a232064e01568b53dc5', class: "gux-negative-button" }, h("slot", { key: '82410c00de820177bffa6e7e3ac510792a4e7dd6', name: "negative-button" })))));
     }
     static get is() { return "gux-action-toast-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-advanced-dropdown-legacy/dropdown-option/gux-dropdown-option.js

@@ -50,7 +50,7 @@ export class GuxDropdownOption {
         };
     }
     render() {
-        return (h("div", { key: 'ea20401230e49f6f334230b89aee8d99fa290784', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
+        return (h("div", { key: '03044af917dcef60003e744c13ca4a9071801a97', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
     }
     textWithHighlights() {
         if (!this.highlight || !this.text) {

package/dist/collection/components/legacy/gux-advanced-dropdown-legacy/gux-advanced-dropdown.js

@@ -77,9 +77,9 @@ export class GuxAdvancedDropdownLegacy {
         }
     }
     render() {
-        return (h("gux-popup", { key: '8a78df08f5d2a5b8386ba4e13b04d5d54fb26d1c', expanded: this.opened, disabled: this.disabled }, h("div", { key: '889b4d4fb3682d0182b5ba8994ee99d05506a4d3', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: 'e3904dd5074062c344d133a7c22fd800fd1b6ac4', ref: el => (this.inputBox = el), class: "gux-select-input", "aria-labelledby": this.srLabelledby, tabindex: "0", onKeyDown: e => this.inputKeyDown(e) }, this.placeholder && !this.value && (h("span", { key: 'aac718eb8dad922366872cf0b8a1ef9244ec4ed8', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: '335dbf1e7c953ff1bc547673ca9793c7306d92be', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: 'cbfd4fe3c305dbc37d1ca792a4e06d6509638c7f', class: "gux-icon-wrapper" }, h("gux-icon", { key: 'eafeeb6ecd8240b95b70e5aa9873c6eeb89b7070', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: 'cdc3fbe6adfda50f3770a62becfcbbf56ef4e0fa', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: '9931f00641ecb454c45782ec366534b492cab544', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: '436fbd0b22817c283daeb50b2c0ee403e87972d8', "label-position": "screenreader" }, h("label", { key: '4ee75fc60f1dcb095aea3e45a8506669b0d23d5c', slot: "label" }, this.i18n('searchAria')), h("input", { key: 'f6880d792b6003f236e4779a5329a22521d7b0af', slot: "input", type: "search", onInput: (event) => {
+        return (h("gux-popup", { key: '95c1be2855a91332bc5d21372a0131477aab732a', expanded: this.opened, disabled: this.disabled }, h("div", { key: '44344207156522323c85cae25f75f69582e3ac66', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: '4879396addf0b69cb9143a5fed6c47176b922aba', ref: el => (this.inputBox = el), class: "gux-select-input", "aria-labelledby": this.srLabelledby, tabindex: "0", onKeyDown: e => this.inputKeyDown(e) }, this.placeholder && !this.value && (h("span", { key: '6174d0d76b052185d9e2c610475c86d97fcf4ded', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: 'db7b8ab39631d6de84eb42572e16ba4a332551aa', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: '1f93dc6cb2a8f1b82d92c98f23915f1c2e130209', class: "gux-icon-wrapper" }, h("gux-icon", { key: '004f7992dfeb38aac8253fe515274d294abace25', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: 'fd2720d2a7fe2a8ee1d178a83ae692913761558d', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: '7ddd01095cc126429bbde148197186494b375e54', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: '3bb1b2ec33d55d65880e8dcb748dc624ae486bfa', "label-position": "screenreader" }, h("label", { key: '05e2742e14e503667705fb635ee761ccbac8a4eb', slot: "label" }, this.i18n('searchAria')), h("input", { key: 'bef017748388966f3d7a0793fc31eb9dba739bcc', slot: "input", type: "search", onInput: (event) => {
                 this.handleSearchInput(event);
-            }, ref: el => (this.searchInput = el) })), h("div", { key: 'b917071143ac6304e93a40e2182c488cd7a27cef', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: '760d2632deee46edda74124407e2f0986f056169' }))))));
+            }, ref: el => (this.searchInput = el) })), h("div", { key: '64de7a7e413c48e928ac23014e76a64d332075ae', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: 'e363353c12560a849e706a2b706f990fb9d137df' }))))));
     }
     updateSelectionState() {
         this.selectionOptions = this.getSelectionOptions();

package/dist/collection/components/legacy/gux-disclosure-button-legacy/gux-disclosure-button.js

@@ -46,10 +46,10 @@ export class GuxDisclosureButtonLegacy {
         this.updateIcon();
     }
     render() {
-        return (h("div", { key: 'dfd11315797588b49d1f799786a294842013d48d', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: '164ea67f06014b3b78860e180b633bcb3f63d6d6', class: "gux-disclosure-button", onClick: () => this.changeState(), "aria-controls": this.panelId, "aria-expanded": this.isOpen.toString(), "aria-label": this.label || this.i18n('defaultLabel') }, h("gux-icon", { key: 'a2fefab21c3de43de2c7199753a35bd68b62360e', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '362e1b3910ac360e5bc0e1a8900b82446f447f1f', id: this.panelId, class: {
+        return (h("div", { key: '74373499c508fac1f681b66025e5cc7cf8f4e73e', class: `gux-disclosure-button-container gux-${this.position}` }, h("button", { key: '4e66753e258473269e44e963f3074db68772102a', class: "gux-disclosure-button", onClick: () => this.changeState(), "aria-controls": this.panelId, "aria-expanded": this.isOpen.toString(), "aria-label": this.label || this.i18n('defaultLabel') }, h("gux-icon", { key: '93d6b142731b2e1c4603932f1688e4a4c285a284', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '7e2fb68671c9fe9e9676f0423036a8ea270a5566', id: this.panelId, class: {
                 'gux-disclosure-panel': true,
                 'gux-active': this.isOpen
-            }, role: "region" }, h("slot", { key: '453039d51dbb0e6299ade2aee243acfc0eaffab5', name: "panel-content" }))));
+            }, role: "region" }, h("slot", { key: '28c9f938f407ba9b9895fec535889f6e939d9406', name: "panel-content" }))));
     }
     static get is() { return "gux-disclosure-button-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-modal-legacy/gux-modal-legacy.css

@@ -1,25 +1,3 @@
-/*
-@prop $gse-ui-modal-closeButtonColor // TODO: COMUI-2300 - follow up later when dismiss button has been tokenized
-@prop $gse-ui-modal-headerColor
-@prop $gse-ui-modal-backgroundColor
-@prop $gse-ui-modal-shroudColor
-@prop $gse-ui-modal-header-gap
-@prop $gse-ui-modal-padding
-@prop $gse-ui-modal-gap
-@prop $gse-ui-modal-heading-fontFamily
-@prop $gse-ui-modal-heading-lineHeight
-@prop $gse-ui-modal-heading-fontSize
-@prop $gse-ui-modal-heading-fontWeight
-@prop $gse-ui-modal-heading-letterSpacing
-@prop $gse-ui-modal-icon // TODO: COMUI-2300 - follow up later when dismiss button has been tokenized
-@prop $gse-ui-modal-small-width
-@prop $gse-ui-modal-medium-width
-@prop $gse-ui-modal-large-width
-@prop $gse-ui-modal-buttonBar-gap
-@prop $gse-ui-modal-boxShadow
-@prop $gse-ui-modal-borderRadius
-@prop $gse-ui-modal-opacity - Skipped (this is incoporated into the gse-ui-modal-shroudColor token and is no longer needed. Thinking about asking design team to remove this token to avoid confusion)
-*/
 /*
  * Typography styles and mixins.
  */
@@ -47,7 +25,7 @@ slot[name=left-align-buttons]::slotted(:not(button, gux-button)) {
   display: flex;
   align-items: center;
   justify-content: center;
-  color: #2e394c;
+  color: var(--gse-semantic-foreground-container-highEmphasis);
   background: var(--gse-ui-modal-shroudColor);
 }
 :host .gux-modal .gux-modal-container {
@@ -58,7 +36,7 @@ slot[name=left-align-buttons]::slotted(:not(button, gux-button)) {
   justify-content: space-between;
   padding: var(--gse-ui-modal-padding) 0;
   background: var(--gse-ui-modal-backgroundColor);
-  border: 1px solid #b4bccb;
+  border: 1px solid var(--gse-semantic-border-container-edges-default);
   border-radius: var(--gse-ui-modal-borderRadius);
   box-shadow: var(--gse-ui-modal-boxShadow);
 }

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

@@ -44,10 +44,10 @@ export class GuxModalLegacy {
         const hasModalTitleSlot = this.hasModalTitleSlot();
         const hasFooterButtons = this.hasFooterButtons();
         const titleID = randomHTMLId();
-        return (h("div", { key: '2d18a0bb73e802287f7276f624620318c58cf240', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'f9a6082c0d4472e6cbf484221ed41d287c119683', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '63ce16a375f2d5d374df0efaf65f026333f054f3', class: "gux-modal-header", id: titleID }, h("slot", { key: 'c8c78b89fd771fe39a7bbc513385ee11b7da474e', name: "title" }))), h("gux-dismiss-button", { key: '2b6e4165d02dca606879da5a6dd947dbeef8533c', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: 'b37f23a11378eb9ce1264bd81b79a0726d6eed10', class: {
+        return (h("div", { key: 'b77a732864c86ebcae03af05ae0ef397d4490ed6', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '5a24f48ac7da1f40bd7d84084e4c8226efbafcb9', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '681568d7abf31705c4a7764e1ff22300532b4719', class: "gux-modal-header", id: titleID }, h("slot", { key: '15de5d20625efa25956d73ad7a271f480144404a', name: "title" }))), h("gux-dismiss-button", { key: 'fe03afc6b74e298513ab2d38b24ede83fb9d8e10', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: '6a29fbab6fd5772f2aac70974108361d32b72cd0', class: {
                 'gux-modal-content': true,
                 'gux-no-buttons': !hasFooterButtons
-            } }, h("p", { key: '30f622b062ed43b6fef5e7e2bbf68ac56bf98730' }, h("slot", { key: 'dc09cef7c9d6ec04ea7a3f896e0e7ddf3ed5cac0', name: "content" }))), hasFooterButtons && (h("div", { key: '6f67c283914532196a52369fb1b84cd4e948f462', class: "gux-button-footer" }, h("div", { key: '3299634c7f06b9e41ee607d383df3bb1b2e7c93b', class: "gux-left-align-buttons" }, h("slot", { key: '3890a90f49ab497b9713f5e20086e5adfdb0cc9c', name: "left-align-buttons" })), h("div", { key: '101d214018e9f8da983b074d5aeaa2c81d096912', class: "gux-right-align-buttons" }, h("slot", { key: '9e353e0aad1df37cfeee2bc944285308294a44c2', name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
+            } }, h("p", { key: '19a127ab0f7e22919908a54a9b5024973c6a38c7' }, h("slot", { key: 'bdd59bfa68e9697e0768c81720f030a803cb0e87', name: "content" }))), hasFooterButtons && (h("div", { key: '3e310ebdcadfb4d47d9c97d71f76f12c6faf9fb8', class: "gux-button-footer" }, h("div", { key: 'cc76bed3bacad99b0d41cb053f4849accac87f94', class: "gux-left-align-buttons" }, h("slot", { key: '6b41add8283be84a314a0106836071494ab393b5', name: "left-align-buttons" })), h("div", { key: '18bfaeecfa3e77c2c9fe8759359fd1d51fc048c0', class: "gux-right-align-buttons" }, h("slot", { key: '5cbb524146d92efc70cdfd3ce1efa9c6efb8282e', name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
     }
     // When trap-focus is enabled, focusing this element
     // will immediately redirect focus back to the dismiss button at the top of the modal.

package/dist/collection/components/legacy/gux-notification-toast-legacy/gux-notification-toast.css

@@ -14,10 +14,9 @@
   width: 294px;
   padding: 16px 8px 16px 16px;
   margin-bottom: 4px;
-  color: #2e394c;
-  background: #f6f7f9;
-  border: 1px solid #b4bccb;
-  border-color: #b4bccb;
+  color: var(--gse-ui-toast-success-foregroundColor);
+  background: var(--gse-ui-toast-success-backgroundColor);
+  border: 1px solid var(--gse-ui-card-default-border-color);
   border-radius: 4px;
   box-shadow: 0 2px 4px rgba(32, 41, 55, 0.24);
 }
@@ -33,16 +32,16 @@
   height: 24px !important;
 }
 .gux-icon.gux-alert {
-  color: #ea0b0b;
+  color: var(--gse-ui-toast-error-iconColor);
 }
 .gux-icon.gux-warning {
-  color: #ffae00;
+  color: var(--gse-ui-toast-warning-iconColor);
 }
 .gux-icon.gux-positive {
-  color: #3c8527;
+  color: var(--gse-ui-toast-success-iconColor);
 }
 .gux-icon.gux-neutral {
-  color: #203b73;
+  color: var(--gse-ui-toast-info-iconColor);
 }
 
 .gux-content {
@@ -55,7 +54,7 @@
   align-self: auto;
   order: 0;
   margin: 0 12px 0 8px;
-  color: #2e394c;
+  color: var(--gse-ui-toast-success-foregroundColor);
 }
 .gux-content .gux-title,
 .gux-content .gux-message {

package/dist/collection/components/legacy/gux-notification-toast-legacy/gux-notification-toast.js

@@ -16,7 +16,7 @@ export class GuxNotificationToast {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: '05fb3239ed8a7b3b97cc88b6a613cc8b2669bf6e' }, h("div", { key: 'b5c97740a392fb8bf6dd10dfc17717ba9b236c1f', class: `gux-icon gux-${this.accent}` }, h("slot", { key: 'd8d9b5bdbc05665dee31bd29244870ff07df9078', name: "icon" })), h("div", { key: '2ea8b352598f85ad7747d86b073c96202ae05423', class: "gux-content" }, h("gux-truncate", { key: '780143649c27a9a3df52ba03624923972b20c927', class: "gux-title", "max-lines": 1 }, h("slot", { key: '763979ada598277bd68461c15685570ec37f8f58', name: "title" })), h("gux-truncate", { key: 'a87f67cde3759bcc6fa673580b2e2820ab48ba94', class: "gux-message", "max-lines": 2 }, h("slot", { key: '9c1e1d712dfc9ed9527934474c66b28caf8bb471', name: "message" }))), h("gux-dismiss-button", { key: 'ac4562e6830355aa38569035621936aa7b8bbce2', onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '5915414bcc468b818b63e6c8aad41742ac018559' }, h("div", { key: '9228e8dcdc3d4c3c0b50c97b6a07aa78a4502769', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '29d9f4b32101e12e8de80f1f0b33de887106ef4d', name: "icon" })), h("div", { key: '9f49449d82064ea163b805306c3dcb12f3124296', class: "gux-content" }, h("gux-truncate", { key: 'b45c29a9d5e13f11770ceb831d9509540fd92ec8', class: "gux-title", "max-lines": 1 }, h("slot", { key: 'c37210ec2f9c967d4c549a686057953c5bd529ec', name: "title" })), h("gux-truncate", { key: '62f5ac015e944a799cb5d297e16808589d68d5a1', class: "gux-message", "max-lines": 2 }, h("slot", { key: 'abcb41009c9a30e8c558514e3a9b9be05045af15', name: "message" }))), h("gux-dismiss-button", { key: '2f15c435e27868efea224a01189a52c3b0a8f586', onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination-buttons-legacy/gux-pagination-buttons.js

@@ -69,7 +69,7 @@ export class GuxPaginationButtonsLegacy {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: '94e78129a0eab8031622b92ed8fe5f392a6495b0', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '5c1a04dc93ae0fd25c4f0b1121d633fe9b951b2c', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '6cbc04a2b7e1bfb448894c8895ac3232648e5fc3', accent: "ghost" }, h("button", { key: '7e05c92cd3e4fff399ce9dbbff8e6f97e4c45147', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '6f8f9d39f5124c98221b90b840557f79d1bd206a', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: '36ea45dfcb84f21e0968dd47f11e56296596ade3', accent: "ghost" }, h("button", { key: 'e3f613c72ab8a52b831bd02d8467a446d72fd767', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: 'be79fa6701289fe96cba8dd9c50772159c56de5c', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: '3152b124bf97384c1d0bc4b9412e0c112a4d6812', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '74f2c533370dab51946d1fd639382c57cfb4435c', accent: "ghost" }, h("button", { key: '10765d3f555991bde133be3fade1fba2185bb7cc', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '454302ddb2294af9922116255aa3f60eace8edf0', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: 'f4fc51a9e28351e111813f10b09a7aa5bc04d985', accent: "ghost" }, h("button", { key: '05e9a24f9c28995d8876ee2f76ab351a6e271830', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '718c22f69a257dfa66d7c13256d8dca985cca2d9', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
+        return (h("div", { key: 'e52c1b7f45e53ed347e956686990c7d0b6c0ad60', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: 'a3d0b1e27d98b40f541decbce0b4c08baf4adbba', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: 'd34c3040f79ea7de6dc6c9e99996c5d5884b43de', accent: "ghost" }, h("button", { key: '9e9f38cbfd4fec6bb07638278b02558d96b0510c', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: 'e3c722c240aa275e959285b580c854f3ef927751', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: '979883c625c2b1d45c314206f423816d9538884d', accent: "ghost" }, h("button", { key: '1eed7bc83163a1e3b7a6c73688f620aeb6b5ed88', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: '9e2ba89f56a250f264a870dcbd0a32079604bcb9', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: 'ea10d472aba3fcc9ad748cab6ec5763f25309bdf', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '6331a09206f40d35ce1ab4c73cfd6519ec70b996', accent: "ghost" }, h("button", { key: 'b8611bcd8a78ead2a5a2cf1d9e15911f40e4460f', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '6cf625a3aa3ac6b8b1fa6988ffa1281b2dfd1709', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: '7cb39e734d464bd80a49895763117405b787ed83', accent: "ghost" }, h("button", { key: 'ad79df1004d2ce953688d9111cc69a68e28ed677', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '369fa53f81abd9b1a8d1cb68e4eebad9188dfad5', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
     }
     static get is() { return "gux-pagination-buttons-legacy"; }
     static get originalStyleUrls() {

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination-item-counts-legacy/gux-pagination-item-counts.js

@@ -23,10 +23,10 @@ export class GuxPaginationItemCountsLegacy {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: 'adc625e79d3bc3b2cee319fd36e01a6a7b55e2f0', class: "gux-pagination-item-counts-container" }, h("span", { key: 'ae0af79204b86e5902722892101fa644a8705a18', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
+        return (h("div", { key: '5f1ff31bbacbf183b175f15ff297f615c29587e1', class: "gux-pagination-item-counts-container" }, h("span", { key: '92a48f4e8955038e594abb5fb9517e09c9e4b53b', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
             firstItem: this.firstItem,
             lastItem: this.lastItem
-        })), h("span", { key: '98a27d3f011a9766d9fb69be3b1f47bb45e7a408' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
+        })), h("span", { key: '60e30d9c59896ebb9e3b32e4be40ecae2caeaef5' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
     }
     static get is() { return "gux-pagination-item-counts-legacy"; }
     static get originalStyleUrls() {

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination-items-per-page-legacy/gux-pagination-items-per-page.js

@@ -19,7 +19,7 @@ export class GuxPaginationItemsPerPageLegacy {
             }) }, h("gux-listbox", { "aria-label": this.i18n('itemsPerPage') }, h("gux-option", { value: "25" }, "25"), h("gux-option", { value: "50" }, "50"), h("gux-option", { value: "75" }, "75"), h("gux-option", { value: "100" }, "100"))));
     }
     render() {
-        return (h("div", { key: 'e601a72a600861196a6ef6ccdd5f55f43d6eee03', class: "gux-pagination-items-per-page-container" }, h("div", { key: '907d9f76dc84110cad4d4e52a23b8e675ab36f0f', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: 'ec10de58cb9cfdbb2b75cae02a414cd8e79f924c', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
+        return (h("div", { key: 'd2bf5f6979bb5a55d46da794c086535605f66aab', class: "gux-pagination-items-per-page-container" }, h("div", { key: '27a2eedd7b90ecdc1417bcea6d9408fd60991c2e', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: '0251e86d96c80dc7bc6ce3e1378f115a85ef1a5c', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
     }
     static get is() { return "gux-pagination-items-per-page-legacy"; }
     static get originalStyleUrls() {

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

@@ -69,7 +69,7 @@ export class GuxPaginationLegacy {
         this.currentPage = this.calculateCurrentPage();
     }
     render() {
-        return (h("div", { key: '9fb7768816e0454d90373f6a01ab55569763ec1a', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '24c5f9d3d51777b64071d9ebf14ba61ad930788b', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: '162dd6ade2c6aba07a3810d3ca26908c706cc630', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (h("div", { key: '873a1636c6a2f43692d048a3d51f4a1013a827f8', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: 'b3a8f4a438f284368ce6be78eab4fbc9e5833e7b', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: 'e591bca5a8bbb8d1150ef9405a8c516e1e6576c4', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
     }
     static get is() { return "gux-pagination-legacy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/legacy/gux-simple-toast-legacy/gux-simple-toast.css

@@ -7,9 +7,9 @@
   align-items: flex-start;
   width: 286px;
   margin-bottom: 4px;
-  color: #2e394c;
-  background: #f6f7f9;
-  border: 1px solid #b4bccb;
+  color: var(--gse-ui-toast-success-foregroundColor);
+  background: var(--gse-ui-toast-success-backgroundColor);
+  border: 1px solid var(--gse-ui-card-default-border-color);
   border-radius: 4px;
   box-shadow: 0 2px 4px rgba(32, 41, 55, 0.24);
 }
@@ -22,16 +22,16 @@
   margin: 2px 0;
 }
 .gux-icon.gux-alert {
-  color: #ea0b0b;
+  color: var(--gse-ui-toast-error-iconColor);
 }
 .gux-icon.gux-warning {
-  color: #ffae00;
+  color: var(--gse-ui-toast-warning-iconColor);
 }
 .gux-icon.gux-positive {
-  color: #3c8527;
+  color: var(--gse-ui-toast-success-iconColor);
 }
 .gux-icon.gux-neutral {
-  color: #203b73;
+  color: var(--gse-ui-toast-info-iconColor);
 }
 .gux-icon ::slotted(gux-icon) {
   width: 16px;

package/dist/collection/components/legacy/gux-simple-toast-legacy/gux-simple-toast.js

@@ -15,7 +15,7 @@ export class GuxSimpleToast {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: '157ec729027a3467e254db6b592f81172a462f2e' }, h("div", { key: 'dbf92076c88be8e234b25faa4e6ff582082aa38f', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '7a83c235f3a25668879fb51053b612f863ebb6ab', name: "icon" })), h("gux-truncate", { key: '1f8981a054dae732bd85f3a866d3eb04f1303a91', class: "gux-message", "max-lines": 2 }, h("slot", { key: '29b960000f1e1acf28fa75115ed7f48d719a0580', name: "message" })), h("gux-dismiss-button", { key: '023a768ce4dd6f863e53c8d9de74455de1ca152d', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '740ec16afa50e1673f37312f57430c6e62ae27b3' }, h("div", { key: '68bca6eac3f2436ab80ba0a7d62fd59e3fbc9adb', class: `gux-icon gux-${this.accent}` }, h("slot", { key: 'f748401e86c2183f4d9f3e21198f63fd11258dbd', name: "icon" })), h("gux-truncate", { key: '81a2b7a1ccfadf5a12ee61b34669d8e7d7ea8dfa', class: "gux-message", "max-lines": 2 }, h("slot", { key: '2780ca7c864e3843c22721e1fff37c5f62df956e', name: "message" })), h("gux-dismiss-button", { key: '515d2f5d6b96300ea43acc538284f8c3d7f3aefb', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();

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

@@ -10,7 +10,7 @@ gux-switch-item > .gux-switch-item {
   line-height: var(--gse-semantic-body-sm-regular-lineHeight);
   font-weight: var(--gse-semantic-body-sm-regular-fontWeight);
   font: unset;
-  color: #2e394c;
+  color: var(--gse-semantic-foreground-container-highEmphasis);
   text-align: center;
   outline: none;
   background: none;
@@ -32,14 +32,14 @@ gux-switch-item.gux-selected {
 
 gux-switch-legacy > gux-switch-item .gux-switch-item {
   padding: 0 8px 4px;
-  border-bottom: 1px solid #e2e6ee;
+  border-bottom: 1px solid var(--gse-ui-segmentedControl-button-active-backgroundColor);
 }
 gux-switch-legacy > gux-switch-item .gux-switch-item:focus-visible, gux-switch-legacy > gux-switch-item .gux-switch-item:hover {
   padding: 0 8px 1px;
-  border-bottom: 4px solid #2a60c8;
+  border-bottom: 4px solid var(--gse-ui-segmentedControl-button-default-foregroundColor);
 }
 gux-switch-legacy > gux-switch-item .gux-switch-item:focus-visible > gux-icon svg, gux-switch-legacy > gux-switch-item .gux-switch-item:hover > gux-icon svg {
-  fill: #2e394c;
+  fill: var(--gse-ui-segmentedControl-button-disabled-foregroundColor);
 }
 gux-switch-legacy > gux-switch-item .gux-switch-item:focus-visible {
   outline: var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);
@@ -52,10 +52,10 @@ gux-switch-legacy > gux-switch-item .gux-switch-item > gux-icon {
 }
 gux-switch-legacy > gux-switch-item.gux-selected .gux-switch-item {
   padding: 0 8px 1px;
-  border-bottom: 4px solid #2a60c8;
+  border-bottom: 4px solid var(--gse-ui-segmentedControl-button-default-foregroundColor);
 }
 gux-switch-legacy > gux-switch-item.gux-selected .gux-switch-item > gux-icon svg {
-  fill: #2e394c;
+  fill: var(--gse-ui-segmentedControl-button-disabled-foregroundColor);
 }
 gux-switch-legacy.gux-small > gux-switch-item .gux-switch-item {
   font-family: var(--gse-semantic-body-sm-regular-fontFamily), var(--gse-semantic-theme-fontFamily-body), sans-serif;
@@ -63,15 +63,15 @@ gux-switch-legacy.gux-small > gux-switch-item .gux-switch-item {
   line-height: var(--gse-semantic-body-sm-regular-lineHeight);
   font-weight: var(--gse-semantic-body-sm-regular-fontWeight);
   padding: 0 4px;
-  border-bottom: 1px solid #e2e6ee;
+  border-bottom: 1px solid var(--gse-ui-segmentedControl-button-active-backgroundColor);
 }
 gux-switch-legacy.gux-small > gux-switch-item .gux-switch-item:focus-visible, gux-switch-legacy.gux-small > gux-switch-item .gux-switch-item:hover {
-  border-bottom-color: #2e394c;
+  border-bottom-color: var(--gse-ui-segmentedControl-button-disabled-foregroundColor);
 }
 gux-switch-legacy.gux-small > gux-switch-item .gux-switch-item > gux-icon {
   width: 24px;
   height: 24px;
 }
 gux-switch-legacy.gux-small > gux-switch-item.gux-selected .gux-switch-item {
-  border-bottom-color: #2e394c;
+  border-bottom-color: var(--gse-ui-segmentedControl-button-disabled-foregroundColor);
 }

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: '427c0acdb3ea194da69f2e0f3734756dc8d25b31', class: { 'gux-selected': this.selected } }, h("button", { key: '20e6b544fc6b8debdaff1fce9fd0182401e4e0e7', type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: 'e06695181ca1640f0abc4ec29bd2a19ceffb5a34' }))));
+        return (h(Host, { key: 'f2e3b36853c947ecbbb9770c8e4e8c960028dfc5', class: { 'gux-selected': this.selected } }, h("button", { key: '0081c88cdd890723bca9e2bd46f047ea0ba144da', type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: 'a45f6bd0a68bd3cc2c38a445e2ba65fca4165e7e' }))));
     }
     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: 'b6e6abc91f2e90ba0951b8172abb7593706a1fbb', role: "group", class: `gux-${this.layout}` }, h("slot", { key: '6c670755228b8e27a10572ccf2c6e93b3d2ef376', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: '557be79a6860f47c913ecd8dbaabf93730954cb5', role: "group", class: `gux-${this.layout}` }, h("slot", { key: 'd1c9c9756cfde1894f2587f8114597fd36eca57d', 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

@@ -49,20 +49,20 @@ export class GuxAccordionSection {
         this.hasIconSlot = !!this.root.querySelector('[slot="icon"]');
     }
     render() {
-        return (h("section", { key: 'ce5c3ef6c5448adf33050a6687089fd607b97df7', class: { 'gux-disabled': this.disabled } }, h("div", { key: 'e662a0706a4abf91100b9ea1a3a6a5f8805021bd', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: 'f946ebdff40de428bbafef3b668ee515bba8afa0', class: {
+        return (h("section", { key: 'df275d28827d27a2dfd85bbca6cab36b5cfd3d63', class: { 'gux-disabled': this.disabled } }, h("div", { key: '9d23d4e724b712cbcd281a1c7cce74a669850330', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: '74afd507dff82dcaf347270fb3b7fef847df1f74', 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: '5960cf6f0c5165d5c455d1d1ca6aa821cf9399ad', name: "icon" }), h("div", { key: 'b9cfa0077b93654ff2b06a3830f4f3aa46dd9214', 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: 'ae1a0a58e93dbc94a133ba624c3a022ca1735c7e', name: "icon" }), h("div", { key: '4e9c8a843543fb5f63cb0882caca8ad86edcc07e', class: {
                 'gux-header-text': true
-            } }, h("slot", { key: '327f8c42f2e2794aa82eaccf6fbb0e1ebd04038a', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: 'cf24272a420fa450f6c8242dd5788eac6587330f', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: 'cd9960bb642cc498fa6da71a3e5a3ce1c7ca0fdb', class: {
+            } }, h("slot", { key: 'dfed8375498b718194ab392c7273040ca1e07111', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: '0d3b2087b2187c7ddf45399c4cc543a4237fb989', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: '7dd15e932c213d57a82ae1206aacf221b6bdb2c1', class: {
                 'gux-header-icon': true,
                 'gux-expanded': this.open,
                 'gux-arrow-position-start': this.isArrowPositionBeforeText()
-            } }, h("gux-icon", { key: 'c847512d1d91ff560ec29e6ce9b50e17338a245b', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'f4af00d7986a782818fb529ae9ac81fedbc45f39', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
+            } }, h("gux-icon", { key: '4d949354cb136f1fcb969ccc9840c46461122767', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: '0c06072e5529fc17bd0b5e742ffcaf9391282cc3', 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: '172b7ea909f11aca0e750b947b529cdf3aaab03d', name: "content" }))));
+            } }, h("slot", { key: '483d098a1b55d7da7c720962e18045861d0da6b3', 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: '54960a3042d80ad89763aeb11de0a4d24d31c601' }));
+        return (h("slot", { key: '3fc634094a56cee760224ebe2d6bae760438888b' }));
     }
     static get is() { return "gux-accordion"; }
     static get encapsulation() { return "shadow"; }

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

@@ -126,7 +126,7 @@ export class GuxActionButton {
         this.i18n = await buildI18nForComponent(this.root, defaultResources);
     }
     render() {
-        return (h("div", { key: '50cf831534e858389d9e3b774ad16c0ab4b4c571', class: "gux-action-button-container" }, h("gux-popup", { key: '40a6bb65b7a1235379860a046d400059e3241d28', expanded: this.isOpen, disabled: this.disabled, placement: "bottom-end", "exceed-target-width": true }, h("div", { key: 'b270539feaad9724c945581a385f07ba68adea9d', slot: "target", class: "gux-action-button-container" }, h("gux-button-slot", { key: '3d9a30bc5309fb2284afb852a38f7ad11d1a6f57', class: "gux-action-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: 'dcdcdd9709f8d7002591f30960547ad0807a6034', type: this.type, disabled: this.disabled, onClick: () => this.onActionClick() }, h("slot", { key: '5597dcb9272f9eab43c2eec65dbbb9a142004c4f', name: "title" }))), h("gux-button-slot", { key: '9247c184a6abfe6189760af1d2c8d8e4b81cc1c7', class: "gux-dropdown-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '3ab5c881fd17e7d169dfb19c0c1bea47eb59fd20', 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') }, h("gux-icon", { key: 'f1ff1d4ef13116ff9c44c02429c7269a9dc2a560', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: '00202d10162366d36ab62094e23004d92932dff6', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: 'd00fc9301c4873bd0beeb82e801353e41f7f1f4d', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: 'fc5d22640bdb59504637f352f73c353184e4b508' }))))));
+        return (h("div", { key: '7633255e916dadb6e24229a0ef559ea3428f9a47', class: "gux-action-button-container" }, h("gux-popup", { key: 'b458ecea7ea0d89b13cd291af0fd25377d9fa0c0', expanded: this.isOpen, disabled: this.disabled, placement: "bottom-end", "exceed-target-width": true }, h("div", { key: '414e7dc5173548b76af86b89b1bef794594e2d35', slot: "target", class: "gux-action-button-container" }, h("gux-button-slot", { key: 'c02b2c61bf8cdb4a19e971dd3e82bf36fa905ee6', class: "gux-action-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: '3108ca30cea4691b20a737285082712e4f17646f', type: this.type, disabled: this.disabled, onClick: () => this.onActionClick() }, h("slot", { key: 'afc6c2a8e15aed25d3d89b3d039a75df31e95205', name: "title" }))), h("gux-button-slot", { key: 'afab832bb050d69d1a81a10f4eff450203e432f6', class: "gux-dropdown-button", accent: getGuxActionButtonAccent(this.accent) }, h("button", { key: 'a4ba7ab4edc377020cdb2ba45bb955b76c68f648', 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') }, h("gux-icon", { key: '8cbc807c178ff77489fb9ce69882875edf206dcd', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: '5a64c0e7a02e4ead6ce1d2f6c4f34968f06187d9', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: '3e5610e97b431d515683b3f0d7170c42efc4550b', onClick: (e) => this.onListClick(e), ref: el => (this.listElement = el) }, h("slot", { key: '4ef52f6ee1d003738bb48bea67cc50a2ff7861fc' }))))));
     }
     static get is() { return "gux-action-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -38,7 +38,7 @@ export class GuxBadge {
         this.i18n = await buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (h("div", { key: 'a0147cb1c5476bdf158e8e0782a2f88825e80fa8', class: {
+        return (h("div", { key: '1c01e576cfd7ae983f41d36a11ec812943325ee8', 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: '05e63d1b90bf4a4edcdc577d73f19197a3ec300e', class: "gux-container" }, h("div", { key: '2a5551a003107fc25174d782f4e26a9844b1c4a7', class: "gux-image" }, h("slot", { key: '40fdd277e803b9ad62f489ded7b28fbb1837675b', name: "image" })), h("div", { key: '3346d51cbbb9e93b63cebc3dad447ed15e8791e3', class: "gux-message" }, h("slot", { key: '287c8b98b465184ee4d26529eedabd8f519f5dc7', name: "primary-message" })), this.renderGuidanceSlot(), this.renderCallToActionSlot()));
+        return (h("div", { key: '5ffdd793f53a20b51f0794c1d70507982768e422', class: "gux-container" }, h("div", { key: '5b715204b1b30ad49d463f3d1ec2135f5699bdca', class: "gux-image" }, h("slot", { key: '7bdcb039b23164870c12bf410fe39588bc4ccb5f', name: "image" })), h("div", { key: '67ef7c194d110ad7d510dd4ec66891b52848268e', class: "gux-message" }, h("slot", { key: 'b0cb2f244e686ebfc7dc9cb33c31bce1d9430135', 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: '1b4c4d01765ac195dbde19d6ff3044caca8acb48', role: "listitem" }, h("span", { key: 'c436f1b6d29355b6e5f9069a9041640654189871', class: `gux-breadcrumb-generation gux-${accent}` }, this.getBreadcrumb(accent), this.getSeparatorIcon())));
+        return (h(Host, { key: '391ed04d9fbe5e213eabd7934300dc55ee5a13ca', role: "listitem" }, h("span", { key: '83977c45fc002424bba01b09e43580db049c861b', 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: 'acf6c84d719c43df03381127ef2fa2367906ed79', "aria-label": this.i18n('breadcrumbs') }, h("ol", { key: '4dfbc4c462d69aa146e2282523293fe44d427217' }, h("slot", { key: '0f5f128f1a3766d67498c4db2321132fc24d9c7c', onSlotchange: this.onSlotChange.bind(this) }))));
+        return (h("nav", { key: '443d281294de9a339349a2c8876536f29a5b06cf', "aria-label": this.i18n('breadcrumbs') }, h("ol", { key: 'f6465c7842cbcc1d1253a94615af68c8bbfbbb15' }, h("slot", { key: 'd9536148e45d3804c5d25dabe16977161700e413', 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: 'af9b0ffd83f3edc54e4afa3f3df05398260c1e5a', id: this.buttonId, type: this.type, disabled: this.disabled, class: {
+            h("button", { key: '0affca8740033516c6999453f8911af97b74ac6b', 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: '32e4cf12b85ad738529600bd1878a6f3ee33c04a', onSlotchange: this.slotChanged.bind(this) })),
+                }, "aria-label": this.guxTitle, autofocus: this.autofocus }, h("slot", { key: '35600b8801921ec77c9bd5e7728f0b457188ab65', onSlotchange: this.slotChanged.bind(this) })),
             this.renderTooltip()
         ];
     }