@colijnit/sharedcomponents 261.1.0 → 261.1.2

package/src/app/app.module.ts

@@ -0,0 +1,100 @@
+import {APP_INITIALIZER, NgModule} from '@angular/core';
+import {BrowserModule} from '@angular/platform-browser';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {DocsignModule} from '../../projects/sharedcomponents/src/lib/components/docsign/docsign.module';
+import {KeyPadModule} from '../../projects/sharedcomponents/src/lib/components/key-pad/key-pad.module';
+import {LayoutSwitcherModule} from '../../projects/sharedcomponents/src/lib/components/layout-switcher/layout-switcher.module';
+import {CoLinearGaugeModule} from '../../projects/sharedcomponents/src/lib/components/linear-gauge/co-linear-gauge.module';
+import {SendMethodDialogModule} from '../../projects/sharedcomponents/src/lib/components/send-method-dialog/send-method-dialog.module';
+import {StatusbarModule} from '../../projects/sharedcomponents/src/lib/components/statusbar/statusbar.module';
+import {StockModule} from '../../projects/sharedcomponents/src/lib/components/stock/stock.module';
+import {SharedInitializerService} from '../../projects/sharedcomponents/src/lib/service/shared-initializer.service';
+import {AppComponent} from './app.component';
+import {DatePlanningModule} from '../../projects/sharedcomponents/src/lib/components/date-planning/date-planning.module';
+import {TagsModule} from '../../projects/sharedcomponents/src/lib/components/tags/tags.module';
+import {ScreenConfigGeneratorModule} from '../../projects/sharedcomponents/src/lib/components/screen-config-generator/screen-config-generator.module';
+import {LoginModule} from '../../projects/sharedcomponents/src/lib/components/login/login.module';
+import {BaseModuleScreenConfigService, BaseModuleService, CoreComponentsTranslationModule} from '@colijnit/corecomponents_v12';
+import {SimpleTagsModule} from '../../projects/sharedcomponents/src/lib/components/simple-tags/simple-tags.module';
+import {FilesUploadModule} from '../../projects/sharedcomponents/src/lib/components/files-upload/files-upload.module';
+import {FileUploadModule} from '../../projects/sharedcomponents/src/lib/components/file-upload/file-upload.module';
+import {TileRenderModule} from '../../projects/sharedcomponents/src/lib/components/tile-renderer/tile-render.module';
+import {MultiplePropertyTogglerModule} from '../../projects/sharedcomponents/src/lib/components/multi-property-toggler/multiple-property-toggler.module';
+import {ActivityListModule} from '../../projects/sharedcomponents/src/lib/components/activity-list/activity-list.module';
+import {ComponentActivityListModule} from '../../projects/sharedcomponents/src/lib/components/open-activity-list/component-activity-list.module';
+import {WorkflowInfoTilesModule} from '../../projects/sharedcomponents/src/lib/components/workflow-info-tiles/workflow-info-tiles.module';
+import {TaskCreatorModule} from '../../projects/sharedcomponents/src/lib/components/task-creator/task-creator.module';
+import {SharedComponentsTranslationModule} from '../../projects/sharedcomponents/src/lib/translation/shared-components-translation.module';
+import {AppScreenConfigService} from '@colijn/app/app-screen-config.service';
+import {AppModuleService} from '@colijn/app/app-module.service';
+import {PreferredPlanningModule} from '../../projects/sharedcomponents/src/lib/components/preferred-planning/preferred-planning.module';
+import {RouterModule, Routes} from '@angular/router';
+import {AppLoginComponent} from '@colijn/app/app-login.component';
+import {FormsTestComponent} from '../../projects/sharedcomponents/src/lib/components/form-builder/form-builder-user-form/components/forms-test-component/forms-test-component.component';
+import {FormsTestComponentModule} from '../../projects/sharedcomponents/src/lib/components/form-builder/form-builder-user-form/components/forms-test-component/forms-test-component.module';
+
+export const appRoutes: Routes = [
+  {
+    path: 'login',
+    component: AppLoginComponent,
+    pathMatch: 'full'
+  }
+];
+
+@NgModule({
+  imports: [
+    BrowserModule,
+    BrowserAnimationsModule,
+    RouterModule.forRoot(
+      appRoutes,
+      {enableTracing: false, relativeLinkResolution: 'legacy'}
+    ),
+    DocsignModule,
+    StockModule,
+    SendMethodDialogModule,
+    KeyPadModule,
+    LayoutSwitcherModule,
+    StatusbarModule,
+    CoLinearGaugeModule,
+    DatePlanningModule,
+    PreferredPlanningModule,
+    TagsModule,
+    ScreenConfigGeneratorModule,
+    LoginModule,
+    SimpleTagsModule,
+    FileUploadModule,
+    FilesUploadModule,
+    TileRenderModule,
+    MultiplePropertyTogglerModule,
+    ActivityListModule,
+    ComponentActivityListModule,
+    WorkflowInfoTilesModule,
+    TaskCreatorModule,
+    FormsTestComponentModule,
+    SharedComponentsTranslationModule,
+    CoreComponentsTranslationModule.forRoot()
+  ],
+  declarations: [
+    AppComponent,
+    AppLoginComponent
+  ],
+  exports: [],
+  providers: [
+    SharedInitializerService,
+    AppScreenConfigService,
+    AppModuleService,
+    {provide: BaseModuleService, useExisting: AppModuleService},
+    {provide: BaseModuleScreenConfigService, useExisting: AppScreenConfigService},
+    {
+      provide: APP_INITIALIZER,
+      useFactory: (ss: SharedInitializerService) => function () {
+        return ss.initializeApp();
+      },
+      deps: [SharedInitializerService],
+      multi: true
+    }
+  ],
+  bootstrap: [AppComponent]
+})
+export class AppModule {
+}

