bromcom-ui 2.7.23-0 → 2.7.23-3

package/dist/collection/components/organism/listbox/listbox-item.js

@@ -1,641 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { Component, h, Host, Listen, Prop, Event, Element } from '@stencil/core';
-import cs from 'classnames';
-export class BcmListboxItem {
-  constructor() {
-    this.objectMapping = {
-      'id': "id",
-      'text': "text",
-      'icon': "icon",
-      'avatar': "avatar",
-      'avatarName': "avatarName",
-      'avatarImage': "avatarImage",
-      'secondaryText': "secondaryText",
-      'tooltipText': "tooltipText",
-      'selected': "selected",
-      'checked': "checked",
-      'disabled': "disabled",
-    };
-    this.display = true;
-    this.avatar = false;
-    this._id = (Math.random() * 4).toString(16).replace('.', '');
-    this.size = 'medium';
-    this.icon = 'bug';
-    this.open = false;
-    this.selected = false;
-    this.checkboxes = false;
-    this.showIcon = false;
-    this.checked = false;
-    this.focused = false;
-    this.hidden = false;
-    this.disabled = false;
-    this._internal_id = "";
-    this.template = null;
-  }
-  componentDidLoad() {
-    if (!this.disabled) {
-      if (this.selected === true) {
-        this.listboxItemSelected.emit(this.itemObject);
-      }
-      this.checkboxes === true && (this.checked === true && (this.listboxChecked.emit(this._id)));
-    }
-  }
-  /**
-   * @desc
-   */
-  handleClick() {
-    if (!this.disabled) {
-      this.checkboxes === true && (this.checked === true && (this.listboxUnchecked.emit(this._id)) || (this.listboxChecked.emit(this._id)));
-      this.checkboxes === false && (this.selected = true,
-        this.listboxItemSelected.emit(this.itemObject));
-    }
-  }
-  handleCheckboxClick(e) {
-    e.preventDefault();
-  }
-  isInternal(event) {
-    var path = event.path || (event.composedPath && event.composedPath());
-    const detect = path
-      && path[0]
-      && path[0].attributes
-      && path[0].attributes['bcm-internal-id']
-      && path[0].attributes['bcm-internal-id'].value;
-    return detect == this._internal_id;
-  }
-  /**
-   * @descc
-   * @param event
-   */
-  ListenListboxCheck(event) {
-    if (this.isInternal(event)) {
-      if (!this.disabled) {
-        if (event.detail && event.detail === this._id) {
-          this.checked = true;
-        }
-      }
-    }
-  }
-  /**
-   * @descc
-   * @param event
-   */
-  ListenListboxUncheck(event) {
-    if (this.isInternal(event)) {
-      if (!this.disabled) {
-        if (event.detail && event.detail === this._id) {
-          this.checked = false;
-        }
-      }
-    }
-  }
-  /**
-   * @descc
-   * @param event
-   */
-  handleListboxClearSelecteds(event) {
-    if (this.checkboxes == false && this.isInternal(event)) {
-      if (!this.disabled) {
-        if (event.detail) {
-          if (event.detail !== this.itemObject) {
-            this.selected = false;
-          }
-          else {
-            this.selected = true;
-          }
-        }
-      }
-    }
-  }
-  templateParser(template) {
-    var rxp = /{{([^}]+)}}/g, str = template, curMatch;
-    while (curMatch = rxp.exec(str)) {
-      template = template.replace("{{" + curMatch[1] + "}}", this.itemObject[curMatch[1]]);
-    }
-    return template;
-  }
-  render() {
-    const { display, focused, selected, size, showIcon, icon, checkboxes, _id, checked, text, avatarName, avatarImage, avatar, secondaryText, tooltipText } = this;
-    const classes = cs('listbox-item', {
-      'disabled': this.disabled,
-      'display': display
-    });
-    const classesContainer = cs('listbox-item-container', {
-      'disabled': this.disabled,
-      'focus': focused,
-      'selected': selected
-    });
-    const textContent = cs('listbox-item-container-text-content', size, {
-      'disabled': this.disabled,
-      'size-2': size === 'small' || size === 'medium',
-      'size-3': size === 'large',
-    });
-    const hostClasses = cs(this.hidden ? 'hidden' : null);
-    const htmlContent = cs('listbox-item-container-html-content', size, {
-      'disabled': this.disabled,
-      'size-2': size === 'small' || size === 'medium',
-      'size-3': size === 'large',
-    });
-    return (h(Host, { class: hostClasses },
-      h("div", { class: classes },
-        h("div", { class: classesContainer, onClick: () => this.handleClick() },
-          checkboxes && (h("div", { class: "check-content" },
-            h("bcm-checkbox-lite", { id: 'check-' + _id, onClick: (e) => this.handleCheckboxClick(e), checked: checked, disabled: this.disabled }))),
-          this.template && (h("div", { class: htmlContent, title: tooltipText, innerHTML: this.templateParser(this.template) })),
-          this.template == null && (h("div", { class: textContent, title: tooltipText },
-            h("div", null,
-              (avatar || avatarName || avatarImage) && (h("div", { class: "avatar" },
-                h("bcm-avatar", Object.assign({ size: "small", name: text }, avatarName && { name: avatarName }, avatarImage && { image: avatarImage })))),
-              showIcon && icon && (h("bcm-icon", { class: "icon", icon: icon })),
-              text && (h("span", { id: "text" }, text)) || (h("slot", null))),
-            h("div", null, (secondaryText) && (h("div", { class: "secondaryText size-1" }, secondaryText)))))))));
-  }
-  static get is() { return "bcm-listbox-item"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["listbox-item.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["listbox-item.css"]
-  }; }
-  static get properties() { return {
-    "objectMapping": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "object",
-        "resolved": "object",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "defaultValue": "{\n        'id': \"id\",\n        'text': \"text\",\n        'icon': \"icon\",\n        'avatar': \"avatar\",\n        'avatarName': \"avatarName\",\n        'avatarImage': \"avatarImage\",\n        'secondaryText': \"secondaryText\",\n        'tooltipText': \"tooltipText\",\n        'selected': \"selected\",\n        'checked': \"checked\",\n        'disabled': \"disabled\",\n    }"
-    },
-    "display": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "display",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "avatar": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "avatar",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "avatarImage": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "avatar-image",
-      "reflect": false
-    },
-    "avatarName": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "avatar-name",
-      "reflect": false
-    },
-    "secondaryText": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "secondary",
-      "reflect": false
-    },
-    "tooltipText": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "tooltip",
-      "reflect": false
-    },
-    "text": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "text",
-      "reflect": false
-    },
-    "_id": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "id",
-      "reflect": true,
-      "defaultValue": "(Math.random() * 4).toString(16).replace('.', '')"
-    },
-    "size": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "SizeProp",
-        "resolved": "\"large\" | \"medium\" | \"small\"",
-        "references": {
-          "SizeProp": {
-            "location": "import",
-            "path": "./types"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "size",
-      "reflect": false,
-      "defaultValue": "'medium'"
-    },
-    "icon": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "icon",
-      "reflect": false,
-      "defaultValue": "'bug'"
-    },
-    "open": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "open",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "selected": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "selected",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "checkboxes": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "checkboxes",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "showIcon": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "show-icon",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "checked": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "checked",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "focused": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "focused",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "hidden": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "hidden",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "itemObject": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "item-object",
-      "reflect": false
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "disabled",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "highlight": {
-      "type": "any",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean | string",
-        "resolved": "boolean | string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "highlight",
-      "reflect": true
-    },
-    "_internal_id": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "_internal_id",
-      "reflect": true,
-      "defaultValue": "\"\""
-    },
-    "template": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "template",
-      "reflect": false,
-      "defaultValue": "null"
-    }
-  }; }
-  static get events() { return [{
-      "method": "listboxItemSelected",
-      "name": "bcm-listbox-item-selected",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Component Events"
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "listboxUnchecked",
-      "name": "bcm-listbox-unchecked",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "listboxChecked",
-      "name": "bcm-listbox-checked",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get elementRef() { return "el"; }
-  static get listeners() { return [{
-      "name": "bcm-listbox-send-check",
-      "method": "ListenListboxCheck",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "bcm-listbox-send-uncheck",
-      "method": "ListenListboxUncheck",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "bcm-listbox-clear-selecteds",
-      "method": "handleListboxClearSelecteds",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }]; }
-}