@one-paragon/angular-utilities 1.2.18 → 1.3.1

package/src/table-builder/components/generic-table/paginator.component.ts

@@ -1,99 +0,0 @@
-import { Component, ChangeDetectionStrategy, ElementRef, computed, inject, viewChild, input, effect, untracked } from '@angular/core';
-import { MatPaginator, MatPaginatorModule, PageEvent } from '@angular/material/paginator';
-import { switchMap } from 'rxjs/operators';
-import { TableStore } from '../../classes/table-store';
-import { NgClass } from '@angular/common';
-import { MatButtonModule } from '@angular/material/button';
-import { DataStore } from '../../classes/data-store';
-import { toObservable, toSignal } from '@angular/core/rxjs-interop';
-import { notNull } from '../../../rxjs';
-
-@Component({
-  selector: 'tb-paginator',
-  standalone: true,
-  imports: [MatPaginatorModule, MatButtonModule],
-  template: `
-  <div class="paginator-row">
-    @if($currentPageData(); as pageData){
-      <div [class]="{ 'hide' : ! $collapseFooter(), 'page-amounts':true}">
-        @if(!$showAll()){ {{pageData.currentStart}} - {{pageData.currentEnd}} of }{{pageData.total}}
-      </div>
-    }
-    <mat-paginator [pageSizeOptions]="[5, 10, 20, 50, 100, 500]" showFirstLastButtons
-      [class]="{ 'hide' : $collapseFooter() }">
-    </mat-paginator>
-    @if ($showAllOption()) {<button mat-button (click)="updatePaginator()"><span [style.text-decoration]="$showAll() ? 'line-through' : ''" >All</span></button>}
-  </div>
-  `,
-  styleUrls: ['./generic-table.component.scss','../../styles/collapser.styles.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class PaginatorComponent {
-  private state = inject(TableStore);
-  private data = inject(DataStore);
-  $paginator = viewChild(MatPaginator);
-  $tableElRef = input.required<ElementRef<HTMLDivElement>>({alias: 'tableElRef'});
-
-  $dataLength = this.data.selectSignal(d => d.dataLen);
-  pageEvent$ = toObservable(this.$paginator).pipe(notNull(), switchMap(p => p.page));
-  $pageEvent = toSignal(this.pageEvent$);
-  $pageIndexChangeEvent = computed(() => this.$pageEvent()?.pageIndex);
-  $pageSizeChangeEvent = computed(() => this.$pageEvent()?.pageSize);
-  $currentPageData = computed(() => {
-    const pageEvent = this.$pageEvent();
-    if(!pageEvent) return;
-    const paginator = this.$paginator()!;
-    // Reset because initial page event does not have page length
-    pageEvent.pageIndex = paginator.pageIndex;
-    pageEvent.pageSize = paginator.pageSize;
-    pageEvent.length = paginator.length;
-    const pageDetails = mapPaginationEventToCurrentPageDetails(pageEvent);
-    const dataLength = this.$dataLength();
-    return ({...pageDetails, total: dataLength})
-  })
-
-  onPageIndexEffect = effect(() => {
-    const index = this.$pageIndexChangeEvent();
-    untracked(() => this.state.updateState({currentPage: index}))
-  });
-  onPageSizeEffect = effect(() => {
-    const size = this.$pageSizeChangeEvent();
-    if(!size) return;
-    untracked(() => this.state.setPageSize(size));
-  });
-  onMetaPageSizeEffect = effect(() => {
-    const paginator = this.$paginator();
-    if(!paginator) return;
-    const metaPageSize = this.state.$pageSize();
-    untracked(() => paginator._changePageSize(metaPageSize));
-  });
-  onDataLengthEffect = effect(() => {
-    const paginator = this.$paginator();
-    const dataLength = this.$dataLength();
-    untracked(() => {
-      if(paginator){
-        paginator.length = dataLength;
-      }
-    })
-  });
-  $collapseFooter = computed(() => this.state.selectSignal(state => state.persistedTableSettings.collapseFooter)() || this.$showAll());
-  $showAllOption = this.state.selectSignal(s => s.notPersistedTableSettings?.includeAllInPaginatorOptions);
-  $showAll = this.state.selectSignal(s => s.showAll);
-  updatePaginator = this.state.updater(state => ({ ...state, showAll: !state.showAll }));
-  showAll(){
-    this.updatePaginator();
-  }
-}
-
-const mapPaginationEventToCurrentPageDetails = (pageData: PageEvent):CurrentPageDetails => ({
-  currentStart : (pageData.pageIndex * pageData.pageSize) + 1,
-  currentEnd : Math.min(pageData.length , ((pageData.pageIndex + 1) * pageData.pageSize)),
-  total : pageData.length
-});
-
-
-interface CurrentPageDetails {
-  currentStart:number,
-  currentEnd:number,
-  total:number
-}

package/src/table-builder/components/group-by-list/group-by-list.component.css

@@ -1,8 +0,0 @@
-.tb-group-label {
-  padding-right: 5px;
-}
-
-.nested-arrow {
-  margin-right: -8px;
-  margin-left: -8px;
-}

package/src/table-builder/components/group-by-list/group-by-list.component.html

@@ -1,12 +0,0 @@
-<mat-chip-set *ngrxLet="tableStore.groupByKeys$ as groupByKeys">
-  <span class="tb-group-label">Group By:</span>
-  @for (groupByKey of groupByKeys; track groupByKey) {
-    @if($index > 0){
-      <mat-icon class="nested-arrow">arrow_right</mat-icon>
-    }
-    <mat-chip (removed)="tableStore.removeGroupByKey(groupByKey)">
-      {{groupByKey | spaceCase}}
-      <mat-icon matChipRemove>cancel</mat-icon>
-    </mat-chip>
-  }
-</mat-chip-set>

package/src/table-builder/components/group-by-list/group-by-list.component.spec.ts

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

package/src/table-builder/components/group-by-list/group-by-list.component.ts

@@ -1,21 +0,0 @@
-import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
-import { TableStore } from '../../classes/table-store';
-import { MatChipsModule } from '@angular/material/chips';
-import { LetDirective } from '@ngrx/component';
-import { MatIconModule } from '@angular/material/icon';
-import { SpaceCasePipe } from '../../../utilities';
-
-@Component({
-  selector: 'group-by-list',
-  templateUrl: './group-by-list.component.html',
-  styleUrls: ['./group-by-list.component.css'],
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [
-    MatChipsModule, LetDirective, MatIconModule, SpaceCasePipe
-  ]
-})
-export class GroupByListComponent {
-  
-  tableStore = inject(TableStore);
-}

package/src/table-builder/components/header-menu/header-menu.component.html

@@ -1,104 +0,0 @@
-<button mat-icon-button class="open-menu-icon-button" disableRipple [matMenuTriggerFor]="menu" [matMenuTriggerRestoreFocus]="false">
-  <mat-icon class="menu-icon">more_vert</mat-icon>
-</button>
-<mat-menu #menu="matMenu" >
-  @if (!(metaData.fieldType === FieldType.NotMapped))
-  {
-    <button mat-menu-item (click)="tableState.addGroupByKey(metaData.key)">
-      <mat-icon color="primary">group</mat-icon>
-      <span>Group By</span>
-    </button>
-  }
-  <button mat-menu-item (click)=hideField(metaData.key)>
-    <mat-icon color="primary">visibility_off</mat-icon>
-    <span>Hide Column</span>
-  </button>
-  @if (!(metaData.fieldType === FieldType.NotMapped))
-  {
-    <ng-form #myForm="ngForm" (keydown.enter)="onEnter(myForm.value)" class="tb-header-filter">
-      <input type="hidden" name="filterId"  [ngModel]="'header-column-' + metaData.key" />
-      <input type="hidden" name="filterType"  [ngModel]="myFilterType" />
-      <input type="hidden" name="key"  [ngModel]="metaData.key" />
-      <input type="hidden" name="fieldType"  [ngModel]="metaData.fieldType" />
-      
-      @if(myFilterType === FilterType.Or || myFilterType === FilterType.In){
-        <tb-in-list-filter name='filterValue' [key]='metaData.key' [(ngModel)]='myFilterValue'/>
-      }
-      @else if(metaData.fieldType === FieldType.Link || metaData.fieldType === FieldType.String || metaData.fieldType === FieldType.Array || metaData.fieldType === FieldType.Unknown || metaData.fieldType === FieldType.PhoneNumber) {
-        <mat-form-field stop-propagation class="font auto-width">
-          <mat-icon matPrefix class="search-icon">search</mat-icon>
-          <mat-label>{{myFilterType === FilterType.StringDoesNotContain ? 'Does Not Contain...' : 'Contains...'}}</mat-label>
-          <input matInput name="filterValue" [ngModel]="filter.filterValue" />
-          <span matSuffix [matTooltip]="myFilterType === FilterType.StringDoesNotContain ? 'Contains' : 'Does Not Contain'">
-            <button mat-icon-button color="primary" (click)="setStringFilterType()" class="header-filter-icon-button">
-              <mat-icon [ngClass]="{'chosen-icon': myFilterType === FilterType.StringDoesNotContain }">
-                block
-              </mat-icon>
-            </button>
-          </span>
-        </mat-form-field>
-      }
-      @else if (metaData.fieldType === FieldType.Number || metaData.fieldType === FieldType.Currency) {
-        <mat-form-field class="auto-width" stop-propagation>
-          <mat-label>{{myFilterType === FilterType.NumberEquals ? 'Equals...' : myFilterType === FilterType.NumberLessThan ? 'Less Than...' : 'More Than...'}}</mat-label>
-          <input matInput type='number'  name="filterValue" [ngModel]="filter.filterValue" />
-          <span matPrefix class="tb-header-prefix">
-            <button mat-icon-button disableRipple class="header-filter-icon-button" (click)="setFilterType(FilterType.NumberLessThan)"
-            [ngClass]="{'chosen-icon': myFilterType === FilterType.NumberLessThan }">
-              <mat-icon  class="suffix-icons"
-                >
-                arrow_back_ios</mat-icon>
-            </button>
-            <button mat-icon-button disableRipple class="header-filter-icon-button" (click)="setFilterType(FilterType.NumberGreaterThan)"
-            [ngClass]="{'chosen-icon': myFilterType === FilterType.NumberGreaterThan }" >
-              <mat-icon  class="suffix-icons">arrow_forward_ios</mat-icon>
-            </button>
-            <button mat-icon-button disableRipple class="header-filter-icon-button" (click)="setFilterType(FilterType.NumberEquals)"
-            [ngClass]="{'chosen-icon': myFilterType === FilterType.NumberEquals }">
-              <span class="suffix-icons">=</span>
-            </button>
-          </span>
-        </mat-form-field>
-      }
-      @else if (metaData.fieldType === FieldType.Boolean) {
-        <div>
-          <label>
-            <mat-icon class="search-icon">filter_list</mat-icon>
-          </label>
-          <mat-radio-group stop-propagation #ctrl="matRadioGroup" #boolField='ngModel' class="font" name="filterValue" [ngModel]="myFilterValue" >
-            <mat-radio-button class="filter-radio-button" (click)="myFilterValue = true;" [value]="true">True</mat-radio-button><br/>
-            <mat-radio-button class="filter-radio-button" (click)="myFilterValue = false" [value]="false">False</mat-radio-button><br/>
-          </mat-radio-group>
-        </div>
-      }
-      @else if (metaData.fieldType === FieldType.Date || metaData.fieldType === FieldType.DateTime) {
-        <mat-form-field class="font auto-width" stop-propagation >
-          <span matPrefix class="tb-header-prefix">
-            <button mat-icon-button disableRipple class="header-filter-icon-button" (click)="setFilterType(FilterType.DateOnOrAfter)"
-              [ngClass]="{'chosen-icon': myFilterType === FilterType.DateOnOrAfter }">
-              <mat-icon  class="suffix-icons underline">arrow_forward_ios</mat-icon>
-            </button>
-            <button mat-icon-button disableRipple class="header-filter-icon-button" (click)="setFilterType(FilterType.DateOnOrBefore)"
-              [ngClass]="{'chosen-icon': myFilterType === FilterType.DateOnOrBefore  }">
-              <mat-icon  class="suffix-icons underline">arrow_back_ios</mat-icon>
-            </button>
-            <button mat-icon-button disableRipple class="header-filter-icon-button" (click)="setFilterType(FilterType.DateIsOn)"
-              [ngClass]="{'chosen-icon': myFilterType === FilterType.DateIsOn }">
-              <span  class="suffix-icons underline"> =</span>
-            </button>
-          </span>
-          <mat-label>{{myFilterType === FilterType.DateIsOn ? 'On...' :
-            myFilterType === FilterType.DateOnOrBefore ? 'On or Before...' : 'On or After...'}}</mat-label>
-          <input matInput name="filterValue" [ngModel]="filter.filterValue" [matDatepicker]="calendar"
-            (click)="calendar.open()"/>
-          <mat-datepicker-toggle class="date-toggle header-filter-icon-button" matSuffix [for]="calendar" preventEnter></mat-datepicker-toggle>
-          <mat-datepicker #calendar></mat-datepicker>
-        </mat-form-field>
-      }
-  
-      <button mat-button (click)="onEnter(myForm.value)" [disabled]="myForm.value.filterValue == undefined" disableRipple>
-        Apply
-      </button>
-    </ng-form>
-  }
-</mat-menu>

package/src/table-builder/components/header-menu/header-menu.component.scss

@@ -1,96 +0,0 @@
-@use '@angular/material' as mat;
-:host{
-  @include mat.button-density(-3);
-  @include mat.icon-density(-3);
-}
-input[type=number]::-webkit-inner-spin-button,
-input[type=number]::-webkit-outer-spin-button {
-  -webkit-appearance: none;
-  margin: 0;
-}
-
-.menu-icon{
-  font-size: 16px;
-  line-height: 16px;
-  vertical-align: top;
-  height: 16px;
-  width: 16px;
-}
-.search-icon{
-  margin-right: 16px;
-  vertical-align: middle;
-  height: 24px;
-  color: rgba(0,0,0,.54);
-  font-size: 21px;
-  line-height: 1.125
-}
-.font{
-  font-size: 14px;
-}
-.filter-radio-button:first-of-type{
-  padding-left: 0;
-}
-.filter-radio-button{
-  padding: 10px 40px;
-  min-width: 110px;
-}
-.auto-width {
-  width: 260px;
-  margin: 5px;
-  display: block;
-  height: 55px;
-}
-
-
-.open-menu-icon-button{
-  height: 28px;
-  width: 28px;
-  padding: 6px;
-}
-.header-filter-icon-button {
-  height: 18px;
-  width: 18px;
-  font-size: 18px;
-  padding: 0;
-  margin: 0 2px;
-
-  ::ng-deep * {
-    line-height: initial;
-    font-size: initial;
-    height: 18px;
-    width: 18px;
-    font-size: 18px;
-    bottom: initial;
-
-  }
-
-  &.chosen-icon,
-  &.chosen-icon ::ng-deep * {
-    height: 22px;
-    width: 22px;
-    font-size: 22px;
-    color: green;
-  }
-}
-mat-icon.mat-icon.suffix-icons.underline{
-  height: 20px;
-  text-decoration: underline 0.1px solid;
-  .chosen-icon &{
-    height: 24px;
-  }
-}
-::ng-deep.mat-mdc-form-field-icon-prefix:has(.tb-header-prefix), .tb-header-prefix{
-  padding: 0;
-  flex-basis: 36%;
-}
-.tb-header-filter ::ng-deep.mat-mdc-form-field-subscript-wrapper{
-  line-height: 0;
-  &::before{
-    height: 0;
-  }
-}
-.date-toggle ::ng-deep svg{
-  position: absolute;
-  left: 0;
-  top: 0;
-}

package/src/table-builder/components/header-menu/header-menu.component.ts

@@ -1,99 +0,0 @@
-import { ChangeDetectionStrategy, Component, Input, ViewChild, inject } from '@angular/core';
-import { FieldType, MetaData } from '../../interfaces/report-def';
-import { FilterType, FilterTypes } from '../../enums/filterTypes';
-import { FilterInfo } from '../../classes/filter-info';
-import { TableStore } from '../../classes/table-store';
-import { MatMenuModule, MatMenuTrigger } from '@angular/material/menu';
-import { MatIconModule } from '@angular/material/icon';
-import { MatButtonModule } from '@angular/material/button';
-import { FormsModule } from '@angular/forms';
-import { NgClass } from '@angular/common';
-import { InListFilterComponent } from '../filter/in-list/in-list-filter.component';
-import { MatInputModule } from '@angular/material/input';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import { StopPropagationDirective } from '../../../utilities';
-import { MatRadioModule } from '@angular/material/radio';
-import { MatDatepickerModule } from '@angular/material/datepicker';
-
-@Component({
-  selector: 'tb-header-menu',
-  templateUrl: './header-menu.component.html',
-  styleUrls: ['./header-menu.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
-  imports: [
-    MatMenuModule, MatIconModule, MatButtonModule, FormsModule, InListFilterComponent,
-    MatInputModule, MatTooltipModule, NgClass, StopPropagationDirective, MatRadioModule, MatDatepickerModule
-  ]
-})
-export class HeaderMenuComponent {
-  protected tableState = inject(TableStore);
-
-  FieldType = FieldType;
-  FilterType = FilterTypes;
-  myFilterType!: FilterType;
-  myFilterValue: any;
-
-  filter!: Partial<FilterInfo>;
-
-  @Input() metaData!: MetaData;
-  @ViewChild(MatMenuTrigger) trigger!: MatMenuTrigger;
-
-  hideField(key: string) {
-    this.tableState.hideColumn(key);
-  }
-
-  ngOnInit() {
-    this.filter = { key: this.metaData.key, fieldType: this.metaData.fieldType };
-    this.resetFilterType();
-  }
-
-  resetFilterType() {
-    if(this.metaData.additional?.filterOptions?.filterableValues) {
-      this.myFilterType = FilterTypes.In;
-      return;
-    }
-    switch (this.metaData.fieldType) {
-      case FieldType.String:
-      case FieldType.Link:
-      case FieldType.PhoneNumber:
-      case FieldType.Array:
-      case FieldType.Unknown:
-        this.myFilterType = FilterTypes.StringContains;
-        break;
-      case FieldType.Currency:
-      case FieldType.Number:
-        this.myFilterType = FilterTypes.NumberEquals;
-        break;
-      case FieldType.Boolean:
-          this.myFilterType = FilterTypes.BooleanEquals;
-          break;
-      case FieldType.Date:
-      case FieldType.DateTime:
-          this.myFilterType = FilterTypes.DateIsOn;
-          break;
-      case FieldType.Enum:
-        this.myFilterType = FilterTypes.In;
-        break;
-    }
-  }
-
-  setStringFilterType() {
-    this.myFilterType = this.myFilterType === FilterTypes.StringContains ? FilterTypes.StringDoesNotContain : FilterTypes.StringContains;
-  }
-
-  setFilterType(filterType: FilterType) {
-    if (filterType === this.myFilterType) {
-      this.resetFilterType();
-    } else {
-      this.myFilterType = filterType;
-    }
-  }
-
-  onEnter(filter: FilterInfo) {
-    if (filter.filterValue != undefined && filter.filterType) {
-      this.tableState.addFilter(filter);
-      this.trigger.closeMenu();
-    }
-  }
-}

package/src/table-builder/components/in-filter/in-filter.component.css

@@ -1,3 +0,0 @@
-.inline{
-  display: inline-block;
-}

package/src/table-builder/components/in-filter/in-filter.component.html

@@ -1,20 +0,0 @@
-<div class=inline>
-  @for (val of value; track $index) {
-    <div>
-      @if(type === FieldType.Number || type === FieldType.Currency){
-        <input [ngModel]="val" (ngModelChange)="onValueChange($index, $event)"
-        [readonly]="$index + 1 < value.length" type="number" [ngModelOptions]="{standalone:true}" [autoFocus]="$index === value.length - 1"/>
-      }
-      @else {
-        <input [ngModel]="val" (ngModelChange)="onValueChange($index ,$event)"
-        [readonly]="$index + 1 < value.length" type="string" [ngModelOptions]="{standalone:true}"
-        #input [autoFocus]="$index === value.length - 1" />
-      }
-    </div>
-    <button [disabled]="value.length <= 1" (click)="removeInput($index)">-</button>
-    @if ($index === value.length - 1) {
-      <button [disabled]="val == undefined || val === ''" (click)="addInput()">+</button>
-    }
-    
-  }
-</div>

package/src/table-builder/components/in-filter/in-filter.component.ts

@@ -1,66 +0,0 @@
-import { ChangeDetectionStrategy, Component, Input, ChangeDetectorRef, inject } from '@angular/core';
-import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { FieldType } from '../../interfaces/report-def';
-import { AutoFocusDirective } from '../../../utilities';
-
-@Component({
-  selector: 'lib-in-filter',
-  templateUrl: './in-filter.component.html',
-  styleUrls: ['./in-filter.component.css'],
-  changeDetection:ChangeDetectionStrategy.OnPush,
-  providers: [{
-    provide: NG_VALUE_ACCESSOR,
-    useExisting: InFilterComponent,
-    multi: true
-  }],
-  standalone: true,
-  imports: [
-    FormsModule, AutoFocusDirective
-  ]
-})
-export class InFilterComponent implements ControlValueAccessor {
-  private ref = inject(ChangeDetectorRef);
-
-  FieldType = FieldType;
-  @Input() type! : FieldType;
-  value: (string | number | undefined)[] = [undefined];
-
-  constructor() {
-    this.value = [undefined];
-  }
-  writeValue(obj: any[]): void {
-    if(!obj?.length) obj  = [undefined];
-    this.value = obj;
-    this.ref.markForCheck();
-  }
-  onChange = (_: any) => { };
-
-  registerOnChange(fn: any): void {
-    this.onChange = fn;
-  }
-  onTouched = () => { };
-  registerOnTouched(fn: any): void {
-    this.onTouched = fn;
-  }
-
-  addInput(){
-    this.value = [...this.value, undefined];
-    this.ref.markForCheck();
-    this.onChange(this.value);
-  }
-
-  removeInput(index: number){
-    this.value = [...this.value];
-    this.value.splice(index,1);
-    this.ref.markForCheck();
-    this.onChange(this.value);
-  }
-
-  onValueChange(i:number,value: number | string){
-    this.value = [...this.value];
-    this.value[i] = value;
-    this.ref.markForCheck();
-    this.onChange(this.value);
-  }
-
-}

package/src/table-builder/components/initialization-component/initialization-component.html

@@ -1,29 +0,0 @@
-<ng-template #link  let-value='value' let-element='element' let-additional="additional">
-  <tb-link-column [element]="element" [value]="value" [additional]="additional" />
-</ng-template>
-
-<ng-template #routerLink  let-value='value' let-element='element' let-additional="additional">
-  <tb-router-link-column [element]="element" [value]="value" [additional]="additional"/>
-</ng-template>
-
-<ng-template #imageUrl  let-value='value'>
-  <span>
-    <img src="{{value}}" height="75px" width="75px" />
-  </span>
-</ng-template>
-
-<ng-template #arrayNewLine let-value='value' let-element='element' let-additional="additional">
-  <tb-new-line-array-column [value]='value' [additional]='additional'/>
-</ng-template>
-
-<ng-template #arrayComma let-value='value' let-element='element' let-additional="additional">
-  <tb-comma-array-column [value]='value' [additional]='additional'/>
-</ng-template>
-
-<ng-template #default let-value='value'>
-  <span>{{ value }}</span>
-</ng-template>
-
-<ng-template #defaultWithIcon  let-value='value'>
-  <mat-icon>{{ value}}</mat-icon>
-</ng-template>

package/src/table-builder/components/initialization-component/initialization-component.ts

@@ -1,24 +0,0 @@
-import { Component, TemplateRef, ViewChild } from "@angular/core";
-import { LinkColumnComponent, RouterLinkColumnComponent } from "../link-column.component";
-import { ArrayCommaColumnComponent, ArrayNewLineColumnComponent } from "../array-column.component";
-import { MatIconModule } from "@angular/material/icon";
-import { FunctionPipe } from "../../../utilities";
-
-@Component({
-    selector: 'initialization',
-    templateUrl: './initialization-component.html',
-    standalone: true,
-    imports: [
-        LinkColumnComponent, ArrayCommaColumnComponent, MatIconModule, FunctionPipe,
-        RouterLinkColumnComponent, ArrayNewLineColumnComponent
-    ]
-})
-export class InitializationComponent {
-  @ViewChild('link', {static: true}) linkTemplate! : TemplateRef<any>;
-  @ViewChild('routerLink', {static: true}) routerLinkTemplate! : TemplateRef<any>;
-  @ViewChild('imageUrl', {static: true}) imageUrlTemplate! : TemplateRef<any>;
-  @ViewChild('arrayNewLine', {static: true}) arrayNewLineTemplate! : TemplateRef<any>;
-  @ViewChild('arrayComma', {static: true}) arrayCommaTemplate! : TemplateRef<any>;
-  @ViewChild('default', {static: true}) defaultTemplate! : TemplateRef<any>;
-  @ViewChild('defaultWithIcon', {static: true}) defaultWithIcon! : TemplateRef<any>;
-}

package/src/table-builder/components/link-column.component.ts

@@ -1,47 +0,0 @@
-import { ChangeDetectionStrategy, Component, computed, input } from "@angular/core";
-import { RouterModule } from "@angular/router";
-import { LinkInfo } from "../services/link-creator.service";
-
-@Component({
-  selector: "tb-router-link-column",
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [
-    RouterModule
-  ],
-  template: `
-  <a target="{{additional().target}}"
-    [routerLink]=" [link()]"
-    [queryParams]="queryParams()"
-    [fragment]="routerLinkOptions().fragment"
-    [preserveFragment]="routerLinkOptions().preserveFragment"
-    [queryParamsHandling]="routerLinkOptions().queryParamsHandling"
-  >
-    {{value()}}
-  </a>
-  `
-})export class RouterLinkColumnComponent {
-  additional =  input.required<LinkInfo>();
-  element = input.required<any>();
-  value = input.required<string>();
-  link = computed(() => this.additional().link(this.element()));
-  queryParams = computed(() => this.additional().routerLinkOptions!.queryParams(this.element()));
-  routerLinkOptions = computed(() => this.additional().routerLinkOptions!);
-}
-
-@Component({
-  selector: "tb-link-column",
-  standalone: true,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  template: `
-  <a target="{{additional().target}}"
-      href="{{link()}}">
-      {{value()}}
-  </a>
-  `
-})export class LinkColumnComponent {
-  value = input.required<string>();
-  element = input.required<any>();
-  additional =  input.required<LinkInfo>();
-  link = computed(() => this.additional().link(this.element()));
-}

package/src/table-builder/components/number-filter/number-filter.component.css

@@ -1,10 +0,0 @@
-.switch {
-    display: inline-block;
-}
-
-.my-filter {
-    margin-right: 15px;
-}
-.inline{
-  display: inline-block;
-}