package/src/app/bundle/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>SharedComponents</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+</head>
+<body>
+</body>
+</html>

package/src/app/bundle/login/login-bundle.component.scss

@@ -0,0 +1,8 @@
+@import "~@colijnit/corecomponents_v12/lib/style/corecomponents-globals";
+@import "~@colijnit/corecomponents_v12/lib/components/button/style/material.scss";
+@import "~@colijnit/corecomponents_v12/lib/components/input-text/style/material.scss";
+@import "~@colijnit/corecomponents_v12/lib/components/input-checkbox/style/material.scss";
+@import "~@colijnit/corecomponents_v12/lib/components/co-dialog/style/material.scss";
+
+@import "projects/sharedcomponents/src/lib/style/sharedcomponents-globals";
+@import "projects/sharedcomponents/src/lib/components/login/style/material";

package/src/app/bundle/login/login-bundle.component.ts

@@ -0,0 +1,150 @@
+import {
+  ChangeDetectorRef,
+  Component,
+  EventEmitter,
+  HostBinding,
+  Input,
+  OnChanges,
+  OnDestroy,
+  Output,
+  SimpleChanges,
+  ViewEncapsulation
+} from '@angular/core';
+import {LoginComponentPageType} from '../../../../projects/sharedcomponents/src/lib/enum/login-component-page.type.enum';
+import {LoginResponse} from '@colijnit/ioneconnector/build/model/login-response';
+import {LanguageCode} from '@colijnit/ioneconnector/build/enum/language-code.enum';
+import {
+  SharedComponentsDictionaryService
+} from '../../../../projects/sharedcomponents/src/lib/translation/shared-components-dictionary.service';
+import {LoginService} from '../../../../projects/sharedcomponents/src/lib/components/login/service/login.service';
+import {LoginComponentExtraActionType} from '../../../../projects/sharedcomponents/src/lib/enum/login-component-extra-action-type.enum';
+
+@Component({
+  selector: 'ione-login',
+  template: `
+      <co-login *ngIf="loaded"
+                [username]="username"
+                [loginType]="logintype"
+                [reCaptchaSiteKey]="reCaptchaSiteKey"
+                [securityCode]="securitycode"
+                [extraAction]="extraaction"
+                [settings]="settings"
+                [upId]="upId"
+                [clientVersion]="clientVersion"
+                [clientLanguage]="clientLanguage"
+                (userLoggedIn)="userLoggedIn.emit($event)"
+                [bundleLogin]="true"
+                class="bundle-login"
+      ></co-login>
+  `,
+  styleUrls: ['./login-bundle.component.scss'],
+  encapsulation: ViewEncapsulation.None
+})
+export class LoginBundleComponent implements OnDestroy, OnChanges {
+  @Input()
+  public set settings(value: any) {
+    if (value) {
+      let settings: any;
+      if (typeof value === 'string') {
+        settings = JSON.parse(value);
+      } else {
+        settings = value;
+      }
+      this._setSettings(settings);
+    }
+  }
+
+  public get settings(): any {
+    return this._settings;
+  }
+
+  @Input()
+  public logintype: LoginComponentPageType = LoginComponentPageType.UserNameAndPasswordEntry;
+
+  @Input()
+  public username: string;
+
+  @Input()
+  public securitycode: string;
+
+  @Input()
+  public extraaction: LoginComponentExtraActionType;
+
+  @Input()
+  public set languagecode(value: LanguageCode) {
+    this._languageCode = value;
+    this._dictionaryService.setDictionary(this._languageCode);
+  }
+
+  public get languagecode(): LanguageCode {
+    return this._languageCode;
+  }
+
+  @Input()
+  public shouldShowLogin = async () => {
+    const response = this._loginService.checkAndPrepareKeycloak();
+    return response === null || response === undefined;
+  };
+
+  @Output()
+  public userLoggedIn: EventEmitter<LoginResponse> = new EventEmitter<LoginResponse>();
+
+  @HostBinding('class.ione-login')
+  public showClass: boolean = true;
+
+  public reCaptchaSiteKey: string;
+  public upId: number;
+  public clientVersion: string;
+  public clientLanguage: string;
+  public loaded: boolean = false;
+
+  private _settings: any;
+  private _languageCode: LanguageCode = LanguageCode.Dutch;
+
+  constructor(
+    private _changeDetector: ChangeDetectorRef,
+    private _dictionaryService: SharedComponentsDictionaryService,
+    private _loginService: LoginService
+  ) {
+    this._dictionaryService.setDictionary(this._languageCode);
+  }
+
+  ngOnDestroy() {
+    this._changeDetector = undefined;
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    this._changeDetector.detectChanges();
+  }
+
+  private async _setSettings(settings: any): Promise<void> {
+    if (settings) {
+      if (!settings.reCaptchaSiteKey) {
+        console.error('no reCaptchaSiteKey provided!');
+      } else {
+        this.reCaptchaSiteKey = settings.reCaptchaSiteKey;
+      }
+      if (settings.securityCode) {
+        this.securitycode = settings.securityCode;
+      }
+      if (!settings.schema) {
+        console.error('no schema provided!');
+      } else {
+        this.upId = parseInt(settings.schema);
+      }
+      if (!settings.version) {
+        console.error('no version provided!');
+      } else {
+        this.clientVersion = settings.version;
+      }
+      if (!settings.languageCode) {
+        console.error('no languageCode provided!');
+      } else {
+        const language: string[] = settings.languageCode.split('_');
+        this.clientLanguage = language[0];
+      }
+      this._settings = settings;
+      this.loaded = true;
+    }
+  }
+}

