@falcon-ng/tailwind 0.0.2

package/src/lib/component/table/table.component.html

@@ -0,0 +1,82 @@
+<div class="flex justify-end">
+  <mat-form-field *ngIf="matTableConfig?.filter">
+    <mat-label>Filter</mat-label>
+    <input matInput (keyup)="applyFilter($event)" #input>
+  </mat-form-field>
+</div>
+<falcon-progress-bar *ngIf="matTableConfig?.progressBar" [mode]="'indeterminate'"></falcon-progress-bar>
+<div class="mat-elevation-z8">
+  <table mat-table [dataSource]="matTableConfig.dataSource" matSort>
+    <ng-container *ngFor="let column of matTableConfig?.columns" matColumnDef={{column.columnDef}}>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ column.header }}</th>
+      <ng-container *ngIf="column?.link?.isLink; else elseBlock">
+        <td mat-cell *matCellDef="let element">
+          <a [routerLink]="column?.link?.routerLink(element)">
+            {{column?.cell(element) !== undefined ? column?.cell(element) : '' }}
+          </a>
+        </td>
+      </ng-container>
+      <ng-template #elseBlock>
+        <td mat-cell *matCellDef="let element">
+          {{ column.cell(element) !== undefined ? column.cell(element) : ''}}
+        </td>
+      </ng-template>
+
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="mat-row-element example-expanded-row"></tr>
+
+    &lt;!&ndash; Row shown when there is no matching data. &ndash;&gt;
+    <tr class="mat-row" *matNoDataRow>
+      <td class="mat-cell" colspan="columns.length">No data matching the filter</td>
+    </tr>
+
+    <ng-container matColumnDef="action">
+      <th mat-header-cell *matHeaderCellDef style="text-align: center;"></th>
+      <td mat-cell *matCellDef="let element">
+
+        <div *ngIf="matTableConfig?.action?.isMenu; else nonMenuBlock">
+
+          <button mat-icon-button matTooltip="Action" [matMenuTriggerFor]="tableActionMenu"
+                  aria-label="Table action menu">
+            <mat-icon color="primary">more_horiz</mat-icon>
+          </button>
+          <mat-menu #tableActionMenu="matMenu">
+            <a [routerLink]="item?.link?.routerLink" mat-menu-item
+               *ngFor="let item of matTableConfig?.action?.menu" [disabled]="item.disabled">
+              <mat-icon [color]="item?.icon?.iconColor">{{item?.icon?.iconText}}</mat-icon>
+              <span>{{item.text}}</span>
+            </a>
+          </mat-menu>
+        </div>
+        <ng-template #nonMenuBlock>
+          <div class="flex justify-between">
+            <div>
+              <button *ngIf="matTableConfig?.action?.view" mat-icon-button aria-label="view button"
+                      color="primary" matTooltip="View" (click)="tableAction(element, 0)">
+                <mat-icon>visibility</mat-icon>
+              </button>
+              <button *ngIf="matTableConfig?.action?.edit" mat-icon-button aria-label="edit button"
+                      color="primary" matTooltip="Edit" (click)="tableAction(element, 1)">
+                <mat-icon>create</mat-icon>
+              </button>
+              <button *ngIf="matTableConfig?.action?.delete" mat-icon-button aria-label="Delete button"
+                      color="warn" matTooltip="Delete" (click)="tableAction(element, 2)">
+                <mat-icon>delete</mat-icon>
+              </button>
+            </div>
+            <button *ngIf="matTableConfig?.action?.arrowRight" mat-icon-button aria-label="Arrow button"
+                    color="primary" matTooltip="Expand" (click)="tableAction(element, 3)">
+              <mat-icon>chevron_right</mat-icon>
+            </button>
+          </div>
+        </ng-template>
+      </td>
+    </ng-container>
+
+  </table>
+  <mat-paginator *ngIf="matTableConfig?.paginationConfig?.pagination" (page)="page($event)"
+                 [pageSizeOptions]="matTableConfig.paginationConfig?.pageSizeOptions!" showFirstLastButtons>
+  </mat-paginator>
+</div>

package/src/lib/component/table/table.component.scss

@@ -0,0 +1,17 @@
+table {
+  text-align: center !important;
+  width: 100%;
+}
+.mat-form-field {
+  font-size: 14px;
+}
+
+:host ::ng-deep {
+  .mat-sort-header-container {
+    display: flex;
+    justify-content: center;
+  }
+.mat-row:hover {
+    background-color: whitesmoke;
+  }
+}

