bromcom-ui 2.4.18 → 2.4.19

package/dist/collection/components/organism/list/list.js

@@ -122,22 +122,20 @@ export class BcmList {
   watchId(newVal, oldVal) {
     console.info('Changed component id:', oldVal + ' -> ' + newVal);
     listState.removeState(oldVal);
-    this.initState(false);
+    this.initState();
   }
   handleValueChange(newVal, oldVal) {
-    var _a;
-    if (this.isSentNotification) {
+    if (this.checkboxes) {
       if (!Validators.compareTwoArrayIsSame(newVal, oldVal)) {
-        if (this.checkboxes) {
-          this.bcmChecklist.emit(this.value);
-          this.change.emit(this.value);
-        }
-        else {
-          this.change.emit(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.value[0] : this.value);
-        }
+        this.bcmChecklist.emit(this.value);
+        this.change.emit(this.value);
+      }
+    }
+    else {
+      if ((newVal === null || newVal === void 0 ? void 0 : newVal.text) != (oldVal === null || oldVal === void 0 ? void 0 : oldVal.text)) {
+        this.change.emit(this.value);
       }
     }
-    this.isSentNotification = true;
   }
   watchReturnFilterData(newVal) {
     var _a;
@@ -208,7 +206,7 @@ export class BcmList {
             autocompleteInput.setValue('');
           }
           else {
-            autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.value[0].text : '');
+            autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || '');
           }
         }
       }
@@ -451,7 +449,7 @@ export class BcmList {
     await delay(1000);
     this.markForCheck();
   }
-  async initState(sendChange = true) {
+  async initState() {
     var _a;
     await listState.setValue({
       id: this._id,
@@ -461,16 +459,13 @@ export class BcmList {
     const { totalRoots, totalItems } = listState.getValue(this._id);
     this.totalData = totalItems;
     this.totalRootData = totalRoots;
-    if (!sendChange) {
-      this.isSentNotification = false;
-    }
-    this.value = this.checkboxes ? (await this.getCheckedList()).checkedList : listState.selectedItem(this._id);
+    this.value = this.checkboxes ? (await this.getCheckedList()).checkedList : listState.selectedItem(this._id) ? listState.selectedItem(this._id)[0] : null;
     // value && value.length > 0 && (this.value = value)
     if (this.checkboxes) {
       this.tagControl();
     }
     else {
-      this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.value[0].text : '';
+      this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
     }
     await this.markForCheck();
   }
@@ -510,19 +505,19 @@ export class BcmList {
     }
   }
   async selectedItem(itemId) {
-    var _a, _b;
+    var _a;
     this.value = listState.selectedItem(this._id, itemId)[0];
-    this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || '';
+    this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
     this.isOpen = false;
     this.markForCheck();
-    if (this.type == 'autocomplete' && ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) > 0) {
+    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.length) > 0 ? this.value[0].text : '');
+          autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || '');
           this.isOpen = false;
         }, 100);
       }
