bromcom-ui 2.3.58 → 2.3.59

package/dist/{esm/bcm-menu-group_2.entry.js → bromcom-ui/bcm-menu-group.entry.js}

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const menuGroupCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}:host(.hidden){display:none}.title{display:flex;align-items:center;justify-content:space-between;font-size:14px;line-height:22px;color:var(--bcm-color-grey-7);cursor:pointer;padding:12px 24px}.title .text-content{display:flex;align-items:center}.title ::slotted(bcm-icon){margin-right:8px}.inner{overflow:hidden;transition:height 0.3s ease}.inner.open{height:auto !important}.menu-group.collapsible .title{color:var(--bcm-color-grey-8)}.menu-group.collapsible .title:hover{background-color:var(--bcm-color-prime-blue-1);color:var(--bcm-color-prime-blue-6)}.menu-group.collapsible .inner{height:0}";
 
@@ -92,86 +92,4 @@ const BcmMenuGroup = class {
 };
 BcmMenuGroup.style = menuGroupCss;
 
-const menuItemCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}:host(.hidden){display:none}::slotted(bcm-icon){margin-right:8px}.menu-item{display:flex;align-items:center;font-size:14px;line-height:22px;color:var(--bcm-color-grey-8);cursor:pointer;padding:12px 24px}.menu-item.selected{background-color:var(--bcm-color-prime-blue-6);color:#ffffff}.menu-item.disabled{color:var(--bcm-grey-6)}.menu-item.padding{padding-left:48px}.menu-item:hover:not(.selected){background-color:var(--bcm-color-prime-blue-1);color:var(--bcm-color-prime-blue-6)}.menu-item:focus:not(.selected),.menu-item:active:not(.selected){background-color:var(--bcm-color-prime-blue-7);color:#ffffff}";
-
-/**
- * @desc
- * @param str
- */
-const lowercase$1 = (str) => str.toLocaleLowerCase();
-const BcmMenuItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.menuItemSelected = createEvent(this, "bcm-menu-item-selected", 7);
-    /**
-     * private variables
-     */
-    this.countParent = 0;
-    this.menuPadding = 0;
-    /**
-     * Component Properties
-     */
-    this.selected = false;
-    this.padding = false;
-    this.hidden = false;
-    /**
-     * Component States
-     */
-    this.id = (Math.random() * 4).toString(16).replace('.', '');
-    this.items = [];
-  }
-  /**
-   * @ComponentMethod
-   */
-  componentWillLoad() {
-    this.menuPadding = this.findWhichParent() <= 1 ? this.findWhichParent() * 24 : this.findWhichParent() * 32;
-  }
-  findWhichParent(el = this.el) {
-    this.countParent = 1;
-    while (el.parentElement) {
-      el = el.parentElement;
-      if (lowercase$1(el.tagName) === 'bcm-menu') {
-        return this.countParent;
-      }
-      else if (lowercase$1(el.tagName) === 'bcm-menu-group') {
-        this.countParent = this.countParent + 1;
-      }
-    }
-    return null;
-  }
-  /**
-   * @ComponentMethod
-   */
-  componentWillRender() {
-    if (this.selected)
-      this.menuItemSelected.emit(this.id);
-  }
-  /**
-   * @descc
-   * @param event
-   */
-  handleMenuClearSelecteds(event) {
-    if (event.detail && event.detail !== this.id)
-      this.selected = false;
-  }
-  /**
-   * @desc
-   */
-  handleClick() {
-    this.selected = true;
-    this.menuItemSelected.emit(this.id);
-  }
-  render() {
-    const katman = this.menuPadding + 'px';
-    const classes = classnames('menu-item', {
-      'selected': this.selected,
-      'padding': this.padding
-    });
-    const hostClasses = classnames(this.hidden ? 'hidden' : null);
-    return (h(Host, { class: hostClasses }, h("div", { class: classes, onClick: () => this.handleClick(), style: { paddingLeft: katman } }, h("slot", { name: "icon" }), h("slot", null))));
-  }
-  get el() { return getElement(this); }
-};
-BcmMenuItem.style = menuItemCss;
-
-export { BcmMenuGroup as bcm_menu_group, BcmMenuItem as bcm_menu_item };
+export { BcmMenuGroup as bcm_menu_group };

package/dist/bromcom-ui/bcm-menu-item.entry.js

