@one-paragon/angular-utilities 2.8.2 → 2.8.4

package/src/table-builder/classes/TableState.ts

@@ -0,0 +1,96 @@
+import { CustomFilter, FilterInfo } from './filter-info';
+import { Dictionary } from '../interfaces/dictionary';
+import { Sort } from '@angular/material/sort';
+import { MetaData } from '../interfaces/meta-data';
+import { NotPersistedTableSettings, PersistedTableSettings } from './table-builder-general-settings';
+import { LinkInfo } from '../services/link-creator.service';
+import { TableProps } from '../components/table-container/tableProps';
+import { GroupedData } from '../types/group-types';
+
+export interface PersistedTableState {
+  hiddenKeys?: string [];
+  filters: Dictionary<FilterInfo | CustomFilter>;
+  sorted : Sort [];
+  userDefined : {
+    order:Dictionary<number>,
+    widths:Dictionary<number>,
+    table:{ width?:number },
+    pageSize?: number,
+    showAll?: boolean,
+    rowHeight?: number,
+    headerHeight?: number,
+    noGroups?: boolean;
+  };
+  persistedTableSettings : PersistedTableSettings;
+  groupBy: GroupedData[];
+}
+
+export interface TableState extends Required<PersistedTableState> {
+  initializationState: InitializationState;
+  metaData: Dictionary<MetaData>;
+  notPersistedTableSettings : NotPersistedTableSettings;
+  pageSize: number;
+  currentPage: number;
+  linkMaps: Dictionary<LinkInfo>;
+  allFilters: Dictionary<any[]>;
+  props: TableProps;
+  showAll: boolean;
+}
+export interface DataState {
+  virtualScrollOffset: number;
+  virtualEnds: {start: number, end: number};
+  sortedFilteredDataLength: number;
+  sortedFilteredGroupedDataLength: number;
+}
+type RequireNull<T> = { [K in keyof T]: null };
+class KeysToDelete implements RequireNull<Omit<TableState, keyof PersistedTableState>> {
+  initializationState = null;
+  metaData = null;
+  notPersistedTableSettings = null;
+  linkMaps = null;
+  pageSize = null;
+  currentPage = null;
+  virtualScrollOffset = null;
+  dataLen = null;
+  virtualEnds = null;
+  virtualEnd = null;
+  props = null;
+  showAll = null;
+  minColumnWidth = null;
+  allFilters = null;
+}
+export const keysToDelete = Object.keys(new KeysToDelete());
+
+export enum InitializationState {
+  Created,
+  MetaDataLoaded,
+  TableSettingsLoaded,
+  Ready,
+}
+
+export const defaultTableState: TableState = {
+  initializationState: InitializationState.Created,
+  metaData: {},
+  filters: {},
+  hiddenKeys: [],
+  sorted: [],
+  userDefined: { order: {}, widths: {}, table: {} },
+  persistedTableSettings: new PersistedTableSettings(),
+  notPersistedTableSettings: new NotPersistedTableSettings(),
+  pageSize: 10,
+  linkMaps: {},
+  allFilters: {},
+  groupBy: [],
+  currentPage: 0,
+
+  props: {} as TableProps,
+  showAll: false,
+};
+export const defaultDataState: DataState = {
+  virtualScrollOffset: 0,
+  sortedFilteredDataLength: 0,
+  sortedFilteredGroupedDataLength: 0,
+  virtualEnds: {
+    start: 0, end: 20
+  },
+}

package/src/table-builder/classes/data-store.ts

@@ -0,0 +1,10 @@
+import { Injectable } from "@angular/core";
+import { ComponentStore } from "@ngrx/component-store";
+import { DataState, defaultDataState } from "./TableState";
+
+@Injectable()
+export class DataStore extends ComponentStore<DataState> {
+  constructor() {
+    super({ ...defaultDataState });
+  }
+}

package/src/table-builder/classes/display-col.ts

@@ -0,0 +1,5 @@
+export interface DisplayCol {
+    key: string;
+    displayName?: string;
+    isVisible: boolean;
+}