package/src/lib/component/table/table.component.spec.ts

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

package/src/lib/component/table/table.component.ts

@@ -0,0 +1,54 @@
+import {Component, EventEmitter, Input, OnInit, Output, ViewChild} from '@angular/core';
+import {MatTableConfig} from "../../model/interface";
+import {MatPaginator, PageEvent} from "@angular/material/paginator";
+import {MatSort} from "@angular/material/sort";
+import {MatTableDataSource} from "@angular/material/table";
+import {TableAction} from "../../model/enum";
+
+@Component({
+  selector: 'falcon-table',
+  templateUrl: './table.component.html',
+  styleUrls: ['./table.component.scss']
+})
+export class TableComponent implements OnInit {
+  @Input() matTableConfig!: MatTableConfig;
+  @ViewChild(MatPaginator, { static: false }) paginator!: MatPaginator;
+  @ViewChild(MatSort, { static: false }) sort!: MatSort;
+  @Output() pageEvent = new EventEmitter<PageEvent>();
+  @Input() displayedColumns!: string[];
+  @Output() tableActionRowEvent = new EventEmitter<any>();
+  ngOnInit(): void {
+    const cols = this.matTableConfig.columns?.map((c) => c.columnDef);
+    if (this.displayedColumns !== undefined)
+      this.displayedColumns.unshift(...cols as string[]);
+    else this.displayedColumns = cols as string[];
+  }
+  ngAfterViewInit() {
+    setTimeout(() => {
+      this.matTableConfig.dataSource = new MatTableDataSource(
+              this.matTableConfig.dataSource,
+              );
+      this.matTableConfig.dataSource.paginator = this.paginator;
+      this.matTableConfig.dataSource.sort = this.sort;
+    });
+  }
+  applyFilter(event: Event) {
+    const filterValue = (event.target as HTMLInputElement).value;
+    this.matTableConfig.dataSource.filter = filterValue
+    .trim()
+    .toLowerCase();
+
+    if (this.matTableConfig.dataSource.paginator) {
+      this.matTableConfig.dataSource.paginator.firstPage();
+    }
+  }
+
+  public page(e: any) {
+    this.pageEvent.emit(e);
+  }
+
+  public tableAction($item: any, action: TableAction) {
+    const item = Object.assign($item, { action: action });
+    this.tableActionRowEvent.next(item);
+  }
+}

package/src/lib/component/textarea/textarea.component.html

@@ -0,0 +1,22 @@
+<mat-form-field [appearance]="control.appearance" [formGroup]="formGroup" [floatLabel]="control.floatLabel"
+  [ngStyle]="control.style" [ngClass]="control.class" class="textarea-form">
+  <mat-label>{{control.label}}</mat-label>
+
+  <textarea matInput [formControlName]="control.formControlName" [placeholder]="control.placeHolder"
+    [ngStyle]="control.style" [ngClass]="control.class"
+    [cdkTextareaAutosize]="control.textAreaProperty.cdkTextareaAutosize"
+    [cdkAutosizeMinRows]="control.textAreaProperty.cdkAutosizeMinRows"
+    [cdkAutosizeMaxRows]="control.textAreaProperty.cdkAutosizeMaxRows" [rows]="control.textAreaProperty.rows"
+    [cols]="control.textAreaProperty.cols"></textarea>
+
+  <span matPrefix [ngClass]="{'material-icons': control.prefix.isIcon}">{{control.prefix.text}}</span>
+  <span matSuffix [ngClass]="{'material-icons': control.suffix.isIcon}">{{control.suffix.text}}</span>
+
+
+  <mat-hint>{{control.hint.text}}</mat-hint>
+
+  <ng-container *ngFor="let validation of control.validations;" ngProjectAs="mat-error">
+    <mat-error *ngIf="formGroup.get(control.formControlName)?.hasError(validation.name)">{{validation.message}}
+    </mat-error>
+  </ng-container>
+</mat-form-field>

package/src/lib/component/textarea/textarea.component.scss

@@ -0,0 +1,3 @@
+.textarea-form{
+  width: 100%;
+}

package/src/lib/component/textarea/textarea.component.spec.ts

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

package/src/lib/component/textarea/textarea.component.ts