@@ -0,0 +1,86 @@
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+
+const menuItemCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}:host(.hidden){display:none}::slotted(bcm-icon){margin-right:8px}.menu-item{display:flex;align-items:center;font-size:14px;line-height:22px;color:var(--bcm-color-grey-8);cursor:pointer;padding:12px 24px}.menu-item.selected{background-color:var(--bcm-color-prime-blue-6);color:#ffffff}.menu-item.disabled{color:var(--bcm-grey-6)}.menu-item.padding{padding-left:48px}.menu-item:hover:not(.selected){background-color:var(--bcm-color-prime-blue-1);color:var(--bcm-color-prime-blue-6)}.menu-item:focus:not(.selected),.menu-item:active:not(.selected){background-color:var(--bcm-color-prime-blue-7);color:#ffffff}";
+
+/**
+ * @desc
+ * @param str
+ */
+const lowercase = (str) => str.toLocaleLowerCase();
+const BcmMenuItem = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.menuItemSelected = createEvent(this, "bcm-menu-item-selected", 7);
+    /**
+     * private variables
+     */
+    this.countParent = 0;
+    this.menuPadding = 0;
+    /**
+     * Component Properties
+     */
+    this.selected = false;
+    this.padding = false;
+    this.hidden = false;
+    /**
+     * Component States
+     */
+    this.id = (Math.random() * 4).toString(16).replace('.', '');
+    this.items = [];
+  }
+  /**
+   * @ComponentMethod
+   */
+  componentWillLoad() {
+    this.menuPadding = this.findWhichParent() <= 1 ? this.findWhichParent() * 24 : this.findWhichParent() * 32;
+  }
+  findWhichParent(el = this.el) {
+    this.countParent = 1;
+    while (el.parentElement) {
+      el = el.parentElement;
+      if (lowercase(el.tagName) === 'bcm-menu') {
+        return this.countParent;
+      }
+      else if (lowercase(el.tagName) === 'bcm-menu-group') {
+        this.countParent = this.countParent + 1;
+      }
+    }
+    return null;
+  }
+  /**
+   * @ComponentMethod
+   */
+  componentWillRender() {
+    if (this.selected)
+      this.menuItemSelected.emit(this.id);
+  }
+  /**
+   * @descc
+   * @param event
+   */
+  handleMenuClearSelecteds(event) {
+    if (event.detail && event.detail !== this.id)
+      this.selected = false;
+  }
+  /**
+   * @desc
+   */
+  handleClick() {
+    this.selected = true;
+    this.menuItemSelected.emit(this.id);
+  }
+  render() {
+    const katman = this.menuPadding + 'px';
+    const classes = classnames('menu-item', {
+      'selected': this.selected,
+      'padding': this.padding
+    });
+    const hostClasses = classnames(this.hidden ? 'hidden' : null);
+    return (h(Host, { class: hostClasses }, h("div", { class: classes, onClick: () => this.handleClick(), style: { paddingLeft: katman } }, h("slot", { name: "icon" }), h("slot", null))));
+  }
+  get el() { return getElement(this); }
+};
+BcmMenuItem.style = menuItemCss;
+
+export { BcmMenuItem as bcm_menu_item };