package/src/table-builder/classes/filter-info.ts

@@ -0,0 +1,129 @@
+import { FilterType } from '../enums/filterTypes';
+import { EnumFilterFuncs, StringFilterFuncs } from '../functions/string-filter-function';
+import { NumberFilterFuncs } from '../functions/number-filter-function';
+import { DateFilterFuncs, DateTimeFilterFuncs } from '../functions/date-filter-function';
+import { BooleanFilterFuncs } from '../functions/boolean-filter-function';
+import { FieldType } from '../interfaces/meta-data';
+import { Dictionary } from '../interfaces/dictionary';
+import { Predicate } from '@angular/core';
+import { getFactory } from '../functions/sort-data-function';
+import { isBlankValueFilter } from '../services/all-values-filter-creator.service';
+
+const filterFactoryMap: Dictionary<FilterFunc<any, any>> = {
+  [FilterType.And]: (filter: FilterInfo ): ((obj: any) => boolean) => {
+    const filters = createFilterFuncs(filter.filterValue as FilterInfo[]);
+    return (obj: any) : boolean => filters.every( f => f(obj));
+  },
+  [FilterType.In]: (filter: FilterInfo ): (obj: any) => boolean => {
+    const filters = createFilterFuncs(filter.filterValue as FilterInfo[]);
+    return (obj: any) : boolean => filters.some( f => f(obj));
+  },
+};
+
+const filterTypeFuncMap : Record<FieldType, FilterFuncs<any>> = {
+  [FieldType.Array]: StringFilterFuncs,
+  [FieldType.Boolean]: BooleanFilterFuncs,
+  [FieldType.Currency]: NumberFilterFuncs,
+  [FieldType.Date]: DateFilterFuncs,
+  [FieldType.DateTime]: DateTimeFilterFuncs,
+  [FieldType.Enum]: EnumFilterFuncs,
+  [FieldType.Number]: NumberFilterFuncs,
+  [FieldType.PhoneNumber]: StringFilterFuncs,
+  [FieldType.String]: StringFilterFuncs,
+  [FieldType.Unknown]: StringFilterFuncs,
+} as Record<FieldType, FilterFuncs<any>>;
+
+export const filterTypeMap = Object.entries(filterTypeFuncMap).reduce(
+  (acc, [key, value]) => ({ ...acc, [key]: Object.keys(value) }), {} as Record<FieldType, FilterType[]>
+)
+
+export interface FilterState {
+  filterId: string;
+  filterType: FilterType;
+  filterValue?: any;
+  active?: boolean;
+  filterBy?: (t: any) => any
+}
+
+export interface FilterInfo<T extends FieldType = any, U = any> extends FilterState {
+    key: string & keyof U;
+    fieldType: T;
+    _isExternallyManaged?: boolean;
+}
+
+export interface PartialFilter {
+  filterId?: string;
+  key: string;
+  fieldType: FieldType;
+  filterType?: FilterType;
+  filterValue?: any;
+  filterBy?: (t: any) => any
+}
+
+
+export interface CustomFilter<T = any> extends FilterState {
+  predicate: Predicate<T>;
+  filterType: typeof FilterType.Custom;
+  chipLabel?: string;
+  notSavable?: boolean;
+}
+
+export function isCustomFilter(filter : FilterInfo | CustomFilter) : filter is CustomFilter {
+  return filter && filter.filterType === FilterType.Custom;
+}
+
+export function isFilterInfo(filter : FilterInfo | CustomFilter) : filter is FilterInfo {
+  return filter && typeof (filter as FilterInfo).key === 'string' && filter.filterType !== FilterType.Custom;
+}
+
+const defaultPredicate: Predicate<any> = () => true;
+
+export function createFilterFuncs(filters: (FilterInfo | CustomFilter)[]){
+  return filters.filter(needsFilterCreation).map(createFilterFunc);
+}
+
+export function needsFilterCreation(filter: FilterInfo | CustomFilter): boolean {
+  if(isCustomFilter(filter)) {
+    return filter.active !== false;
+  }
+  return filter.filterValue != undefined && filter.active !== false;
+}
+
+export function createFilterFunc(filter: FilterInfo | CustomFilter): Predicate<any> {
+  if(isCustomFilter(filter)) {
+    return filter.active ? filter.predicate : defaultPredicate;
+  }
+  if(filter.filterValue == undefined) {
+    return defaultPredicate;
+  }
+
+  const func = filterTypeFuncMap[filter.fieldType][filter.filterType](filter);
+  if(!func) {
+    if(filterFactoryMap[filter.filterType]){
+      return filterFactoryMap[filter.filterType!](filter);
+    }
+  }
+
+  const canBeTrueForNull = FalseyValueCanBeIncludedFilterTypes.includes(filter.filterType!)
+    || (filter.filterType === FilterType.In && filter.filterValue?.some(isBlankValueFilter));
+
+  const getter = filter.filterBy || getFactory(filter.key);
+  return (rowObj) => {
+    const value = getter(rowObj);
+    return ((value == undefined) && !canBeTrueForNull)
+      ? false
+      : func(value);
+  };
+}
+
+export type FilterFunc<T, V = T> = (filterInfo:FilterInfo) => (val:V) => boolean;
+export type Range<T> = { Start:T, End:T };
+
+const FalseyValueCanBeIncludedFilterTypes = [
+  FilterType.IsNull,
+  FilterType.NumberNotEqual,
+  FilterType.DateIsNotOn,
+  FilterType.StringDoesNotContain,
+] as FilterType[];
+
+export type FilterFuncs<T extends FilterType > = Partial<Record<T, FilterFunc<any, any>>>;

