@sumaris-net/ngx-components 1.23.54 → 2.0.0-rc10

package/src/app/social/message/message.service.d.ts

@@ -5,6 +5,7 @@ import { BaseGraphqlService } from '../../core/services/base-graphql-service.cla
 import { Environment } from '../../../environments/environment.class';
 import { Message, MessageFilter } from './message.model';
 import { ShowToastOptions } from '../../shared/toast/toasts';
+import * as i0 from "@angular/core";
 export declare class MessageService extends BaseGraphqlService<Message, MessageFilter> {
     protected graphql: GraphqlService;
     protected translate: TranslateService;
@@ -21,4 +22,6 @@ export declare class MessageService extends BaseGraphqlService<Message, MessageF
         showToast?: boolean;
     }): Promise<boolean>;
     protected showToast(opts: ShowToastOptions): Promise<import("@ionic/core").OverlayEventDetail<any>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MessageService, [null, null, null, { optional: true; }]>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<MessageService>;
 }

package/src/app/social/social.module.d.ts

@@ -1,5 +1,12 @@
 import { InjectionToken } from '@angular/core';
 import { JobProgressionOptions } from './job/progression/job-progression.icon';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "../core/core.module";
+import * as i3 from "../shared/shared.module";
+import * as i4 from "./user-event/user-event.module";
+import * as i5 from "./job/job.module";
+import * as i6 from "./message/message.module";
 export interface SocialModuleOptions {
     showUserEventNotification: boolean;
     showJobProgression: boolean;
@@ -7,4 +14,7 @@ export interface SocialModuleOptions {
 }
 export declare const SocialModuleOptionsToken: InjectionToken<SocialModuleOptions>;
 export declare class SocialModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SocialModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SocialModule, never, [typeof i1.CommonModule, typeof i2.CoreModule, typeof i3.SharedModule, typeof i4.UserEventModule, typeof i5.JobModule, typeof i6.MessageModule], [typeof i4.UserEventModule, typeof i5.JobModule, typeof i6.MessageModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SocialModule>;
 }

package/src/app/social/social.testing.module.d.ts

@@ -1,4 +1,13 @@
 import { TestingPage } from '../shared/testing/tests.page';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@ngx-translate/core";
+import * as i3 from "@angular/router";
+import * as i4 from "./job/testing/job.testing.module";
+import * as i5 from "./user-event/testing/user-event.testing.module";
 export declare const SOCIAL_TESTING_PAGES: TestingPage[];
 export declare class SocialTestingModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SocialTestingModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SocialTestingModule, never, [typeof i1.CommonModule, typeof i2.TranslateModule, typeof i3.RouterModule, typeof i4.JobTestingModule, typeof i5.UserEventTestingModule], never>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SocialTestingModule>;
 }

package/src/app/social/user-event/notification/user-event-notification.icon.d.ts

@@ -4,6 +4,7 @@ import { PopoverController } from '@ionic/angular';
 import { IUserEventService } from '../user-event.service';
 import { IUserEvent, IUserEventFilter } from '../user-event.model';
 import { AccountService } from '../../../core/services/account.service';
