genesys-spark-components 4.137.1 → 4.138.0

package/dist/cjs/gux-content-search.cjs.entry.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const usage = require('./usage-47b5afb6.js');
-const index$1 = require('./index-3ee995a4.js');
+const index = require('./index-e321455d.js');
+const usage = require('./usage-66f3f455.js');
+const index$1 = require('./index-aa48ea67.js');
 const onAttributeChange = require('./on-attribute-change-a9f44523.js');
 const focusInputElement = require('./focus-input-element-3a0c1858.js');
 require('./get-closest-element-9e41d6b9.js');
@@ -29,10 +29,14 @@ const GuxContentSearch = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.guxcurrentmatchchanged = index.createEvent(this, "guxcurrentmatchchanged", 7);
+        /**
+         * The Match Count
+         */
         this.matchCount = 0;
+        /**
+         * The Current match count which needs to highlighted
+         */
         this.currentMatch = 0;
-        this.disabled = undefined;
-        this.value = undefined;
     }
     /**
      * Clears the input.
@@ -66,10 +70,10 @@ const GuxContentSearch = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'c5ad299cf0e2f1ed000be6ffa40ca104633c8df4', class: {
+        return (index.h("div", { key: 'dcb6954c7a1dfe5eaa09537f822c0fe1fedad428', class: {
                 'gux-content-search': true,
                 'gux-disabled': this.disabled
-            }, onClick: () => focusInputElement.focusInputElement(this.inputSlottedElement) }, index.h("div", { key: 'b95c53ba01916a6c1f99c62cdf8d8022ba6eb01e', class: "gux-search-icon" }, index.h("gux-icon", { key: '37ddbf8a24c5aaa01340420860105bc85a7fec42', size: "small", decorative: true, "icon-name": "fa/magnifying-glass-regular" })), index.h("slot", { key: 'f1234d5ba895dd9cfffa59fa9ab91a9cc7ad7318' }), this.getNavigationPanel()));
+            }, onClick: () => focusInputElement.focusInputElement(this.inputSlottedElement) }, index.h("div", { key: '738339b0abcfb1fc67e366271045fdd6e5cc5bb4', class: "gux-search-icon" }, index.h("gux-icon", { key: '5caddb780225556dbb10ea0f88d735fb1efba780', size: "small", decorative: true, "icon-name": "fa/magnifying-glass-regular" })), index.h("slot", { key: '3519f441eb8cada75bdf3c1fc21c4f1bffbf7c8b' }), this.getNavigationPanel()));
     }
     getNavigationPanel() {
         if (this.showNavigationPanel()) {

package/dist/cjs/gux-context-menu.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
+const index = require('./index-e321455d.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
-const usage = require('./usage-47b5afb6.js');
-const index$1 = require('./index-3ee995a4.js');
-const onClickOutside = require('./on-click-outside-bfd599ca.js');
+const usage = require('./usage-66f3f455.js');
+const index$1 = require('./index-aa48ea67.js');
+const onClickOutside = require('./on-click-outside-8a2d3a8e.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
 const whenEventIsFrom = require('./when-event-is-from-dd77a8d3.js');
 require('./get-closest-element-9e41d6b9.js');
@@ -33,10 +33,27 @@ const GuxContextMenu = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.buttonId = randomHtmlId.randomHTMLId();
+        /**
+         * Indicates button density style. Intended to be paired with gux-table property.
+         */
         this.compact = false;
+        /**
+         * Controls the disabled state of the internal button
+         */
         this.disabled = false;
+        /**
+         * Screenreader text for context menu button
+         * defaults to "context menu"
+         */
         this.screenreaderText = '';
+        /**
+         * Placement of the popup
+         * defaults to is "bottom-start"
+         */
         this.placement = 'bottom-start';