package/dist/{esm → bromcom-ui}/bcm-menu.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const menuCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}:host(.hidden){display:none}.menu{background-color:#ffffff;box-shadow:0px 2px 4px rgba(0, 0, 0, 0.15)}";
 

package/dist/{esm → bromcom-ui}/bcm-message.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 /**
  * 'status' prop predefined values

package/dist/{esm → bromcom-ui}/bcm-modal.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 /**
  * 'status' prop predefined values

package/dist/{esm → bromcom-ui}/bcm-notification.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 /**
  * 'type' prop predefined values

package/dist/{esm → bromcom-ui}/bcm-popconfirm-box.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const popconfirmBoxCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:inline-flex}:host(.hidden){display:none}:host(:focus){outline:none}.popconfirm-box{position:relative;}.popconfirm-box .box{position:absolute;display:none;box-sizing:border-box;background-color:#FFFFFF;border:1px solid #FFFFFF;border-radius:2px;z-index:10700;width:230px;filter:drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.25));padding:8px 16px}.popconfirm-box .box .content{display:flex}.popconfirm-box .box .content .icon{margin-right:8px;margin-top:4px}.popconfirm-box .box .buttons{display:flex;justify-content:flex-end;margin-top:8px}.popconfirm-box .box .buttons bcm-button:first-child{margin-right:8px}.popconfirm-box::after{content:\"\";position:absolute;display:none;border:6px solid;z-index:10700;pointer-events:none}.popconfirm-box.open .box,.popconfirm-box.open::after{display:block}.popconfirm-box.top .box{bottom:100%;margin-bottom:16px}.popconfirm-box.top::after{bottom:100%;margin-bottom:4px;border-color:#FFFFFF transparent transparent transparent}.popconfirm-box.bottom .box{top:100%;margin-top:16px}.popconfirm-box.bottom::after{top:100%;margin-top:4px;border-color:transparent transparent #FFFFFF transparent}.popconfirm-box.left .box{right:100%;margin-right:16px}.popconfirm-box.left::after{right:100%;margin-right:4px;border-color:transparent transparent transparent #FFFFFF}.popconfirm-box.right .box{left:100%;margin-left:16px}.popconfirm-box.right::after{left:100%;margin-left:4px;border-color:transparent #FFFFFF transparent transparent}.popconfirm-box.top.center .box,.popconfirm-box.bottom.center .box{left:50%;transform:translateX(-50%)}.popconfirm-box.top.center::after,.popconfirm-box.bottom.center::after{left:50%;transform:translateX(-50%)}.popconfirm-box.top.start .box,.popconfirm-box.bottom.start .box{left:0}.popconfirm-box.top.start::after,.popconfirm-box.bottom.start::after{left:16px}.popconfirm-box.top.end .box,.popconfirm-box.bottom.end .box{right:0}.popconfirm-box.top.end::after,.popconfirm-box.bottom.end::after{right:16px}.popconfirm-box.left.center .box,.popconfirm-box.right.center .box{top:50%;transform:translateY(-50%)}.popconfirm-box.left.center::after,.popconfirm-box.right.center::after{top:50%;transform:translateY(-50%)}.popconfirm-box.left.start .box,.popconfirm-box.right.start .box{top:0}.popconfirm-box.left.start::after,.popconfirm-box.right.start::after{top:12px}.popconfirm-box.left.end .box,.popconfirm-box.right.end .box{bottom:0}.popconfirm-box.left.end::after,.popconfirm-box.right.end::after{bottom:12px}";
 

package/dist/{esm → bromcom-ui}/bcm-popconfirm.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
-import { d as delay } from './utils-de9aee67.js';
-import { p as popoverPlacement, a as popoverBoxPlacement } from './popover-placement-a4ab1587.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+import { d as delay } from './utils-1feb01eb.js';
+import { p as popoverPlacement, a as popoverBoxPlacement } from './popover-placement-fb1f91e9.js';
 
 const popconfirmCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:inline-flex}:host(.hidden){display:none}:host(:focus){outline:none}.popconfirm{position:relative;}.popconfirm .box{position:absolute;display:none;box-sizing:border-box;background-color:#FFFFFF;border:1px solid #FFFFFF;border-radius:2px;z-index:10700;width:230px;filter:drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.25));padding:8px 16px}.popconfirm .box .content{display:flex}.popconfirm .box .content .icon{margin-right:8px;margin-top:4px}.popconfirm .box .buttons{display:flex;justify-content:flex-end;margin-top:8px}.popconfirm .box .buttons bcm-button:first-child{margin-right:8px}.popconfirm::after{content:\"\";position:absolute;display:none;border:6px solid;z-index:10700;pointer-events:none}.popconfirm.open .box,.popconfirm.open::after{display:block}.popconfirm.top .box{bottom:100%;margin-bottom:16px}.popconfirm.top::after{bottom:100%;margin-bottom:4px;border-color:#FFFFFF transparent transparent transparent}.popconfirm.bottom .box{top:100%;margin-top:16px}.popconfirm.bottom::after{top:100%;margin-top:4px;border-color:transparent transparent #FFFFFF transparent}.popconfirm.left .box{right:100%;margin-right:16px}.popconfirm.left::after{right:100%;margin-right:4px;border-color:transparent transparent transparent #FFFFFF}.popconfirm.right .box{left:100%;margin-left:16px}.popconfirm.right::after{left:100%;margin-left:4px;border-color:transparent #FFFFFF transparent transparent}.popconfirm.top.center .box,.popconfirm.bottom.center .box{left:50%;transform:translateX(-50%)}.popconfirm.top.center::after,.popconfirm.bottom.center::after{left:50%;transform:translateX(-50%)}.popconfirm.top.start .box,.popconfirm.bottom.start .box{left:0}.popconfirm.top.start::after,.popconfirm.bottom.start::after{left:16px}.popconfirm.top.end .box,.popconfirm.bottom.end .box{right:0}.popconfirm.top.end::after,.popconfirm.bottom.end::after{right:16px}.popconfirm.left.center .box,.popconfirm.right.center .box{top:50%;transform:translateY(-50%)}.popconfirm.left.center::after,.popconfirm.right.center::after{top:50%;transform:translateY(-50%)}.popconfirm.left.start .box,.popconfirm.right.start .box{top:0}.popconfirm.left.start::after,.popconfirm.right.start::after{top:12px}.popconfirm.left.end .box,.popconfirm.right.end .box{bottom:0}.popconfirm.left.end::after,.popconfirm.right.end::after{bottom:12px}";
 

package/dist/{esm → bromcom-ui}/bcm-popover-box.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const popoverBoxCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:inline-flex}:host(.hidden){display:none}:host(:focus){outline:none}.popover-box{position:relative;}.popover-box .box{position:absolute;display:none;box-sizing:border-box;background-color:#FFFFFF;border:1px solid #FFFFFF;border-radius:2px;z-index:10700;width:230px;filter:drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.25))}.popover-box .box .heading,.popover-box .box .content{display:block}.popover-box .box .heading{padding:4px 16px;border-bottom:1px solid #D9D9D9;color:var(--bcm-color-grey-9)}.popover-box .box .content{padding:8px 16px;color:var(--bcm-color-grey-8)}.popover-box::after{content:\"\";position:absolute;display:none;border:6px solid;z-index:10700;pointer-events:none}.popover-box.open .box,.popover-box.open::after{display:block}.popover-box.top .box{bottom:100%;margin-bottom:16px}.popover-box.top::after{bottom:100%;margin-bottom:4px;border-color:#FFFFFF transparent transparent transparent}.popover-box.bottom .box{top:100%;margin-top:16px}.popover-box.bottom::after{top:100%;margin-top:4px;border-color:transparent transparent #FFFFFF transparent}.popover-box.left .box{right:100%;margin-right:16px}.popover-box.left::after{right:100%;margin-right:4px;border-color:transparent transparent transparent #FFFFFF}.popover-box.right .box{left:100%;margin-left:16px}.popover-box.right::after{left:100%;margin-left:4px;border-color:transparent #FFFFFF transparent transparent}.popover-box.top.center .box,.popover-box.bottom.center .box{left:50%;transform:translateX(-50%)}.popover-box.top.center::after,.popover-box.bottom.center::after{left:50%;transform:translateX(-50%)}.popover-box.top.start .box,.popover-box.bottom.start .box{left:0}.popover-box.top.start::after,.popover-box.bottom.start::after{left:16px}.popover-box.top.end .box,.popover-box.bottom.end .box{right:0}.popover-box.top.end::after,.popover-box.bottom.end::after{right:16px}.popover-box.left.center .box,.popover-box.right.center .box{top:50%;transform:translateY(-50%)}.popover-box.left.center::after,.popover-box.right.center::after{top:50%;transform:translateY(-50%)}.popover-box.left.start .box,.popover-box.right.start .box{top:0}.popover-box.left.start::after,.popover-box.right.start::after{top:12px}.popover-box.left.end .box,.popover-box.right.end .box{bottom:0}.popover-box.left.end::after,.popover-box.right.end::after{bottom:12px}";
 

package/dist/{esm → bromcom-ui}/bcm-popover.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
-import { d as delay } from './utils-de9aee67.js';
-import { p as popoverPlacement, a as popoverBoxPlacement } from './popover-placement-a4ab1587.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+import { d as delay } from './utils-1feb01eb.js';
+import { p as popoverPlacement, a as popoverBoxPlacement } from './popover-placement-fb1f91e9.js';
 
 const popoverCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:inline-flex}:host(.hidden){display:none}:host(:focus){outline:none}.popover{position:relative;}.popover .box{position:absolute;display:none;box-sizing:border-box;background-color:#FFFFFF;border:1px solid #FFFFFF;border-radius:2px;z-index:10700;width:230px;filter:drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.25))}.popover .box .heading,.popover .box .content{display:block}.popover .box .heading{padding:4px 16px;border-bottom:1px solid #D9D9D9;color:var(--bcm-color-grey-9)}.popover .box .content{padding:8px 16px;color:var(--bcm-color-grey-8)}.popover::after{content:\"\";position:absolute;display:none;border:6px solid;z-index:10700;pointer-events:none}.popover.open .box,.popover.open::after{display:block}.popover.top .box{bottom:100%;margin-bottom:16px}.popover.top::after{bottom:100%;margin-bottom:4px;border-color:#FFFFFF transparent transparent transparent}.popover.bottom .box{top:100%;margin-top:16px}.popover.bottom::after{top:100%;margin-top:4px;border-color:transparent transparent #FFFFFF transparent}.popover.left .box{right:100%;margin-right:16px}.popover.left::after{right:100%;margin-right:4px;border-color:transparent transparent transparent #FFFFFF}.popover.right .box{left:100%;margin-left:16px}.popover.right::after{left:100%;margin-left:4px;border-color:transparent #FFFFFF transparent transparent}.popover.top.center .box,.popover.bottom.center .box{left:50%;transform:translateX(-50%)}.popover.top.center::after,.popover.bottom.center::after{left:50%;transform:translateX(-50%)}.popover.top.start .box,.popover.bottom.start .box{left:0}.popover.top.start::after,.popover.bottom.start::after{left:16px}.popover.top.end .box,.popover.bottom.end .box{right:0}.popover.top.end::after,.popover.bottom.end::after{right:16px}.popover.left.center .box,.popover.right.center .box{top:50%;transform:translateY(-50%)}.popover.left.center::after,.popover.right.center::after{top:50%;transform:translateY(-50%)}.popover.left.start .box,.popover.right.start .box{top:0}.popover.left.start::after,.popover.right.start::after{top:12px}.popover.left.end .box,.popover.right.end .box{bottom:0}.popover.left.end::after,.popover.right.end::after{bottom:12px}";
 

package/dist/{esm → bromcom-ui}/bcm-progress.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const progressCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:inline-block}:host(.hidden){display:none}.progress-container{display:flex;align-items:center}.progress{width:200px;height:8px;border:0 none;background:#F5F5F5;appearance:none}.progress.small{height:6px}.progress.line-rounded,.progress.line-rounded::-webkit-progress-value{border-radius:8px}.progress.line-rounded::-moz-progress-bar{border-radius:8px}.progress.completed::-webkit-progress-value{background-color:#52C41A}.progress.completed::-moz-progress-bar{background-color:#52C41A}.progress.error::-webkit-progress-value{background-color:#FF4D4F}.progress.error::-moz-progress-bar{background-color:#FF4D4F}.progress::-webkit-progress-bar{background:transparent}.progress::-webkit-progress-value{background-color:#1890FF;transition:0.3s}.progress::-moz-progress-bar{background-color:#1890FF;transition:0.3s}.value{margin-left:8px;color:#595959;display:inline-flex}.progress-circle{transition:0.35s stroke-dashoffset, 0.1s stroke;transform:rotate(-90deg);transform-origin:50% 50%;stroke:#F5F5F5;stroke-width:6px;fill:transparent}.progress-circle.bar{stroke:#1890FF}.progress-circle.completed{stroke:#52C41A}.progress-circle.error{stroke:#FF4D4F}.progress-circle-container{position:relative}.progress-circle-container bcm-icon{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.progress-circle-container text{fill:#595959}";
 

package/dist/{esm/bcm-pulldown-group_2.entry.js → bromcom-ui/bcm-pulldown-group.entry.js}

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, f as forceUpdate, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
-import { g as getChilds } from './utils-de9aee67.js';
+import { r as registerInstance, e as createEvent, j as forceUpdate, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+import { a as getChilds } from './utils-1feb01eb.js';
 
 const pulldownGroupCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}@media screen and (min-width: 576px){:host{width:100%}}:host(.hidden){display:none}.pulldown-group{--const-padding-vertical-sub:12px;--const-padding-horizontal-sub:40px;--group-shadow:0px 4px 4px rgba(0, 0, 0, 0.25)}.pulldown-group ::slotted(bcm-pulldown-item){--padding-vertical-sub:var(--const-padding-vertical-sub);--padding-horizontal-sub:var(--const-padding-horizontal-sub);--hover-color:var(--bcm-color-prime-blue-6);--selected-bg-color:var(--bcm-color-prime-blue-6)}.pulldown-group.open .title{color:var(--bcm-color-prime-blue-6)}.pulldown-group.open .inner{display:block}.inner{position:absolute;top:calc(100% + 5px);display:none;transition:height 0.3s ease;background-color:#ffffff;border-radius:2px;box-shadow:var(--group-shadow)}@media screen and (min-width: 576px){.inner{position:relative;box-shadow:none}}.title{display:flex;align-items:center;justify-content:space-between;font-size:14px;line-height:22px;color:var(--bcm-color-grey-7);cursor:pointer;padding:8px 8px;height:100%}.title .text-content{display:flex;align-items:center}.title .collapse-icon{margin-left:8px}.title ::slotted(bcm-icon){margin-right:10px}.title:hover{color:var(--bcm-color-prime-blue-6);background-color:var(--bcm-color-prime-blue-1)}@media screen and (min-width: 576px){.title{padding:var(--const-padding-vertical-sub) var(--const-padding-horizontal-sub)}}.pulldown-group.sub-group .title{padding:var(--const-padding-vertical-sub) var(--const-padding-horizontal-sub);white-space:nowrap}.pulldown-group.sub-group .inner{position:relative;box-shadow:none}.pulldown-group.sub-group.right{position:relative;--nowrap-sub:nowrap}.pulldown-group.sub-group.right .inner{position:absolute;top:0;left:100%;margin-left:2px;box-shadow:var(--group-shadow)}@media screen and (min-width: 576px){.pulldown-group.sub-group.right .inner{position:relative;left:0;box-shadow:none}}";
 
@@ -104,58 +104,4 @@ const BcmPulldownGroup = class {
 };
 BcmPulldownGroup.style = pulldownGroupCss;
 
-const pulldownItemCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}@media screen and (min-width: 576px){:host{width:100%}}:host(.hidden){display:none}.pulldown-item{--padding-vertical:10px;--padding-horizontal:8px;--nowrap:normal}.pulldown-item{display:flex;align-items:center;font-size:14px;line-height:22px;color:var(--bcm-color-grey-8);cursor:pointer;padding:var(--padding-vertical-sub, var(--padding-vertical)) var(--padding-horizontal-sub, var(--padding-horizontal));white-space:var(--nowrap-sub, var(--nowrap))}.pulldown-item.disabled{color:var(--bcm-color-grey-6)}.pulldown-item.selected{background-color:var(--bcm-color-prime-blue-6);color:#ffffff}.pulldown-item.selected:hover:not(.disabled){background-color:var(--bcm-color-prime-blue-7);color:#ffffff}.pulldown-item:hover:not(.disabled){color:var(--hover-color, var(--bcm-color-prime-blue-6));background-color:var(--hover-bg-color, var(--bcm-color-prime-blue-1))}.pulldown-item ::slotted(bcm-icon){margin-right:10px}@media screen and (min-width: 576px){.pulldown-item.root{padding:12px 40px}}";
-
-const BcmPulldownItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.menuItemSelected = createEvent(this, "bcm-pulldown-item-selected", 7);
-    /**
-     * Component Properties
-     */
-    this.root = false;
-    this.padding = false;
-    this.disabled = false;
-    this.selected = false;
-    this.hidden = false;
-    /**
-     * Component States
-     */
-    this.id = (Math.random() * 4).toString(16).replace('.', '');
-  }
-  /**
-   * @ComponentMethod
-   */
-  componentWillRender() {
-    if (this.selected)
-      this.menuItemSelected.emit(this.id);
-  }
-  /**
-   * @descc
-   * @param event
-   */
-  handleMenuClearSelecteds(event) {
-    if (event.detail && event.detail !== this.id)
-      this.selected = false;
-  }
-  /**
-   * @desc
-   */
-  handleClick() {
-    this.selected = true;
-    this.menuItemSelected.emit(this.id);
-  }
-  render() {
-    const classes = classnames('pulldown-item', {
-      'root': this.root,
-      'padding': this.padding,
-      'disabled': this.disabled,
-      'selected': this.selected
-    });
-    const hostClasses = classnames(this.hidden ? 'hidden' : null);
-    return (h(Host, { class: hostClasses }, h("div", { class: classes, onClick: () => this.handleClick() }, h("slot", { name: "icon" }), h("slot", null))));
-  }
-};
-BcmPulldownItem.style = pulldownItemCss;
-
-export { BcmPulldownGroup as bcm_pulldown_group, BcmPulldownItem as bcm_pulldown_item };
+export { BcmPulldownGroup as bcm_pulldown_group };