package/src/app/bundle/login/login-bundle.module.ts

@@ -0,0 +1,32 @@
+import {Injector, NgModule} from '@angular/core';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {createCustomElement} from '@angular/elements';
+import {LoginBundleComponent} from './login-bundle.component';
+import {LoginModule} from '../../../../projects/sharedcomponents/src/lib/components/login/login.module';
+import {
+  SharedComponentsTranslationModule
+} from '../../../../projects/sharedcomponents/src/lib/translation/shared-components-translation.module';
+
+@NgModule({
+  imports: [
+    BrowserAnimationsModule,
+    LoginModule,
+    SharedComponentsTranslationModule
+  ],
+  declarations: [
+    LoginBundleComponent
+  ],
+  exports: [
+    LoginBundleComponent
+  ]
+})
+export class LoginBundleModule {
+  constructor(private _injector: Injector) {
+  }
+
+  ngDoBootstrap() {
+    const elSelector =
+      createCustomElement(LoginBundleComponent, {injector: this._injector});
+    customElements.define('ione-login', elSelector);
+  }
+}

package/src/app/bundle/main-login-bundle.ts

@@ -0,0 +1,11 @@
+import {environment} from '../../environments/environment';
+import {enableProdMode} from '@angular/core';
+import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
+import {LoginBundleModule} from '../bundle/login/login-bundle.module';
+
+if (environment.production) {
+    enableProdMode();
+}
+
+platformBrowserDynamic().bootstrapModule(LoginBundleModule)
+    .catch((error) => console.log(error));

package/src/app/bundle/polyfills.ts