+        /**
+         * Controls the visibility of the popover list
+         */
         this.isOpen = false;
     }
     /**
@@ -122,8 +139,8 @@ const GuxContextMenu = class {
         this.i18n = await index$1.buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (index.h(index.Host, { key: '5a4c210aa7fa86899cf70f1a49f46d06e475cab9' }, index.h("gux-popup", { key: '5454cb497b689fb2655d8b18c4c7175b95d6f1fd', placement: this.placement, expanded: this.isOpen, offset: 4, "exceed-target-width": true }, index.h("div", { key: 'ba4d809aefe94a5861163e088c77642d7b9c6928', slot: "target", class: "gux-button-container" }, index.h("gux-button-slot", { key: 'b22fcb340fd9924ea7ced201368bb980e216bc42', accent: "ghost" }, index.h("button", { key: 'a6c637e941d95606d50fb13b22e6115e17834f7d', type: "button", onClick: () => this.onButtonClick(), id: this.buttonId, class: { 'gux-compact': this.compact }, ref: el => (this.button = el), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), disabled: this.disabled }, index.h("gux-icon", { key: '4c204be4799f8d81430c74cae579f05ab2c5443e', "icon-name": "fa/ellipsis-vertical-regular", "screenreader-text": this.screenreaderText ||
-                this.i18n('contextMenuScreenreaderText'), size: "small" })))), index.h("div", { key: '304ed678c9ef75e5e29cc2e4b6d23077b4bc900c', slot: "popup", class: "gux-list-container" }, index.h("gux-list", { key: 'c7b0411d988cb0f8ce0301dccf813b107955a982', onClick: e => this.onListClick(e), ref: el => (this.listElement = el) }, index.h("slot", { key: 'ceead50c5d2b03d2bf2341ef775f81b0fff6afa4' }))))));
+        return (index.h(index.Host, { key: 'fbeb395dcd997e46dabb8dee1d4dd71aa7e973a4' }, index.h("gux-popup", { key: '1fa5fc5fd9c6f29e9ef3dac05a57d46bdbfc5216', placement: this.placement, expanded: this.isOpen, offset: 4, "exceed-target-width": true }, index.h("div", { key: '6dba4965728f08e74fcb5c97de15c65098f479e4', slot: "target", class: "gux-button-container" }, index.h("gux-button-slot", { key: '07d0f540d71554595b95f80d3761289e8cea8d80', accent: "ghost" }, index.h("button", { key: 'd03776600b914eebf84a2c778bf6342197027a06', type: "button", onClick: () => this.onButtonClick(), id: this.buttonId, class: { 'gux-compact': this.compact }, ref: el => (this.button = el), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString(), disabled: this.disabled }, index.h("gux-screen-reader-beta", { key: '13a892661c665a98f8db2b497f8b24fe343a00f2' }, this.screenreaderText ||
+            this.i18n('contextMenuScreenreaderText')), index.h("gux-icon", { key: '04235a7dad3b948d3b625ec9401997660916bd5c', "icon-name": "fa/ellipsis-vertical-regular", size: "small", decorative: true })))), index.h("div", { key: '33ea3a235089329b796aff39e3f2be74dc32ce43', slot: "popup", class: "gux-list-container" }, index.h("gux-list", { key: '13950efa372613ecd95bca4203364e7d754028f5', onClick: e => this.onListClick(e), ref: el => (this.listElement = el) }, index.h("slot", { key: 'e9b2f596b5c4b976a17dc9342879f8662a32eef0' }))))));
     }
     static get delegatesFocus() { return true; }
     get root() { return index.getElement(this); }

package/dist/cjs/gux-copy-to-clipboard.cjs.entry.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const usage = require('./usage-47b5afb6.js');
-const index$1 = require('./index-3ee995a4.js');
+const index = require('./index-e321455d.js');
+const usage = require('./usage-66f3f455.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const clickToCopy = "Click to Copy";
@@ -66,7 +66,7 @@ const GuxCopyToClipboard = class {
         this.i18n = await index$1.buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (index.h("button", { key: '424ad51c007871467bf2be7ff12afb9462c97744', class: "gux-copy-to-clipboard-wrapper", onClick: this.onCopyToClipboard.bind(this) }, index.h("div", { key: '7b16c8ef23bd1b06d6124b7a7c68a68706d29127', class: "gux-copy-content" }, index.h("slot", { key: 'e99aa86b73857ede7899146de32060b0ff13b530', name: "content" }), index.h("gux-icon", { key: 'e869de2c6b8ec78049577e97ddf7bcf24947986e', "icon-name": "fa/copy-regular", size: "small", decorative: true })), this.renderTooltip()));
+        return (index.h("button", { key: '402c877cac07124174c54c374b9ac3d1fdc7c538', class: "gux-copy-to-clipboard-wrapper", onClick: this.onCopyToClipboard.bind(this) }, index.h("div", { key: 'e92c093e1df2111acaca09e1497af6234b22cb20', class: "gux-copy-content" }, index.h("slot", { key: '106a6cae849ff8f21533bbb9a2c5474ca81fb471', name: "content" }), index.h("gux-icon", { key: '99661a03966909eea40f77fa3df3e80c1a1101c3', "icon-name": "fa/copy-regular", size: "small", decorative: true })), this.renderTooltip()));
     }
     get root() { return index.getElement(this); }
 };

package/dist/cjs/gux-create-option.cjs.entry.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
+const index = require('./index-e321455d.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
-const index$1 = require('./index-3ee995a4.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const createCustomOptionInstructions = ", select to create a new custom option";
@@ -21,7 +21,6 @@ const GuxCreateOption = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.internalcreatenewoption = index.createEvent(this, "internalcreatenewoption", 7);
-        this.value = undefined;
         this.active = false;
         this.hidden = true;
         this.filtered = true;
@@ -48,11 +47,11 @@ const GuxCreateOption = class {
         return (index.h("span", { class: "gux-screenreader" }, this.i18n('createCustomOptionInstructions')));
     }
     render() {
-        return (index.h(index.Host, { key: '94933ca9614787b7de00588f1564775b443bdb35', role: "option", "aria-selected": false, class: {
+        return (index.h(index.Host, { key: '9db1140d65fd28e74261308671451e71e32cc00d', role: "option", "aria-selected": false, class: {
                 'gux-active': this.active,
                 'gux-hovered': this.hovered,
                 'gux-filtered': this.filtered
-            } }, index.h("div", { key: '6d5228c7f34a4de52803a3e3dfe40ed2523b013e', class: "gux-option" }, index.h("gux-icon", { key: '69e58916b80ff3b07fccbd87f6326d30a468a198', decorative: true, "icon-name": "fa/plus-regular", size: "small" }), index.h("div", { key: '4edbf7e33b222810eada9ae9d1898ac23bd7ab0b', class: "gux-create-text" }, this.i18n('createOption', {
+            } }, index.h("div", { key: '219fd2ac6d3ca86646f58e669dfc49c626ef6d5a', class: "gux-option" }, index.h("gux-icon", { key: 'ede2a90067a61a6bec51f9897a81b4cd821e5a96', decorative: true, "icon-name": "fa/plus-regular", size: "small" }), index.h("div", { key: 'eb457b3ec2d80ece75b42f7176b0abbe87ca2912', class: "gux-create-text" }, this.i18n('createOption', {
             optionValue: this.value
         })), this.renderCustomOptionInstructions())));
     }

package/dist/cjs/gux-cta-group.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
+const index = require('./index-e321455d.js');
 const logError = require('./log-error-7b9d4b57.js');
 
 const guxCtaGroupCss = ":host{display:block}.gux-cta-group{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gse-ui-ctaGroup-gap);justify-content:start}.gux-cta-group.gux-end-align{flex-direction:row-reverse;justify-content:end}.gux-cta-group ::slotted(gux-button){flex:0 1 auto;min-inline-size:0}";
@@ -11,7 +11,13 @@ const GuxCtaGroupStyle0 = guxCtaGroupCss;
 const GuxCTAGroup = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        /**
+         * Sets the buttons alignment
+         */
         this.align = 'start';
