genesys-spark-components 4.0.0-beta.49 → 4.0.0-beta.50

package/dist/cjs/gux-tabs.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 
 const guxTabsCss = ":host{display:flex;flex-direction:column}:host .gux-tabs{display:flex;height:100%}:host .gux-tabs:not(.gux-vertical){flex-direction:column}:host .gux-panel-container{display:flex;flex-direction:column;height:100%}";
 

package/dist/cjs/gux-tag.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
 const index$1 = require('./index-788d733b.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 require('./get-closest-element-26894e5a.js');
 
 const tag = "tag with label: {label}";

package/dist/cjs/gux-text-highlight.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 
 const conversion = /[ +]/g;
 const expressions = new Map();
@@ -47,7 +47,7 @@ function convertToRegex(word) {
   return new RegExp(newexp + '$', 'i');
 }
 
-const guxTextHighlightCss = "span{color:var(--gse-ui-formControl-input-populatedColor)}span mark{background-color:var(--gse-ui-search-match-firstLevel-backgroundColor)}.gux-dimmed mark{background-color:var(--gse-ui-search-match-subsequentLevel-backgroundColor)}";
+const guxTextHighlightCss = "span{color:var(--gse-ui-search-match-firstLevel-foregroundColour)}span mark{background-color:var(--gse-ui-search-match-firstLevel-backgroundColor)}.gux-dimmed mark{background-color:var(--gse-ui-search-match-subsequentLevel-backgroundColor)}";
 
 const GuxTextHighlight = class {
   constructor(hostRef) {

package/dist/cjs/gux-time-beta.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 const getValidTimezone = require('./get-valid-timezone-7bb7bdc6.js');
 const index$1 = require('./index-788d733b.js');
 require('./get-closest-element-26894e5a.js');

package/dist/cjs/gux-time-picker.cjs.entry.js

@@ -7,7 +7,7 @@ const onClickOutside = require('./on-click-outside-3c0f8816.js');
 const simulateNativeEvent = require('./simulate-native-event-8209a457.js');
 const afterNextRender = require('./after-next-render-a023ef47.js');
 const index = require('./index-788d733b.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 require('./get-closest-element-26894e5a.js');
 
 const am = "AM";

package/dist/cjs/gux-time-zone-picker-beta.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
 const index$1 = require('./index-788d733b.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 const simulateNativeEvent = require('./simulate-native-event-8209a457.js');
 require('./get-closest-element-26894e5a.js');
 

package/dist/cjs/gux-toast.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 const hasSlot = require('./has-slot-429f8b9e.js');
 
 const guxToastCss = ".gux-toast{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-toast-gap);align-content:stretch;align-items:flex-start;justify-content:flex-start;width:var(--gse-ui-toast-wrappingWidth);padding:var(--gse-ui-toast-margin);margin-bottom:var(--gse-ui-toast-stacking-gap);border-radius:var(--gse-ui-toast-borderRadius);box-shadow:var(--gse-ui-toast-boxShadow-x) var(--gse-ui-toast-boxShadow-y) var(--gse-ui-toast-boxShadow-blur) var(--gse-ui-toast-boxShadow-spread) var(--gse-ui-toast-boxShadow-color)}.gux-toast .gux-icon ::slotted(gux-icon){width:var(--gse-ui-toast-icon) !important;height:var(--gse-ui-toast-icon) !important}.gux-toast .gux-icon gux-icon{width:var(--gse-ui-toast-icon) !important;height:var(--gse-ui-toast-icon) !important}.gux-toast .gux-icon.gux-icon-error{color:var(--gse-ui-toast-error-iconColor)}.gux-toast .gux-icon.gux-icon-warning{color:var(--gse-ui-toast-warning-iconColor)}.gux-toast .gux-icon.gux-icon-success{color:var(--gse-ui-toast-success-iconColor)}.gux-toast .gux-icon.gux-icon-info{color:var(--gse-ui-toast-info-iconColor)}.gux-toast .gux-icon.gux-icon-action{color:var(--gse-ui-toast-action-iconColor)}.gux-toast .gux-content{display:flex;flex:1 1 auto;flex-direction:column;flex-wrap:nowrap;gap:var(--gse-ui-toast-gapButton);align-content:stretch;align-items:flex-start;align-self:auto;justify-content:flex-start;order:0}.gux-toast .gux-content .gux-message{display:flex;flex-direction:column;gap:var(--gse-ui-toast-gapText)}.gux-toast .gux-content .gux-message .gux-message-title{font-family:var(--gse-ui-toast-heading-fontFamily);font-size:var(--gse-ui-toast-heading-fontSize);font-weight:var(--gse-ui-toast-heading-fontWeight);line-height:var(--gse-ui-toast-heading-lineHeight)}.gux-toast .gux-content .gux-message .gux-message-body{font-family:var(--gse-ui-toast-text-fontFamily);font-size:var(--gse-ui-toast-text-fontSize);line-height:var(--gse-ui-toast-text-lineHeight)}.gux-toast .gux-content .gux-buttons-bar{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-toast-buttonBar-gap);justify-content:flex-start}.gux-toast.gux-toast-success{background-color:var(--gse-ui-toast-success-backgroundColor)}.gux-toast.gux-toast-success .gux-message{color:var(--gse-ui-toast-success-foregroundColor)}.gux-toast.gux-toast-warning{background-color:var(--gse-ui-toast-warning-backgroundColor)}.gux-toast.gux-toast-warning .gux-message{color:var(--gse-ui-toast-warning-foregroundColor)}.gux-toast.gux-toast-error{background-color:var(--gse-ui-toast-error-backgroundColor)}.gux-toast.gux-toast-error .gux-message{color:var(--gse-ui-toast-error-foregroundColor)}.gux-toast.gux-toast-info{background-color:var(--gse-ui-toast-info-backgroundColor)}.gux-toast.gux-toast-info .gux-message{color:var(--gse-ui-toast-info-foregroundColor)}.gux-toast.gux-toast-action{background-color:var(--gse-ui-toast-action-backgroundColor)}.gux-toast.gux-toast-action .gux-message{color:var(--gse-ui-toast-action-foregroundColor)}";

package/dist/cjs/gux-toggle.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-75c9f0d9.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 const randomHtmlId = require('./random-html-id-32ef8847.js');
 const index$1 = require('./index-788d733b.js');
 require('./get-closest-element-26894e5a.js');

package/dist/cjs/gux-tooltip.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-75c9f0d9.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-cae393e0.js');
 const randomHtmlId = require('./random-html-id-32ef8847.js');
-const usage = require('./usage-79278f52.js');
+const usage = require('./usage-b880ed82.js');
 const findElementById = require('./find-element-by-id-9c3e0b1b.js');
 const afterNextRender = require('./after-next-render-a023ef47.js');
 

package/dist/cjs/{usage-79278f52.js → usage-b880ed82.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const name = "genesys-spark-components";
-const version = "4.0.0-beta.49";
+const version = "4.0.0-beta.50";
 const description = "Common webcomponents";
 const license = "MIT";
 const main = "dist/stencil-wrapper.js";

package/dist/collection/components/beta/gux-phone-input/tests/gux-phone-input.e2e.js

@@ -45,6 +45,9 @@ describe('gux-phone-input', () => {
     expect(dropdownButton.getAttribute('aria-expanded')).toBe('true');
     await page.waitForChanges();
     await a11yCheck(page);
+    // First arrow down focuses the currently selected option
+    await page.keyboard.press('ArrowDown');
+    // Second arrow down to move the selection down one
     await page.keyboard.press('ArrowDown');
     await page.keyboard.press('Enter');
     await page.waitForChanges();
@@ -66,6 +69,9 @@ describe('gux-phone-input', () => {
     expect(dropdownButton.getAttribute('aria-expanded')).toBe('true');
     await page.waitForChanges();
     await a11yCheck(page);
+    // First arrow down focuses the currently selected option
+    await page.keyboard.press('ArrowDown');
+    // Second arrow down to move the selection down one
     await page.keyboard.press('ArrowDown');
     await page.keyboard.press('Enter');
     await page.waitForChanges();

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

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 :host {
   display: flex;
   flex-direction: column;
@@ -33,10 +31,10 @@
   align-self: auto;
   justify-content: flex-start;
   order: 0;
-  font-family: var(--gse-core-fontFamily-heading), var(--gse-core-fontFamily-body), sans-serif;
-  font-size: var(--gse-core-fontSize-lg);
-  font-weight: var(--gse-core-fontWeight-semiBold);
-  line-height: var(--gse-lineHeight-md);
+  font-family: var(--gse-core-typography-heading-lg-fontFamily), var(--gse-core-fontFamily-heading), sans-serif;
+  font-size: var(--gse-core-typography-heading-lg-fontSize);
+  line-height: var(--gse-core-typography-heading-lg-lineHeight);
+  font-weight: var(--gse-core-fontWeight-bold);
 }
 .gux-header .gux-icon {
   flex: 0 1 auto;
@@ -60,10 +58,10 @@
   align-self: auto;
   order: 0;
   margin: 16px 0;
-  font-family: var(--gse-core-fontFamily-body), sans-serif;
+  font-family: var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;
+  font-size: var(--gse-core-typography-body-sm-fontSize);
+  line-height: var(--gse-core-typography-body-sm-lineHeight);
   font-weight: var(--gse-core-fontWeight-regular);
-  font-size: var(--gse-core-fontSize-xs);
-  line-height: var(--gse-core-lineHeight-xs);
 }
 .gux-message ::slotted(dl) {
   display: flex;

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

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 /*
 @prop $gse-ui-modal-closeButtonColor // TODO: COMUI-2300 - follow up later when dismiss button has been tokenized
 @prop $gse-ui-modal-headerColor
@@ -96,10 +94,10 @@ slot[name=left-align-buttons]::slotted(:not(button, gux-button)) {
   line-height: var(--gse-ui-modal-heading-fontFamily);
   color: var(--gse-ui-modal-headerColor);
   letter-spacing: var(--gse-ui-modal-heading-letterSpacing);
-  font-family: var(--gse-core-fontFamily-heading), var(--gse-core-fontFamily-body), sans-serif;
-  font-size: var(--gse-core-fontSize-xl);
+  font-family: var(--gse-core-typography-heading-xl-fontFamily), var(--gse-core-fontFamily-heading), sans-serif;
+  font-size: var(--gse-core-typography-heading-xl-fontSize);
+  line-height: var(--gse-core-typography-heading-xl-lineHeight);
   font-weight: var(--gse-core-fontWeight-bold);
-  line-height: var(--gse-core-lineHeight-xl);
 }
 :host .gux-modal .gux-modal-container .gux-modal-content {
   max-height: 432px;

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

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 :host {
   position: relative;
   display: flex;
@@ -68,8 +66,8 @@
   order: 0;
 }
 .gux-content .gux-title {
-  font-family: var(--gse-core-fontFamily-heading), var(--gse-core-fontFamily-body), sans-serif;
-  font-size: var(--gse-core-fontSize-sm);
-  font-weight: var(--gse-core-fontWeight-semiBold);
-  line-height: var(--gse-core-lineHeight-sm);
+  font-family: var(--gse-core-typography-heading-sm-fontFamily), var(--gse-core-fontFamily-heading), sans-serif;
+  font-size: var(--gse-core-typography-heading-sm-fontSize);
+  line-height: var(--gse-core-typography-heading-sm-lineHeight);
+  font-weight: var(--gse-core-fontWeight-bold);
 }

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

@@ -1,16 +1,14 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 gux-switch-item > .gux-switch-item {
-  font-family: var(--gse-core-fontFamily-body), sans-serif;
+  font-family: var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;
+  font-size: var(--gse-core-typography-body-sm-fontSize);
+  line-height: var(--gse-core-typography-body-sm-lineHeight);
   font-weight: var(--gse-core-fontWeight-regular);
-  font-size: var(--gse-core-fontSize-xs);
-  line-height: var(--gse-core-lineHeight-xs);
   font: unset;
   color: #2e394c;
   text-align: center;
@@ -26,7 +24,9 @@ gux-switch-item[disabled] {
   opacity: 0.5;
 }
 gux-switch-item.gux-selected {
-  font-family: var(--gse-core-fontFamily-body), sans-serif;
+  font-family: var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;
+  font-size: var(--gse-core-typography-body-sm-fontSize);
+  line-height: var(--gse-core-typography-body-sm-lineHeight);
   font-weight: var(--gse-core-fontWeight-bold);
 }
 
@@ -54,10 +54,10 @@ gux-switch-legacy > gux-switch-item.gux-selected .gux-switch-item > gux-icon svg
   fill: #2e394c;
 }
 gux-switch-legacy.gux-small > gux-switch-item .gux-switch-item {
-  font-family: var(--gse-core-fontFamily-body), sans-serif;
+  font-family: var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;
+  font-size: var(--gse-core-typography-body-sm-fontSize);
+  line-height: var(--gse-core-typography-body-sm-lineHeight);
   font-weight: var(--gse-core-fontWeight-regular);
-  font-size: var(--gse-core-fontSize-xs);
-  line-height: var(--gse-core-lineHeight-xs);
   padding: 0 4px;
   border-bottom: 1px solid #e2e6ee;
 }

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

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

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

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

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

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-phone/gux-form-field-phone.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 .gux-form-field-fieldset-container {

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-range/gux-form-field-range.css

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */ /* Tokens
@@ -139,6 +137,7 @@
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
+  gap: var(--gse-ui-slider-gap);
   align-content: stretch;
   align-items: center;
   justify-content: flex-start;
@@ -162,10 +161,12 @@
   height: var(--gse-ui-slider-bar-height);
   margin: 6px 0;
   background: var(--gse-ui-slider-bar-default-backgroundColor);
+  border-radius: 20px;
 }
 .gux-input-and-error-container .gux-range-input-container .gux-range .gux-track .gux-progress {
   height: var(--gse-ui-slider-bar-height);
   background-color: var(--gse-ui-slider-bar-selected-backgroundColor);
+  border-radius: 20px;
 }
 .gux-input-and-error-container .gux-range-input-container .gux-display {
   flex: 0 1 auto;
@@ -192,10 +193,10 @@
   display: none;
 }
 .gux-input-and-error-container .gux-range-tooltip-container .gux-range-tooltip {
-  font-family: var(--gse-core-fontFamily-body), sans-serif;
+  font-family: var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;
+  font-size: var(--gse-core-typography-body-sm-fontSize);
+  line-height: var(--gse-core-typography-body-sm-lineHeight);
   font-weight: var(--gse-core-fontWeight-regular);
-  font-size: var(--gse-core-fontSize-xs);
-  line-height: var(--gse-core-lineHeight-xs);
   position: absolute;
   z-index: var(--gux-zindex-tooltip, 1);
   display: flex;

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-search/gux-form-field-search.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-select/gux-form-field-select.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-text-like/gux-form-field-text-like.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-textarea/gux-form-field-textarea.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-time-picker/gux-form-field-time-picker.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-time-zone-picker/gux-form-field-time-zone-picker.css

@@ -1,11 +1,3 @@
-/*
- * Typography styles and mixins.
- */
-/* Helpers */
-/* Base typography */
-/* Headings */
-/* Anchor */
-/* Custom Styles */
 /* stylelint-disable-next-line selector-class-pattern */ /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */
 /* stylelint-disable-next-line selector-class-pattern */

package/dist/collection/components/stable/gux-form-field/helper-components/gux-form-field-input-clear-button/gux-form-field-input-clear-button.css

@@ -1,7 +1,5 @@
 button {
-  flex: 0 1 auto;
-  align-self: auto;
-  order: 0;
+  padding: 0;
   color: var(--gse-ui-formControl-input-inputIcon-defaultColor);
   background: transparent;
   border: none;

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

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 ::slotted(button:active:enabled) {
   color: var(--gse-ui-link-active-foregroundColor);
   text-decoration: underline;
@@ -62,10 +60,10 @@ slot[name=start-align-buttons]::slotted(:not(button, gux-button-slot)) {
   line-height: var(--gse-ui-modal-heading-fontFamily);
   color: var(--gse-ui-modal-headerColor);
   letter-spacing: var(--gse-ui-modal-heading-letterSpacing);
-  font-family: var(--gse-core-fontFamily-heading), var(--gse-core-fontFamily-body), sans-serif;
-  font-size: var(--gse-core-fontSize-xl);
+  font-family: var(--gse-core-typography-heading-xl-fontFamily), var(--gse-core-fontFamily-heading), sans-serif;
+  font-size: var(--gse-core-typography-heading-xl-fontSize);
+  line-height: var(--gse-core-typography-heading-xl-lineHeight);
   font-weight: var(--gse-core-fontWeight-bold);
-  line-height: var(--gse-core-lineHeight-xl);
 }
 :host dialog .gux-modal-container .gux-modal-content {
   max-height: 432px;

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

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 :host {
   display: block;
   isolation: isolate;
@@ -30,8 +28,8 @@
   height: calc(100% - var(--gse-ui-dataTableItems-header-default-height));
   color: #596373;
   background: #fdfdfd;
-  font-family: var(--gse-core-fontFamily-heading), var(--gse-core-fontFamily-body), sans-serif;
-  font-size: var(--gse-core-fontSize-lg);
-  font-weight: var(--gse-core-fontWeight-semiBold);
-  line-height: var(--gse-lineHeight-md);
+  font-family: var(--gse-core-typography-heading-lg-fontFamily), var(--gse-core-fontFamily-heading), sans-serif;
+  font-size: var(--gse-core-typography-heading-lg-fontSize);
+  line-height: var(--gse-core-typography-heading-lg-lineHeight);
+  font-weight: var(--gse-core-fontWeight-bold);
 }

package/dist/collection/components/stable/gux-tabs-advanced/gux-tab-advanced-list/gux-tab-advanced-list.css

@@ -1,11 +1,9 @@
 /*
  * Typography styles and mixins.
  */
-/* Helpers */
-/* Base typography */
 /* Headings */
+/* Body Copy */
 /* Anchor */
-/* Custom Styles */
 gux-tab-advanced-list .gux-tab-container {
   display: flex;
   align-items: flex-end;
@@ -38,7 +36,9 @@ gux-tab-advanced-list .gux-tab-container .action-button-container .add-tab-butto
   align-items: center;
   padding: 0 12px;
   white-space: nowrap;
-  font-family: var(--gse-core-fontFamily-body), sans-serif;
+  font-family: var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;
+  font-size: var(--gse-core-typography-body-sm-fontSize);
+  line-height: var(--gse-core-typography-body-sm-lineHeight);
   font-weight: var(--gse-core-fontWeight-bold);
 }
 gux-tab-advanced-list .gux-tab-container .action-button-container .add-tab-button [slot=add-tab] gux-icon {

package/dist/collection/components/stable/gux-text-highlight/gux-text-highlight.css

@@ -1,5 +1,5 @@
 span {
-  color: var(--gse-ui-formControl-input-populatedColor);
+  color: var(--gse-ui-search-match-firstLevel-foregroundColour);
 }
 span mark {
   background-color: var(--gse-ui-search-match-firstLevel-backgroundColor);

package/dist/deploy-info.json

@@ -1,9 +1,9 @@
 {
   "name": "spark-components",
-  "version": "4.0.0-beta.49",
+  "version": "4.0.0-beta.50",
   "ecosystem": "pc",
   "team": "Core UI",
   "indexFiles": [],
-  "build": "72",
-  "buildDate": "2023-10-26T04:11:46.999844Z"
+  "build": "73",
+  "buildDate": "2023-10-27T04:19:05.769306Z"
 }

package/dist/esm/gux-accordion.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-39e65a0a.js';
-import { t as trackComponent } from './usage-2b074807.js';
+import { t as trackComponent } from './usage-0630a584.js';
 
 const guxAccordionCss = "gux-accordion{-custom-noop:noop}";
 

package/dist/esm/gux-action-button.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, g as getElement } from './i
 import { O as OnClickOutside } from './on-click-outside-f15c5ac7.js';
 import { w as whenEventIsFrom } from './when-event-is-from-6154bd60.js';
 import { a as afterNextRenderTimeout } from './after-next-render-84ec18ad.js';
-import { t as trackComponent } from './usage-2b074807.js';
+import { t as trackComponent } from './usage-0630a584.js';
 import { b as buildI18nForComponent } from './index-df729b6a.js';
 import './get-closest-element-66f63212.js';
 

package/dist/esm/gux-action-toast-legacy.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-39e65a0a.js';
-import { t as trackComponent } from './usage-2b074807.js';
+import { t as trackComponent } from './usage-0630a584.js';
 
-const guxActionToastCss = ":host{display:flex;flex-direction:column;flex-wrap:nowrap;align-content:stretch;align-items:stretch;justify-content:flex-start;width:270px;padding:20px 24px;margin-bottom:4px;color:#2e394c;background:#f6f7f9;border:1px solid #b4bccb;border-radius:4px;box-shadow:0 2px 4px rgba(32, 41, 55, 0.24)}.gux-header{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:center;align-self:auto;justify-content:flex-start;order:0;font-family:var(--gse-core-fontFamily-heading), var(--gse-core-fontFamily-body), sans-serif;font-size:var(--gse-core-fontSize-lg);font-weight:var(--gse-core-fontWeight-semiBold);line-height:var(--gse-lineHeight-md)}.gux-header .gux-icon{flex:0 1 auto;align-self:auto;order:0;color:#1da8b3}.gux-header .gux-icon ::slotted(gux-icon){width:32px !important;height:32px !important}.gux-header .gux-title{flex:1 1 auto;align-self:auto;order:0;margin:0 0 0 8px}.gux-message{flex:0 1 auto;align-self:auto;order:0;margin:16px 0;font-family:var(--gse-core-fontFamily-body), sans-serif;font-weight:var(--gse-core-fontWeight-regular);font-size:var(--gse-core-fontSize-xs);line-height:var(--gse-core-lineHeight-xs)}.gux-message ::slotted(dl){display:flex;flex-direction:row;flex-wrap:wrap;align-content:stretch;align-items:flex-start;justify-content:flex-start;margin:0}.gux-action-buttons{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:flex-start;align-self:auto;justify-content:space-between;order:0}.gux-action-buttons .gux-negative-button{flex:0 1 auto;align-self:auto;order:0}.gux-action-buttons .gux-positive-button{flex:0 1 auto;align-self:auto;order:0}.gux-action-buttons{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:flex-start;align-self:auto;justify-content:space-between;order:0}.gux-action-buttons .gux-negative-button{flex:0 1 auto;align-self:auto;order:0}.gux-action-buttons .gux-positive-button{flex:0 1 auto;align-self:auto;order:0}";
+const guxActionToastCss = ":host{display:flex;flex-direction:column;flex-wrap:nowrap;align-content:stretch;align-items:stretch;justify-content:flex-start;width:270px;padding:20px 24px;margin-bottom:4px;color:#2e394c;background:#f6f7f9;border:1px solid #b4bccb;border-radius:4px;box-shadow:0 2px 4px rgba(32, 41, 55, 0.24)}.gux-header{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:center;align-self:auto;justify-content:flex-start;order:0;font-family:var(--gse-core-typography-heading-lg-fontFamily), var(--gse-core-fontFamily-heading), sans-serif;font-size:var(--gse-core-typography-heading-lg-fontSize);line-height:var(--gse-core-typography-heading-lg-lineHeight);font-weight:var(--gse-core-fontWeight-bold)}.gux-header .gux-icon{flex:0 1 auto;align-self:auto;order:0;color:#1da8b3}.gux-header .gux-icon ::slotted(gux-icon){width:32px !important;height:32px !important}.gux-header .gux-title{flex:1 1 auto;align-self:auto;order:0;margin:0 0 0 8px}.gux-message{flex:0 1 auto;align-self:auto;order:0;margin:16px 0;font-family:var(--gse-core-typography-body-sm-fontFamily), var(--gse-core-fontFamily-body), sans-serif;font-size:var(--gse-core-typography-body-sm-fontSize);line-height:var(--gse-core-typography-body-sm-lineHeight);font-weight:var(--gse-core-fontWeight-regular)}.gux-message ::slotted(dl){display:flex;flex-direction:row;flex-wrap:wrap;align-content:stretch;align-items:flex-start;justify-content:flex-start;margin:0}.gux-action-buttons{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:flex-start;align-self:auto;justify-content:space-between;order:0}.gux-action-buttons .gux-negative-button{flex:0 1 auto;align-self:auto;order:0}.gux-action-buttons .gux-positive-button{flex:0 1 auto;align-self:auto;order:0}.gux-action-buttons{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;align-content:stretch;align-items:flex-start;align-self:auto;justify-content:space-between;order:0}.gux-action-buttons .gux-negative-button{flex:0 1 auto;align-self:auto;order:0}.gux-action-buttons .gux-positive-button{flex:0 1 auto;align-self:auto;order:0}";
 
 const GuxActionToast = class {
   constructor(hostRef) {

package/dist/esm/gux-advanced-dropdown-legacy.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, c as createEvent, h, g as getElement } from './i
 import { o as onMutation } from './on-mutation-a2b7cdad.js';
 import { O as OnClickOutside } from './on-click-outside-f15c5ac7.js';
 import { a as afterNextRenderTimeout } from './after-next-render-84ec18ad.js';
-import { t as trackComponent } from './usage-2b074807.js';
+import { t as trackComponent } from './usage-0630a584.js';
 import { b as buildI18nForComponent } from './index-df729b6a.js';
 import './get-closest-element-66f63212.js';
 

package/dist/esm/gux-announce-beta.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-39e65a0a.js';
-import { t as trackComponent } from './usage-2b074807.js';
+import { t as trackComponent } from './usage-0630a584.js';
 import { b as afterNextRender } from './after-next-render-84ec18ad.js';
 
 const guxAnnounceCss = ":host{position:absolute;top:auto;left:-10000px;width:1px;height:1px;overflow:hidden}";

package/dist/esm/gux-badge.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, g as getElement } from './index-39e65a0a.js';
-import { t as trackComponent } from './usage-2b074807.js';
+import { t as trackComponent } from './usage-0630a584.js';
 import { b as buildI18nForComponent } from './index-df729b6a.js';
 import './get-closest-element-66f63212.js';