@@ -0,0 +1,63 @@
+/**
+ * This file includes polyfills needed by Angular and is loaded before the app.
+ * You can add your own extra polyfills to this file.
+ *
+ * This file is divided into 2 sections:
+ *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
+ *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
+ *      file.
+ *
+ * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
+ * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
+ * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
+ *
+ * Learn more in https://angular.io/guide/browser-support
+ */
+
+/***************************************************************************************************
+ * BROWSER POLYFILLS
+ */
+
+/** IE10 and IE11 requires the following for NgClass support on SVG elements */
+// import 'classlist.js';  // Run `npm install --save classlist.js`.
+
+/**
+ * Web Animations `@angular/platform-browser/animations`
+ * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
+ * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
+ */
+// import 'web-animations-js';  // Run `npm install --save web-animations-js`.
+
+/**
+ * By default, zone.js will patch all possible macroTask and DomEvents
+ * user can disable parts of macroTask/DomEvents patch by setting following flags
+ * because those flags need to be set before `zone.js` being loaded, and webpack
+ * will put import in the top of bundle, so user need to create a separate file
+ * in this directory (for example: zone-flags.ts), and put the following flags
+ * into that file, and then add the following code before importing zone.js.
+ * import './zone-flags';
+ *
+ * The flags allowed in zone-flags.ts are listed here.
+ *
+ * The following flags will work for all browsers.
+ *
+ * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
+ * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
+ * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
+ *
+ *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
+ *  with the following flag, it will bypass `zone.js` patch for IE/Edge
+ *
+ *  (window as any).__Zone_enable_cross_context_check = true;
+ *
+ */
+
+/***************************************************************************************************
+ * Zone JS is required by default for Angular itself.
+ */
+import 'zone.js'; // Included with Angular CLI.
+import 'reflect-metadata';
+
+/***************************************************************************************************
+ * APPLICATION IMPORTS
+ */

package/src/app/bundle/shared-version.ts

@@ -0,0 +1,7 @@
+// this file is dynamically created, do not change this
+export class Version {
+  public name = "@colijnit/sharedcomponents";
+  public description = "Colijn IT shared components package";
+  public symVer = "259.1.4";
+  public publishDate = "27-8-2025 09:49:41";
+}

package/src/app/test-data.service.ts

