Merge branch 'v5.9' of https://github.com/meta-magic/amexio.github.io into v5.9

Author: rashmithakkar

src/module/forms/chip/chip.component.html

@@ -1,7 +1,7 @@
 <div  class="chips" id="{{index}}" attr.aria-label="{{label}}"  style="cursor: pointer;" [ngStyle]="{'background-color': color,'filter': selected ? 'contrast(70%)':''}">
   <amexio-c-icon [customclass]="icon"></amexio-c-icon>
   <amexio-label  (click)="onLabelClick($event)">
-    <span [style.color]="fontcolor" style="cursor: pointer;padding-left:10px;">
+    <span [style.color]="fontcolor" style="cursor: pointer;"[ngStyle]="{'padding-left': icon ? '10px':'0px'}">
       {{item[displayfield]}}
     </span>
   </amexio-label>

src/module/panes/tab/tab.component.html

@@ -27,8 +27,9 @@
 
 
             <div>
-                <div *ngFor="let tabnode of tabCollection, let index = index" class="tablink {{tabnode.amexiocolor+ ' '+tabnode.tabPillClass}}" [style.width.px]="singleTabWidth"  (contextmenu)="loadContextMenu($event,tabnode, tab)">
-                    <div class="table1" id="{{tabnode.tablk}}" tabindex="1" attr.aria-controls="{{tabnode.tabId}}" role="tab" (click)="onTabClick(tabnode, index)"
+                <div *ngFor="let tabnode of tabCollection, let index = index" class="tablink {{tabnode.amexiocolor+ ' '+tabnode.tabPillClass}}" 
+                [style.width.px]="singleTabWidth"  (contextmenu)="loadContextMenu($event,tabnode, tab)">
+                    <div class="table1" id="{{tabnode.tablk}}" tabindex="1" attr.aria-controls="{{tabnode.tabId}}" role="tab" (click)="onTabClick(tabnode, index)" [ngStyle]="{'display': tabnode.showflag ? 'none':'table-cell'}"
                     (keyup.arrowright)="onArrowRight()" (keyup.arrowleft)="onArrowLeft()" (keyup.enter)="onTabClick(tabnode, index)" (keyup.home)="onHomeClick()" 
                     (keyup.end)="onEndClick()">
                         <div class="tablerow">

src/module/panes/tab/tab.component.ts

@@ -158,15 +158,15 @@ export class AmexioTabComponent extends LifeCycleBaseComponent implements AfterC
    */
   @Input('default-context-menu') defaultContextMenu: boolean;
 
-   /*
- Properties
- name : active-bg-color
- datatype : boolean
- version : 5.9.3 onwards
- default : false
- description : sets background color for active tab
- */
-@Input('active-bg-color') activeBGColor: boolean;
+  /*
+Properties
+name : active-bg-color
+datatype : boolean
+version : 5.9.3 onwards
+default : false
+description : sets background color for active tab
+*/
+  @Input('active-bg-color') activeBGColor: boolean;
 
   /*
    Events
@@ -839,4 +839,61 @@ export class AmexioTabComponent extends LifeCycleBaseComponent implements AfterC
     this.removeListner();
     super.ngOnDestroy();
   }
+  showTab(input: any) {
+    if (typeof input === 'string') {
+      this.tabCollection.forEach((tabs: any) => {
+        if (input.trim().toLowerCase() !== tabs.title.trim().toLowerCase()) {
+          tabs.hide = true;
+          tabs['showflag'] = true;
+          tabs.active = false;
+        } else {
+          tabs.hide = false;
+          tabs['showflag'] = false;
+          tabs.active = true;
+        }
+        this.asignTabPillClass(tabs);
+      });
+    }else if (typeof input === 'number') {
+      this.tabCollection.forEach((tabs: any, index: any) => {
+        if (index !== input) {
+          tabs.hide = true;
+          tabs['showflag'] = true;
+          tabs.active = false;
+        } else {
+          tabs.hide = false;
+          tabs['showflag'] = false;
+          tabs.active = true;
+        }
+      });
+    }
+  }
+  // Method to hide tab
+  hideTab(input: any) {
+    if (typeof input === 'string') {
+      this.tabCollection.forEach((tabs: any, index: any) => {
+        if (input.trim().toLowerCase() === tabs.title.trim().toLowerCase() && tabs.active) {
+          const i = index + 1;
+          tabs.hide = false;
+          this.tabCollection[i].active = true;
+          const newTab = this.tabCollection[i];
+          tabs.active = false;
+          tabs['showflag'] = true;
+          this.asignTabPillClass(newTab);
+        } else if (input.trim().toLowerCase() === tabs.title.trim().toLowerCase() && !tabs.active) {
+          tabs.hide = true;
+          tabs['showflag'] = true;
+        }
+      });
+    }else if (typeof input === 'number') {
+      this.tabCollection.forEach((tabs: any, index: any) => {
+        if (index !== input) {
+          tabs.hide = true;
+          tabs['showflag'] = false;
+        } else {
+          tabs.hide = false;
+          tabs['showflag'] = true;
+        }
+      });
+    }
+  }
 }