genesys-spark-components 4.154.2 → 4.154.4

package/dist/collection/components/stable/gux-flyout-menu/gux-menu/gux-submenu/gux-submenu.css

@@ -52,7 +52,21 @@
   border: none;
   border-radius: var(--gse-ui-menu-borderRadius);
   box-shadow: var(--gse-ui-menu-boxShadow);
+  opacity: 0;
 }
 :host .gux-submenu-wrapper.gux-shown {
   visibility: visible;
+  animation-name: fade-in;
+  animation-duration: 100ms;
+  animation-delay: 350ms;
+  animation-fill-mode: forwards;
+}
+
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
 }

package/dist/collection/components/stable/gux-popover/tests/gux-popover.common.js

@@ -0,0 +1,12 @@
+export const renderConfig = {
+    description: 'should render popover',
+    html: `<div lang="en">
+        <div id="popover-target">
+          Example Element
+        </div>
+        <gux-popover position="top" for="popover-target" is-open>
+          <span slot="title">Title</span>
+          <div>popover content</div>
+        </gux-popover>
+      </div>`
+};

package/dist/collection/components/stable/gux-table-toolbar/gux-table-toolbar-custom-action/tests/gux-table-toolbar-custom-action.common.js

@@ -0,0 +1,18 @@
+export const renderConfigs = [
+    ...['primary', 'secondary', 'ghost'].map(accent => ({
+        description: `Should render as expected for "${accent}" accent`,
+        html: `<gux-table-toolbar-custom-action accent="${accent}"><span slot="text">Filter</span><gux-icon slot="icon" icon-name="filter" decorative></gux-icon></gux-table-toolbar-custom-action>`
+    })),
+    {
+        description: 'should render a toolbar-custom-action',
+        html: '<gux-table-toolbar-custom-action><span slot="text">Filter</span><gux-icon slot="icon" icon-name="filter" decorative></gux-icon></gux-table-toolbar-custom-action>'
+    },
+    {
+        description: 'should render disabled toolbar-custom-action',
+        html: '<gux-table-toolbar-custom-action disabled ><span slot="text">Filter</span><gux-icon slot="icon" icon-name="filter" decorative></gux-icon></gux-table-toolbar-custom-action>'
+    },
+    {
+        description: 'should render icon-only toolbar-custom-action',
+        html: '<gux-table-toolbar-custom-action icon-only ><span slot="text">Filter</span><gux-icon slot="icon" icon-name="filter" decorative></gux-icon></gux-table-toolbar-custom-action>'
+    }
+];

package/dist/collection/components/stable/gux-table-toolbar/gux-table-toolbar-menu-button/gux-table-toolbar-menu-button.js

