@watermarkinsights/ripple 5.13.0 → 5.13.1-0

package/dist/collection/components/selects/wm-optgroup/wm-optgroup.js

@@ -0,0 +1,258 @@
+import { h, Host } from "@stencil/core";
+import { handleDisabledAttribute, toBool } from "../../../global/functions";
+export class Optgroup {
+    constructor() {
+        this.label = undefined;
+        this.isExpanded = false;
+        this.multiple = false;
+        this.disabled = false;
+    }
+    get parentNestedSelect() {
+        return this.el.parentElement;
+    }
+    get isDisabled() {
+        // string "false" needs to be treated as bool False because react wrappers convert bool to string.
+        return toBool(this.disabled);
+    }
+    isExpandedChanged() {
+        if (this.isExpanded) {
+            this.el.classList.add("visible");
+            this.optgroupExpanded.emit();
+            window.setTimeout(() => {
+                // wait for slide in animation to complete before assigning focus
+                this.optionListEl.handleInitialFocus();
+            }, 250);
+        }
+        else {
+            this.optgroupHidden.emit(this.label);
+            this.optionListEl.clearSearch();
+            window.setTimeout(() => {
+                // wait for slide out animation to complete before hiding
+                this.el.classList.remove("visible");
+            }, 250);
+        }
+        if (this.parentNestedSelect.multiple) {
+            this.optionListEl.updateOptionVisibility();
+        }
+    }
+    async emitDeselection() {
+        this.wmOptgroupAllDeselected.emit();
+    }
+    async handleChildChange() {
+        this.optionListEl.handleChildChange();
+    }
+    handleOptionKeyLeft() {
+        this.isExpanded = false;
+    }
+    componentWillLoad() {
+        handleDisabledAttribute(this.el, this.isDisabled);
+    }
+    render() {
+        return (h(Host, { key: 'bba30132f0e662bcfc6f9a4280558aa4426673f4' }, h("div", { key: '757e663ad18a9a451169f994f54faf8f9182e1d9', class: `list-wrapper` }, h("priv-option-list", { key: '1bfda628a518f2508084a2382cc7a2f19754859e', ref: (el) => (this.optionListEl = el), multiple: this.parentNestedSelect.multiple, search: this.parentNestedSelect.search, maxHeight: this.parentNestedSelect.constrainedMaxHeight, searchPlaceholder: this.parentNestedSelect.searchPlaceholder, optgroupLabel: this.label, selectAll: this.parentNestedSelect.selectAll, onOptionListAllSelected: () => this.wmOptgroupAllSelected.emit(), onOptionListAllDeselected: () => this.wmOptgroupAllDeselected.emit() }, h("slot", { key: 'd584feb13518107132003e262c5bcc818b677c5c' })))));
+    }
+    static get is() { return "wm-optgroup"; }
+    static get encapsulation() { return "shadow"; }
+    static get delegatesFocus() { return true; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["wm-optgroup.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["wm-optgroup.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "label",
+                "reflect": false
+            },
+            "isExpanded": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "is-expanded",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "multiple": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "multiple",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "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 events() {
+        return [{
+                "method": "wmOptgroupAllSelected",
+                "name": "wmOptgroupAllSelected",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "wmOptgroupAllDeselected",
+                "name": "wmOptgroupAllDeselected",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "optgroupExpanded",
+                "name": "optgroupExpanded",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "optgroupHidden",
+                "name": "optgroupHidden",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "emitDeselection": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "handleChildChange": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "isExpanded",
+                "methodName": "isExpandedChanged"
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "wmKeyLeftPressed",
+                "method": "handleOptionKeyLeft",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+}