sf-i-events 1.0.711 → 1.0.713

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sf-i-events",
   "private": false,
-  "version": "1.0.711",
+  "version": "1.0.713",
   "description": "Superflows Navigation Component",
   "main": "sf-i-events.js",
   "module": "sf-i-events.js",

package/sf-i-events.d.ts

@@ -266,6 +266,7 @@ export declare class SfIEvents extends LitElement {
     sdate: string;
     edate: string;
     changedOnboardingItemIds: string[];
+    selectallblock: string;
     static styles: import("lit").CSSResult;
     _SfIEventsC: any;
     _SfRowError: any;
@@ -465,6 +466,8 @@ export declare class SfIEvents extends LitElement {
     renderStreamEvents: (index: number, month: number, year: number, showGraph?: boolean) => string;
     renderThisEvents: (index: number, startDate: Date, showGraph?: boolean) => string;
     renderRangeEvents: (firstDate: Date, count: number, eventsContainer: HTMLDivElement) => void;
+    renderSelectAllButtons: () => string;
+    attachSelectAllListeners: (eventsContainer: HTMLDivElement, buttonSelect: NodeListOf<HTMLButtonElement>) => HTMLButtonElement[];
     renderRegisterEvents: (events: any) => void;
     checkStartDateEarliness: (value: string) => boolean;
     checkEndDateLateness: (value: string) => boolean;

package/sf-i-events.js

@@ -1204,6 +1204,7 @@ let SfIEvents = class SfIEvents extends LitElement {
         this.sdate = "";
         this.edate = "";
         this.changedOnboardingItemIds = [];
+        this.selectallblock = "100";
         this.isSelectedLegend = (value) => {
             return this.chartSelectedLegend.includes(value);
         };
@@ -2739,6 +2740,9 @@ let SfIEvents = class SfIEvents extends LitElement {
             //console.log('rangeperiod', period)
             var html = this.renderEvents(firstDay, endDay, 1, lastDay, true, 0, (firstDate.getMonth()), period, firstDate, "From " + firstDay.toLocaleDateString('en-IN') + " To " + endDay.toLocaleDateString('en-IN'));
             eventsContainer.querySelector('.calendar-right-data').innerHTML = html;
+            let innerhtml = eventsContainer.innerHTML;
+            innerhtml += this.renderSelectAllButtons();
+            eventsContainer.innerHTML = innerhtml;
             this.renderButtonRefresh(eventsContainer);
             this.attachTimelineFilterHandlers(eventsContainer);
             const radioExpander = eventsContainer.querySelector('#graph-radios-expander');
@@ -2780,6 +2784,9 @@ let SfIEvents = class SfIEvents extends LitElement {
             }
             const streamEventsContainer = eventsContainer.querySelectorAll('.stream-events-container');
             const buttonSelect = eventsContainer.querySelectorAll('.button-select');
+            let selectAllArr = this.attachSelectAllListeners(eventsContainer, buttonSelect);
+            const buttonSelectAll = selectAllArr[0];
+            const buttonUnselectAll = selectAllArr[1];
             for (i = 0; i < buttonSelect.length; i++) {
                 buttonSelect[i].addEventListener('click', (ev) => {
                     //console.log('eventscontainer', streamEventsContainer.length, buttonSelect.length);
@@ -2800,6 +2807,8 @@ let SfIEvents = class SfIEvents extends LitElement {
                             buttonSelect[k].style.display = 'block';
                             streamEventsContainer[k].style.display = 'block';
                         }
+                        buttonSelectAll.style.display = 'none';
+                        buttonUnselectAll.style.display = 'none';
                     }
                     else {
                         if (this.selectedItemIds.length === 1) {
@@ -2808,18 +2817,28 @@ let SfIEvents = class SfIEvents extends LitElement {
                             const status = idArr1[13].replace(/_/g, '-');
                             this.selectedStatus = status;
                         }
+                        let totalVisibleCount = 0;
                         for (var k = 0; k < buttonSelect.length; k++) {
                             const id1 = buttonSelect[k].id;
                             const idArr1 = id1.split("-");
                             const docs1 = idArr1[6];
                             const status = idArr1[13].replace(/_/g, '-');
                             if (docs == docs1 && status == this.selectedStatus) {
+                                totalVisibleCount++;
                             }
                             else {
                                 buttonSelect[k].style.display = 'none';
                                 streamEventsContainer[k].style.display = 'none';
                             }
                         }
+                        if (this.selectedItemIds.length >= parseInt(this.selectallblock) || this.selectedItemIds.length >= totalVisibleCount) {
+                            buttonSelectAll.style.display = 'none';
+                            buttonUnselectAll.style.display = 'flex';
+                        }
+                        else {
+                            buttonSelectAll.style.display = 'flex';
+                            buttonUnselectAll.style.display = 'none';
+                        }
                     }
                     // (this._SfDetailContainer as HTMLDivElement).style.display = 'block'
                     // this.renderEventDetail(this.events[mmdd][j], mmdd + "/" + ((new Date()).getFullYear() + ""));
@@ -3240,6 +3259,42 @@ let SfIEvents = class SfIEvents extends LitElement {
             // this.htmlDataStats = '<table class="w-100"><tr><th class="w-14">Total</th><th class="w-14">Not Started</th><th class="w-14">Approved</th><th class="w-14">In Progress</th><th class="w-14">Past Due Date</th><th class="w-14">Late Executed</th><th class="w-14">Late Approved</th><tr>';
             // this.htmlDataStats += '<tr><td class="w-14 text-center td-odd">'+total+'</td><td class="w-14 text-center td-odd">'+notStarted+'</td><td class="w-14 text-center td-odd">'+approved+'</td><td class="w-14 text-center td-odd">'+inProgress+'</td><td class="w-14 text-center td-odd">'+pastDueDate+'</td><td class="w-14 text-center td-odd">'+lateExecuted+'</td><td class="w-14 text-center td-odd">'+lateApproved+'</td><tr></table>';
         };
+        this.renderSelectAllButtons = () => {
+            let selectAllHtml = '<div class="d-flex justify-end w-100" style="position: fixed; bottom: 70px; left: 0px;" part="button-select-all-container">';
+            selectAllHtml += '<button part="button-select-all" id="button-select-all" class="d-flex align-center mt-10 mr-10 ml-10"><span class="material-symbols-outlined">select_all</span>&nbsp;<h4>Select All</h4><span>&nbsp;(Max ' + this.selectallblock + ')</span></button>';
+            selectAllHtml += '<button part="button-unselect-all" id="button-unselect-all" class="d-flex align-center mt-10 mr-10 ml-10"><span class="material-symbols-outlined">remove_selection</span>&nbsp;<h4>Unselect</h4></button>';
+            selectAllHtml += '</div>';
+            return selectAllHtml;
+        };
+        this.attachSelectAllListeners = (eventsContainer, buttonSelect) => {
+            const buttonSelectAll = eventsContainer.querySelector('#button-select-all');
+            const buttonUnselectAll = eventsContainer.querySelector('#button-unselect-all');
+            if (this.selectedItemIds.length == 0) {
+                buttonSelectAll.style.display = 'none';
+                buttonUnselectAll.style.display = 'none';
+            }
+            buttonSelectAll === null || buttonSelectAll === void 0 ? void 0 : buttonSelectAll.addEventListener('click', () => {
+                let count = this.selectedItemIds.length;
+                for (let checkSelect of buttonSelect) {
+                    console.log('select count', count, parseInt(this.selectallblock));
+                    if (count < parseInt(this.selectallblock) && checkSelect.style.display != 'none' && !checkSelect.checked) {
+                        checkSelect.click();
+                        count++;
+                    }
+                    if (count >= parseInt(this.selectallblock)) {
+                        break;
+                    }
+                }
+            });
+            buttonUnselectAll === null || buttonUnselectAll === void 0 ? void 0 : buttonUnselectAll.addEventListener('click', () => {
+                for (let checkSelect of buttonSelect) {
+                    if (checkSelect.checked) {
+                        checkSelect.click();
+                    }
+                }
+            });
+            return [buttonSelectAll, buttonUnselectAll];
+        };
         this.renderRegisterEvents = (events) => {
             var html = '';
             this.csvDataRegisters = '';
@@ -5191,6 +5246,7 @@ let SfIEvents = class SfIEvents extends LitElement {
             html += this.renderThisEvents(index, startDate, showGraph);
             startDate.setDate(startDate.getDate() + 1);
             html += '</div>';
+            html += this.renderSelectAllButtons();
             html += '</div>';
             this._SfThisContainer.innerHTML = html;
             this.renderButtonRefresh(this._SfThisContainer);
@@ -5336,6 +5392,9 @@ let SfIEvents = class SfIEvents extends LitElement {
             }
             const streamEventsContainer = this._SfThisContainer.querySelectorAll('.stream-events-container');
             const buttonSelect = this._SfThisContainer.querySelectorAll('.button-select');
+            let selectAllArr = this.attachSelectAllListeners(this._SfThisContainer, buttonSelect);
+            const buttonSelectAll = selectAllArr[0];
+            const buttonUnselectAll = selectAllArr[1];
             for (i = 0; i < buttonSelect.length; i++) {
                 buttonSelect[i].addEventListener('click', (ev) => {
                     //console.log('eventscontainer', streamEventsContainer.length, buttonSelect.length);
@@ -5356,6 +5415,8 @@ let SfIEvents = class SfIEvents extends LitElement {
                             buttonSelect[k].style.display = 'block';
                             streamEventsContainer[k].style.display = 'block';
                         }
+                        buttonSelectAll.style.display = 'none';
+                        buttonUnselectAll.style.display = 'none';
                     }
                     else {
                         if (this.selectedItemIds.length === 1) {
@@ -5364,18 +5425,28 @@ let SfIEvents = class SfIEvents extends LitElement {
                             const status = idArr1[13].replace(/_/g, '-');
                             this.selectedStatus = status;
                         }
+                        let totalVisibleCount = 0;
                         for (var k = 0; k < buttonSelect.length; k++) {
                             const id1 = buttonSelect[k].id;
                             const idArr1 = id1.split("-");
                             const docs1 = idArr1[6];
                             const status = idArr1[13].replace(/_/g, '-');
                             if (docs == docs1 && status == this.selectedStatus) {
+                                totalVisibleCount++;
                             }
                             else {
                                 buttonSelect[k].style.display = 'none';
                                 streamEventsContainer[k].style.display = 'none';
                             }
                         }
+                        if (this.selectedItemIds.length >= parseInt(this.selectallblock) || this.selectedItemIds.length >= totalVisibleCount) {
+                            buttonSelectAll.style.display = 'none';
+                            buttonUnselectAll.style.display = 'flex';
+                        }
+                        else {
+                            buttonSelectAll.style.display = 'flex';
+                            buttonUnselectAll.style.display = 'none';
+                        }
                     }
                     // (this._SfDetailContainer as HTMLDivElement).style.display = 'block'
                     // this.renderEventDetail(this.events[mmdd][j], mmdd + "/" + ((new Date()).getFullYear() + ""));
@@ -5489,6 +5560,7 @@ let SfIEvents = class SfIEvents extends LitElement {
                 startDate.setMonth(startDate.getMonth() + 1);
             }
             html += '</div>';
+            html += this.renderSelectAllButtons();
             html += '</div>';
             this._SfStreamContainer.innerHTML = html;
             this.renderButtonRefresh(this._SfStreamContainer);
@@ -5642,6 +5714,9 @@ let SfIEvents = class SfIEvents extends LitElement {
             }
             const streamEventsContainer = this._SfStreamContainer.querySelectorAll('.stream-events-container');
             const buttonSelect = this._SfStreamContainer.querySelectorAll('.button-select');
+            let selectAllArr = this.attachSelectAllListeners(this._SfStreamContainer, buttonSelect);
+            const buttonSelectAll = selectAllArr[0];
+            const buttonUnselectAll = selectAllArr[1];
             for (i = 0; i < buttonSelect.length; i++) {
                 buttonSelect[i].addEventListener('click', (ev) => {
                     //console.log('eventscontainer', streamEventsContainer.length, buttonSelect.length);
@@ -5662,6 +5737,8 @@ let SfIEvents = class SfIEvents extends LitElement {
                             buttonSelect[k].style.display = 'block';
                             streamEventsContainer[k].style.display = 'block';
                         }
+                        buttonSelectAll.style.display = 'none';
+                        buttonUnselectAll.style.display = 'none';
                     }
                     else {
                         if (this.selectedItemIds.length === 1) {
@@ -5670,18 +5747,28 @@ let SfIEvents = class SfIEvents extends LitElement {
                             const status = idArr1[13].replace(/_/g, '-');
                             this.selectedStatus = status;
                         }
+                        let totalVisibleCount = 0;
                         for (var k = 0; k < buttonSelect.length; k++) {
                             const id1 = buttonSelect[k].id;
                             const idArr1 = id1.split("-");
                             const docs1 = idArr1[6];
                             const status = idArr1[13].replace(/_/g, '-');
                             if (docs == docs1 && status == this.selectedStatus) {
+                                totalVisibleCount++;
                             }
                             else {
                                 buttonSelect[k].style.display = 'none';
                                 streamEventsContainer[k].style.display = 'none';
                             }
                         }
+                        if (this.selectedItemIds.length >= parseInt(this.selectallblock) || this.selectedItemIds.length >= totalVisibleCount) {
+                            buttonSelectAll.style.display = 'none';
+                            buttonUnselectAll.style.display = 'flex';
+                        }
+                        else {
+                            buttonSelectAll.style.display = 'flex';
+                            buttonUnselectAll.style.display = 'none';
+                        }
                     }
                     // (this._SfDetailContainer as HTMLDivElement).style.display = 'block'
                     // this.renderEventDetail(this.events[mmdd][j], mmdd + "/" + ((new Date()).getFullYear() + ""));
@@ -8234,7 +8321,7 @@ let SfIEvents = class SfIEvents extends LitElement {
                         }
                         if (equal) {
                             multiArr[i].preselectedValues = JSON.stringify(taggingArray.data.mappings.mappings[j][colName]);
-                            if (taggingArray.data.mappings.mappings[j][colName].length > 0) {
+                            if (taggingArray.data.mappings.mappings[j][colName] != null && taggingArray.data.mappings.mappings[j][colName].length > 0) {
                                 multiArr[i].parentElement.setAttribute("part", "row-mapped");
                             }
                         }
@@ -18130,6 +18217,9 @@ __decorate([
 __decorate([
     property()
 ], SfIEvents.prototype, "blocksize", void 0);
+__decorate([
+    property()
+], SfIEvents.prototype, "selectallblock", void 0);
 __decorate([
     query('.SfIEventsC')
 ], SfIEvents.prototype, "_SfIEventsC", void 0);

package/src/sf-i-events.ts

@@ -1590,6 +1590,9 @@ export class SfIEvents extends LitElement {
 
   changedOnboardingItemIds: string[] = []
 
+  @property()
+  selectallblock: string = "100";
+
   static override styles = css`
 
     .bg-white {
@@ -4970,6 +4973,10 @@ export class SfIEvents extends LitElement {
     var html = this.renderEvents(firstDay, endDay, 1, lastDay, true, 0, (firstDate.getMonth()), period, firstDate,"From " + firstDay.toLocaleDateString('en-IN') + " To " + endDay.toLocaleDateString('en-IN'));
 
     eventsContainer.querySelector('.calendar-right-data')!.innerHTML = html;
+    
+    let innerhtml = eventsContainer.innerHTML;
+    innerhtml += this.renderSelectAllButtons();
+    eventsContainer.innerHTML = innerhtml
     this.renderButtonRefresh(eventsContainer);
     this.attachTimelineFilterHandlers(eventsContainer);
 
@@ -5026,7 +5033,9 @@ export class SfIEvents extends LitElement {
 
     const streamEventsContainer = eventsContainer.querySelectorAll('.stream-events-container') as NodeListOf<HTMLDivElement>;
     const buttonSelect = eventsContainer.querySelectorAll('.button-select') as NodeListOf<HTMLButtonElement>;
-
+    let selectAllArr = this.attachSelectAllListeners(eventsContainer,buttonSelect)
+    const buttonSelectAll = selectAllArr[0]
+    const buttonUnselectAll = selectAllArr[1]
     for(i = 0; i < buttonSelect.length; i++) {
 
       buttonSelect[i].addEventListener('click', (ev: any) => {
@@ -5054,6 +5063,8 @@ export class SfIEvents extends LitElement {
             (streamEventsContainer[k] as HTMLDivElement).style.display = 'block';
   
           }
+          buttonSelectAll.style.display = 'none';
+          buttonUnselectAll.style.display = 'none';
 
         } else {
 
@@ -5066,6 +5077,7 @@ export class SfIEvents extends LitElement {
 
           }
 
+          let totalVisibleCount = 0
           for(var k = 0; k < buttonSelect.length; k++) {
 
             const id1 = buttonSelect[k].id;
@@ -5074,12 +5086,20 @@ export class SfIEvents extends LitElement {
             const status = idArr1[13].replace(/_/g, '-');
   
             if(docs == docs1 && status == this.selectedStatus) {
+              totalVisibleCount++
             } else {
               (buttonSelect[k] as HTMLInputElement).style.display = 'none';
               (streamEventsContainer[k] as HTMLDivElement).style.display = 'none';
             }
   
           }  
+          if(this.selectedItemIds.length >= parseInt(this.selectallblock) || this.selectedItemIds.length >= totalVisibleCount){
+            buttonSelectAll.style.display = 'none';
+            buttonUnselectAll.style.display = 'flex';
+          }else{
+            buttonSelectAll.style.display = 'flex';
+            buttonUnselectAll.style.display = 'none';
+          }
           
 
         }
@@ -5576,7 +5596,42 @@ export class SfIEvents extends LitElement {
     
 
   }
- 
+  renderSelectAllButtons = () => {
+    let selectAllHtml = '<div class="d-flex justify-end w-100" style="position: fixed; bottom: 70px; left: 0px;" part="button-select-all-container">';
+      selectAllHtml += '<button part="button-select-all" id="button-select-all" class="d-flex align-center mt-10 mr-10 ml-10"><span class="material-symbols-outlined">select_all</span>&nbsp;<h4>Select All</h4><span>&nbsp;(Max ' + this.selectallblock + ')</span></button>';
+      selectAllHtml += '<button part="button-unselect-all" id="button-unselect-all" class="d-flex align-center mt-10 mr-10 ml-10"><span class="material-symbols-outlined">remove_selection</span>&nbsp;<h4>Unselect</h4></button>';
+    selectAllHtml += '</div>';
+    return selectAllHtml
+  }
+  attachSelectAllListeners = (eventsContainer: HTMLDivElement, buttonSelect: NodeListOf<HTMLButtonElement>) => {
+    const buttonSelectAll = eventsContainer.querySelector('#button-select-all') as HTMLButtonElement
+    const buttonUnselectAll = eventsContainer.querySelector('#button-unselect-all') as HTMLButtonElement
+    if(this.selectedItemIds.length == 0){
+      buttonSelectAll.style.display = 'none';
+      buttonUnselectAll.style.display = 'none';
+    }
+    buttonSelectAll?.addEventListener('click',() => {
+      let count = this.selectedItemIds.length 
+      for(let checkSelect of buttonSelect){
+        console.log('select count', count, parseInt(this.selectallblock))
+        if(count < parseInt(this.selectallblock) && checkSelect.style.display != 'none' && !(checkSelect as HTMLInputElement).checked){
+          checkSelect.click();
+          count++;
+        }
+        if(count >= parseInt(this.selectallblock)){
+          break;
+        }
+      }
+    })
+    buttonUnselectAll?.addEventListener('click',() => {
+      for(let checkSelect of buttonSelect){
+        if((checkSelect as HTMLInputElement).checked){
+          checkSelect.click();
+        }
+      }
+    })
+    return [buttonSelectAll, buttonUnselectAll]
+  }
   renderRegisterEvents = (events: any) => {
 
     var html = '';
@@ -8024,6 +8079,7 @@ export class SfIEvents extends LitElement {
       startDate.setDate(startDate.getDate() + 1);
         
       html += '</div>';
+      html += this.renderSelectAllButtons();
     html += '</div>';
 
     (this._SfThisContainer as HTMLDivElement).innerHTML = html;
@@ -8226,7 +8282,9 @@ export class SfIEvents extends LitElement {
 
     const streamEventsContainer = (this._SfThisContainer as HTMLDivElement).querySelectorAll('.stream-events-container') as NodeListOf<HTMLDivElement>;
     const buttonSelect = (this._SfThisContainer as HTMLDivElement).querySelectorAll('.button-select') as NodeListOf<HTMLButtonElement>;
-
+    let selectAllArr = this.attachSelectAllListeners((this._SfThisContainer as HTMLDivElement),buttonSelect)
+    const buttonSelectAll = selectAllArr[0]
+    const buttonUnselectAll = selectAllArr[1]
     for(i = 0; i < buttonSelect.length; i++) {
 
       buttonSelect[i].addEventListener('click', (ev: any) => {
@@ -8254,7 +8312,8 @@ export class SfIEvents extends LitElement {
             (streamEventsContainer[k] as HTMLDivElement).style.display = 'block';
   
           }
-
+          buttonSelectAll.style.display = 'none';
+          buttonUnselectAll.style.display = 'none';
         } else {
 
           if(this.selectedItemIds.length === 1) {
@@ -8266,6 +8325,7 @@ export class SfIEvents extends LitElement {
 
           }
 
+          let totalVisibleCount = 0
           for(var k = 0; k < buttonSelect.length; k++) {
 
             const id1 = buttonSelect[k].id;
@@ -8274,12 +8334,20 @@ export class SfIEvents extends LitElement {
             const status = idArr1[13].replace(/_/g, '-');
   
             if(docs == docs1 && status == this.selectedStatus) {
+              totalVisibleCount++
             } else {
               (buttonSelect[k] as HTMLInputElement).style.display = 'none';
               (streamEventsContainer[k] as HTMLDivElement).style.display = 'none';
             }
   
           }  
+          if(this.selectedItemIds.length >= parseInt(this.selectallblock) || this.selectedItemIds.length >= totalVisibleCount){
+            buttonSelectAll.style.display = 'none';
+            buttonUnselectAll.style.display = 'flex';
+          }else{
+            buttonSelectAll.style.display = 'flex';
+            buttonUnselectAll.style.display = 'none';
+          }  
           
 
         }
@@ -8422,6 +8490,7 @@ export class SfIEvents extends LitElement {
           startDate.setMonth(startDate.getMonth() + 1);
         }
       html += '</div>';
+      html += this.renderSelectAllButtons();
     html += '</div>';
 
     (this._SfStreamContainer as HTMLDivElement).innerHTML = html;
@@ -8634,7 +8703,10 @@ export class SfIEvents extends LitElement {
 
     const streamEventsContainer = (this._SfStreamContainer as HTMLDivElement).querySelectorAll('.stream-events-container') as NodeListOf<HTMLDivElement>;
     const buttonSelect = (this._SfStreamContainer as HTMLDivElement).querySelectorAll('.button-select') as NodeListOf<HTMLButtonElement>;
-
+    let selectAllArr = this.attachSelectAllListeners((this._SfStreamContainer as HTMLDivElement),buttonSelect)
+    const buttonSelectAll = selectAllArr[0]
+    const buttonUnselectAll = selectAllArr[1]
+    
     for(i = 0; i < buttonSelect.length; i++) {
 
       buttonSelect[i].addEventListener('click', (ev: any) => {
@@ -8662,6 +8734,8 @@ export class SfIEvents extends LitElement {
             (streamEventsContainer[k] as HTMLDivElement).style.display = 'block';
   
           }
+          buttonSelectAll.style.display = 'none';
+          buttonUnselectAll.style.display = 'none';
 
         } else {
 
@@ -8673,7 +8747,7 @@ export class SfIEvents extends LitElement {
             this.selectedStatus = status;
 
           }
-
+          let totalVisibleCount = 0
           for(var k = 0; k < buttonSelect.length; k++) {
 
             const id1 = buttonSelect[k].id;
@@ -8682,15 +8756,23 @@ export class SfIEvents extends LitElement {
             const status = idArr1[13].replace(/_/g, '-');
   
             if(docs == docs1 && status == this.selectedStatus) {
+              totalVisibleCount++
             } else {
               (buttonSelect[k] as HTMLInputElement).style.display = 'none';
               (streamEventsContainer[k] as HTMLDivElement).style.display = 'none';
             }
   
           }  
-          
-
+          if(this.selectedItemIds.length >= parseInt(this.selectallblock) || this.selectedItemIds.length >= totalVisibleCount){
+            buttonSelectAll.style.display = 'none';
+            buttonUnselectAll.style.display = 'flex';
+          }else{
+            buttonSelectAll.style.display = 'flex';
+            buttonUnselectAll.style.display = 'none';
+          }
         }
+        
+
 
         // (this._SfDetailContainer as HTMLDivElement).style.display = 'block'
 
@@ -12004,7 +12086,7 @@ export class SfIEvents extends LitElement {
           if(equal) {
             
             (multiArr[i] as SfIForm).preselectedValues = JSON.stringify(taggingArray.data.mappings.mappings[j][colName]);
-            if(taggingArray.data.mappings.mappings[j][colName].length > 0) {
+            if(taggingArray.data.mappings.mappings[j][colName] != null && taggingArray.data.mappings.mappings[j][colName].length > 0) {
               ((multiArr[i] as SfIForm).parentElement as HTMLTableCellElement).setAttribute("part", "row-mapped");
             }