+        /**
+         * Defines if the primary button should have a danger accent
+         */
         this.dangerous = false;
     }
     validatePrimarySlot(slottedElement) {

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

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const usage = require('./usage-47b5afb6.js');
-const getValidTimezone = require('./get-valid-timezone-2f200f69.js');
+const index = require('./index-e321455d.js');
+const usage = require('./usage-66f3f455.js');
+const getValidTimezone = require('./get-valid-timezone-6d0cf04e.js');
 const intl = require('./intl-ed89316c.js');
 const useRegionalDates = require('./use-regional-dates-4d3f1b9d.js');
-const index$1 = require('./index-3ee995a4.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-26170ce0.js');
 require('./get-closest-element-9e41d6b9.js');
 
@@ -15,9 +15,14 @@ const GuxDate = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.hasRegionalDatesCookie = false;
+        /**
+         * The ISO string representation of the date to format
+         */
         this.datetime = new Date().toISOString();
+        /**
+         * Format option type
+         */
         this.format = 'short';
-        this.timeZone = undefined;
     }
     componentWillLoad() {
         usage.trackComponent(this.root);

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

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const usage = require('./usage-47b5afb6.js');
-const getValidTimezone = require('./get-valid-timezone-2f200f69.js');
+const index = require('./index-e321455d.js');
+const usage = require('./usage-66f3f455.js');
+const getValidTimezone = require('./get-valid-timezone-6d0cf04e.js');
 const intl = require('./intl-ed89316c.js');
 const useRegionalDates = require('./use-regional-dates-4d3f1b9d.js');
-const index$1 = require('./index-3ee995a4.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-26170ce0.js');
 require('./get-closest-element-9e41d6b9.js');
 
@@ -15,9 +15,14 @@ const GuxDateTime = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.hasRegionalDatesCookie = false;
+        /**
+         * The ISO string representation of the datetime to format
+         */
         this.datetime = new Date().toISOString();
+        /**
+         * Format option type
+         */
         this.format = 'short';
-        this.timeZone = undefined;
     }
     componentWillLoad() {
         usage.trackComponent(this.root);

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

@@ -2,14 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
+const index = require('./index-e321455d.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-471324c9.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
 const isoDates = require('./iso-dates-2daf4199.js');
-const onClickOutside = require('./on-click-outside-bfd599ca.js');
-const usage = require('./usage-47b5afb6.js');
-const index$1 = require('./index-3ee995a4.js');
+const onClickOutside = require('./on-click-outside-8a2d3a8e.js');
+const usage = require('./usage-66f3f455.js');
+const index$1 = require('./index-aa48ea67.js');
 const intl = require('./intl-ed89316c.js');
 const useRegionalDates = require('./use-regional-dates-4d3f1b9d.js');
 require('./get-closest-element-9e41d6b9.js');
@@ -173,21 +173,46 @@ const GuxDatepicker = class {
         this.lastYear = new Date().getFullYear();
         this.startInputId = randomHtmlId.randomHTMLId('gux-datepicker');
         this.endInputId = randomHtmlId.randomHTMLId('gux-datepicker');
-        this.value = undefined;
+        /**
+         * The datepicker label (can be a single label, or two separated by a comma if it's a range datepicker)
+         */
         this.label = '';
+        /**
+         * The datepicker number of months displayed
+         */
         this.numberOfMonths = 1;
-        this.startDayOfWeek = undefined;
+        /**
+         * The min date selectable
+         */
         this.minDate = '';
+        /**
+         * The max date selectable
+         */
         this.maxDate = '';
+        /**
+         * The calendar mode (can be single or range)
+         */
         this.mode = "single" /* CalendarModes.Single */;
-        this.format = undefined;
+        /**
+         * Disable the input and prevent interactions.
+         */
         this.disabled = false;
         this.labelPosition = 'beside';
+        /**
+         * The datepicker current value
+         */
         this.formattedValue = '';
-        this.minDateDate = undefined;
-        this.maxDateDate = undefined;
+        /**
+         * The datepicker current value
+         */
         this.toFormattedValue = '';
+        /**
+         * Uses styling to control visibility of the calendar element
+         */
         this.active = false;
+        /**
+         * Tracks the amount of key presses when focusing on the input.
+         */
         this.pressedKeys = [];
     }
     watchValue() {
@@ -651,7 +676,7 @@ const GuxDatepicker = class {
             } }, index.h("label", { htmlFor: this.endInputId, class: "gux-datepicker-field-label" }, this.getCalendarLabels()[1]), index.h("div", { class: "gux-datepicker-field-input" }, index.h("div", { class: "gux-datepicker-field-text-input" }, index.h("input", { id: this.endInputId, type: "text", ref: (el) => (this.toInputElement = el), onMouseUp: e => this.onInputMouseUp(e), onFocusin: e => this.onInputFocusIn(e), onFocusout: () => this.onInputFocusOut(), value: this.toFormattedValue, disabled: this.disabled }), this.renderCalendarToggleButton()))));
     }
     render() {
-        return (index.h("div", { key: 'b9214b306a78a2a6d49a36a14f716271f314ea2e', class: {
+        return (index.h("div", { key: '9b6737412b9c14de513320e17ba00e815802f069', class: {
                 'gux-datepicker': true,
                 'gux-active': this.active,
                 'gux-disabled': this.disabled

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

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const index$1 = require('./index-3ee995a4.js');
+const index = require('./index-e321455d.js');
+const index$1 = require('./index-aa48ea67.js');
 const intl = require('./intl-ed89316c.js');
-const index_umd = require('./index.umd-5b362f2d.js');
+const index_umd = require('./index.umd-8ef51377.js');
 require('./get-closest-element-9e41d6b9.js');
 require('./get-closest-element-26170ce0.js');
 require('./_commonjsHelpers-0192c5b3.js');
@@ -41,9 +41,6 @@ const GuxDayBetaStyle0 = guxDayCss;
 const GuxDay = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.day = undefined;
-        this.disabled = undefined;
-        this.date = undefined;
     }
     /* Watcher to sync the internal date with the day attribute on changes */
     onDayPropChange() {

package/dist/cjs/gux-disclosure-button-legacy.cjs.entry.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
+const index = require('./index-e321455d.js');
 const randomHtmlId = require('./random-html-id-71c43d5a.js');
-const usage = require('./usage-47b5afb6.js');
-const index$1 = require('./index-3ee995a4.js');
+const usage = require('./usage-66f3f455.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const defaultLabel = "Disclosure button";
@@ -21,9 +21,17 @@ const GuxDisclosureButtonLegacy = class {
         index.registerInstance(this, hostRef);
         this.active = index.createEvent(this, "active", 7);
         this.panelId = randomHtmlId.randomHTMLId('gux-disclosure-button-panel');
+        /**
+         * Indicates the position of the button panel
+         */
         this.position = 'left';
-        this.label = undefined;
+        /**
+         * Used to open or close the disclosure panel
+         */
         this.isOpen = false;
+        /**
+         * Indicated image used by button
+         */
         this.icon = 'fa/caret-right-solid';
     }
     watchIsOpen() {
@@ -50,10 +58,10 @@ const GuxDisclosureButtonLegacy = class {
         this.updateIcon();
     }
     render() {
-        return (index.h("div", { key: 'bef8cddef519a2cb8ec12c152afade245c76c714', class: `gux-disclosure-button-container gux-${this.position}` }, index.h("button", { key: 'e48597f1285fb2f53868912d0d1d04220688aff0', class: "gux-disclosure-button", onClick: () => this.changeState(), "aria-controls": this.panelId, "aria-expanded": this.isOpen.toString(), "aria-label": this.label || this.i18n('defaultLabel') }, index.h("gux-icon", { key: '505d17fcb664df950b98817214455c8e0960c737', "icon-name": `${this.icon}`, decorative: true })), index.h("div", { key: '03fac25eea867bf43f87a06bb2098abee7f8c7ee', id: this.panelId, class: {
+        return (index.h("div", { key: 'dfd11315797588b49d1f799786a294842013d48d', class: `gux-disclosure-button-container gux-${this.position}` }, index.h("button", { key: '164ea67f06014b3b78860e180b633bcb3f63d6d6', class: "gux-disclosure-button", onClick: () => this.changeState(), "aria-controls": this.panelId, "aria-expanded": this.isOpen.toString(), "aria-label": this.label || this.i18n('defaultLabel') }, index.h("gux-icon", { key: 'a2fefab21c3de43de2c7199753a35bd68b62360e', "icon-name": `${this.icon}`, decorative: true })), index.h("div", { key: '362e1b3910ac360e5bc0e1a8900b82446f447f1f', id: this.panelId, class: {
                 'gux-disclosure-panel': true,
                 'gux-active': this.isOpen
-            }, role: "region" }, index.h("slot", { key: '7372dbc3ec23058ae0d27b46044a404053095906', name: "panel-content" }))));
+            }, role: "region" }, index.h("slot", { key: '453039d51dbb0e6299ade2aee243acfc0eaffab5', name: "panel-content" }))));
     }
     get root() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/gux-dismiss-button.cjs.entry.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const usage = require('./usage-47b5afb6.js');
-const index$1 = require('./index-3ee995a4.js');
+const index = require('./index-e321455d.js');
+const usage = require('./usage-66f3f455.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const dismiss = "Dismiss";
@@ -12,7 +12,7 @@ const translationResources = {
 	dismiss: dismiss
 };
 
-const guxDismissButtonCss = ":host{--gse-ui-button-dismiss-medium-width:32px;--gse-ui-button-dismiss-medium-height:32px;--gse-ui-button-dismiss-small-width:24px;--gse-ui-button-dismiss-small-height:24px}gux-button-slot{position:absolute;inset-block-start:var(--gse-ui-modal-dismissButton-paddingTop);inset-inline-end:var(--gse-ui-modal-dismissButton-paddingRight);inline-size:var(--gse-ui-button-dismiss-medium-width);block-size:var(--gse-ui-button-dismiss-medium-height)}gux-button-slot.gux-dismiss-small{inline-size:var(--gse-ui-button-dismiss-small-width);block-size:var(--gse-ui-button-dismiss-small-height)}gux-button-slot.gux-dismiss-small button{inline-size:var(--gse-ui-button-dismiss-small-width);min-inline-size:var(--gse-ui-button-dismiss-small-width);block-size:var(--gse-ui-button-dismiss-small-height);padding:0}gux-button-slot.gux-inherit{position:inherit}gux-button-slot .gux-icon-container{display:flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch center;align-items:center}gux-button-slot .gux-icon-container gux-icon{flex:0 0 auto;align-self:auto;order:0;color:var(--gse-ui-dismissButton-foregroundColor)}";
+const guxDismissButtonCss = "gux-button-slot{position:absolute;inset-block-start:4px;inset-inline-end:4px;inline-size:var(--gse-ui-button-dismiss-medium-width);block-size:var(--gse-ui-button-dismiss-medium-height)}gux-button-slot.gux-dismiss-small{inline-size:var(--gse-ui-button-dismiss-small-width);block-size:var(--gse-ui-button-dismiss-small-height)}gux-button-slot.gux-dismiss-small button{inline-size:var(--gse-ui-button-dismiss-small-width);min-inline-size:var(--gse-ui-button-dismiss-small-width);block-size:var(--gse-ui-button-dismiss-small-height);padding:0}gux-button-slot.gux-inherit{position:inherit;inset-block-start:inherit;inset-inline-end:inherit}gux-button-slot .gux-icon-container{display:flex;flex-direction:row;flex-wrap:nowrap;place-content:stretch center;align-items:center}gux-button-slot .gux-icon-container gux-icon{flex:0 0 auto;align-self:auto;order:0;color:var(--gse-ui-dismissButton-foregroundColor)}";
 const GuxDismissButtonStyle0 = guxDismissButtonCss;
 
 const GuxDismissButton = class {
@@ -26,10 +26,10 @@ const GuxDismissButton = class {
         this.i18n = await index$1.buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (index.h("gux-button-slot", { key: 'efe5ae1b6c0250e4bad7130e431b5a92814f6bd3', accent: "ghost", class: {
+        return (index.h("gux-button-slot", { key: 'a4f5661d7690d55be83e54a0da40f5b87d1f8c44', accent: "ghost", class: {
                 'gux-inherit': this.position == 'inherit',
                 'gux-dismiss-small': this.size == 'small'
-            } }, index.h("button", { key: 'f83bc1ba475a57223afeab9d92d75ffc3cb13870', type: "button", title: this.i18n('dismiss') }, index.h("div", { key: '2f011eb4ee09def0c15859b4ca22c341abc361b3', class: "gux-icon-container" }, index.h("gux-icon", { key: '3765fa6ea27c572633c5cbccc610027c4089f762', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" })))));
+            } }, index.h("button", { key: '2223786156e5c59b39b9364f5c83129dd71f714d', type: "button", title: this.i18n('dismiss') }, index.h("div", { key: 'cc8e1cfdedeb7dafffcf7875f938a9501e20eaae', class: "gux-icon-container" }, index.h("gux-icon", { key: '1b72196d75de63a1de10f949464f891750c4efcb', "icon-name": "fa/xmark-large-regular", decorative: true, size: "small" })))));
     }
     static get delegatesFocus() { return true; }
     get root() { return index.getElement(this); }

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

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const index$1 = require('./index-3ee995a4.js');
+const index = require('./index-e321455d.js');
+const index$1 = require('./index-aa48ea67.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const clearSelection = "Clear {numberSelected} selected items";
@@ -18,6 +18,9 @@ const GuxDropdownMultiTag = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.internalclearselected = index.createEvent(this, "internalclearselected", 7);
+        /**
+         * Tag is disabled.
+         */
         this.disabled = false;
         this.numberSelected = 0;
         this.label = '';
@@ -45,7 +48,7 @@ const GuxDropdownMultiTag = class {
         this.i18n = await index$1.buildI18nForComponent(this.root, translationResources);
     }
     render() {
-        return (index.h("div", { key: 'a8269209ad4d42f5c60d8f9a10b754dea421536f', class: {
+        return (index.h("div", { key: 'e563ee84dd6888a8ef01ca609bf130afb40065d0', class: {
                 'gux-tag': true,
                 'gux-disabled': this.disabled
             }, "aria-disabled": this.disabled.toString() }, this.numberSelected.toString(), this.renderRemoveButton()));

package/dist/cjs/gux-dropdown-multi.cjs.entry.js

@@ -2,15 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
-const onClickOutside = require('./on-click-outside-bfd599ca.js');
-const index$1 = require('./index-3ee995a4.js');
+const index = require('./index-e321455d.js');
+const onClickOutside = require('./on-click-outside-8a2d3a8e.js');
+const index$1 = require('./index-aa48ea67.js');
 const simulateNativeEvent = require('./simulate-native-event-e88bf64f.js');
 const afterNextRender = require('./after-next-render-162425fe.js');
 const onInputDisabledStateChange = require('./on-input-disabled-state-change-660a5191.js');
-const usage = require('./usage-47b5afb6.js');
+const usage = require('./usage-66f3f455.js');
 const guxListbox_service = require('./gux-listbox.service-27157877.js');
-const onMutation = require('./on-mutation-7c046081.js');
+const onMutation = require('./on-mutation-6d71ec1a.js');
 require('./get-closest-element-9e41d6b9.js');
 
 const textInputResults = "Type to filter dropdown results";
@@ -46,13 +46,19 @@ const GuxDropdownMulti = class {
         this.guxexpanded = index.createEvent(this, "guxexpanded", 7);
         this.guxcollapsed = index.createEvent(this, "guxcollapsed", 7);
         this.guxfilter = index.createEvent(this, "guxfilter", 7);
-        this.value = undefined;
         this.disabled = false;
         this.required = false;
         this.loading = false;
-        this.placeholder = undefined;
+        /**
+         * Override default filtering behavior
+         */
         this.filterType = 'none';
         this.hasError = false;
+        /**
+         * allows dropdown popup to be wider than input
+         * defaults to fitting content if width is not specified for listbox
+         * default min-width is set to width of input
+         */
         this.exceedTargetWidth = false;
         this.hasCreate = false;
         this.expanded = false;
@@ -415,7 +421,7 @@ const GuxDropdownMulti = class {
     }
     render() {
         return [
-            index.h("div", { key: '9cfe34b91370f3444eb1463ba30a932996b2715a', class: "gux-dropdown-container" }, index.h("gux-popup", { key: '3a4263eaa05d2909904e93f10d60b0fbf215f850', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
+            index.h("div", { key: '355124f96b66e4de493455af50af902a167a2672', class: "gux-dropdown-container" }, index.h("gux-popup", { key: '4e67cf4314d7eaaf3715dbf6b562864dbef5307a', expanded: this.expanded && (!this.loading || this.isFilterable()), disabled: this.disabled || (this.loading && !this.isFilterable()), exceedTargetWidth: this.exceedTargetWidth }, this.renderTarget(), this.renderPopup()))
         ];
     }
     static get delegatesFocus() { return true; }

package/dist/cjs/gux-dropdown-option.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1337610f.js');
+const index = require('./index-e321455d.js');
 
 const guxDropdownOptionCss = "gux-dropdown-option{position:relative;display:flex;height:var(--option-height);padding:0 16px;line-height:32px;cursor:pointer}gux-dropdown-option div.gux-dropdown-option{position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}gux-dropdown-option div.gux-dropdown-option .gux-ghost{position:absolute}gux-dropdown-option[filtered]{display:none}gux-dropdown-option[disabled]{pointer-events:none;cursor:default;opacity:0.5}gux-dropdown-option[disabled=false]{pointer-events:auto;cursor:pointer;opacity:1}gux-dropdown-option:not(:disabled)[selected]{color:#2e394c;background:#deeaff}gux-dropdown-option:not(:disabled):hover,gux-dropdown-option:not(:disabled):focus-visible{color:#fdfdfd;background:#2a60c8}";
 const GuxDropdownOptionStyle0 = guxDropdownOptionCss;
@@ -16,12 +16,6 @@ const GuxDropdownOption = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.selectedChanged = index.createEvent(this, "selectedChanged", 7);
-        this.value = undefined;
-        this.disabled = undefined;
-        this.filtered = undefined;
-        this.selected = undefined;
-        this.text = undefined;
-        this.highlight = undefined;
     }
     /**
      * Gets the value rendered by the drop down item.
@@ -68,7 +62,7 @@ const GuxDropdownOption = class {
         };
     }
     __stencil_render() {
-        return (index.h("div", { key: '459b214df1450f1727871767af8cb12dfbcb6afa', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
+        return (index.h("div", { key: 'ea20401230e49f6f334230b89aee8d99fa290784', class: "gux-dropdown-option", title: this.text }, this.textWithHighlights()));
     }
     textWithHighlights() {
         if (!this.highlight || !this.text) {