genesys-spark-components 4.105.5 → 4.106.0

package/dist/cjs/gux-pagination-items-per-page.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const index$1 = require('./index-16a4179e.js');
+const index$1 = require('./index-643c40f5.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const perPage = "per page";
@@ -39,7 +39,7 @@ const GuxPaginationItemsPerPage = class {
             }) }, index.h("gux-listbox", { "aria-label": this.i18n('itemsPerPage') }, index.h("gux-option", { value: "25" }, "25"), index.h("gux-option", { value: "50" }, "50"), index.h("gux-option", { value: "75" }, "75"), index.h("gux-option", { value: "100" }, "100"))));
     }
     render() {
-        return (index.h("div", { key: 'b1c4429c9e9eeb70b4e29b1b2ba32a92c528c23c', class: "gux-pagination-items-per-page-container" }, index.h("div", { key: '98be76765673793cdeac00ba6fa7b2f01dc1342e', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), index.h("div", { key: 'a620038a974e3ca72f7c510258018aa90bf58896', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
+        return (index.h("div", { key: '9643a2c4d28712a2de1e62b15503a6106b6471c2', class: "gux-pagination-items-per-page-container" }, index.h("div", { key: '9a7796264866788bcb2fa818e7c7aebed9882fc1', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), index.h("div", { key: '12785493c3b5174b10a7a1e7e49b7ed81517a47d', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-pagination-legacy.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 
 const guxPaginationLegacyCss = ":host{display:block;border-top:var(--gse-ui-dataTableItems-tablePagination-divider-width) var(--gse-ui-dataTableItems-tablePagination-divider-style) var(--gse-ui-dataTableItems-tablePagination-divider-color)}.gux-pagination-container{display:flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch space-between;align-items:center;height:var(--gse-ui-dataTableItems-cell-tablePagination-height);padding:var(--gse-ui-dataTableItems-tablePagination-padding);background-color:var(--gse-ui-dataTableItems-tablePagination-defaultBackgroundColor)}.gux-pagination-container .gux-pagination-info{display:flex;flex:1 1 auto;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-dataTableItems-tablePagination-recordsetControls-gap);place-content:stretch flex-start;align-items:center;align-self:auto;order:0}.gux-pagination-container .gux-pagination-info>*{flex:0 1 auto;align-self:auto;order:0}.gux-pagination-container .gux-pagination-change{flex:1 1 auto;align-self:auto;order:0}.gux-pagination-container .gux-pagination-change:first-child{margin-left:0}";
 const GuxPaginationLegacyStyle0 = guxPaginationLegacyCss;
@@ -68,7 +68,7 @@ const GuxPaginationLegacy = class {
         this.currentPage = this.calculateCurrentPage();
     }
     render() {
-        return (index.h("div", { key: '8602516dee10463971c9dcd18588e5ae59220461', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), index.h("div", { key: '35b0b2c623b2adfd697d2233e650fd123da83c35', class: "gux-pagination-change" }, index.h("gux-pagination-buttons-legacy", { key: 'd0341a4f877d4d8f8d4a5fb460b521ddd78aa906', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (index.h("div", { key: 'd6c03ef698ab13d8f0dcbf044462aaf24c1e86d4', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), index.h("div", { key: 'ba58e1096bb6dcc20f0fe24acb444e2ed936099b', class: "gux-pagination-change" }, index.h("gux-pagination-buttons-legacy", { key: '5c8ba4cb17c85bf335d86b41c51e0753317a0fca', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
     }
     get root() { return index.getElement(this); }
 };

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 
 const guxPaginationCss = ":host{display:block;block-size:var(--gse-ui-dataTableItems-cell-tablePagination-height);border-block-start:var(--gse-ui-dataTableItems-tablePagination-divider-width) var(--gse-ui-dataTableItems-tablePagination-divider-style) var(--gse-ui-dataTableItems-tablePagination-divider-color)}.gux-pagination-container{display:flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch space-between;align-items:center;padding:var(--gse-ui-dataTableItems-tablePagination-padding);background-color:var(--gse-ui-dataTableItems-tablePagination-defaultBackgroundColor)}.gux-pagination-container .gux-pagination-info{display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-dataTableItems-tablePagination-recordsetControls-gap);place-content:stretch flex-start;align-items:center;align-self:auto;order:0}.gux-pagination-container .gux-pagination-info>*{flex:0 1 auto;align-self:auto;order:0}.gux-pagination-container .gux-pagination-spacer{flex:1 1 auto;align-self:auto;order:0}.gux-pagination-container .gux-pagination-change{flex:0 1 auto;align-self:auto;order:0}.gux-pagination-container .gux-pagination-change:first-child{margin-inline-start:0}";
 const GuxPaginationStyle0 = guxPaginationCss;
@@ -94,7 +94,7 @@ const GuxPagination = class {
         }, 500);
     }
     render() {
-        return (index.h("div", { key: '79c47b75477edcb39a51d98b29d83d9c5e06ee1f', class: "gux-pagination-container" }, index.h("div", { key: 'f9666c062ab80b17eb79b32cc7fb6c693cf538f6', class: "gux-pagination-info" }, index.h("gux-pagination-item-counts", { key: '3fce8053ae451d66574e58ab6185c9437dc8e655', "total-items": this.totalItems, "current-page": this.currentPage, "items-per-page": this.itemsPerPage }), this.displayedLayout === 'advanced' && (index.h("gux-pagination-items-per-page", { key: 'b08e55067cd9b13de58e7789e1e0b1b68562df68', disabled: this.disabled, "items-per-page": this.itemsPerPage, onInternalitemsperpagechange: this.handleInternalitemsperpagechange.bind(this) }))), index.h("div", { key: '6597bb0de33af5558e3163972fab3a87833859a2', class: "gux-pagination-spacer" }), index.h("div", { key: '5caea6763b35c8cf89ce750fb369b92315d1274f', class: "gux-pagination-change" }, index.h("gux-pagination-buttons", { key: '2bd9e8b602a2be355f05880cb912a57ff7f97b35', disabled: this.disabled, layout: this.displayedLayout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (index.h("div", { key: '361ceaf6693c424bae10aa61798b0acac93c5e42', class: "gux-pagination-container" }, index.h("div", { key: '0d427c60e7010b510490fb0d0a25c3e021ddd6bc', class: "gux-pagination-info" }, index.h("gux-pagination-item-counts", { key: 'ce8dec2525b01766163e54176e5d816e9126d360', "total-items": this.totalItems, "current-page": this.currentPage, "items-per-page": this.itemsPerPage }), this.displayedLayout === 'advanced' && (index.h("gux-pagination-items-per-page", { key: 'cfbb91e75acfd69383540d1c948f029ae590a3a4', disabled: this.disabled, "items-per-page": this.itemsPerPage, onInternalitemsperpagechange: this.handleInternalitemsperpagechange.bind(this) }))), index.h("div", { key: 'e67a3e34889a8c7aed71e6fe511d11518edbd14c', class: "gux-pagination-spacer" }), index.h("div", { key: 'd7696ff702f3cc254497891ec5cc2081d87b3a52', class: "gux-pagination-change" }, index.h("gux-pagination-buttons", { key: '3594f78147f8e32531bfb3ba8b1304810c40e4be', disabled: this.disabled, layout: this.displayedLayout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-phone-input-beta.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-43072083.js');
-const index$1 = require('./index-16a4179e.js');
+const usage = require('./usage-7cad50c2.js');
+const index$1 = require('./index-643c40f5.js');
 const onClickOutside = require('./on-click-outside-31073d32.js');
 const preventBrowserValidationStyling = require('./prevent-browser-validation-styling-132644ad.js');
 const logError = require('./log-error-7b9d4b57.js');
@@ -1985,7 +1985,7 @@ function getRegionObjects(locale, i18n, phoneUtil) {
     return regionObjects;
 }
 
-const guxPhoneInputCss = ":host{display:block;color:var(--gse-ui-formControl-input-populatedColor)}.gux-phone-text-input{flex:1 1 auto;align-self:auto;order:0;inline-size:100%;margin-inline-start:4px;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);color:var(--gse-ui-formControl-input-populatedColor);text-overflow:ellipsis;background-color:var(--gse-ui-formControl-input-backgroundColor);border:none;outline:none}.gux-phone-text-input.gux-disabled{-webkit-user-select:none;user-select:none}.target-container{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;inline-size:100%;block-size:var(--gse-ui-phoneInput-dropdown-height);padding-block:0;padding-inline:0 8px;font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;border:var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) var(--gse-ui-formControl-input-default-border-color);border-radius:var(--gse-ui-formControl-input-borderRadius)}.target-container .gux-input{flex:1;align-content:center;block-size:100%;cursor:text}.target-container.gux-error{border:var(--gse-ui-formControl-input-error-border-width) var(--gse-ui-formControl-input-error-border-style) var(--gse-ui-formControl-input-error-border-color)}.target-container:focus-within{outline:var(--gse-semantic-border-focus) solid var(--gse-semantic-focusOutline-md-borderWidth);outline-offset:var(--gse-semantic-focusOutline-offset)}.gux-field{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-phoneInput-dropdown-gap);align-items:center;inline-size:100%;block-size:100%;padding:var(--gse-ui-phoneInput-dropdown-padding);font-family:inherit;font-size:var(--gse-ui-formControl-input-contentText-fontSize);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);cursor:pointer;border-radius:var(--gse-ui-formControl-input-borderRadius) 0 0 var(--gse-ui-formControl-input-borderRadius)}.gux-field.gux-disabled{padding:var(--gse-ui-phoneInput-dropdown-disabled-padding)}.gux-field .gux-field-content{display:flex;flex-direction:column;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;min-inline-size:0}.gux-field .gux-field-content .gux-selected-option{display:flex;justify-content:center;inline-size:var(--gse-ui-phoneInput-dropdown-flag-width);overflow:hidden}.gux-field .gux-field-content .gux-selected-option gux-icon{position:relative;color:var(--gse-ui-formControl-input-inputIcon-defaultColor)}.gux-field .gux-field-content .gux-placeholder{color:var(--gse-ui-formControl-input-placeholderColor)}.gux-field .gux-expand-icon{flex:0 0 auto;align-self:auto;order:0;inline-size:var(--gse-ui-phoneInput-dropdown-icon-width);block-size:var(--gse-ui-phoneInput-dropdown-icon-height);color:var(--gse-ui-phoneInput-dropdown-foregroundColor)}.gux-field-button{box-sizing:border-box;background-color:var(--gse-ui-formControl-input-backgroundColor);border:none;border-radius:var(--gse-ui-formControl-input-borderRadius) 0 0 var(--gse-ui-formControl-input-borderRadius);outline:none}.gux-field-button.gux-expanded{background-color:var(--gse-ui-phoneInput-dropdown-active-backgroundColor)}.gux-field-button.gux-expanded .gux-expand-icon{transform:rotate(180deg)}.gux-field-button:hover{background-color:var(--gse-ui-phoneInput-dropdown-hover-backgroundColor)}.gux-listbox-container{box-sizing:border-box;inline-size:fit-content;min-inline-size:var(--gse-ui-phoneInput-dropdown-menu-minWidth);margin:0}.gux-option-content{display:grid;grid-template-columns:36px 1fr;align-items:center;inline-size:100%}.gux-option-content .gux-country-code{text-align:end}.gux-option-content gux-icon{position:relative;inset-inline-start:4px;inline-size:var(--gse-ui-phoneInput-dropdown-icon-width);block-size:var(--gse-ui-phoneInput-dropdown-icon-height);color:var(--gse-ui-formControl-input-inputIcon-defaultColor)}.gux-region-select{block-size:100%;border-radius:var(--gse-ui-formControl-input-borderRadius)}.gux-region-select:focus-within{outline:var(--gse-semantic-border-focus) solid var(--gse-semantic-focusOutline-md-borderWidth);outline-offset:var(--gse-semantic-focusOutline-offset)}";
+const guxPhoneInputCss = ":host{display:block;color:var(--gse-ui-formControl-input-populatedColor)}.gux-phone-text-input{flex:1 1 auto;align-self:auto;order:0;inline-size:100%;margin-inline-start:4px;overflow:hidden;font-size:var(--gse-ui-formControl-input-contentText-fontSize);color:var(--gse-ui-formControl-input-populatedColor);text-overflow:ellipsis;background-color:var(--gse-ui-formControl-input-backgroundColor);border:none;outline:none}.gux-phone-text-input.gux-disabled{-webkit-user-select:none;user-select:none}.target-container{box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;inline-size:100%;block-size:var(--gse-ui-phoneInput-dropdown-height);padding-block:0;padding-inline:0 8px;font-family:var(--gse-ui-formControl-input-contentText-fontFamily);font-size:var(--gse-ui-formControl-input-contentText-fontSize);font-weight:var(--gse-ui-formControl-input-contentText-fontWeight);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);color:var(--gse-ui-formControl-input-populatedColor);background-color:var(--gse-ui-formControl-input-backgroundColor);background-image:none;border:var(--gse-ui-formControl-input-default-border-width) var(--gse-ui-formControl-input-default-border-style) var(--gse-ui-formControl-input-default-border-color);border-radius:var(--gse-ui-formControl-input-borderRadius)}.target-container .gux-input{flex:1;align-content:center;block-size:100%;cursor:text}.target-container.gux-error{border:var(--gse-ui-formControl-input-error-border-width) var(--gse-ui-formControl-input-error-border-style) var(--gse-ui-formControl-input-error-border-color)}.target-container:focus-within{outline:var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);outline-offset:var(--gse-semantic-focusOutline-offset)}.gux-field{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-phoneInput-dropdown-gap);align-items:center;inline-size:100%;block-size:100%;padding:var(--gse-ui-phoneInput-dropdown-padding);font-family:inherit;font-size:var(--gse-ui-formControl-input-contentText-fontSize);line-height:var(--gse-ui-formControl-input-contentText-lineHeight);cursor:pointer;border-radius:var(--gse-ui-formControl-input-borderRadius) 0 0 var(--gse-ui-formControl-input-borderRadius)}.gux-field.gux-disabled{padding:var(--gse-ui-phoneInput-dropdown-disabled-padding)}.gux-field .gux-field-content{display:flex;flex-direction:column;flex-wrap:nowrap;place-content:stretch flex-start;align-items:flex-start;min-inline-size:0}.gux-field .gux-field-content .gux-selected-option{display:flex;justify-content:center;inline-size:var(--gse-ui-phoneInput-dropdown-flag-width);overflow:hidden}.gux-field .gux-field-content .gux-selected-option gux-icon{position:relative;color:var(--gse-ui-formControl-input-inputIcon-defaultColor)}.gux-field .gux-field-content .gux-placeholder{color:var(--gse-ui-formControl-input-placeholderColor)}.gux-field .gux-expand-icon{flex:0 0 auto;align-self:auto;order:0;inline-size:var(--gse-ui-phoneInput-dropdown-icon-width);block-size:var(--gse-ui-phoneInput-dropdown-icon-height);color:var(--gse-ui-phoneInput-dropdown-foregroundColor)}.gux-field-button{box-sizing:border-box;background-color:var(--gse-ui-formControl-input-backgroundColor);border:none;border-radius:var(--gse-ui-formControl-input-borderRadius) 0 0 var(--gse-ui-formControl-input-borderRadius);outline:none}.gux-field-button.gux-expanded{background-color:var(--gse-ui-phoneInput-dropdown-active-backgroundColor)}.gux-field-button.gux-expanded .gux-expand-icon{transform:rotate(180deg)}.gux-field-button:hover{background-color:var(--gse-ui-phoneInput-dropdown-hover-backgroundColor)}.gux-listbox-container{box-sizing:border-box;inline-size:fit-content;min-inline-size:var(--gse-ui-phoneInput-dropdown-menu-minWidth);margin:0}.gux-option-content{display:grid;grid-template-columns:36px 1fr;align-items:center;inline-size:100%}.gux-option-content .gux-country-code{text-align:end}.gux-option-content gux-icon{position:relative;inset-inline-start:4px;inline-size:var(--gse-ui-phoneInput-dropdown-icon-width);block-size:var(--gse-ui-phoneInput-dropdown-icon-height);color:var(--gse-ui-formControl-input-inputIcon-defaultColor)}.gux-region-select{block-size:100%;border-radius:var(--gse-ui-formControl-input-borderRadius)}.gux-region-select:focus-within{outline:var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);outline-offset:var(--gse-semantic-focusOutline-offset)}";
 const GuxPhoneInputBetaStyle0 = guxPhoneInputCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -2345,7 +2345,7 @@ const GuxPhoneInput = class {
         return (index.h("div", { slot: "popup", class: "gux-listbox-container" }, index.h("gux-listbox", { "aria-label": this.i18n('regionDropdown'), value: this.region ? this.region.alpha2Code : '' }, this.regionOptions)));
     }
     render() {
-        return (index.h("gux-popup", { key: '88fda2068da55381d5ac83f0853463c623d79c4a', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
+        return (index.h("gux-popup", { key: '9486015223b4b9033b10c67fce3f2178c9041912', expanded: this.expanded, disabled: this.disabled, "exceed-target-width": true }, this.renderTarget(), this.renderPopup()));
     }
     get root() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-79505d14.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-0b237e01.js');
 const onClickOutside = require('./on-click-outside-31073d32.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 const getSlot = require('./get-slot-676aebf2.js');
 const findElementById = require('./find-element-by-id-fde17c92.js');
 
@@ -203,10 +203,10 @@ const GuxPopover = class {
         }
     }
     render() {
-        return (index.h("div", { key: '0956debf6d168a53d2392a9097d1021a40db81ed', ref: (el) => (this.popupElement = el), class: {
+        return (index.h("div", { key: '5e481cf437fbeeb2b9a504cbab1bc379dbe7fba6', ref: (el) => (this.popupElement = el), class: {
                 'gux-popover-wrapper': true,
                 'gux-hidden': !this.isOpen
-            }, "data-placement": true, popover: "manual" }, index.h("div", { key: '8ac78e31d4225d15a19cb213340b43894421d401', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, index.h("div", { key: 'e763e9f6aaadb4e6746227948e4565dcb9ad5da8', class: "gux-arrow-caret" })), index.h("div", { key: '89e0769e83e1275f6c59d83a8aec84ac781f0139', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '1f81a0750b248977353e6ee1071e053b8b4e1f00', name: "title" }), this.renderDismissButton()), index.h("div", { key: '01b627cce8e37043bbd65b34f1a60c1104edfd93', class: "gux-popover-content" }, index.h("slot", { key: 'b19b3f19dc701ea048b8d14460d743b215a1da63' }))));
+            }, "data-placement": true, popover: "manual" }, index.h("div", { key: '1ef55c5205040fabe293a146b07e5a1f56468657', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }, index.h("div", { key: '4527d7f23a405d8d937c5bb5150ae7b88286b946', class: "gux-arrow-caret" })), index.h("div", { key: '877961881a63783b4fa19387badb63cac0701540', class: { 'gux-popover-header': Boolean(this.titleSlot) } }, index.h("slot", { key: '8ab06c20228f35f0925abd7f125b237ddaa2cdac', name: "title" }), this.renderDismissButton()), index.h("div", { key: '71eec119b566ee0093dc0f0ac4b4406d2d17ba78', class: "gux-popover-content" }, index.h("slot", { key: '4794c27cb2eca72bf18132ff1daae35369576a71' }))));
     }
     get root() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/gux-popover-list-beta.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-79505d14.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-0b237e01.js');
 const onClickOutside = require('./on-click-outside-31073d32.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 const findElementById = require('./find-element-by-id-fde17c92.js');
 
 const guxPopoverListCss = ":popover-open{position:absolute;inset:unset}.gux-popover-wrapper{position:fixed;inset-block-start:0;inset-inline-start:0;z-index:var(--gse-semantic-zIndex-popover);display:inline-block;padding-block:8px;padding-inline:0;overflow-y:hidden;background-color:var(--gse-ui-popover-backgroundColor);border:none;border-radius:var(--gse-ui-popover-borderRadius);box-shadow:var(--gse-ui-popover-boxShadow-offsetX) var(--gse-ui-popover-boxShadow-offsetY) var(--gse-ui-popover-boxShadow-blur) var(--gse-ui-popover-boxShadow-spread) var(--gse-ui-popover-boxShadow-color);}.gux-popover-wrapper.gux-hidden{display:none}.gux-popover-wrapper .gux-arrow{position:absolute;inline-size:var(--gse-ui-popover-anchor-width);block-size:var(--gse-ui-popover-anchor-width);background:var(--gse-ui-popover-backgroundColor)}";
@@ -150,10 +150,10 @@ const GuxPopoverList = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'f42b52fb101ae28228a43b1b63380786c96e0ae7', ref: (el) => (this.popupElement = el), class: {
+        return (index.h("div", { key: '2cbd8677025be6ba4dfef8c1165149a16d0acd2a', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true, popover: "manual" }, index.h("div", { key: '4c56c1d765988e6ab6d780f3531f5268ff8edac1', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (index.h("gux-dismiss-button", { key: '5b57ef382386c628ce0f0f94e1cf6853c73f9331', onClick: this.dismiss.bind(this) })), index.h("div", { key: 'f97d9ab45434408704a6371cafa24899fd151500', class: "gux-popover-content" }, index.h("slot", { key: 'b363ec66ffaaf1e8995d7338097a52de3cc37d38' }))));
+            }, "data-placement": true, popover: "manual" }, index.h("div", { key: '7c8f422379a975dd8dc50ebcda8daa8d3c268c4f', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (index.h("gux-dismiss-button", { key: 'fec3a9253c4a9d99997ddd0bcee5e18baee45c27', onClick: this.dismiss.bind(this) })), index.h("div", { key: 'eca980665fa52dbb091f4feb814df0aecabc6b9a', class: "gux-popover-content" }, index.h("slot", { key: '5b5224973fc71787a27f37661f4a0fe0a349fdee' }))));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-popover-list.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-79505d14.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-0b237e01.js');
 const onClickOutside = require('./on-click-outside-31073d32.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 const findElementById = require('./find-element-by-id-fde17c92.js');
 
 const guxPopoverListCss = ".gux-popover-wrapper{position:fixed;inset-block-start:0;inset-inline-start:0;z-index:var(--gse-semantic-zIndex-popover);display:inline-block;padding-block:8px;padding-inline:0;background-color:var(--gse-ui-popover-backgroundColor);border-radius:var(--gse-ui-popover-borderRadius);box-shadow:var(--gse-ui-popover-boxShadow-offsetX) var(--gse-ui-popover-boxShadow-offsetY) var(--gse-ui-popover-boxShadow-blur) var(--gse-ui-popover-boxShadow-spread) var(--gse-ui-popover-boxShadow-color)}.gux-popover-wrapper.gux-hidden{display:none}.gux-popover-wrapper .gux-arrow{position:absolute;inline-size:var(--gse-ui-popover-anchor-width);block-size:var(--gse-ui-popover-anchor-width);background:var(--gse-ui-popover-backgroundColor)}";
@@ -134,10 +134,10 @@ const GuxPopoverList = class {
         }
     }
     render() {
-        return (index.h("div", { key: '1b02a01f621c02ead2e7e7f50f7dc8ff4075da8c', ref: (el) => (this.popupElement = el), class: {
+        return (index.h("div", { key: '4365357f070d653d27906fd322bb10613f5eda61', ref: (el) => (this.popupElement = el), class: {
                 'gux-hidden': !this.isOpen,
                 'gux-popover-wrapper': true
-            }, "data-placement": true }, index.h("div", { key: 'b7e1b6a96eab5bdf499f09f5bba7a2b879755eaa', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (index.h("gux-dismiss-button", { key: 'c6b2b9666fa5bb0960a8deec40d9ad3a23d449ae', onClick: this.dismiss.bind(this) })), index.h("div", { key: '4ec65a1e7c0e8eaa149abaeb6e9afae5e3306337', class: "gux-popover-content" }, index.h("slot", { key: '430a10c1a7007e442f854dbcfbce8160046c0bd0' }))));
+            }, "data-placement": true }, index.h("div", { key: 'a52166eb4517ce70b4b58a2bbf4eeec549a1b5a2', ref: (el) => (this.arrowElement = el), class: "gux-arrow" }), this.displayDismissButton && (index.h("gux-dismiss-button", { key: '6989f4b125db15a9fed242a3e5cd17ecbceaf6dd', onClick: this.dismiss.bind(this) })), index.h("div", { key: 'a27b7bc15dffeff356853d8d167b737133c289e8', class: "gux-popover-content" }, index.h("slot", { key: 'bfc8cfc0f9f8555c8383ba64f149e67006f7843b' }))));
     }
     get root() { return index.getElement(this); }
 };

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

@@ -110,13 +110,13 @@ const GuxPopup = class {
         }
     }
     render() {
-        return (index.h("div", { key: '0f088e297f3f94a7391aad49bdd07f6aec47dade', class: {
+        return (index.h("div", { key: 'e65eba8bf2ea21b2c75e5d7219e8d4ce847f14cf', class: {
                 'gux-target-container': true,
                 'gux-disabled': this.disabled
-            }, "aria-disabled": this.disabled.toString(), ref: (el) => (this.targetElementContainer = el) }, index.h("slot", { key: 'dae472fe22e9774dd5e6c859fbe20388340ca935', name: "target" }), index.h("div", { key: '301bf56aef78a42ef8edb98696b03facf445fb5b', class: {
+            }, "aria-disabled": this.disabled.toString(), ref: (el) => (this.targetElementContainer = el) }, index.h("slot", { key: '10a5ee61912e0f0155e566fa0d8a71b8dc673958', name: "target" }), index.h("div", { key: 'f45ed6fe78f16164e6141fedd8b0dd59878cf3fa', class: {
                 'gux-popup-container': true,
                 'gux-expanded': this.expanded && !this.disabled
-            }, ref: (el) => (this.popupElementContainer = el) }, index.h("slot", { key: 'b369d17d7fc08f60c4452812cfb3959a91c6ccaf', name: "popup" }))));
+            }, ref: (el) => (this.popupElementContainer = el) }, index.h("slot", { key: '04965afccbb522397d745370c3c83fa3b20c8e9b', name: "popup" }))));
     }
     static get watchers() { return {
         "expanded": ["onExpandedChange"]

package/dist/cjs/gux-radial-loading.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const index$1 = require('./index-16a4179e.js');
-const usage = require('./usage-43072083.js');
+const index$1 = require('./index-643c40f5.js');
+const usage = require('./usage-7cad50c2.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const largeSpinner = 48; // Linked to --gse-ui-progressAndLoading-spinner-large
@@ -45,7 +45,7 @@ const GuxRadialLoading = class {
         this.getI18nValue = await index$1.buildI18nForComponent(this.root, modalComponentResources);
     }
     render() {
-        return (index.h(GuxSpinnerState, { key: 'a717d08f30176cd1face7f2a96a8bc82d3e7b2f8', context: this.context, screenreaderText: this.screenreaderText || this.getI18nValue('loading') }));
+        return (index.h(GuxSpinnerState, { key: '16fb3b949cb308eb7f78ec2cfeccb490af187593', context: this.context, screenreaderText: this.screenreaderText || this.getI18nValue('loading') }));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-radial-progress.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 const logError = require('./log-error-7b9d4b57.js');
 
 const OVERALL_SIZE = 48; // Linked to --gse-ui-progressAndLoading-spinner-large

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

@@ -5,10 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-79505d14.js');
 const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 const clamp = require('./clamp-e86a226e.js');
-const usage = require('./usage-43072083.js');
+const usage = require('./usage-7cad50c2.js');
 const logError = require('./log-error-7b9d4b57.js');
 
-const guxRatingCss = ":host{display:inline-block;min-inline-size:fit-content;user-select:none}:host(:host:focus-visible){outline:var(--gse-semantic-border-focus) solid var(--gse-semantic-focusOutline-sm-borderWidth);outline-offset:var(--gse-semantic-focusOutline-offset);box-shadow:0 0 0 1px var(--gse-semantic-border-focus)}.gux-rating-star-container{display:flex;gap:var(--gse-ui-rating-star-gap);justify-content:space-between;color:var(--gse-ui-rating-default-color)}.gux-rating-star-container.gux-disabled{color:var(--gse-ui-rating-disabled-color);pointer-events:none;opacity:var(--gse-ui-rating-disabled-opacity)}.gux-rating-star-container gux-icon{flex:0 0 auto;inline-size:var(--gse-ui-rating-size);block-size:var(--gse-ui-rating-size);color:var(--gse-ui-rating-default-color)}.gux-rating-star-container gux-icon:hover:not(.gux-disabled){color:var(--gse-ui-rating-hover-color)}";
+const guxRatingCss = ":host{display:inline-block;min-inline-size:fit-content;user-select:none}:host(:host:focus-visible){outline:var(--gse-semantic-focusOutline-sm-borderWidth) solid var(--gse-semantic-border-focus);outline-offset:var(--gse-semantic-focusOutline-offset);box-shadow:0 0 0 1px var(--gse-semantic-border-focus)}.gux-rating-star-container{display:flex;gap:var(--gse-ui-rating-star-gap);justify-content:space-between;color:var(--gse-ui-rating-default-color)}.gux-rating-star-container.gux-disabled{color:var(--gse-ui-rating-disabled-color);pointer-events:none;opacity:var(--gse-ui-rating-disabled-opacity)}.gux-rating-star-container gux-icon{flex:0 0 auto;inline-size:var(--gse-ui-rating-size);block-size:var(--gse-ui-rating-size);color:var(--gse-ui-rating-default-color)}.gux-rating-star-container gux-icon:hover:not(.gux-disabled){color:var(--gse-ui-rating-hover-color)}";
 const GuxRatingStyle0 = guxRatingCss;
 
 const GuxRating = class {
@@ -55,10 +55,12 @@ const GuxRating = class {
         const increment = this.increment === 'half' ? 0.5 : 1;
         switch (event.key) {
             case 'ArrowUp':
+            case 'ArrowRight':
                 event.preventDefault();
                 this.updateRatingValue(this.value + increment);
                 break;
             case 'ArrowDown':
+            case 'ArrowLeft':
                 event.preventDefault();
                 this.updateRatingValue(this.value - increment);
                 break;
@@ -108,7 +110,7 @@ const GuxRating = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '45411c1655a6a9732c340ac435bd006971b21445', role: "spinbutton", tabindex: this.getTabIndex(), "aria-readonly": this.readonly.toString(), "aria-valuenow": this.value, "aria-valuemin": "0", "aria-valuemax": this.maxValue }, index.h("div", { key: '0bc889c9cfd3275304c20f296925f147074e05c4', ref: (el) => (this.starContainer = el), class: {
+        return (index.h(index.Host, { key: '7a1f7dd943fd797480d21133fe1ee6237dfc257e', role: "spinbutton", tabindex: this.getTabIndex(), "aria-readonly": this.readonly.toString(), "aria-valuenow": this.value, "aria-valuemin": "0", "aria-valuemax": this.maxValue }, index.h("div", { key: 'fe8a2ceb34c2d514f7ecffd0e1d3c8675aee515d', ref: (el) => (this.starContainer = el), class: {
                 'gux-rating-star-container': true,
                 'gux-disabled': this.disabled
             } }, this.getRatingStarElements())));

package/dist/cjs/gux-rich-style-list-item.cjs.entry.js

@@ -0,0 +1,44 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-79505d14.js');
+const usage = require('./usage-7cad50c2.js');
+const getClosestElement = require('./get-closest-element-9e41d6b9.js');
+
+const guxRichStyleListItemCss = ":host{inline-size:100%;text-align:start;outline:none}:host([disabled]){pointer-events:none}:host([disabled=false]){pointer-events:auto}::slotted(gux-icon){inline-size:var(--gse-ui-menu-option-startIcon-height);block-size:var(--gse-ui-menu-option-startIcon-height);margin-inline-end:var(--gse-ui-menu-option-gap);vertical-align:middle}button{all:unset;box-sizing:border-box;inline-size:100%;min-block-size:var(--gse-ui-menu-option-height);padding:var(--gse-ui-menu-option-padding);font-family:var(--gse-ui-menu-option-label-default-text-fontFamily);font-size:var(--gse-ui-menu-option-label-default-text-fontSize);font-weight:var(--gse-ui-menu-option-label-default-text-fontWeight);line-height:var(--gse-ui-menu-option-label-default-text-lineHeight);color:var(--gse-ui-menu-option-label-foregroundColor);word-wrap:break-word;cursor:pointer;background-color:var(--gse-ui-menu-option-default-backgroundColor);border:none;outline:none;outline-offset:calc(var(--gse-ui-menu-option-focus-border-width) * -1)}button:focus-visible:not(:disabled){border-radius:var(--gse-semantic-focusOutline-sm-borderRadius);outline:var(--gse-ui-menu-option-focus-border-width) var(--gse-ui-menu-option-focus-border-style) var(--gse-ui-menu-option-focus-border-color)}button:hover:not(:disabled){background:var(--gse-ui-menu-option-hover-backgroundColor)}button:active:not(:disabled){font-family:var(--gse-ui-menu-option-label-active-text-fontFamily);font-size:var(--gse-ui-menu-option-label-active-text-fontSize);font-weight:var(--gse-ui-menu-option-label-active-text-fontWeight);line-height:var(--gse-ui-menu-option-label-active-text-lineHeight);background:var(--gse-ui-menu-option-selected-backgroundColor)}button:disabled{cursor:default;opacity:var(--gse-ui-menu-option-disabled-opacity)}::slotted(*){margin:0}";
+const GuxRichStyleListItemStyle0 = guxRichStyleListItemCss;
+
+const GuxRichStyleListItem = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.disabled = false;
+        this.value = undefined;
+    }
+    onMouseUp() {
+        this.focusParentList();
+    }
+    onMouseOver() {
+        this.focusParentList();
+    }
+    focusParentList() {
+        const parentList = getClosestElement.getClosestElement('gux-rich-text-editor-list', this.root);
+        if (parentList && parentList.shadowRoot.activeElement === null) {
+            this.root.blur();
+            parentList.focus({
+                preventScroll: true
+            });
+        }
+    }
+    componentWillLoad() {
+        usage.trackComponent(this.root);
+    }
+    render() {
+        return (index.h(index.Host, { key: '6dc607e4a0056690a26c91a6331de686902859c0', role: "listitem" }, index.h("button", { key: '0cdfdd84992f119f429daff01062ae3c07a8e49b', type: "button", tabIndex: -1, disabled: this.disabled }, index.h("slot", { key: 'a9f637910c0a06ab2030e16bc3abfbc692391014' }))));
+    }
+    static get delegatesFocus() { return true; }
+    get root() { return index.getElement(this); }
+};
+GuxRichStyleListItem.style = GuxRichStyleListItemStyle0;
+
+exports.gux_rich_style_list_item = GuxRichStyleListItem;

package/dist/cjs/gux-rich-text-editor-action-group.cjs.entry.js

@@ -18,7 +18,7 @@ const GuxRichTextEditorActionGroup = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '031a1f2892b46409c272804d96d320fdce1b8776' }, index.h("div", { key: '8966532264cd6124fd123a05ebb429e7a97f8c41', class: "gux-action-group-container" }, index.h("slot", { key: '00a35806cdf7e5e98dec58147262400e7ac59db4' })), this.renderActionGroupDivider()));
+        return (index.h(index.Host, { key: '2422c0033a6a55bf6f24e13b17423a694055a3c1' }, index.h("div", { key: '55abdcfe3509f92b5fc7f59fd74c7231ba2092aa', class: "gux-action-group-container" }, index.h("slot", { key: 'a9012112cc1a1b3909be863466102ed6079131c6' })), this.renderActionGroupDivider()));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-rich-text-editor-action-rich-style.cjs.entry.js

@@ -0,0 +1,187 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-79505d14.js');
+const usage = require('./usage-7cad50c2.js');
+const guxRichTextEditor_service = require('./gux-rich-text-editor.service-8a6cb26a.js');
+const onClickOutside = require('./on-click-outside-31073d32.js');
+const afterNextRender = require('./after-next-render-162425fe.js');
+const index$1 = require('./index-643c40f5.js');
+require('./get-closest-element-26170ce0.js');
+require('./get-closest-element-9e41d6b9.js');
+
+const guxRichTextEditorActionRichStyleCss = ":host{display:block}gux-button-slot button{display:flex;flex-direction:row;gap:4px;align-items:center;justify-content:center}gux-button-slot button.gux-is-pressed{color:var(--gse-ui-button-ghost-active-foregroundColor);background-color:var(--gse-ui-button-ghost-active-backgroundColor)}.gux-list-container{inline-size:214px;margin:0;overflow-y:auto;background:var(--gse-ui-menu-backgroundColor);border-color:var(--gse-ui-menu-border-color);border-style:var(--gse-ui-menu-border-style);border-width:var(--gse-ui-menu-border-width);border-radius:var(--gse-ui-menu-borderRadius);box-shadow:var(--gse-ui-menu-boxShadow-offsetX) var(--gse-ui-menu-boxShadow-offsetY) var(--gse-ui-menu-boxShadow-blur) var(--gse-ui-menu-boxShadow-spread) var(--gse-ui-menu-boxShadow-color)}";
+const GuxRichTextEditorActionRichStyleStyle0 = guxRichTextEditorActionRichStyleCss;
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const GuxRichTextEditorActionRichStyle = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.value = undefined;
+        this.expanded = false;
+        this.disabled = false;
+    }
+    onClickOutside() {
+        this.expanded = false;
+    }
+    watchValue(newValue) {
+        this.validateValue(newValue, this.listElement);
+    }
+    watchDisabled(disabled) {
+        if (disabled) {
+            this.expanded = false;
+        }
+    }
+    onInternallistitemsupdated(event) {
+        event.stopPropagation();
+        index.forceUpdate(this.root);
+    }
+    handleKeydown(event) {
+        const isButtonEvent = event.composedPath().includes(this.actionButton);
+        const isListEvent = event.composedPath().includes(this.listElement);
+        switch (event.key) {
+            case 'Escape':
+                if (isListEvent) {
+                    event.preventDefault();
+                    this.expanded = false;
+                    this.actionButton.focus();
+                }
+                break;
+            case 'ArrowDown':
+            case 'Enter': {
+                if (isButtonEvent && !this.expanded) {
+                    event.preventDefault();
+                    this.expanded = true;
+                    this.focusFirstListItem();
+                }
+                break;
+            }
+            case 'Tab':
+                this.expanded = false;
+                break;
+            case 'ArrowUp':
+                if (isButtonEvent && !this.expanded) {
+                    event.preventDefault();
+                    this.expanded = true;
+                    this.focusLastListItem();
+                }
+        }
+    }
+    handleKeyup(event) {
+        switch (event.key) {
+            case ' ': {
+                if (event.composedPath().includes(this.actionButton)) {
+                    event.preventDefault();
+                    this.expanded = true;
+                    this.focusFirstListItem();
+                }
+                break;
+            }
+        }
+    }
+    focusFirstListItem() {
+        afterNextRender.afterNextRender(() => {
+            void this.listElement.guxFocusFirstItem();
+        });
+    }
+    focusLastListItem() {
+        afterNextRender.afterNextRender(() => {
+            void this.listElement.guxFocusLastItem();
+        });
+    }
+    async componentWillLoad() {
+        usage.trackComponent(this.root);
+        this.i18n = await index$1.buildI18nForComponent(this.root, guxRichTextEditor_service.translationResources);
+    }
+    componentWillRender() {
+        if (this === null || this === void 0 ? void 0 : this.listElement) {
+            this.validateValue(this.value, this.listElement);
+        }
+    }
+    validateValue(newValue, listElement) {
+        if (newValue === undefined) {
+            listElement.value = newValue;
+            return;
+        }
+        const selectedListItem = this.getListItemElementByValue(newValue);
+        if (selectedListItem) {
+            listElement.value = newValue;
+            return;
+        }
+    }
+    get listItemElements() {
+        const slot = this.listElement.querySelector('slot');
+        if (slot) {
+            return Array.from(slot.assignedElements());
+        }
+    }
+    getListItemElementByValue(value) {
+        return this.listItemElements.find(itemElement => {
+            return itemElement.value === value;
+        });
+    }
+    renderTargetDisplay() {
+        if (this === null || this === void 0 ? void 0 : this.listElement) {
+            const selectedListItemElement = this.getListItemElementByValue(this.value);
+            if (selectedListItemElement) {
+                return (index.h("span", null, this.renderListItem(selectedListItemElement)));
+            }
+        }
+    }
+    renderListItem(item) {
+        return (index.h("gux-truncate", { "max-lines": 1 }, item.textContent));
+    }
+    onActionButtonClick() {
+        this.expanded = !this.expanded;
+        if (this.expanded) {
+            this.focusFirstListItem();
+        }
+    }
+    updateValue(newValue) {
+        if (this.value !== newValue) {
+            this.value = newValue;
+        }
+    }
+    onListClick(event) {
+        // Ensure we get the closest `gux-rich-style-list-item` if the click is on a nested element eg h1,h2,h3.
+        const listItem = event.target.closest('gux-rich-style-list-item');
+        if (listItem) {
+            this.expanded = false;
+            this.updateValue(listItem.value);
+            this.actionButton.focus();
+        }
+    }
+    renderPopup() {
+        return (index.h("div", { class: "gux-list-container", slot: "popup" }, index.h("gux-rich-text-editor-list", { ref: el => (this.listElement = el), onClick: e => this.onListClick(e) }, index.h("slot", null))));
+    }
+    renderTarget() {
+        return (index.h("gux-button-slot", { accent: "ghost", slot: "target" }, index.h("button", { type: "button", ref: el => (this.actionButton = el), class: { 'gux-is-pressed': this.expanded }, onClick: () => this.onActionButtonClick(), disabled: this.disabled || guxRichTextEditor_service.hasDisabledParent(this.root), "aria-haspopup": "true", "aria-expanded": this.expanded.toString() }, this.renderTargetDisplay(), index.h("gux-icon", { "icon-name": this.expanded
+                ? 'custom/chevron-up-small-regular'
+                : 'custom/chevron-down-small-regular', "screenreader-text": this.i18n('richStyleDropdown') }))));
+    }
+    render() {
+        return (index.h("gux-popup", { key: 'ead5e0b9266ba91cb3d455621081794c3439cd4f', expanded: this.expanded, exceedTargetWidth: true, placement: "bottom-start" }, this.renderTarget(), this.renderPopup()));
+    }
+    static get delegatesFocus() { return true; }
+    get root() { return index.getElement(this); }
+    static get watchers() { return {
+        "value": ["watchValue"],
+        "disabled": ["watchDisabled"]
+    }; }
+};
+__decorate([
+    onClickOutside.OnClickOutside({ triggerEvents: 'mousedown' })
+], GuxRichTextEditorActionRichStyle.prototype, "onClickOutside", null);
+GuxRichTextEditorActionRichStyle.style = GuxRichTextEditorActionRichStyleStyle0;
+
+exports.gux_rich_text_editor_action_rich_style = GuxRichTextEditorActionRichStyle;

package/dist/cjs/gux-rich-text-editor-action.cjs.entry.js

@@ -3,73 +3,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-79505d14.js');
-const usage = require('./usage-43072083.js');
-const index$1 = require('./index-16a4179e.js');
-const getClosestElement = require('./get-closest-element-26170ce0.js');
+const usage = require('./usage-7cad50c2.js');
+const index$1 = require('./index-643c40f5.js');
+const guxRichTextEditor_service = require('./gux-rich-text-editor.service-8a6cb26a.js');
 require('./get-closest-element-9e41d6b9.js');
+require('./get-closest-element-26170ce0.js');
 
-const bold = "Bold";
-const italic = "Italic";
-const underline = "Underline";
-const strike = "Strike";
-const codeblock = "Code Block";
-const blockQuote = "Block Quote";
-const orderedList = "Ordered List";
-const bulletList = "Bullet List";
-const clearFormatting = "Clear Formatting";
-const undo = "Undo";
-const redo = "Redo";
-const translationResources = {
-	bold: bold,
-	italic: italic,
-	underline: underline,
-	strike: strike,
-	codeblock: codeblock,
-	blockQuote: blockQuote,
-	orderedList: orderedList,
-	bulletList: bulletList,
-	clearFormatting: clearFormatting,
-	undo: undo,
-	redo: redo,
-	"delete": "Delete"
-};
-
-function calculateDisabledState(root) {
-    const getParent = getClosestElement.getClosestElement(root, 'gux-rich-text-editor-beta');
-    return !!((getParent === null || getParent === void 0 ? void 0 : getParent.disabled) || (root === null || root === void 0 ? void 0 : root.hasAttribute('disabled')));
-}
-function returnActionTypeIcon(action) {
-    switch (action) {
-        case 'bold':
-            return 'fa/bold-regular';
-        case 'italic':
-            return 'fa/italic-regular';
-        case 'underline':
-            return 'fa/underline-regular';
-        case 'strike':
-            return 'fa/strikethrough-regular';
-        case 'codeblock':
-            return 'fa/code-regular';
-        case 'blockQuote':
-            return 'fa/quote-right-regular';
-        case 'orderedList':
-            return 'fa/list-ol-regular';
-        case 'bulletList':
-            return 'fa/list-ul-regular';
-        case 'clearFormatting':
-            return 'fa/eraser-regular';
-        case 'undo':
-            return 'custom/undo-regular';
-        case 'redo':
-            return 'custom/redo-regular';
-        case 'delete':
-            return 'fa/trash-regular';
-        default:
-            return 'fa/bold-regular';
-    }
-}
-
-const guxRichTextEditorActionCss = ":host{display:block}gux-button-slot{inline-size:var(--gse-ui-button-iconOnly-width);block-size:var(--gse-ui-button-default-height)}gux-button-slot button.gux-is-active{color:var(--gse-ui-button-ghost-active-foregroundColor);background-color:var(--gse-ui-button-ghost-active-backgroundColor)}gux-button-slot gux-icon{inline-size:var(--gse-ui-button-icon-size);block-size:var(--gse-ui-button-icon-size)}";
+const guxRichTextEditorActionCss = ":host{display:block}gux-button-slot{inline-size:var(--gse-ui-button-iconOnly-width);block-size:var(--gse-ui-button-default-height)}gux-button-slot button.gux-is-pressed{color:var(--gse-ui-button-ghost-active-foregroundColor);background-color:var(--gse-ui-button-ghost-active-backgroundColor)}gux-button-slot gux-icon{inline-size:var(--gse-ui-button-icon-size);block-size:var(--gse-ui-button-icon-size)}";
 const GuxRichTextEditorActionStyle0 = guxRichTextEditorActionCss;
 
 const GuxRichTextEditorAction = class {
@@ -81,8 +21,7 @@ const GuxRichTextEditorAction = class {
     }
     async componentWillLoad() {
         usage.trackComponent(this.root, { variant: this.action });
-        this.i18n = await index$1.buildI18nForComponent(this.root, translationResources);
-        this.disabled = calculateDisabledState(this.root);
+        this.i18n = await index$1.buildI18nForComponent(this.root, guxRichTextEditor_service.translationResources);
     }
     renderTooltip() {
         if (!this.disabled) {
@@ -90,7 +29,7 @@ const GuxRichTextEditorAction = class {
         }
     }
     renderActionButton() {
-        return (index.h("gux-button-slot", { accent: "ghost", "icon-only": true }, index.h("button", { type: "button", disabled: this.disabled, class: { 'gux-is-active': this.isActive }, "aria-pressed": this.isActive.toString() }, index.h("gux-icon", { "icon-name": returnActionTypeIcon(this.action), "screenreader-text": this.i18n(this.action) })), this.renderTooltip()));
+        return (index.h("gux-button-slot", { accent: "ghost", "icon-only": true }, index.h("button", { type: "button", disabled: this.disabled || guxRichTextEditor_service.hasDisabledParent(this.root), class: { 'gux-is-pressed': this.isActive }, "aria-pressed": this.isActive.toString() }, index.h("gux-icon", { "icon-name": guxRichTextEditor_service.returnActionTypeIcon(this.action), "screenreader-text": this.i18n(this.action) })), this.renderTooltip()));
     }
     render() {
         return this.renderActionButton();