RMA-101184: code changes in halstack lib

projects/dxc-ngx-cdk-examples/src/app/pages/file-input/file-input-info.component.html

@@ -0,0 +1,7 @@
+<div>
+  <dxc-file-input name="fileControl" mode="filedrop" label="Choose File" margin="xsmall"
+      buttonLabel="CHOOSE FILE" helperText="You can choose one file to import"
+      [value]="files" [showPreview]="true" [multiple] = "true" (callbackFile) = "FileUploadResponse($event)"
+      [requests] = "fileinfo.requests" (fileuploadEvents)="uploadEvents($event)">
+    </dxc-file-input>
+</div>

projects/dxc-ngx-cdk-examples/src/app/pages/file-input/file-input-info.component.scss

@@ -0,0 +1,9 @@
+div.dark {
+  background: black;
+}
+
+.dark {
+  h2 {
+    color:white;
+  }
+}

projects/dxc-ngx-cdk-examples/src/app/pages/file-input/file-input-info.component.ts

@@ -0,0 +1,37 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'dropdown-info',
+  templateUrl: './dropdown-info.component.html',
+  styleUrls: ['./dropdown-info.component.scss']
+})
+export class DropdownInfoComponent {
+
+  constructor() {}
+
+  FileUploadResponse(event)
+  {
+    //this.files=event;
+    //let name = this.parentFormGroup.get('taskManager.Filenames').value;
+    if(event[0].eventtype == "PREUPLOAD")
+    {
+      console.log("pre");
+    }
+    else if(event[0].eventtype == "POSTUPLOAD"){
+      console.log("post");
+    }
+    else if(event[0].eventtype == "UPLOAD"){
+      console.log("upload");
+    }
+  }
+  uploadEvents(event) {
+    if(event == "PREUPLOAD")
+    {
+      console.log("pre");
+    }
+    else if(event == "POSTUPLOAD"){
+      console.log("post");
+    }
+  }
+
+}

projects/dxc-ngx-cdk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxc-technology/halstack-angular",
-  "version": "4.1.0",
+  "version": "4.5.0",
   "description": "DXC Angular CDK (Component Development Kit) based on Graphen Design System",
   "scripts": {
     "build-lib": "ng build dxc-ngx-cdk",

projects/dxc-ngx-cdk/src/assets/scss/core.scss

@@ -25,8 +25,6 @@
 //   width: 1150px;
 //   margin: 4px;
 //   flex: 1 0 150px;
+//   flex: 1 0 150px;
 // }
-dxc-dialog::ng-deep .container {
-  width: 600px;
-  margin: 30px auto;
-}
+

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog-body/dxc-dialog-body.component.html

@@ -0,0 +1 @@
+<ng-content></ng-content>

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog-body/dxc-dialog-body.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DxcDialogBodyComponent } from './dxc-dialog-body.component';
+
+describe('DxcDialogBodyComponent', () => {
+  let component: DxcDialogBodyComponent;
+  let fixture: ComponentFixture<DxcDialogBodyComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ DxcDialogBodyComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DxcDialogBodyComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog-body/dxc-dialog-body.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'dxc-dialog-body',
+  templateUrl: './dxc-dialog-body.component.html',
+  styleUrls: ['./dxc-dialog-body.component.css']
+})
+export class DxcDialogBodyComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog-header/dxc-dialog-header.component.html

@@ -0,0 +1 @@
+<ng-content></ng-content>

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog-header/dxc-dialog-header.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DxcDialogHeaderComponent } from './dxc-dialog-header.component';
+
+describe('DxcDialogHeaderComponent', () => {
+  let component: DxcDialogHeaderComponent;
+  let fixture: ComponentFixture<DxcDialogHeaderComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ DxcDialogHeaderComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DxcDialogHeaderComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog-header/dxc-dialog-header.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'dxc-dialog-header',
+  templateUrl: './dxc-dialog-header.component.html',
+  styleUrls: ['./dxc-dialog-header.component.css']
+})
+export class DxcDialogHeaderComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

projects/dxc-ngx-cdk/src/lib/dxc-dialog/dxc-dialog.component.html

@@ -1,19 +1,26 @@
-<div class="dialog">
+<div class="dialog h-100 w-100 d-flex align-items-center justify-content-center">
   <div class="backOverlay" role="overlay" (click)="onBackgroundClickHandler($event)" [class.backVisible]="overlay">
   </div>
-  <div class="container">
-    <div class="dialogContainer">
-      <div class="content" tabindex="0" role="dialog" (keydown)="startKeyPress($event)" [attr.aria-label]="ariaLabel" [attr.aria-labelledby]="ariaLabelledBy" 
-      [attr.aria-describedby]="ariaDescribedBy" #dialogboxstart>
-        <a href="javascript:void(0);" class="closeIcon" *ngIf="isCloseVisible" [attr.aria-label]="closeButtonLabel" [matTooltip]="closeButtonLabel"
-          (click)="onCloseHandler($event)" [tabindex]="tabIndexValue" role="button">
-          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-            <path
-              d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" />
-            <path d="M0 0h24v24H0z" fill="none" />
-          </svg>
-        </a>
-        <ng-content></ng-content>
+  <div [ngClass]="'container p-0 mw-100 mph-' + height + ' mpw-'+ width">
+    <div class="dialogContainer h-100 w-100" #dialogboxstart>
+      <div #dialogHeader [style.height.px]="headerHeight" class="dialog-header d-flex align-items-center justify-content-between px-2">
+        <span>
+          <ng-content select="dxc-dialog-header"></ng-content>
+        </span>
+        <span *ngIf="isCloseVisible" >
+          <a href="javascript:void(0);" class="closeIcon" [attr.aria-label]="closeButtonLabel"
+            [matTooltip]="closeButtonLabel" (click)="onCloseHandler($event)" [tabindex]="tabIndexValue" role="button">
+            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+              <path
+                d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" />
+              <path d="M0 0h24v24H0z" fill="none" />
+            </svg>
+          </a>
+        </span>
+      </div>
+      <div class="content" tabindex="0" role="dialog" (keydown)="startKeyPress($event)" [attr.aria-label]="ariaLabel"
+        [attr.aria-labelledby]="ariaLabelledBy" [attr.aria-describedby]="ariaDescribedBy">
+        <ng-content select="dxc-dialog-body"></ng-content>
         <span #dialogboxreturn tabindex="-1" (onblur)="returnFocusOut($event)"></span>
         <span #dialogboxend tabindex="0" (focus)="endFocus($event)"></span>
       </div>