@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { BaseControl } from '../../base-control';
+import { FormGroup } from '@angular/forms';
+
+@Component({
+  selector: 'falcon-textarea',
+  templateUrl: './textarea.component.html',
+  styleUrls: ['./textarea.component.scss'],
+})
+export class TextareaComponent {
+  control!: BaseControl<string>;
+  formGroup!: FormGroup;
+}

package/src/lib/component/textbox/textbox.component.html

@@ -0,0 +1,27 @@
+<mat-form-field [formGroup]="formGroup" [appearance]="control.appearance" class="textbox-form">
+  <mat-label>{{control.label}}</mat-label>
+  <input matInput [type]="control.type" [formControlName]="control.formControlName" [class]="control.class"
+         [required]="formGroup.get(control.formControlName)?.errors !== null && formGroup.get(control.formControlName)?.errors?.['required']">
+
+  <span matPrefix [matTooltip]="control.prefix.toolTipText!"
+        [ngClass]="{'material-icons': control.prefix.isIcon}">{{control.prefix.text}}&nbsp;&nbsp;</span>
+  <span matSuffix [matTooltip]="control.suffix.toolTipText!"
+        [ngClass]="{'material-icons': control.suffix.isIcon}">{{control.suffix.text}}&nbsp;&nbsp;</span>
+  <mat-hint *ngIf="control.hint.link?.isLink; else elseBlock">
+    <ng-container *ngIf="control.hint.link?.queryParams !== undefined; else withoutQueryBlock">
+      <a [routerLink]="[control.hint.link?.routerLink]" [queryParams]="{ query: control.hint.link?.queryParams }"
+         routerLinkActive="router-link-active">{{control.hint.text}}</a>
+    </ng-container>
+  </mat-hint>
+  <ng-template #elseBlock>
+    <mat-hint>{{control.hint.text}}</mat-hint>
+  </ng-template>
+  <ng-template #withoutQueryBlock>
+    <a [routerLink]="[control.hint.link?.routerLink]" routerLinkActive="router-link-active">{{control.hint.text}}</a>
+  </ng-template>
+
+  <ng-container *ngFor="let validation of control.validations;" ngProjectAs="mat-error">
+    <mat-error *ngIf="formGroup.get(control.formControlName)?.hasError(validation.name)">{{validation.message}}
+    </mat-error>
+  </ng-container>
+</mat-form-field>

package/src/lib/component/textbox/textbox.component.scss

@@ -0,0 +1,3 @@
+.textbox-form {
+  width: 100%;
+}

package/src/lib/component/textbox/textbox.component.spec.ts

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

package/src/lib/component/textbox/textbox.component.ts

@@ -0,0 +1,13 @@
+import { Component, OnInit } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+import { BaseControl } from '../../base-control';
+
+@Component({
+  selector: 'falcon-textbox',
+  templateUrl: './textbox.component.html',
+  styleUrls: ['./textbox.component.scss'],
+})
+export class TextboxComponent {
+  control!: BaseControl<string>;
+  formGroup!: FormGroup;
+}

package/src/lib/control-builder/control-builder.component.html

@@ -0,0 +1,5 @@
+<div [class]="layout.class">
+  <ng-container *ngFor="let control of layout.baseControls">
+    <ng-container reactiveField [control]="control" [formGroup]="formGroup"></ng-container>
+  </ng-container>
+</div>

package/src/lib/control-builder/control-builder.component.ts

@@ -0,0 +1,14 @@
+import {Component, Input} from '@angular/core';
+import {FormGroup, ReactiveFormsModule} from "@angular/forms";
+import {BaseControl, Layout} from "../base-control";
+import {CommonModule} from "@angular/common";
+
+@Component({
+  selector: 'control-builder',
+  templateUrl: './control-builder.component.html',
+  styleUrls: ['./control-builder.component.scss']
+})
+export class ControlBuilderComponent {
+  @Input() layout!: Layout<string>;
+  @Input() formGroup!: FormGroup;
+}

package/src/lib/control-type/AutoComplete.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class AutoComplete extends BaseControl<string> {
+  override controlType = ControlType.AutoComplete;
+}

package/src/lib/control-type/Button.ts

@@ -0,0 +1,6 @@
+import {BaseControl} from "../base-control";
+import {ControlType} from "../model/enum";
+
+export class Button extends BaseControl<string> {
+  override controlType = ControlType.Button;
+}

package/src/lib/control-type/ButtonToggle.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class ButtonToggle extends BaseControl<string> {
+  override controlType = ControlType.ButtonToggle;
+}