package/src/table-builder/classes/table-builder-general-settings.ts

@@ -0,0 +1,233 @@
+import { Predicate } from "@angular/core";
+import { merge } from "lodash";
+import { Dictionary } from "../interfaces/dictionary";
+import { StylerStyle } from "../../utilities/directives/styler";
+import { TableBuilderExport } from "./TableBuilderConfig";
+import { Path } from "../interfaces/meta-data";
+
+export interface TableBuilderSettings<T = any> {
+  headerSettings? : Partial<TableWrapperHeaderSettings>;
+  footerSettings? : Partial<TableWrapperFooterSettings>;
+  columnHeaderSettings? : Partial<TableColumnHeaderSettings>;
+  columnFooterSettings? : Partial<TableColumnFooterSettings>;
+  tableSettings? : Partial<TableSettings<T>>;
+}
+
+export class GeneralTableSettings<T = any> implements TableBuilderSettings<T> {
+  headerSettings = new TableWrapperHeaderSettings();
+  footerSettings = new TableWrapperFooterSettings();
+  columnHeaderSettings = new TableColumnHeaderSettings();
+  columnFooterSettings = new TableColumnFooterSettings();
+  tableSettings = new TableSettings<T>();
+}
+
+export class TableWrapperHeaderSettings {
+  hideExport = false
+  hideFilter = false
+  hideColumnSettings = false
+  hideHeader = false
+  hideSort = false
+  collapse = false
+  showTitleWhenCollapsed = true;
+  title: TbTitle | undefined = undefined;
+  headerHeight: TbSize | undefined = undefined;
+}
+
+export class TableWrapperFooterSettings {
+  collapse = false
+}
+
+export class TableColumnHeaderSettings {
+  stickyHeaderRow = true;
+  noFilters = false;
+  noHeader = false;
+}
+
+export class TableColumnFooterSettings {
+  stickyFooterRow?: boolean = undefined;
+}
+
+export class TableSettings<T = any> {
+  tableId?: string | undefined = undefined;
+  trackBy?: string | undefined | ((item: T) => any) = undefined;
+  includeIndexColumn = false;
+  indexColumnWidth?: TbSize | undefined = undefined;
+  includeSelectionColumn = false;
+  selectionColumnWidth?: TbSize | undefined = undefined;
+  usePaginator: boolean | undefined = undefined;
+  useVirtualScroll: boolean | undefined = undefined;
+  paginatorSettings: Partial<PaginatorOptions> | undefined = undefined;
+  virtualScrollSettings: Partial<VirtualScrollOptions> | undefined = undefined;
+  rowHeight: TbSize | undefined = undefined;
+  groupHeaderHeight?: TbSize = undefined;
+  minColumnWidth: TbSize | undefined;
+  rowClasses: Dictionary<Predicate<T> | true> | undefined;
+  rowStyles: StylerStyle<T> | undefined;
+  rowClick: ((row: T, event?: MouseEvent) => void) | undefined = undefined;
+  exportSettings: TableBuilderExport | undefined = undefined;
+  groupBySettings?: {
+    key: Path<T>
+    expanded?: boolean;
+  }[] = [];
+}
+
+export class PersistedTableSettings {
+  constructor(tableSettings?: NonFunctionProperties<PersistedTableSettings>){
+    if(tableSettings){
+      this.collapseHeader = tableSettings.collapseHeader;
+      this.collapseFooter = tableSettings.collapseFooter;
+    }
+  }
+
+  merge(tableSettings?: TableBuilderSettings){
+    const newPts = new PersistedTableSettings(this);
+    if(tableSettings){
+      newPts.collapseHeader = tableSettings.headerSettings?.collapse ?? newPts.collapseHeader;
+      newPts.collapseFooter = tableSettings.footerSettings?.collapse ?? newPts.collapseFooter;
+    }
+    return newPts;
+  }
+
+  collapseHeader = false;
+  collapseFooter = false;
+}
+
+export class NotPersistedTableSettings {
+  merge(tableSettings?: TableBuilderSettings){
+    const newNpts = merge(this, new NotPersistedTableSettings());
+    if(tableSettings){
+      newNpts.hideExport = tableSettings.headerSettings?.hideExport ?? newNpts.hideExport;
+      newNpts.hideColumnSettings = tableSettings.headerSettings?.hideColumnSettings ?? newNpts.hideColumnSettings;
+      newNpts.hideFilter = tableSettings.headerSettings?.hideFilter ?? newNpts.hideFilter;
+      newNpts.hideSort = tableSettings.headerSettings?.hideSort ?? newNpts.hideSort;
+      newNpts.showTitleWhenHeaderCollapsed = tableSettings.headerSettings?.showTitleWhenCollapsed ?? newNpts.showTitleWhenHeaderCollapsed;
+      newNpts.title = tableSettings.headerSettings?.title ?? newNpts.title;
+      newNpts.hideHeader = tableSettings.headerSettings?.hideHeader ?? newNpts.hideHeader;
+      newNpts.hideColumnHeaderFilters = tableSettings.columnHeaderSettings?.noFilters ?? newNpts.hideColumnHeaderFilters;
+      newNpts.hideColumnHeader = tableSettings.columnHeaderSettings?.noHeader ?? newNpts.hideColumnHeader;
+      newNpts.usePaginator = tableSettings.tableSettings?.usePaginator ?? newNpts.usePaginator;
+      newNpts.useVirtualScroll = tableSettings.tableSettings?.useVirtualScroll != undefined ? tableSettings.tableSettings?.useVirtualScroll :
+        tableSettings.tableSettings?.virtualScrollSettings ? true
+          : newNpts.useVirtualScroll;
+      newNpts.rowHeight = tableSettings.tableSettings?.rowHeight ?? newNpts.rowHeight;
+      newNpts.headerHeight = tableSettings.headerSettings?.headerHeight ?? newNpts.headerHeight;
+      newNpts.groupHeaderHeight = tableSettings.tableSettings?.groupHeaderHeight ?? newNpts.groupHeaderHeight;
+      newNpts.minColumnWidth = tableSettings.tableSettings?.minColumnWidth ?? newNpts.minColumnWidth;
+      newNpts.rowClasses = tableSettings.tableSettings?.rowClasses ?? newNpts.rowClasses;
+      newNpts.rowStyles = tableSettings.tableSettings?.rowStyles ?? newNpts.rowStyles;
+      newNpts.rowClick = tableSettings.tableSettings?.rowClick ?? newNpts.rowClick;
+      newNpts.exportSettings = tableSettings.tableSettings?.exportSettings ?? newNpts.exportSettings;
+      newNpts.groupBySettings = tableSettings.tableSettings?.groupBySettings ?? newNpts.groupBySettings ?? [];
+      newNpts.includeIndexColumn = tableSettings.tableSettings?.includeIndexColumn ?? newNpts.includeIndexColumn;
+      newNpts.indexColumnWidth = tableSettings.tableSettings?.indexColumnWidth ?? newNpts.indexColumnWidth;
+      newNpts.includeSelectionColumn = tableSettings.tableSettings?.includeSelectionColumn ?? newNpts.includeSelectionColumn;
+      newNpts.selectionColumnWidth = tableSettings.tableSettings?.selectionColumnWidth ?? newNpts.selectionColumnWidth;
+
+      if(tableSettings.tableSettings?.virtualScrollSettings){
+        const currVirt = tableSettings.tableSettings?.virtualScrollSettings || newNpts.virtualSettings;
+        if(!currVirt.headerHeight){
+          currVirt.headerHeight = tableSettings.headerSettings?.headerHeight || DefaultVirtualScrollOptions.headerHeight;
+        }
+        if(!currVirt.rowHeight){
+          currVirt.rowHeight = tableSettings.tableSettings?.rowHeight || DefaultVirtualScrollOptions.rowHeight;
+        }
+        newNpts.virtualSettings = { ...new VirtualScrollOptions(), ...currVirt }
+      } else newNpts.virtualSettings ??= new VirtualScrollOptions();
+      if(tableSettings.tableSettings?.paginatorSettings){
+        const currPag = tableSettings.tableSettings?.paginatorSettings ? merge(newNpts.paginatorSettings, tableSettings.tableSettings?.paginatorSettings) : (newNpts.paginatorSettings ?? new PaginatorOptions());
+        currPag.includeAllInOptions = (currPag.defaultAll && currPag.includeAllInOptions !== false) || currPag.includeAllInOptions;
+        newNpts.paginatorSettings = { ...new PaginatorOptions(), ...currPag };
+      } else newNpts.paginatorSettings ??= new PaginatorOptions();
+    }
+    return newNpts;
+  }
+  hideExport = false
+  hideFilter = false
+  hideColumnSettings = false
+  hideSort = false
+  showTitleWhenHeaderCollapsed = true;
+  title: TbTitle | undefined = undefined;
+  hideHeader = false
+  hideColumnHeaderFilters = false;
+  hideColumnHeader = false;
+  usePaginator: boolean = true;
+  useVirtualScroll: boolean = false;
+  paginatorSettings: PaginatorOptions | undefined = undefined;
+  virtualSettings: VirtualScrollOptions | undefined = undefined;
+  groupHeaderHeight?: TbSize = undefined;
+  rowHeight?: TbSize | undefined;
+  headerHeight?: TbSize = undefined;
+  minColumnWidth?: TbSize | undefined;
+  rowClasses?: Dictionary<Predicate<any> | true> | undefined;
+  rowStyles?: StylerStyle | undefined;
+  rowClick?: ((row: any, event?: MouseEvent) => void) | undefined = undefined;
+  exportSettings: TableBuilderExport | undefined = undefined;
+  groupBySettings?: {
+    key: Path<any>
+    expanded?: boolean;
+  }[] = [];
+  includeIndexColumn = false;
+  indexColumnWidth?: TbSize | undefined = undefined;
+  includeSelectionColumn = false;
+  selectionColumnWidth?: TbSize | undefined = undefined;
+}
+
+export class VirtualScrollOptions {
+  rowHeight: TbSize = 48;
+  enforceRowHeight = true;
+  headerHeight: TbSize = 56;
+  enforceHeaderHeight = true;
+  amountOfVisibleItems = 10;
+  /**
+   * This will win over `amountOfVisibleItems`
+   */
+  maxViewPortHeight: TbSize | undefined = undefined;
+  /**
+   * Will try to bring the table to the bottom of the screen
+   * If `amountOfVisibleItems` is set that will be the minimum number of rows
+   * If `maxViewPortHeight` is set that will be the max table size
+   */
+  dynamicHeight = false;
+
+  /**
+   * If `dynamicHeight` is set to true, we will try to add this amount of space from the bottom of view port
+   */
+  dynamicalHeightBuffer: TbSize = 0;
+}
+
+export class PaginatorOptions {
+  pageSize: number | undefined = undefined;
+  defaultAll = false;
+  includeAllInOptions = false;
+}
+
+export const DefaultVirtualScrollOptions = {
+  rowHeight: 48,
+  headerHeight: 56,
+};
+
+type NonFunctionPropertyNames<T> = {
+  [K in keyof T]: T[K] extends Function ? never : K
+}[keyof T];
+
+export type NonFunctionProperties<T> = Pick<T, NonFunctionPropertyNames<T>>;
+export type TbSize = number | `${number}${'px' | 'rem' }`;
+export type TbTitle = {
+  text: string;
+  level?: 1 | 2 | 3 | 4 | 5 | 6;
+  styles?: Dictionary<string>;
+}
+
+export function parseTbSizeToPixels(size?: TbSize) {
+  if(!size) return undefined;
+  if(typeof size === 'number') return size;
+  if(size.endsWith('px')) return Number(size.replace('px', ''));
+  if(size.endsWith('rem')) {
+    const htmlElement = document.documentElement;
+    const remSize = window.getComputedStyle(htmlElement).getPropertyValue('font-size');
+    const remSizeNum = Number(remSize.replace('px', ''));
+    const num = Number(size.replace('rem', ''));
+    return num * remSizeNum;
+  }
+  return undefined;
+}