@@ -83,7 +83,7 @@ export class GuxTableToolbarMenuButton {
         trackComponent(this.root);
     }
     render() {
-        return (h(Host, { key: 'ab5a5a60169f9dc0006de9fd504da68dc0c82bbc', class: { 'gux-show-menu': this.showMenu } }, h("gux-popup", { key: 'dcbbdb9a5f505746b2fb53d21e4c4f47ff647890', expanded: this.expanded, "exceed-target-width": true }, h("div", { key: 'e48d3db7eae17dd25769fc71e26739735ab30fe9', slot: "target", class: "gux-toolbar-menu-container" }, h("gux-button-slot", { key: '95558dc7f3b90b04fdecf363bb81e6d752a33b7b', accent: "secondary" }, h("button", { key: '2435dad44695a45b1f1277c5e60bb9141cc49b02', class: "gux-menu-button", type: "button", ref: el => (this.dropdownButton = el), onMouseUp: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.expanded.toString() }, h("gux-icon", { key: '923368b8a25dbca8c8c0762d76d98c5d98063ba2', "icon-name": "fa/ellipsis-regular", size: "small", decorative: true }), this.renderTooltip()))), h("div", { key: '150a4bac23d161e2e3e4fcbdd8840aab98050d9c', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: '262a9d3ecaf5c4fdd86399c5267e3badd4b361b7', ref: el => (this.listElement = el) }, h("slot", { key: '972a7f61d38573e4ad1b86fe043423ad132c6e43' }))))));
+        return (h(Host, { key: 'ab5a5a60169f9dc0006de9fd504da68dc0c82bbc', class: { 'gux-show-menu': this.showMenu } }, h("gux-popup", { key: 'dcbbdb9a5f505746b2fb53d21e4c4f47ff647890', expanded: this.expanded, "exceed-target-width": true }, h("div", { key: 'e48d3db7eae17dd25769fc71e26739735ab30fe9', slot: "target", class: "gux-toolbar-menu-container" }, h("gux-button-slot", { key: '95558dc7f3b90b04fdecf363bb81e6d752a33b7b', accent: "secondary" }, h("button", { key: '2435dad44695a45b1f1277c5e60bb9141cc49b02', class: "gux-menu-button", type: "button", ref: el => (this.dropdownButton = el), onMouseUp: () => this.toggle(), "aria-haspopup": "true", "aria-expanded": this.expanded.toString() }, h("gux-icon", { key: '923368b8a25dbca8c8c0762d76d98c5d98063ba2', "icon-name": "fa/ellipsis-regular", size: "small", decorative: true }), h("gux-screen-reader-beta", { key: '41123795d6150ac96bec940393d8a1dcd5f108a4' }, this.i18n('additionalActions'))), this.renderTooltip())), h("div", { key: '3a1c8a34929e2b690b0ef09f48de5d2e82a8676c', class: "gux-list-container", slot: "popup" }, h("gux-list", { key: 'd016235adc18d1d89c6bbe629dcdf7405b3627f3', ref: el => (this.listElement = el) }, h("slot", { key: 'b349acabd22afa3d99a921c5faf2ce2e7ccee315' }))))));
     }
     static get is() { return "gux-table-toolbar-menu-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-table-toolbar/tests/gux-table-toolbar.common.js

@@ -0,0 +1,38 @@
+export const renderConfigs = [
+    {
+        description: 'Should render gux-table-toolbar',
+        html: `<gux-table-toolbar>
+                <div slot="search-and-filter">
+                    <gux-form-field-search label-position="screenreader">
+                    <input slot="input" type="search" name="a-3" placeholder="Enter search" />
+                    <label slot="label">Toolbar Search</label>
+                    </gux-form-field-search>
+                    <gux-table-toolbar-custom-action>
+                    <span slot="text">Filter</span>
+                    <gux-icon slot="icon" icon-name="filter" decorative></gux-icon>
+                    </gux-table-toolbar-custom-action>
+                </div>
+
+                <div slot="contextual-actions">
+                    <gux-table-toolbar-action action="delete"></gux-table-toolbar-action>
+                </div>
+
+                <div slot="permanent-actions">
+                    <gux-table-toolbar-action action="export"></gux-table-toolbar-action>
+                    <gux-table-toolbar-action action="refresh"></gux-table-toolbar-action>
+                    <gux-table-toolbar-action action="revert"></gux-table-toolbar-action>
+                    <gux-table-toolbar-action action="import"></gux-table-toolbar-action>
+                </div>
+
+                <div slot="menu-actions">
+                    <gux-table-toolbar-action action="export"></gux-table-toolbar-action>
+                    <gux-table-toolbar-action action="refresh"></gux-table-toolbar-action>
+                </div>
+
+                <gux-table-toolbar-custom-action slot="primary-action" accent="primary">
+                    <span slot="text">Add</span>
+                    <gux-icon slot="icon" icon-name="add" decorative></gux-icon>
+                </gux-table-toolbar-custom-action>
+            </gux-table-toolbar>`
+    }
+];

package/dist/collection/components/stable/gux-tabs/gux-tab/gux-tab.js

@@ -45,11 +45,11 @@ export class GuxTab {
         return -1;
     }
     render() {
-        return (h("button", { key: '4e72859d886bc4518d93edb98e259afb2c7ed86b', class: {
+        return (h("button", { key: '3b4848d27454db32e82f9a9ff3b0fb07fe5ae967', class: {
                 'gux-disabled': this.guxDisabled,
                 'gux-tab': true,
                 'gux-active': this.active
-            }, type: "button", disabled: this.guxDisabled, id: `gux-${this.tabId}-tab`, role: "tab", "aria-controls": `gux-${this.tabId}-panel`, "aria-selected": this.active.toString(), tabIndex: this.getTabIndex(), ref: el => (this.buttonElement = el) }, h("gux-tooltip-title", { key: '332024c8968009f60737e884024f7cdd3c86e98d', ref: el => (this.tooltipTitleElement = el) }, h("span", { key: 'e28ebb2c2555d361691c839bdcc1e7864679b668' }, h("slot", { key: '7a083f1202b493f3159252571c65308e004058c9' })))));
+            }, type: "button", disabled: this.guxDisabled, id: `gux-${this.tabId}-tab`, role: "tab", "aria-controls": `gux-${this.tabId}-panel`, "aria-selected": this.active.toString(), tabIndex: this.getTabIndex(), ref: el => (this.buttonElement = el) }, h("gux-tooltip-title", { key: 'adfa308450ebbb503bdad6f5db679d3367817f06', ref: el => (this.tooltipTitleElement = el) }, h("span", { key: '0695f082a6f67ad57376946623df29d69a70c755' }, h("slot", { key: 'c8528144e9cc86131103692b51364e1543e40766' })))));
     }
     static get is() { return "gux-tab"; }
     static get originalStyleUrls() {

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

@@ -266,9 +266,9 @@ export class GuxTabList {
         });
     }
     render() {
-        return (h("div", { key: 'ae9f54186164a9e741aae2301e04238a3bb5471e', class: "gux-tab-container" }, this.hasHorizontalScrollbar
+        return (h("div", { key: 'c27b59132f3fc77f9d4ffa036d85b193e9021807', class: "gux-tab-container" }, this.hasHorizontalScrollbar
             ? this.renderScrollButton('scrollLeft')
-            : this.renderScrollButton('scrollUp'), h("div", { key: '4ccc0d0abed67e29e3cd025f5e89a58b998732fe', role: "tablist", class: "gux-scrollable-section", "aria-owns": this.triggerIds }, h("slot", { key: '7855403cc39f1f524b948526cc5f497d78a4f88d' })), this.hasHorizontalScrollbar
+            : this.renderScrollButton('scrollUp'), h("div", { key: '72ef0e03e709d2e108bbef5ba43e54491bab0fdb', role: "tablist", class: "gux-scrollable-section", "aria-owns": this.triggerIds }, h("slot", { key: '10d7153810788e2aa18f9a681da60daacfdf9fa7' })), this.hasHorizontalScrollbar
             ? this.renderScrollButton('scrollRight')
             : this.renderScrollButton('scrollDown')));
     }

package/dist/collection/components/stable/gux-tabs/gux-tab-panel/gux-tab-panel.js

@@ -16,7 +16,7 @@ export class GuxTabPanel {
         }
     }
     render() {
-        return (h(Host, { key: 'a2a87f4bedc6e85add3ee32ccd024c8cf93f3383', id: `gux-${this.tabId}-panel`, role: "tabpanel", "aria-labelledby": `gux-${this.tabId}-tab`, tabIndex: 0, hidden: !this.active }, h("slot", { key: '4b2100851a94f283f3eaafe44c68e1d01bae1922' })));
+        return (h(Host, { key: '70fcbcec304f38ab7c084543851bcc6640bedfcd', id: `gux-${this.tabId}-panel`, role: "tabpanel", "aria-labelledby": `gux-${this.tabId}-tab`, tabIndex: 0, hidden: !this.active }, h("slot", { key: 'cc5e7df3f79e1a899e7301305445e3d10fefccea' })));
     }
     static get is() { return "gux-tab-panel"; }
     static get encapsulation() { return "shadow"; }

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

@@ -49,7 +49,7 @@ export class GuxTabs {
         trackComponent(this.root);
     }
     render() {
-        return (h(Host, { key: 'fcf6be8847699ea16fd6cd7fbfed5e958250111f' }, h("div", { key: '739b5d7a29d257cf65b3d9f2709debb88368702b', class: `gux-tabs gux-${this.alignment} gux-${this.orientation}` }, h("slot", { key: '076981b20c734e6c61815595ae07fff44ba58de9', name: "tab-list" }), h("div", { key: '4f2529c3710adbee42f687080225614666608b48', class: `gux-${this.alignment} gux-${this.orientation} gux-panel-container` }, h("slot", { key: '8644c0e7c4355779488c97d9922840ede20d6c64', onSlotchange: this.onSlotchange.bind(this) })))));
+        return (h(Host, { key: '94cafe6cb982fa9d0ae7d75f09c77ff9b74e76f8' }, h("div", { key: 'b511ade648b09a0a3cb1304af999ea6702579765', class: `gux-tabs gux-${this.alignment} gux-${this.orientation}` }, h("slot", { key: 'd40a445c4024a82f0a0bf2b94a160f8c29ee2430', name: "tab-list" }), h("div", { key: '2b5cc5087fffc837fa38cdb71c289e3ce6a13622', class: `gux-${this.alignment} gux-${this.orientation} gux-panel-container` }, h("slot", { key: '1fcc4c8914556de32c4dcfb23b461b25c4a716de', onSlotchange: this.onSlotchange.bind(this) })))));
     }
     static get is() { return "gux-tabs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -143,9 +143,9 @@ export class GuxTabAdvanced {
     }
     renderTabOptions() {
         if (this.hasDropdownOptions) {
-            return (h("div", { class: "gux-tab-options" }, h("gux-button-slot", { accent: "ghost" }, h("button", { id: this.dropdownOptionsButtonId, "aria-expanded": (!this.popoverHidden).toString(), type: "button", class: "gux-tab-options-trigger", ref: el => (this.tabOptionsButtonElement = el), onClick: () => this.toggleOptions(), tabIndex: this.active ? 0 : -1, disabled: this.guxDisabled }, h("gux-icon", { "icon-name": "fa/ellipsis-vertical-regular", "screenreader-text": this.i18n('options', {
-                    tabTitle: this.tabTitle
-                }) }))), h("gux-popover-list", { position: "top-end", for: this.dropdownOptionsButtonId, displayDismissButton: false, "is-open": !this.popoverHidden, closeOnClickOutside: true, onGuxdismiss: () => (this.popoverHidden = true), onClick: (e) => this.popoverOnClick(e), onFocusout: e => e.stopImmediatePropagation() }, h("div", { class: "gux-dropdown-options-container", onClick: (e) => this.onSelectDropdownOption(e) }, h("slot", { name: "dropdown-options" })))));
+            return (h("div", { class: "gux-tab-options" }, h("gux-button-slot", { accent: "ghost" }, h("button", { id: this.dropdownOptionsButtonId, "aria-expanded": (!this.popoverHidden).toString(), type: "button", class: "gux-tab-options-trigger", ref: el => (this.tabOptionsButtonElement = el), onClick: () => this.toggleOptions(), tabIndex: this.active ? 0 : -1, disabled: this.guxDisabled }, h("gux-icon", { "icon-name": "fa/ellipsis-vertical-regular", decorative: true }), h("gux-screen-reader-beta", null, this.i18n('options', {
+                tabTitle: this.tabTitle
+            })))), h("gux-popover-list", { position: "top-end", for: this.dropdownOptionsButtonId, displayDismissButton: false, "is-open": !this.popoverHidden, closeOnClickOutside: true, onGuxdismiss: () => (this.popoverHidden = true), onClick: (e) => this.popoverOnClick(e), onFocusout: e => e.stopImmediatePropagation() }, h("div", { class: "gux-dropdown-options-container", onClick: (e) => this.onSelectDropdownOption(e) }, h("slot", { name: "dropdown-options" })))));
         }
         return null;
     }
@@ -154,12 +154,12 @@ export class GuxTabAdvanced {
     }
     render() {
         return [
-            h("div", { key: '51a9874d726cfbacc331df66a039cd8d53bc436b', class: {
+            h("div", { key: 'a7b6433ccea88c69fce8597fca3510314d6a585d', class: {
                     'gux-tab': true,
                     'gux-selected': this.active,
                     'gux-dropdown-options': this.hasDropdownOptions,
                     'gux-disabled': this.guxDisabled
-                } }, h("div", { key: '2271cc67b8e9f018fbb966abf1313f46c32fcd3f', class: "gux-buttons" }, this.renderTabButton(), this.renderTabOptions()), h("div", { key: 'a631640afe9296b849f0b07b6d29ee8e8c20aa97', class: "gux-divider" }))
+                } }, h("div", { key: '9e428fc4987e65ddf26b6c9c357998f40d4bcf4c', class: "gux-buttons" }, this.renderTabButton(), this.renderTabOptions()), h("div", { key: 'f2646aeea0f16e2fc6d2d7c9a8d33402214ce2e2', class: "gux-divider" }))
         ];
     }
     static get is() { return "gux-tab-advanced"; }

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

@@ -437,23 +437,23 @@ export class GuxTabAdvancedList {
     render() {
         return [
             this.renderAlert(),
-            h("div", { key: '5423db2afdc4e9b25f54bd5125dc9f60f46aa484', class: "gux-tab-container" }, this.renderScrollButton('scrollLeft'), h("div", { key: 'c6087769feef0a3dfd45f5579064b1c2f78b317a', class: "gux-scrollable-section" }, h("div", { key: '36e607e2cb94242352895f4b499c14e32cd09368', class: "gux-tablist", role: "tablist", "data-gux-tab-sorting": this.keyboardSort, "aria-owns": this.triggerIds }, h("slot", { key: 'd8fdf472fe8f0c2232c456d89526ea01dbe1b593' }))), this.renderScrollButton('scrollRight'), this.renderAddButton())
+            h("div", { key: '19412ccae6dde813bf7b4a59c8b5175cbf822970', class: "gux-tab-container" }, this.renderScrollButton('scrollLeft'), h("div", { key: '17c9640bb1cb7a49921e0b44899156070762d88f', class: "gux-scrollable-section" }, h("div", { key: '49068d4989fb02183dc826282b723f196e408b5c', class: "gux-tablist", role: "tablist", "data-gux-tab-sorting": this.keyboardSort, "aria-owns": this.triggerIds }, h("slot", { key: 'a6853e8e1d931683a139d864134c208b87084804' }))), this.renderScrollButton('scrollRight'), this.renderAddButton())
         ];
     }
     renderAlert() {
         return (h("div", { class: "gux-sr-only gux-aria-live-region", "aria-live": "polite" }, this.ariaLiveAlert ? this.i18n(this.ariaLiveAlert) : ''));
     }
     renderAddButton() {
-        return (h("div", null, this.showNewTabButton ? (h("gux-button-slot", { accent: "ghost" }, h("button", { onClick: () => this.newTab.emit(), disabled: this.disableAddTabButton }, h("slot", { name: "add-tab" }, h("gux-icon", { size: "small", "icon-name": "fa/plus-regular", "screenreader-text": this.disableAddTabButton
-                ? this.i18n('disableNewTab')
-                : this.root.querySelector('[slot="add-tab"]')
-                    ? this.root
-                        .querySelector('[slot="add-tab"]')
-                        .textContent.trim()
-                    : this.i18n('createNewTab') }))))) : null));
+        return (h("div", null, this.showNewTabButton ? (h("gux-button-slot", { accent: "ghost" }, h("button", { onClick: () => this.newTab.emit(), disabled: this.disableAddTabButton }, h("slot", { name: "add-tab" }, h("gux-icon", { size: "small", "icon-name": "fa/plus-regular", decorative: true }), h("gux-screen-reader-beta", null, this.disableAddTabButton
+            ? this.i18n('disableNewTab')
+            : this.root.querySelector('[slot="add-tab"]')
+                ? this.root
+                    .querySelector('[slot="add-tab"]')
+                    .textContent.trim()
+                : this.i18n('createNewTab')))))) : null));
     }
     renderScrollButton(direction) {
-        return (h("div", null, this.hasScrollbar ? (h("gux-button-slot", { class: "gux-scroll-button", accent: "ghost", "icon-only": true }, h("button", { tabindex: "-1", onDragOver: () => this.getScrollDirection(direction), onClick: () => this.getScrollDirection(direction) }, h("gux-icon", { size: "small", "icon-name": this.getChevronIconName(direction), "screenreader-text": this.i18n(direction) })))) : null));
+        return (h("div", null, this.hasScrollbar ? (h("gux-button-slot", { class: "gux-scroll-button", accent: "ghost", "icon-only": true }, h("button", { tabindex: "-1", onDragOver: () => this.getScrollDirection(direction), onClick: () => this.getScrollDirection(direction) }, h("gux-icon", { size: "small", "icon-name": this.getChevronIconName(direction), decorative: true }), h("gux-screen-reader-beta", null, this.i18n(direction))))) : null));
     }
     getScrollDirection(direction) {
         switch (direction) {

package/dist/collection/components/stable/gux-tabs-advanced/gux-tab-advanced-panel/gux-tab-advanced-panel.js

@@ -16,7 +16,7 @@ export class GuxTabAdvancedPanel {
         }
     }
     render() {
-        return (h("div", { key: '0ac73749e9860b0391f09bd0822f6aea6a88e6c6', id: `gux-${this.tabId}-panel`, class: "gux-tabpanel", role: "tabpanel", "aria-labelledby": `gux-${this.tabId}-tab`, tabIndex: 0, hidden: !this.active, "aria-live": "assertive" }, h("slot", { key: '23416d1e4229f0394dbacf46a92a981d41ec75eb' })));
+        return (h("div", { key: '924e7d849185c69e2c2c7a92b646bbd8b25d95d3', id: `gux-${this.tabId}-panel`, class: "gux-tabpanel", role: "tabpanel", "aria-labelledby": `gux-${this.tabId}-tab`, tabIndex: 0, hidden: !this.active, "aria-live": "assertive" }, h("slot", { key: '7873b697344ceea31ec2a09e9cc82ec9c747b8e5' })));
     }
     static get is() { return "gux-tab-advanced-panel"; }
     static get originalStyleUrls() {

package/dist/collection/components/stable/gux-tabs-advanced/gux-tabs-advanced.js

@@ -44,7 +44,7 @@ export class GuxTabsAdvanced {
         trackComponent(this.root);
     }
     render() {
-        return (h(Host, { key: '43f7d87c1568e1df5b61da978338a5942338a8a3' }, h("slot", { key: '568d65bac0bed0f828cdff9728ad3e8ea682c15b', name: "tab-list" }), h("slot", { key: '7f80d669fb6793c2dc6a84c47e5dd8d0ae1964e6', onSlotchange: this.onSlotchange.bind(this) })));
+        return (h(Host, { key: '70adfe0f4860a5d9b5cb3feaf7480ab5b79ae55d' }, h("slot", { key: '4c484885d40d176c5077500380dda6bc9c446553', name: "tab-list" }), h("slot", { key: '3601b3be79bbecc0a6613e05a1e026e469555e62', onSlotchange: this.onSlotchange.bind(this) })));
     }
     static get is() { return "gux-tabs-advanced"; }
     static get encapsulation() { return "shadow"; }

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

@@ -54,7 +54,7 @@ export class GuxTag {
         this.i18n = await buildI18nForComponent(this.root, tagResources);
     }
     render() {
-        return (h("div", { key: '82f4f97a2fcf764aca555d0d46248daa882b4901', class: {
+        return (h("div", { key: 'da2ba604009b40f55ae7806aa7be45e1db31167d', class: {
                 'gux-tag': true,
                 [`gux-accent-${this.accent}`]: true,
                 'gux-disabled': this.disabled,

package/dist/collection/components/stable/gux-time-picker/gux-time-picker.js

@@ -237,7 +237,7 @@ export class GuxTimePicker {
         return (h("div", { slot: "popup", class: "gux-list-container", onKeyDown: (e) => this.onListKeyDown(e) }, h("gux-list", { ref: el => (this.listElement = el) }, this.renderTimeListItems())));
     }
     render() {
-        return (h("gux-popup", { key: '6ecabad33289ab260f2fecd2c7a5f7ffcc513cd0', class: {
+        return (h("gux-popup", { key: '7e4c2e406cc82e6f61b1f3af6a0f4ae0d66a8c63', class: {
                 'gux-time-picker': true,
                 'gux-error': this.hasError
             }, expanded: this.expanded, disabled: this.disabled }, this.renderTarget(), this.renderPopup()));

package/dist/collection/components/stable/gux-time-picker/tests/gux-time-picker.common.js

@@ -0,0 +1,10 @@
+export const renderConfigs = [
+    ...['12h', '24h'].map(clocktype => ({
+        description: `Should render as expected for "${clocktype}" clock type`,
+        html: `<gux-time-picker clock-type="${clocktype}"></gux-time-picker>`
+    })),
+    {
+        description: 'Should render as expected for disabled',
+        html: `<gux-time-picker disabled></gux-time-picker>`
+    }
+];

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

@@ -57,9 +57,9 @@ export class GuxToast {
         return (h("gux-cta-group", { class: "gux-buttons-bar", align: "end" }, this.hasSecondaryButton && (h("gux-button-slot", { slot: "secondary" }, h("slot", { name: "secondary-button" }))), h("gux-button-slot", { slot: "primary" }, h("slot", { name: "primary-button" }))));
     }
     render() {
-        return (h("div", { key: 'db56987cd7c53f5e892a8d21a30aaedb5673bb03', class: `gux-toast gux-toast-${this.toastType}` }, h("div", { key: '41cc4f6fd2beac8ef17978ceda61c8be575801ba', class: `gux-icon gux-icon-${this.toastType}` }, this.renderToastIcon()), h("div", { key: '06f394bf8581a72fcb46195d03e174c833e68fce', class: "gux-content" }, h("div", { key: 'cfd311bc5428792590e7d024c507e20b8cb08aeb', class: "gux-message" }, h("gux-truncate", { key: 'b121f11354d8cb9857f7d1389e493c59eea6033f', class: "gux-message-title", "max-lines": 1 }, h("slot", { key: '170cc3d297e2cbf0da2b02a8f7a6e76b4deffbdc', name: "title" })), h("gux-truncate", { key: '809834a743ff746515b60c1ebc2f2c1f1cb4a8ed', class: "gux-message-body", "max-lines": 2 }, h("slot", { key: '95771b5d7d22819e3168bfbd2f6ad2f122297081', name: "message" }))), this.toastType !== 'action' && this.hasLink && this.renderLink(), this.toastType === 'action' &&
+        return (h("div", { key: '2470176db0ade422581269d5f4f21f8884125763', class: `gux-toast gux-toast-${this.toastType}` }, h("div", { key: '14993ea0a466683007c84d20ba974ccb50562605', class: `gux-icon gux-icon-${this.toastType}` }, this.renderToastIcon()), h("div", { key: 'da3ed8f51df9a33d587c222c3068aff5d8e60c8b', class: "gux-content" }, h("div", { key: '97f20a03c10bba3d3b57e2ec6558b37112479e2c', class: "gux-message" }, h("gux-truncate", { key: 'f1948741ec5a9aa4c4c535448a3eaeada250ff94', class: "gux-message-title", "max-lines": 1 }, h("slot", { key: 'f9f7cf759bbb9384b2915faac2e13d9092b50a82', name: "title" })), h("gux-truncate", { key: '4978560814aef4502794e1c30df1240a2c169769', class: "gux-message-body", "max-lines": 2 }, h("slot", { key: 'a30ff9a68a39191f3caa84c693f115b051781d75', name: "message" }))), this.toastType !== 'action' && this.hasLink && this.renderLink(), this.toastType === 'action' &&
             this.hasPrimaryButton &&
-            this.renderActions()), h("gux-dismiss-button", { key: 'e7658d34a388f9ccb75bd513378c7de1d654da8b', position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
+            this.renderActions()), h("gux-dismiss-button", { key: 'c0137c03585607f5f6c90bf762f38146ef7c1eda', position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();

package/dist/collection/components/stable/gux-toggle/gux-toggle-slider/gux-toggle-slider.js

@@ -16,12 +16,12 @@ export class GuxToggleSlider {
     }
     render() {
         const isError = this.errorId.length > 0;
-        return (h("div", { key: '1cb0e9c16e9d3587fc33be75db520a660186aa89', class: {
+        return (h("div", { key: '900cb1b52db0e1eb0f464dbbbd0e8386b457628e', class: {
                 'gux-toggle-slider': true,
                 'gux-checked': this.checked,
                 'gux-disabled': this.disabled,
                 'gux-error': isError
-            }, role: "checkbox", "aria-checked": this.checked.toString(), "aria-disabled": this.disabled.toString(), tabindex: this.disabled ? '' : '0', ref: el => (this.checkboxElement = el) }, h("div", { key: '4090c5325f53fa642d3ab1163d2ecaff2c8c2079', class: "gux-slider" }, h("div", { key: '64d5720956f1ce270cfd32ebf4d038855e058e6c', class: "gux-switch" }, !isError && (h("gux-icon", { key: 'd2cecd2611a79a502fc7cd5c48debc8171a025f4', "icon-name": "fa/check-solid", decorative: true }))))));
+            }, role: "checkbox", "aria-checked": this.checked.toString(), "aria-disabled": this.disabled.toString(), tabindex: this.disabled ? '' : '0', ref: el => (this.checkboxElement = el) }, h("div", { key: '31f78c7afc2b93d2e9122bde9664e5e1152ff18b', class: "gux-slider" }, h("div", { key: 'ed7937f042d37a02ee7c1cc70b9756e4794ed4d6', class: "gux-switch" }, !isError && (h("gux-icon", { key: '8c98a35c717823be2de5d0816b499941ac806962', "icon-name": "fa/check-solid", decorative: true }))))));
     }
     static get is() { return "gux-toggle-slider"; }
     static get originalStyleUrls() {

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

@@ -68,11 +68,11 @@ export class GuxToggle {
         }
     }
     render() {
-        return (h(Host, { key: 'a6b5651448a2c8da7dedf348842c09bdcccf732d', class: { 'gux-display-inline': this.displayInline } }, h("div", { key: '84dc515b0110612bcce9a646979e0cbac43ec448', class: {
+        return (h(Host, { key: '187eec4c40921d1508f30e4c5b97e83bf9609e1d', class: { 'gux-display-inline': this.displayInline } }, h("div", { key: '9f28171fb67c08cfaf09de4fa8d1b851cd787c99', class: {
                 'gux-toggle-container': true,
                 'gux-toggle-label-left': this.labelPosition === 'left',
                 'gux-disabled': this.disabled || this.loading
-            } }, h("div", { key: '76d34622e3af8ed7c12ceff4f4a7f76d77f69889', class: "gux-toggle-input", onClick: this.toggle.bind(this) }, h("gux-toggle-slider", { key: '8957c2f2978b0134c3327617cdb84658d87a0ab1', checked: this.checked, disabled: this.disabled || this.loading, guxAriaLabel: this.getAriaLabel(), labelId: this.checkedLabel && this.uncheckedLabel ? this.labelId : '', onKeyDown: this.onKeydown.bind(this), errorId: this.errorMessage ? this.errorId : '' }), this.renderLabel()), this.renderError()), h("gux-announce-beta", { key: '238c9c3f27bcbaf94f433bfdd213112d688bb432', ref: el => (this.announceElement = el) })));
+            } }, h("div", { key: 'cd20a2366147ad7522e61aeac01f8c486c7accfc', class: "gux-toggle-input", onClick: this.toggle.bind(this) }, h("gux-toggle-slider", { key: '89e2411678368060d7e391bd58b03fa9b317631d', checked: this.checked, disabled: this.disabled || this.loading, guxAriaLabel: this.getAriaLabel(), labelId: this.checkedLabel && this.uncheckedLabel ? this.labelId : '', onKeyDown: this.onKeydown.bind(this), errorId: this.errorMessage ? this.errorId : '' }), this.renderLabel()), this.renderError()), h("gux-announce-beta", { key: '63925a0550fa4b6fe95af23834ace971ca550126', ref: el => (this.announceElement = el) })));
     }
     static get is() { return "gux-toggle"; }
     static get encapsulation() { return "shadow"; }

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

@@ -151,10 +151,10 @@ export class GuxTooltip {
         this.disconnectForElement();
     }
     render() {
-        return (h(Host, { key: 'f601b4ff9b0824df65bbe662380632073292bf3d', id: this.id, class: { 'gux-show': this.isShown }, role: "tooltip" }, h("div", { key: '267a10865e20f50c897dd65310f695e21e104321', class: {
+        return (h(Host, { key: '6f26c2032b7751b5207c4d995191348c634b2d72', id: this.id, class: { 'gux-show': this.isShown }, role: "tooltip" }, h("div", { key: 'c44b54ae5e594eefe46d174f26de2e1234566eba', class: {
                 'gux-container': true,
                 [`gux-${this.accent}`]: true
-            }, "data-placement": this.placement }, h("slot", { key: '44801d8689ce2d3992a45bf26a92f0435cb4196b', name: "content" }, h("slot", { key: '22153a907bea661954119f7db2e066db628f0299' })))));
+            }, "data-placement": this.placement }, h("slot", { key: '23ef1e9de00a8374e07a4067d197fac4f01936e4', name: "content" }, h("slot", { key: 'f985f9d565baa76a9b3aa97033ca05f7b53b2685' })))));
     }
     static get is() { return "gux-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-tooltip-title/gux-tooltip-title.js

@@ -120,10 +120,10 @@ export class GuxTooltipTitle {
     }
     render() {
         return [
-            h("span", { key: 'e15a2cb1bda4693c0449e02e9f069bc222aeaaaa', class: {
+            h("span", { key: 'e32d3a62d2174e13cc11a9e192c3fbccfbd96221', class: {
                     'gux-title-container': true,
                     'gux-icon-only': this.iconOnly
-                } }, h("slot", { key: '1e336f382487b3f5da92f85e22f6fa8a1d569019' })),
+                } }, h("slot", { key: '43284cea283894c49312af3d93b7b596167b9330' })),
             this.renderTooltip()
         ];
     }

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

@@ -52,12 +52,12 @@ export class GuxTruncate {
     }
     render() {
         var _a;
-        return (h("div", { key: 'c9b007efaaf09547de206ee693554a8f9d46a418', class: {
+        return (h("div", { key: '1a9bf1e2018a9a1c1f49e27836d9c5f859d8037b', class: {
                 'gux-truncate-multi-line': Boolean(this.maxLines)
-            } }, h("span", { key: 'c7c2bdc20013685da3927d9acff387d529eb467d', class: {
+            } }, h("span", { key: 'ac526c00490f4d7e2376d3ea1513ac0c4a997b46', class: {
                 'gux-overflow-hidden': this.needsTruncation(),
                 'gux-truncate-slot-container': true
-            }, style: { webkitLineClamp: (_a = this.maxLines) === null || _a === void 0 ? void 0 : _a.toString() } }, h("slot", { key: 'ec324e10e59eb80b1f127cb6fa5e810a290e1782' })), this.renderTooltip()));
+            }, style: { webkitLineClamp: (_a = this.maxLines) === null || _a === void 0 ? void 0 : _a.toString() } }, h("slot", { key: '4eed6d361c918e88dcefa51c4d5b0ce8cd4db74f' })), this.renderTooltip()));
     }
     static get is() { return "gux-truncate"; }
     static get encapsulation() { return "shadow"; }