bromcom-ui 2.8.0-rc.5 → 2.8.0-rc.7

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

@@ -12,14 +12,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
         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 { forceUpdate, h, Host } from "@stencil/core";
-import snq from "snq";
-import cs from "classnames";
-import { Generate } from "@bcm/helpers";
 import { IsLoad } from "@bcm/decorator";
-import { StepperHeaderTemplate } from "@bcm/template";
-import { delay, getChildElements } from "@bcm/utils";
+import { Generate } from "@bcm/helpers";
 import { Bcm } from "@bcm/model";
+import { StepperHeaderTemplate } from "@bcm/template";
+import { getChildElements } from "@bcm/utils";
+import { Host, forceUpdate, h } from "@stencil/core";
+import cs from "classnames";
+import snq from "snq";
 import stepperStates from "../states/stepper-states";
 export class BcmStepper {
   constructor() {
@@ -113,7 +113,8 @@ export class BcmStepper {
     return Promise.resolve(this.getActiveIndex());
   }
   async next(idx) {
-    const index = idx || this.getActiveIndex();
+    let index;
+    idx == 0 ? (index = 0) : index == 1 ? (index = 1) : (index = idx || this.getActiveIndex());
     const step = await this.getCurrentStep();
     const lastStep = this.getItems()[this.getItems().length - 1];
     if (step.valid) {
@@ -128,43 +129,32 @@ export class BcmStepper {
     forceUpdate(this.el);
     return Promise.resolve(this.getActiveIndex());
   }
-  async setActive(index, force = false) {
+  async setActive(index) {
     if (!index)
       return;
-    if (force) {
-      if (this.getActiveIndex() < index) {
-        while (this.getActiveIndex() < index) {
-          await this.next();
-          await delay(100);
-        }
-      }
-      else {
-        while (this.getActiveIndex() > index) {
-          await this.prev();
-          await delay(100);
-        }
-      }
+    if (typeof index != "number") {
+      console.warn("index must be a number");
+      return;
     }
-    else {
-      if (this.linear) {
-        const prevStepIsValid = this.getItems()
-          .filter(item => item.index < index)
-          .map(item => ({
-          id: item.id,
-          status: item.status,
-          disabled: item.disabled,
-        }))
-          .every(item => !item.disabled && (item.status === "success" || item.status === "default"));
-        console.log("prevStepIsValid", prevStepIsValid);
-        if (prevStepIsValid) {
-          await this.next(index - 1);
-        }
-      }
-      else {
-        stepperStates.setActiveIndex(this.stepperId, index);
+    if (this.linear) {
+      const prevSteps = this.getItems().filter(item => item.index < index);
+      const prevStepIsValid = prevSteps === null || prevSteps === void 0 ? void 0 : prevSteps.map(item => ({
+        id: item.id,
+        status: item.status,
+        disabled: item.disabled,
+      })).every(item => item.status == "success" || item.status == "default");
+      if (prevStepIsValid) {
+        prevSteps === null || prevSteps === void 0 ? void 0 : prevSteps.forEach(item => {
+          item.status = "success";
+          item.disabled = false;
+        });
         await this.next(index - 1);
       }
     }
+    else {
+      stepperStates.setActiveIndex(this.stepperId, index);
+      await this.next(index - 1);
+    }
   }
   async reset() {
     await this.onStepChange(1);
@@ -452,13 +442,10 @@ export class BcmStepper {
       },
       "setActive": {
         "complexType": {
-          "signature": "(index: number, force?: boolean) => Promise<void>",
+          "signature": "(index: number) => Promise<void>",
           "parameters": [{
               "tags": [],
               "text": ""
-            }, {
-              "tags": [],
-              "text": ""
             }],
           "references": {
             "Promise": {

package/dist/collection/components/organism/list/list-tag-control.js

@@ -116,6 +116,7 @@ export class ListTagControl {
                 text: otherTagTextControl({ count: otherCounter, width: containerWidth[1] }),
                 title: snq(() => otherTags
                   .map(tag => this.values.find(value => value.id == tag.dataset.id))
+                  .sort((a, b) => a._ct - b._ct)
                   .slice(0, 15)
                   .map(item => StringHelper.textLimitter(item.tagTitle || item.text, 40, true))
                   .toString()

package/dist/collection/components/organism/states/bcm-list2.states.js

@@ -142,6 +142,7 @@ const removeOtherTags = (id, ids, items) => {
         if (child.id == otherTagIds) {
           child.checked = false;
           child.itemObject.checked = false;
+          child.itemObject._ct = new Date().getTime();
         }
         else if (child.items) {
           onRemoveItems(id, otherTagIds, child.items);
@@ -156,6 +157,7 @@ const onRemoveItems = (id, itemId, items) => {
       if (item.id == itemId) {
         item.checked = false;
         item.itemObject.checked = false;
+        item.itemObject._ct = new Date().getTime();
         indeterminateStatus(id, item.parentId);
       }
       else if (item.items) {
@@ -215,6 +217,7 @@ const checkedProcess = (id, item, status) => {
           }
           item.itemObject.checked = item.checked;
           item.indeterminate = item.checked ? 'determinate' : 'uncheck';
+          item.itemObject._ct = new Date().getTime();
         }
       }
       if (item.items) {
@@ -249,6 +252,7 @@ const indeterminateStatus = (id, itemId, items) => {
         item.indeterminate = indeterminateState;
         item.checked = indeterminateState == 'determinate' ? true : false;
         item.itemObject.checked = item.checked;
+        item.itemObject._ct = new Date().getTime();
         if (item.parentId) {
           indeterminateStatus(id, item.parentId);
         }
@@ -429,6 +433,7 @@ const getCheckedList = (id, items) => {
       }
     });
   }
+  (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 && checkedList.sort((a, b) => a._ct - b._ct);
   return { checkedList: (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 ? checkedList : null, nestedResult: nestedResult };
 };
 const selectedItem = (id, itemId, items) => {
@@ -456,6 +461,7 @@ const selectedItem = (id, itemId, items) => {
             item.itemObject.selected = item.selected;
           }
         }
+        item.itemObject._ct = new Date().getTime();
       }
       if (item.items) {
         const found = selectedItem(id, itemId, item.items);
@@ -488,6 +494,7 @@ const setClear = (id, items) => {
       ((_a = item.itemObject) === null || _a === void 0 ? void 0 : _a.checked) && (item.itemObject.checked = false);
       ((_b = item.itemObject) === null || _b === void 0 ? void 0 : _b.selected) && (item.itemObject.selected = false);
       ((_c = item.itemObject) === null || _c === void 0 ? void 0 : _c.indeterminate) && (item.itemObject.indeterminate = 'uncheck');
+      item.itemObject._ct = new Date().getTime();
       if (item.items) {
         setClear(id, item.items);
       }

package/dist/collection/templates/tag-template.js

@@ -8,7 +8,7 @@ import cs from 'classnames';
 import { NumberHelper } from '../helper/number-helper';
 import { extractColor } from '../utils/utils';
 import { ColorPalette } from '../global/variables/colors';
-import { ColorProps } from '../components/atoms/tag/types';
+import { ColorProps } from '../components/other_deprecated/tag/types';
 export const TagTemplate = ({ _id, color, customStyle, size, checked, hidden, value, type, onDismiss, onSelect }) => {
   !size && (size = Bcm.FontSize['size-1']);
   const getColor = (color) => {

package/dist/components/bcm-color-input.js

@@ -17,15 +17,13 @@ import { d as defineCustomElement$4 } from './label.js';
 import { d as defineCustomElement$3 } from './linked.js';
 import { d as defineCustomElement$2 } from './tooltip.js';
 
-const colorInputCss = "@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}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:block}";
-
 const BcmColorInput$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
     this._id = Generate.UID();
-    this.label = "Color Picker";
-    this.placeholder = "Color Picker";
+    this.label = "";
+    this.placeholder = "";
     this.value = "";
     this.required = false;
     this.disabled = false;
@@ -45,14 +43,12 @@ const BcmColorInput$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   }
   handleInputChanged(e) {
     this.getPickerElement().color = e.detail;
-    console.log("handleInputChanged: ", e.detail);
   }
   eyeDropper() {
     const eyeDropper = new window.EyeDropper();
     eyeDropper
       .open()
       .then((color) => {
-      console.log("color: ", color.sRGBHex);
       this.handleChange(color.sRGBHex);
     })
       .catch((error) => {
@@ -68,12 +64,11 @@ const BcmColorInput$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     return typeof window !== "undefined" && "EyeDropper" in window;
   }
   render() {
-    return (h(Host, null, h("bcm-input", { id: this._id + "-color", fullWidth: this.fullWidth, label: this.label, placeholder: this.placeholder, type: "text", "onBcm-change": e => this.handleInputChanged(e) }, h("i", { slot: "prefix", class: "tw-rounded-full tw-w-4 tw-h-4 tw-border tw-border-gray-100 tw-flex tw-items-center tw-justify-center", style: {
+    return (h(Host, { class: "tw-block" }, h("bcm-input", { id: this._id + "-color", fullWidth: this.fullWidth, label: this.label, placeholder: this.placeholder, type: "text", "onBcm-change": e => this.handleInputChanged(e) }, h("i", { slot: "prefix", class: "tw-flex tw-h-4 tw-w-4 tw-items-center tw-justify-center tw-rounded-full tw-border tw-border-gray-100", style: {
         backgroundColor: this.value,
       } }), this.isEyeDropperSupported() && h("i", { slot: "suffix", class: "far fa-eye-dropper", onClick: () => this.eyeDropper() })), h("bcm-linked", { targetId: this._id + "-color-container" }, h("bcm-colorful", { id: this._id + "-picker", color: this.value, onBcmChange: e => this.handleChange(e.detail) }))));
   }
   get el() { return this; }
-  static get style() { return colorInputCss; }
 }, [0, "bcm-color-input", {
     "_id": [1537, "id"],
     "label": [1],

package/dist/components/bcm-list.js

@@ -279,6 +279,7 @@ const removeOtherTags = (id, ids, items) => {
         if (child.id == otherTagIds) {
           child.checked = false;
           child.itemObject.checked = false;
+          child.itemObject._ct = new Date().getTime();
         }
         else if (child.items) {
           onRemoveItems(id, otherTagIds, child.items);
@@ -293,6 +294,7 @@ const onRemoveItems = (id, itemId, items) => {
       if (item.id == itemId) {
         item.checked = false;
         item.itemObject.checked = false;
+        item.itemObject._ct = new Date().getTime();
         indeterminateStatus(id, item.parentId);
       }
       else if (item.items) {
@@ -352,6 +354,7 @@ const checkedProcess = (id, item, status) => {
           }
           item.itemObject.checked = item.checked;
           item.indeterminate = item.checked ? 'determinate' : 'uncheck';
+          item.itemObject._ct = new Date().getTime();
         }
       }
       if (item.items) {
@@ -386,6 +389,7 @@ const indeterminateStatus = (id, itemId, items) => {
         item.indeterminate = indeterminateState;
         item.checked = indeterminateState == 'determinate' ? true : false;
         item.itemObject.checked = item.checked;
+        item.itemObject._ct = new Date().getTime();
         if (item.parentId) {
           indeterminateStatus(id, item.parentId);
         }
@@ -521,6 +525,7 @@ const getCheckedList = (id, items) => {
       }
     });
   }
+  (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 && checkedList.sort((a, b) => a._ct - b._ct);
   return { checkedList: (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 ? checkedList : null, nestedResult: nestedResult };
 };
 const selectedItem = (id, itemId, items) => {
@@ -548,6 +553,7 @@ const selectedItem = (id, itemId, items) => {
             item.itemObject.selected = item.selected;
           }
         }
+        item.itemObject._ct = new Date().getTime();
       }
       if (item.items) {
         const found = selectedItem(id, itemId, item.items);
@@ -580,6 +586,7 @@ const setClear = (id, items) => {
       ((_a = item.itemObject) === null || _a === void 0 ? void 0 : _a.checked) && (item.itemObject.checked = false);
       ((_b = item.itemObject) === null || _b === void 0 ? void 0 : _b.selected) && (item.itemObject.selected = false);
       ((_c = item.itemObject) === null || _c === void 0 ? void 0 : _c.indeterminate) && (item.itemObject.indeterminate = 'uncheck');
+      item.itemObject._ct = new Date().getTime();
       if (item.items) {
         setClear(id, item.items);
       }
@@ -947,6 +954,7 @@ class ListTagControl {
                 text: otherTagTextControl({ count: otherCounter, width: containerWidth[1] }),
                 title: snq(() => otherTags
                   .map(tag => this.values.find(value => value.id == tag.dataset.id))
+                  .sort((a, b) => a._ct - b._ct)
                   .slice(0, 15)
                   .map(item => StringHelper.textLimitter(item.tagTitle || item.text, 40, true))
                   .toString()

package/dist/components/bcm-stepper.js

@@ -3,16 +3,16 @@
  * Copyright (c) Bromcom.
  */
 import { h, proxyCustomElement, HTMLElement, createEvent, forceUpdate, Host } from '@stencil/core/internal/client';
+import { I as IsLoad } from './is-load-decorator.js';
 import { G as Generate, s as snq } from './generate.js';
-import { c as classnames } from './index2.js';
 import './color-helper.js';
 import './validators.js';
 import './number-helper.js';
 import './string-helper.js';
 import './element-dragger.js';
-import { g as getChildElements, d as delay } from './utils.js';
+import { g as getChildElements } from './utils.js';
 import { a as Bcm } from './bcm.js';
-import { I as IsLoad } from './is-load-decorator.js';
+import { c as classnames } from './index2.js';
 import './types.js';
 import './types2.js';
 import { s as stepperStates, d as defineCustomElement$2 } from './step.js';
@@ -145,7 +145,8 @@ const BcmStepper$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     return Promise.resolve(this.getActiveIndex());
   }
   async next(idx) {
-    const index = idx || this.getActiveIndex();
+    let index;
+    idx == 0 ? (index = 0) : index == 1 ? (index = 1) : (index = idx || this.getActiveIndex());
     const step = await this.getCurrentStep();
     const lastStep = this.getItems()[this.getItems().length - 1];
     if (step.valid) {
@@ -160,43 +161,32 @@ const BcmStepper$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     forceUpdate(this.el);
     return Promise.resolve(this.getActiveIndex());
   }
-  async setActive(index, force = false) {
+  async setActive(index) {
     if (!index)
       return;
-    if (force) {
-      if (this.getActiveIndex() < index) {
-        while (this.getActiveIndex() < index) {
-          await this.next();
-          await delay(100);
-        }
-      }
-      else {
-        while (this.getActiveIndex() > index) {
-          await this.prev();
-          await delay(100);
-        }
-      }
+    if (typeof index != "number") {
+      console.warn("index must be a number");
+      return;
     }
-    else {
-      if (this.linear) {
-        const prevStepIsValid = this.getItems()
-          .filter(item => item.index < index)
-          .map(item => ({
-          id: item.id,
-          status: item.status,
-          disabled: item.disabled,
-        }))
-          .every(item => !item.disabled && (item.status === "success" || item.status === "default"));
-        console.log("prevStepIsValid", prevStepIsValid);
-        if (prevStepIsValid) {
-          await this.next(index - 1);
-        }
-      }
-      else {
-        stepperStates.setActiveIndex(this.stepperId, index);
+    if (this.linear) {
+      const prevSteps = this.getItems().filter(item => item.index < index);
+      const prevStepIsValid = prevSteps === null || prevSteps === void 0 ? void 0 : prevSteps.map(item => ({
+        id: item.id,
+        status: item.status,
+        disabled: item.disabled,
+      })).every(item => item.status == "success" || item.status == "default");
+      if (prevStepIsValid) {
+        prevSteps === null || prevSteps === void 0 ? void 0 : prevSteps.forEach(item => {
+          item.status = "success";
+          item.disabled = false;
+        });
         await this.next(index - 1);
       }
     }
+    else {
+      stepperStates.setActiveIndex(this.stepperId, index);
+      await this.next(index - 1);
+    }
   }
   async reset() {
     await this.onStepChange(1);

package/dist/components/generate.js

@@ -25,7 +25,7 @@ var TypeProps;
   TypeProps["basic"] = "basic";
 })(TypeProps || (TypeProps = {}));
 
-const version = "2.8.0-rc.5";
+const version = "2.8.0-rc.7";
 
 function snq(callback, defaultValue) {
     try {

package/dist/components/index.d.ts

@@ -5,7 +5,7 @@ export { BcmAttendance as BcmAttendance } from '../types/components/other/attend
 export { BcmAutocomplete as BcmAutocomplete } from '../types/components/organism/autocomplete/autocomplete';
 export { BcmAvatar as BcmAvatar } from '../types/components/atoms/avatar/avatar';
 export { BcmBadge as BcmBadge } from '../types/components/atoms/badge/badge';
-export { BcmBox as BcmBox } from '../types/components/atoms/box/box';
+export { BcmBox as BcmBox } from '../types/components/other/box/box';
 export { BcmBreadcrumb as BcmBreadcrumb } from '../types/components/molecules/breadcrumb/breadcrumb';
 export { BcmButton as BcmButton } from '../types/components/atoms/button/button';
 export { BcmButtonGroup as BcmButtonGroup } from '../types/components/molecules/button-group/button-group';
@@ -75,7 +75,7 @@ export { BcmTabPane as BcmTabPane } from '../types/components/other_deprecated/t
 export { BcmTable as BcmTable } from '../types/components/other/data-table/table';
 export { BcmTabs as BcmTabs } from '../types/components/other_deprecated/tabs/tabs';
 export { BcmTabsContent as BcmTabsContent } from '../types/components/other_deprecated/tabs/tabs-content';
-export { BcmTag as BcmTag } from '../types/components/atoms/tag/tag';
+export { BcmTag as BcmTag } from '../types/components/other_deprecated/tag/tag';
 export { BcmText as BcmText } from '../types/components/other_deprecated/text/text';
 export { BcmTextarea as BcmTextarea } from '../types/components/molecules/textarea/textarea';
 export { BcmTimePicker as BcmTimePicker } from '../types/components/organism/time-picker/time-picker';
@@ -86,7 +86,7 @@ export { BcmTooltip as BcmTooltip } from '../types/components/molecules/tooltip/
 export { Bcmtreeview as BcmTreeview } from '../types/components/other_deprecated/treeview/treeview';
 export { BcmtreeviewGroup as BcmTreeviewGroup } from '../types/components/other_deprecated/treeview/treeview-group';
 export { BcmtreeviewItem as BcmTreeviewItem } from '../types/components/other_deprecated/treeview/treeview-item';
-export { BcmTypography as BcmTypography } from '../types/components/atoms/typography/typography';
+export { BcmTypography as BcmTypography } from '../types/components/other/typography/typography';
 export { OldBcmPopover as OldBcmPopover } from '../types/components/other_deprecated/old-popover/old-popover';
 export { OldBcmPopoverBox as OldBcmPopoverBox } from '../types/components/other_deprecated/old-popover/old-popover-box';
 

package/dist/components/linked.js

@@ -3,16 +3,16 @@
  * Copyright (c) Bromcom.
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { a as Bcm } from './bcm.js';
-import './element-dragger.js';
-import './string-helper.js';
-import { d as delay } from './utils.js';
-import { F as FloatingUI } from './floating-ui.js';
+import { I as IsLoad } from './is-load-decorator.js';
 import './color-helper.js';
 import './validators.js';
 import { G as Generate } from './generate.js';
 import './number-helper.js';
-import { I as IsLoad } from './is-load-decorator.js';
+import './string-helper.js';
+import './element-dragger.js';
+import { d as delay } from './utils.js';
+import { F as FloatingUI } from './floating-ui.js';
+import { a as Bcm } from './bcm.js';
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -37,6 +37,7 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.maxHeight = undefined;
     this.minHeight = "50px";
     this.isOpen = false;
+    this.isMouseOverLink = false;
   }
   target() {
     const target = document.querySelectorAll(`[id="${this.targetId}"]`);
@@ -88,6 +89,7 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   init() {
     const target = this.target();
+    this.trigger === Bcm.TriggerType.hover && this.listenMouseOver();
     if (target) {
       target.setAttribute("is-linked", this.el.id);
       if (!Generate.getAncestor(target, "bcm-linked")) {
@@ -102,8 +104,15 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.init();
     document.body.appendChild(this.el);
   }
+  triggerWatch(newValue) {
+    if (newValue === Bcm.TriggerType.hover) {
+      this.listenMouseOver();
+    }
+  }
+  watchIsOpen() {
+    this.bcmOpen.emit(this.isOpen);
+  }
   onLinkedDataDismis() {
-    // console.log('onLinkedDataDismis');
     this.hide(false);
   }
   onBcmFloatingIsHide(e) {
@@ -128,6 +137,7 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   async hide(wait = true) {
     wait && (await delay(50));
     const target = this.target();
+    this.isMouseOverLink = false;
     if (target) {
       target.removeAttribute("linked-is-open");
       this.hideChildLinked();
@@ -141,6 +151,8 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   clickListener(e) {
     if (!this.target())
       return;
+    if (this.trigger === Bcm.TriggerType.hover)
+      return;
     const isTarget = Generate.findEventPath(e, this.target());
     const isSelf = Generate.findEventPath(e, this.el);
     const isLinked = Generate.findEventPathWithNodeName(e, "BCM-LINKED");
@@ -169,8 +181,25 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   wheelListener() {
     this.calculatePosition();
   }
-  watchIsOpen() {
-    this.bcmOpen.emit(this.isOpen);
+  listenMouseOver() {
+    var _a, _b;
+    this.el.addEventListener("mouseover", () => (this.isMouseOverLink = true));
+    this.el.addEventListener("mouseleave", () => {
+      this.isMouseOverLink = false;
+      this.handleMouseLeave();
+    });
+    (_a = this.target()) === null || _a === void 0 ? void 0 : _a.addEventListener("mouseenter", this.handleMouseEnter.bind(this));
+    (_b = this.target()) === null || _b === void 0 ? void 0 : _b.addEventListener("mouseleave", this.handleMouseLeave.bind(this));
+  }
+  handleMouseLeave() {
+    setTimeout(() => {
+      !this.isMouseOverLink && this.hide();
+    }, 500);
+  }
+  handleMouseEnter() {
+    clearTimeout(this.timeoutId);
+    this.isMouseOverLink = false;
+    this.show();
   }
   render() {
     const openStyle = this.isOpen ? { visibility: "visible", opacity: "1" } : { visibility: "hidden", opacity: "0" };
@@ -178,6 +207,7 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   get el() { return this; }
   static get watchers() { return {
+    "trigger": ["triggerWatch"],
     "isOpen": ["watchIsOpen"]
   }; }
 }, [4, "bcm-linked", {
@@ -189,6 +219,7 @@ const BcmLinked = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "maxHeight": [1, "max-height"],
     "minHeight": [1, "min-height"],
     "isOpen": [1540, "is-open"],
+    "isMouseOverLink": [32],
     "show": [64],
     "hide": [64],
     "toggle": [64]

package/dist/esm/bcm-accordion.entry.js

@@ -4,7 +4,7 @@
  */
 import { r as registerInstance, h, H as Host, g as getElement } from './index-39133086.js';
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
-import { G as Generate } from './generate-7a787f1e.js';
+import { G as Generate } from './generate-b404f183.js';
 import './colors-fa05fe33.js';
 import './_commonjsHelpers-3016b722.js';
 

package/dist/esm/bcm-alert.entry.js

@@ -3,7 +3,7 @@
  * Copyright (c) Bromcom.
  */
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-39133086.js';
-import { G as Generate, s as snq, S as StatusProps, T as TypeProps } from './generate-7a787f1e.js';
+import { G as Generate, s as snq, S as StatusProps, T as TypeProps } from './generate-b404f183.js';
 import { c as classnames } from './index-ed9652af.js';
 import { c as createStore } from './index-93e36fdb.js';
 import { S as StringHelper } from './string-helper-6bd24967.js';

package/dist/esm/bcm-attendance.entry.js

@@ -4,7 +4,7 @@
  */
 import { r as registerInstance, h, H as Host, g as getElement } from './index-39133086.js';
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
-import { G as Generate } from './generate-7a787f1e.js';
+import { G as Generate } from './generate-b404f183.js';
 import './colors-fa05fe33.js';
 import './_commonjsHelpers-3016b722.js';
 

package/dist/esm/bcm-avatar_2.entry.js

@@ -6,10 +6,10 @@ import { r as registerInstance, h, H as Host, g as getElement } from './index-39
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
 import { C as ColorHelper } from './color-helper-4fa5dd0d.js';
 import './datetime-helper-df25808a.js';
-import { G as Generate } from './generate-7a787f1e.js';
-import { N as NumberHelper } from './number-helper-d88788e7.js';
+import { G as Generate } from './generate-b404f183.js';
+import { N as NumberHelper } from './number-helper-88c6ab7d.js';
 import './string-helper-6bd24967.js';
-import './validators-69c22893.js';
+import './validators-35be2684.js';
 import './element-dragger-89bb52fd.js';
 import { a as Bcm } from './bcm-9f50af9c.js';
 import { c as classnames } from './index-ed9652af.js';

package/dist/esm/bcm-breadcrumb.entry.js

@@ -5,7 +5,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-39133086.js';
 import { c as classnames } from './index-ed9652af.js';
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
-import { G as Generate } from './generate-7a787f1e.js';
+import { G as Generate } from './generate-b404f183.js';
 import './_commonjsHelpers-3016b722.js';
 import './colors-fa05fe33.js';
 

package/dist/esm/bcm-button-group.entry.js

@@ -3,7 +3,7 @@
  * Copyright (c) Bromcom.
  */
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-39133086.js';
-import { G as Generate, s as snq } from './generate-7a787f1e.js';
+import { G as Generate, s as snq } from './generate-b404f183.js';
 import { B as Bcm } from './bcm-9f50af9c.js';
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
 import { c as classnames } from './index-ed9652af.js';

package/dist/esm/bcm-button.entry.js

@@ -3,7 +3,7 @@
  * Copyright (c) Bromcom.
  */
 import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-39133086.js';
-import { s as snq, G as Generate } from './generate-7a787f1e.js';
+import { s as snq, G as Generate } from './generate-b404f183.js';
 import { B as Bcm } from './bcm-9f50af9c.js';
 import { c as classnames } from './index-ed9652af.js';
 import { c as createStore } from './index-93e36fdb.js';

package/dist/esm/bcm-card.entry.js

@@ -6,7 +6,7 @@ import { r as registerInstance, h, H as Host, g as getElement } from './index-39
 import { c as classnames } from './index-ed9652af.js';
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
 import { C as ColorHelper } from './color-helper-4fa5dd0d.js';
-import { G as Generate } from './generate-7a787f1e.js';
+import { G as Generate } from './generate-b404f183.js';
 import { S as StringHelper } from './string-helper-6bd24967.js';
 import { S as SlotTemplate } from './slot-template-5b2db362.js';
 import './_commonjsHelpers-3016b722.js';

package/dist/esm/bcm-checkbox-group.entry.js

@@ -4,7 +4,7 @@
  */
 import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-39133086.js';
 import { c as classnames } from './index-ed9652af.js';
-import { G as Generate, s as snq } from './generate-7a787f1e.js';
+import { G as Generate, s as snq } from './generate-b404f183.js';
 import { B as Bcm } from './bcm-9f50af9c.js';
 import { d as delay, g as getChildElements } from './utils-57652744.js';
 import { c as createStore } from './index-93e36fdb.js';

package/dist/esm/bcm-checkbox-lite_9.entry.js

@@ -4,7 +4,7 @@
  */
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-39133086.js';
 import { c as classnames } from './index-ed9652af.js';
-import { G as Generate } from './generate-7a787f1e.js';
+import { G as Generate } from './generate-b404f183.js';
 import { B as Bcm } from './bcm-9f50af9c.js';
 import { I as IsLoad } from './is-load-decorator-bc14ec4b.js';
 import { c as getChilds, d as delay } from './utils-57652744.js';