@@ -0,0 +1,230 @@
+import {Injectable} from '@angular/core';
+import {ReportLayoutSelectionEmail} from '@colijnit/mainapi/build/model/report-layout-selection-email.bo';
+import {ReportLayoutSelectionPrint} from '@colijnit/mainapi/build/model/report-layout-selection-print.bo';
+import {Activity} from "@colijnit/mainapi/build/model/activity.bo";
+import {ActivityType} from "@colijnit/mainapi/build/enum/activity-type";
+import {RelationSmallObject} from "@colijnit/mainapi/build/model/relation-small-object.bo";
+import {Remark} from "@colijnit/mainapi/build/model/remark.bo";
+import {RelationKind} from "@colijnit/mainapi/build/enum/relation-kind";
+import {TableName} from "@colijnit/mainapi/build/enum/table-name.enum";
+import {Work} from "@colijnit/mainapi/build/model/work.bo";
+import {CoDocument} from "@colijnit/mainapi/build/model/co-document.bo";
+import {FileType} from "@colijnit/mainapi/build/enum/file-type.enum";
+import {Workflow} from "@colijnit/mainapi/build/model/workflow.bo";
+import {Task} from "@colijnit/mainapi/build/model/task.bo";
+import {PriorityType} from "@colijnit/mainapi/build/enum/priority-type.enum";
+import {WorkflowCategoryType} from "@colijnit/mainapi/build/enum/workflow-category.enum";
+import {Printer} from "@colijnit/mainapi/build/model/printer.bo";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TestDataService {
+
+  public emailLayouts: ReportLayoutSelectionEmail[] = [];
+  public printLayouts: ReportLayoutSelectionPrint[] = [];
+  public documents: CoDocument[] = [];
+  public activities: Activity[] = [];
+  public printers: Printer[] = [];
+
+  constructor() {
+    this._createTestData();
+  }
+
+  private _createTestData(): void {
+    this._createEmailLayouts();
+    this._createPrintLayouts();
+    this._createDocuments();
+    this._createActivities();
+    this._createPrinters();
+  }
+
+  private _createPrinters(): void {
+    const printer1 = new Printer();
+    printer1.name = 'Printer1';
+    printer1.isDefault = false;
+    printer1.acceptingJobs = 'blabla';
+    const printer2 = new Printer();
+    printer2.name = 'Printer2';
+    printer2.isDefault = false;
+    printer2.acceptingJobs = 'blabla';
+    this.printers.push(printer1, printer2);
+  }
+
+  private _createEmailLayouts(): void {
+    const emailLayout: ReportLayoutSelectionEmail = new ReportLayoutSelectionEmail();
+    emailLayout.reportId = 1;
+    emailLayout.name = "Standaard email rapport";
+    emailLayout.description = "Standaard email rapport";
+    emailLayout.documentId = 11;
+    emailLayout.sendMethod = 2;
+    emailLayout.isDefault = true;
+    this.emailLayouts.push(emailLayout);
+    const emailLayout1: ReportLayoutSelectionEmail = new ReportLayoutSelectionEmail();
+    emailLayout1.reportId = 2;
+    emailLayout1.name = "Email rapport 2";
+    emailLayout1.description = "Email rapport 2";
+    emailLayout1.documentId = 16;
+    emailLayout1.sendMethod = 2;
+    emailLayout1.isDefault = false;
+    this.emailLayouts.push(emailLayout1);
+  }
+
+  private _createPrintLayouts(): void {
+    const printLayout: ReportLayoutSelectionPrint = new ReportLayoutSelectionPrint();
+    printLayout.reportId = 1;
+    printLayout.name = "Standaard voorraadsticker 99x73";
+    printLayout.description = "Standaard voorraadsticker 99x73";
+    printLayout.documentId = 32;
+    printLayout.sendMethod = 1;
+    printLayout.isDefault = true;
+    this.printLayouts.push(printLayout);
+    const printLayout1: ReportLayoutSelectionPrint = new ReportLayoutSelectionPrint();
+    printLayout1.reportId = 2;
+    printLayout1.name = "Voorraadsticker 100x50";
+    printLayout1.description = "Voorraadsticker 100x50";
+    printLayout1.documentId = 35;
+    printLayout1.sendMethod = 1;
+    printLayout1.isDefault = false;
+    this.printLayouts.push(printLayout1);
+  }
+
+  private _createDocuments(): void {
+    const document1: CoDocument = new CoDocument();
+    document1.creationDate = new Date();
+    document1.description = 'DIT IS DOCUMENT';
+    document1.publication = 1;
+    document1.fileSize = 'veel';
+    document1.fileType = FileType.Document;
+    document1.isLoaded = true;
+    document1.index = 0;
+    document1.title = 'DOCUMENT';
+    document1.rightLevel = 4;
+    document1.fileName = 'documentexe';
+    this.documents.push(document1);
+
+    const document2: CoDocument = new CoDocument();
+    document2.creationDate = new Date();
+    document2.description = 'DIT IS IMAGE';
+    document2.publication = 1;
+    document2.fileSize = 'veel';
+    document2.fileType = FileType.Document;
+    document2.isLoaded = true;
+    document2.index = 0;
+    document2.title = 'IMAGE';
+    document2.rightLevel = 4;
+    document2.fileName = 'imageexe';
+    this.documents.push(document2);
+
+
+  }
+
+  private _createActivities(): void {
+   /* const relationSmallObject1: RelationSmallObject = new RelationSmallObject();
+    relationSmallObject1.relationId = 1;
+    relationSmallObject1.firstName = 'Rem';
+    relationSmallObject1.familyName = 'de Mark';
+    relationSmallObject1.initials = 'RMK';
+    relationSmallObject1.prefix = 'Mr';
+    relationSmallObject1.title = 'Meneer';
+    relationSmallObject1.relationNr = 11;
+    relationSmallObject1.relationType = RelationKind.Customer;
+
+    const document1: CoDocument = new CoDocument();
+    document1.creationDate = new Date();
+    document1.description = 'DIT IS DOCUMENT';
+    document1.publication = 1;
+    document1.fileSize = 'veel';
+    document1.fileType = FileType.Document;
+    document1.isLoaded = true;
+    document1.index = 0;
+    document1.title = 'DOCUMENT';
+    document1.rightLevel = 4;
+    document1.fileName = 'documentexe';
+
+
+    const remark: Remark = new Remark;
+    remark.author = relationSmallObject1;
+    remark.dateTime = new Date();
+    remark.key = 'key';
+    remark.remark = 'Dit is eem opmerking';
+    remark.remarkId = 1
+    remark.table = TableName.Transactions;
+    remark.documents.push(document1);
+
+    const activity1: Activity = new Activity();
+    activity1.activityType = ActivityType.Remark
+    activity1.remark = remark;
+    activity1.lastActionDateTime = new Date();
+    activity1.activityTitle = 'Remark Activity';
+
+    this.activities.push(activity1);
+
+    const relationSmallObject2: RelationSmallObject = new RelationSmallObject();
+    relationSmallObject2.relationId = 2;
+    relationSmallObject2.firstName = 'Wo';
+    relationSmallObject2.familyName = 'de Ork';
+    relationSmallObject2.initials = 'WK';
+    relationSmallObject2.prefix = 'Mvr';
+    relationSmallObject2.title = 'Mevrouw';
+    relationSmallObject2.relationNr = 22;
+    relationSmallObject2.relationType = RelationKind.Personnel;
+
+    const work:Work = new Work();
+    work.executive = relationSmallObject2;
+    work.calculationKey = 'B';
+    work.workId = 1;
+    work.workedTime = 60;
+    work.workDescription = 'Een beetje gewerkt enzo';
+    work.dateTime = new Date();
+    work.key = 'key';
+    work.table = TableName.Transactions;
+
+    const activity2: Activity = new Activity();
+    activity2.activityType = ActivityType.Work;
+    activity2.work = work;
+    activity2.lastActionDateTime = new Date();
+    activity2.activityTitle = 'Work Activity';
+    this.activities.push(activity2);*/
+
+    const relationSmallObject3: RelationSmallObject = new RelationSmallObject();
+    relationSmallObject3.relationId = 3;
+    relationSmallObject3.firstName = 'Work';
+    relationSmallObject3.familyName = 'Flow';
+    relationSmallObject3.initials = 'WF';
+    relationSmallObject3.prefix = 'Mvr';
+    relationSmallObject3.title = 'Mevrouw';
+    relationSmallObject3.relationNr = 33;
+    relationSmallObject3.relationType = RelationKind.Personnel;
+
+    const workFlow:Workflow = new Workflow();
+    workFlow.workflowProcessId = 1;
+    workFlow.workflowProcessDescription = 'DIT IS EEN WORKFLOW PROCESS';
+    workFlow.sequence = 0;
+    workFlow.table = TableName.Transactions;
+    workFlow.key = '1';
+    workFlow.workflowDescription = 'DIT IS EEN WORKFLOW PROCESS DESCRIPTION';
+    workFlow.state = 'Status';
+    workFlow.stateName = 'StatusNaam'
+    workFlow.stateDate = new Date();
+    workFlow.workflowId = 1;
+    workFlow.workflowName = 'DIT IS EEN WORKFLOW NAME';
+
+    const task:Task = new Task();
+    task.taskId = 1;
+    task.priority = PriorityType.VeryHigh;
+    task.name = 'TASKNAAM';
+    task.workflowCategory = WorkflowCategoryType.Task;
+    task.lastModifiedBy = relationSmallObject3;
+    task.lastModifiedDate = new Date();
+
+    const activity3: Activity = new Activity();
+    activity3.activityType = ActivityType.Task;
+    activity3.task = task;
+    activity3.workflow = workFlow;
+    activity3.lastActionDateTime = new Date();
+    activity3.activityTitle = 'Work Activity';
+    this.activities.push(activity3);
+  }
+
+}

package/src/environments/environment.bundle.prod.ts

@@ -0,0 +1,3 @@
+export const environment = {
+    production: true
+};

package/src/environments/environment.prod.ts

@@ -0,0 +1,3 @@
+export const environment = {
+  production: true
+};

package/src/environments/environment.ts

@@ -0,0 +1,16 @@
+// This file can be replaced during build by using the `fileReplacements` array.
+// `ng build` replaces `environment.ts` with `environment.prod.ts`.
+// The list of file replacements can be found in `angular.json`.
+
+export const environment = {
+  production: false
+};
+
+/*
+ * For easier debugging in development mode, you can import the following file
+ * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
+ *
+ * This import should be commented out in production mode because it will have a negative impact
+ * on performance if an error is thrown.
+ */
+// import 'zone.js/plugins/zone-error';  // Included with Angular CLI.

package/src/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Sharedcomponents</title>
+  <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+</head>
+<body>
+  <app-root></app-root>
+</body>
+</html>