bromcom-ui 2.7.37-rc.8 → 2.7.37

package/dist/collection/components/molecules/menu/menu.js

@@ -4,15 +4,18 @@
  */
 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;
+  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 { Component, Element, Event, forceUpdate, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';
+import { forceUpdate, h, Host } from '@stencil/core';
 import { IsLoad } from '../../../decorators/is-load-decorator';
 import { Generate } from '../../../helper/generate';
 import cs from 'classnames';
-import { JsonParse } from '../../../decorators/json-parse-decarator';
 import { getPlacement, setPosition } from '../../../utils/popover-placement';
 import { delay } from '../../../utils/utils';
 // import Bcm from '../../../models/bcm';
@@ -28,12 +31,14 @@ export class BcmMenu {
     this.mode = 'inline';
     this.disabled = false;
     this.hidden = false;
+    this.linkedComponent = undefined;
     this.height = 'auto';
     this.maxHeight = '500px';
     this.minHeight = '150px';
     this.selectable = true;
     this.open = false;
     this.placement = 'bottom-start';
+    this.activeItemId = undefined;
     this.data = [];
   }
   componentWillRender() {
@@ -189,435 +194,436 @@ export class BcmMenu {
       const subItems = !!(item.items && item.items.length);
       return (h("a", { id: 'bcm-menu__item-' + this._id + '-' + item.id, onMouseEnter: () => this.collapse && this.getTooltip(item.id, item.text).show(), onMouseLeave: () => this.collapse && this.getTooltip(item.id, item.text).hide(), key: index, href: !item.disabled ? item.link || 'javascript:void(0)' : 'javascript:void(0)', tabindex: item.disabled ? '-1' : '0', class: cs('bcm-menu__item', {
           'bcm-menu__item--is-sub': subItems && item.isOpen,
-        }) },
-        h("span", { class: cs('bcm-menu__item-link', `bcm-menu__item-link--${this.mode}`, {
-            'bcm-menu__item-link--active': this.selectable && (this.activeItemId ? this.activeItemId === item.id : item.active),
-            'bcm-menu__item-link--disabled': item.disabled,
-          }), onClick: () => {
-            !this.disabled && !item.disabled && this.handleClickItem(item);
-          } },
-          item.icon && (h("span", { class: "bcm-menu__item-link-icon" },
-            h("i", { class: item.icon || 'far fa-angle-left' }))),
-          h("span", { class: cs('bcm-menu__item-link-text', {
-              'bcm-menu__item-link-text--collapse': collapse,
-            }), innerHTML: item.text }),
-          subItems && (h("div", { class: cs('bcm-menu__item-link-toggle', {
-              'bcm-menu__item-link-toggle--collapse': item.isOpen,
-            }) },
-            h("i", { class: "fas fa-chevron-down" })))),
-        subItems && (h("div", { class: cs('bcm-menu__item-submenu', {
-            'bcm-menu__item-submenu--collapse': collapse,
-            'bcm-menu__item-submenu--open': item.isOpen,
-          }) }, item.items.map((subItem, subIndex) => MenuLinkTemplate(subItem, subIndex))))));
+        }) }, h("span", { class: cs('bcm-menu__item-link', `bcm-menu__item-link--${this.mode}`, {
+          'bcm-menu__item-link--active': this.selectable && (this.activeItemId ? this.activeItemId === item.id : item.active),
+          'bcm-menu__item-link--disabled': item.disabled,
+        }), onClick: () => {
+          !this.disabled && !item.disabled && this.handleClickItem(item);
+        } }, item.icon && (h("span", { class: "bcm-menu__item-link-icon" }, h("i", { class: item.icon || 'far fa-angle-left' }))), h("span", { class: cs('bcm-menu__item-link-text', {
+          'bcm-menu__item-link-text--collapse': collapse,
+        }), innerHTML: item.text }), subItems && (h("div", { class: cs('bcm-menu__item-link-toggle', {
+          'bcm-menu__item-link-toggle--collapse': item.isOpen,
+        }) }, h("i", { class: "fas fa-chevron-down" })))), subItems && (h("div", { class: cs('bcm-menu__item-submenu', {
+          'bcm-menu__item-submenu--collapse': collapse,
+          'bcm-menu__item-submenu--open': item.isOpen,
+        }) }, item.items.map((subItem, subIndex) => MenuLinkTemplate(subItem, subIndex))))));
     };
-    return (h(Host, { class: hostClasses, tabindex: "-1", disabled: this.disabled },
-      h("div", { class: "bcm-menu__container" },
-        h("slot", null),
-        (data === null || data === void 0 ? void 0 : data.length) > 0 && data.map((item, index) => MenuLinkTemplate(item, index)),
-        collapsible && (h("div", { class: cs('bcm-menu__collapse-button', {
-            'bcm-menu__collapse-button--collapsed': collapse,
-          }), onClick: () => {
-            this.collapse = !collapse;
-            collapsible && this.bcmExpanded.emit(collapse);
-          } },
-          h("i", { class: "far fa-angle-left" }))))));
+    return (h(Host, { class: hostClasses, tabindex: "-1", disabled: this.disabled }, h("div", { class: "bcm-menu__container" }, h("slot", null), (data === null || data === void 0 ? void 0 : data.length) > 0 && data.map((item, index) => MenuLinkTemplate(item, index)), collapsible && (h("div", { class: cs('bcm-menu__collapse-button', {
+        'bcm-menu__collapse-button--collapsed': collapse,
+      }), onClick: () => {
+        this.collapse = !collapse;
+        collapsible && this.bcmExpanded.emit(collapse);
+      } }, h("i", { class: "far fa-angle-left" }))))));
   }
   static get is() { return "bcm-menu"; }
