genesys-spark-components 4.93.0 → 4.93.2

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 
 const conversion = /[ +]/g;
 const expressions = new Map();

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const getValidTimezone = require('./get-valid-timezone-cbe2b3e3.js');
 const useRegionalDates = require('./use-regional-dates-44835a16.js');
 const index$1 = require('./index-16a4179e.js');

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

@@ -7,7 +7,7 @@ const onClickOutside = require('./on-click-outside-31073d32.js');
 const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
 const index = require('./index-16a4179e.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const useRegionalDates = require('./use-regional-dates-44835a16.js');
 require('./get-closest-element-9e41d6b9.js');
 

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const index$1 = require('./index-16a4179e.js');
 const timeZone = require('./time-zone-e774c9f7.js');
 require('./get-closest-element-9e41d6b9.js');

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

@@ -5,11 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-79505d14.js');
 const index$1 = require('./index-16a4179e.js');
 const timeZone = require('./time-zone-e774c9f7.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 require('./get-closest-element-9e41d6b9.js');
 
-const guxTimeZonePickerCss = "gux-dropdown .zone-header{padding:8px 12px 4px;color:#6b7585;text-transform:uppercase}gux-dropdown gux-option{padding:var(--gse-ui-menu-option-padding)}gux-dropdown gux-option.gux-has-defaults{height:auto}gux-dropdown gux-option .gux-option-wrapper{display:flex;flex-direction:column}gux-dropdown gux-option .gux-default-zone{color:#626e84}";
+const guxTimeZonePickerCss = "gux-dropdown .zone-header{padding-block:8px 4px;padding-inline:12px;color:#6b7585;text-transform:uppercase}gux-dropdown gux-option{padding:var(--gse-ui-menu-option-padding)}gux-dropdown gux-option.gux-has-defaults{block-size:auto}gux-dropdown gux-option .gux-option-wrapper{display:flex;flex-direction:column}gux-dropdown gux-option .gux-default-zone{color:#626e84}";
 const GuxTimeZonePickerBetaStyle0 = guxTimeZonePickerCss;
 
 const GuxTimeZonePickerBeta = class {

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const hasSlot = require('./has-slot-3edae188.js');
 
 const guxToastCss = ".gux-toast{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-toast-gap);place-content:stretch flex-start;align-items: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-offsetX) var(--gse-ui-toast-boxShadow-offsetY) 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);place-content:stretch flex-start;align-items:flex-start;align-self:auto;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{width:100%}.gux-toast .gux-content .gux-buttons-bar ::slotted(a){font-family:var(--gse-ui-links-inLine-medium-underlinedText-fontFamily);font-size:var(--gse-ui-links-inLine-medium-underlinedText-fontSize);font-weight:var(--gse-ui-links-inLine-medium-underlinedText-fontWeight);line-height:var(--gse-ui-links-inLine-medium-underlinedText-lineHeight)}.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-79505d14.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
 const index$1 = require('./index-16a4179e.js');
 require('./get-closest-element-9e41d6b9.js');

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

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const floatingUi_dom_esm = require('./floating-ui.dom.esm-139d92fc.js');
+const floatingUi_dom_esm = require('./floating-ui.dom.esm-973d8a45.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
 const findElementById = require('./find-element-by-id-fde17c92.js');
 
-const guxTooltipBaseCss = ":host{position:fixed;z-index:var(--gse-semantic-zIndex-tooltip);display:none;width:max-content;max-width:250px;pointer-events:none;border-radius:var(--gse-ui-tooltip-borderRadius);box-shadow:var(--gse-ui-tooltip-boxShadow-offsetX) var(--gse-ui-tooltip-boxShadow-offsetY) var(--gse-ui-tooltip-boxShadow-blur) var(--gse-ui-tooltip-boxShadow-spread) var(--gse-ui-tooltip-boxShadow-color);opacity:0}:host(.gux-show){display:block;animation-name:fade-in;animation-duration:250ms;animation-delay:350ms;animation-fill-mode:forwards}.gux-container{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--gse-ui-tooltip-gap);place-content:center flex-start;padding:var(--gse-ui-tooltip-padding);font-family:var(--gse-ui-tooltip-text-fontFamily);font-size:var(--gse-ui-tooltip-text-fontSize);font-weight:var(--gse-ui-tooltip-text-fontWeight);line-height:var(--gse-ui-tooltip-text-lineHeight);color:var(--gse-ui-tooltip-light-foregroundColor);background-color:var(--gse-ui-tooltip-light-backgroundColor);border:var(--gse-ui-tooltip-light-border-width) var(--gse-ui-tooltip-light-border-style) var(--gse-ui-tooltip-light-border-color);border-radius:var(--gse-ui-tooltip-borderRadius)}.gux-container ::slotted(gux-icon){align-self:center;width:var(--gse-ui-icon-small-size);height:var(--gse-ui-icon-small-size);color:var(--gse-ui-tooltip-light-foregroundColor)}.gux-container ::slotted(*){width:100%;overflow-wrap:break-word;white-space:normal}.gux-container.gux-dark{color:var(--gse-ui-tooltip-dark-foregroundColor);background-color:var(--gse-ui-tooltip-dark-backgroundColor);border-color:var(--gse-ui-tooltip-dark-border-color)}.gux-container.gux-dark ::slotted(gux-icon){align-self:center;width:var(--gse-ui-icon-small-size);height:var(--gse-ui-icon-small-size);color:var(--gse-ui-tooltip-dark-iconColor)}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}";
+const guxTooltipBaseCss = ":host{position:fixed;z-index:var(--gse-semantic-zIndex-tooltip);display:none;inline-size:max-content;max-inline-size:250px;pointer-events:none;border-radius:var(--gse-ui-tooltip-borderRadius);box-shadow:var(--gse-ui-tooltip-boxShadow-offsetX) var(--gse-ui-tooltip-boxShadow-offsetY) var(--gse-ui-tooltip-boxShadow-blur) var(--gse-ui-tooltip-boxShadow-spread) var(--gse-ui-tooltip-boxShadow-color);opacity:0}:host(.gux-show){display:block;animation-name:fade-in;animation-duration:250ms;animation-delay:350ms;animation-fill-mode:forwards}.gux-container{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--gse-ui-tooltip-gap);place-content:center flex-start;padding:var(--gse-ui-tooltip-padding);font-family:var(--gse-ui-tooltip-text-fontFamily);font-size:var(--gse-ui-tooltip-text-fontSize);font-weight:var(--gse-ui-tooltip-text-fontWeight);line-height:var(--gse-ui-tooltip-text-lineHeight);color:var(--gse-ui-tooltip-light-foregroundColor);background-color:var(--gse-ui-tooltip-light-backgroundColor);border:var(--gse-ui-tooltip-light-border-width) var(--gse-ui-tooltip-light-border-style) var(--gse-ui-tooltip-light-border-color);border-radius:var(--gse-ui-tooltip-borderRadius)}.gux-container ::slotted(gux-icon){align-self:center;inline-size:var(--gse-ui-icon-small-size);block-size:var(--gse-ui-icon-small-size);color:var(--gse-ui-tooltip-light-foregroundColor)}.gux-container ::slotted(*){inline-size:100%;overflow-wrap:break-word;white-space:normal}.gux-container.gux-dark{color:var(--gse-ui-tooltip-dark-foregroundColor);background-color:var(--gse-ui-tooltip-dark-backgroundColor);border-color:var(--gse-ui-tooltip-dark-border-color)}.gux-container.gux-dark ::slotted(gux-icon){align-self:center;inline-size:var(--gse-ui-icon-small-size);block-size:var(--gse-ui-icon-small-size);color:var(--gse-ui-tooltip-dark-iconColor)}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}";
 const GuxTooltipBaseBetaStyle0 = guxTooltipBaseCss;
 
 const GuxTooltipBase = class {

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const floatingUi_dom_esm = require('./floating-ui.dom.esm-139d92fc.js');
+const floatingUi_dom_esm = require('./floating-ui.dom.esm-973d8a45.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
-const usage = require('./usage-bcc79bb0.js');
+const usage = require('./usage-513f9e4b.js');
 const findElementById = require('./find-element-by-id-fde17c92.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
 

package/dist/cjs/{usage-bcc79bb0.js → usage-513f9e4b.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const name = "genesys-spark-components";
-const version = "4.93.0";
+const version = "4.93.2";
 const description = "Common webcomponents";
 const license = "MIT";
 const main = "dist/stencil-wrapper.js";
@@ -61,35 +61,35 @@ const config = {
 };
 const types = "dist/types/index.d.ts";
 const dependencies = {
-	"@floating-ui/dom": "^1.6.11",
-	"@vvo/tzdb": "^6.146.0",
+	"@floating-ui/dom": "^1.6.12",
+	"@vvo/tzdb": "6.146.0",
 	"google-libphonenumber": "3.2.38",
 	"intl-messageformat": "10.7.0",
 	"requestanimationframe-timer": "3.0.3",
 	sortablejs: "1.15.3"
 };
 const devDependencies = {
-	"@babel/core": "^7.25.8",
-	"@babel/preset-env": "^7.25.8",
+	"@babel/core": "^7.26.0",
+	"@babel/preset-env": "^7.26.0",
 	"@stencil/core": "4.20.0",
 	"@stencil/react-output-target": "^0.5.3",
 	"@stencil/sass": "^3.0.12",
 	"@types/google-libphonenumber": "^7.4.30",
-	"@types/jest": "^29.5.13",
+	"@types/jest": "^29.5.14",
 	"@types/new-relic-browser": "^0.1118.2",
 	"@types/puppeteer": "^5.4.7",
 	"@types/resize-observer-browser": "^0.1.9",
 	"@types/sortablejs": "^1.15.8",
-	"axe-core": "^4.10.0",
+	"axe-core": "^4.10.2",
 	"axe-live": "^1.0.1",
-	eslint: "^9.12.0",
+	eslint: "^9.13.0",
 	"eslint-config-genesys-spark-components": "file:../../shared-configs/eslint-config-genesys-spark-components",
 	"file-loader": "^6.2.0",
 	"genesys-spark-tokens": "file:../genesys-spark-tokens",
 	glob: "^11.0.0",
 	globals: "^15.11.0",
 	handlebars: "^4.7.8",
-	inquirer: "^12.0.0",
+	inquirer: "^12.0.1",
 	jest: "^29.7.0",
 	"jest-cli": "^29.7.0",
 	"jest-config": "^29.7.0",
@@ -114,13 +114,13 @@ const devDependencies = {
 	"semver-sort": "^1.0.0",
 	smob: "^1.5.0",
 	"spritesheet-templates": "^10.5.2",
-	spritesmith: "^3.4.1",
+	spritesmith: "^3.5.1",
 	stylelint: "^16.10.0",
 	"stylelint-config-genesys-spark-components": "file:../../shared-configs/stylelint-config-genesys-spark-components",
 	"stylelint-config-html": "^1.1.0",
 	"stylelint-config-recess-order": "^5.1.1",
 	"stylelint-config-standard": "^36.0.1",
-	"stylelint-scss": "^6.7.0",
+	"stylelint-scss": "^6.8.1",
 	"stylelint-use-logical": "^2.1.2",
 	"stylelint-use-logical-spec": "^5.0.1",
 	svgo: "^3.3.2",

package/dist/collection/components/beta/gux-avatar/gux-avatar-change-photo/gux-avatar-change-photo.css

@@ -16,8 +16,8 @@
 }
 .gux-change-photo:hover .gux-change-photo-icon, .gux-change-photo:focus-visible .gux-change-photo-icon {
   position: absolute;
-  top: 50%;
-  left: 50%;
+  inset-block-start: 50%;
+  inset-inline-start: 50%;
   z-index: var(--gse-semantic-zIndex-showFocus);
   display: inline-block;
   color: var(--gse-ui-avatar-hoverModal-foregroundColor);
@@ -25,10 +25,10 @@
 }
 .gux-change-photo:hover::after, .gux-change-photo:focus-visible::after {
   position: absolute;
-  top: var(--gse-ui-avatar-large-presenceRing-width);
-  left: var(--gse-ui-avatar-large-presenceRing-width);
-  width: var(--gse-ui-avatar-addChangeImage-hoverModal-shroudSize);
-  height: var(--gse-ui-avatar-addChangeImage-hoverModal-shroudSize);
+  inset-block-start: var(--gse-ui-avatar-large-presenceRing-width);
+  inset-inline-start: var(--gse-ui-avatar-large-presenceRing-width);
+  inline-size: var(--gse-ui-avatar-addChangeImage-hoverModal-shroudSize);
+  block-size: var(--gse-ui-avatar-addChangeImage-hoverModal-shroudSize);
   content: "";
   background-color: var(--gse-ui-avatar-hoverModal-shroudColor);
   border: var(--gse-ui-avatar-content-large-border-width) var(--gse-ui-avatar-content-default-border-style) var(--gse-ui-avatar-content-default-border-color);

package/dist/collection/components/beta/gux-avatar/gux-avatar.css

@@ -7,15 +7,15 @@
 }
 
 ::slotted(img) {
-  width: 100%;
-  height: 100%;
+  inline-size: 100%;
+  block-size: 100%;
   object-fit: cover;
 }
 
 .gux-avatar {
   position: relative;
-  width: var(--gse-ui-avatar-large-size);
-  height: var(--gse-ui-avatar-large-size);
+  inline-size: var(--gse-ui-avatar-large-size);
+  block-size: var(--gse-ui-avatar-large-size);
   overflow: hidden;
   border-radius: 50%;
 }
@@ -24,8 +24,8 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  width: calc(100% - var(--gse-ui-avatar-large-presenceRing-width) * 2);
-  height: calc(100% - var(--gse-ui-avatar-large-presenceRing-width) * 2);
+  inline-size: calc(100% - var(--gse-ui-avatar-large-presenceRing-width) * 2);
+  block-size: calc(100% - var(--gse-ui-avatar-large-presenceRing-width) * 2);
   margin: var(--gse-ui-avatar-large-presenceRing-width);
   overflow: hidden;
   font-family: var(--gse-ui-avatar-large-initials-fontFamily);
@@ -39,12 +39,12 @@
   border-radius: 50%;
 }
 .gux-avatar.gux-medium {
-  width: var(--gse-ui-avatar-medium-size);
-  height: var(--gse-ui-avatar-medium-size);
+  inline-size: var(--gse-ui-avatar-medium-size);
+  block-size: var(--gse-ui-avatar-medium-size);
 }
 .gux-avatar.gux-medium .gux-content {
-  width: calc(100% - var(--gse-ui-avatar-medium-presenceRing-width) * 2);
-  height: calc(100% - var(--gse-ui-avatar-medium-presenceRing-width) * 2);
+  inline-size: calc(100% - var(--gse-ui-avatar-medium-presenceRing-width) * 2);
+  block-size: calc(100% - var(--gse-ui-avatar-medium-presenceRing-width) * 2);
   margin: var(--gse-ui-avatar-medium-presenceRing-width);
   font-size: var(--gse-ui-avatar-medium-initials-fontSize);
   font-weight: var(--gse-ui-avatar-medium-initials-fontWeight);
@@ -53,23 +53,23 @@
   border-width: var(--gse-ui-avatar-content-default-border-width);
 }
 .gux-avatar.gux-small {
-  width: var(--gse-ui-avatar-small-size);
-  height: var(--gse-ui-avatar-small-size);
+  inline-size: var(--gse-ui-avatar-small-size);
+  block-size: var(--gse-ui-avatar-small-size);
 }
 .gux-avatar.gux-small .gux-content {
-  width: calc(100% - var(--gse-ui-avatar-small-presenceRing-width) * 2);
-  height: calc(100% - var(--gse-ui-avatar-small-presenceRing-width) * 2);
+  inline-size: calc(100% - var(--gse-ui-avatar-small-presenceRing-width) * 2);
+  block-size: calc(100% - var(--gse-ui-avatar-small-presenceRing-width) * 2);
   margin: var(--gse-ui-avatar-small-presenceRing-width);
   font-size: var(--gse-ui-avatar-small-initials-fontSize);
   font-weight: var(--gse-ui-avatar-small-initials-fontWeight);
 }
 .gux-avatar.gux-xsmall {
-  width: var(--gse-ui-avatar-xsmall-size);
-  height: var(--gse-ui-avatar-xsmall-size);
+  inline-size: var(--gse-ui-avatar-xsmall-size);
+  block-size: var(--gse-ui-avatar-xsmall-size);
 }
 .gux-avatar.gux-xsmall .gux-content {
-  width: calc(100% - var(--gse-ui-avatar-xsmall-presenceRing-width) * 2);
-  height: calc(100% - var(--gse-ui-avatar-xsmall-presenceRing-width) * 2);
+  inline-size: calc(100% - var(--gse-ui-avatar-xsmall-presenceRing-width) * 2);
+  block-size: calc(100% - var(--gse-ui-avatar-xsmall-presenceRing-width) * 2);
   margin: var(--gse-ui-avatar-xsmall-presenceRing-width);
   font-size: var(--gse-ui-avatar-xsmall-initials-fontSize);
   font-weight: var(--gse-ui-avatar-xsmall-initials-fontWeight);
@@ -157,31 +157,31 @@
 
 .gux-avatar-badge {
   position: absolute;
-  top: calc(var(--gse-ui-avatar-content-large-border-width) * -1);
-  right: calc(var(--gse-ui-avatar-content-large-border-width) * -1);
+  inset-block-start: calc(var(--gse-ui-avatar-content-large-border-width) * -1);
+  inset-inline-end: calc(var(--gse-ui-avatar-content-large-border-width) * -1);
   z-index: var(--gse-semantic-zIndex-showFocus);
   display: flex;
   align-items: center;
   justify-content: center;
-  width: var(--gse-ui-avatar-large-badge-size);
-  height: var(--gse-ui-avatar-large-badge-size);
+  inline-size: var(--gse-ui-avatar-large-badge-size);
+  block-size: var(--gse-ui-avatar-large-badge-size);
   border-color: var(--gse-ui-avatar-content-default-border-color);
   border-style: var(--gse-ui-avatar-content-default-border-style);
   border-width: var(--gse-ui-avatar-content-large-border-width);
   border-radius: 50%;
 }
 .gux-avatar-badge.gux-medium {
-  top: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
-  right: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
-  width: var(--gse-ui-avatar-medium-badge-size);
-  height: var(--gse-ui-avatar-medium-badge-size);
+  inset-block-start: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
+  inset-inline-end: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
+  inline-size: var(--gse-ui-avatar-medium-badge-size);
+  block-size: var(--gse-ui-avatar-medium-badge-size);
   border-width: var(--gse-ui-avatar-content-default-border-width);
 }
 .gux-avatar-badge.gux-small, .gux-avatar-badge.gux-xsmall {
-  top: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
-  right: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
-  width: var(--gse-ui-avatar-small-badge-size);
-  height: var(--gse-ui-avatar-small-badge-size);
+  inset-block-start: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
+  inset-inline-end: calc(var(--gse-ui-avatar-content-default-border-width) * -1);
+  inline-size: var(--gse-ui-avatar-small-badge-size);
+  block-size: var(--gse-ui-avatar-small-badge-size);
   border-width: var(--gse-ui-avatar-content-default-border-width);
 }
 .gux-avatar-badge.gux-small gux-icon, .gux-avatar-badge.gux-xsmall gux-icon {
@@ -243,6 +243,6 @@
   color: var(--gse-ui-avatar-badge-foregroundDefault-color);
 }
 .gux-avatar-badge gux-icon {
-  width: 100%;
-  height: 100%;
+  inline-size: 100%;
+  block-size: 100%;
 }

package/dist/collection/components/beta/gux-calendar-beta/components/single/gux-calendar.css

@@ -12,7 +12,7 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  height: var(--gse-ui-calendarMenu-month-single-header-height);
+  block-size: var(--gse-ui-calendarMenu-month-single-header-height);
   padding: var(--gse-ui-calendarMenu-header-padding);
   font-style: normal;
   font-weight: var(--gse-ui-calendarMenu-month-currentText-fontWeight);
@@ -22,7 +22,7 @@
   border-radius: var(--gse-ui-calendarMenu-single-header-borderRadius);
 }
 .gux-calendar-beta .gux-header .gux-header-month-and-year {
-  width: var(--gse-ui-calendarMenu-month-single-header-textWidth);
+  inline-size: var(--gse-ui-calendarMenu-month-single-header-textWidth);
   font-family: var(--gse-ui-calendarMenu-month-headerText-fontFamily);
   font-size: var(--gse-ui-calendarMenu-month-headerText-fontSize);
   line-height: var(--gse-ui-calendarMenu-month-headerText-lineHeight);
@@ -43,13 +43,12 @@
 }
 .gux-calendar-beta .gux-header .gux-left gux-icon,
 .gux-calendar-beta .gux-header .gux-right gux-icon {
-  width: 16px;
-  height: 16px;
+  inline-size: 16px;
+  block-size: 16px;
 }
 .gux-calendar-beta .gux-week-days {
-  padding-top: 24px;
-  padding-right: 24px;
-  padding-left: 24px;
+  padding-block-start: 24px;
+  padding-inline: 24px;
   font-family: var(--gse-ui-calendarMenu-day-headerText-fontFamily);
   font-size: var(--gse-ui-calendarMenu-day-headerText-fontSize);
   font-weight: var(--gse-ui-calendarMenu-day-headerText-fontWeight);
@@ -58,8 +57,8 @@
 }
 .gux-calendar-beta .gux-week-days .gux-week-day {
   display: inline-block;
-  width: var(--gse-ui-calendarMenu-day-date-size);
-  height: 16px;
+  inline-size: var(--gse-ui-calendarMenu-day-date-size);
+  block-size: 16px;
 }
 .gux-calendar-beta .gux-content {
   padding: var(--gse-ui-calendarMenu-dateBody-padding);
@@ -69,8 +68,8 @@
 }
 .gux-calendar-beta .gux-content-week .gux-content-date {
   display: inline-block;
-  width: var(--gse-ui-calendarMenu-day-date-size);
-  height: var(--gse-ui-calendarMenu-day-input-height);
+  inline-size: var(--gse-ui-calendarMenu-day-date-size);
+  block-size: var(--gse-ui-calendarMenu-day-input-height);
   font-family: var(--gse-ui-calendarMenu-date-currentText-fontFamily);
   font-size: var(--gse-ui-calendarMenu-date-defaultText-fontSize);
   font-style: normal;

package/dist/collection/components/beta/gux-cta-group/gux-cta-group.css

@@ -15,5 +15,5 @@
 }
 .gux-cta-group ::slotted(gux-button) {
   flex: 0 1 auto;
-  min-width: 0;
+  min-inline-size: 0;
 }

package/dist/collection/components/beta/gux-flag-icon/gux-flag-icon.css

@@ -1722,8 +1722,8 @@
 
 :host {
   display: inline-block;
-  width: fit-content;
-  height: fit-content;
+  inline-size: fit-content;
+  block-size: fit-content;
   line-height: 0;
   vertical-align: bottom;
   transform: scale(0.6666666667);

package/dist/collection/components/beta/gux-form/gux-form-footer/gux-form-footer.css

@@ -2,13 +2,14 @@
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  margin-top: var(--gse-semantic-formControl-formBody-paddingBottom);
-  border-top: var(--gse-ui-formFooter-separator-width) var(--gse-ui-formFooter-separator-style) var(--gse-ui-formFooter-separator-color);
+  margin-block-start: var(--gse-semantic-formControl-formBody-paddingBottom);
+  border-block-start: var(--gse-ui-formFooter-separator-width) var(--gse-ui-formFooter-separator-style) var(--gse-ui-formFooter-separator-color);
 }
 
 :host(.gux-form-footer-page-desktop) ::slotted(footer) {
   gap: var(--gse-ui-formFooter-page-desktop-gap);
-  padding: var(--gse-ui-formFooter-page-desktop-topPadding) var(--gse-ui-formFooter-page-desktop-horizontalPadding) var(--gse-ui-formFooter-page-desktop-bottomPadding) var(--gse-ui-formFooter-page-desktop-horizontalPadding);
+  padding-block: var(--gse-ui-formFooter-page-desktop-topPadding) var(--gse-ui-formFooter-page-desktop-bottomPadding);
+  padding-inline: var(--gse-ui-formFooter-page-desktop-horizontalPadding) var(--gse-ui-formFooter-page-desktop-horizontalPadding);
 }
 
 :host(.gux-form-footer-page-mobile) ::slotted(footer) {
@@ -16,16 +17,19 @@
   gap: var(--gse-ui-formFooter-page-mobile-gap);
   align-items: stretch;
   justify-content: center;
-  padding: var(--gse-ui-formFooter-page-mobile-topPadding) var(--gse-ui-formFooter-page-mobile-horizontalPadding) var(--gse-ui-formFooter-page-mobile-bottomPadding) var(--gse-ui-formFooter-page-mobile-horizontalPadding);
+  padding-block: var(--gse-ui-formFooter-page-mobile-topPadding) var(--gse-ui-formFooter-page-mobile-bottomPadding);
+  padding-inline: var(--gse-ui-formFooter-page-mobile-horizontalPadding) var(--gse-ui-formFooter-page-mobile-horizontalPadding);
 }
 
 :host(.gux-form-footer-side-sheet-desktop) ::slotted(footer) {
   gap: var(--gse-ui-formFooter-sideSheet-desktop-gap);
-  padding: var(--gse-ui-formFooter-sideSheet-desktop-topPadding) var(--gse-ui-formFooter-sideSheet-desktop-horizontalPadding) var(--gse-ui-formFooter-sideSheet-desktop-bottomPadding) var(--gse-ui-formFooter-sideSheet-desktop-horizontalPadding);
+  padding-block: var(--gse-ui-formFooter-sideSheet-desktop-topPadding) var(--gse-ui-formFooter-sideSheet-desktop-bottomPadding);
+  padding-inline: var(--gse-ui-formFooter-sideSheet-desktop-horizontalPadding) var(--gse-ui-formFooter-sideSheet-desktop-horizontalPadding);
 }
 
 :host(.gux-form-footer-modal-desktop) ::slotted(footer) {
   gap: var(--gse-ui-formFooter-sideSheet-desktop-gap);
   justify-content: flex-end;
-  padding: var(--gse-ui-formFooter-modal-desktop-topPadding) var(--gse-ui-formFooter-modal-desktop-horizontalPadding) var(--gse-ui-formFooter-modal-desktop-bottomPadding) var(--gse-ui-formFooter-modal-desktop-horizontalPadding);
+  padding-block: var(--gse-ui-formFooter-modal-desktop-topPadding) var(--gse-ui-formFooter-modal-desktop-bottomPadding);
+  padding-inline: var(--gse-ui-formFooter-modal-desktop-horizontalPadding) var(--gse-ui-formFooter-modal-desktop-horizontalPadding);
 }

package/dist/collection/components/beta/gux-icon-tooltip/gux-icon-tooltip.css

@@ -1,5 +1,5 @@
 .gux-icon-tooltip {
-  width: fit-content;
+  inline-size: fit-content;
   padding: 0;
   line-height: 0;
   background-color: transparent;

package/dist/collection/components/beta/gux-label-info/gux-label-info.css

@@ -1,5 +1,5 @@
 .gux-label-info {
-  width: fit-content;
+  inline-size: fit-content;
   padding: 0;
   line-height: 0;
   background-color: transparent;

package/dist/collection/components/beta/gux-month-picker/gux-month-calendar/gux-month-calendar.css

@@ -1,6 +1,6 @@
 .gux-month-calendar {
   flex-wrap: wrap;
-  width: var(--gse-ui-calendarMenu-width);
+  inline-size: var(--gse-ui-calendarMenu-width);
   box-shadow: var(--gse-ui-calendarMenu-boxShadow-offsetX) var(--gse-ui-calendarMenu-boxShadow-offsetY) var(--gse-ui-calendarMenu-boxShadow-blur) var(--gse-ui-calendarMenu-boxShadow-spread) var(--gse-ui-calendarMenu-boxShadow-color);
 }
 .gux-month-calendar.gux-hidden {
@@ -18,7 +18,7 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  height: var(--gse-ui-calendarMenu-month-single-header-height);
+  block-size: var(--gse-ui-calendarMenu-month-single-header-height);
   padding: var(--gse-ui-calendarMenu-header-padding);
   font-family: var(--gse-ui-calendarMenu-day-headerText-fontFamily);
   font-size: var(--gse-ui-calendarMenu-day-headerText-fontSize);
@@ -46,7 +46,7 @@
   opacity: var(--gse-ui-calendarMenu-disabled-opacity);
 }
 .gux-month-calendar .gux-year-header button gux-icon {
-  width: var(--gse-ui-icon-small-size);
-  height: var(--gse-ui-icon-small-size);
+  inline-size: var(--gse-ui-icon-small-size);
+  block-size: var(--gse-ui-icon-small-size);
   pointer-events: none;
 }

package/dist/collection/components/beta/gux-month-picker/gux-month-calendar/gux-month-list/gux-month-list-item/gux-month-list-item.css

@@ -8,15 +8,16 @@
 
 .gux-container {
   box-sizing: border-box;
-  width: var(--gse-ui-calendarMenu-month-monthCell-width);
-  height: var(--gse-ui-calendarMenu-month-monthCell-height);
-  padding: 10px 5px 9px;
+  inline-size: var(--gse-ui-calendarMenu-month-monthCell-width);
+  block-size: var(--gse-ui-calendarMenu-month-monthCell-height);
+  padding-block: 10px 9px;
+  padding-inline: 5px;
 }
 .gux-container button {
   all: unset;
   box-sizing: border-box;
-  width: 100%;
-  height: 100%;
+  inline-size: 100%;
+  block-size: 100%;
   text-align: center;
   word-wrap: break-word;
   cursor: pointer;

package/dist/collection/components/beta/gux-month-picker/gux-month-picker.css

@@ -20,8 +20,8 @@
 .gux-target .gux-display {
   display: inline-flex;
   align-items: center;
-  min-width: 100px;
-  padding-right: var(--gse-ui-formControl-input-gap);
+  min-inline-size: 100px;
+  padding-inline-end: var(--gse-ui-formControl-input-gap);
   font-family: var(--gse-ui-formControl-label-text-fontFamily);
   font-size: var(--gse-ui-formControl-label-text-fontSize);
   font-weight: var(--gse-ui-formControl-label-text-fontWeight);
@@ -32,7 +32,7 @@
   outline: none;
 }
 .gux-target .gux-display .gux-spinner:not(:first-child) {
-  margin-left: 4px;
+  margin-inline-start: 4px;
 }
 .gux-target .gux-display .gux-spinner:focus-visible {
   background: var(--gse-ui-calendarMenu-month-hover-backgroundColor);
@@ -60,8 +60,8 @@
   color: var(--gse-ui-monthPicker-calendarStates-disabledColor);
 }
 .gux-target .gux-popup-toggle gux-icon {
-  width: var(--gse-ui-icon-small-size);
-  height: var(--gse-ui-icon-small-size);
+  inline-size: var(--gse-ui-icon-small-size);
+  block-size: var(--gse-ui-icon-small-size);
 }
 .gux-target .gux-popup-toggle.gux-expanded {
   color: var(--gse-ui-monthPicker-calendarStates-activeColor);