package/dist/bromcom-ui/bcm-pulldown-item.entry.js

@@ -0,0 +1,58 @@
+import { r as registerInstance, e as createEvent, h, f as Host } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+
+const pulldownItemCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}@media screen and (min-width: 576px){:host{width:100%}}:host(.hidden){display:none}.pulldown-item{--padding-vertical:10px;--padding-horizontal:8px;--nowrap:normal}.pulldown-item{display:flex;align-items:center;font-size:14px;line-height:22px;color:var(--bcm-color-grey-8);cursor:pointer;padding:var(--padding-vertical-sub, var(--padding-vertical)) var(--padding-horizontal-sub, var(--padding-horizontal));white-space:var(--nowrap-sub, var(--nowrap))}.pulldown-item.disabled{color:var(--bcm-color-grey-6)}.pulldown-item.selected{background-color:var(--bcm-color-prime-blue-6);color:#ffffff}.pulldown-item.selected:hover:not(.disabled){background-color:var(--bcm-color-prime-blue-7);color:#ffffff}.pulldown-item:hover:not(.disabled){color:var(--hover-color, var(--bcm-color-prime-blue-6));background-color:var(--hover-bg-color, var(--bcm-color-prime-blue-1))}.pulldown-item ::slotted(bcm-icon){margin-right:10px}@media screen and (min-width: 576px){.pulldown-item.root{padding:12px 40px}}";
+
+const BcmPulldownItem = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.menuItemSelected = createEvent(this, "bcm-pulldown-item-selected", 7);
+    /**
+     * Component Properties
+     */
+    this.root = false;
+    this.padding = false;
+    this.disabled = false;
+    this.selected = false;
+    this.hidden = false;
+    /**
+     * Component States
+     */
+    this.id = (Math.random() * 4).toString(16).replace('.', '');
+  }
+  /**
+   * @ComponentMethod
+   */
+  componentWillRender() {
+    if (this.selected)
+      this.menuItemSelected.emit(this.id);
+  }
+  /**
+   * @descc
+   * @param event
+   */
+  handleMenuClearSelecteds(event) {
+    if (event.detail && event.detail !== this.id)
+      this.selected = false;
+  }
+  /**
+   * @desc
+   */
+  handleClick() {
+    this.selected = true;
+    this.menuItemSelected.emit(this.id);
+  }
+  render() {
+    const classes = classnames('pulldown-item', {
+      'root': this.root,
+      'padding': this.padding,
+      'disabled': this.disabled,
+      'selected': this.selected
+    });
+    const hostClasses = classnames(this.hidden ? 'hidden' : null);
+    return (h(Host, { class: hostClasses }, h("div", { class: classes, onClick: () => this.handleClick() }, h("slot", { name: "icon" }), h("slot", null))));
+  }
+};
+BcmPulldownItem.style = pulldownItemCss;
+
+export { BcmPulldownItem as bcm_pulldown_item };

