genesys-spark-components 4.108.3 → 4.109.1

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-action/gux-rich-text-editor-action-link/gux-rich-text-editor-action-link.js

@@ -0,0 +1,148 @@
+var __decorate = (this && this.__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;
+};
+import { h, Host } from "@stencil/core";
+import { OnClickOutside } from "../../../../../utils/decorator/on-click-outside";
+import { trackComponent } from "../../../../../utils/tracking/usage";
+import { buildI18nForComponent } from "../../../../../i18n/index";
+import translationResources from "../i18n/en.json";
+import { afterNextRender } from "../../../../../utils/dom/after-next-render";
+export class GuxRichTextEditorActionLink {
+    constructor() {
+        this.disabled = false;
+        this.isOpen = false;
+    }
+    onClickOutside() {
+        this.isOpen = false;
+    }
+    handleKeydown(event) {
+        const composedPath = event.composedPath();
+        switch (event.key) {
+            case 'Escape':
+                this.isOpen = false;
+                this.actionButton.focus();
+                break;
+            case 'ArrowDown':
+            case 'Enter':
+                if (composedPath.includes(this.actionButton)) {
+                    event.preventDefault();
+                    this.isOpen = true;
+                    this.focusTextToDisplayInputElement();
+                }
+                break;
+        }
+    }
+    async componentWillLoad() {
+        trackComponent(this.root);
+        this.i18n = await buildI18nForComponent(this.root, translationResources);
+    }
+    emitLinkOptions() {
+        const linkOptions = {
+            textToDisplay: this.textToDisplayInputElement.value,
+            href: this.linkAddressInputElement.value
+        };
+        this.linkOptions.emit(linkOptions);
+        this.textToDisplayInputElement.value = null;
+        this.linkAddressInputElement.value = null;
+        this.isOpen = false;
+    }
+    togglePopover() {
+        this.isOpen = !this.isOpen;
+        if (this.isOpen) {
+            this.focusTextToDisplayInputElement();
+        }
+        else {
+            this.actionButton.focus();
+        }
+    }
+    focusTextToDisplayInputElement() {
+        afterNextRender(() => {
+            this.textToDisplayInputElement.focus();
+        });
+    }
+    renderTooltip() {
+        if (!this.disabled) {
+            return (h("gux-tooltip", null, h("div", { slot: "content" }, this.i18n('link'))));
+        }
+    }
+    render() {
+        return (h(Host, { key: '166f87e1bb3c3565cb3dd4e05099a83cfa23f80a' }, h("gux-button-slot", { key: '15b8d3f16c91c7d601e3859cabc7fb71871f4533', accent: "ghost", "icon-only": true }, h("button", { key: '8349fa9d8d15f1f820035d1669ef60d10829022d', id: "popover-target", class: { 'gux-is-pressed': this.isOpen }, onClick: () => this.togglePopover(), ref: el => (this.actionButton = el), type: "button", disabled: this.disabled, "aria-label": this.i18n('link'), "aria-haspopup": "true", "aria-expanded": this.isOpen.toString() }, h("gux-icon", { key: 'c98e7654129a3160adbc03b9c08c4109122fff21', size: "small", "icon-name": "fa/link-simple-regular", decorative: true })), this.renderTooltip()), h("gux-popover", { key: 'd9c70c9f4ad55ebb955751d349d9242b88a16ab1', "is-open": this.isOpen, for: "popover-target" }, h("div", { key: '156f243b70d8cf32e237ea751dd274cb7b764176', class: "gux-popover-content-wrapper" }, h("gux-form-field-text-like", { key: '819c53504c6e99da78637c9a0cdebac0c19cccb2' }, h("input", { key: '7e11f6f5c0032c99cda31355b0b8b757dccbea47', id: "textToDisplay", ref: el => (this.textToDisplayInputElement = el), slot: "input", type: "text" }), h("label", { key: '3f66bb54612a3cac364a8f43025bcd7f095656f7', slot: "label" }, this.i18n('textToDisplay'))), h("gux-form-field-text-like", { key: '842113a08dbcc053ac64726c87fb5a2d89b259de' }, h("input", { key: '836db888c19706a4b14dc7d35eb55e902fcd45a5', ref: el => (this.linkAddressInputElement = el), slot: "input", type: "text" }), h("label", { key: 'aaf0d14cccb4b44bf1a7c32bad1302975244fc5b', slot: "label" }, this.i18n('linkAddress'))), h("gux-cta-group", { key: '8e3a45cb60f5b7d99504518ccc88f0d6a57e4d53', align: "end" }, h("gux-button", { key: 'a8893b5a2265d48e07eeb154d19b4ccebc6e7147', onClick: () => this.emitLinkOptions(), slot: "primary" }, this.i18n('insert')), h("gux-button", { key: '34855e70fa26628fd9f64420acb6b654bdbaf9ab', onClick: () => this.togglePopover(), slot: "dismiss" }, this.i18n('cancel')))))));
+    }
+    static get is() { return "gux-rich-text-editor-action-link"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gux-rich-text-editor-action-link.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gux-rich-text-editor-action-link.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "disabled",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isOpen": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "linkOptions",
+                "name": "linkOptions",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ textToDisplay: string; href: string }",
+                    "resolved": "{ textToDisplay: string; href: string; }",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "root"; }
+    static get listeners() {
+        return [{
+                "name": "keydown",
+                "method": "handleKeydown",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+}
+__decorate([
+    OnClickOutside({ triggerEvents: 'mousedown' })
+], GuxRichTextEditorActionLink.prototype, "onClickOutside", null);

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-action/gux-rich-text-editor-action-rich-style/gux-rich-text-editor-action-rich-style.js

@@ -163,7 +163,7 @@ export class GuxRichTextEditorActionRichStyle {
                 : 'custom/chevron-down-small-regular', "screenreader-text": this.i18n('richStyleDropdown') }))));
     }
     render() {
-        return (h("gux-popup", { key: 'ead5e0b9266ba91cb3d455621081794c3439cd4f', expanded: this.expanded, exceedTargetWidth: true, placement: "bottom-start" }, this.renderTarget(), this.renderPopup()));
+        return (h("gux-popup", { key: 'f08a0a259e66577c1d0efd652ef0ade412b54963', expanded: this.expanded, exceedTargetWidth: true, placement: "bottom-start" }, this.renderTarget(), this.renderPopup()));
     }
     static get is() { return "gux-rich-text-editor-action-rich-style"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-action-group/gux-rich-text-editor-action-group.js

@@ -12,7 +12,7 @@ export class GuxRichTextEditorActionGroup {
         }
     }
     render() {
-        return (h(Host, { key: '2422c0033a6a55bf6f24e13b17423a694055a3c1' }, h("div", { key: '55abdcfe3509f92b5fc7f59fd74c7231ba2092aa', class: "gux-action-group-container" }, h("slot", { key: 'a9012112cc1a1b3909be863466102ed6079131c6' })), this.renderActionGroupDivider()));
+        return (h(Host, { key: 'ffe8dc89c851b4d23b95039a658ce5ac6d7c19f8' }, h("div", { key: 'bf21c1a4977b2635d7f04e30be05b110de52d1b6', class: "gux-action-group-container" }, h("slot", { key: '49e7caf93ceb05b11ddddf5a64696782e2d04577' })), this.renderActionGroupDivider()));
     }
     static get is() { return "gux-rich-text-editor-action-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-list/gux-rich-style-list-item/gux-rich-style-list-item.js

@@ -28,7 +28,7 @@ export class GuxRichStyleListItem {
         trackComponent(this.root);
     }
     render() {
-        return (h(Host, { key: '6dc607e4a0056690a26c91a6331de686902859c0', role: "listitem" }, h("button", { key: '0cdfdd84992f119f429daff01062ae3c07a8e49b', type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: 'a9f637910c0a06ab2030e16bc3abfbc692391014' }))));
+        return (h(Host, { key: '4bd7d026d50812a706946d470dbb4e1ef9a6f7b8', role: "listitem" }, h("button", { key: 'ef5f0873f68c1645897c3ba0e616c018042c8561', type: "button", tabIndex: -1, disabled: this.disabled }, h("slot", { key: 'c0ec924cb8797c5d154e3337ce9ab3df7fcbdd16' }))));
     }
     static get is() { return "gux-rich-style-list-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-rich-text-editor/gux-rich-text-editor-list/gux-rich-text-editor-list.js

@@ -61,7 +61,7 @@ export class GuxRichTextEditorList {
         return (h("span", { tabindex: "-1", "aria-hidden": "true" }));
     }
     render() {
-        return (h(Host, { key: '61bed89946e7b346628a8dd15ac69c81dd5461d3', role: "list" }, this.renderFocusTarget(), h("slot", { key: '8db5456231fa27cc4792c06ab644d0361af38f3e', onSlotchange: () => this.setListItems() })));
+        return (h(Host, { key: '7157211c43c642991e48acb643a307180692b689', role: "list" }, this.renderFocusTarget(), h("slot", { key: '86a09fcf4cd759973b4c256356890800ecea5945', onSlotchange: () => this.setListItems() })));
     }
     static get is() { return "gux-rich-text-editor-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-screen-reader/gux-screen-reader.js

@@ -8,7 +8,7 @@ export class GuxScreenReader {
         trackComponent(this.root);
     }
     render() {
-        return (h("span", { key: 'ce8ede9051231911b586257f541ae6ae1f499b9c', class: "gux-sr-only" }, h("slot", { key: '33f9ba5bdd85f33e249ac48d4d6a7fe9d8d7e39b' })));
+        return (h("span", { key: '45a49c75e52bbc4c7bcaf8870118fdaf50b48f25', class: "gux-sr-only" }, h("slot", { key: 'c1cc69187d4562bfde469ce092fb11bab7869c59' })));
     }
     static get is() { return "gux-screen-reader-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-segmented-control/gux-segmented-control-item/gux-segmented-control-item.js

@@ -48,19 +48,19 @@ export class GuxSegmentedControlItem {
         }
     }
     render() {
-        return (h("div", { key: '2a9206eda1a4fbfc42ef3c81f126460092b67a56', class: {
+        return (h("div", { key: 'c8996164a4408dc94091f51e370ae642ee176f1b', class: {
                 'gux-container': true,
                 'gux-parent-disabled': this.hasDisabledParent(),
                 'gux-start': this.isInStartPosition(),
                 'gux-end': this.isInEndPosition()
-            } }, h("button", { key: 'b362ff0967b164a564fefeedb23886a76014b489', class: {
+            } }, h("button", { key: '732bb008028e2bd3eea43b72913aa449aab750ea', class: {
                 'gux-segmented-control-item': true,
                 'gux-icon-only': this.iconOnly,
                 'gux-selected': this.selected
-            }, type: "button", disabled: this.disabled || this.hasDisabledParent() }, this.renderIconSlot(), h("div", { key: '7113f8d8a800330fc6cbc1d6173247f53dbdaddb', class: {
+            }, type: "button", disabled: this.disabled || this.hasDisabledParent() }, this.renderIconSlot(), h("div", { key: 'c454e906a3c90f59adbfee0639b3493540021164', class: {
                 'gux-text': true,
                 'gux-icon-only': this.iconOnly
-            } }, h("slot", { key: 'a1c4f88098ef9611c9c36bcb0ccdc903222c7556', name: "text" }))), this.renderTooltip()));
+            } }, h("slot", { key: 'be804d2c015dc75e438fecf5736e311678beee44', name: "text" }))), this.renderTooltip()));
     }
     static get is() { return "gux-segmented-control-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-segmented-control/gux-segmented-control.js

@@ -31,7 +31,7 @@ export class GuxSegmentedControl {
         });
     }
     render() {
-        return (h(Host, { key: '607f885b5a78b63b8c8fda2c8d58bad988b792cc', role: "group" }, h("slot", { key: '23747d2307246856b1b85fad90b57b2876ccfb24', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: '2526cd5365bf0134665fc26199079ef80654ffa0', role: "group" }, h("slot", { key: 'e9ab9cde7338bdb2a21fa473094025aa34b70231', onSlotchange: this.slotChanged.bind(this) })));
     }
     static get is() { return "gux-segmented-control-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-selector-cards/gux-selector-card/gux-selector-card.js

@@ -50,11 +50,11 @@ export class GuxSelectorCard {
         }
     }
     render() {
-        return (h("div", { key: 'a8b8ef0346f5ce4da260b0c539fc4cb67b9e48df', class: {
+        return (h("div", { key: '15bb201be48f8b5e0ea8130b8f571a342ec6e768', class: {
                 'gux-selector-card': true,
                 [`gux-${this.variant}`]: true,
                 'gux-disabled': this.disabled
-            } }, h("div", { key: 'effffae5174fdaaa2a4e76fa5fb77d2c147ffad3', class: "gux-content" }, h("div", { key: '975b1baadd6fe6228ba043718ae849babe44af16', class: "gux-icon" }, h("slot", { key: '9067ce345a39dc8d7a98b80e173e535a1a75f224', name: "icon" })), h("div", { key: '5b75385861ce4aab688ce2a03d2ca7c583c4a2e2', class: "gux-label-container" }, h("slot", { key: '250af4340ac66396b5eb5e1e644971d368e8f936', name: "label" })), h("slot", { key: 'b48c03e8b28fdebc7edaa25f51a5544f75cca6c8', name: "input" }), this.renderDescription(), this.renderBadge())));
+            } }, h("div", { key: 'ee44e33a9b94c112161a1e44ea5d252d269082b6', class: "gux-content" }, h("div", { key: 'fcd3bc9d28281a9a4fa12dd0b3d0c12fa5441fa8', class: "gux-icon" }, h("slot", { key: '542a0ec6a7c218e36edab8d73fe7f1d45fec5b57', name: "icon" })), h("div", { key: 'c242c933b45b05bcdbd94c24ebb2200d4f6c0743', class: "gux-label-container" }, h("slot", { key: '873201da7e0ddeefc56bd2ea6d23e240d08473d7', name: "label" })), h("slot", { key: '953ef926caa01e09dd695232df7c49271aac855e', name: "input" }), this.renderDescription(), this.renderBadge())));
     }
     static get is() { return "gux-selector-card-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-selector-cards/gux-selector-cards.js

@@ -8,7 +8,7 @@ export class GuxSelectorCards {
         trackComponent(this.root);
     }
     render() {
-        return (h("div", { key: '28d954d69949d8b6a5a0490d7aa2d46eeebd2cc6', class: "gux-selector-cards" }, h("slot", { key: '205af7961226792ac7ceecfcfa3101e02090b1c2' })));
+        return (h("div", { key: '5fa8e13dd7c5a6c681cd098d652d3804e74148ed', class: "gux-selector-cards" }, h("slot", { key: '7e7822a514bc74deb4335a779592cb380d51d7c1' })));
     }
     static get is() { return "gux-selector-cards-beta"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/beta/gux-side-panel/components/gux-modal-side-panel/gux-modal-side-panel.js

@@ -46,7 +46,7 @@ export class GuxModalSidePanel {
     }
     render() {
         const titleID = randomHTMLId();
-        return (h("dialog", { key: 'c992d49593c00ce7335f19954d13ab66338d315d', ref: el => (this.dialogElement = el), "aria-labelledby": titleID }, h("gux-side-panel-beta", { key: '7dfc2eeb59dbc0c45878805586319a58e88599a4', size: this.size }, h("div", { key: 'e7427a86193c56d0f1200df4cc48d7c326e7dd3e', slot: "heading", id: titleID }, h("slot", { key: 'af4c30fec90f887da6f834d3573126e0990645b8', name: "heading" })), hasSlot(this.root, 'description') && (h("div", { key: 'b4296be7e5b393872c5d17db83d9cea3ae0f53c0', slot: "description" }, h("slot", { key: '5817ef5d3c7b0dbaafae7159ec5f8f38e8d682fb', name: "description" }))), h("div", { key: '716cdbaf3f5cf43b4b965a44aceecb69a050d41f', slot: "content" }, h("slot", { key: 'e22c441441f5ece23b3dde8548b4523382370aa9', name: "content" })), h("div", { key: 'f36f2f216e59539333f3026aeeb781742e333c8a', slot: "footer" }, h("slot", { key: '6811443efe597acf31b78e739c94be88e8ea3614', name: "footer" })))));
+        return (h("dialog", { key: 'a042d52c8c52e8b20433cd50eb16eb9ad1ca903a', ref: el => (this.dialogElement = el), "aria-labelledby": titleID }, h("gux-side-panel-beta", { key: '443af3aa0cf374dff1ab2473f68b2b250d400e49', size: this.size }, h("div", { key: '7760524151fc29f97378790c663739b622fb4202', slot: "heading", id: titleID }, h("slot", { key: 'f179879278ca143a8aeec5b67c0b0b7b4e2aa039', name: "heading" })), hasSlot(this.root, 'description') && (h("div", { key: 'e7a557c185cfb02635b85ba6f180739d7d7f0aba', slot: "description" }, h("slot", { key: '0abc48e56d6fbad1ceb6e82fdc0fdbec349ef543', name: "description" }))), h("div", { key: '84ffb0d9772db212974c5e64291bd665a8320334', slot: "content" }, h("slot", { key: '3ab18e6239389e79f7af652e20402530b7c7595b', name: "content" })), h("div", { key: 'aa9df45e4d3cd5fc05ac3fd2890f4073bfd200ce', slot: "footer" }, h("slot", { key: 'dad47d95365f2c00451bc95c23fcf55f2bca563d', name: "footer" })))));
     }
     static get is() { return "gux-modal-side-panel-beta"; }
     static get encapsulation() { return "shadow"; }