cax-design-system 2.8.3 → 2.8.4

package/resources/cax.scss

@@ -6288,6 +6288,7 @@ cax-radiobutton.ng-dirty.ng-invalid > .cax-radiobutton > .cax-radiobutton-box {
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
+    background-color: var(--neutral-25);
 }
 .cax-datatable .cax-datatable-tbody > tr > td.cax-cell-background-error:has(.cax-inputtext) {
     border: 1px solid var(--error-600) !important;
@@ -6381,47 +6382,68 @@ cax-radiobutton.ng-dirty.ng-invalid > .cax-radiobutton > .cax-radiobutton-box {
     border-width: 0 1px 1px 1px;
 }
 .cax-datatable.cax-datatable-gridlines .cax-datatable-thead > tr > th {
-    border-width: 1px 0 1px 1px;
+    border-width: 1px 1px 1px 0;
 }
-.cax-datatable.cax-datatable-gridlines .cax-datatable-thead > tr > th:last-child {
+.cax-datatable.cax-datatable-gridlines .cax-datatable-thead > tr > th:first-child {
     border-width: 1px;
 }
+.cax-datatable.cax-datatable-gridlines .cax-datatable-thead > tr > th.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr > td {
-    border-width: 1px 0 0 1px;
+    border-width: 1px 1px 0 0;
 }
-.cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr > td:last-child {
+.cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr > td:first-child {
     border-width: 1px 1px 0 1px;
 }
+.cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr > td.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr:last-child > td {
-    border-width: 1px 0 1px 1px;
+    border-width: 1px 1px 1px 0;
 }
-.cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr:last-child > td:last-child {
+.cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr:last-child > td:first-child {
     border-width: 1px;
 }
+.cax-datatable.cax-datatable-gridlines .cax-datatable-tbody > tr:last-child > td.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-gridlines .cax-datatable-tfoot > tr > td {
-    border-width: 1px 0 1px 1px;
+    border-width: 1px 1px 1px 0;
 }
-.cax-datatable.cax-datatable-gridlines .cax-datatable-tfoot > tr > td:last-child {
+.cax-datatable.cax-datatable-gridlines .cax-datatable-tfoot > tr > td:first-child {
     border-width: 1px 1px 1px 1px;
 }
+.cax-datatable.cax-datatable-gridlines .cax-datatable-tfoot > tr > td.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-gridlines .cax-datatable-thead + .cax-datatable-tfoot > tr > td {
-    border-width: 0 0 1px 1px;
+    border-width: 0 1px 1px 0;
 }
-.cax-datatable.cax-datatable-gridlines .cax-datatable-thead + .cax-datatable-tfoot > tr > td:last-child {
+.cax-datatable.cax-datatable-gridlines .cax-datatable-thead + .cax-datatable-tfoot > tr > td:first-child {
     border-width: 0 1px 1px 1px;
 }
+.cax-datatable.cax-datatable-gridlines .cax-datatable-thead + .cax-datatable-tfoot > tr > td.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-gridlines:has(.cax-datatable-thead):has(.cax-datatable-tbody) .cax-datatable-tbody > tr > td {
-    border-width: 0 0 1px 1px;
+    border-width: 0 1px 1px 0;
 }
-.cax-datatable.cax-datatable-gridlines:has(.cax-datatable-thead):has(.cax-datatable-tbody) .cax-datatable-tbody > tr > td:last-child {
+.cax-datatable.cax-datatable-gridlines:has(.cax-datatable-thead):has(.cax-datatable-tbody) .cax-datatable-tbody > tr > td:first-child {
     border-width: 0 1px 1px 1px;
 }
+.cax-datatable.cax-datatable-gridlines:has(.cax-datatable-thead):has(.cax-datatable-tbody) .cax-datatable-tbody > tr > td.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-gridlines:has(.cax-datatable-tbody):has(.cax-datatable-tfoot) .cax-datatable-tbody > tr:last-child > td {
-    border-width: 0 0 0 1px;
+    border-width: 0 1px 0 0;
 }
-.cax-datatable.cax-datatable-gridlines:has(.cax-datatable-tbody):has(.cax-datatable-tfoot) .cax-datatable-tbody > tr:last-child > td:last-child {
+.cax-datatable.cax-datatable-gridlines:has(.cax-datatable-tbody):has(.cax-datatable-tfoot) .cax-datatable-tbody > tr:last-child > td:first-child {
     border-width: 0 1px 0 1px;
 }
+.cax-datatable.cax-datatable-gridlines:has(.cax-datatable-tbody):has(.cax-datatable-tfoot) .cax-datatable-tbody > tr:last-child > td.cax-frozen-column:last-child {
+    border-left-width: 1px;
+}
 .cax-datatable.cax-datatable-striped .cax-datatable-tbody > tr:nth-child(even) {
     background: var(--neutral-100);
 }

package/resources/components/calendar/calendar.scss

@@ -1,235 +1,231 @@
 @layer cax {
-   .cax-calendar {
-       position: relative;
-       display: inline-flex;
-       width: 100%;
-       height: 40px;
-   }
-   .cax-calendar-main-label {
+    .cax-calendar {
+        position: relative;
+        display: inline-flex;
+        width: 100%;
+        //    height: 40px;
+    }
+    .cax-calendar-main-label {
         font-weight: 500;
         font-size: 14px;
         line-height: 20px;
         margin-bottom: 8px;
     }
 
-   .cax-calendar .cax-inputtext {
-       flex: 1 1 auto;
-       width: 1%;
-       text-overflow: ellipsis;
-       padding-left: 1.8rem !important;
-       padding-right: 1.8rem !important;
-   }
-
-   .cax-calendar-w-btn .cax-inputtext {
-       border-top-right-radius: 0;
-       border-bottom-right-radius: 0; 
-   }
-
-   .cax-calendar-w-btn .cax-datepicker-trigger {
-       border-top-left-radius: 0;
-       border-bottom-left-radius: 0;
-   }
-
-   /* Fluid */
-   .cax-fluid .cax-calendar {
-       display: flex;
-   }
-
-   .cax-fluid .cax-calendar .cax-inputtext {
-       width: 1%;
-   }
-
-   /* Datepicker */
-   .cax-calendar .cax-datepicker {
-       min-width: 100%;
-   }
-
-   .cax-datepicker {
-       width: auto;
-       position: absolute;
-       top: 0;
-       left: 0;
-   }
-
-   .cax-datepicker-inline {
-       display: inline-block;
-       position: static;
-       overflow-x: auto;
-   }
-
-   /* Header */
-   .cax-datepicker-header {
-       display: flex;
-       align-items: center;
-       justify-content: space-between;
-   }
-
-   .cax-datepicker-header .cax-datepicker-title {
-       margin: 0 auto;
-   }
-
-   .cax-datepicker-prev,
-   .cax-datepicker-next {
-       cursor: pointer;
-       display: inline-flex;
-       justify-content: center;
-       align-items: center;
-       overflow: hidden;
-       position: relative;
-      
-   }
-
-   /* Multiple Month DatePicker */
-   .cax-datepicker-multiple-month .cax-datepicker-group-container {
-       display: flex;
-   }
-
-   .cax-datepicker-multiple-month .cax-datepicker-group-container .cax-datepicker-group {
-       flex: 1 1 auto;
-   }
-
-   /* Multiple Month DatePicker */
-   .cax-datepicker-multiple-month .cax-datepicker-group-container {
-       display: flex;
-   }
-
-   /* DatePicker Table */
-   .cax-datepicker table {
-       width: 100%;
-       border-collapse: collapse;
-   }
-
-   .cax-datepicker td > span {
-       display: flex;
-       justify-content: center;
-       align-items: center;
-       cursor: pointer;
-       margin: 0 auto;
-       overflow: hidden;
-       position: relative;
-   }
-
-   /* Month Picker */
-   .cax-monthpicker-month {
-       width: 33.3%;
-       display: inline-flex;
-       align-items: center;
-       justify-content: center;
-       cursor: pointer;
-       overflow: hidden;
-       position: relative;
-   }
-
-   /*  Button Bar */
-   .cax-datepicker-buttonbar {
-       display: flex;
-       justify-content: space-between;
-       align-items: center;
-   }
-
-   /* Time Picker */
-   .cax-timepicker {
-       display: flex;
-       justify-content: center;
-       align-items: center;
-   }
-
-   .cax-timepicker button {
-       display: flex;
-       align-items: center;
-       justify-content: center;
-       cursor: pointer;
-       overflow: hidden;
-       position: relative;
-   }
-
-   .cax-timepicker > div {
-       display: flex;
-       align-items: center;
-       flex-direction: column;
-   }
-
-   /* Touch UI */
-   .cax-datepicker-touch-ui,
-   .cax-calendar .cax-datepicker-touch-ui {
-       position: fixed;
-       top: 50%;
-       left: 50%;
-       min-width: 80vw;
-       transform: translate(-50%, -50%);
-   }
-
-   /* Year Picker */
-   .cax-yearpicker-year {
-       width: 50%;
-       display: inline-flex;
-       align-items: center;
-       justify-content: center;
-       cursor: pointer;
-       overflow: hidden;
-       position: relative;
-   }
-
-   .cax-calendar-clear-icon {
-       position: absolute;
-       top: 50%;
-       margin-top: -0.5rem;
-       cursor: pointer;
-   }
-
-   .cax-datepicker-icon {
-       pointer-events: none;
-   }
-
-   .cax-calendar-clearable {
-       position: relative;
-   }
-   .cax-datepicker-icon {
-       pointer-events: none;
-       left: 1.67px;
-       margin-top: 1px !important;
-   }
-   .cax-input-icon-left {
-       order: -1; 
-   }
-
-   .cax-datepicker-inline-actions {
-    display: flex;
-    justify-content: space-between;
-    margin-top: 13px;
-    padding: 10px;
-    
-    
-    .cax-datepicker-inline-input {
-      margin-bottom: 10px;
-      position: relative;
-      display: inline-block;
-      input {
-        width: 130px;
-        height: 32px;
-        padding-left: 2rem;
-        border-radius: 8px;
-        font-size: 14px;
-        font-weight: 500;
-      }
+    .cax-calendar .cax-inputtext {
+        flex: 1 1 auto;
+        width: 1%;
+        text-overflow: ellipsis;
+        height: 40px;
+        padding-left: 1.8rem !important;
+        padding-right: 1.8rem !important;
+    }
+
+    .cax-calendar-w-btn .cax-inputtext {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+
+    .cax-calendar-w-btn .cax-datepicker-trigger {
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
     }
 
-    .cax-datepicker-inline-input .cax-calendar-minimalistic {
+    /* Fluid */
+    .cax-fluid .cax-calendar {
+        display: flex;
+    }
+
+    .cax-fluid .cax-calendar .cax-inputtext {
+        width: 1%;
+    }
+
+    /* Datepicker */
+    .cax-calendar .cax-datepicker {
+        min-width: 100%;
+    }
+
+    .cax-datepicker {
+        width: auto;
         position: absolute;
-        left: 0.6rem;
+        top: 0;
+        left: 0;
+    }
+
+    .cax-datepicker-inline {
+        display: inline-block;
+        position: static;
+        overflow-x: auto;
+    }
+
+    /* Header */
+    .cax-datepicker-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+    }
+
+    .cax-datepicker-header .cax-datepicker-title {
+        margin: 0 auto;
+    }
+
+    .cax-datepicker-prev,
+    .cax-datepicker-next {
+        cursor: pointer;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        overflow: hidden;
+        position: relative;
+    }
+
+    /* Multiple Month DatePicker */
+    .cax-datepicker-multiple-month .cax-datepicker-group-container {
+        display: flex;
+    }
+
+    .cax-datepicker-multiple-month .cax-datepicker-group-container .cax-datepicker-group {
+        flex: 1 1 auto;
+    }
+
+    /* Multiple Month DatePicker */
+    .cax-datepicker-multiple-month .cax-datepicker-group-container {
+        display: flex;
+    }
+
+    /* DatePicker Table */
+    .cax-datepicker table {
+        width: 100%;
+        border-collapse: collapse;
+    }
+
+    .cax-datepicker td > span {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        cursor: pointer;
+        margin: 0 auto;
+        overflow: hidden;
+        position: relative;
+    }
+
+    /* Month Picker */
+    .cax-monthpicker-month {
+        width: 33.3%;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        overflow: hidden;
+        position: relative;
+    }
+
+    /*  Button Bar */
+    .cax-datepicker-buttonbar {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+    }
+
+    /* Time Picker */
+    .cax-timepicker {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
+
+    .cax-timepicker button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        overflow: hidden;
+        position: relative;
+    }
+
+    .cax-timepicker > div {
+        display: flex;
+        align-items: center;
+        flex-direction: column;
+    }
+
+    /* Touch UI */
+    .cax-datepicker-touch-ui,
+    .cax-calendar .cax-datepicker-touch-ui {
+        position: fixed;
         top: 50%;
-        transform: translateY(-50%);
-        font-size: 1rem;
-        pointer-events: none;
-      }
-  }
+        left: 50%;
+        min-width: 80vw;
+        transform: translate(-50%, -50%);
+    }
 
-  .left-side{
-    display: flex;
-    justify-content: space-between;
-    gap: 15px;
-  }
+    /* Year Picker */
+    .cax-yearpicker-year {
+        width: 50%;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        overflow: hidden;
+        position: relative;
+    }
+
+    .cax-calendar-clear-icon {
+        position: absolute;
+        top: 50%;
+        margin-top: -0.5rem;
+        cursor: pointer;
+    }
+
+    .cax-datepicker-icon {
+        pointer-events: none;
+    }
 
+    .cax-calendar-clearable {
+        position: relative;
+    }
+    .cax-datepicker-icon {
+        pointer-events: none;
+        left: 1.67px;
+        margin-top: 1px !important;
+    }
+    .cax-input-icon-left {
+        order: -1;
+    }
 
+    .cax-datepicker-inline-actions {
+        display: flex;
+        justify-content: space-between;
+        margin-top: 13px;
+        padding: 10px;
+
+        .cax-datepicker-inline-input {
+            margin-bottom: 10px;
+            position: relative;
+            display: inline-block;
+            input {
+                width: 130px;
+                height: 32px;
+                padding-left: 2rem;
+                border-radius: 8px;
+                font-size: 14px;
+                font-weight: 500;
+            }
+        }
+
+        .cax-datepicker-inline-input .cax-calendar-minimalistic {
+            position: absolute;
+            left: 0.6rem;
+            top: 50%;
+            transform: translateY(-50%);
+            font-size: 1rem;
+            pointer-events: none;
+        }
+    }
 
+    .left-side {
+        display: flex;
+        justify-content: space-between;
+        gap: 15px;
+    }
 }

package/resources/components/table/table.scss

@@ -84,8 +84,7 @@
 
     .cax-datatable-scrollable td.cax-frozen-column {
         z-index: 1;
-        background: transparent;
-        backdrop-filter: blur(80px);
+        background: var(--neutral-25);
     }
 
     .cax-datatable-flex-scrollable {
@@ -200,6 +199,7 @@
         display: inline-flex;
         position: relative;
         float: right;
+        top: -3px;
         margin-left: 4px;
         i {
             font-size: 20px;
@@ -436,6 +436,7 @@ $checkbox-size-xl: 22px;
     padding: 0 !important;
     align-items: center;
     justify-content: center;
+    border-radius: 6px;
     i {
         font-size: 20px;
     }
@@ -443,9 +444,15 @@ $checkbox-size-xl: 22px;
         opacity: 0.5;
         cursor: context-menu;
     }
+    &:hover {
+        background-color: var(--primary-100);
+    }
 }
 
 cax-sorticon {
-    position: absolute;
+    display: inline-flex;
+    position: relative;
+    float: right;
+    top: -3px;
     margin-left: 4px;
 }

package/tableconfiguration/tableconfiguration.d.ts

@@ -4,13 +4,13 @@ export declare class Tableconfiguration {
     fontConfiguration: 'sm' | 'md' | 'lg' | 'xl';
     rowConfiguration: 'sm' | 'md' | 'lg' | 'xl';
     fontSizeOptions: number[];
-    fontValue: number;
     rowHeightChange: EventEmitter<'sm' | 'md' | 'lg' | 'xl'>;
     fontSizeChange: EventEmitter<'sm' | 'md' | 'lg' | 'xl'>;
     saveDefault: EventEmitter<any>;
+    getFontValue(): 12 | 14 | 16 | 18;
     updateRowHeight(size: 'sm' | 'md' | 'lg' | 'xl'): void;
     emitTableConfiguration(): void;
     onSliderChange(event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<Tableconfiguration, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<Tableconfiguration, "cax-tableconfiguration", never, {}, { "rowHeightChange": "rowHeightChange"; "fontSizeChange": "fontSizeChange"; "saveDefault": "saveDefault"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Tableconfiguration, "cax-tableconfiguration", never, { "fontConfiguration": { "alias": "fontConfiguration"; "required": false; }; "rowConfiguration": { "alias": "rowConfiguration"; "required": false; }; }, { "rowHeightChange": "rowHeightChange"; "fontSizeChange": "fontSizeChange"; "saveDefault": "saveDefault"; }, never, never, true, never>;
 }

package/esm2022/accordion/accordion.interface.mjs

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWNjb3JkaW9uLmludGVyZmFjZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hcHAvY29tcG9uZW50cy9hY2NvcmRpb24vYWNjb3JkaW9uLmludGVyZmFjZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgVGVtcGxhdGVSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuLyoqXG4gKiBDdXN0b20gdGFiIG9wZW4gZXZlbnQuXG4gKiBAc2VlIHtAbGluayBBY2NvcmRpb24ub25PcGVufVxuICogQGdyb3VwIEV2ZW50c1xuICovXG5leHBvcnQgaW50ZXJmYWNlIEFjY29yZGlvblRhYk9wZW5FdmVudCB7XG4gICAgLyoqXG4gICAgICogQnJvd3NlciBldmVudC5cbiAgICAgKi9cbiAgICBvcmlnaW5hbEV2ZW50OiBFdmVudDtcbiAgICAvKipcbiAgICAgKiBPcGVuZWQgdGFiIGluZGV4LlxuICAgICAqL1xuICAgIGluZGV4OiBudW1iZXI7XG59XG5cbi8qKlxuICogQ3VzdG9tIHRhYiBjbG9zZSBldmVudC5cbiAqIEBzZWUge0BsaW5rIEFjY29yZGlvbi5vbkNsb3NlfVxuICogQGV4dGVuZHMge0FjY29yZGlvblRhYk9wZW5FdmVudH1cbiAqIEBncm91cCBFdmVudHNcbiAqL1xuZXhwb3J0IGludGVyZmFjZSBBY2NvcmRpb25UYWJDbG9zZUV2ZW50IGV4dGVuZHMgQWNjb3JkaW9uVGFiT3BlbkV2ZW50IHt9XG5cbi8qKlxuICogRGVmaW5lcyB2YWxpZCB0ZW1wbGF0ZXMgaW4gQWNjb3JkaW9uLlxuICogQGdyb3VwIFRlbXBsYXRlc1xuICovXG5leHBvcnQgaW50ZXJmYWNlIEFjY29yZGlvblRlbXBsYXRlcyB7XG4gICAgLyoqXG4gICAgICogQ3VzdG9tIHRlbXBsYXRlIG9mIGNvbnRlbnQuXG4gICAgICovXG4gICAgY29udGVudCgpOiBUZW1wbGF0ZVJlZjxhbnk+O1xuICAgIC8qKlxuICAgICAqIEN1c3RvbSB0ZW1wbGF0ZSBvZiBoZWFkZXIuXG4gICAgICovXG4gICAgaGVhZGVyKCk6IFRlbXBsYXRlUmVmPGFueT47XG4gICAgLyoqXG4gICAgICogQ3VzdG9tIHRlbXBsYXRlIG9mIGljb24uXG4gICAgICovXG4gICAgaWNvbihjb250ZXh0OiB7XG4gICAgICAgIC8qKlxuICAgICAgICAgKiBEYXRhIG9mIHRoZSBzZWxlY3RlZC5cbiAgICAgICAgICovXG4gICAgICAgICRpbXBsaWNpdDogYW55O1xuICAgIH0pOiBUZW1wbGF0ZVJlZjx7ICRpbXBsaWNpdDogYW55IH0+O1xufVxuIl19