package/dist/{esm → bromcom-ui}/bcm-pulldown.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
-import { g as getChilds, i as isTargetComponent } from './utils-de9aee67.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+import { a as getChilds, i as isTargetComponent } from './utils-1feb01eb.js';
 
 const pulldownCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}:host(.hidden){display:none}.pulldown{position:relative;display:flex;align-items:center;box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25);background-color:#ffffff}@media screen and (min-width: 576px){.pulldown{flex-direction:column;align-items:flex-start}}@media screen and (min-width: 576px){.pulldown>*{width:100%}}::slotted(*){height:100%}";
 

package/dist/{esm → bromcom-ui}/bcm-radio-group.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const groupCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block;margin:0 0 8px 0}:host(.hidden){display:none}:host(.error) label{color:var(--bcm-color-red-6) !important}.caption-default{color:#8C8C8C}.caption-primary{color:#4293CF}.caption-success{color:#52C41A}.caption-warning{color:#FA8C16}.caption-error{color:#F5222D}.radio-group{display:flex}.radio-group.horizontal{flex-direction:row;margin-bottom:5px}.radio-group.horizontal ::slotted(bcm-radio:not(:last-of-type)){margin-right:16px}.radio-group.horizontal bcm-radio:not(:last-of-type){margin-right:16px}.radio-group.vertical{flex-direction:column}.radio-group.vertical label{margin-bottom:4px}.radio-group.vertical ::slotted(bcm-radio:not(:last-of-type)){margin-bottom:8px}.radio-group.vertical bcm-radio:not(:last-of-type){margin-bottom:8px}.label{display:flex;flex-direction:column;color:var(--bcm-color-grey-9);padding-right:4px;margin-right:8px;margin-bottom:8px}.caption-area{min-height:20px}.input-caption{display:block}";
 

package/dist/{esm → bromcom-ui}/bcm-radio.entry.js

@@ -1,7 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
-import { C as ColorPalette } from './colors-7c7b35e9.js';
-import { e as extractColor } from './utils-de9aee67.js';
+import { r as registerInstance, e as createEvent, h, f as Host } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+import { e as extractColor, C as ColorPalette } from './utils-1feb01eb.js';
 
 /**
  * 'color' prop predefined values

package/dist/{esm → bromcom-ui}/bcm-result.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-8fe7aea4.js';
-import { c as classnames } from './index-e58a2d48.js';
+import { r as registerInstance, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
 
 const statuses = {
   success: {

package/dist/bromcom-ui/bcm-search.entry.js

@@ -0,0 +1,162 @@
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-9dbea026.js';
+import { c as classnames } from './index-43956e3c.js';
+
+const searchCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}:host{display:block}:host(.hidden){display:none}";
+
+const lowercase = (str) => str.toLowerCase();
+const BcmSearch = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.bcmOnSearch = createEvent(this, "bcm-on-search", 7);
+    this.bcmOnSearchValue = createEvent(this, "bcm-on-search-value", 7);
+    this.data = [];
+    this.searchFields = ['text', 'value' /*, ...*/];
+    this.returnField = 'idx';
+    this.searchSub = null;
+    this.hidden = false;
+    this.onlyChild = false;
+    this.clearable = false;
+    this.searchValue = '';
+    this.searchPlaceholder = 'Search';
+    this.disabled = false;
+    this._internal_id = (Math.random() * 4).toString(16).replace('.', '');
+    this.results = [];
+  }
+  componentDidLoad() {
+    this.el.shadowRoot.querySelector('bcm-input').clearable = this.clearable;
+  }
+  listenBcmChange(e) {
+    e.stopPropagation();
+  }
+  async setValue(value) {
+    const input = this.el.shadowRoot.querySelector('bcm-input');
+    await input.setValue(value);
+    return value;
+  }
+  async select() {
+    const input = this.el.shadowRoot.querySelector('bcm-input');
+    await input.select();
+    this.bcmOnSearch.emit(true);
+    return true;
+  }
+  async setClear() {
+    const input = this.el.shadowRoot.querySelector('bcm-input');
+    await input.setClear();
+    this.bcmOnSearch.emit(true);
+    return true;
+  }
+  async searchArray(value, idFields = null) {
+    // console.log(this.data)
+    let cacheSearchFields = this.searchFields;
+    let arrayResult = [];
+    if (idFields) {
+      this.searchFields = [idFields];
+    }
+    value.forEach(item => {
+      // item = {[idFields]:item}
+      this.results = [];
+      // console.log(this.data)
+      this.nestedSearch(this.data, item, true);
+      arrayResult.push(...this.results);
+    });
+    this.searchFields = cacheSearchFields;
+    return arrayResult;
+    // const input = this.el.shadowRoot.querySelector("bcm-input");
+    // await input.setValue( value )
+    // return value
+  }
+  nestedSearch(items, value, equal = false) {
+    var result;
+    items && (items.map((item) => {
+      this.searchFields.map(searchField => {
+        if (searchField in item) {
+          // debugger;
+          item[searchField] = lowercase(String(item[searchField]));
+          if (this.onlyChild) {
+            if (item[this.searchSub]) {
+              var temp = this.nestedSearch(item[this.searchSub], value, equal);
+              if (temp) {
+                this.results.push((result = String(item[this.returnField])));
+                this.results.push(temp);
+              }
+            }
+            else {
+              if (equal) {
+                // console.log(value)
+                if (item[searchField] == lowercase(String(value))) {
+                  // if (item == lowercase(value)) {
+                  this.results.push((result = String(item[this.returnField])));
+                  // this.results.push (result = String(item))
+                }
+              }
+              else {
+                if (item[searchField].indexOf(lowercase(value)) !== -1) {
+                  this.results.push((result = String(item[this.returnField])));
+                }
+              }
+            }
+          }
+          else {
+            if (item[this.searchSub]) {
+              var temp = this.nestedSearch(item[this.searchSub], value, equal);
+              if (temp) {
+                this.results.push((result = String(item[this.returnField])));
+                this.results.push(temp);
+              }
+            }
+            if (equal) {
+              // console.log(value)
+              if (item[searchField] == lowercase(String(value))) {
+                // if (item == lowercase(value)) {
+                this.results.push((result = String(item[this.returnField])));
+                // this.results.push (result = String(item))
+              }
+            }
+            else {
+              if (item[searchField].indexOf(lowercase(value)) !== -1) {
+                this.results.push((result = String(item[this.returnField])));
+              }
+            }
+          }
+        }
+      });
+    }));
+    return result;
+  }
+  /**
+   * @desc
+   * @param value
+   */
+  inputChange(value) {
+    this.results = [];
+    // data prop'unda arama yapılacak (searchFields prop'u içerisindeki alanlar ile)
+    // arama sonucunda eşleyen itemların 'idx', index
+    // değerleri, array şeklinde root component'e
+    // event ile gönderilecek
+    // Örneğin value == 'to' olduğunda aşağıdaki
+    // sonuçlar filtrelenmeli
+    // -->
+    //{ text: 'Mateusz Eaton', idx: 2 },
+    //{ text: 'Tony Vickers', idx: 3 },
+    // result array'i eşleşen itemların
+    // index numaralarını tutacak
+    // results = [2, 3]
+    // Örnek arama
+    // #
+    this.nestedSearch(this.data, value);
+    this.results = Array.from(new Set(this.results));
+    (value && ((this.results.length > 0 && this.bcmOnSearch.emit(this.results)) || this.bcmOnSearch.emit([-1]))) || this.bcmOnSearch.emit(true);
+    this.bcmOnSearchValue.emit(value);
+  }
+  render() {
+    const hostClasses = classnames(this.hidden ? 'hidden' : null);
+    return (h(Host, { class: hostClasses }, h("bcm-input", { placeholder: this.searchPlaceholder, "no-caption": true, "no-margin": true, "full-width": true, disabled: this.disabled, type: "search", "on-bcm-change": e => this.inputChange(e.detail), value: this.searchValue })));
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "searchValue": ["inputChange"]
+  }; }
+};
+BcmSearch.style = searchCss;
+
+export { BcmSearch as bcm_search };