bromcom-ui 2.3.66 → 2.3.70

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

@@ -0,0 +1,219 @@
+import { r as registerInstance, e as createEvent, h, f as Host, g as getElement } from './index-dbc63c66.js';
+import { G as Generate } from './generate-8e440fc4.js';
+import './_commonjsHelpers-2088bffa.js';
+import './index-55174f2a.js';
+import { c as createStore } from './index-dd5c1283.js';
+import { s as snq } from './snq.es5-946822b8.js';
+import './bcm-ad02f9c9.js';
+import { S as StringHelper } from './string-helper-35840f91.js';
+import { J as JsonParse } from './json-parse-decarator-223ea680.js';
+import { I as InputTemplate } from './input-template-487d3243.js';
+
+const { state } = createStore({
+  value: new Map(),
+});
+const setValue = (val) => {
+  const { id, dataSource } = val;
+  const data = {
+    id: snq(() => id, Generate.UID),
+    dataSource: recursive(dataSource)
+  };
+  state.value.set(data.id, data);
+};
+const recursive = (data, parentId) => {
+  const recData = data.map((item) => (Object.assign(Object.assign(Object.assign({}, item), { parentId: parentId || null }), (item.items && { 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(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: Generate.flatArray(results[0].result), matching: results[0].matching, parentIndex: results[0].parentIndex };
+};
+const nestedSearch = (items, searchText) => {
+  let matching = [];
+  let parentIndex = [];
+  let result = [];
+  if (items && items.length > 0) {
+    items.forEach(child => {
+      if (StringHelper.slugify(child.text).indexOf(StringHelper.slugify(searchText)) > -1) {
+        result.push(child.id);
+        matching.push(child.id);
+        parentIndex.push(child.id);
+        // if (child.items && child.items.length > 0) {
+        //     child.items.forEach(chi => {
+        //         result.push(chi.id)
+        //     })
+        // }
+      }
+      else if (child.items && child.items.length > 0) {
+        const found = nestedSearch(child.items, searchText);
+        if (found.result.length > 0) {
+          // found.result.forEach(chi => {
+          // })
+          result.push({ id: child.id, items: found.result });
+          // result.push(child.id)
+          parentIndex.push(child.id);
+        }
+        if (found.matching.length > 0) {
+          matching.push(child.id);
+        }
+      }
+    });
+  }
+  ;
+  return { result, matching, parentIndex };
+};
+const searchState = {
+  setValue,
+  removeValue,
+  getValue,
+  getDataPagination,
+  searchData
+};
+
+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 BcmSearch2 = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.bcmOnSearch = createEvent(this, "bcm-on-search", 7);
+    this._id = Generate.UID();
+    this.placeholder = "Search";
+    this.disabled = false;
+    this.readonly = false;
+    this.clearable = true;
+    this.limit = 10;
+    this.data = [];
+    this.tick = {};
+    this.isActiveClearable = false;
+    this.debounceHandler = Generate.debounceInput((event) => this.onSearchValue(event, this), 500, 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;
+    });
+  }
+  async componentDidLoad() {
+    await this.initState();
+  }
+  async dataChanged(newValue, oldValue) {
+    // console.log('data changed', newValue, oldValue)
+    if (newValue !== oldValue) {
+      console.log('data changed', newValue, oldValue);
+      await this.initState();
+    }
+  }
+  async initState() {
+    await searchState.setValue({
+      id: this._id,
+      dataSource: this.data,
+    });
+    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();
+  }
+  handleFocus() { }
+  handleBlur() { }
+  handleChange() { }
+  async handleClear() {
+    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 });
+    return Promise.resolve();
+  }
+  onSearchValue(event, instance) {
+    const { value, id } = event.target;
+    const searchResult = value.length >= 2 ? searchState.searchData(id, value) : 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 });
+  }
+  render() {
+    const { _id, placeholder, disabled, readonly } = this;
+    return h(Host, null, h(InputTemplate, { size: "medium", id: _id, type: "text", placeholder: placeholder, disabled: disabled, 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"]
+  }; }
+};
+__decorate([
+  JsonParse('data')
+], BcmSearch2.prototype, "data", void 0);
+
+export { BcmSearch2 as bcm_search_2 };