package/src/lib/control-type/CheckBox.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class CheckBox extends BaseControl<boolean> {
+  override controlType = ControlType.Checkbox;
+}

package/src/lib/control-type/Chip.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Chip extends BaseControl<string> {
+  override controlType = ControlType.Chip;
+}

package/src/lib/control-type/DatePicker.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class DatePicker extends BaseControl<string> {
+  override controlType = ControlType.DatePicker;
+}

package/src/lib/control-type/Divider.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Divider extends BaseControl<string> {
+  override controlType = ControlType.Divider;
+}

package/src/lib/control-type/Editor.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Editor extends BaseControl<string> {
+  override controlType = ControlType.Editor;
+}

package/src/lib/control-type/Radio.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Radio extends BaseControl<string> {
+  override controlType = ControlType.Radio;
+}

package/src/lib/control-type/RichTextEditor.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class RichTextEditor extends BaseControl<any> {
+  override controlType = ControlType.Editor;
+}

package/src/lib/control-type/SlideToggle.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class SliderToggle extends BaseControl<boolean> {
+  override controlType = ControlType.SlideToggle;
+}

package/src/lib/control-type/Slider.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Slider extends BaseControl<number> {
+  override controlType = ControlType.Slider;
+}

package/src/lib/control-type/select.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Select extends BaseControl<string> {
+  override controlType = ControlType.Select;
+}

package/src/lib/control-type/textarea.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Textarea extends BaseControl<string> {
+  override controlType = ControlType.TextArea;
+}

package/src/lib/control-type/textbox.ts

@@ -0,0 +1,6 @@
+import { BaseControl } from '../base-control';
+import { ControlType } from '../model/enum';
+
+export class Textbox extends BaseControl<string> {
+  override controlType = ControlType.TextBox;
+}

package/src/lib/falcon-core.module.ts

