@annalib/anna-core 12.5.0 → 12.6.2

package/lib/anna-core-shared-lib/models/anna-non-editable-gt-models.d.ts

@@ -32,6 +32,11 @@ export interface ITotalRowInfo {
     tooltipMessage?: string;
     isActionColumn?: boolean;
     actionData?: ClickableItem[];
+    isIconColumn?: boolean;
+    iconData?: {
+        class: string;
+        disabled?: boolean;
+    };
 }
 export interface IGtHeaderConfig {
     iconColumn: boolean;

package/lib/anna-generic-table-lib/components/anna-non-editable-generic-table/anna-non-editable-generic-table.component.d.ts

@@ -68,6 +68,7 @@ export declare class AnnaNonEditableGenericTableComponent implements OnInit, OnC
     gtViewDetailClicked: EventEmitter<any>;
     downloadSpotDetails: EventEmitter<any>;
     clickableDataClicked: EventEmitter<any>;
+    totalRowIconClicked: EventEmitter<any>;
     notificationIconHover: EventEmitter<any>;
     notificationIconHoverLeave: EventEmitter<any>;
     numberOfSkeletonRows: number[][];
@@ -300,7 +301,8 @@ export declare class AnnaNonEditableGenericTableComponent implements OnInit, OnC
     mouseEnterOnTextActionType(rowData: any, tooltipKey: string): void;
     onClickableDataClicked(Rowdata: any, id: number): void;
     removeTooltipOnScroll(): void;
+    iconClickedInTotalRow(colName: string): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AnnaNonEditableGenericTableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AnnaNonEditableGenericTableComponent, "anna-core-non-editable-generic-table-lib", never, { "showSkeletonLoading": "showSkeletonLoading"; "tableHeaders": "tableHeaders"; "tableData": "tableData"; "clonedTableData": "clonedTableData"; "gtGeneralConfig": "gtGeneralConfig"; "totalRowInfo": "totalRowInfo"; "gtDimension": "gtDimension"; "tableClass": "tableClass"; "maximumRowsWhichCanBeRenderedWithoutScroll": "maximumRowsWhichCanBeRenderedWithoutScroll"; "limit": "limit"; "includeBorderInTableHeight": "includeBorderInTableHeight"; "downloadInProgress": "downloadInProgress"; "percentDone": "percentDone"; "starredInProgress": "starredInProgress"; "clickableRow": "clickableRow"; "setTableHeightWhenRowSizeIsFixed": "setTableHeightWhenRowSizeIsFixed"; "tableBorderBottomClassRequired": "tableBorderBottomClassRequired"; "hideSomeTds": "hideSomeTds"; "tdsHaveRowSpan": "tdsHaveRowSpan"; }, { "toggleCheckbox": "toggleCheckbox"; "toggleRowCheckbox": "toggleRowCheckbox"; "toggleHeaderCheckbox": "toggleHeaderCheckbox"; "undoIconClicked": "undoIconClicked"; "filterAppliedToTable": "filterAppliedToTable"; "sortingAppliedToTable": "sortingAppliedToTable"; "rowClicked": "rowClicked"; "radioButtonSelected": "radioButtonSelected"; "columnFilterOpened": "columnFilterOpened"; "columnFilterClosed": "columnFilterClosed"; "gtIconClicked": "gtIconClicked"; "gtSVGIconClicked": "gtSVGIconClicked"; "gtTextActionClicked": "gtTextActionClicked"; "gtViewDetailClicked": "gtViewDetailClicked"; "downloadSpotDetails": "downloadSpotDetails"; "clickableDataClicked": "clickableDataClicked"; "notificationIconHover": "notificationIconHover"; "notificationIconHoverLeave": "notificationIconHoverLeave"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AnnaNonEditableGenericTableComponent, "anna-core-non-editable-generic-table-lib", never, { "showSkeletonLoading": "showSkeletonLoading"; "tableHeaders": "tableHeaders"; "tableData": "tableData"; "clonedTableData": "clonedTableData"; "gtGeneralConfig": "gtGeneralConfig"; "totalRowInfo": "totalRowInfo"; "gtDimension": "gtDimension"; "tableClass": "tableClass"; "maximumRowsWhichCanBeRenderedWithoutScroll": "maximumRowsWhichCanBeRenderedWithoutScroll"; "limit": "limit"; "includeBorderInTableHeight": "includeBorderInTableHeight"; "downloadInProgress": "downloadInProgress"; "percentDone": "percentDone"; "starredInProgress": "starredInProgress"; "clickableRow": "clickableRow"; "setTableHeightWhenRowSizeIsFixed": "setTableHeightWhenRowSizeIsFixed"; "tableBorderBottomClassRequired": "tableBorderBottomClassRequired"; "hideSomeTds": "hideSomeTds"; "tdsHaveRowSpan": "tdsHaveRowSpan"; }, { "toggleCheckbox": "toggleCheckbox"; "toggleRowCheckbox": "toggleRowCheckbox"; "toggleHeaderCheckbox": "toggleHeaderCheckbox"; "undoIconClicked": "undoIconClicked"; "filterAppliedToTable": "filterAppliedToTable"; "sortingAppliedToTable": "sortingAppliedToTable"; "rowClicked": "rowClicked"; "radioButtonSelected": "radioButtonSelected"; "columnFilterOpened": "columnFilterOpened"; "columnFilterClosed": "columnFilterClosed"; "gtIconClicked": "gtIconClicked"; "gtSVGIconClicked": "gtSVGIconClicked"; "gtTextActionClicked": "gtTextActionClicked"; "gtViewDetailClicked": "gtViewDetailClicked"; "downloadSpotDetails": "downloadSpotDetails"; "clickableDataClicked": "clickableDataClicked"; "totalRowIconClicked": "totalRowIconClicked"; "notificationIconHover": "notificationIconHover"; "notificationIconHoverLeave": "notificationIconHoverLeave"; }, never, never, false, never>;
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@annalib/anna-core",
-  "version": "12.5.0",
+  "version": "12.6.2",
   "peerDependencies": {
     "@angular-slider/ngx-slider": "^2.0.4",
     "@angular/common": "^15.2.9",

package/src/lib/anna-common-scss/_common-order-listing-table.scss

@@ -0,0 +1,165 @@
+@use "./fonts";
+@use "./colors";
+@use "./generic-table-common";
+
+@mixin sticky-left($leftOffset, $zIndex) {
+  position: sticky;
+  left: $leftOffset; 
+  z-index: $zIndex !important;
+}
+
+@mixin ellipsify(){
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+@mixin ellipsis() {
+  display: inline-block;
+  width: 93%;
+  @include ellipsify();
+}
+
+@mixin common-table($tableStartIndex, $tableEndIndex) {
+  thead {
+    tr th {
+      box-shadow: none !important;
+    }
+    tr th:nth-child(12) {
+      z-index: 101 !important;
+    }
+
+    tr th.mat-column-isOrderStarred,
+    tr th.mat-column-payForPerformanceColumnIcon {
+      background-color: white !important;
+    }
+
+    tr.total-row {
+      td {
+        color: #4a4a4a;
+
+        span {
+          color: #a7a7a7;
+        }
+
+        background: white;
+        @include fonts.fonts(Roboto, 0.75rem, normal, bold, normal, normal, 0.3px);
+      }
+
+      td:nth-of-type(1) {
+        @include sticky-left(0px, 501);
+      }
+
+      td:nth-of-type(2) {
+        box-shadow: inset 1px 0 0 0 rgb(0 0 0 / 75%), inset 0 1px 0 0 rgb(0 0 0 / 75%), inset 0 -1px 0 0 rgb(0 0 0 / 75%);
+        padding-left: 37px;
+        @include sticky-left(62px, 501);
+      }
+
+      td:nth-of-type(n + 3) {
+        box-shadow: inset 0 1px 0 0 rgb(0 0 0 / 75%), inset 0 -1px 0 0 rgb(0 0 0 / 75%);
+      }
+
+      td:last-of-type {
+        box-shadow: inset -1px 0 0 0 rgb(0 0 0 / 75%), inset 0 1px 0 0 rgb(0 0 0 / 75%), inset 0 -1px 0 0 rgb(0 0 0 / 75%);
+      }
+    }
+  }
+
+  tbody {
+    tr {
+      cursor: pointer;
+
+      td {
+        background: white;
+        box-shadow: none !important;
+
+        div:nth-child(1) {
+          color: #000;
+          @include ellipsify();
+          @include fonts.fonts(Roboto, 0.75rem, normal, normal, normal, normal, 0px);
+        }
+
+        div:nth-child(2) {
+          color: #a7a7a7;
+          @include ellipsify();
+          @include fonts.fonts(Roboto, 0.75rem, normal, 500, normal, normal, 0.3px);
+        }
+      }
+
+      td:nth-of-type(1) {
+        @include sticky-left(0px, 102);
+      }
+
+      @for $i from calc($tableStartIndex) through calc($tableEndIndex) {
+        td:nth-of-type(#{$i}) {
+          box-shadow: inset 0px -1px 0px 0px #d4d4d4 !important;
+        }
+      }
+
+      td:nth-of-type(#{$tableStartIndex}) {
+        box-shadow: inset 1px -1px 0px 0px #d4d4d4 !important;
+      }
+
+      td:last-of-type {
+        box-shadow: inset -1px -1px 0px 0px #d4d4d4 !important;
+      }
+
+      td.mat-cell:first-of-type {
+        padding-left: 5px !important;
+
+        i {
+          font-size: 1.25rem;
+          cursor: pointer;
+          position: relative;
+          bottom: 2px;
+        }
+
+        i.mdi-star-outline {
+          color: #e6e6e6;
+        }
+
+        i.mdi-star {
+          color: #ffc107;
+          opacity: 0.5;
+        }
+      }
+    }
+
+    @include overrideEmptyTrBorders(3);
+  }
+
+  &.no-data-table {
+    tbody tr:first-of-type {
+      td:nth-of-type(#{$tableStartIndex}) {
+        box-shadow: inset 1px 0px 0px 0px #d4d4d4 !important;
+      }
+
+      td:nth-of-type(#{$tableStartIndex + 1}),
+      td:nth-of-type(#{$tableStartIndex + 2}) {
+        box-shadow: none !important
+      }
+    }
+  }
+
+  &.no-data-table div.horizontal-scroll-for-table-container {
+    height: calc(162px) !important;
+  }
+
+  .table-container::-webkit-scrollbar {
+    width: 4px;
+    height: 4px;
+  }
+
+  .table-container::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    background-color: rgba(0, 0, 0, 0.4) !important;
+    border: 1px solid rgba(0, 0, 0, 0.2);
+  }
+
+  .table-container::-webkit-scrollbar-track {
+    border: 1px solid rgba(0, 0, 0, 0.1) !important;
+    margin-top: 105px;
+  }
+
+}

package/src/lib/anna-common-scss/_easy-filter.scss

@@ -1,4 +1,5 @@
-@import "./fonts", "./colors";
+@use "./fonts";
+@import "./colors";
 
 @mixin easy-filters() {
     display: flex;
@@ -34,4 +35,28 @@
         cursor: default;
         pointer-events: none;
     }
+}
+
+button.intelli-filter{
+    @include fonts.fonts(Roboto, 0.75rem, normal, 500, normal, normal, 0.6px);
+    color: #268bff;
+    padding: 5px 8px;
+    border: 1px solid #268bff;
+    background: white;
+    border-radius: 0.75rem;
+    height: 1.5rem;
+    margin-right: 8px;
+}
+
+button.intelli-filter.active{
+    color: white;
+    background: #268bff;
+}
+
+button.intelli-filter:disabled {
+  border: 1px solid #bdbdbd;
+  color: #4a4a4a;
+  background: #bdbdbd;
+  opacity: .5;
+  cursor: not-allowed;
 }

package/src/lib/anna-common-scss/_generic-table-common.scss

@@ -1,3 +1,6 @@
+@use "./fonts";
+@use "./colors";
+
 @mixin no-data-to-display-gt($tableHeight, $rowHeight, $noDataMarginTop) {
   .table-container {
     height: calc($tableHeight) !important;
@@ -115,3 +118,56 @@
   z-index: $z-index;
 }
 
+
+@mixin genericTableHeaderShadow($columnNumber){
+  .scroll-left-shadow-effect  .header-row th:nth-of-type(#{$columnNumber}) {
+    border: none !important;
+    filter: drop-shadow(2px 0 2px colors.$lightGray-4);
+  }
+}
+
+@mixin genericTableTotalRowShadow($columnNumber){
+  .scroll-left-shadow-effect .total-row td:nth-of-type(#{$columnNumber}) {
+    filter: drop-shadow(2px 0 2px colors.$lightGray-4);
+  }
+}
+
+@mixin genericTableTableDataShadow($columnNumber){
+  .scroll-left-shadow-effect  td:nth-of-type(#{$columnNumber}) {
+    filter: drop-shadow(2px 0 1px colors.$lightGray-4);
+  }
+}
+
+@mixin genericTableOverrideHeaderShadow($columnNumber){
+  .scroll-left-shadow-effect  .header-row th:nth-of-type(#{$columnNumber}) {
+    box-shadow: none !important;
+    border: none !important;
+    filter: none;
+  }
+}
+
+@mixin genericTableOverrideTableDataShadow($columnNumber){
+  .scroll-left-shadow-effect  td:nth-of-type(#{$columnNumber}) {
+    filter: none;
+  }
+}
+
+@mixin overrideEmptyTrBorders($startIndex){
+  
+  tr.no-border-tr:first-of-type{
+      
+    td:nth-of-type(#{$startIndex}){
+      box-shadow: inset 1px 0px 0px 0px #d4d4d4 !important;
+    }
+    
+    td:nth-child(n+ #{$startIndex + 1}){
+      box-shadow: none !important;
+    }
+
+    td:last-of-type{
+      box-shadow: inset -1px 0px 0px 0px #d4d4d4 !important
+    }    
+  }
+}
+
+