@@ -611,7 +606,7 @@ export class BcmList {
         var tags = [];
         var i = 0;
         let itemsWidth = 0;
-        if (this.value[0] != undefined && ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+        if (this.value != null && ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) > 0) {
           var BreakException = {};
           try {
             for (const item of this.value) {
@@ -647,57 +642,59 @@ export class BcmList {
             tagContainerArea.appendChild(tag);
           });
         }
-        const otherTag = this.value.slice(i);
-        if (otherTag.length > 0) {
-          var otherText, otherElement, BreakException = {};
-          try {
-            const removeItems = async () => {
-              var visibleItems = tagContainer.querySelectorAll('bcm-tag');
-              tagContainerWidth = this.type == 'autocomplete' ? tagContainer.clientWidth > 300 ? tagContainer.clientWidth - 150 : tagContainer.clientWidth - 100 : tagContainer.clientWidth;
-              visibleItems = Generate.reverseNodeList(visibleItems);
-              if (visibleItems.length > 0) {
-                for (const item of visibleItems) {
-                  otherTag.push(item.itemObject);
-                  otherText = `${otherTag.length} ${pluralize('item', otherTag.length)} selected`;
-                  otherElement = await this.createTag({ id: 'other-tag', text: otherText });
-                  if (otherElement.offsetWidth > (tagContainerWidth - itemsWidth)) {
-                    itemsWidth -= item.offsetWidth + 4;
-                    item.remove();
-                    await removeItems();
-                  }
-                  else {
-                    otherTag.pop();
+        if (this.value && this.value.length > 0) {
+          const otherTag = this.value.slice(i);
+          if (otherTag.length > 0) {
+            var otherText, otherElement, BreakException = {};
+            try {
+              const removeItems = async () => {
+                var visibleItems = tagContainer.querySelectorAll('bcm-tag');
+                tagContainerWidth = this.type == 'autocomplete' ? tagContainer.clientWidth > 300 ? tagContainer.clientWidth - 150 : tagContainer.clientWidth - 100 : tagContainer.clientWidth;
+                visibleItems = Generate.reverseNodeList(visibleItems);
+                if (visibleItems.length > 0) {
+                  for (const item of visibleItems) {
+                    otherTag.push(item.itemObject);
                     otherText = `${otherTag.length} ${pluralize('item', otherTag.length)} selected`;
-                    otherElement = await this.createTag({ id: 'other-tag', text: otherText, itemObject: otherTag });
-                    throw BreakException;
+                    otherElement = await this.createTag({ id: 'other-tag', text: otherText });
+                    if (otherElement.offsetWidth > (tagContainerWidth - itemsWidth)) {
+                      itemsWidth -= item.offsetWidth + 4;
+                      item.remove();
+                      await removeItems();
+                    }
+                    else {
+                      otherTag.pop();
+                      otherText = `${otherTag.length} ${pluralize('item', otherTag.length)} selected`;
+                      otherElement = await this.createTag({ id: 'other-tag', text: otherText, itemObject: otherTag });
+                      throw BreakException;
+                    }
                   }
                 }
-              }
-            };
-            await removeItems();
-          }
-          catch (e) {
-            if (e !== BreakException)
-              throw e;
-          }
-          otherElement.title = otherTag.slice(0, 10).map(item => StringHelper.textLimitter(item.text, 15)).toString().split(',').join("\r\n") + '\r\n...';
-          tagContainerArea.appendChild(otherElement);
-          this.isHaveOtherTag = true;
-          if (this.isSelectedOther) { // other seçiliyken other içindeki bir checked durumu değiştiğinde seçili classlarının kalması için
-            this.handleOtherSelected(true);
-          }
-        }
-        else {
-          if (this.isHaveOtherTag) {
-            this.unSelectOther();
-            this.isHaveOtherTag = false;
+              };
+              await removeItems();
+            }
+            catch (e) {
+              if (e !== BreakException)
+                throw e;
+            }
+            otherElement.title = otherTag.slice(0, 10).map(item => StringHelper.textLimitter(item.text, 15)).toString().split(',').join("\r\n") + '\r\n...';
+            tagContainerArea.appendChild(otherElement);
+            this.isHaveOtherTag = true;
+            if (this.isSelectedOther) { // other seçiliyken other içindeki bir checked durumu değiştiğinde seçili classlarının kalması için
+              this.handleOtherSelected(true);
+            }
           }
-          var element = document.getElementById(`bcm-list-input-tag-${this._id}-other-tag`);
-          if (element) {
-            element.remove();
+          else {
+            if (this.isHaveOtherTag) {
+              this.unSelectOther();
+              this.isHaveOtherTag = false;
+            }
+            var element = document.getElementById(`bcm-list-input-tag-${this._id}-other-tag`);
+            if (element) {
+              element.remove();
+            }
           }
         }
-        if (((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) === 0) {
+        if (!this.value || ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) == 0) {
           tagContainerArea.querySelectorAll('bcm-tag').forEach(element => {
             element.remove();
           });
@@ -706,7 +703,7 @@ export class BcmList {
     }
   }
   render() {
-    var _a, _b;
+    var _a;
     const { checkboxes, treeview, label, size, disabled, readonly, required, hidden, fullWidth, searchable } = this.getOptions();
     const hostClasses = cs('bcm-list', `bcm-list__size-${size}`, size === 'large' ? 'size-3' : 'size-2', {
       'error': this.captionType == Bcm.Status.error,
@@ -729,9 +726,9 @@ export class BcmList {
       this.type == 'select' && (h("div", { id: `bcm-list-input-${this._id}`, class: bcmListInput },
         h("span", { class: "bcm-list__input-container" },
           this.checkboxes && (h("span", { id: `bcm-list-input-tag-container-${this._id}`, class: "bcm-list__input-tag-container" })),
-          (!this.checkboxes || ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) == 0) && (this.inputText || h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))),
+          (!this.checkboxes || ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) == 0 || !this.value) && (this.inputText || h("span", { class: "bcm-list__input-placeholder" }, this.placeholder))),
         h("span", { class: "bcm-list__input-buttons" },
-          this.clearable && ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) > 0 && h("i", { class: "bcm-fal bcm-fa-times", onClick: (e) => this.setClear(e) }),
+          this.clearable && this.value && h("i", { class: "bcm-fal bcm-fa-times", onClick: (e) => this.setClear(e) }),
           h("i", { class: `bcm-fas bcm-fa-caret-${this.isOpen ? 'up' : 'down'}` })))),
       this.type === 'autocomplete' && (h("div", { id: `bcm-list-input-${this._id}`, class: cs(bcmListInput, { 'bcm-list__input-autocomplete': this.type == 'autocomplete' }) },
         h("span", { class: "bcm-list__input-container", id: `bcm-list-input-tag-container-${this._id}` },