@@ -0,0 +1,141 @@
+import {ModuleWithProviders, NgModule, APP_INITIALIZER, inject} from '@angular/core';
+import {TextboxComponent} from './component/textbox/textbox.component';
+import {TextareaComponent} from './component/textarea/textarea.component';
+import {SelectComponent} from './component/select/select.component';
+import {ReactiveFieldDirective} from './reactive-field.directive';
+import {AngularmaterialModule} from "./module/angularmaterial.module";
+import {CommonModule} from "@angular/common";
+import {FormsModule, ReactiveFormsModule} from "@angular/forms";
+import {ControlBuilderComponent} from "./control-builder/control-builder.component";
+import {EnvironmentViewModel} from "./model/environments";
+import {RouterModule} from "@angular/router";
+import {IGenericHttpClient} from "./service/http/igeneric-http-client";
+import {GenericHttpClient} from "./service/http/generic-http-client";
+import {AppSettingService, appSettingsFactory} from "./service/appsetting.service";
+import {AuthService, authServiceFactory} from "./service/open-id/auth.service";
+import {LoggerService, loggerServiceFactory} from "./service/logger.service";
+import {MAT_SNACK_BAR_DEFAULT_OPTIONS} from "@angular/material/snack-bar";
+import {provideHttpClient, withInterceptors} from "@angular/common/http";
+import { DatePickerComponent } from './component/date-picker/date-picker.component';
+import { CheckboxComponent } from './component/checkbox/checkbox.component';
+import { RadioComponent } from './component/radio/radio.component';
+import { AutoCompleteComponent } from './component/auto-complete/auto-complete.component';
+import { ButtonToggleComponent } from './component/button-toggle/button-toggle.component';
+import { ChipComponent } from './component/chips/chip.component';
+import { SliderComponent } from './component/slider/slider.component';
+import { SlideToggleComponent } from './component/slide-toggle/slide-toggle.component';
+import { ButtonComponent } from './component/button/button.component';
+import { DialogComponent } from './component/dialog/dialog.component';
+import { SnackBarComponent } from './component/snack-bar/snack-bar.component';
+import { BottomSheetComponent } from './component/bottom-sheet/bottom-sheet.component';
+import { ProgressBarComponent } from './component/progress-bar/progress-bar.component';
+import { ProgressSpinnerComponent } from './component/progress-spinner/progress-spinner.component';
+import { TableComponent } from './component/table/table.component';
+import { PaginationComponent } from './component/pagination/pagination.component';
+import { RichTextEditorComponent } from './component/rich-text-editor/rich-text-editor.component';
+import {AngularEditorModule} from "@kolkov/angular-editor";
+
+@NgModule({
+  declarations: [
+    TextboxComponent,
+    TextareaComponent,
+    SelectComponent,
+    ReactiveFieldDirective,
+    ControlBuilderComponent,
+    DatePickerComponent,
+    CheckboxComponent,
+    RadioComponent,
+    AutoCompleteComponent,
+    ButtonToggleComponent,
+    ChipComponent,
+    SliderComponent,
+    SlideToggleComponent,
+    ButtonComponent,
+    DialogComponent,
+    SnackBarComponent,
+    BottomSheetComponent,
+    ProgressBarComponent,
+    ProgressSpinnerComponent,
+    TableComponent,
+    PaginationComponent,
+    RichTextEditorComponent
+  ],
+  imports: [
+    AngularmaterialModule,
+    CommonModule,
+    FormsModule,
+    ReactiveFormsModule,
+    RouterModule,
+    AngularEditorModule,
+  ],
+  exports: [
+    AngularmaterialModule,
+    CommonModule,
+    FormsModule,
+    ReactiveFormsModule,
+    ControlBuilderComponent,
+    RouterModule,
+    ProgressBarComponent,
+    ProgressSpinnerComponent,
+    ChipComponent,
+    PaginationComponent,
+    TableComponent,
+    AngularEditorModule,
+    ButtonComponent,
+  ],
+  providers: [
+    provideHttpClient(
+      withInterceptors([
+        (req, next) => {
+          // Get the auth token from the service.
+          const authToken = inject(AuthService).getAuthorizationHeaderValue();
+          inject(LoggerService).info("Auth bearer token ", authToken);
+          if (authToken) {
+            req = req.clone({
+              setHeaders: {
+                'Content-Type': 'application/json',
+                Authorization: authToken
+              }
+            });
+          }
+          return next(req);
+        },
+      ])
+    ),
+    {provide: IGenericHttpClient, useClass: GenericHttpClient},
+    {
+      provide: APP_INITIALIZER,
+      useFactory: appSettingsFactory,
+      deps: [AppSettingService],
+      multi: true,
+    },
+    {
+      provide: APP_INITIALIZER,
+      useFactory: authServiceFactory,
+      deps: [AuthService, AppSettingService, EnvironmentViewModel],
+      multi: true,
+    },
+    {
+      provide: APP_INITIALIZER,
+      useFactory: loggerServiceFactory,
+      deps: [LoggerService, AppSettingService],
+      multi: true,
+    },
+    {
+      provide: MAT_SNACK_BAR_DEFAULT_OPTIONS,
+      useValue: {duration: 5000},
+    },
+  ],
+})
+export class FalconCoreModule {
+  public static forRoot(
+    environment: any,
+  ): ModuleWithProviders<FalconCoreModule> {
+    return {
+      ngModule: FalconCoreModule,
+      providers: [
+        {provide: EnvironmentViewModel, useValue: environment},
+      ],
+    };
+  }
+}

package/src/lib/model/constant.ts

@@ -0,0 +1,32 @@
+import { TextboxComponent } from '../component/textbox/textbox.component';
+import { TextareaComponent } from '../component/textarea/textarea.component';
+import { SelectComponent } from '../component/select/select.component';
+import { DatePickerComponent } from '../component/date-picker/date-picker.component';
+import { RadioComponent } from '../component/radio/radio.component';
+import { CheckboxComponent } from '../component/checkbox/checkbox.component';
+import { SlideToggleComponent } from '../component/slide-toggle/slide-toggle.component';
+import { SliderComponent } from '../component/slider/slider.component';
+import { ButtonToggleComponent } from '../component/button-toggle/button-toggle.component';
+import { AutoCompleteComponent } from '../component/auto-complete/auto-complete.component';
+import { ChipComponent } from '../component/chips/chip.component';
+import {ButtonComponent} from "../component/button/button.component";
+import {RichTextEditorComponent} from "../component/rich-text-editor/rich-text-editor.component";
+
+export class Constant {
+  public static ComponentMapper = [
+    TextboxComponent,
+    TextareaComponent,
+    SelectComponent,
+    DatePickerComponent,
+    RadioComponent,
+    CheckboxComponent,
+    ButtonComponent,
+    SlideToggleComponent,
+    SliderComponent,
+    ButtonToggleComponent,
+    AutoCompleteComponent,
+    ChipComponent,
+    RichTextEditorComponent,
+    //DividerComponent,
+  ];
+}