bromcom-ui 2.10.1-rc.1 → 2.10.1-rc.11

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

@@ -1,2530 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-0615c2b8.js';
-import { I as IsLoad } from './is-load-decorator-8277e3b8.js';
-import { J as JsonParse } from './json-parse-decarator-fca2dc09.js';
-import './color-helper-845ba523.js';
-import './datetime-helper-df25808a.js';
-import { s as snq, G as Generate } from './generate-b9c6f412.js';
-import { N as NumberHelper } from './number-helper-70be3621.js';
-import { S as StringHelper } from './string-helper-8f5da9ec.js';
-import { V as Validators } from './validators-c1fe8b4b.js';
-import './element-dragger-89bb52fd.js';
-import { g as getPlacement, s as setPosition } from './popover-placement-279ce860.js';
-import { p as pluralize, d as delay } from './utils-57652744.js';
-import { B as Bcm, a as Bcm$1 } from './bcm-0f9cc27c.js';
-import { C as CaptionTemplate } from './caption-template-0c32ce16.js';
-import { c as classnames } from './index-00c8a8f7.js';
-import './types-6f06fa1a.js';
-import './types-9493a7ed.js';
-import { c as createStore } from './index-7e71bbc8.js';
-import { r as react, k as RefResizeObserver, d as wrapperRaf, u as useEvent, a as reactDom, e as useLayoutEffect } from './index-e4b6a4ce.js';
-import { I as InputTemplate } from './input-template-dc94e47f.js';
-import './colors-1d7854ea.js';
-import './colors-ebea297f.js';
-import './_commonjsHelpers-7002e5de.js';
-import './package-6f4c9f8c.js';
-
-const CheckboxTemplate = ({ disabled, checked, readonly, required, indeterminate, hidden, captionType, _id }) => {
-  // if ( indeterminate ) {
-  //   checked = indeterminate == 'determinate' ? true : false 
-  // }
-  const hostClasses = classnames('bcm-checkbox', 'bcm-checkbox__type-default', `bcm-checkbox-size-medium`, {
-    // 'size-2': size === Bcm.Size.small || size === Bcm.Size.medium,
-    // 'size-3': optionType === 'button' && size === Bcm.Size.large,
-    'error': captionType == Bcm.Status.error,
-    hidden,
-    checked,
-    disabled,
-    required,
-    readonly,
-  });
-  const bcmCheckboxIconClass = classnames('bcm-checkbox__label-icon', 'bcm-checkbox__label-icon-lite', 'bcm-checkbox__label-icon-' + indeterminate, {
-    'bcm-checkbox__label-icon-checked': checked,
-  });
-  const bcmCheckboxLabelClass = classnames('bcm-checkbox__label');
-  return (h("div", { class: hostClasses },
-    h("input", { tabindex: "-1", id: _id, type: "checkbox", checked: checked, disabled: disabled, required: required, readonly: readonly }),
-    h("label", { class: bcmCheckboxLabelClass, htmlFor: _id },
-      h("span", { class: bcmCheckboxIconClass },
-        h("bcm-icon", { icon: "far fa-check" })))));
-};
-
-const InfoFooterTemplate = ({ selected, total, found, multiple, variableText }) => {
-  total = total || 0;
-  variableText = variableText ? pluralize(variableText, total) : 'items';
-  return (h("footer", { class: "bcm-info-footer" },
-    h("bcm-text", { scale: "size-1", color: "grey-8" },
-      (multiple && selected > 0) && ` ( ${selected} selected ) `,
-      ` Total ${total} `,
-      found != null && ` / ${found} `,
-      ` ${variableText} found. `)));
-};
-
-const ListItemTemplate = ({ item, treeview, highlight, checkboxes, size, selectedItem, openGroup, checkedItem, focusItem, searchIsOnlyChilds }) => {
-  const isHaveChildren = item.items && item.items.length > 0;
-  var text = StringHelper.htmlEntities(item.text);
-  let intersection = [];
-  if (highlight && StringHelper.slugify(text).includes(StringHelper.slugify(highlight))) {
-    if (!searchIsOnlyChilds || (searchIsOnlyChilds && (!isHaveChildren || (!treeview && item.type != "group")))) {
-      text = StringHelper.highlight(text, highlight);
-    }
-  }
-  if (item.type != 'group' && item.template) {
-    const match = item.template
-      .replace(/\s/g, '')
-      .match(/\{{[^}}]+\}/g)
-      .map(x => x.replace(/[{}]/g, ''));
-    const keys = Object.keys(item.itemObject);
-    intersection = match.filter(x => keys.includes(x));
-  }
-  text = item.isHtmlContent ? item.isHtmlContent : item.template && intersection.length > 0 ? StringHelper.templateParser(item.template, Object.assign(Object.assign({}, item.itemObject), { text })) : text;
-  const unClickable = !treeview && item.type == "group" && !item.clickable;
-  const disabled = item.disabled;
-  const readonly = item.readonly;
-  const itemClick = (event) => {
-    let path = event.path || event.composedPath();
-    if (path.filter(x => x.attributes && x.attributes.getNamedItem("unlinked"))[0]) {
-      return;
-    }
-    if (readonly) {
-      collapseClick();
-    }
-    !unClickable && !disabled && !readonly && (checkboxes ? checkedItem(item.id) : selectedItem(item.id));
-  };
-  const collapseClick = () => {
-    item.open = item.isSearching;
-    openGroup(item.id);
-  };
-  return (h("div", { id: item.id, hidden: item.hidden, "on-focus": e => !unClickable && !disabled && focusItem(e), class: classnames('bcm-list__item', 
-    // size === 'large' ? 'size-3' : 'size-2',
-    'bcm-list__item-' + size, {
-      'bcm-list__item--group': !treeview && item.type == 'group',
-      'bcm-list__item--readonly': readonly,
-    }) },
-    h("div", { class: classnames('bcm-list__item-content', !checkboxes && item.selected && 'selected', { disabled: disabled }) },
-      treeview && (h("div", { class: "bcm-list__item-content-collapse-icon", onClick: () => collapseClick() }, isHaveChildren && h("bcm-icon", { icon: classnames('fas fa-caret-' + (item.isSearching || item.open ? 'down' : 'right')) }))),
-      h("div", { class: classnames('bcm-list__item-content-text', { treeview }), onClick: (e) => itemClick(e) },
-        checkboxes && (treeview || (!treeview && item.type != 'group')) && (h("div", { class: "bcm-list__item-content-text-checkbox" },
-          h(CheckboxTemplate, { indeterminate: item.indeterminate, checked: item.checked, disabled: item.disabled }))),
-        h("span", Object.assign({ class: "bcm-list__item-content-text-inner" }, (item.title && { "title": item.title }), { innerHTML: text })))),
-    (treeview || !treeview && item.type == "group") && isHaveChildren && (h("div", { class: "bcm-list__item-childs" }, (item.isSearching || item.open || (!treeview && item.type == "group")) &&
-      item.items.map((item) => (h(ListItemTemplate, { highlight: highlight, item: item, searchIsOnlyChilds: searchIsOnlyChilds, treeview: treeview, checkboxes: checkboxes, size: size, selectedItem: selectedItem, checkedItem: checkedItem, openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) })))))));
-};
-
-const ListTemplate = ({ highlight, selectAllItem, bcmListContainer, treeview, checkboxes, checkAll, infoFooter, value, totalData, searchFound, variableText, _id, tempId, data, width, height, size, searchPlaceholder, minSearchLength, selectedItem, openGroup, checkedItem, onScrollEvent, focusItem, items, searchable, searchIsOnlyChilds, emptyText, emptyIcon, handleTransitionEnd, }) => {
-  const showSelectAll = !(treeview && searchFound > 0) && !(searchFound > 0);
-  const setScrollHeight = () => {
-    const itemHeight = size === 'small' ? 28 : size === 'medium' ? 36 : 48;
-    const itemCount = searchFound == null ? (treeview ? items.length : totalData) : searchFound;
-    const scrollHeight = itemCount * itemHeight || 0;
-    return {
-      'min-height': `${scrollHeight}px`,
-      'overscroll-behavior': 'none',
-      'height': '100%',
-      'display': 'flex',
-      'flex-direction': 'column',
-    };
-  };
-  return (h("div", { id: `bcm-list-${_id}`, class: bcmListContainer, "temp-id": `bcm-list-${tempId}`, style: { '--height': height, '--width': width }, onTransitionEnd: e => handleTransitionEnd(e) },
-    data && searchable && (h("section", { class: "bcm-list__container-search" },
-      h("bcm-search", { size: size, id: `bcm-list-${_id}-search`, data: data, clearable: true, placeholder: searchPlaceholder, "min-search-length": minSearchLength, searchIsOnlyChilds: searchIsOnlyChilds }))),
-    h("main", { onScroll: e => onScrollEvent(e), class: "scrolling", style: { 'overscroll-behavior': 'none' } },
-      h("div", { style: setScrollHeight() },
-        checkAll && searchFound != 0 && items && items.length > 0 && checkboxes && showSelectAll && (h("section", { class: "bcm-list__container-select-all" },
-          h(ListItemTemplate, { size: size, item: selectAllItem, treeview: false, checkboxes: true, selectedItem: itemId => selectedItem(itemId), checkedItem: itemId => checkedItem(itemId), openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) }))),
-        items.map((item) => (h(ListItemTemplate, { highlight: highlight, size: size, item: item, searchIsOnlyChilds: searchIsOnlyChilds, treeview: treeview, checkboxes: checkboxes, selectedItem: itemId => selectedItem(itemId), checkedItem: itemId => checkedItem(itemId), openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) }))),
-        (!items || items.length === 0) && searchFound != 0 && (h("section", { class: "bcm-list__container-no-data" },
-          h("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
-            h("span", { innerHTML: emptyText || 'No data' })))),
-        searchFound == 0 && (h("section", { class: "bcm-list__container-no-data" },
-          h("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
-            h("span", { innerHTML: emptyText || 'No Data Found' })))))),
-    infoFooter && data && data.length > 0 && (h(InfoFooterTemplate, { selected: value === null || value === void 0 ? void 0 : value.length, total: totalData, found: searchFound, multiple: checkboxes, variableText: variableText }))));
-};
-
-const { state: state$1 } = createStore({
-  value: new Map(),
-});
-const setValue$1 = val => {
-  const { id, dataSource, options } = val;
-  const { type, treeview, checkboxes, searchable, value, name, label, size, disabled, readonly, highlight, required, hidden, fullWidth, height, maxHeight, minHeight, width, infoFooter, variableText, template, allOpen, keyControl, checkAll, linkedComponent, placeholder, searchPlaceholder, searchIsOnlyChilds, clearable, caption, noCaption, captionType, captionError, placement, } = options;
-  const itemOptions = { size, checkboxes, template, allOpen, highlight, treeview };
-  const data = {
-    id: snq(() => id, Generate.UID),
-    dataSource: dataSource && dataSource.length > 0 && recursive$1(dataSource, itemOptions),
-    options: {
-      type,
-      treeview,
-      checkboxes,
-      searchable,
-      value,
-      name,
-      label,
-      size,
-      disabled,
-      readonly,
-      highlight,
-      required,
-      hidden,
-      fullWidth,
-      height,
-      maxHeight,
-      minHeight,
-      width,
-      infoFooter,
-      variableText,
-      template,
-      allOpen,
-      keyControl,
-      checkAll,
-      linkedComponent,
-      placeholder,
-      searchPlaceholder,
-      searchIsOnlyChilds,
-      clearable,
-      caption,
-      noCaption,
-      captionType,
-      captionError,
-      placement,
-    },
-    totalItems: (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > 0 && calculateTotalItems(dataSource, options.treeview),
-    totalRoots: dataSource === null || dataSource === void 0 ? void 0 : dataSource.length,
-  };
-  state$1.value.set(data.id, data);
-};
-const recursive$1 = (data, options, parentId, parentIndex = "0.") => {
-  let recData = [];
-  if (data && data.length > 0) {
-    recData = data.map((item, index) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ itemObject: item }, item), options), { parentId: snq(() => parentId, null), open: options.allOpen || item.open || false }), ((options.treeview || (!options.treeview && item.type == 'group')) && item.items && item.items.length > 0
-      ? { items: snq(() => recursive$1(item.items, options, item.id, `${parentIndex}${index}`), []) }
-      : { items: [] })), { ct: `${parentIndex}${index}` })));
-  }
-  return recData;
-};
-const removeValue$1 = _id => {
-  state$1.value.delete(_id);
-};
-const getValue$1 = id => snq(() => state$1.value.get(id), {});
-const calculateTotalItems = (dataSource, treeview) => {
-  let total = 0;
-  dataSource.forEach(item => {
-    if (treeview || (!treeview && item.type != "group")) {
-      total += 1;
-    }
-    if ((treeview || (!treeview && item.type == "group")) && item.items) {
-      total += calculateTotalItems(item.items, treeview);
-    }
-  });
-  return total;
-};
-const getData = id => {
-  let data = [];
-  const value = getValue$1(id);
-  if (value) {
-    const { dataSource } = value;
-    data = dataSource;
-  }
-  return data;
-};
-const getDataPagination$1 = (id, limit = 3, ids) => {
-  let data = [];
-  const value = getValue$1(id);
-  if (value) {
-    const { dataSource } = value;
-    data = !ids ? dataSource.slice(0, limit) : dataSource.filter(item => ids.indexOf(item.id) > -1).slice(0, limit);
-  }
-  return data;
-};
-const openGroup = (id, groupId, items, status) => {
-  let dataSource;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      if (status != undefined) {
-        item.open = status;
-      }
-      else if (item.id == groupId) {
-        item.open = !item.open;
-        item.isSearching = item.open;
-        if (!item.open && item.items) {
-          openGroup(id, groupId, item.items, false);
-        }
-      }
-      else if (item.items) {
-        openGroup(id, groupId, item.items);
-      }
-    });
-  }
-};
-const removeOtherTags = (id, ids, items) => {
-  ids = Array.isArray(ids) ? ids : [ids];
-  let dataSource;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    ids.forEach(otherTagIds => {
-      dataSource.forEach(child => {
-        if (child.id == otherTagIds) {
-          child.checked = false;
-          child.itemObject.checked = false;
-        }
-        else if (child.items) {
-          onRemoveItems(id, otherTagIds, child.items);
-        }
-      });
-    });
-  }
-};
-const onRemoveItems = (id, itemId, items) => {
-  if (items) {
-    items.forEach(item => {
-      if (item.id == itemId) {
-        item.checked = false;
-        item.itemObject.checked = false;
-        indeterminateStatus(id, item.parentId);
-      }
-      else if (item.items) {
-        onRemoveItems(id, itemId, item.items);
-      }
-    });
-  }
-};
-const addChecked = (id, ids) => {
-  const value = getValue$1(id);
-  if (value) {
-    ids.forEach(item => {
-      checkedItem(id, item);
-    });
-  }
-};
-const checkedItem = (id, itemId) => {
-  findItem(id, itemId);
-};
-const findItem = (id, itemId, items) => {
-  itemId = Array.isArray(itemId) ? itemId : [itemId];
-  let dataSource;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      if (itemId.includes(item.id)) {
-        checkedProcess(id, item);
-        if (item.parentId) {
-          indeterminateStatus(id, item.parentId);
-        }
-      }
-      else if (item.items) {
-        findItem(id, itemId, item.items);
-      }
-    });
-  }
-};
-const checkedProcess = (id, item, status) => {
-  const value = getValue$1(id);
-  if (value) {
-    const treeview = value.options.treeview;
-    if (item) {
-      // && !item.hidden => select all bastığımızda hidden olanları seçmemesi içindi
-      if (treeview || (!treeview && item.type != "group")) {
-        if (!item.disabled) {
-          if (status != undefined) {
-            item.checked = status;
-          }
-          else {
-            item.checked = !item.checked;
-          }
-          item.itemObject.checked = item.checked;
-          item.indeterminate = item.checked ? "determinate" : "uncheck";
-        }
-      }
-      if (item.items) {
-        item.items.forEach(child => {
-          checkedProcess(id, child, status == undefined ? item.checked : status);
-        });
-      }
-    }
-  }
-};
-const indeterminateStatus = (id, itemId, items) => {
-  let dataSource;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      if (item.id == itemId) {
-        let allChecked = true;
-        let allUnchecked = true;
-        if (item.items) {
-          item.items.map(child => {
-            (child.checked || child.indeterminate === "indeterminate") && (allUnchecked = false);
-            !child.checked && (allChecked = false);
-          });
-        }
-        const indeterminateState = !allChecked && !allUnchecked ? "indeterminate" : allChecked ? "determinate" : "uncheck";
-        item.indeterminate = indeterminateState;
-        item.checked = indeterminateState == "determinate" ? true : false;
-        item.itemObject.checked = item.checked;
-        if (item.parentId) {
-          indeterminateStatus(id, item.parentId);
-        }
-      }
-      else if (item.items) {
-        indeterminateStatus(id, itemId, item.items);
-      }
-    });
-  }
-};
-const filterData = (id, ids, items, searchOtherTag) => {
-  let checkeds = [];
-  let visibled = [];
-  getValue$1(id).isSearchOtherTag = searchOtherTag;
-  let dataSource;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      if (ids) {
-        item.hidden = true;
-        // const filter = ids.find((find) => find.id === item.id)
-        var filter;
-        for (let index = 0; index < ids.length; index++) {
-          if (ids[index].id === item.id) {
-            filter = ids[index];
-            break;
-          }
-        }
-        if (filter) {
-          item.hidden = false;
-          if (!getValue$1(id).isSearchOtherTag) {
-            item.isSearching = true;
-          }
-          visibled.push(item);
-          if (item.checked) {
-            checkeds.push(item);
-          }
-          if (filter.items) {
-            const { checkedItems, visibledItems } = filterData(id, filter.items, item.items, searchOtherTag);
-            if (checkedItems) {
-              checkeds = [...new Set([...checkeds, ...checkedItems])];
-            }
-            if (visibledItems) {
-              visibled = [...new Set([...visibled, ...visibledItems])];
-            }
-          }
-        }
-      }
-      else {
-        item.hidden = false;
-        if (item.items) {
-          filterData(id, null, item.items);
-        }
-        visibled.push(item);
-        item.isSearching = false;
-      }
-    });
-  }
-  return { checkedItems: checkeds !== null && checkeds !== void 0 ? checkeds : [], visibledItems: visibled !== null && visibled !== void 0 ? visibled : [] };
-};
-const getSelected = (id, items) => {
-  let dataSource;
-  let selected = null;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      if (item.selected) {
-        selected = item.itemObject;
-      }
-      else if (item.items) {
-        const found = getSelected(id, item.items);
-        if (found) {
-          selected = found;
-        }
-      }
-    });
-  }
-  return selected;
-};
-const getCheckedList = (id, items) => {
-  let dataSource;
-  let checkedList = [];
-  let nestedResult = [];
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      var _a;
-      const newItem = Object.assign(Object.assign({}, item.itemObject), { ct: item.ct });
-      let foundChild = [];
-      let foundItem = [];
-      if (item.checked) {
-        checkedList.push(newItem);
-        foundItem.push(Object.assign(Object.assign({}, newItem), { items: [] }));
-      }
-      if (item.items) {
-        const found = getCheckedList(id, item.items);
-        if (((_a = found === null || found === void 0 ? void 0 : found.checkedList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-          checkedList = [...checkedList, ...found.checkedList];
-        }
-        if (found.nestedResult.length > 0) {
-          foundChild = found.nestedResult;
-        }
-      }
-      if (foundChild.length > 0) {
-        if (foundItem.length == 0) {
-          foundItem.push(Object.assign(Object.assign({}, newItem), { items: [] }));
-        }
-        foundItem[0].items = foundChild;
-        nestedResult.push(foundItem[0]);
-      }
-      else {
-        if (foundItem.length > 0) {
-          foundItem[0].items = foundChild;
-          nestedResult.push(foundItem[0]);
-        }
-      }
-    });
-  }
-  return { checkedList: (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 ? checkedList : null, nestedResult: nestedResult };
-};
-const selectedItem = (id, itemId, items) => {
-  let dataSource;
-  let selected = [];
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      if (itemId) {
-        if (item.id == itemId) {
-          // if (!item.selected){
-          item.selected = true;
-          item.itemObject.selected = item.selected;
-          // }
-        }
-        else {
-          if (item.selected) {
-            item.selected = false;
-            item.itemObject.selected = item.selected;
-          }
-        }
-      }
-      if (item.items) {
-        const found = selectedItem(id, itemId, item.items);
-        if ((found === null || found === void 0 ? void 0 : found.length) > 0) {
-          selected = [...selected, ...found];
-        }
-      }
-      if (item.selected) {
-        selected.push(item.itemObject);
-      }
-    });
-  }
-  return selected && selected.length > 0 ? selected : null;
-};
-const setClear = (id, items) => {
-  let dataSource;
-  if (items) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue$1(id);
-    dataSource = value.dataSource;
-  }
-  if (dataSource) {
-    dataSource.forEach(item => {
-      var _a, _b, _c;
-      item.checked && (item.checked = false);
-      item.selected && (item.selected = false);
-      item.indeterminate && (item.indeterminate = "uncheck");
-      ((_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");
-      if (item.items) {
-        setClear(id, item.items);
-      }
-    });
-  }
-};
-const selectAll = (id, status) => {
-  const dataSource = getValue$1(id).dataSource;
-  if (dataSource) {
-    dataSource.forEach(item => {
-      checkedProcess(id, item, status);
-    });
-  }
-};
-const updateOptions = (id, options) => {
-  Object.keys(getValue$1(id).options).forEach(key => {
-    getValue$1(id).options[key] = options[key];
-  });
-};
-const removeState = id => {
-  return Promise.resolve(state$1.value.delete(id));
-};
-const listState = {
-  setValue: setValue$1,
-  removeValue: removeValue$1,
-  getValue: getValue$1,
-  getData,
-  getDataPagination: getDataPagination$1,
-  openGroup,
-  checkedItem,
-  filterData,
-  getSelected,
-  getCheckedList,
-  selectedItem,
-  addChecked,
-  setClear,
-  selectAll,
-  removeOtherTags,
-  onRemoveItems,
-  updateOptions,
-  removeState,
-};
-
-class KeyControl {
-  constructor(keyCode, element, elementName, childElementName) {
-    this.elementName = '';
-    this.childElementName = '';
-    this.keyCode = keyCode;
-    this.element = element;
-    this.elementName = elementName;
-    this.childElementName = childElementName;
-  }
-  getKeyCode() {
-    return this.keyCode;
-  }
-  getElementName() {
-    return this.elementName;
-  }
-  getChildElementName() {
-    return this.childElementName;
-  }
-  getFocusedElementName() {
-    return this.getElementName() + '.focused';
-  }
-  getFocusedElement() {
-    return this.element.querySelectorAll(this.getFocusedElementName())[0] || null;
-  }
-  getFirstElement() {
-    return this.element.querySelectorAll(this.getElementName())[0] || null;
-  }
-  getNextElement() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) || this.getFirstElement();
-  }
-  getPreviousElement() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) || this.getFirstElement();
-  }
-  getChildElement() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName())[0]) || null;
-  }
-  getParentElement(element) {
-    if (element && element) {
-      const isRootElement = element && element.attributes['data-isroot'];
-      if (isRootElement) {
-        return element;
-      }
-      return this.getParentElement(element.parentNode);
-    }
-  }
-  focusElementIsOpen() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.classList.contains('bcm-list__item--open')) || false;
-  }
-  isRootElement() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName()).length) > 0;
-  }
-  isRootElementIsOpen() {
-    return this.getFocusedElement().classList.contains('bcm-list__item--open');
-  }
-  getFocusedChildElement() {
-    var _a;
-    return ((_a = this.getChildElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.focused')[0]) || null;
-  }
-  isLastElement() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) === null;
-  }
-  focusParentElementFirstChild() {
-    var _a, _b;
-    return this.setFocus((_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.firstChild);
-  }
-  isFirstElement() {
-    var _a;
-    return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) === null;
-  }
-  focusRootElement() {
-    var _a, _b, _c;
-    return this.setFocus((_c = (_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.firstChild);
-  }
-  nextRootElement() {
-    var _a, _b, _c;
-    return this.setFocus((_c = (_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.nextElementSibling);
-  }
-  findFocusElementParent() {
-    return this.getFocusedElement().parentNode.querySelectorAll('.bcm-list__item--open');
-  }
-  getLastElement() {
-    return this.element.querySelectorAll(this.getElementName())[this.element.querySelectorAll(this.getElementName()).length - 1] || null;
-  }
-  setFocus(element) {
-    element.focus();
-  }
-}
-
-class ListKeyControl extends KeyControl {
-  constructor(keyCode, element, treeview, checkBoxes) {
-    super(keyCode, element, '.bcm-list__item', '.bcm-list__item-childs');
-    this.isTreeview = false;
-    this.isCheckBoxes = false;
-    this.isTreeview = treeview;
-    this.isCheckBoxes = checkBoxes;
-  }
-  keyUpControl() {
-    if (this.isTreeview) {
-      this.keyUpTreeview();
-    }
-    else {
-      if (this.isFirstElement()) {
-        this.setFocus(this.getLastElement());
-      }
-      else {
-        this.setFocus(this.getPreviousElement());
-      }
-    }
-  }
-  keyDownTreeView() {
-    var _a;
-    if (this.isTreeview) {
-      if (this.isRootElement() && this.isRootElementIsOpen()) {
-        const childs = this.getChildElement();
-        if (childs) {
-          this.setFocus(childs.firstChild);
-        }
-      }
-      else {
-        if (this.isLastElement() && this.getParentElement(this.getFocusedElement())) {
-          this.setFocus((_a = this.getParentElement(this.getFocusedElement())) === null || _a === void 0 ? void 0 : _a.nextElementSibling);
-        }
-        else {
-          this.setFocus(this.getNextElement());
-        }
-      }
-    }
-  }
-  keyUpTreeview() {
-    if (this.isFirstElement()) {
-      const parent = this.getParentElement(this.getFocusedElement());
-      this.setFocus(parent);
-    }
-    else {
-      const previousElement = this.getPreviousElement();
-      if (previousElement) {
-        if (previousElement.classList.contains('bcm-list__item--open')) {
-          const getChildElement = previousElement.querySelectorAll(this.getChildElementName())[0];
-          console.log({ getChildElement });
-          this.setFocus(getChildElement.lastChild);
-        }
-        else {
-          this.setFocus(previousElement);
-        }
-      }
-    }
-  }
-  keyDownControl() {
-    if (this.isTreeview) {
-      this.keyDownTreeView();
-    }
-    else {
-      if (this.isLastElement()) {
-        this.setFocus(this.getFirstElement());
-      }
-      else {
-        this.setFocus(this.getNextElement());
-      }
-    }
-  }
-  keyRightControl() {
-    if (this.isTreeview) {
-      if (!this.isRootElementIsOpen() && this.isRootElement()) {
-        const { id } = this.getFocusedElement();
-        this.openGroup(id);
-      }
-    }
-  }
-  keyLeftControl() {
-    if (this.isTreeview) {
-      if (this.isRootElementIsOpen() && this.isRootElement()) {
-        const { id } = this.getFocusedElement();
-        this.openGroup(id);
-      }
-    }
-  }
-  keyEnterControl() { }
-  keySpaceControl() {
-    if (this.isCheckBoxes) {
-      const { id } = this.getFocusedElement();
-      this.checkedItem(id);
-    }
-  }
-  keyDown() {
-    switch (this.getKeyCode()) {
-      case Bcm.KeyCode.up:
-        this.keyUpControl();
-        break;
-      case Bcm.KeyCode.down:
-        this.keyDownControl();
-        break;
-      case Bcm.KeyCode.left:
-        this.keyLeftControl();
-        break;
-      case Bcm.KeyCode.right:
-        this.keyRightControl();
-        break;
-      case Bcm.KeyCode.enter:
-        this.keyEnterControl();
-        break;
-      case Bcm.KeyCode.space:
-        this.keySpaceControl();
-        break;
-    }
-  }
-  keyUp() { }
-}
-
-const listCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .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}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}*{box-sizing:border-box}*{box-sizing:border-box}.bcm-checkbox{outline:none;border:none;--bcm-checkbox-primary-color-default:var(--bcm-new-ds-color-blue-500);--bcm-checkbox-secondary-color-default:var(--bcm-new-ds-color-white);--bcm-checkbox-primary-color-hover:var(--bcm-new-ds-color-blue-600);--bcm-checkbox-secondary-color-hover:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-focus-visible:var(--bcm-new-ds-color-blue-800);--bcm-checkbox-secondary-color-focus-visible:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-active:var(--bcm-new-ds-color-blue-700);--bcm-checkbox-secondary-color-active:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-disabled:var(--bcm-new-ds-color-slate-300);--bcm-checkbox-secondary-color-disabled:var(--bcm-new-ds-color-slate-200);display:inline-flex;width:fit-content;flex-direction:column;margin-bottom:8px}.bcm-checkbox:focus,.bcm-checkbox:hover,.bcm-checkbox:active{outline:none;border:none}.bcm-checkbox *{box-sizing:border-box}.bcm-checkbox input[type=radio],.bcm-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;background-color:#fff;margin:0;display:none}.bcm-checkbox__input{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;flex-wrap:nowrap;padding-top:4px}.bcm-checkbox.hidden{display:none}.bcm-checkbox :hover{cursor:pointer}.bcm-checkbox[disabled] :hover,.bcm-checkbox.disabled :hover{cursor:not-allowed}.bcm-checkbox .slot{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-weight:500;color:var(--bcm-new-ds-color-slate-600)}.bcm-checkbox .slot:not(:empty){margin-left:8px;margin-right:8px}.bcm-checkbox-size-small .slot{font-size:12px;line-height:calc(12px + 8px);margin-top:-2.5px}.bcm-checkbox-size-small .bcm-checkbox__input{min-height:calc(24px - 4px)}.bcm-checkbox-size-small .bcm-checkbox__label-icon{width:14px;height:14px;min-width:14px;font-size:calc(10px - 2px)}.bcm-checkbox-size-medium .slot{font-size:calc(12px + 1px);line-height:calc(12px + 8px);margin-top:-1.5px}.bcm-checkbox-size-medium .bcm-checkbox__input{min-height:calc(32px - 4px)}.bcm-checkbox-size-medium .bcm-checkbox__label-icon{width:16px;height:16px;min-width:16px;font-size:10px}.bcm-checkbox-size-large .slot{font-size:16px;line-height:calc(16px + 8px);margin-top:-1.5px}.bcm-checkbox-size-large .bcm-checkbox__input{min-height:calc(32px - 4px)}.bcm-checkbox-size-large .bcm-checkbox__label-icon{width:18px;height:18px;min-width:18px;font-size:12px}.bcm-checkbox__label{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;flex-wrap:nowrap}.bcm-checkbox__label-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-wrap:nowrap;border-width:1px;border-style:solid;border-radius:2px}.bcm-checkbox__label-icon-indeterminate{position:relative}.bcm-checkbox__label-icon-indeterminate:after{content:\"\";display:block;position:absolute;width:70%;height:1.5px;background:var(--bcm-new-ds-color-white)}.bcm-checkbox__label-icon.bcm-radio__icon{width:16px;height:16px;box-sizing:border-box;border-radius:100px}.bcm-checkbox__label-icon.bcm-radio__icon .bcm-radio__icon-inner{width:10px;height:10px;border-radius:100px;background-color:var(--bcm-new-ds-color-white)}.bcm-checkbox .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-default);color:var(--bcm-checkbox-secondary-color-default);border-color:var(--bcm-new-ds-color-slate-300)}.bcm-checkbox .bcm-checkbox__label-icon-checked,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-default);border-color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-default);background-color:var(--bcm-checkbox-secondary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox:hover .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-hover);color:var(--bcm-checkbox-secondary-color-hover);border-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-hover);border-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-hover);background-color:var(--bcm-checkbox-secondary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-focus-visible);color:var(--bcm-checkbox-secondary-color-focus-visible);border-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-focus-visible);border-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-focus-visible);background-color:var(--bcm-checkbox-secondary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:active .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-active);color:var(--bcm-checkbox-secondary-color-active);border-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-active);border-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-active);background-color:var(--bcm-checkbox-secondary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-disabled);color:var(--bcm-checkbox-secondary-color-disabled);border-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-disabled);border-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-disabled);background-color:var(--bcm-checkbox-secondary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[no-margin] .bcm-checkbox__input{margin:0;min-height:0;padding:0}.bcm-list{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;--width:256px;--height:256px;--max-height:inherit;--min-height:inherit;min-width:90px;display:flex;flex-direction:column;margin:0 0 8px 0}.bcm-list__listbox .bcm-list__container{height:var(--height);max-height:var(--max-height);min-height:var(--min-height)}.bcm-list.full-width{width:100%}.bcm-list__size-small .bcm-list__input{height:24px;font-size:12px;line-height:calc(12px + 8px)}.bcm-list__size-small .bcm-list__input .bcm-tag__content.dismissable{font-size:10px;line-height:calc(10px + 8px)}.bcm-list__size-medium .bcm-list__input{height:32px;font-size:14px;line-height:calc(14px + 8px)}.bcm-list__size-medium .bcm-list__input .bcm-tag__content.dismissable{font-size:12px;line-height:calc(12px + 8px)}.bcm-list__size-large .bcm-list__input{height:40px;font-size:16px;line-height:calc(16px + 8px)}.bcm-list__size-large .bcm-list__input .bcm-tag__content.dismissable{font-size:14px;line-height:calc(14px + 8px)}.bcm-list:hover{outline:none}.bcm-list:hover .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-500);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list:focus-visible{outline:none}.bcm-list:focus-visible .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-600);background-color:var(--bcm-new-ds-color-white)}.bcm-list:active{outline:none}.bcm-list:active .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-600);box-shadow:0 1px 3px 0 rgba(17, 24, 38, 0.1)}.bcm-list__container{--width:256px;--height:256px;width:var(--width);height:var(--height);background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;padding-top:8px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;gap:4px}.bcm-list__container main{scroll-behavior:smooth;padding:0 8px;flex:1;overflow:auto;display:flex;flex-direction:column}.bcm-list__container-search{margin:0 8px}.bcm-list__container-search:after{margin:4px 0}.bcm-list__container-no-data{flex:1;display:flex;justify-content:stretch;align-items:stretch;padding-bottom:4px}.bcm-list__container.error{border-color:var(--bcm-color-red-6)}.bcm-list__container.full-width{width:100%}.bcm-list__container.bcm-list__type-linked-component,.bcm-list__container.bcm-list__type-select,.bcm-list__container.bcm-list__type-autocomplete{opacity:0;visibility:hidden;position:absolute;top:0;left:0;height:0;width:0;transform:translateY(10%);z-index:10800;transition:visibility 0s linear 400ms, opacity 100ms, transform 200ms}.bcm-list__container.bcm-list__type-linked-component.bcm-list--top,.bcm-list__container.bcm-list__type-select.bcm-list--top,.bcm-list__container.bcm-list__type-autocomplete.bcm-list--top{transform:translateY(-10%)}.bcm-list__container.bcm-list__type-linked-component.is-open,.bcm-list__container.bcm-list__type-select.is-open,.bcm-list__container.bcm-list__type-autocomplete.is-open{opacity:1;transform:translateY(0);visibility:visible;transition:visibility 0s linear 0s, opacity 100ms, transform 100ms}.bcm-list__container.bcm-list__type-linked-component{margin-top:2px}.bcm-list__label{line-height:1}.bcm-list__input{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-white);user-select:none;cursor:pointer;padding:0 8px;height:32px;overflow:hidden;position:relative;transition:background-color 100ms, border-color 100ms}.bcm-list__input-spinner{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:var(--bcm-color-grey-1);opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out;z-index:-1}.bcm-list__input-spinner.is-open{opacity:1;visibility:visible;z-index:1}.bcm-list__input-container{flex:1;display:block;overflow:hidden}.bcm-list__input-container.value-empty{color:var(--bcm-color-grey-6)}.bcm-list__input-container.type-single,.bcm-list__input-container.value-empty{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-list__input-placeholder{color:var(--bcm-color-grey-6)}.bcm-list__input-tag-container{height:100%;width:100%;display:flex;align-items:center;justify-content:flex-start;flex-wrap:nowrap;grid-gap:2px;line-height:1}.bcm-list__input-buttons{display:flex;align-items:center;justify-content:flex-end;grid-gap:4px}.bcm-list__input-buttons-button{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 4px 0 4px;font-size:16px;color:var(--bcm-new-ds-color-slate-500)}.bcm-list__input-buttons-button.caret-is{transform:rotate(360deg);transition:transform 0.2s ease-in-out}.bcm-list__input-buttons-button.caret-is-open{transform:rotate(180deg)}.bcm-list__input-buttons:not(.disabled) .bcm-list__input-buttons-button:hover{cursor:pointer;color:var(--bcm-new-ds-color-slate-600)}.bcm-list__input-autocomplete{position:relative;padding-right:0}.bcm-list__input-autocomplete .bcm-list-input-selected-text{background-color:#ffffff;display:flex;align-items:center;justify-content:flex-start;width:calc(100% - 24px);height:100%;padding:0 calc(8px + 4px);position:absolute;top:0;left:0}.bcm-list__input-autocomplete .bcm-list__input-container{height:100%;display:flex;flex-direction:row}.bcm-list__input-autocomplete .bcm-list__input-container .bcm-list__input-tag-container{width:auto}.bcm-list__input-autocomplete .bcm-input,.bcm-list__input-autocomplete .bcm-list__autocomplete{height:100%;min-width:70px;width:100%}.bcm-list__input-autocomplete .bcm-input__container,.bcm-list__input-autocomplete .bcm-list__autocomplete__container{height:100%;border:none;padding:0;width:100%}.bcm-list__input-autocomplete .bcm-input__container:not(.disabled).focused,.bcm-list__input-autocomplete .bcm-input__container:not(.disabled):hover,.bcm-list__input-autocomplete .bcm-list__autocomplete__container:not(.disabled).focused,.bcm-list__input-autocomplete .bcm-list__autocomplete__container:not(.disabled):hover{border:none;box-shadow:none}.bcm-list__autocomplete{width:100%;position:relative}.bcm-list.full-width .bcm-list__container,.bcm-list.full-width .bcm-list__input{width:100%}.bcm-list.error .bcm-list__input{border-color:var(--bcm-color-red-6)}.bcm-list.disabled .bcm-list__container,.bcm-list.disabled .bcm-list__input{color:var(--bcm-new-ds-color-slate-300);background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-list.disabled .bcm-tag__content.dismissable .close-button{cursor:default}.bcm-list:not(.disabled) .bcm-list__input .bcm-tag__content.checked .close-button bcm-icon{color:var(--bcm-new-ds-color-slate-100)}.bcm-list:not(.disabled) .bcm-list__input .bcm-tag__content.checked .close-button:hover bcm-icon{color:var(--bcm-new-ds-color-slate-200)}.bcm-list:not(.disabled) .bcm-list__input:hover{border-color:var(--bcm-new-ds-color-blue-500)}.bcm-list:not(.disabled) .bcm-list__input:hover .bcm-tag__content.dismissable:not(.checked){background-color:var(--bcm-new-ds-color-slate-200);border-color:var(--bcm-new-ds-color-slate-200)}.bcm-list:not(.disabled) .bcm-list__input:focus-visible{border-color:var(--bcm-new-ds-color-blue-500);box-shadow:0 1px 3px 0 rgba(17, 24, 38, 0.1)}.bcm-list:not(.disabled) .bcm-list__input:active{border-color:var(--bcm-new-ds-color-blue-500)}.bcm-list__item{padding:2px 0}.bcm-list__item.disabled{user-select:none}.bcm-list__item:focus{outline:none}.bcm-list__item:focus-visible>.bcm-list__item-content{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-list__item:focus-visible>.bcm-list__item-content:not(.disabled){color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item-content{display:flex;flex-direction:row;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;cursor:pointer;border-radius:4px;padding:0;padding-left:4px;color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-50);transition:background-color 0.2s ease}.bcm-list__item-content.disabled{color:var(--bcm-new-ds-color-slate-300);background-color:var(--bcm-new-ds-color-slate-50);user-select:none;cursor:not-allowed}.bcm-list__item-content.selected{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-500)}.bcm-list__item-content.selected:hover:not(.disabled){color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item-content:hover:not(.disabled){color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item-content:active:not(.disabled){color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-200)}.bcm-list__item-content-collapse-icon{width:16px;padding:0 8px;display:flex;align-items:center;justify-content:center;font-size:16px}.bcm-list__item-content-collapse-icon.child{cursor:pointer}.bcm-list__item-content-text{user-select:none;padding:8px;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.bcm-list__item-content-text.treeview{padding:8px 0}.bcm-list__item-content-text-checkbox{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:nowrap;margin-right:8px}.bcm-list__item-content-text-checkbox .bcm-checkbox{margin:0}.bcm-list__item-content-text-inner{width:100%}.bcm-list__item-content-text mark{padding:0;margin:0;font-size:inherit;color:var(--bcm-color-grey-8);background-color:var(--bcm-color-yellow-4)}.bcm-list__item-childs{padding-left:16px}.bcm-list__item-small{padding:2px 0 2px 8px;font-size:10px;line-height:calc(10px + 8px)}.bcm-list__item-small .bcm-list__item-content-text{padding:3px 4px}.bcm-list__item-medium{font-size:12px;line-height:calc(12px + 8px)}.bcm-list__item-medium .bcm-list__item-content-text{padding:6px 4px}.bcm-list__item-large{font-size:14px;line-height:calc(14px + 8px)}.bcm-list__item-large .bcm-list__item-content-text{padding:9px 4px}.bcm-list__item--readonly:focus>.bcm-list__item-content:not(.disabled),.bcm-list__item--readonly.focused>.bcm-list__item-content:not(.disabled){color:var(--bcm-color-grey-7)}.bcm-list__item--readonly>.bcm-list__item-content{color:var(--bcm-color-grey-7)}.bcm-list__item--readonly>.bcm-list__item-content:hover,.bcm-list__item--readonly>.bcm-list__item-content:focus{color:var(--bcm-color-grey-7)}.bcm-list__item--group{border-radius:4px}.bcm-list__item--group:focus>.bcm-list__item-content:not(.disabled){background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item--group>.bcm-list__item-content{background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600);border-radius:4px 4px 0 0;cursor:default;font-size:14px;line-height:calc(14px + 8px);font-weight:500;position:sticky;top:0}.bcm-list__item--group>.bcm-list__item-content>.bcm-list__item-content-text{padding:4px 8px 4px 16px}.bcm-list__item--group>.bcm-list__item-content:hover,.bcm-list__item--group>.bcm-list__item-content:focus{color:var(--bcm-new-ds-color-slate-800);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list__item--group>.bcm-list__item-content-unclickable:hover{color:var(--bcm-new-ds-color-slate-700);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list__item--group>.bcm-list__item-childs{background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600);padding-bottom:8px;border-radius:0 0 4px 4px;padding-left:8px}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content{background-color:var(--bcm-new-ds-color-white);color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:hover{background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:active{background-color:var(--bcm-new-ds-color-slate-200)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:focus-visible{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected{background-color:var(--bcm-new-ds-color-blue-500);color:var(--bcm-new-ds-color-white)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected:hover{background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected:active{background-color:var(--bcm-new-ds-color-blue-700)}.bcm-list__linked{display:none}.bcm-list .bcm-tag--other .value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-info-footer{text-align:right;padding:4px 8px;background-color:var(--bcm-new-ds-color-slate-100);color:var(--bcm-new-ds-color-slate-600);border-radius:0 0 4px 4px}";
-
-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;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-    r = Reflect.decorate(decorators, target, key, desc);
-  else
-    for (var i = decorators.length - 1; i >= 0; i--)
-      if (d = decorators[i])
-        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-const BcmList = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.bcmChecklist = createEvent(this, "bcm-checklist", 7);
-    this.bcmSelected = createEvent(this, "bcm-selected", 7);
-    this.change = createEvent(this, "bcm-change", 7);
-    this.open = createEvent(this, "bcm-open", 3);
-    this.close = createEvent(this, "bcm-close", 3);
-    this.listClose = createEvent(this, "bcm-list-close", 7);
-    this.listOpen = createEvent(this, "bcm-list-open", 7);
-    this.debounce = null;
-    this.debounceHandler = Generate.debounceInput(() => this.listenResize(), 300, false);
-    this._id = Generate.UID();
-    this.tempId = Generate.UID();
-    this.type = Bcm$1.ListType.listbox;
-    this.treeview = false;
-    this.checkboxes = false;
-    this.searchable = false;
-    this.value = null;
-    this.inputText = undefined;
-    this.name = undefined;
-    this.label = undefined;
-    this.size = Bcm$1.Size.medium;
-    this.disabled = false;
-    this.readonly = false;
-    this.highlight = false;
-    this.highlightText = undefined;
-    this.required = false;
-    this.hidden = false;
-    this.fullWidth = false;
-    this.height = "256px";
-    this.maxHeight = "500px";
-    this.minHeight = "150px";
-    this.width = "256px";
-    this.tooltip = undefined;
-    this.infoFooter = false;
-    this.variableText = "item";
-    this.template = undefined;
-    this.allOpen = false;
-    this.keyControl = false;
-    this.checkAll = true;
-    this.stopDeepClean = false;
-    this.openIntersecting = false;
-    this.linkedComponent = undefined;
-    this.isOpen = false;
-    this.calculatedViewport = false;
-    this.isSelectedOther = false;
-    this.isHaveOtherTag = false;
-    this.placeholder = "Choose an option";
-    this.searchPlaceholder = "Search";
-    this.searchIsOnlyChilds = false;
-    this.minSearchLength = 2;
-    this.clearable = false;
-    this.caption = undefined;
-    this.noCaption = false;
-    this.captionType = Bcm$1.Status.default;
-    this.captionError = undefined;
-    this.emptyText = undefined;
-    this.emptyIcon = "fad fa-folder-open";
-    this.captionCache = undefined;
-    this.captionTypeCache = undefined;
-    this.tick = {};
-    this.totalData = 0;
-    this.totalRootData = 0;
-    this.limit = 20;
-    this.searchGetParents = undefined;
-    this.searchResultLimit = 20;
-    this.searchFound = null;
-    this.returnFilterData = {};
-    this.returnOtherData = {};
-    this.options = {
-      rootMargin: "30px",
-    };
-    this.tagContainerWidth = 0;
-    this.selectAllItem = {
-      id: "select-all",
-      text: "Select All",
-      value: "select-all",
-      checked: false,
-      disabled: false,
-      icon: "",
-      status: Bcm$1.Status.default,
-      indeterminate: "uncheck",
-    };
-    this.placement = Bcm$1.Placement["bottom-start"];
-    this.disableChangeEvent = false;
-    this.data = [];
-    window.addEventListener("scroll", this.handleWheel.bind(this), true);
-    window.addEventListener("wheel", this.handleWheel.bind(this), true);
-    window.addEventListener("resize", this.handleResize.bind(this), true);
-  }
-  connectedCallback() {
-    if (this.height != "256px") {
-      if (this.height.indexOf("px") > -1) {
-        this.limit = Math.floor(+this.height.replace("px", "") / 10);
-      }
-      else {
-        this.limit = Math.floor(+(window.innerHeight / 10));
-      }
-      this.searchResultLimit = this.limit;
-      this.markForCheck();
-    }
-    const checkElementWithDom = document.querySelectorAll(`#bcm-list-${this._id}`);
-    (checkElementWithDom === null || checkElementWithDom === void 0 ? void 0 : checkElementWithDom.length) > 1 && checkElementWithDom.forEach((item, index) => index > 0 && item.remove());
-  }
-  componentWillRender() {
-    this.calculateLocation();
-  }
-  componentShouldUpdate(newVal, oldVal, propName) {
-    if (Object.keys(this.getOptions()).indexOf(propName) > -1 && newVal !== oldVal) {
-      this.updateOptions();
-    }
-  }
-  get containerWidth() {
-    var _a, _b;
-    return (_b = (_a = this.el) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width;
-  }
-  get tagCount() {
-    return this.containerWidth > 0 ? Math.floor(+(this.containerWidth - 100) / 85) : 0;
-  }
-  get tagData() {
-    return snq(() => {
-      var _a;
-      return (_a = this.value) === null || _a === void 0 ? void 0 : _a.map(item => ({
-        value: item.id,
-        label: StringHelper.textLimitter(item.text, 7),
-        text: item.tooltipMessage || item.tagTitle || item.text,
-      }));
-    }, []);
-  }
-  async componentDidLoad() {
-    await this.initState();
-    // if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
-    //     const list = this.el.querySelector(`#bcm-list-${this._id}`);
-    //     if (list) {
-    //         document.body.appendChild(list); 
-    //     }
-    // }
-  }
-  disconnectedCallback() {
-    this.isOpen = false;
-    if (this.stopDeepClean)
-      return;
-    listState.removeState(this._id);
-    this.el.innerHTML = "";
-    if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
-      const list = document.querySelectorAll(`#bcm-list-${this._id}`);
-      if (list === null || list === void 0 ? void 0 : list.length) {
-        list.forEach(item => item.remove());
-        this.el.remove();
-      }
-    }
-  }
-  watchId(_, oldVal) {
-    // console.info('Changed component id:', oldVal + ' -> ' + newVal);
-    listState.removeState(oldVal);
-    this.initState();
-  }
-  handleValueChange(newVal, oldVal) {
-    var _a;
-    if (Generate.objectIsEmpty(this.returnFilterData)) {
-      this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
-    }
-    if (this.checkboxes) {
-      if (!Validators.compareTwoArrayIsSame(newVal, oldVal)) {
-        this.bcmChecklist.emit(this.value);
-        !this.disableChangeEvent && this.change.emit(this.value);
-      }
-    }
-    else {
-      if ((newVal === null || newVal === void 0 ? void 0 : newVal.id) != (oldVal === null || oldVal === void 0 ? void 0 : oldVal.id)) {
-        !this.disableChangeEvent && this.change.emit(this.value);
-      }
-    }
-  }
-  watchReturnFilterData(newVal) {
-    var _a;
-    const { checkedItems, visibledItems } = newVal;
-    if (checkedItems && visibledItems) {
-      this.handleIndeterminate(checkedItems.length, visibledItems.length);
-    }
-    else {
-      this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
-    }
-  }
-  async handleOpen() {
-    if (this.isOpen) {
-      this.detectClone();
-      if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
-        const list = this.el.querySelector(`#bcm-list-${this._id}`);
-        if (list) {
-          const bcmOverlayContainer = document.querySelector("#bcm-overlay-container");
-          bcmOverlayContainer.appendChild(list);
-        }
-      }
-      this.open.emit();
-      this.calculateLocation();
-      this.onSelectSearch();
-    }
-    else {
-      this.listScrollToTop();
-      this.close.emit();
-      this.listClose.emit();
-      await delay(100);
-      this.unSelectOther();
-    }
-  }
-  listScrollToTop() {
-    const list = document.querySelector(`#bcm-list-${this._id}`);
-    if (list) {
-      list.querySelector(".scrolling").scrollTop = 0;
-    }
-  }
-  async dataChanged(newValue, oldValue) {
-    if (!Validators.compareTwoArrayIsSame(newValue, oldValue)) {
-      await this.initState();
-    }
-  }
-  isIntersecting(e) {
-    const target = e === null || e === void 0 ? void 0 : e.target;
-    if (target && target.id === this._id) {
-      this.listenResize();
-    }
-  }
-  handleSlotItems(e) {
-    var _a;
-    if (((_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      this.data = e.detail;
-    }
-  }
-  handleChange(e) {
-    if (e.target.id == `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
-      e.stopImmediatePropagation();
-    }
-  }
-  handleResize() {
-    this.calculateLocation();
-    this.debounceHandler();
-  }
-  handleWheel(event) {
-    if (this.isOpen) {
-      const list = document.querySelector(`#bcm-list-${this._id}`);
-      const isClickInside = list && Generate.findEventPath(event, list);
-      if (isClickInside) {
-        if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
-          this.calculateLocation();
-        }
-      }
-      else {
-        this.hide();
-      }
-    }
-  }
-  clearAutocomplete() {
-    if (this.type == "autocomplete") {
-      const autocompleteInput = this.getAutoCompleteInput();
-      if (autocompleteInput) {
-        autocompleteInput.handleClear(false);
-      }
-    }
-  }
-  async handleSelectOtherTag(e) {
-    if (this.disabled)
-      return;
-    const { id, checked } = e.detail;
-    this.isSelectedOther = checked;
-    if (id) {
-      checked ? this.filterOtherList(id) : this.unSelectOther();
-      this.isOpen = true;
-    }
-  }
-  async handleDeleteTag(e) {
-    var _a;
-    if (this.disabled)
-      return;
-    const { id } = e.detail;
-    this.isSelectedOther && this.unSelectOther();
-    Array.isArray(id) ? listState.removeOtherTags(this._id, id) : listState.checkedItem(this._id, id);
-    this.value = (await this.getCheckedList()).checkedList;
-    this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
-  }
-  async handleSelectTag(_) {
-    if (this.disabled)
-      return;
-    this.clearAutocomplete();
-    this.onSelectSearch();
-    this.unSelectOther();
-  }
-  handleClick(event) {
-    var _a;
-    if (this.disabled)
-      return;
-    const list = document.querySelector(`#bcm-list-${this._id}`);
-    const isClickInside = Generate.findEventPath(event, this.el) || (list && Generate.findEventPath(event, list));
-    if (isClickInside) {
-      if (this.debounce !== null) {
-        event.preventDefault();
-        event.stopPropagation();
-        clearTimeout(this.debounce);
-        this.debounce = null;
-      }
-      this.debounce = setTimeout(() => {
-        this.debounce = null;
-      }, 300);
-    }
-    if (!isClickInside) {
-      if (this.type == "autocomplete") {
-        const autocompleteInput = this.getAutoCompleteInput();
-        if (autocompleteInput) {
-          if (this.checkboxes) {
-            autocompleteInput.setValue("");
-          }
-          else {
-            autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || "");
-          }
-        }
-      }
-    }
-    const clickToTag = Generate.findEventPathWithKey(event, "className", ["bcm-tag"]);
-    const clickToOtherTag = Generate.findEventPathWithKey(event, "className", ["bcm-tag bcm-tag--other"]);
-    const clickToSelect = Generate.findEventPathWithKey(event, "id", [`bcm-list-input-${this._id}`, `bcm-list-label-${this._id}`]);
-    const clickToTagDismiss = Generate.findEventPathWithKey(event, "className", ["right close-button"]);
-    if (clickToSelect && !clickToTagDismiss && this.type != "autocomplete") {
-      this.isOpen = clickToTag || clickToOtherTag ? true : !this.isOpen;
-    }
-    if (list) {
-      if (this.isOpen) {
-        if (!list.contains(event.target) && !this.el.contains(event.target)) {
-          this.isOpen = false;
-          // this.unSelectOther()
-        }
-      }
-    }
-  }
-  bcmOnSearchClear(event) {
-    var _a, _b;
-    if (this.type == "autocomplete") {
-      if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.id) === `bcm-list-${this._id}-search` || ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.id) === `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
-        if (event.detail) {
-          this.setClear();
-        }
-      }
-    }
-  }
-  bcmOnSearch(event) {
-    var _a, _b, _c, _d, _e, _f;
-    if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.id) === `bcm-list-${this._id}-search` || ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.id) === `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
-      this.searchGetParents = snq(() => { var _a; return (_a = event.detail) === null || _a === void 0 ? void 0 : _a.parentIndex; }, null);
-      this.searchResultLimit = 10;
-      this.searchFound = ((_c = event.detail) === null || _c === void 0 ? void 0 : _c.matching) != null ? (_d = event.detail) === null || _d === void 0 ? void 0 : _d.matching.length : null;
-      this.returnFilterData = listState.filterData(this._id, (_e = event.detail) === null || _e === void 0 ? void 0 : _e.nestedResult);
-      if (this.searchFound > 0 && this.highlight) {
-        this.highlightText = (_f = event.detail) === null || _f === void 0 ? void 0 : _f.value;
-      }
-      if (this.type == "autocomplete") {
-        this.isOpen = true;
-      }
-      if (!event.detail.result) {
-        if (this.type == "autocomplete") {
-          this.isOpen = false;
-        }
-        else {
-          this.returnFilterData = {};
-          listState.filterData(this._id, null);
-        }
-        // this.isSelectedOther = false
-        this.searchResultLimit = null;
-        this.highlightText = null;
-      }
-      this.markForCheck();
-    }
-  }
-  //keyboard navigation
-  handleKeyDown(ev) {
-    const keycode = ev.keyCode || ev.which;
-    if (keycode === Bcm$1.KeyCode.escape) {
-      if (this.isOpen) {
-        this.isOpen = false;
-        ev.preventDefault();
-        ev.stopPropagation();
-        ev.stopImmediatePropagation();
-      }
-    }
-    if (this.keyControl) {
-      const keyboard = new ListKeyControl(keycode, this.el, this.treeview, this.checkboxes);
-      keyboard.openGroup = openGroupId => {
-        this.openGroup(openGroupId);
-      };
-      keyboard.checkedItem = checkedItemId => {
-        this.checkedItem(checkedItemId);
-      };
-      keyboard.keyDown();
-    }
-  }
-  handleKeyUp(ev) {
-    if (this.keyControl) {
-      const focusedList = Generate.findEventPath(ev, this.el);
-      if (focusedList) {
-        const list = document.getElementById(`bcm-list-${this._id}`);
-        if (list) {
-          const items = list.querySelectorAll(".bcm-list__item.focused");
-          if (items.length > 0) {
-            const main = list.querySelector("main");
-            const itemHeight = items[0].offsetHeight;
-            const listHeight = main.offsetHeight;
-            const itemTop = items[0].offsetTop;
-            if (itemTop > listHeight) {
-              main.scrollTop = itemTop - listHeight / 2 + itemHeight / 2;
-            }
-            if (itemTop < listHeight) {
-              main.scrollTop = itemTop - listHeight / 2 - itemHeight / 2;
-            }
-          }
-        }
-      }
-    }
-  }
-  async set(data) {
-    if (data) {
-      if (Array.isArray(data)) {
-        this.addChecked(data);
-      }
-      if (typeof data === "string" || typeof data === "number") {
-        this.selectedItem(data);
-      }
-    }
-    else {
-      this.setClear();
-    }
-  }
-  async get() {
-    var _a, _b;
-    return this.value ? (this.checkboxes ? (_b = (_a = ((await this.getCheckedList()))) === null || _a === void 0 ? void 0 : _a.checkedList) === null || _b === void 0 ? void 0 : _b.map(item => item.id) : this.value.id) : null;
-  }
-  async getCheckedList() {
-    return Promise.resolve(listState.getCheckedList(this._id));
-  }
-  async getSelected() {
-    return Promise.resolve(listState.getSelected(this._id));
-  }
-  async getValue() {
-    return Promise.resolve(this.value);
-  }
-  async addChecked(ids = [], save = false, emit = true) {
-    if (ids && ids.length > 0) {
-      if (!save) {
-        listState.setClear(this._id);
-        await delay(10);
-      }
-      await listState.addChecked(this._id, ids);
-      await delay(10);
-      emit && (this.value = (await this.getCheckedList()).checkedList);
-      this.markForCheck();
-    }
-    return Promise.resolve(this.value);
-  }
-  async selected(id) {
-    if (id) {
-      return Promise.resolve(await this.selectedItem(id));
-    }
-    return false;
-  }
-  async setClear(e) {
-    listState.setClear(this._id);
-    this.value = null;
-    this.inputText = "";
-    this.isOpen = false;
-    this.selectAllItem.indeterminate = "uncheck";
-    this.markForCheck();
-    if (e) {
-      e.stopPropagation();
-      e.preventDefault();
-    }
-    await delay(10);
-    return Promise.resolve();
-  }
-  async resetCaption() {
-    await delay(10);
-    this.caption = this.captionCache;
-    this.captionType = this.captionTypeCache;
-    this.captionError = null;
-    await delay(10);
-    return Promise.resolve();
-  }
-  detectClone() {
-    const list = document.querySelectorAll(`#bcm-list-${this._id}`);
-    if (list.length > 0) {
-      list.forEach((item) => {
-        const tempid = item.getAttribute("temp-id");
-        if (tempid !== `bcm-list-${this.tempId}`) {
-          console.warn(`[bcm-list] - Detected duplicate temp-id="${tempid}"`);
-          item.remove();
-        }
-      });
-    }
-  }
-  async show() {
-    this.isOpen = true;
-    return Promise.resolve();
-  }
-  async hide() {
-    this.isOpen = false;
-    return Promise.resolve();
-  }
-  updateOptions() {
-    listState.updateOptions(this._id, this);
-  }
-  handleIndeterminate(checkeds, total) {
-    this.selectAllItem = Object.assign(Object.assign({}, this.selectAllItem), { indeterminate: this.checkboxes && checkeds > 0 ? (checkeds === total ? "check" : "indeterminate") : "uncheck", checked: this.checkboxes && checkeds > 0 ? (checkeds === total ? true : false) : false });
-  }
-  listenResize() {
-    this.calculateLocation();
-    this.markForCheck();
-  }
-  async unSelectOther() {
-    await this.onClearSearch();
-    this.isSelectedOther = false;
-    this.searchFound = null;
-    this.returnFilterData = {};
-    listState.filterData(this._id, null);
-    await delay(10);
-    return Promise.resolve();
-  }
-  async onClearSearch() {
-    const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
-    if (searchInput) {
-      await searchInput.handleClear();
-    }
-    return Promise.resolve();
-  }
-  async onSelectSearch() {
-    const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
-    if (searchInput) {
-      await delay(100);
-      searchInput.onBcmFocus();
-      searchInput.onBcmSelect();
-    }
-  }
-  async filterOtherList(ids) {
-    const checklist = (await this.getCheckedList()).nestedResult;
-    const filter = Generate.convertIdsToNestedData(ids, checklist);
-    this.returnFilterData = await listState.filterData(this._id, filter, null, true);
-    this.searchFound = (ids === null || ids === void 0 ? void 0 : ids.length) || 0;
-    this.limit = 500;
-    this.searchGetParents = null;
-    await delay(1000);
-    this.markForCheck();
-  }
-  async initState() {
-    var _a, _b, _c;
-    this.onClearSearch();
-    await listState.setValue({
-      id: this._id,
-      dataSource: this.data && snq(() => (typeof this.data == "string" ? JSON.parse(this.data) : this.data), []),
-      options: this,
-    });
-    const { totalRoots, totalItems } = listState.getValue(this._id);
-    this.totalData = totalItems;
-    this.totalRootData = totalRoots;
-    this.value = this.checkboxes ? (await this.getCheckedList()).checkedList : listState.selectedItem(this._id) ? listState.selectedItem(this._id)[0] : null;
-    if (!this.checkboxes) {
-      this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
-    }
-    // checkli olan subparentların indeterminate kontrolü için
-    if (this.checkboxes && ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-      const checkedIDs = [];
-      this.value.forEach(item => {
-        if (!item.items || item.items.length === 0) {
-          checkedIDs.push(item.id);
-        }
-      });
-      await this.addChecked(checkedIDs, false, false);
-    }
-    await this.handleIndeterminate((_c = this.value) === null || _c === void 0 ? void 0 : _c.length, this.totalData);
-    await this.markForCheck();
-  }
-  async markForCheck() {
-    await delay(10);
-    this.tick = Generate.UID();
-  }
-  getOptions() {
-    return snq(() => listState.getValue(this._id).options, {});
-  }
-  getItems() {
-    if (this.isSelectedOther) {
-      return this.returnFilterData["checkedItems"];
-    }
-    return snq(() => listState.getData(this._id), []);
-  }
-  getLimitedItems(ids) {
-    return snq(() => listState.getDataPagination(this._id, this.searchResultLimit || this.limit, ids), []);
-  }
-  openGroup(parentId) {
-    listState.openGroup(this._id, parentId);
-    this.markForCheck();
-  }
-  focusItem(e) {
-    if (e.target.classList.contains("bcm-list__item")) {
-      const item = e.target;
-      const list = document.getElementById(`bcm-list-${this._id}`);
-      if (list) {
-        const items = list.querySelectorAll(".bcm-list__item");
-        if (items.length > 0) {
-          const selectedItem = list.querySelector(".bcm-list__item.focused");
-          if (selectedItem) {
-            selectedItem.classList.remove("focused");
-          }
-          item.classList.add("focused");
-        }
-      }
-    }
-  }
-  async selectedItem(itemId) {
-    var _a;
-    if (!this.checkboxes) {
-      this.value = listState.selectedItem(this._id, itemId) ? listState.selectedItem(this._id, itemId)[0] : null;
-      this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
-      this.isOpen = false;
-      this.markForCheck();
-      if (this.type == "autocomplete" && this.value) {
-        // await delay(100)
-        // this.resetCaption()
-        const autocompleteInput = this.getAutoCompleteInput();
-        if (autocompleteInput) {
-          setTimeout(() => {
-            var _a;
-            autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || "");
-            this.isOpen = false;
-          }, 100);
-        }
-      }
-    }
-    return Promise.resolve(this.value);
-  }
-  async checkedItem(itemId) {
-    const isCheckSelectAll = itemId === "select-all";
-    if (!isCheckSelectAll) {
-      listState.checkedItem(this._id, itemId);
-    }
-    else {
-      listState.selectAll(this._id, !this.selectAllItem.checked);
-    }
-    this.value = (await this.getCheckedList()).checkedList;
-    this.changeVisibleCheckeds();
-    this.markForCheck();
-  }
-  changeVisibleCheckeds() {
-    const { visibledItems } = this.returnFilterData;
-    this.returnFilterData = {
-      visibledItems,
-      checkedItems: (visibledItems && visibledItems.filter(item => item.checked)) || [],
-    };
-  }
-  getAutoCompleteInput() {
-    return document.getElementById(`bcm-list-input-tag-container-${this._id}-autocomplete-input`);
-  }
-  dataScrollEvent(event) {
-    let count = 0;
-    let io = new IntersectionObserver((data) => {
-      if (count === 0) {
-        count++;
-        if (data[0].isIntersecting) {
-          this.limit += 15;
-          this.searchResultLimit += 15;
-          io.disconnect();
-          io = null;
-        }
-      }
-    }, this.options);
-    io.observe(event.target.lastElementChild);
-  }
-  async calculateLocation() {
-    var _a, _b;
-    if (this.type == "select" || this.type == "autocomplete" || this.linkedComponent) {
-      const list = document.getElementById(`bcm-list-${this._id}`);
-      // list && (list.style.height = '256px') //sebebi neydi ki!
-      var placement = this.placement;
-      const targetElementId = this.linkedComponent ? this.linkedComponent : `bcm-list-input-${this._id}`;
-      const targetElement = document.getElementById(targetElementId);
-      if (list && targetElement) {
-        getPlacement(list, targetElement, placement, (place) => (placement = place));
-        await delay(10);
-        let pos = setPosition(placement, targetElement);
-        let captionAreaHeight = 0;
-        let labelAreaHeight = 0;
-        if (this.linkedComponent) {
-          const linked = document.getElementById(this.linkedComponent);
-          if (linked) {
-            if (!linked["noCaption"]) {
-              const captionArea = ((_a = linked.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".bcm-caption-area")) || linked.querySelector(".bcm-caption-area");
-              if (captionArea) {
-                captionAreaHeight = captionArea.offsetHeight || captionArea.clientHeight;
-              }
-            }
-            const labelArea = ((_b = linked.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(".bcm-label")) || linked.querySelector(".bcm-label");
-            if (labelArea) {
-              labelAreaHeight = labelArea.offsetHeight || labelArea.clientHeight;
-            }
-          }
-        }
-        if (this.fullWidth) {
-          list.style.width = targetElement.offsetWidth + "px";
-        }
-        else {
-          list.style.width = this.width || "auto";
-        }
-        if (this.height.indexOf("%") > -1) {
-          list.style.height = NumberHelper.toNumber(this.height) * 0.01 * window.innerHeight - pos[0] - 50 + "px";
-        }
-        else {
-          list.style.height = this.height;
-        }
-        list.style.minHeight = this.minHeight;
-        // const calculatedMaxHeight = window.innerHeight - pos[0] - 50;
-        const calculatedMaxHeight = placement.split("-")[0] == "top" ? window.innerHeight - (window.innerHeight - pos[0]) - 50 : window.innerHeight - pos[0] - 50;
-        if (this.maxHeight.indexOf("%") > -1) {
-          list.style.maxHeight = NumberHelper.toNumber(this.maxHeight) * 0.01 * calculatedMaxHeight + "px";
-        }
-        else {
-          list.style.maxHeight = NumberHelper.toNumber(this.maxHeight) < calculatedMaxHeight ? this.maxHeight : calculatedMaxHeight + "px";
-        }
-        getPlacement(list, targetElement, placement, (place) => (placement = place));
-        await delay(10);
-        pos = setPosition(placement, targetElement);
-        list.style.top = (placement.split("-")[0] == "top" ? pos[0] - list.offsetHeight + labelAreaHeight : pos[0] - captionAreaHeight) + "px";
-        // list.style.left = pos[1] + 'px';
-        list.style.left = placement.split("-")[1] == "end" ? pos[1] - list.offsetWidth + "px" : pos[1] + "px";
-        list.classList.toggle("bcm-list--top", placement.split("-")[0] == "top");
-        this.calculatedViewport = true;
-      }
-    }
-  }
-  handleTransitionEnd(e) {
-    const { isOpen, type } = this;
-    const propertName = e === null || e === void 0 ? void 0 : e.propertyName;
-    if (isOpen && type == "select" && propertName == "transform") {
-      this.listOpen.emit();
-    }
-  }
-  render() {
-    const { checkboxes, treeview, label, size, disabled, readonly, required, hidden, fullWidth, searchable } = this.getOptions();
-    const hostClasses = classnames("bcm-list", `bcm-list__size-${size}`, `bcm-list__${this.type}`, size === "large" ? "size-3" : "size-2", {
-      "error": this.captionType == Bcm$1.Status.error,
-      "full-width": fullWidth,
-      "bcm-list__linked": this.linkedComponent,
-      hidden,
-      readonly,
-      disabled,
-    });
-    const bcmListContainer = classnames("bcm-list__container", this.linkedComponent ? "bcm-list__type-linked-component" : `bcm-list__type-${this.type}`, {
-      "is-open": this.isOpen && this.calculatedViewport,
-      "error": this.captionType == Bcm$1.Status.error,
-      "full-width": fullWidth,
-      hidden,
-      readonly,
-      disabled,
-    });
-    const bcmListInput = classnames("bcm-list__input");
-    const openedType = this.type == "select" || this.type == "autocomplete" || this.linkedComponent;
-    return (h(Host, { class: hostClasses, tabindex: "0", style: {
-        "--width": fullWidth ? "100%" : this.width,
-        "--height": openedType ? "100%" : this.height,
-        "--max-height": openedType ? "inherit" : this.maxHeight,
-        "--min-height": openedType ? "inherit" : this.minHeight,
-      } }, h("div", { id: `bcm-list-label-${this._id}`, class: "bcm-list__label" }, label && (h("div", null, h("bcm-label", { tooltip: this.tooltip, size: this.size, type: this.captionType, value: label, required: required, htmlFor: this._id })))), this.type == "select" && (h("div", { id: `bcm-list-input-${this._id}`, class: bcmListInput }, h("span", { class: classnames("bcm-list__input-container", { "type-single": !checkboxes, "value-empty": !this.value }) }, this.checkboxes ? (this.value && this.value.length > 0 ? (h("bcm-rc-overflow", { data: this.tagData, maxCount: this.tagCount })) : (h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))) : this.value ? (this.inputText) : (h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))), h("span", { class: classnames("bcm-list__input-buttons", {
-        disabled: disabled,
-      }) }, this.clearable && this.value && (h("div", { class: "bcm-list__input-buttons-button" }, h("bcm-icon", { icon: "fal fa-times", onClick: e => !disabled && this.setClear(e) }))), h("div", { class: `bcm-list__input-buttons-button caret-is ${this.isOpen && this.calculatedViewport && "caret-is-open"}` }, h("bcm-icon", { icon: `far fa-angle-down` }))))), this.type === "autocomplete" && (h("div", { id: `bcm-list-input-${this._id}`, class: classnames(bcmListInput, { "bcm-list__input-autocomplete": this.type == "autocomplete" }) }, h("span", { class: "bcm-list__input-container", id: `bcm-list-input-tag-container-${this._id}` }, this.checkboxes && h("span", { class: "bcm-list__input-tag-container", id: `bcm-list-input-tag-container-${this._id}-autocomplete` }), h("bcm-search", { id: `bcm-list-input-tag-container-${this._id}-autocomplete-input`, class: "bcm-list__autocomplete", data: this.data, clearable: true, "full-width": true, "no-caption": true, placeholder: this.placeholder })))), h(ListTemplate, { highlight: this.highlightText, searchable: this.type == "autocomplete" ? false : searchable, bcmListContainer: bcmListContainer, checkboxes: checkboxes, treeview: treeview, infoFooter: this.infoFooter, value: this.value, totalData: this.totalData, searchFound: this.searchFound, variableText: this.variableText, searchPlaceholder: this.searchPlaceholder, minSearchLength: this.minSearchLength, searchIsOnlyChilds: this.searchIsOnlyChilds, _id: this._id, tempId: this.tempId, checkAll: this.checkAll, data: this.getItems(), width: this.width, height: this.height, size: this.size, selectAllItem: this.selectAllItem, onScrollEvent: e => this.dataScrollEvent(e), items: this.getLimitedItems(this.searchGetParents), selectedItem: itemId => this.selectedItem(itemId), checkedItem: itemId => this.checkedItem(itemId), openGroup: parentId => this.openGroup(parentId), focusItem: itemId => this.focusItem(itemId), emptyText: this.emptyText, emptyIcon: this.emptyIcon, handleTransitionEnd: e => this.handleTransitionEnd(e) }), h(CaptionTemplate, { noCaption: this.noCaption, captionType: this.captionType, captionError: this.captionError, caption: this.caption })));
-  }
-  get el() { return getElement(this); }
-  static get watchers() { return {
-    "_id": ["watchId"],
-    "value": ["handleValueChange"],
-    "returnFilterData": ["watchReturnFilterData"],
-    "isOpen": ["handleOpen"],
-    "data": ["dataChanged"]
-  }; }
-};
-__decorate([
-  IsLoad()
-], BcmList.prototype, "el", void 0);
-__decorate([
-  JsonParse("data", true)
-], BcmList.prototype, "dataChanged", null);
-BcmList.style = listCss;
-
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-
-function _typeof(obj) {
-  "@babel/helpers - typeof";
-
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
-    return typeof obj;
-  } : function (obj) {
-    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-  }, _typeof(obj);
-}
-
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object") return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
-
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
-}
-
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
-
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    })), keys.push.apply(keys, symbols);
-  }
-  return keys;
-}
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-      _defineProperty(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-    });
-  }
-  return target;
-}
-
-function _arrayWithHoles(arr) {
-  if (Array.isArray(arr)) return arr;
-}
-
-function _iterableToArrayLimit(arr, i) {
-  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
-  if (null != _i) {
-    var _s,
-      _e,
-      _x,
-      _r,
-      _arr = [],
-      _n = !0,
-      _d = !1;
-    try {
-      if (_x = (_i = _i.call(arr)).next, 0 === i) {
-        if (Object(_i) !== _i) return;
-        _n = !1;
-      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
-    } catch (err) {
-      _d = !0, _e = err;
-    } finally {
-      try {
-        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
-      } finally {
-        if (_d) throw _e;
-      }
-    }
-    return _arr;
-  }
-}
-
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length) len = arr.length;
-  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-  return arr2;
-}
-
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
-
-function _nonIterableRest() {
-  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-
-function _slicedToArray(arr, i) {
-  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
-}
-
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-
-function _objectWithoutProperties(source, excluded) {
-  if (source == null) return {};
-  var target = _objectWithoutPropertiesLoose(source, excluded);
-  var key, i;
-  if (Object.getOwnPropertySymbols) {
-    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-    for (i = 0; i < sourceSymbolKeys.length; i++) {
-      key = sourceSymbolKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-      target[key] = source[key];
-    }
-  }
-  return target;
-}
-
-var _excluded$2 = ["prefixCls", "invalidate", "item", "renderItem", "responsive", "responsiveDisabled", "registerSize", "itemKey", "className", "style", "children", "display", "order", "component"];
-// Use shared variable to save bundle size
-var UNDEFINED = undefined;
-function InternalItem(props, ref) {
-  var prefixCls = props.prefixCls,
-    invalidate = props.invalidate,
-    item = props.item,
-    renderItem = props.renderItem,
-    responsive = props.responsive,
-    responsiveDisabled = props.responsiveDisabled,
-    registerSize = props.registerSize,
-    itemKey = props.itemKey,
-    className = props.className,
-    style = props.style,
-    children = props.children,
-    display = props.display,
-    order = props.order,
-    _props$component = props.component,
-    Component = _props$component === void 0 ? 'div' : _props$component,
-    restProps = _objectWithoutProperties(props, _excluded$2);
-  var mergedHidden = responsive && !display;
-  // ================================ Effect ================================
-  function internalRegisterSize(width) {
-    registerSize(itemKey, width);
-  }
-  react.useEffect(function () {
-    return function () {
-      internalRegisterSize(null);
-    };
-  }, []);
-  // ================================ Render ================================
-  var childNode = renderItem && item !== UNDEFINED ? renderItem(item) : children;
-  var overflowStyle;
-  if (!invalidate) {
-    overflowStyle = {
-      opacity: mergedHidden ? 0 : 1,
-      height: mergedHidden ? 0 : UNDEFINED,
-      overflowY: mergedHidden ? 'hidden' : UNDEFINED,
-      order: responsive ? order : UNDEFINED,
-      pointerEvents: mergedHidden ? 'none' : UNDEFINED,
-      position: mergedHidden ? 'absolute' : UNDEFINED
-    };
-  }
-  var overflowProps = {};
-  if (mergedHidden) {
-    overflowProps['aria-hidden'] = true;
-  }
-  var itemNode = /*#__PURE__*/react.createElement(Component, _extends({
-    className: classnames(!invalidate && prefixCls, className),
-    style: _objectSpread2(_objectSpread2({}, overflowStyle), style)
-  }, overflowProps, restProps, {
-    ref: ref
-  }), childNode);
-  if (responsive) {
-    itemNode = /*#__PURE__*/react.createElement(RefResizeObserver, {
-      onResize: function onResize(_ref) {
-        var offsetWidth = _ref.offsetWidth;
-        internalRegisterSize(offsetWidth);
-      },
-      disabled: responsiveDisabled
-    }, itemNode);
-  }
-  return itemNode;
-}
-var Item = /*#__PURE__*/react.forwardRef(InternalItem);
-Item.displayName = 'Item';
-
-function channelUpdate(callback) {
-  if (typeof MessageChannel === 'undefined') {
-    wrapperRaf(callback);
-  } else {
-    var channel = new MessageChannel();
-    channel.port1.onmessage = function () {
-      return callback();
-    };
-    channel.port2.postMessage(undefined);
-  }
-}
-
-/**
- * Batcher for record any `useEffectState` need update.
- */
-function useBatcher() {
-  // Updater Trigger
-  var updateFuncRef = react.useRef(null);
-  // Notify update
-  var notifyEffectUpdate = function notifyEffectUpdate(callback) {
-    if (!updateFuncRef.current) {
-      updateFuncRef.current = [];
-      channelUpdate(function () {
-        reactDom.unstable_batchedUpdates(function () {
-          updateFuncRef.current.forEach(function (fn) {
-            fn();
-          });
-          updateFuncRef.current = null;
-        });
-      });
-    }
-    updateFuncRef.current.push(callback);
-  };
-  return notifyEffectUpdate;
-}
-/**
- * Trigger state update by `useLayoutEffect` to save perf.
- */
-function useEffectState(notifyEffectUpdate, defaultValue) {
-  // Value
-  var _React$useState = react.useState(defaultValue),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    stateValue = _React$useState2[0],
-    setStateValue = _React$useState2[1];
-  // Set State
-  var setEffectVal = useEvent(function (nextValue) {
-    notifyEffectUpdate(function () {
-      setStateValue(nextValue);
-    });
-  });
-  return [stateValue, setEffectVal];
-}
-
-var OverflowContext = /*#__PURE__*/react.createContext(null);
-
-var _excluded$1 = ["component"],
-  _excluded2 = ["className"],
-  _excluded3 = ["className"];
-var InternalRawItem = function InternalRawItem(props, ref) {
-  var context = react.useContext(OverflowContext);
-  // Render directly when context not provided
-  if (!context) {
-    var _props$component = props.component,
-      Component = _props$component === void 0 ? 'div' : _props$component,
-      _restProps = _objectWithoutProperties(props, _excluded$1);
-    return /*#__PURE__*/react.createElement(Component, _extends({}, _restProps, {
-      ref: ref
-    }));
-  }
-  var contextClassName = context.className,
-    restContext = _objectWithoutProperties(context, _excluded2);
-  var className = props.className,
-    restProps = _objectWithoutProperties(props, _excluded3);
-  // Do not pass context to sub item to avoid multiple measure
-  return /*#__PURE__*/react.createElement(OverflowContext.Provider, {
-    value: null
-  }, /*#__PURE__*/react.createElement(Item, _extends({
-    ref: ref,
-    className: classnames(contextClassName, className)
-  }, restContext, restProps)));
-};
-var RawItem = /*#__PURE__*/react.forwardRef(InternalRawItem);
-RawItem.displayName = 'RawItem';
-
-var _excluded = ["prefixCls", "data", "renderItem", "renderRawItem", "itemKey", "itemWidth", "ssr", "style", "className", "maxCount", "renderRest", "renderRawRest", "suffix", "component", "itemComponent", "onVisibleChange"];
-var RESPONSIVE = 'responsive';
-var INVALIDATE = 'invalidate';
-function defaultRenderRest(omittedItems) {
-  return "+ ".concat(omittedItems.length, " ...");
-}
-function Overflow(props, ref) {
-  var _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? 'rc-overflow' : _props$prefixCls,
-    _props$data = props.data,
-    data = _props$data === void 0 ? [] : _props$data,
-    renderItem = props.renderItem,
-    renderRawItem = props.renderRawItem,
-    itemKey = props.itemKey,
-    _props$itemWidth = props.itemWidth,
-    itemWidth = _props$itemWidth === void 0 ? 10 : _props$itemWidth,
-    ssr = props.ssr,
-    style = props.style,
-    className = props.className,
-    maxCount = props.maxCount,
-    renderRest = props.renderRest,
-    renderRawRest = props.renderRawRest,
-    suffix = props.suffix,
-    _props$component = props.component,
-    Component = _props$component === void 0 ? 'div' : _props$component,
-    itemComponent = props.itemComponent,
-    onVisibleChange = props.onVisibleChange,
-    restProps = _objectWithoutProperties(props, _excluded);
-  var fullySSR = ssr === 'full';
-  var notifyEffectUpdate = useBatcher();
-  var _useEffectState = useEffectState(notifyEffectUpdate, null),
-    _useEffectState2 = _slicedToArray(_useEffectState, 2),
-    containerWidth = _useEffectState2[0],
-    setContainerWidth = _useEffectState2[1];
-  var mergedContainerWidth = containerWidth || 0;
-  var _useEffectState3 = useEffectState(notifyEffectUpdate, new Map()),
-    _useEffectState4 = _slicedToArray(_useEffectState3, 2),
-    itemWidths = _useEffectState4[0],
-    setItemWidths = _useEffectState4[1];
-  var _useEffectState5 = useEffectState(notifyEffectUpdate, 0),
-    _useEffectState6 = _slicedToArray(_useEffectState5, 2),
-    prevRestWidth = _useEffectState6[0],
-    setPrevRestWidth = _useEffectState6[1];
-  var _useEffectState7 = useEffectState(notifyEffectUpdate, 0),
-    _useEffectState8 = _slicedToArray(_useEffectState7, 2),
-    restWidth = _useEffectState8[0],
-    setRestWidth = _useEffectState8[1];
-  var _useEffectState9 = useEffectState(notifyEffectUpdate, 0),
-    _useEffectState10 = _slicedToArray(_useEffectState9, 2),
-    suffixWidth = _useEffectState10[0],
-    setSuffixWidth = _useEffectState10[1];
-  var _useState = react.useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    suffixFixedStart = _useState2[0],
-    setSuffixFixedStart = _useState2[1];
-  var _useState3 = react.useState(null),
-    _useState4 = _slicedToArray(_useState3, 2),
-    displayCount = _useState4[0],
-    setDisplayCount = _useState4[1];
-  var mergedDisplayCount = react.useMemo(function () {
-    if (displayCount === null && fullySSR) {
-      return Number.MAX_SAFE_INTEGER;
-    }
-    return displayCount || 0;
-  }, [displayCount, containerWidth]);
-  var _useState5 = react.useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    restReady = _useState6[0],
-    setRestReady = _useState6[1];
-  var itemPrefixCls = "".concat(prefixCls, "-item");
-  // Always use the max width to avoid blink
-  var mergedRestWidth = Math.max(prevRestWidth, restWidth);
-  // ================================= Data =================================
-  var isResponsive = maxCount === RESPONSIVE;
-  var shouldResponsive = data.length && isResponsive;
-  var invalidate = maxCount === INVALIDATE;
-  /**
-   * When is `responsive`, we will always render rest node to get the real width of it for calculation
-   */
-  var showRest = shouldResponsive || typeof maxCount === 'number' && data.length > maxCount;
-  var mergedData = react.useMemo(function () {
-    var items = data;
-    if (shouldResponsive) {
-      if (containerWidth === null && fullySSR) {
-        items = data;
-      } else {
-        items = data.slice(0, Math.min(data.length, mergedContainerWidth / itemWidth));
-      }
-    } else if (typeof maxCount === 'number') {
-      items = data.slice(0, maxCount);
-    }
-    return items;
-  }, [data, itemWidth, containerWidth, maxCount, shouldResponsive]);
-  var omittedItems = react.useMemo(function () {
-    if (shouldResponsive) {
-      return data.slice(mergedDisplayCount + 1);
-    }
-    return data.slice(mergedData.length);
-  }, [data, mergedData, shouldResponsive, mergedDisplayCount]);
-  // ================================= Item =================================
-  var getKey = react.useCallback(function (item, index) {
-    var _ref;
-    if (typeof itemKey === 'function') {
-      return itemKey(item);
-    }
-    return (_ref = itemKey && (item === null || item === void 0 ? void 0 : item[itemKey])) !== null && _ref !== void 0 ? _ref : index;
-  }, [itemKey]);
-  var mergedRenderItem = react.useCallback(renderItem || function (item) {
-    return item;
-  }, [renderItem]);
-  function updateDisplayCount(count, suffixFixedStartVal, notReady) {
-    // React 18 will sync render even when the value is same in some case.
-    // We take `mergedData` as deps which may cause dead loop if it's dynamic generate.
-    // ref: https://github.com/ant-design/ant-design/issues/36559
-    if (displayCount === count && (suffixFixedStartVal === undefined || suffixFixedStartVal === suffixFixedStart)) {
-      return;
-    }
-    setDisplayCount(count);
-    if (!notReady) {
-      setRestReady(count < data.length - 1);
-      onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(count);
-    }
-    if (suffixFixedStartVal !== undefined) {
-      setSuffixFixedStart(suffixFixedStartVal);
-    }
-  }
-  // ================================= Size =================================
-  function onOverflowResize(_, element) {
-    setContainerWidth(element.clientWidth);
-  }
-  function registerSize(key, width) {
-    setItemWidths(function (origin) {
-      var clone = new Map(origin);
-      if (width === null) {
-        clone.delete(key);
-      } else {
-        clone.set(key, width);
-      }
-      return clone;
-    });
-  }
-  function registerOverflowSize(_, width) {
-    setRestWidth(width);
-    setPrevRestWidth(restWidth);
-  }
-  function registerSuffixSize(_, width) {
-    setSuffixWidth(width);
-  }
-  // ================================ Effect ================================
-  function getItemWidth(index) {
-    return itemWidths.get(getKey(mergedData[index], index));
-  }
-  useLayoutEffect(function () {
-    if (mergedContainerWidth && typeof mergedRestWidth === 'number' && mergedData) {
-      var totalWidth = suffixWidth;
-      var len = mergedData.length;
-      var lastIndex = len - 1;
-      // When data count change to 0, reset this since not loop will reach
-      if (!len) {
-        updateDisplayCount(0, null);
-        return;
-      }
-      for (var i = 0; i < len; i += 1) {
-        var currentItemWidth = getItemWidth(i);
-        // Fully will always render
-        if (fullySSR) {
-          currentItemWidth = currentItemWidth || 0;
-        }
-        // Break since data not ready
-        if (currentItemWidth === undefined) {
-          updateDisplayCount(i - 1, undefined, true);
-          break;
-        }
-        // Find best match
-        totalWidth += currentItemWidth;
-        if (
-        // Only one means `totalWidth` is the final width
-        lastIndex === 0 && totalWidth <= mergedContainerWidth ||
-        // Last two width will be the final width
-        i === lastIndex - 1 && totalWidth + getItemWidth(lastIndex) <= mergedContainerWidth) {
-          // Additional check if match the end
-          updateDisplayCount(lastIndex, null);
-          break;
-        } else if (totalWidth + mergedRestWidth > mergedContainerWidth) {
-          // Can not hold all the content to show rest
-          updateDisplayCount(i - 1, totalWidth - currentItemWidth - suffixWidth + restWidth);
-          break;
-        }
-      }
-      if (suffix && getItemWidth(0) + suffixWidth > mergedContainerWidth) {
-        setSuffixFixedStart(null);
-      }
-    }
-  }, [mergedContainerWidth, itemWidths, restWidth, suffixWidth, getKey, mergedData]);
-  // ================================ Render ================================
-  var displayRest = restReady && !!omittedItems.length;
-  var suffixStyle = {};
-  if (suffixFixedStart !== null && shouldResponsive) {
-    suffixStyle = {
-      position: 'absolute',
-      left: suffixFixedStart,
-      top: 0
-    };
-  }
-  var itemSharedProps = {
-    prefixCls: itemPrefixCls,
-    responsive: shouldResponsive,
-    component: itemComponent,
-    invalidate: invalidate
-  };
-  // >>>>> Choice render fun by `renderRawItem`
-  var internalRenderItemNode = renderRawItem ? function (item, index) {
-    var key = getKey(item, index);
-    return /*#__PURE__*/react.createElement(OverflowContext.Provider, {
-      key: key,
-      value: _objectSpread2(_objectSpread2({}, itemSharedProps), {}, {
-        order: index,
-        item: item,
-        itemKey: key,
-        registerSize: registerSize,
-        display: index <= mergedDisplayCount
-      })
-    }, renderRawItem(item, index));
-  } : function (item, index) {
-    var key = getKey(item, index);
-    return /*#__PURE__*/react.createElement(Item, _extends({}, itemSharedProps, {
-      order: index,
-      key: key,
-      item: item,
-      renderItem: mergedRenderItem,
-      itemKey: key,
-      registerSize: registerSize,
-      display: index <= mergedDisplayCount
-    }));
-  };
-  // >>>>> Rest node
-  var restNode;
-  var restContextProps = {
-    order: displayRest ? mergedDisplayCount : Number.MAX_SAFE_INTEGER,
-    className: "".concat(itemPrefixCls, "-rest"),
-    registerSize: registerOverflowSize,
-    display: displayRest
-  };
-  if (!renderRawRest) {
-    var mergedRenderRest = renderRest || defaultRenderRest;
-    restNode = /*#__PURE__*/react.createElement(Item, _extends({}, itemSharedProps, restContextProps), typeof mergedRenderRest === 'function' ? mergedRenderRest(omittedItems) : mergedRenderRest);
-  } else if (renderRawRest) {
-    restNode = /*#__PURE__*/react.createElement(OverflowContext.Provider, {
-      value: _objectSpread2(_objectSpread2({}, itemSharedProps), restContextProps)
-    }, renderRawRest(omittedItems));
-  }
-  var overflowNode = /*#__PURE__*/react.createElement(Component, _extends({
-    className: classnames(!invalidate && prefixCls, className),
-    style: style,
-    ref: ref
-  }, restProps), mergedData.map(internalRenderItemNode), showRest ? restNode : null, suffix && /*#__PURE__*/react.createElement(Item, _extends({}, itemSharedProps, {
-    responsive: isResponsive,
-    responsiveDisabled: !shouldResponsive,
-    order: mergedDisplayCount,
-    className: "".concat(itemPrefixCls, "-suffix"),
-    registerSize: registerSuffixSize,
-    display: true,
-    style: suffixStyle
-  }), suffix));
-  if (isResponsive) {
-    overflowNode = /*#__PURE__*/react.createElement(RefResizeObserver, {
-      onResize: onOverflowResize,
-      disabled: !shouldResponsive
-    }, overflowNode);
-  }
-  return overflowNode;
-}
-var ForwardOverflow = /*#__PURE__*/react.forwardRef(Overflow);
-ForwardOverflow.displayName = 'Overflow';
-ForwardOverflow.Item = RawItem;
-ForwardOverflow.RESPONSIVE = RESPONSIVE;
-ForwardOverflow.INVALIDATE = INVALIDATE;
-
-const rcOverflowCss = "@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}.rc-overflow{display:flex;flex-direction:row;flex-wrap:nowrap;width:100%}.rc-overflow-item{transition:all 0.3s ease;padding:0 2px;display:flex;align-items:center;justify-content:center}";
-
-const BcmRcOverflow = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.selectOtherTag = createEvent(this, "bcm-select-other-tag", 7);
-    this.selectTag = createEvent(this, "bcm-select-tag", 7);
-    this.deleteTag = createEvent(this, "bcm-delete-tag", 7);
-    this.renderItem = item => {
-      return react.createElement("bcm-tooltip", {
-        placement: "bottom",
-        message: item.text,
-        trigger: "hover",
-      }, react.createElement("div", {
-        id: item.value + "-tag",
-        className: "bcm-tag",
-        onClick: ({ target }) => this.onClickControl(target, item, false),
-      }, react.createElement("span", { className: "bcm-tag__content dismissable" }, 
-      // .bcm-tag__content span {
-      //     display: block;
-      //     max-width: 38px;
-      //     white-space: nowrap;
-      //     overflow: hidden;
-      //     text-overflow: ellipsis;
-      react.createElement("div", { className: "value tw-block tw-max-w-[38px] tw-overflow-hidden tw-overflow-ellipsis tw-whitespace-nowrap" }, item.text), react.createElement("span", {
-        className: "right close-button",
-      }, react.createElement("bcm-icon", {
-        icon: "fa fa-times",
-      })))));
-    };
-    this.renderRest = items => {
-      const titles = (items === null || items === void 0 ? void 0 : items.sort((a, b) => +a.ct - +b.ct).slice(0, 15).map(item => StringHelper.textLimitter(item.text, 40, true)).toString().split(",").join("\r\n")) + (items.length > 15 ? "\r\n..." : "");
-      return react.createElement("bcm-tooltip", {
-        placement: "bottom",
-        message: titles,
-        trigger: "hover",
-      }, react.createElement("div", {
-        className: "bcm-tag bcm-tag--other",
-        onClick: ({ target }) => this.onClickControl(target, items, true),
-      }, react.createElement("span", { className: `bcm-tag__content dismissable ${this.checked ? "checkable checked" : ""}` }, react.createElement("span", { className: "value" }, `+${items === null || items === void 0 ? void 0 : items.length}`), react.createElement("span", { className: "right close-button" }, react.createElement("bcm-icon", {
-        icon: "fa fa-times",
-      })))));
-    };
-    this._id = Generate.UID();
-    this.maxCount = 1;
-    this.data = [];
-    this.checked = false;
-  }
-  isClickDismiss(e) {
-    return e["s-hn"] === "BCM-ICON";
-  }
-  onClickControl(e, item, isOtherTag = false) {
-    const isClickClose = this.isClickDismiss(e);
-    isClickClose && this.deleteTag.emit({ id: Array.isArray(item) ? item.map(i => i.value) : item.value }) && this.checked && (this.checked = false);
-    !isOtherTag && this.selectTag.emit({ id: item.value }) && this.checked && (this.checked = false);
-    if (isOtherTag && !isClickClose) {
-      this.checked = !this.checked;
-      this.selectOtherTag.emit({ id: item === null || item === void 0 ? void 0 : item.map(i => i.value), checked: this.checked });
-    }
-  }
-  componentWillRender() {
-    const { data, renderItem, renderRest, maxCount } = this;
-    this.overflowInstance = react.createElement(ForwardOverflow, {
-      data,
-      renderItem,
-      renderRest,
-      maxCount,
-    });
-    reactDom.render(this.overflowInstance, this.el);
-  }
-  get el() { return getElement(this); }
-};
-BcmRcOverflow.style = rcOverflowCss;
-
-const { state } = createStore({
-  value: new Map(),
-});
-const setValue = val => {
-  const { id, dataSource } = val;
-  const data = {
-    id: snq(() => id, Generate.UID),
-    dataSource: dataSource && dataSource.length > 0 && recursive(dataSource),
-    searchIsOnlyChilds: val.searchIsOnlyChilds,
-  };
-  state.value.set(data.id, data);
-};
-const recursive = (data, parentId) => {
-  let recData = [];
-  if (data) {
-    recData = data.map(item => (Object.assign(Object.assign(Object.assign({}, item), { parentId: snq(() => parentId, null) }), (item.items && item.items.length > 0 && { items: snq(() => recursive(item.items, item.id), []) }))));
-  }
-  return recData;
-};
-const removeValue = _id => {
-  state.value.delete(_id);
-};
-const getValue = id => snq(() => state.value.get(id), {});
-const getDataPagination = (id, limit = 3) => {
-  let data = [];
-  const value = getValue(id);
-  if (value) {
-    const { dataSource } = value;
-    data = dataSource.slice(0, limit);
-  }
-  return data;
-};
-// //search treeview data by text
-// const searchData = (id, search, items?) => {
-//     let dataSource
-//     if (items && items.length > 0) {
-//         dataSource = items
-//     } else {
-//         const value = getValue(id);
-//         dataSource = value.dataSource;
-//     }
-//     let result = []
-//     if (dataSource) {
-//         dataSource.forEach(child => {
-//             if (child.text.toLowerCase().includes(search.toLowerCase())) {
-//                 result.push(child)
-//             }
-//             result = result.concat(searchData(id, search, child.items))
-//         })
-//     };
-//     return result
-// };
-//nested search
-const searchData = (id, searchText, items) => {
-  let dataSource;
-  if (items && items.length > 0) {
-    dataSource = items;
-  }
-  else {
-    const value = getValue(id);
-    dataSource = value.dataSource;
-  }
-  let results = [];
-  if (dataSource) {
-    results.push(nestedSearch(id, dataSource, searchText));
-    //return with their parents
-    // dataSource.forEach(child => {
-    //     if (child.text.toLowerCase().includes(searchText.toLowerCase())) {
-    //         results.push(child)
-    //     } else if (child.items && child.items.length > 0) {
-    //         child.items = nestedSearch(child.items, searchText)
-    //         if (child.items.length > 0) {
-    //             results.push(child)
-    //         }
-    //     }
-    // })
-  }
-  return {
-    result: snq(() => Generate.flatArray(results[0].result), []),
-    matching: snq(() => results[0].matching, []),
-    parentIndex: snq(() => results[0].parentIndex, []),
-    nestedResult: snq(() => results[0].nestedResult, []),
-  };
-};
-const nestedSearch = (id, items, searchText) => {
-  let matching = [];
-  let parentIndex = [];
-  let result = [];
-  let nestedResult = [];
-  const { searchIsOnlyChilds } = getValue(id);
-  if (items && items.length > 0) {
-    items.forEach(child => {
-      let isChild = searchIsOnlyChilds && child.parentId !== null;
-      let isMatching = (child.text && StringHelper.slugify(child.text).includes(StringHelper.slugify(searchText))) ||
-        (child.keywords && StringHelper.slugify(child.keywords).includes(StringHelper.slugify(searchText)));
-      if (isMatching && (!searchIsOnlyChilds || (searchIsOnlyChilds && isChild))) {
-        result.push(child.id);
-        matching.push(child.id);
-        parentIndex.push(child.id);
-        nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId });
-        if (child.items && child.items.length > 0) {
-          const found = nestedSearch(id, child.items, searchText);
-          if (found.matching.length > 0) {
-            found.matching.forEach(chi => {
-              matching.push(chi);
-            });
-          }
-        }
-      }
-      else if (child.items && child.items.length > 0) {
-        const found = nestedSearch(id, child.items, searchText);
-        if (found.result.length > 0) {
-          found.result.forEach(chi => {
-            result.push(chi);
-          });
-          result.push(child.id);
-          parentIndex.push(child.id);
-          nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId, items: found.nestedResult });
-        }
-        if (found.matching.length > 0) {
-          matching.push(...found.matching);
-        }
-      }
-    });
-  }
-  return { result, matching, parentIndex, nestedResult };
-};
-const searchState = {
-  setValue,
-  removeValue,
-  getValue,
-  getDataPagination,
-  searchData,
-};
-
-const searchCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .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}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}*{box-sizing:border-box}.bcm-input{display:inline-flex;flex-direction:column;width:100%;max-width:256px;margin-bottom:8px}.bcm-input.full-width{max-width:100%}.bcm-input.hidden{display:none}.bcm-input__container{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:flex;align-items:stretch;flex-direction:row;background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;cursor:text;padding:0 0 0 4px;position:relative;width:100%}.bcm-input__container.disabled{background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-input__container.disabled .bcm-input-element{color:var(--bcm-new-ds-color-slate-500)}.bcm-input__container.readonly{background-color:var(--bcm-new-ds-color-slate-50);cursor:default}.bcm-input__container.readonly .bcm-input-element{color:var(--bcm-new-ds-color-slate-600)}.bcm-input__container:not(.disabled):hover .caret-container,.bcm-input__container:not(.disabled).focused .caret-container{opacity:1}.bcm-input__container:not(.disabled):hover .input-clear-button,.bcm-input__container:not(.disabled).focused .input-clear-button{opacity:1}.bcm-input__container:not(.disabled).focused{background-color:var(--bcm-new-ds-color-slate-50)}.bcm-input__container:not(.disabled):hover{border-color:var(--bcm-color-prime-blue-6)}.bcm-input__container.empty .input-clear-button{display:none}.bcm-input__container.invalid,.bcm-input__container.error{border-color:var(--bcm-new-ds-color-red-500)}.bcm-input__container .bcm-input-element{width:100%;color:var(--bcm-new-ds-color-slate-600);flex:1;border:none;background:transparent;box-shadow:unset;padding:0 4px;font-family:\"Inter\", sans-serif;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;text-overflow:ellipsis}.bcm-input__container .bcm-input-element::placeholder{font-family:\"Inter\", sans-serif;color:var(--bcm-new-ds-color-slate-300);user-select:none}.bcm-input__container .bcm-input-element::-webkit-search-decoration,.bcm-input__container .bcm-input-element::-webkit-search-cancel-button,.bcm-input__container .bcm-input-element::-webkit-search-results-button,.bcm-input__container .bcm-input-element::-webkit-search-results-decoration,.bcm-input__container .bcm-input-element::-webkit-calendar-picker-indicator,.bcm-input__container .bcm-input-element::-webkit-inner-spin-button,.bcm-input__container .bcm-input-element::-webkit-outer-spin-button{-webkit-appearance:none}.bcm-input__container .caret-container{width:30px;display:flex;flex-direction:column;justify-content:center;align-items:stretch;border-left:1px solid #D9D9D9;transition:0.2s opacity;user-select:none;box-sizing:border-box}.bcm-input__container .caret-container .bcm-input-caret{display:flex;align-items:center;justify-content:center;color:var(--bcm-color-grey-7);cursor:pointer;flex:1}.bcm-input__container .caret-container .bcm-input-caret bcm-icon{line-height:1}.bcm-input__container .caret-container .bcm-input-caret:hover{color:var(--bcm-color-prime-blue-6)}.bcm-input__container .caret-container .bcm-input-caret:active{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container .bcm-input-caret:last-child{border-top:1px solid #D9D9D9}.bcm-input__container .caret-container.disabled{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container.disabled .bcm-input-caret{cursor:not-allowed}.bcm-input__container .input-suffix-content{display:flex;align-items:center;justify-content:center}.bcm-input__container .input-prefix:not(:empty){padding-left:4px}.bcm-input__container .input-suffix:not(:empty){min-width:24px;padding-right:4px}.bcm-input__container .input-prefix:not(:empty),.bcm-input__container .input-suffix:not(:empty){display:flex;align-items:center;justify-content:center;cursor:default;color:#64748a}.bcm-input__container .input-prefix:not(:empty) .unit-prefix,.bcm-input__container .input-suffix:not(:empty) .unit-prefix{color:#64748a}.bcm-input__container .input-prefix-button:not(:empty),.bcm-input__container .input-suffix-button:not(:empty){cursor:pointer}.bcm-input__container .caret-container,.bcm-input__container .input-clear-button{opacity:0}.bcm-input__container--small{font-size:12px}.bcm-input__container--medium{font-size:14px}.bcm-input__container--large{font-size:16px}.bcm-input__textarea.clearable .bcm-input-element{padding-right:24px}.bcm-input__textarea .input-clear-button{position:absolute;top:4px;right:0}";
-
-const BcmSearch = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.bcmOnSearch = createEvent(this, "bcm-on-search", 7);
-    this.bcmOnSearchClear = createEvent(this, "bcm-on-search-clear", 7);
-    this.debounceHandler = Generate.debounceInput((event) => this.onSearchValue(event, this), 300, false, () => {
-      var _a, _b;
-      this.isActiveClearable = ((_b = (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.length) > 0 && this.clearable;
-    });
-    this._id = Generate.UID();
-    this.placeholder = "Search";
-    this.disabled = false;
-    this.readonly = false;
-    this.clearable = true;
-    this.size = Bcm.Size.medium;
-    this.limit = 10;
-    this.searchIsOnlyChilds = false;
-    this.minSearchLength = 2;
-    this.data = [];
-    this.tick = {};
-    this.isActiveClearable = false;
-  }
-  async componentDidLoad() {
-    await this.initState();
-  }
-  async dataChanged(newValue, oldValue) {
-    // console.log('data changed', newValue, oldValue)
-    if (newValue !== oldValue) {
-      await this.initState();
-    }
-  }
-  async initState() {
-    await searchState.setValue({
-      id: this._id + "-input",
-      dataSource: this.data,
-      searchIsOnlyChilds: this.searchIsOnlyChilds,
-    });
-    await this.markForCheck();
-  }
-  markForCheck() {
-    this.tick = Generate.UID();
-  }
-  handleInput() {
-    // console.log("aheyya")
-  }
-  async onBcmFocus() {
-    this.inputElement.focus();
-  }
-  async onBcmBlur() {
-    this.inputElement.blur();
-  }
-  async onBcmSelect() {
-    this.inputElement.select();
-  }
-  async setValue(newValue) {
-    this.inputElement.value = newValue;
-  }
-  handleFocus() { }
-  handleBlur() { }
-  handleChange() { }
-  async handleClear(eventEmit = true) {
-    this.inputElement.value = '';
-    const { value, id } = this.inputElement;
-    searchState.searchData(id, value);
-    this.isActiveClearable = false;
-    this.bcmOnSearch.emit({ result: null, value: null, matching: null, parentIndex: null });
-    this.bcmOnSearchClear.emit(eventEmit);
-    await delay(10);
-    return Promise.resolve();
-  }
-  onSearchValue(event, instance) {
-    const { value, id } = event.target;
-    const searchResult = (value === null || value === void 0 ? void 0 : value.length) >= this.minSearchLength ? searchState.searchData(id, value, null) : null;
-    const { bcmOnSearch, inputElement } = instance;
-    bcmOnSearch.emit({ result: searchResult === null || searchResult === void 0 ? void 0 : searchResult.result, value: inputElement === null || inputElement === void 0 ? void 0 : inputElement.value, matching: searchResult === null || searchResult === void 0 ? void 0 : searchResult.matching, parentIndex: searchResult === null || searchResult === void 0 ? void 0 : searchResult.parentIndex, nestedResult: searchResult === null || searchResult === void 0 ? void 0 : searchResult.nestedResult });
-  }
-  render() {
-    const { _id, placeholder, disabled, readonly } = this;
-    return h(Host, { onClick: () => { this.onBcmFocus(); this.onBcmSelect(); } }, h(InputTemplate, { size: this.size, id: _id, type: "search", placeholder: placeholder, disabled: disabled, "full-width": true, readonly: readonly, clearable: this.isActiveClearable, handleFocus: () => this.handleFocus(), handleBlur: () => this.handleBlur(), handleChange: () => this.handleChange(), handleClear: () => this.handleClear(), handleInput: this.debounceHandler, ref: (el) => this.inputElement = el }));
-  }
-  get el() { return getElement(this); }
-  static get watchers() { return {
-    "data": ["dataChanged"]
-  }; }
-};
-BcmSearch.style = searchCss;
-
-export { BcmList as bcm_list, BcmRcOverflow as bcm_rc_overflow, BcmSearch as bcm_search };