genesys-spark-components 4.137.1 → 4.138.0

package/dist/collection/components/legacy/gux-advanced-dropdown-legacy/gux-advanced-dropdown.js

@@ -20,15 +20,22 @@ import advancedDropDownResources from "./i18n/en.json";
  */
 export class GuxAdvancedDropdownLegacy {
     constructor() {
+        /**
+         * Disable the input and prevent interactions.
+         */
         this.disabled = false;
-        this.placeholder = undefined;
+        /**
+         * Whether the list should filter its current options.
+         */
         this.noFilter = false;
+        /**
+         * Timeout between filter input changed and event being emitted.
+         */
         this.filterDebounceTimeout = 500;
+        /**
+         * CSS string used to set the maximum height of the dropdown option container. Default is set to 10 options as defined by UX.
+         */
         this.dropdownHeight = '320px';
-        this.srLabelledby = undefined;
-        this.opened = undefined;
-        this.currentlySelectedOption = undefined;
-        this.selectionOptions = undefined;
     }
     watchValue(newValue) {
         if (this.opened && newValue) {
@@ -70,9 +77,9 @@ export class GuxAdvancedDropdownLegacy {
         }
     }
     render() {
-        return (h("gux-popup", { key: 'f4059d5354d1e76054e93fb226b035e745ec51c3', expanded: this.opened, disabled: this.disabled }, h("div", { key: '3ed651aceb3c0eecaafe9553f1d7d24a6d39f63c', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: '5b55314cd983ca7a3e65fc2af3e32e9b6d1e2a53', ref: el => (this.inputBox = el), class: "gux-select-input", "aria-labelledby": this.srLabelledby, tabindex: "0", onKeyDown: e => this.inputKeyDown(e) }, this.placeholder && !this.value && (h("span", { key: '61389af1e95fbb40fab5f953c231f0ee64c0ca80', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: '0d0390475d0c527778e3519dee6ded1f7a66f7b4', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: '3f852d832791cc0670034cea02911b61a0451c4c', class: "gux-icon-wrapper" }, h("gux-icon", { key: 'd31a3a64c79c232544a5fb403ad89e0cac3693b8', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: '1b57b892c851a2e71d53f83f93b1f1e929d42404', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: 'ef8f51e0ad0d209aade37e0572b69de1858d0dbb', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: 'e0c9c8b17b418e7114f7fad6031815f898e6973f', "label-position": "screenreader" }, h("label", { key: 'd72d4c26b1c1d3c1bf96d05fdbda5bf5e8fd1ad8', slot: "label" }, this.i18n('searchAria')), h("input", { key: '3b59353498a7ed48f961377c4e7590206f06f973', slot: "input", type: "search", onInput: (event) => {
+        return (h("gux-popup", { key: '8a78df08f5d2a5b8386ba4e13b04d5d54fb26d1c', expanded: this.opened, disabled: this.disabled }, h("div", { key: '889b4d4fb3682d0182b5ba8994ee99d05506a4d3', slot: "target", class: "gux-select-field", onMouseDown: () => this.inputMouseDown() }, h("a", { key: 'e3904dd5074062c344d133a7c22fd800fd1b6ac4', ref: el => (this.inputBox = el), class: "gux-select-input", "aria-labelledby": this.srLabelledby, tabindex: "0", onKeyDown: e => this.inputKeyDown(e) }, this.placeholder && !this.value && (h("span", { key: 'aac718eb8dad922366872cf0b8a1ef9244ec4ed8', class: "gux-select-placeholder", title: this.placeholder }, this.placeholder)), this.value && (h("span", { key: '335dbf1e7c953ff1bc547673ca9793c7306d92be', class: "gux-select-value", title: this.value }, this.value))), h("div", { key: 'cbfd4fe3c305dbc37d1ca792a4e06d6509638c7f', class: "gux-icon-wrapper" }, h("gux-icon", { key: 'eafeeb6ecd8240b95b70e5aa9873c6eeb89b7070', decorative: true, "icon-name": "custom/chevron-down-small-regular" }))), h("div", { key: 'cdc3fbe6adfda50f3770a62becfcbbf56ef4e0fa', slot: "popup", class: "gux-advanced-dropdown-menu" }, h("div", { key: '9931f00641ecb454c45782ec366534b492cab544', class: "gux-dropdown-menu-container" }, h("gux-form-field-search", { key: '436fbd0b22817c283daeb50b2c0ee403e87972d8', "label-position": "screenreader" }, h("label", { key: '4ee75fc60f1dcb095aea3e45a8506669b0d23d5c', slot: "label" }, this.i18n('searchAria')), h("input", { key: 'f6880d792b6003f236e4779a5329a22521d7b0af', slot: "input", type: "search", onInput: (event) => {
                 this.handleSearchInput(event);
-            }, ref: el => (this.searchInput = el) })), h("div", { key: '287a0a31b612523947ea74efaa8314c21f58cbc1', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: 'a4465272f922458cc361798793c2980e22135a3c' }))))));
+            }, ref: el => (this.searchInput = el) })), h("div", { key: 'b917071143ac6304e93a40e2182c488cd7a27cef', class: "gux-dropdown-options", style: { maxHeight: this.dropdownHeight }, onKeyDown: e => this.optionsKeyDown(e) }, h("slot", { key: '760d2632deee46edda74124407e2f0986f056169' }))))));
     }
     updateSelectionState() {
         this.selectionOptions = this.getSelectionOptions();
@@ -223,6 +230,8 @@ export class GuxAdvancedDropdownLegacy {
                     "tags": [],
                     "text": "Disable the input and prevent interactions."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
@@ -241,6 +250,8 @@ export class GuxAdvancedDropdownLegacy {
                     "tags": [],
                     "text": "The dropdown's placeholder."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "placeholder",
                 "reflect": false
             },
@@ -258,6 +269,8 @@ export class GuxAdvancedDropdownLegacy {
                     "tags": [],
                     "text": "Whether the list should filter its current options."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "no-filter",
                 "reflect": false,
                 "defaultValue": "false"
@@ -276,6 +289,8 @@ export class GuxAdvancedDropdownLegacy {
                     "tags": [],
                     "text": "Timeout between filter input changed and event being emitted."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "filter-debounce-timeout",
                 "reflect": false,
                 "defaultValue": "500"
@@ -294,6 +309,8 @@ export class GuxAdvancedDropdownLegacy {
                     "tags": [],
                     "text": "CSS string used to set the maximum height of the dropdown option container. Default is set to 10 options as defined by UX."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "dropdown-height",
                 "reflect": false,
                 "defaultValue": "'320px'"

package/dist/collection/components/legacy/gux-disclosure-button-legacy/gux-disclosure-button.js

@@ -9,9 +9,17 @@ import translationResources from "./i18n/en.json";
 export class GuxDisclosureButtonLegacy {
     constructor() {
         this.panelId = 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() {
@@ -38,10 +46,10 @@ export class GuxDisclosureButtonLegacy {
         this.updateIcon();
     }
     render() {
-        return (h("div", { key: 'bef8cddef519a2cb8ec12c152afade245c76c714', class: `gux-disclosure-button-container gux-${this.position}` }, 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') }, h("gux-icon", { key: '505d17fcb664df950b98817214455c8e0960c737', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '03fac25eea867bf43f87a06bb2098abee7f8c7ee', id: this.panelId, class: {
+        return (h("div", { key: 'dfd11315797588b49d1f799786a294842013d48d', class: `gux-disclosure-button-container gux-${this.position}` }, 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') }, h("gux-icon", { key: 'a2fefab21c3de43de2c7199753a35bd68b62360e', "icon-name": `${this.icon}`, decorative: true })), h("div", { key: '362e1b3910ac360e5bc0e1a8900b82446f447f1f', id: this.panelId, class: {
                 'gux-disclosure-panel': true,
                 'gux-active': this.isOpen
-            }, role: "region" }, h("slot", { key: '7372dbc3ec23058ae0d27b46044a404053095906', name: "panel-content" }))));
+            }, role: "region" }, h("slot", { key: '453039d51dbb0e6299ade2aee243acfc0eaffab5', name: "panel-content" }))));
     }
     static get is() { return "gux-disclosure-button-legacy"; }
     static get encapsulation() { return "shadow"; }
@@ -77,6 +85,8 @@ export class GuxDisclosureButtonLegacy {
                     "tags": [],
                     "text": "Indicates the position of the button panel"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "position",
                 "reflect": false,
                 "defaultValue": "'left'"
@@ -95,6 +105,8 @@ export class GuxDisclosureButtonLegacy {
                     "tags": [],
                     "text": "Indicates the label for the disclosure button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "label",
                 "reflect": false
             },
@@ -112,6 +124,8 @@ export class GuxDisclosureButtonLegacy {
                     "tags": [],
                     "text": "Used to open or close the disclosure panel"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "is-open",
                 "reflect": false,
                 "defaultValue": "false"

package/dist/collection/components/legacy/gux-modal-legacy/gux-modal-legacy.js

@@ -9,9 +9,11 @@ import { trackComponent } from "../../../utils/tracking/usage";
  */
 export class GuxModalLegacy {
     constructor() {
+        /**
+         * Indicates the size of the modal (small, medium or large)
+         */
         this.size = 'dynamic';
         this.trapFocus = true;
-        this.initialFocus = undefined;
     }
     handleKeyEvent(event) {
         if (event.key === 'Escape') {
@@ -42,10 +44,10 @@ export class GuxModalLegacy {
         const hasModalTitleSlot = this.hasModalTitleSlot();
         const hasFooterButtons = this.hasFooterButtons();
         const titleID = randomHTMLId();
-        return (h("div", { key: '03f3345c7976259d303e5a90cef1f90e9ed945f8', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: '6d996bf71389945c20620588f63b97bae1adcf0f', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '087b55478498c89f537af3777c1beab4d903e063', class: "gux-modal-header", id: titleID }, h("slot", { key: '03421a7218bdba8a3daf898575cfda9a1e6793a7', name: "title" }))), h("gux-dismiss-button", { key: '5d9a4cf25bfca9a421782178292478f798362cc4', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: '8d659e428a5f711e9a6b8c5874a37b82a492eac8', class: {
+        return (h("div", { key: '2d18a0bb73e802287f7276f624620318c58cf240', class: "gux-modal", role: "dialog", "aria-modal": "true", "aria-labelledby": hasModalTitleSlot ? titleID : null }, h("div", { key: 'f9a6082c0d4472e6cbf484221ed41d287c119683', class: `gux-modal-container gux-${this.size}` }, this.renderModalTrapFocusEl(), hasModalTitleSlot && (h("h1", { key: '63ce16a375f2d5d374df0efaf65f026333f054f3', class: "gux-modal-header", id: titleID }, h("slot", { key: 'c8c78b89fd771fe39a7bbc513385ee11b7da474e', name: "title" }))), h("gux-dismiss-button", { key: '2b6e4165d02dca606879da5a6dd947dbeef8533c', onClick: this.onDismissHandler.bind(this), ref: el => (this.dismissButton = el) }), h("div", { key: 'b37f23a11378eb9ce1264bd81b79a0726d6eed10', class: {
                 'gux-modal-content': true,
                 'gux-no-buttons': !hasFooterButtons
-            } }, h("p", { key: '162fc85dc6aa8c27136aa62c0e6b85e598c408f9' }, h("slot", { key: '3e0dd4c8dc4223b015e76e9ad242c4bfbcdc74ff', name: "content" }))), hasFooterButtons && (h("div", { key: 'd907a2c3dfe55c8433e23696b1b978f23f425b76', class: "gux-button-footer" }, h("div", { key: '46980f01b328f8bc6edc3efbbd3198ea8d086d04', class: "gux-left-align-buttons" }, h("slot", { key: '87643cd1528b294f25ec41a1e286149b094a7f9f', name: "left-align-buttons" })), h("div", { key: '293e4349fda8a877f9d084104f55a46dd7c44674', class: "gux-right-align-buttons" }, h("slot", { key: 'c7d087a32f336a97a8e8c8becdf27886f83c5739', name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
+            } }, h("p", { key: '30f622b062ed43b6fef5e7e2bbf68ac56bf98730' }, h("slot", { key: 'dc09cef7c9d6ec04ea7a3f896e0e7ddf3ed5cac0', name: "content" }))), hasFooterButtons && (h("div", { key: '6f67c283914532196a52369fb1b84cd4e948f462', class: "gux-button-footer" }, h("div", { key: '3299634c7f06b9e41ee607d383df3bb1b2e7c93b', class: "gux-left-align-buttons" }, h("slot", { key: '3890a90f49ab497b9713f5e20086e5adfdb0cc9c', name: "left-align-buttons" })), h("div", { key: '101d214018e9f8da983b074d5aeaa2c81d096912', class: "gux-right-align-buttons" }, h("slot", { key: '9e353e0aad1df37cfeee2bc944285308294a44c2', name: "right-align-buttons" })))), this.renderModalTrapFocusEl())));
     }
     // When trap-focus is enabled, focusing this element
     // will immediately redirect focus back to the dismiss button at the top of the modal.
@@ -109,6 +111,8 @@ export class GuxModalLegacy {
                     "tags": [],
                     "text": "Indicates the size of the modal (small, medium or large)"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "size",
                 "reflect": false,
                 "defaultValue": "'dynamic'"
@@ -127,6 +131,8 @@ export class GuxModalLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "trap-focus",
                 "reflect": false,
                 "defaultValue": "true"
@@ -145,6 +151,8 @@ export class GuxModalLegacy {
                     "tags": [],
                     "text": "Query selector for the element to initially focus when the modal opens\nDefaults to the first tabbable element"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "initial-focus",
                 "reflect": false
             }

package/dist/collection/components/legacy/gux-notification-toast-legacy/gux-notification-toast.js

@@ -7,13 +7,16 @@ import { trackComponent } from "../../../utils/tracking/usage";
  */
 export class GuxNotificationToast {
     constructor() {
+        /**
+         * The component accent.
+         */
         this.accent = 'neutral';
     }
     componentWillLoad() {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: '47a33ed4de5228de0e187987869c27b07e0d5787' }, h("div", { key: '361fb8c114bfbe51c8d16a8de214bdd723c0a6f7', class: `gux-icon gux-${this.accent}` }, h("slot", { key: 'bd3a78f5a5f05a0cf5098266766789ef8cc0a8f3', name: "icon" })), h("div", { key: 'dc19ff38c0c039b8296749f418cf6fcb06159ad9', class: "gux-content" }, h("gux-truncate", { key: 'ea408eb0806dd5f58bceeb9a7b8fbaef9e702fb4', class: "gux-title", "max-lines": 1 }, h("slot", { key: 'c6830def6d5e01d3761f7b5a187cf5a52866a0aa', name: "title" })), h("gux-truncate", { key: '319a9a3e695163d12a869577b88a4c84afbf1713', class: "gux-message", "max-lines": 2 }, h("slot", { key: '789ff5fb32b7da6408d2ee31328e2a39d3d6bd86', name: "message" }))), h("gux-dismiss-button", { key: '2abc520e1b95ccc419209202de06265398542179', onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '05fb3239ed8a7b3b97cc88b6a613cc8b2669bf6e' }, h("div", { key: 'b5c97740a392fb8bf6dd10dfc17717ba9b236c1f', class: `gux-icon gux-${this.accent}` }, h("slot", { key: 'd8d9b5bdbc05665dee31bd29244870ff07df9078', name: "icon" })), h("div", { key: '2ea8b352598f85ad7747d86b073c96202ae05423', class: "gux-content" }, h("gux-truncate", { key: '780143649c27a9a3df52ba03624923972b20c927', class: "gux-title", "max-lines": 1 }, h("slot", { key: '763979ada598277bd68461c15685570ec37f8f58', name: "title" })), h("gux-truncate", { key: 'a87f67cde3759bcc6fa673580b2e2820ab48ba94', class: "gux-message", "max-lines": 2 }, h("slot", { key: '9c1e1d712dfc9ed9527934474c66b28caf8bb471', name: "message" }))), h("gux-dismiss-button", { key: 'ac4562e6830355aa38569035621936aa7b8bbce2', onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();
@@ -56,6 +59,8 @@ export class GuxNotificationToast {
                     "tags": [],
                     "text": "The component accent."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "accent",
                 "reflect": false,
                 "defaultValue": "'neutral'"

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination-buttons-legacy/gux-pagination-buttons.js

@@ -4,8 +4,6 @@ import paginationResources from "./i18n/en.json";
 import { GuxPaginationButtonsService } from "./gux-pagination-button.service";
 export class GuxPaginationButtonsLegacy {
     constructor() {
-        this.currentPage = undefined;
-        this.totalPages = undefined;
         this.layout = 'full';
     }
     get onFirstPage() {
@@ -71,7 +69,7 @@ export class GuxPaginationButtonsLegacy {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: 'd8c81c219ac05bc53adb30f145ae963fcfcc32c2', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '8e885c3c6a8faaa84848eb50224dd7480b4dccb8', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '7fcea3d2f0278a6a79f1ab2574effe6a1c2e4e7e', accent: "ghost" }, h("button", { key: '6d7d3e30c99c3b5e8cc211cc1f4c0b030251188c', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: 'a9ecd35be4e3ab14eddd4cebbab05f96c45dc84a', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: 'a51237614face62ae69ab1c834ba0bc486324d30', accent: "ghost" }, h("button", { key: '31c7817937aa6730886e8f17f63a7dca79c8921f', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: 'b55f173a1ac205741ae649381f89606f7589d82e', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: '39e50e104d0e8c9924deaebec2d338893c8286ff', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '7c65c3c5a1e373b6d3c12dc7bb64a3cb4674b217', accent: "ghost" }, h("button", { key: '712b22788b90bb251807f95eb775cd1c1dabf358', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: 'bb75fa24ff0f240a57627f0faeba7f2f9182aac8', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: '3335aedc8c13bc0384c4095f38355b7a9636a5d2', accent: "ghost" }, h("button", { key: '0eafffbba4c710d54e23400fb017c50f9ad4340d', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '9ed3f45ee34f10a779bc24ff9e952134d4e0c2ca', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
+        return (h("div", { key: '94e78129a0eab8031622b92ed8fe5f392a6495b0', class: `gux-pagination-buttons-container gux-${this.layout}` }, h("div", { key: '5c1a04dc93ae0fd25c4f0b1121d633fe9b951b2c', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '6cbc04a2b7e1bfb448894c8895ac3232648e5fc3', accent: "ghost" }, h("button", { key: '7e05c92cd3e4fff399ce9dbbff8e6f97e4c45147', title: this.i18n('first'), disabled: this.onFirstPage, onClick: this.handleClickFirst.bind(this) }, h("gux-icon", { key: '6f8f9d39f5124c98221b90b840557f79d1bd206a', decorative: true, "icon-name": "fa/chevrons-left-regular" }))), h("gux-button-slot", { key: '36ea45dfcb84f21e0968dd47f11e56296596ade3', accent: "ghost" }, h("button", { key: 'e3f613c72ab8a52b831bd02d8467a446d72fd767', title: this.i18n('previous'), disabled: this.onFirstPage, onClick: this.handleClickPrevious.bind(this) }, h("gux-icon", { key: 'be79fa6701289fe96cba8dd9c50772159c56de5c', decorative: true, "icon-name": "custom/chevron-left-small-regular" })))), this.getPagePicker(this.layout), h("div", { key: '3152b124bf97384c1d0bc4b9412e0c112a4d6812', class: "gux-pagination-buttons-group" }, h("gux-button-slot", { key: '74f2c533370dab51946d1fd639382c57cfb4435c', accent: "ghost" }, h("button", { key: '10765d3f555991bde133be3fade1fba2185bb7cc', title: this.i18n('next'), disabled: this.onLastPage, onClick: this.handleClickNext.bind(this) }, h("gux-icon", { key: '454302ddb2294af9922116255aa3f60eace8edf0', decorative: true, "icon-name": "custom/chevron-right-small-regular" }))), h("gux-button-slot", { key: 'f4fc51a9e28351e111813f10b09a7aa5bc04d985', accent: "ghost" }, h("button", { key: '05e9a24f9c28995d8876ee2f76ab351a6e271830', title: this.i18n('last'), disabled: this.onLastPage, onClick: this.handleClickLast.bind(this) }, h("gux-icon", { key: '718c22f69a257dfa66d7c13256d8dca985cca2d9', decorative: true, "icon-name": "fa/chevrons-right-regular" }))))));
     }
     static get is() { return "gux-pagination-buttons-legacy"; }
     static get originalStyleUrls() {
@@ -100,6 +98,8 @@ export class GuxPaginationButtonsLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "current-page",
                 "reflect": false
             },
@@ -117,6 +117,8 @@ export class GuxPaginationButtonsLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "total-pages",
                 "reflect": false
             },
@@ -140,6 +142,8 @@ export class GuxPaginationButtonsLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "layout",
                 "reflect": false,
                 "defaultValue": "'full'"

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination-item-counts-legacy/gux-pagination-item-counts.js

@@ -23,10 +23,10 @@ export class GuxPaginationItemCountsLegacy {
         this.i18n = await buildI18nForComponent(this.root, paginationResources);
     }
     render() {
-        return (h("div", { key: '3969b1af65c90c8567a902566de629ffac63d0ca', class: "gux-pagination-item-counts-container" }, h("span", { key: '0bd93fccccfd9f95c077d1ae7a0088a9fc7b4022', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
+        return (h("div", { key: 'adc625e79d3bc3b2cee319fd36e01a6a7b55e2f0', class: "gux-pagination-item-counts-container" }, h("span", { key: 'ae0af79204b86e5902722892101fa644a8705a18', class: "gux-pagination-item-counts-range" }, this.i18n('itemCountDisplay', {
             firstItem: this.firstItem,
             lastItem: this.lastItem
-        })), h("span", { key: '7c8ab21a8206d034d482dab298f225bfb6bc1efa' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
+        })), h("span", { key: '98a27d3f011a9766d9fb69be3b1f47bb45e7a408' }, this.i18n('totalItems', { totalItems: this.totalItems }))));
     }
     static get is() { return "gux-pagination-item-counts-legacy"; }
     static get originalStyleUrls() {
@@ -55,6 +55,8 @@ export class GuxPaginationItemCountsLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "total-items",
                 "reflect": false,
                 "defaultValue": "0"
@@ -73,6 +75,8 @@ export class GuxPaginationItemCountsLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "current-page",
                 "reflect": false,
                 "defaultValue": "0"
@@ -91,6 +95,8 @@ export class GuxPaginationItemCountsLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "items-per-page",
                 "reflect": false,
                 "defaultValue": "25"

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination-items-per-page-legacy/gux-pagination-items-per-page.js

@@ -19,7 +19,7 @@ export class GuxPaginationItemsPerPageLegacy {
             }) }, h("gux-listbox", { "aria-label": this.i18n('itemsPerPage') }, h("gux-option", { value: "25" }, "25"), h("gux-option", { value: "50" }, "50"), h("gux-option", { value: "75" }, "75"), h("gux-option", { value: "100" }, "100"))));
     }
     render() {
-        return (h("div", { key: '454327fa8b75606eddaba6090d2761a27b7c9439', class: "gux-pagination-items-per-page-container" }, h("div", { key: '9cacb03bd2d17176a1ae60b970d600fd3c51957c', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: 'e345e541a007cff06b04c4cbcb8180ab4f99e097', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
+        return (h("div", { key: 'e601a72a600861196a6ef6ccdd5f55f43d6eee03', class: "gux-pagination-items-per-page-container" }, h("div", { key: '907d9f76dc84110cad4d4e52a23b8e675ab36f0f', class: "gux-pagination-items-per-page-picker" }, this.getDropdown()), h("div", { key: 'ec10de58cb9cfdbb2b75cae02a414cd8e79f924c', class: "gux-pagination-per-page" }, this.i18n('perPage'))));
     }
     static get is() { return "gux-pagination-items-per-page-legacy"; }
     static get originalStyleUrls() {
@@ -54,6 +54,8 @@ export class GuxPaginationItemsPerPageLegacy {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "items-per-page",
                 "reflect": false,
                 "defaultValue": "25"

package/dist/collection/components/legacy/gux-pagination-legacy/gux-pagination.js

@@ -2,11 +2,22 @@ import { h } from "@stencil/core";
 import { trackComponent } from "../../../utils/tracking/usage";
 export class GuxPaginationLegacy {
     constructor() {
+        /**
+         * The currently select page. Changes are watched by the component.
+         */
         this.currentPage = 1;
+        /**
+         * The total number of items in the data set. Used to calculate total page count
+         */
         this.totalItems = 0;
+        /**
+         * The max number of items on a page. Used to calculate total page count
+         */
         this.itemsPerPage = 25;
+        /**
+         * The pagination component can have different layouts to suit the available space
+         */
         this.layout = 'full';
-        this.totalPages = undefined;
     }
     setPage(page) {
         if (page <= 0) {
@@ -58,7 +69,7 @@ export class GuxPaginationLegacy {
         this.currentPage = this.calculateCurrentPage();
     }
     render() {
-        return (h("div", { key: 'a58ffb8af89a9a703d06e4d71eedace7124ceba0', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '36447ac1277e986ddc5d8ebd63b5b45c2173a803', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: '99ec98ab5d28bd4507fc71e694dbb888dc07f9c4', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
+        return (h("div", { key: '9fb7768816e0454d90373f6a01ab55569763ec1a', class: "gux-pagination-container" }, this.getPaginationInfoElement(this.layout), h("div", { key: '24c5f9d3d51777b64071d9ebf14ba61ad930788b', class: "gux-pagination-change" }, h("gux-pagination-buttons-legacy", { key: '162dd6ade2c6aba07a3810d3ca26908c706cc630', layout: this.layout, "current-page": this.currentPage, "total-pages": this.totalPages, onInternalcurrentpagechange: this.handleInternalcurrentpagechange.bind(this) }))));
     }
     static get is() { return "gux-pagination-legacy"; }
     static get encapsulation() { return "shadow"; }
@@ -88,6 +99,8 @@ export class GuxPaginationLegacy {
                     "tags": [],
                     "text": "The currently select page. Changes are watched by the component."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "current-page",
                 "reflect": false,
                 "defaultValue": "1"
@@ -106,6 +119,8 @@ export class GuxPaginationLegacy {
                     "tags": [],
                     "text": "The total number of items in the data set. Used to calculate total page count"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "total-items",
                 "reflect": false,
                 "defaultValue": "0"
@@ -130,6 +145,8 @@ export class GuxPaginationLegacy {
                     "tags": [],
                     "text": "The max number of items on a page. Used to calculate total page count"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "items-per-page",
                 "reflect": false,
                 "defaultValue": "25"
@@ -154,6 +171,8 @@ export class GuxPaginationLegacy {
                     "tags": [],
                     "text": "The pagination component can have different layouts to suit the available space"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "layout",
                 "reflect": false,
                 "defaultValue": "'full'"

package/dist/collection/components/legacy/gux-simple-toast-legacy/gux-simple-toast.js

@@ -6,13 +6,16 @@ import { trackComponent } from "../../../utils/tracking/usage";
  */
 export class GuxSimpleToast {
     constructor() {
+        /**
+         * The component accent.
+         */
         this.accent = 'neutral';
     }
     componentWillLoad() {
         trackComponent(this.root, { variant: this.accent });
     }
     render() {
-        return (h(Host, { key: 'b022fe27d1a0c806917115667e200a58468eb474' }, h("div", { key: 'e01dd34b6461873c99e06cdfd5cba65a15ea9d67', class: `gux-icon gux-${this.accent}` }, h("slot", { key: 'e95707158b85975f307e8f45e4fa5d2cc1d2f05b', name: "icon" })), h("gux-truncate", { key: 'cf410ee970d02de03f41404e3a8877e28f07f0ea', class: "gux-message", "max-lines": 2 }, h("slot", { key: '7c0492f7df9f8fc0b45b6a9f9dec3e32f7a00da6', name: "message" })), h("gux-dismiss-button", { key: 'ff8560eb767a83c595c5a66b8898f9fd4653ef0e', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
+        return (h(Host, { key: '157ec729027a3467e254db6b592f81172a462f2e' }, h("div", { key: 'dbf92076c88be8e234b25faa4e6ff582082aa38f', class: `gux-icon gux-${this.accent}` }, h("slot", { key: '7a83c235f3a25668879fb51053b612f863ebb6ab', name: "icon" })), h("gux-truncate", { key: '1f8981a054dae732bd85f3a866d3eb04f1303a91', class: "gux-message", "max-lines": 2 }, h("slot", { key: '29b960000f1e1acf28fa75115ed7f48d719a0580', name: "message" })), h("gux-dismiss-button", { key: '023a768ce4dd6f863e53c8d9de74455de1ca152d', class: "gux-dismiss", position: "inherit", onClick: this.onDismissClickHandler.bind(this) })));
     }
     onDismissClickHandler(event) {
         event.stopPropagation();
@@ -55,6 +58,8 @@ export class GuxSimpleToast {
                     "tags": [],
                     "text": "The component accent."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "accent",
                 "reflect": false,
                 "defaultValue": "'neutral'"

package/dist/collection/components/legacy/gux-switch-legacy/gux-switch-item/gux-switch-item.js

@@ -4,7 +4,6 @@ import { h, Host } from "@stencil/core";
  */
 export class GuxSwitchItem {
     constructor() {
-        this.value = undefined;
         this.selected = false;
         this.disabled = false;
     }
@@ -14,7 +13,7 @@ export class GuxSwitchItem {
         }
     }
     render() {
-        return (h(Host, { key: '4a1ce4e5241f9120e9b6da06110dbdbd784c5569', class: { 'gux-selected': this.selected } }, h("button", { key: 'e6bd6a36882d873813cdcb3f038443b5ecc28df6', type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: 'f96b1f1c3078030a2ef6c850376dc036cffcf25c' }))));
+        return (h(Host, { key: '427c0acdb3ea194da69f2e0f3734756dc8d25b31', class: { 'gux-selected': this.selected } }, h("button", { key: '20e6b544fc6b8debdaff1fce9fd0182401e4e0e7', type: "button", class: "gux-switch-item", disabled: this.disabled }, h("slot", { key: 'e06695181ca1640f0abc4ec29bd2a19ceffb5a34' }))));
     }
     static get is() { return "gux-switch-item"; }
     static get originalStyleUrls() {
@@ -43,6 +42,8 @@ export class GuxSwitchItem {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "value",
                 "reflect": false
             },
@@ -60,6 +61,8 @@ export class GuxSwitchItem {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "selected",
                 "reflect": false,
                 "defaultValue": "false"
@@ -78,6 +81,8 @@ export class GuxSwitchItem {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"

package/dist/collection/components/legacy/gux-switch-legacy/gux-switch.js

@@ -6,7 +6,6 @@ import { trackComponent } from "../../../utils/tracking/usage";
  */
 export class GuxSwitch {
     constructor() {
-        this.value = undefined;
         this.layout = 'default';
         this.switchItems = [];
     }
@@ -31,7 +30,7 @@ export class GuxSwitch {
         });
     }
     render() {
-        return (h(Host, { key: 'd2608a24a8392e1a7e2cbbf58f84143dfd3e2378', role: "group", class: `gux-${this.layout}` }, h("slot", { key: 'b40570f18b9b91311fb9399538b2ff28c85a8e05', onSlotchange: this.slotChanged.bind(this) })));
+        return (h(Host, { key: 'b6e6abc91f2e90ba0951b8172abb7593706a1fbb', role: "group", class: `gux-${this.layout}` }, h("slot", { key: '6c670755228b8e27a10572ccf2c6e93b3d2ef376', onSlotchange: this.slotChanged.bind(this) })));
     }
     static get is() { return "gux-switch-legacy"; }
     static get encapsulation() { return "shadow"; }
@@ -61,6 +60,8 @@ export class GuxSwitch {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "value",
                 "reflect": false
             },
@@ -84,6 +85,8 @@ export class GuxSwitch {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "layout",
                 "reflect": false,
                 "defaultValue": "'default'"

package/dist/collection/components/stable/gux-accordion/gux-accordion-section/gux-accordion-section.js

@@ -10,12 +10,17 @@ export class GuxAccordionSection {
     constructor() {
         this.sectionId = randomHTMLId('gux-accordion-section');
         this.headerId = randomHTMLId('gux-accordion-header');
+        /**
+         * Position of the arrow chevron icon. Position can be 'start' or 'end'.
+         */
         this.arrowPosition = 'end';
+        /**
+         * The content layout used in the accordion section. 'text' layout provides default padding, 'custom' removes default padding.
+         */
         this.contentLayout = 'text';
         this.open = false;
         this.disabled = false;
         this.reverseHeadings = false;
-        this.headingLevel = undefined;
     }
     watchOpen(open) {
         if (open) {
@@ -44,20 +49,20 @@ export class GuxAccordionSection {
         this.hasIconSlot = !!this.root.querySelector('[slot="icon"]');
     }
     render() {
-        return (h("section", { key: 'd74bb7f49c3f8ac0fb931304f83d2d8d1838dbfe', class: { 'gux-disabled': this.disabled } }, h("div", { key: 'b04ad7633ec4be364bed7af485e91bb36fa7412c', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: '1102cea708fb4548ffff6b73fd5b58e17b28fc8e', class: {
+        return (h("section", { key: 'ce5c3ef6c5448adf33050a6687089fd607b97df7', class: { 'gux-disabled': this.disabled } }, h("div", { key: 'e662a0706a4abf91100b9ea1a3a6a5f8805021bd', id: this.headerId, role: "heading", "aria-level": this.headingLevel }, h("button", { key: 'f946ebdff40de428bbafef3b668ee515bba8afa0', class: {
                 'gux-header': true,
                 'gux-reverse-headings': this.reverseHeadings
-            }, type: "button", "aria-expanded": this.open.toString(), "aria-controls": this.sectionId, disabled: this.disabled, onClick: this.toggle.bind(this) }, this.hasIconSlot && h("slot", { key: 'd53dabe0c1df96cb3f9876a66f1be6005fe8379c', name: "icon" }), h("div", { key: '6d145ce1dfa650476f3ff44afd47bd074619c29c', class: {
+            }, type: "button", "aria-expanded": this.open.toString(), "aria-controls": this.sectionId, disabled: this.disabled, onClick: this.toggle.bind(this) }, this.hasIconSlot && h("slot", { key: '5960cf6f0c5165d5c455d1d1ca6aa821cf9399ad', name: "icon" }), h("div", { key: 'b9cfa0077b93654ff2b06a3830f4f3aa46dd9214', class: {
                 'gux-header-text': true
-            } }, h("slot", { key: 'ea11e0fa8331421c639b2a0aaeb7935fd7543131', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: '170f202b3b8eae037c0ab99cfcdf8d765e2ae257', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: '0b7a1648b9332ed9b106f495c3abfa9cee3f2bc3', class: {
+            } }, h("slot", { key: '327f8c42f2e2794aa82eaccf6fbb0e1ebd04038a', onSlotchange: () => this.handleSlotChange('header'), name: "header" }), h("slot", { key: 'cf24272a420fa450f6c8242dd5788eac6587330f', onSlotchange: () => this.handleSlotChange('subheader'), name: "subheader" })), h("div", { key: 'cd9960bb642cc498fa6da71a3e5a3ce1c7ca0fdb', class: {
                 'gux-header-icon': true,
                 'gux-expanded': this.open,
                 'gux-arrow-position-start': this.isArrowPositionBeforeText()
-            } }, h("gux-icon", { key: '150517ea773647f93fe9cd277c499d719a374245', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: '580444ec143bf76324dc24cb91a26a2d2204792d', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
+            } }, h("gux-icon", { key: 'c847512d1d91ff560ec29e6ce9b50e17338a245b', decorative: true, "icon-name": "custom/chevron-down-small-regular", size: "small" })))), h("div", { key: 'f4af00d7986a782818fb529ae9ac81fedbc45f39', id: this.sectionId, role: "region", "aria-labelledby": this.headerId, class: {
                 'gux-content': true,
                 'gux-expanded': this.open,
                 'gux-text-content-layout': this.contentLayout === 'text'
-            } }, h("slot", { key: 'ce97c9adc5006041d0a10c100e70a93a496d4156', name: "content" }))));
+            } }, h("slot", { key: '172b7ea909f11aca0e750b947b529cdf3aaab03d', name: "content" }))));
     }
     static get is() { return "gux-accordion-section"; }
     static get encapsulation() { return "shadow"; }
@@ -93,6 +98,8 @@ export class GuxAccordionSection {
                     "tags": [],
                     "text": "Position of the arrow chevron icon. Position can be 'start' or 'end'."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "arrow-position",
                 "reflect": false,
                 "defaultValue": "'end'"
@@ -117,6 +124,8 @@ export class GuxAccordionSection {
                     "tags": [],
                     "text": "The content layout used in the accordion section. 'text' layout provides default padding, 'custom' removes default padding."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "content-layout",
                 "reflect": false,
                 "defaultValue": "'text'"
@@ -135,6 +144,8 @@ export class GuxAccordionSection {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "open",
                 "reflect": false,
                 "defaultValue": "false"
@@ -153,6 +164,8 @@ export class GuxAccordionSection {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
@@ -171,6 +184,8 @@ export class GuxAccordionSection {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "reverse-headings",
                 "reflect": false,
                 "defaultValue": "false"

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

@@ -36,7 +36,7 @@ export class GuxAccordion {
         }
     }
     render() {
-        return (h("slot", { key: '9801714d16ec945beb1e8b281c70256a0fdd750d' }));
+        return (h("slot", { key: '54960a3042d80ad89763aeb11de0a4d24d31c601' }));
     }
     static get is() { return "gux-accordion"; }
     static get encapsulation() { return "shadow"; }
@@ -66,6 +66,8 @@ export class GuxAccordion {
                     "tags": [],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "single-open-section",
                 "reflect": false,
                 "defaultValue": "false"