package/src/table-builder/classes/table-builder.ts

@@ -0,0 +1,105 @@
+import { isObservable, Observable } from 'rxjs';
+import { MetaData, FieldType, ReportDef } from '../interfaces/meta-data';
+import { map } from 'rxjs/operators';
+import { GeneralTableSettings, TableBuilderSettings } from './table-builder-general-settings';
+import { defaultShareReplay } from '../../rxjs';
+import { initIndexSymbol } from '../components/table-container/table-container.helpers/sort-state.helpers';
+import { createDataCleaners } from '../components/table-container/table-container.helpers/data-state.helpers';
+import { assertInInjectionContext, computed, inject, Injector, isSignal, signal, Signal } from '@angular/core';
+import { toSignal } from '@angular/core/rxjs-interop';
+import { TableContainerComponent } from '../components/table-container/table-container.component';
+
+export class TableBuilder<T = any> {
+  #$metaData!: Signal<MetaData<T>[]>;
+  #$data!: Signal<T[]>;
+  #$settings! : Signal<TableBuilderSettings>;
+
+  _container = signal<TableContainerComponent | undefined>(undefined);
+  container = this._container.asReadonly();
+  $metaData = computed(() => this.$initialized() ? this.#$metaData() : undefined);
+  $settings = computed(() => this.$initialized() ? this.#$settings() : undefined);
+  #$metaNeedsPrep = signal(false);
+  #$dataIsObservable = signal(false);
+  #$settingsIsObservable = signal(false);
+  #$needsPrep = computed(() => this.#$dataIsObservable() || this.#$metaNeedsPrep() || this.#$settingsIsObservable());
+  $initialized = signal(false);
+
+  constructor(
+    private data: TableBuilderArgs<T[]>,
+    private metaData?: TableBuilderArgs<MetaData<T, any>[]>,
+    private settings: TableBuilderArgs<TableBuilderSettings<T>> = new GeneralTableSettings()
+  ) {
+    if(isObservable(data)){
+      this.#$dataIsObservable.set(true);
+    } else {
+      this.#$data = isSignal( data ) ? data : signal(data);
+    }
+    if(isObservable(metaData) || !metaData){
+      this.#$metaNeedsPrep.set(true);
+    } else {
+      this.#$metaData = isSignal( metaData ) ? metaData : signal(metaData);
+    }
+    if(isObservable(settings)){
+      this.#$settingsIsObservable.set(true);
+    } else {
+      this.#$settings = isSignal( settings ) ? settings : signal(settings);
+    }
+    if(!this.#$needsPrep()){
+      this.$initialized.set(true);
+    } else {
+      try {
+        assertInInjectionContext(TableBuilder);
+        const injector = inject(Injector);
+        this.prep(injector);
+      } catch { }
+    }
+  }
+  prep(injector: Injector){
+    if(this.#$settingsIsObservable()){
+      this.#$settings = toSignal(this.settings as any, { injector, requireSync: true });
+    }
+    if(this.#$dataIsObservable()){
+      this.#$data = toSignal(this.data as any, { injector, initialValue: [] });
+    }
+    if(this.#$metaNeedsPrep()){
+      if(this.metaData){
+        this.#$metaData = toSignal(this.metaData as any, { injector, initialValue: [] });
+      } else {
+        this.#$metaData = computed(() => this.createMetaData(this.#$data()[0]))
+      }
+    }
+    this.$initialized.set(true);
+  }
+  #dataCleaners = computed(() => {
+    const metaData = this.$metaData();
+    if(!metaData) return undefined;
+    return createDataCleaners(metaData);
+  });
+  $data = computed(() => {
+    const data = this.#$data();
+    const cleaners = this.#dataCleaners();
+    if(!data || !cleaners) return [];
+    const cleanedData = data.map((data, i) => {
+      const cleaned = cleaners(data);
+      cleaned[initIndexSymbol] = i;
+      return cleaned;
+    })
+    return cleanedData;
+  });
+
+  createMetaData(obj: any): MetaData [] {
+    return Object.keys(obj ?? {})
+      .map( key => ({
+        key,
+        fieldType: FieldType.Unknown,
+        order: -1
+      }));
+  }
+}
+
+export const CreateTableBuilder = (reportDef$: Observable<ReportDef> ): TableBuilder => {
+  reportDef$ = reportDef$.pipe(defaultShareReplay());
+  return new TableBuilder(reportDef$.pipe(map( r => r.data) ), reportDef$.pipe( map( r => r.metaData) ));
+};
+
+type TableBuilderArgs<T> = T | Observable<T> | Signal<T>;