-  static get originalStyleUrls() { return {
-    "$": ["menu.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["menu.css"]
-  }; }
-  static get properties() { return {
-    "_id": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "id",
-      "reflect": true,
-      "defaultValue": "Generate.UID()"
-    },
-    "size": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "'small' | 'medium' | 'large'",
-        "resolved": "\"large\" | \"medium\" | \"small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "size",
-      "reflect": false,
-      "defaultValue": "'medium'"
-    },
-    "collapsible": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "collapsible",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "collapse": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "collapse",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "mode": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "'horizontal' | 'vertical' | 'inline'",
-        "resolved": "\"horizontal\" | \"inline\" | \"vertical\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "mode",
-      "reflect": false,
-      "defaultValue": "'inline'"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "disabled",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "hidden": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "hidden",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "linkedComponent": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "linked-component",
-      "reflect": false
-    },
-    "height": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "height",
-      "reflect": false,
-      "defaultValue": "'auto'"
-    },
-    "maxHeight": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "max-height",
-      "reflect": false,
-      "defaultValue": "'500px'"
-    },
-    "minHeight": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "min-height",
-      "reflect": false,
-      "defaultValue": "'150px'"
-    },
-    "selectable": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "selectable",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "placement": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "PlacementTypes",
-        "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
-        "references": {
-          "PlacementTypes": {
-            "location": "import",
-            "path": "../../../models/bcm-types"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "placement",
-      "reflect": false,
-      "defaultValue": "'bottom-start'"
-    },
-    "data": {
-      "type": "any",
-      "mutable": true,
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "data",
-      "reflect": false,
-      "defaultValue": "[]"
-    }
-  }; }
-  static get states() { return {
-    "open": {},
-    "activeItemId": {}
-  }; }
-  static get events() { return [{
-      "method": "bcmClick",
-      "name": "bcm-click",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "bcmOpen",
-      "name": "bcm-open",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "bcmExpanded",
-      "name": "bcm-expanded",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "show": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
+  static get originalStyleUrls() {
+    return {
+      "$": ["menu.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["menu.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "_id": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "id",
+        "reflect": true,
+        "defaultValue": "Generate.UID()"
+      },
+      "size": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "'small' | 'medium' | 'large'",
+          "resolved": "\"large\" | \"medium\" | \"small\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'medium'"
+      },
+      "collapsible": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "collapsible",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "collapse": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "collapse",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "mode": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "'horizontal' | 'vertical' | 'inline'",
+          "resolved": "\"horizontal\" | \"inline\" | \"vertical\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "mode",
+        "reflect": false,
+        "defaultValue": "'inline'"
+      },
+      "disabled": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "disabled",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "hidden": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "hidden",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "linkedComponent": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "linked-component",
+        "reflect": false
+      },
+      "height": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "height",
+        "reflect": false,
+        "defaultValue": "'auto'"
+      },
+      "maxHeight": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "max-height",
+        "reflect": false,
+        "defaultValue": "'500px'"
+      },
+      "minHeight": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "min-height",
+        "reflect": false,
+        "defaultValue": "'150px'"
+      },
+      "selectable": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "selectable",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "placement": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "PlacementTypes",
+          "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+          "references": {
+            "PlacementTypes": {
+              "location": "import",
+              "path": "../../../models/bcm-types"
+            }
           }
         },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "placement",
+        "reflect": false,
+        "defaultValue": "'bottom-start'"
+      },
+      "data": {
+        "type": "any",
+        "mutable": true,
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "data",
+        "reflect": false,
+        "defaultValue": "[]"
       }
-    },
-    "hide": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+    };
+  }
+  static get states() {
+    return {
+      "open": {},
+      "activeItemId": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "bcmClick",
+        "name": "bcm-click",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "bcmOpen",
+        "name": "bcm-open",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "bcmExpanded",
+        "name": "bcm-expanded",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
         },
-        "return": "Promise<void>"
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "show": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "setActive": {
-      "complexType": {
-        "signature": "(param: any) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "hide": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "",
-        "tags": []
+      "setActive": {
+        "complexType": {
+          "signature": "(param: any) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "open",
-      "methodName": "watchOpen"
-    }]; }
-  static get listeners() { return [{
-      "name": "wheel",
-      "method": "handleWheel",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "bcm-items",
-      "method": "handleSlotItems",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "click",
-      "method": "handleOnClick",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "open",
+        "methodName": "watchOpen"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "wheel",
+        "method": "handleWheel",
+        "target": "document",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "bcm-items",
+        "method": "handleSlotItems",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "click",
+        "method": "handleOnClick",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }];
+  }
 }
 __decorate([
   IsLoad()
 ], BcmMenu.prototype, "el", void 0);
-__decorate([
-  JsonParse('data')
-], BcmMenu.prototype, "data", void 0);