ontimize-web-ngx 15.0.3 → 15.0.4

package/lib/components/grid/o-grid.component.d.ts

@@ -1,4 +1,4 @@
-import { AfterViewInit, ElementRef, Injector, OnChanges, OnDestroy, OnInit, QueryList, SimpleChange } from '@angular/core';
+import { AfterViewInit, ElementRef, Injector, OnChanges, OnDestroy, OnInit, QueryList } from '@angular/core';
 import { MediaObserver } from '@angular/flex-layout';
 import { MatFormFieldAppearance } from '@angular/material/form-field';
 import { MatPaginator } from '@angular/material/paginator';
@@ -66,9 +66,6 @@ export declare class OGridComponent extends AbstractOServiceComponent<OGridCompo
     onItemDetailClick(item: OGridItemDirective): void;
     onItemDetailDblClick(item: OGridItemDirective): void;
     ngOnDestroy(): void;
-    ngOnChanges(changes: {
-        [propName: string]: SimpleChange;
-    }): void;
     destroy(): void;
     loadMore(): void;
     getQueryArguments(filter: object, ovrrArgs?: OQueryDataArgs): any[];

package/lib/components/input/date-range/o-daterange-picker.component.d.ts

@@ -66,6 +66,7 @@ export declare class DaterangepickerComponent implements OnInit {
     leftCalendar: any;
     rightCalendar: any;
     showCalInRanges: boolean;
+    adjustedDaysOfWeek: any[];
     options: any;
     drops: string;
     opens: string;

package/lib/components/list/o-list.component.d.ts

@@ -1,5 +1,5 @@
 import { SelectionModel } from '@angular/cdk/collections';
-import { AfterContentInit, AfterViewInit, ElementRef, EventEmitter, Injector, OnChanges, OnDestroy, OnInit, QueryList, SimpleChange } from '@angular/core';
+import { AfterContentInit, AfterViewInit, ElementRef, EventEmitter, Injector, OnChanges, OnDestroy, OnInit, QueryList } from '@angular/core';
 import { MatFormFieldAppearance } from '@angular/material/form-field';
 import { Subscription } from 'rxjs';
 import { IList } from '../../interfaces/o-list.interface';
@@ -45,9 +45,6 @@ export declare class OListComponent extends AbstractOServiceComponent<OListCompo
     ngAfterViewInit(): void;
     ngAfterContentInit(): void;
     ngOnDestroy(): void;
-    ngOnChanges(changes: {
-        [propName: string]: SimpleChange;
-    }): void;
     getComponentKey(): string;
     initialize(): void;
     reinitialize(options: OListInitializationOptions): void;

package/lib/components/table/extensions/header/table-column-resizer/o-table-column-resizer.component.d.ts

@@ -27,11 +27,11 @@ export declare class OTableColumnResizerComponent implements OnInit, OnDestroy {
     ngOnDestroy(): void;
     onClick(event: MouseEvent): void;
     get isDisabled(): boolean;
-    onMousedown(e: MouseEvent): void;
+    onMousedown(e: MouseEvent | TouchEvent): void;
     onMouseup(): void;
     protected stopDragging(): void;
-    startResize(startEvent: MouseEvent): void;
-    protected resizeEvent(event: MouseEvent): void;
+    startResize(startEvent: MouseEvent | TouchEvent): void;
+    protected resizeEvent(event: MouseEvent | TouchEvent): void;
     protected getHeaderEL(): Node;
     protected getFollowingOColumns(): OColumn[];
     protected updateBlockedCols(): void;

package/lib/components/tree/o-tree.component.d.ts

@@ -47,6 +47,7 @@ export declare class OTreeComponent extends AbstractOServiceComponent<OTreeCompo
     protected _quickFilter: boolean;
     paginationControls: boolean;
     quickFilterColumns: string;
+    selectedNode: OTreeFlatNode;
     childreNodes: OTreeFlatNode[];
     nodesArray: OTreeFlatNode[];
     ancestors: any[];
@@ -107,6 +108,7 @@ export declare class OTreeComponent extends AbstractOServiceComponent<OTreeCompo
     protected getNodeId(item: any, parentNode: any): string;
     childQueryData(node: OTreeFlatNode): Observable<ServiceResponse> | Observable<any>;
     protected navigateToViewDetail(node: OTreeFlatNode): void;
+    isSelectedNode(node: OTreeFlatNode): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<OTreeComponent, [null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<OTreeComponent, "o-tree", never, { "oattr": "attr"; "service": "service"; "entity": "entity"; "columns": "columns"; "keys": "keys"; "parentKeys": "parent-keys"; "queryMethod": "query-method"; "insertButton": "insert-button"; "refreshButton": "refresh-button"; "deleteButton": "delete-button"; "visibleColumns": "visible-columns"; "selectAllCheckbox": "select-all-checkbox"; "separator": "separator"; "parentColumn": "parent-column"; "sortColumn": "sort-column"; "selectAllCheckboxVisible": "select-all-checkbox-visible"; "filterCaseSensitive": "filter-case-sensitive"; "quickFilter": "quick-filter"; "quickFilterPlaceholder": "quick-filter-placeholder"; "quickFilterColumns": "quick-filter-columns"; "detailMode": "detail-mode"; "detailFormRoute": "detail-form-route"; "showButtonsText": "show-buttons-text"; "rootTitle": "root-title"; "recursive": "recursive"; "route": "route"; }, { "onNodeSelected": "onNodeSelected"; "onNodeExpanded": "onNodeExpanded"; "onNodeCollapsed": "onNodeCollapsed"; "onLoadNextLevel": "onLoadNextLevel"; "onDataLoaded": "onDataLoaded"; "onNodeClick": "onNodeClick"; }, ["leafNodeTemplate", "parentNodeTemplate", "nodeTemplate", "treeNode"], ["[o-tree-button]"], false, never>;
 }

package/lib/interfaces/app-menu.interface.d.ts

@@ -6,6 +6,7 @@ export interface MenuCommonItem {
     id: string;
     name: string;
     tooltip?: string;
+    svgIcon?: string;
     icon?: string;
     class?: string;
 }

package/lib/layouts/card-menu-layout/o-card-menu-layout.component.d.ts

@@ -1,7 +1,9 @@
 import { AfterViewInit, ChangeDetectorRef, Injector, OnDestroy } from '@angular/core';
 import { Subscription } from 'rxjs';
+import { PermissionsService } from '../../services';
 import { AppMenuService } from '../../services/app-menu.service';
 import { OTranslateService } from '../../services/translate/o-translate.service';
+import { OPermissions } from '../../types';
 import { MenuRootItem } from '../../types/menu-root-item.type';
 import * as i0 from "@angular/core";
 export declare const DEFAULT_INPUTS_O_MENU_LAYOUT: string[];
@@ -15,13 +17,19 @@ export declare class OCardMenuLayoutComponent implements AfterViewInit, OnDestro
     protected menuRoots: MenuRootItem[];
     protected cardItemsArray: MenuRootItem[];
     protected parentMenuId: string;
+    protected excludeMenusId: string;
+    protected permissions: OPermissions;
+    protected permissionsService: PermissionsService;
+    protected parentMenuIds: string[];
+    protected excludeIds: string[];
+    hidden: boolean;
     constructor(injector: Injector, cd: ChangeDetectorRef);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     setCardMenuItems(): void;
     get cardItems(): MenuRootItem[];
     set cardItems(val: MenuRootItem[]);
-    protected getItemsFilteredByParentId(array: MenuRootItem[]): MenuRootItem[];
+    protected getItemsFilteredByParentId(array: MenuRootItem[], parentMenuIds: string[]): MenuRootItem[];
     static ɵfac: i0.ɵɵFactoryDeclaration<OCardMenuLayoutComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<OCardMenuLayoutComponent, "o-card-menu-layout", never, { "parentMenuId": "parent-menu-id"; }, {}, never, ["o-card-menu-item"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<OCardMenuLayoutComponent, "o-card-menu-layout", never, { "parentMenuId": "parent-menu-id"; "excludeMenusId": "exclude-menus-id"; }, {}, never, ["o-card-menu-item"], false, never>;
 }

package/lib/services/ontimize-export-data-base-provider.service.d.ts

@@ -13,6 +13,7 @@ export declare class OntimizeExportDataBaseProviderService {
     filter: any;
     constructor(injector: Injector);
     initializeProvider(table: OTableBase): void;
+    protected getFilterWithBasicExpression(): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<OntimizeExportDataBaseProviderService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<OntimizeExportDataBaseProviderService>;
 }

package/ontimize.scss

@@ -21,7 +21,7 @@ $layout-gutter-width: ($baseline-grid * 2) !default;
 
   [layout-padding]>[flex-sm],
   [layout-padding]>[flex-lt-md] {
-    padding: math.div($layout-gutter-width, 4);
+    padding: calc($layout-gutter-width / 4);
   }
 
   [layout-padding],
@@ -29,17 +29,17 @@ $layout-gutter-width: ($baseline-grid * 2) !default;
   [layout-padding]>[flex-gt-sm],
   [layout-padding]>[flex-md],
   [layout-padding]>[flex-lt-lg] {
-    padding: math.div($layout-gutter-width, 2);
+    padding: calc($layout-gutter-width / 2);
   }
 
   [layout-padding]>[flex-gt-md],
   [layout-padding]>[flex-lg] {
-    padding: math.div($layout-gutter-width, 1);
+    padding: $layout-gutter-width
   }
 
   [layout-margin]>[flex-sm],
   [layout-margin]>[flex-lt-md] {
-    margin: math.div($layout-gutter-width, 4);
+    margin: calc($layout-gutter-width / 4);
   }
 
   [layout-margin],
@@ -47,13 +47,13 @@ $layout-gutter-width: ($baseline-grid * 2) !default;
   [layout-margin]>[flex-gt-sm],
   [layout-margin]>[flex-md],
   [layout-margin]>[flex-lt-lg] {
-    margin: math.div($layout-gutter-width, 2);
+    margin: calc($layout-gutter-width / 2);
   }
 
   [layout-margin]>[flex-gt-md],
   [layout-margin]>[flex-lg] {
-    margin: math.div($layout-gutter-width, 1);
-    }
+    margin: $layout-gutter-width;
+  }
 
     [layout-wrap] {
       flex-wrap: wrap;
@@ -65,17 +65,17 @@ $layout-gutter-width: ($baseline-grid * 2) !default;
   }
 
   @include layout-padding-margin();
-$display-1-font-size-base: rem(3.400) !default;
-$display-4-font-size-base: rem(11.20) !default;
-$display-3-font-size-base: rem(5.600) !default;
-$display-2-font-size-base: rem(4.500) !default;
+$display-1-font-size-base: 3.400rem !default;
+$display-4-font-size-base: 11.20rem !default;
+$display-3-font-size-base: 5.600rem !default;
+$display-2-font-size-base: 4.500rem !default;
 
-$headline-font-size-base: rem(2.400) !default;
-$title-font-size-base: rem(2.000) !default;
-$subhead-font-size-base: rem(1.600) !default;
+$headline-font-size-base: 2.400rem !default;
+$title-font-size-base: 2.000rem !default;
+$subhead-font-size-base: 1.600rem !default;
 
 // $body-font-size-base: rem(1.400) !default;
-$caption-font-size-base: rem(1.200) !default;
+$caption-font-size-base: 1.200rem !default;
 
 // Layout
 // $baseline-grid: 8px !default;
@@ -258,17 +258,17 @@ input {
 // [3] Prevent iOS text size adjust after orientation change, without disabling user zoom
 // [4] Fonts on OSX will look more consistent with other systems that do not
 // render text using sub-pixel anti-aliasing.
-$display-1-font-size-base: rem(3.400) !default;
-$display-4-font-size-base: rem(11.20) !default;
-$display-3-font-size-base: rem(5.600) !default;
-$display-2-font-size-base: rem(4.500) !default;
+$display-1-font-size-base: 3.400rem !default;
+$display-4-font-size-base: 11.20rem !default;
+$display-3-font-size-base: 5.600rem !default;
+$display-2-font-size-base: 4.500rem !default;
 
-$headline-font-size-base: rem(2.400) !default;
-$title-font-size-base: rem(2.000) !default;
-$subhead-font-size-base: rem(1.600) !default;
+$headline-font-size-base: 2.400rem !default;
+$title-font-size-base: 2.000rem !default;
+$subhead-font-size-base: 1.600rem !default;
 
 // $body-font-size-base: rem(1.400) !default;
-$caption-font-size-base: rem(1.200) !default;
+$caption-font-size-base: 1.200rem !default;
 
 // Layout
 // $baseline-grid: 8px !default;
@@ -337,19 +337,19 @@ html, body {
 .mat-headline-3 {
   font-size: $display-2-font-size-base;
   font-weight: 400;
-  line-height: rem(6.4);
+  line-height: 6.4rem;
 }
 
 .mat-headline-4 {
   font-size: $display-1-font-size-base;
   font-weight: 400;
-  line-height: rem(4);
+  line-height: 4rem;
 }
 
 .mat-headline-5 {
   font-size: $headline-font-size-base;
   font-weight: 400;
-  line-height: rem(3.2);
+  line-height: 3.2rem;
 }
 
 
@@ -380,17 +380,18 @@ input {
  .material-icons{
   font-feature-settings:"liga"
  }
-$display-1-font-size-base: rem(3.400) !default;
-$display-4-font-size-base: rem(11.20) !default;
-$display-3-font-size-base: rem(5.600) !default;
-$display-2-font-size-base: rem(4.500) !default;
 
-$headline-font-size-base: rem(2.400) !default;
-$title-font-size-base: rem(2.000) !default;
-$subhead-font-size-base: rem(1.600) !default;
+$display-1-font-size-base: 3.400rem !default;
+$display-4-font-size-base: 11.20rem !default;
+$display-3-font-size-base: 5.600rem !default;
+$display-2-font-size-base: 4.500rem !default;
+
+$headline-font-size-base: 2.400rem !default;
+$title-font-size-base: 2.000rem !default;
+$subhead-font-size-base: 1.600rem !default;
 
 // $body-font-size-base: rem(1.400) !default;
-$caption-font-size-base: rem(1.200) !default;
+$caption-font-size-base: 1.200rem !default;
 
 // Layout
 // $baseline-grid: 8px !default;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ontimize-web-ngx",
   "homepage": "https://github.com/OntimizeWeb/ontimize-web-ngx#readme",
-  "version": "15.0.3",
+  "version": "15.0.4",
   "description": "Ontimize Web framework using Angular 15",
   "bugs": "https://github.com/OntimizeWeb/ontimize-web-ngx/issues",
   "author": "Imatia S.L.",

package/theme.scss

@@ -1077,7 +1077,7 @@ $layout-gutter-width-horizontal: 14px !default;
   $warn: map.get($theme, warn);
   $background: map.get($theme, background);
   $foreground: map.get($theme, foreground);
-
+  $is-dark-theme: map-get($theme, is-dark);
   $color-inactive: #999999;
 
   /*
@@ -1095,6 +1095,27 @@ $layout-gutter-width-horizontal: 14px !default;
 * styles
 */
   .md-drppicker {
+    .calendar {
+
+      td,
+      th {
+        color: mat.get-color-from-palette($foreground, text);
+
+        &.in-range {
+          color: if($is-dark-theme, #000000, #fff);
+        }
+
+        &.available {
+          &.prev {
+            background-image: if($is-dark-theme, url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCiAgPGc+DQogICAgPHBhdGggZD0iTTMuNywwLjdMMS40LDNsMi4zLDIuM0wzLDZMMCwzbDMtM0wzLjcsMC43eiIgZmlsbD0iI0ZGRkZGRiIvPg0KICA8L2c+DQo8L3N2Zz4="), url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K"));
+          }
+
+          &.next {
+            background-image: if($is-dark-theme, url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiIGZpbGw9IiNGRkZGRkYiIC8+DQo8L2c+DQo8L3N2Zz4NCg=="), url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K"));
+          }
+        }
+      }
+    }
 
     background-color: mat.get-color-from-palette($background, card);
 
@@ -1250,6 +1271,8 @@ $layout-gutter-width-horizontal: 14px !default;
 }@mixin o-hour-input-theme($theme-or-color-config) {
   $theme: map.get($theme-or-color-config, color);
   $primary: map.get($theme, primary);
+  $background: map.get($theme, background);
+  $is-dark-theme: map.get($theme, is-dark);
 
   ngx-material-timepicker-container ngx-material-timepicker-content {
     .timepicker__header {
@@ -1257,10 +1280,11 @@ $layout-gutter-width-horizontal: 14px !default;
     }
 
     .clock-face {
+      background-color: mat.get-color-from-palette($background, level-1);
+
       .clock-face__container {
         .clock-face__number>span.active {
           background-color: mat.get-color-from-palette($primary);
-          color: #fff;
         }
       }
 
@@ -1281,6 +1305,14 @@ $layout-gutter-width-horizontal: 14px !default;
       color: mat.get-color-from-palette($primary);
     }
 
+    .timepicker__actions {
+      background-color: if($is-dark-theme, mat.get-color-from-palette($background, background), mat.get-color-from-palette($background, level-1)) !important;
+    }
+
+    .timepicker__body {
+      background-color: if($is-dark-theme, mat.get-color-from-palette($background, background), mat.get-color-from-palette($background, level-1)) !important;
+    }
+
     .timepicker-dial__control {
       outline: none;
     }

package/theming/ontimize-style.scss

@@ -2,11 +2,11 @@
 @use "sass:map";
 @use 'fonts/poppins.scss';
 @use 'styles/ontimize/variables.scss';
-@use '@angular/material'as mat;
+@use '@angular/material' as mat;
 @use '@angular/cdk';
 @use 'styles/ontimize/typography-ontimize.scss';
-@use 'typography/ontimize.scss'as ontimize;
-@use 'ontimize-style-v8.scss'as ontimize-style;
+@use 'typography/ontimize.scss' as ontimize;
+@use 'ontimize-style-v8.scss' as ontimize-style;
 
 /*Sidenav background-color*/
 $sidenav-background-color: #f5f5f5;
@@ -42,7 +42,8 @@ $sidenav-background-color: #f5f5f5;
 }
 
 // Foreground palette for light themes.
-$ontimize-light-theme-foreground: (base: rgba(black, 0.6),
+$ontimize-light-theme-foreground: (
+  base: rgba(black, 0.6),
   divider: rgba(black, 0.12),
   dividers: rgba(black, 0.12),
   disabled: rgba(black, 0.38),
@@ -58,10 +59,12 @@ $ontimize-light-theme-foreground: (base: rgba(black, 0.6),
   slider-min: rgba(black, 0.38),
   slider-off: rgba(black, 0.38),
   slider-off-active: rgba(black, 0.38),
-  button: rgba(black, 0.74));
+  button: rgba(black, 0.74)
+);
 
 // Foreground palette for dark themes.
-$ontimize-dark-theme-foreground: (base: rgba(white, 0.6),
+$ontimize-dark-theme-foreground: (
+  base: rgba(white, 0.6),
   divider: rgba(white, 0.12),
   dividers: rgba(white, 0.12),
   disabled: rgba(white, 0.38),
@@ -77,7 +80,8 @@ $ontimize-dark-theme-foreground: (base: rgba(white, 0.6),
   slider-min: rgba(white, 0.38),
   slider-off: rgba(white, 0.38),
   slider-off-active: rgba(white, 0.38),
-  button: rgba(white, 0.74));
+  button: rgba(white, 0.74)
+);
 
 
 // Creates a container object for a light theme to be given to individual component theme mixins.
@@ -524,6 +528,13 @@ $ontimize-dark-theme-foreground: (base: rgba(white, 0.6),
 
   }
 
+  .o-tree {
+    .selected-node {
+      color: mat.get-color-from-palette($primary, 500);
+      font-weight: 800;
+    }
+  }
+
   .o-table {
     .o-table-quickfilter .quickFilter .mat-form-field .mat-mdc-text-field-wrapper .mat-form-field-flex .mat-form-field-prefix div {
       border-color: mat.get-color-from-palette($foreground, text, 0.32);