package/src/table-builder/classes/table-store.helpers.ts

@@ -0,0 +1,109 @@
+import { Dictionary } from "../interfaces/dictionary";
+import { FieldType, MetaData, SortDef } from "../interfaces/meta-data";
+import { isCustomFilter, isFilterInfo } from "./filter-info";
+import { keysToDelete, PersistedTableState, TableState } from "./TableState";
+import { TableBuilderSort } from "../components/table-container/table-container.helpers/sort-state.helpers";
+
+export const orderedStateVisibleMetaData = (state: TableState) => {
+  const ordered = orderStateMetaData(state);
+  const orderedVisible = ordered
+    .filter(metaData => !state.hiddenKeys.includes(metaData.key) && state.metaData[metaData.key].fieldType !== FieldType.Hidden);
+  return orderedVisible;
+}
+
+export const orderedCodeVisibleMetaData = (state: TableState) =>
+  orderStateMetaData(state).filter(md => md.fieldType !== FieldType.Hidden);
+
+export const orderStateMetaData = (state:TableState) => {
+  return orderMetaData(state.metaData, state.userDefined.order);
+}
+
+export const orderMetaData = (metaData: Dictionary<MetaData>, userDefined: Dictionary<number>) => {
+  const userOrderArr = Object.entries(userDefined);
+  return userOrderArr.length ?
+    Object.values(metaData).sort((a, b) => {
+      const orderA = userDefined[a.key];
+      const orderB = userDefined[b.key];
+      return order(orderA, orderB);
+    })
+    :
+    Object.values(metaData).sort((a, b) => {
+      const orderA = a.order;
+      const orderB = b.order;
+      return order(orderA, orderB);
+    })
+}
+
+export function order(orderA: number | undefined, orderB: number | undefined){
+  if(orderA == null && orderB == null) {
+    return 0;
+  }
+  if(orderA == null) {
+    return 1;
+  }
+  if(orderB == null) {
+    return -1;
+  }
+  return orderA - orderB;
+}
+
+export function cleanPersistedState(state: TableState, pState: PersistedTableState) {
+  const metas = Object.values(state.metaData);
+  const filters = Object.values(pState.filters).filter(fltr => isCustomFilter(fltr) || metas.some(m => m.key === fltr.key)).reduce((obj: any, filter) => {
+    obj[filter.filterId!] = pState.filters[filter.filterId!];
+    if(isFilterInfo(filter)){
+      const metaData = state.metaData[filter.key];
+      if(metaData) {
+        filter.filterBy = metaData.filterLogic?.filterBy === 'use map' ? metaData.map : metaData.filterLogic?.filterBy;
+      }
+    }
+    return obj;
+  }, {});
+  const sorted = pState.sorted.filter(s => metas.some(m => m.key === s.active));
+  return ({ ...pState, filters, sorted })
+}
+
+export const mapSaveableState = (s: PersistedTableState) => {
+  const savableState = { ...s } as Partial<TableState>;
+  keysToDelete.forEach(key => delete savableState[key]);
+  return savableState as PersistedTableState;
+}
+
+export const createPreSort = (metaDatas: Dictionary<MetaData>): TableBuilderSort[] => {
+  return Object.values(metaDatas).filter(( metaData ) : metaData is MetaData & {preSort: SortDef} => !!metaData.preSort)
+    .sort(({ preSort: ps1 }, { preSort: ps2 } ) => (ps1.precedence || Number.MAX_VALUE) - ( ps2.precedence || Number.MAX_VALUE))
+    .map(( { key, preSort: { direction } } ) => ({ active: key, direction }))
+}
+
+export const mergeMeta = (orig: MetaData, merge: MetaData): MetaData => {
+  return {
+    key: orig.key,
+    displayName: merge.displayName ?? orig.displayName,
+    fieldType: merge.fieldType || orig.fieldType,
+    additional: { ...orig.additional, ...merge.additional },
+    order: merge.order ?? orig.order,
+    preSort: merge.preSort ?? orig.preSort,
+    width: merge.width ?? orig.width,
+    noExport: merge.noExport || orig.noExport,
+    noFilter: merge.noFilter || orig.noFilter,
+    map: merge.map ?? orig.map,
+    click: merge.click ?? orig.click,
+    classes: merge.classes ?? orig.classes,
+    noSort: merge.noSort ?? orig.noSort,
+    template: merge.template ?? orig.template,
+    toolTip: merge.toolTip ?? orig.toolTip,
+    useIcon: merge.useIcon ?? orig.useIcon,
+    filterLogic: merge.filterLogic ?? orig.filterLogic,
+    sortLogic: merge.sortLogic ?? orig.sortLogic,
+    groupByLogic: merge.groupByLogic ?? orig.groupByLogic,
+  } as MetaData;
+}
+
+export const initializeOrder = (state:TableState, mds: Dictionary<MetaData>) : Dictionary<number> => {
+  const viewableMetaDataArr = Object.values(mds).filter(a => a.fieldType !== FieldType.Hidden);
+  let userDefinedOrder = state.userDefined.order;
+  if(viewableMetaDataArr.some(meta => userDefinedOrder[meta.key] == null)){
+    return {}
+  }
+  return userDefinedOrder;
+}