+import * as i0 from "@angular/core";
 export declare class UserEventNotificationIcon implements OnInit, OnDestroy {
     userEventService: IUserEventService<IUserEvent<any>, IUserEventFilter<any>>;
     protected accountService: AccountService;
@@ -21,6 +22,8 @@ export declare class UserEventNotificationIcon implements OnInit, OnDestroy {
     private _readEvents;
     constructor(userEventService: IUserEventService<IUserEvent<any>, IUserEventFilter<any>>, accountService: AccountService, popoverController: PopoverController, cd: ChangeDetectorRef);
     ngOnInit(): Promise<void>;
-    showList(event: UIEvent): Promise<void>;
+    showList(event: Event): Promise<void>;
     ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserEventNotificationIcon, [{ optional: true; }, null, null, null]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UserEventNotificationIcon, "app-user-event-notification-icon", never, { "debug": "debug"; "titleI18n": "titleI18n"; "disabled": "disabled"; "filter": "filter"; "autoHide": "autoHide"; }, {}, never, never, false>;
 }

package/src/app/social/user-event/notification/user-event-notification.list.d.ts

@@ -6,6 +6,7 @@ import { IUserEventService } from '../user-event.service';
 import { LocalSettingsService } from '../../../core/services/local-settings.service';
 import { FetchMoreFn, LoadResult } from '../../../shared/services/entity-service.class';
 import { SortDirection } from '@angular/material/sort';
+import * as i0 from "@angular/core";
 export interface UserEventNotificationListOptions<E extends IUserEvent<any> = IUserEvent<any>, F extends IUserEventFilter<any> = IUserEventFilter<any>> {
     debug?: boolean;
     titleI18n?: string;
@@ -42,11 +43,11 @@ export declare class UserEventNotificationList<E extends IUserEvent<any> = IUser
     constructor(cd: ChangeDetectorRef, popoverController: PopoverController, settings: LocalSettingsService, userEventService: IUserEventService<E, IUserEventFilter<any>>);
     ngOnInit(): void;
     ngOnDestroy(): void;
-    click(event: UIEvent, userEvent: E): void;
+    click(event: Event, userEvent: E): void;
     isDefaultAction(action: IUserEventAction): boolean;
-    markAsRead(event: UIEvent, userEvent: E): void;
-    markAllAsRead(event: UIEvent): void;
-    executeAction(event: UIEvent, action: IUserEventAction, userEvent: IUserEvent<any>): Promise<void>;
+    markAsRead(event: Event, userEvent: E): void;
+    markAllAsRead(event: Event): void;
+    executeAction(event: Event, action: IUserEventAction, userEvent: IUserEvent<any>): Promise<void>;
     dismiss(): void;
     fetchMore(event?: CustomEvent & {
         target?: EventTarget & {
@@ -56,4 +57,6 @@ export declare class UserEventNotificationList<E extends IUserEvent<any> = IUser
     trackByFn(index: number, item: E): number;
     protected initInfiniteScroll(threshold?: string): Promise<void>;
     protected markForCheck(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserEventNotificationList<any, any>, [null, null, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UserEventNotificationList<any, any>, "app-user-event-notification-list", never, { "debug": "debug"; "mobile": "mobile"; "titleI18n": "titleI18n"; "sortBy": "sortBy"; "sortDirection": "sortDirection"; "filter": "filter"; "enableInfiniteScroll": "enableInfiniteScroll"; "pageSize": "pageSize"; }, { "readEvent": "readEvent"; "readEvents": "readEvents"; }, never, never, false>;
 }

package/src/app/social/user-event/testing/user-event.testing.d.ts

@@ -5,6 +5,7 @@ import { TranslateService } from '@ngx-translate/core';
 import { UserEventTestService } from './user-event.testing.service';
 import { UserEventNotificationIcon } from '../notification/user-event-notification.icon';
 import { UserEventTest } from './user-event.testing.model';
+import * as i0 from "@angular/core";
 export declare class UserEventTestingPage implements OnDestroy {
     protected userEventService: UserEventTestService;
     protected router: Router;
@@ -28,4 +29,6 @@ export declare class UserEventTestingPage implements OnDestroy {
     addRandom(value: number): void;
     addNotificationWithDefaultAction(): void;
     protected showMessage(text: string): Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserEventTestingPage, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UserEventTestingPage, "job-progression-testing", never, {}, {}, never, never, false>;
 }

package/src/app/social/user-event/testing/user-event.testing.model.d.ts

@@ -34,6 +34,7 @@ export declare class UserEventTestFilter extends EntityFilter<UserEventTestFilte
     issuers: string[];
     recipients: string[];
     startDate: Moment;
+    includedIds: number[];
     excludeRead: boolean;
     fromObject(source: any, opts?: any): void;
     protected buildFilter(): FilterFn<UserEventTest>[];

package/src/app/social/user-event/testing/user-event.testing.module.d.ts

@@ -1,2 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./user-event.testing";
+import * as i2 from "@angular/common";
+import * as i3 from "@ngx-translate/core";
+import * as i4 from "../../../shared/shared.module";
+import * as i5 from "../user-event.module";
 export declare class UserEventTestingModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserEventTestingModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<UserEventTestingModule, [typeof i1.UserEventTestingPage], [typeof i2.CommonModule, typeof i3.TranslateModule, typeof i4.SharedModule, typeof i5.UserEventModule], [typeof i1.UserEventTestingPage]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<UserEventTestingModule>;
 }

package/src/app/social/user-event/testing/user-event.testing.service.d.ts

@@ -9,6 +9,7 @@ import { FetchPolicy } from '@apollo/client/core';
 import { EntityServiceLoadOptions, LoadResult } from '../../../shared/services/entity-service.class';
 import { SortDirection } from '@angular/material/sort';
 import { UserEventTest, UserEventTestFilter } from './user-event.testing.model';
+import * as i0 from "@angular/core";
 export declare class UserEventTestService extends AbstractUserEventService<UserEventTest, UserEventTestFilter> {
     protected graphql: GraphqlService;
     protected accountService: AccountService;
@@ -19,7 +20,7 @@ export declare class UserEventTestService extends AbstractUserEventService<UserE
     private $newUserEvents;
     constructor(graphql: GraphqlService, accountService: AccountService, network: NetworkService, translate: TranslateService, environment: Environment);
     fromObject(source: any): UserEventTest;
-    add(entity: UserEventTest): Promise<void>;
+    add(entity: UserEventTest): Promise<UserEventTest>;
     asFilter(filter: Partial<any>): any;
     count(filter: any, options?: {
         fetchPolicy?: FetchPolicy;
@@ -32,6 +33,9 @@ export declare class UserEventTestService extends AbstractUserEventService<UserE
     }): Observable<any[]>;
     save(entity: any, options?: EntityServiceLoadOptions): Promise<any>;
     saveAll(data: any[], opts?: any): Promise<any[]>;
+    protected defaultRecipient(): any;
     watchAll(offset: number, size: number, sortBy?: string, sortDirection?: SortDirection, filter?: Partial<any>, opts?: UserEventWatchOptions): Observable<LoadResult<any>>;
     loadAll(offset: number, size: number, sortBy?: string, sortDirection?: SortDirection, filter?: Partial<any>, opts?: UserEventLoadOptions): Promise<LoadResult<any>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserEventTestService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<UserEventTestService>;
 }

package/src/app/social/user-event/user-event.model.d.ts

@@ -3,7 +3,7 @@ import { Entity, IEntity } from '../../core/services/model/entity.model';
 import { IEntityFilter } from '../../core/services/model/filter.model';
 import { AppColors, IconRef } from '../../shared/types';
 export declare type EventLevel = 'ERROR' | 'WARNING' | 'INFO' | 'DEBUG';
-export interface IUserEvent<E extends Entity<E>, U = string, L = EventLevel> extends IEntity<E> {
+export interface IUserEvent<E extends Entity<E, ID>, ID = number, U = string, L = EventLevel> extends IEntity<E, ID> {
     issuer: U;
     recipient: U;
     type: string;
@@ -19,12 +19,13 @@ export interface IUserEvent<E extends Entity<E>, U = string, L = EventLevel> ext
     icon?: IconRef;
     actions?: IUserEventAction[];
 }
-export interface IUserEventFilter<E extends IUserEvent<E, U, L>, U = string, L = EventLevel> extends IEntityFilter<any, E> {
+export interface IUserEventFilter<E extends IUserEvent<E, ID, U, L>, ID = number, U = string, L = EventLevel> extends IEntityFilter<any, E> {
     types: string[];
     levels: L[];
     issuers: U[];
     recipients: U[];
     startDate: Moment;
+    includedIds: ID[];
     excludeRead: boolean;
 }
 export interface IUserEventAction {

package/src/app/social/user-event/user-event.module.d.ts

@@ -1,2 +1,12 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./notification/user-event-notification.icon";
+import * as i2 from "./notification/user-event-notification.list";
+import * as i3 from "@angular/common";
+import * as i4 from "../../shared/shared.module";
+import * as i5 from "../../core/icon/icon.module";
+import * as i6 from "ngx-jdenticon";
 export declare class UserEventModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserEventModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<UserEventModule, [typeof i1.UserEventNotificationIcon, typeof i2.UserEventNotificationList], [typeof i3.CommonModule, typeof i4.SharedModule, typeof i5.AppIconModule, typeof i6.NgxJdenticonModule], [typeof i1.UserEventNotificationIcon]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<UserEventModule>;
 }

package/src/app/social/user-event/user-event.service.d.ts

@@ -11,7 +11,8 @@ import { NetworkService } from '../../core/services/network.service';
 import { BaseGraphqlService, BaseGraphqlServiceOptions } from '../../core/services/base-graphql-service.class';
 import { Moment } from 'moment';
 import { IStartableService } from '../../shared/services/startable-service.class';
-export declare const APP_USER_EVENT_SERVICE: InjectionToken<IUserEventService<any, any, UserEventWatchOptions, UserEventLoadOptions>>;
+import * as i0 from "@angular/core";
+export declare const APP_USER_EVENT_SERVICE: InjectionToken<IUserEventService<any, any, number, UserEventWatchOptions, UserEventLoadOptions>>;
 export declare interface UserEventLoadOptions extends EntitiesServiceLoadOptions {
     withContent?: boolean;
 }
@@ -32,7 +33,7 @@ export interface IUserEventSubscriptions {
     listenAllChanges: any;
     listenCountChanges?: any;
 }
-export interface IUserEventListener<E extends IUserEvent<E>> {
+export interface IUserEventListener<E extends IUserEvent<E, ID>, ID = number> {
     accept: (E: any) => boolean;
     onReceived?: (E: any) => Promise<E> | E | undefined;
     onRead?: (E: any) => Promise<void> | void;
@@ -42,9 +43,10 @@ export interface UserEventServiceOptions<Q extends IUserEventQueries = IUserEven
     mutations?: Partial<M>;
     subscriptions?: Partial<S>;
 }
-export interface IUserEventService<E extends IUserEvent<E>, F extends IUserEventFilter<E>, WO extends UserEventWatchOptions = UserEventWatchOptions, LO extends UserEventLoadOptions = UserEventLoadOptions> extends IEntitiesService<E, F, WO>, IStartableService {
+export interface IUserEventService<E extends IUserEvent<E, ID>, F extends IUserEventFilter<E, ID>, ID = number, WO extends UserEventWatchOptions = UserEventWatchOptions, LO extends UserEventLoadOptions = UserEventLoadOptions> extends IEntitiesService<E, F, WO>, IStartableService {
     countSubject: Observable<number>;
-    add(entity: E): any;
+    add(entity: E): Promise<E>;
+    load(id: ID, opts?: LO): Promise<E>;
     count(filter: Partial<F>, options?: {
         fetchPolicy?: FetchPolicy;
     }): Promise<number>;
@@ -59,10 +61,10 @@ export interface IUserEventService<E extends IUserEvent<E>, F extends IUserEvent
     save(entity: E, options?: EntityServiceLoadOptions): Promise<E>;
     delete(entity: E): Promise<any>;
     markAllAsRead(entities: E[]): any;
-    registerListener(listener: IUserEventListener<E>): any;
+    registerListener(listener: IUserEventListener<E, ID>): any;
     resetCount(): any;
 }
-export declare abstract class AbstractUserEventService<E extends IUserEvent<E, any>, F extends IUserEventFilter<E, any>, WO extends UserEventWatchOptions = UserEventWatchOptions, LO extends UserEventLoadOptions = UserEventLoadOptions, Q extends IUserEventQueries = IUserEventQueries, M extends IUserEventMutations = IUserEventMutations, S extends IUserEventSubscriptions = IUserEventSubscriptions> extends BaseGraphqlService<E, F> implements IUserEventService<E, F, WO, LO>, OnDestroy {
+export declare abstract class AbstractUserEventService<E extends IUserEvent<E, ID>, F extends IUserEventFilter<E, ID>, ID = number, WO extends UserEventWatchOptions = UserEventWatchOptions, LO extends UserEventLoadOptions = UserEventLoadOptions, Q extends IUserEventQueries = IUserEventQueries, M extends IUserEventMutations = IUserEventMutations, S extends IUserEventSubscriptions = IUserEventSubscriptions> extends BaseGraphqlService<E, F, ID> implements IUserEventService<E, F, ID, WO, LO>, OnDestroy {
     protected graphql: GraphqlService;
     protected accountService: AccountService;
     protected network: NetworkService;
@@ -73,7 +75,7 @@ export declare abstract class AbstractUserEventService<E extends IUserEvent<E, a
     protected readonly subscriptions: Partial<S>;
     protected readonly _countSubject: BehaviorSubject<number>;
     protected resetCountDate: Moment;
-    protected listeners: IUserEventListener<E>[];
+    protected listeners: IUserEventListener<E, ID>[];
     private _subscriptions;
     private _listenSubscription;
     get countSubject(): Subject<number>;
@@ -85,7 +87,8 @@ export declare abstract class AbstractUserEventService<E extends IUserEvent<E, a
     watchAll(offset: number, size: number, sortBy?: string, sortDirection?: SortDirection, filter?: Partial<F>, options?: WO): Observable<LoadResult<E>>;
     watchPage(page: Page, filter?: Partial<F>, opts?: WO): Observable<LoadResult<E>>;
     loadPage(page: Page, filter?: Partial<F>, opts?: LO): Promise<LoadResult<E>>;
-    add(entity: E): Promise<void>;
+    load(id: ID, opts?: LO): Promise<E>;
+    add(entity: E): Promise<E>;
     count(filter: Partial<F>, options?: {
         fetchPolicy?: FetchPolicy;
     }): Promise<number>;
@@ -103,17 +106,19 @@ export declare abstract class AbstractUserEventService<E extends IUserEvent<E, a
     save(entity: E, options?: EntityServiceLoadOptions): Promise<E>;
     saveAll(entities: E[], opts?: any): Promise<E[]>;
     markAllAsRead(entities: E[]): Promise<void>;
-    registerListener(listener: IUserEventListener<E>): void;
+    registerListener(listener: IUserEventListener<E, ID>): void;
     resetCount(): void;
     protected onLogin(): Promise<void>;
     protected onLogout(): void;
     protected startListenCountChanges(): void;
     protected stopListenCountChanges(): void;
-    protected processUserEvent(source: any, that?: AbstractUserEventService<E, F>): Promise<E>;
+    protected processUserEvent(source: any): Promise<E>;
     protected defaultMarkAsRead(userEvents: E[]): Promise<void>;
     protected defaultFilter(): F;
-    protected defaultRecipient(): any;
+    protected abstract defaultRecipient(): any;
     protected fillDefaultProperties(entity: E): void;
     protected unreadEvents(events: E[]): number;
     protected copyIdAndUpdateDate(source: E, target: E): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AbstractUserEventService<any, any, any, any, any, any, any, any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AbstractUserEventService<any, any, any, any, any, any, any, any>, never, never, {}, {}, never, never, false>;
 }

package/src/assets/i18n/fr.json

@@ -44,8 +44,8 @@
     "BTN_SEND": "Envoyer",
     "BTN_OPTIONS": "Options",
     "BTN_UNDO": "Annuler les modifications",
-    "BTN_TABLE_EDIT": "Editer dans le tableau",
-    "BTN_TABLE_OPEN": "Editer dans un formulaire",
+    "BTN_TABLE_EDIT": "Éditer dans le tableau",
+    "BTN_TABLE_OPEN": "Éditer dans un formulaire",
     "BTN_SHOW_HELP": "Aide en ligne",
     "BTN_HIDE": "Masquer",
     "BTN_HIDE_MENU": "Masquer le menu",
@@ -449,6 +449,13 @@
       "ERROR": "Erreur durant l'envoi de fichier"
     }
   },
+  "IMAGE": {
+    "BTN_CAMERA_SOURCE": "Prendre une photo",
+    "BTN_GALLERY_SOURCE": "Ouvrir la galerie",
+    "GALLERY": {
+      "BTN_ADD_TITLE": "Ajouter un titre"
+    }
+  },
   "ERROR": {
     "ALERT_HEADER": "Erreur",
     "FIELD_REQUIRED": "Champ obligatoire",

package/src/environments/environment.class.d.ts

@@ -1,6 +1,7 @@
 import { FetchPolicy } from '@apollo/client/core';
 import { StorageConfig } from '@ionic/storage';
 import { InjectionToken } from '@angular/core';
+import { CacheConfig } from 'ionic-cache/lib/interfaces/cache-config.interface';
 export declare const ENVIRONMENT: InjectionToken<Environment>;
 export declare class Environment {
     name: string;
@@ -29,6 +30,7 @@ export declare class Environment {
     defaultDepartmentId?: number;
     defaultAppName?: string;
     defaultAndroidInstallUrl?: string;
+    cache?: Partial<CacheConfig>;
     storage?: Partial<StorageConfig>;
     storageSavePeriodMs?: number;
     sourceUrl?: string;

package/src/environments/environment.d.ts

@@ -1,3 +1,3 @@
 import { Environment } from './environment.class';
+import 'zone.js/plugins/zone-error';
 export declare const environment: Environment;
-import 'zone.js/dist/zone-error';

package/src/theme/_icons.scss

@@ -13,7 +13,7 @@ $ionicons-font-path: $font-path !default;
 // Import material icons
 // --------------------------------------------------
 $material-design-icons-font-directory-path: '~material-design-icons-iconfont/dist/fonts/';
-@import '~material-design-icons-iconfont/src/material-design-icons';
+@import 'material-design-icons-iconfont/src/material-design-icons';
 
 mat-icon > span {
   position: absolute;

package/src/theme/_ionic.globals.scss

@@ -75,6 +75,10 @@ $ion-grid-padding: 16px !default;
 $ion-padding: 16px !default;
 $ion-margin: 16px !default;
 
+// Default height
+// --------------------------------------------------
+$ion-toolbar-height: 56px !default;
+
 // --------------------------------------------------
 // Default General Colors
 // --------------------------------------------------

package/src/theme/_material.globals.scss

@@ -1,9 +1,7 @@
 // --------------------------------------------------
 // Import material theme
 // --------------------------------------------------
-@import '~@angular/material/theming';
-@import '~@angular/material/paginator/paginator-variables';
-@import '~@angular/material/toolbar/toolbar-variables';
+@use '@angular/material' as mat;
 
 // Define the palettes for your theme using the Material Design palettes available in palette.scss
 // (imported above). For each palette, you can optionally specify a default, lighter, and darker
@@ -25,50 +23,52 @@ $mat-indigo-app: (
   A400: mix(#000, $accent, 12%),
   A700: mix(#000, $accent, 24%),
   contrast: (
-    50: $dark-primary-text,
-    100: $dark-primary-text,
-    200: $dark-primary-text,
-    300: $light-primary-text,
-    400: $light-primary-text,
-    500: $light-primary-text,
-    600: $light-primary-text,
-    700: $light-primary-text,
-    800: $light-primary-text,
-    900: $light-primary-text,
-    A100: $dark-primary-text,
-    A200: $light-primary-text,
-    A400: $light-primary-text,
-    A700: $light-primary-text
+    50: rgba(black, 0.87),
+    100: rgba(black, 0.87),
+    200: rgba(black, 0.87),
+    300: white,
+    400: white,
+    500: white,
+    600: white,
+    700: white,
+    800: white,
+    900: white,
+    A100: rgba(black, 0.87),
+    A200: white,
+    A400: white,
+    A700: white
   )
 );
-$mat-light-theme-background: (
-  status-bar: map_get($mat-grey, 300),
-  app-bar:    map_get($mat-grey, 100),
-  background: var(--background, map_get($mat-grey, 50)),
+mat.$light-theme-background-palette: (
+  status-bar: map_get(mat.$grey-palette, 300),
+  app-bar:    map_get(mat.$grey-palette, 100),
+  background: var(--background, map_get(mat.$grey-palette, 50)),
   hover:      rgba(black, 0.04), // TODO(kara): check style with Material Design UX
   card:       white,
   dialog:     white,
   disabled-button: rgba(black, 0.12),
   raised-button: white,
-  focused-button: $dark-focused,
-  selected-button: map_get($mat-grey, 300),
-  selected-disabled-button: map_get($mat-grey, 400),
-  disabled-button-toggle: map_get($mat-grey, 200),
-  unselected-chip: map_get($mat-grey, 300),
-  disabled-list-option: map_get($mat-grey, 200),
+  focused-button: rgba(black, 0.12),
+  selected-button: map_get(mat.$grey-palette, 300),
+  selected-disabled-button: map_get(mat.$grey-palette, 400),
+  disabled-button-toggle: map_get(mat.$grey-palette, 200),
+  unselected-chip: map_get(mat.$grey-palette, 300),
+  disabled-list-option: map_get(mat.$grey-palette, 200),
 );
 
 // FIXME: Why loader toolbar is so dark ?
-$candy-app-primary: mat-palette($mat-indigo-app, 500, 100, 900);
+$candy-app-primary: mat.define-palette($mat-indigo-app, 500, 100, 900);
 
-$candy-app-accent: mat-palette($mat-indigo-app, A200, A100, A400);
+$candy-app-accent: mat.define-palette($mat-indigo-app, A200, A100, A400);
 // The warn palette is optional (defaults to red).
-$candy-app-warn: mat-palette($mat-red);
+$candy-app-warn: mat.define-palette(mat.$red-palette);
 // Create the theme object (a Sass map containing all of the palettes).
-$candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent, $candy-app-warn);
+$candy-app-theme: mat.define-light-theme($candy-app-primary, $candy-app-accent, $candy-app-warn);
 
 
-// Expose some existing variables
+// Expose some variables
 $mat-tab-link-height: 48px !default;
 $mat-tab-bar-height: 48px !default;
 $mat-tab-animation-duration: 200ms !default;
+$mat-mat-toolbar-height-desktop: 64px !default;
+$mat-mat-toolbar-height-mobile: 56px !default;

package/src/theme/_material.scss

@@ -1,14 +1,15 @@
 
 // Plus imports for other components in your app.
+@use '@angular/material' as mat;
 // Include the common styles for Angular Material. We include this here so that you only
 // have to load a single css file for Angular Material in your app.
 // Be sure that you only ever include this mixin once!
-@include mat-core();
+@include mat.core();
 
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-@include angular-material-theme($candy-app-theme);
+@include mat.all-component-themes($candy-app-theme);
 
 // --------------------------------------------------
 // Override material style
@@ -39,18 +40,21 @@
 .mat-button.mat-accent,
 .mat-icon-button.mat-accent,
 .mat-stroked-button.mat-accent {
-  color: var(--ion-color-accent, $accent);
+  color: var(--ion-color-accent);
 }
 
 // Badge
 .mat-badge-primary .mat-badge-content {
-  background-color: var(--ion-color-tertiary, $tertiary);
+  background-color: var(--ion-color-tertiary);
+  color: var(--ion-color-tertiary-contrast);
 }
 .mat-badge-accent .mat-badge-content {
-  background-color: var(--ion-color-accent, $accent);
+  background-color: var(--ion-color-accent);
+  color: var(--ion-color-accent-contrast);
 }
 .mat-badge-warn .mat-badge-content {
-  background-color: var(--ion-color-warning, $warning);
+  background-color: var(--ion-color-warning);
+  color: var(--ion-color-warning-contrast);
 }
 
 // Progress bar
@@ -70,6 +74,28 @@
   }
 }
 
+// Date picker
+@media (orientation: landscape) {
+  .mat-datepicker-content-touch {
+    height: unset !important;
+    min-height: 80vh;
+
+    .mat-calendar-controls {
+      margin-top: 0;
+    }
+    .mat-datepicker-content-container {
+      &.mat-datepicker-content-container-with-actions {
+        height: unset !important;
+      }
+     .mat-datepicker-actions {
+       background-color: white;
+       margin-top: -12px;
+     }
+  }
+}
+
+}
+
 .mat-option {
   padding-top: var(--padding-top, 0) !important;
   padding-right: var(--padding-end, 16px) !important;

package/src/theme/_mixins.scss

@@ -102,9 +102,9 @@
   --expansion-panel-padding: var(--ion-padding);
   --expansion-panel-header-padding: var(--ion-padding);
 
-  --mat-toolbar-height: #{$mat-toolbar-height-desktop};
-  --mat-paginator-height: #{$mat-paginator-height};
-  --ion-toolbar-height: #{$mat-toolbar-height-mobile};
+  --mat-toolbar-height: #{$mat-mat-toolbar-height-desktop};
+  --mat-paginator-height: mat.$paginator-height;
+  --ion-toolbar-height: #{$ion-toolbar-height};
 
   --app-table-header-height: #{$app-table-header-height};
   --app-toolbar-height: #{$app-toolbar-height};
@@ -116,7 +116,7 @@
 }
 
 @mixin css-variables-to-root-mobile() {
-  --mat-toolbar-height: #{$mat-toolbar-height-mobile};
+  --mat-toolbar-height: #{$mat-mat-toolbar-height-mobile};
 
   // Disable form footer, in mobile
   --app-form-buttons-bar-height: 0px;

package/src/theme/_ngx-components.scss

@@ -1352,6 +1352,7 @@ ion-button[expand="full"],
 // --------------------------------------------------
 // Icon multiple
 // --------------------------------------------------
+ion-icon.icon-secondary,
 mat-icon.icon-secondary {
   position: absolute;
   left: 0;
@@ -1380,7 +1381,33 @@ ion-toast {
     --color: var(--ion-color-danger-contrast);
     --button-color: var(--ion-color-primary);
   }
+
+  /* -- workaround because toast animation failed */
+  --toast-max-height: 75px;
+
+  &.toast-stack-offset-1 {
+    --toast-stack-offset: 1;
+  }
+  &.toast-stack-offset-2 {
+    --toast-stack-offset: 2;
+  }
+  &.toast-stack-offset-3 {
+    --toast-stack-offset: 3;
+  }
+  &.toast-stack-offset-4 {
+    --toast-stack-offset: 4;
+  }
+
+  &.toast-stacked-top {
+    --toast-top: calc(var(--toast-stack-offset, 0) * var(--toast-max-height, 0));
+    transform: translateY(var(--toast-top));
+  }
+  &.toast-stacked-bottom {
+    --toast-bottom: calc(-1 * var(--toast-stack-offset, 0) * var(--toast-max-height, 0)) !important;
+    transform: translateY(var(--toast-bottom));
+  }
 }
+
 // --------------------------------------------------
 // Refresher
 // --------------------------------------------------

package/src/theme/_print.scss

@@ -0,0 +1,24 @@
+@media print {
+  @page {
+    margin: .4in;
+    size: A4 landscape;
+  }
+
+  @viewport {
+    orientation: landscape;
+  }
+
+  /* -- hidden elements -- */
+  .no-print,
+  #menu,
+  app-header,
+  ion-header {
+    visibility: hidden;
+    display: none;
+  }
+
+  /* -- Force page break -- */
+  .print-break {
+    page-break-after: always;
+  }
+}