@acorex/data-grid 3.0.21 → 3.0.25

package/lib/data-lov/data-lov-popup/data-lov-popup.component.d.ts

@@ -0,0 +1,29 @@
+import { ChangeDetectorRef, ElementRef } from '@angular/core';
+import { AXDataGridComponent } from '../../data-grid/datagrid.component';
+import { AXGridDataColumn } from '../../data-grid/columns/column.component';
+import { AXButtonItem } from '@acorex/core';
+import { AXToolbarSearchComponent, AXBasePopupPageComponent, AXMenuItemClickEvent, AXDataSourceComponent } from '@acorex/components';
+export declare class AXDataLovPopupComponent extends AXBasePopupPageComponent {
+    private cdr;
+    private ref;
+    grid: AXDataGridComponent;
+    searchBox: AXToolbarSearchComponent;
+    columns: AXGridDataColumn[];
+    selectedItems: any[];
+    keyField: string;
+    allowNull: boolean;
+    hasChildField: string;
+    rtl: boolean;
+    selectedRows: any[];
+    constructor(cdr: ChangeDetectorRef, ref: ElementRef);
+    dataSource: AXDataSourceComponent;
+    selectionMode: string;
+    ngOnInit(): void;
+    onDoneClick(): void;
+    rowDoubleClicked(e: any): void;
+    onCancelClick(): void;
+    rowSelectionChange(e: any): void;
+    ngAfterViewInit(): void;
+    getFooterButtons(): AXButtonItem[];
+    onFooterButtonClick(e: AXMenuItemClickEvent): void;
+}

package/lib/data-lov/data-lov.component.d.ts

@@ -0,0 +1,39 @@
+import { EventEmitter, ElementRef, TemplateRef } from '@angular/core';
+import { AXPopupService, AXBaseInputComponent, AXBaseSizableComponent, AXElementSize, AXValidation } from '@acorex/components';
+import { AXDataSourceComponent, AXSelectBoxComponent, AXDataEvent, AXValidatableComponent } from '@acorex/components';
+export declare class AXLOVComponent extends AXValidatableComponent implements AXBaseSizableComponent, AXBaseInputComponent {
+    private popup;
+    private ref;
+    private _contentValidation;
+    private _validation;
+    get validation(): AXValidation;
+    set validation(v: AXValidation);
+    constructor(popup: AXPopupService, ref: ElementRef);
+    selectBox: AXSelectBoxComponent;
+    dataSource: AXDataSourceComponent;
+    private columns;
+    rowTemplate: TemplateRef<any>;
+    textField: string;
+    allowSearch: boolean;
+    valueField: string;
+    hasChildField: string;
+    allowNull: boolean;
+    popupSize: 'sm' | 'md' | 'lg' | 'full';
+    selectedItems: any[];
+    readonly: boolean;
+    disabled: boolean;
+    chipsWidth: string;
+    size: AXElementSize;
+    caption: string;
+    mode: 'single' | 'multiple';
+    placeholder: string;
+    onSelectionChange: EventEmitter<AXDataEvent<any>>;
+    rtl: boolean;
+    focus(): void;
+    refresh(): void;
+    handleButtonClick(): void;
+    ngOnInit(): void;
+    ngAfterContentInit(): void;
+    handleSelectChange(e: any): void;
+    open(): Promise<any>;
+}

package/lib/data-lov/data-lov.module.d.ts

@@ -0,0 +1,2 @@
+export declare class AXLOVModule {
+}

package/package.json

@@ -1,17 +1,27 @@
-{
-  "name": "@acorex/data-grid",
-  "version": "3.0.21",
-  "peerDependencies": {
-    "@angular/common": "^9.0.6",
-    "@angular/core": "^9.0.6",
-    "ag-grid-angular": "^24.0.0",
-    "ag-grid-community": "^24.0.0",
-    "ag-grid-enterprise": "^24.0.0",
-    "tslib": "^1.10.0"
-  },
-  "dependencies": {
-    "ag-grid-angular": "^24.0.0",
-    "ag-grid-community": "^24.0.0",
-    "ag-grid-enterprise": "^24.0.0"
-  }
-}
+{
+  "name": "@acorex/data-grid",
+  "version": "3.0.25",
+  "peerDependencies": {
+    "@angular/common": "^9.0.6",
+    "@angular/core": "^9.0.6",
+    "ag-grid-angular": "^24.0.0",
+    "ag-grid-community": "^24.0.0",
+    "ag-grid-enterprise": "^24.0.0"
+  },
+  "dependencies": {
+    "ag-grid-angular": "^24.0.0",
+    "ag-grid-community": "^24.0.0",
+    "ag-grid-enterprise": "^24.0.0",
+    "tslib": "^1.10.0"
+  },
+  "main": "bundles/acorex-data-grid.umd.js",
+  "module": "fesm5/acorex-data-grid.js",
+  "es2015": "fesm2015/acorex-data-grid.js",
+  "esm5": "esm5/acorex-data-grid.js",
+  "esm2015": "esm2015/acorex-data-grid.js",
+  "fesm5": "fesm5/acorex-data-grid.js",
+  "fesm2015": "fesm2015/acorex-data-grid.js",
+  "typings": "acorex-data-grid.d.ts",
+  "metadata": "acorex-data-grid.metadata.json",
+  "sideEffects": false
+}

package/{src/public-api.ts → public-api.d.ts}

@@ -5,16 +5,13 @@ export * from './lib/data-grid/columns/date-column.component';
 export * from './lib/data-grid/columns/selection-column.component';
 export * from './lib/data-grid/columns/text-column.component';
 export * from './lib/data-grid/columns/row-number-column.component';
-
 export * from './lib/data-grid/datagrid.component';
 export * from './lib/data-grid/datagrid.events';
 export * from './lib/data-grid/datagrid.module';
-
 export * from './lib/data-grid/filters/filter.component';
 export * from './lib/data-grid/templates/cell-template.component';
 export * from './lib/data-grid/templates/row-template.component';
 export * from './lib/data-grid/templates/detail-template.component';
-
 export * from './lib/data-lov/data-lov-popup/data-lov-popup.component';
 export * from './lib/data-lov/data-lov.component';
 export * from './lib/data-lov/data-lov.module';

package/karma.conf.js

@@ -1,32 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../../coverage/acorex/data-grid'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
-  });
-};

package/ng-package.json

@@ -1,12 +0,0 @@
-{
-  "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../../dist/acorex/data-grid",
-  "lib": {
-    "entryFile": "src/public-api.ts"
-  },
-  "whitelistedNonPeerDependencies": [
-    "ag-grid-community",
-    "ag-grid-angular",
-    "ag-grid-enterprise"
-  ]
-}

package/src/lib/data-grid/columns/check-column.component.ts

@@ -1,113 +0,0 @@
-import {
-  Component,
-  ChangeDetectionStrategy,
-  ViewChild,
-  ViewContainerRef
-} from '@angular/core';
-import { AXGridDataColumn } from './column.component';
-import { ICellRendererAngularComp, IFilterAngularComp } from 'ag-grid-angular';
-import {
-  ICellRendererParams,
-  IFilterParams,
-  RowNode,
-  IDoesFilterPassParams,
-  IAfterGuiAttachedParams
-} from 'ag-grid-community';
-
-@Component({
-  selector: 'ax-check-column',
-  template: '',
-  providers: [{ provide: AXGridDataColumn, useExisting: AXGridCheckColumn }],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-
-export class AXGridCheckColumn extends AXGridDataColumn {
-  constructor() {
-    super();
-  }
-
-  render() {
-    const col = super.render();
-    if (!col.cellRendererFramework) {
-      col.cellRendererFramework = BooleanRenderer;
-    }
-    if (this.allowFiltering) {
-      col.filterFramework = BooleanFilterRenderer;
-    }
-    return col;
-  }
-}
-
-@Component({
-  template: `
-    <ax-check-box [value]='value' readonly='true'></ax-check-box>
-  `,
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class BooleanRenderer implements ICellRendererAngularComp {
-  value: boolean;
-  constructor() { }
-  agInit(params: ICellRendererParams): void {
-    this.value = params.value;
-  }
-  refresh(params: ICellRendererParams): boolean {
-    this.value = params.value;
-    return true;
-  }
-}
-
-@Component({
-  template: `
-    <ax-data-grid-filter>
-      <ax-select-box
-        label='Select Box'
-        [items]='selectItem'
-      ></ax-select-box>
-    </ax-data-grid-filter>
-  `,
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class BooleanFilterRenderer implements IFilterAngularComp {
-  public value?: boolean = null;
-  private params: IFilterParams;
-  private valueGetter: (rowNode: RowNode) => any;
-  @ViewChild('input', { static: true, read: ViewContainerRef }) public input;
-
-  selectItem = [
-    { value: 0, label: 'True' },
-    { value: 1, label: 'False' },
-  ];
-  agInit(params: IFilterParams): void {
-    this.params = params;
-    this.valueGetter = params.valueGetter;
-  }
-
-  isFilterActive(): boolean {
-    return this.value !== null && this.value !== undefined;
-  }
-
-  doesFilterPass(params: IDoesFilterPassParams): boolean {
-    return this.value === this.valueGetter(params.node);
-  }
-
-  getModel(): any {
-    return { value: this.value };
-  }
-
-  setModel(model: any): void {
-    this.value = model ? model.value : null;
-  }
-
-  ngAfterViewInit(params: IAfterGuiAttachedParams): void {
-    window.setTimeout(() => {
-      this.input.element.nativeElement.focus();
-    });
-  }
-
-  onChange(newValue): void {
-    if (this.value !== newValue) {
-      this.value = newValue;
-      this.params.filterChangedCallback();
-    }
-  }
-}

package/src/lib/data-grid/columns/column.component.ts

@@ -1,181 +0,0 @@
-import { AXConfig } from '@acorex/core';
-import { Input, ContentChild, TemplateRef } from '@angular/core';
-import { AXGridCellParams } from '../datagrid.events';
-import { AXDataGridCellTemplateComponent } from '../templates/cell-template.component';
-import { AXDatePickerFilterComponent } from './date-column.component';
-
-
-export abstract class AXGridDataColumn {
-
-
-    @ContentChild(AXDataGridCellTemplateComponent)
-    cellTemplate: AXDataGridCellTemplateComponent;
-
-    @Input()
-    width: number = 100;
-
-    @Input()
-    maxWidth: number;
-
-    @Input()
-    minWidth: number;
-
-    @Input()
-    pinned: 'start' | 'end' | null = null;
-
-    @Input()
-    allowSorting: boolean = true;
-
-    @Input()
-    allowFiltering: boolean = AXConfig.get('datagrid.allowFiltering') || false;;
-
-    @Input()
-    cellClass: (params: AXGridCellParams) => (string | string[]) | (string | string[]);
-
-    @Input()
-    sort: 'asc' | 'desc' | null = null;
-
-    @Input()
-    field: string = '';
-
-    @Input()
-    caption: string = '';
-
-    @Input()
-    cellRendererParams: any;
-
-    @Input()
-    checkbox: boolean = false;
-
-    @Input()
-    headerCheckbox: boolean = false;
-
-    @Input()
-    groupIndex: number = -1;
-
-    @Input()
-    treeIndex: number = -1;
-
-    @Input()
-    enableRowGroup: boolean = false;
-
-    @Input()
-    hide: boolean = false;
-
-    @Input()
-    floatingFilter: boolean = AXConfig.get('datagrid.floatingFilter') || false;
-
-    @Input()
-    disableMenu: boolean = false;
-
-    @Input()
-    resizable: boolean = true;
-
-    @Input()
-    menuColumnDisable: boolean = false;
-
-    @Input()
-    menuItemDisable: boolean = false;
-
-    constructor() { }
-
-    render(): any {
-        const col: any = {
-            field: this.field,
-            width: this.width,
-        };
-        col.resizable = this.resizable;
-        col.suppressMenu = this.disableMenu;
-        col.menuTabs = ['filterMenuTab', 'columnsMenuTab', 'generalMenuTab']
-        col.floatingFilter = this.floatingFilter;
-
-        if (!this.allowFiltering) {
-            col.filter = false;
-            col.menuTabs = col.menuTabs.filter(c => c != 'filterMenuTab');
-            col.floatingFilter = false;
-        }
-        if (this.menuColumnDisable == true) {
-            col.menuTabs = col.menuTabs.filter(c => c != 'columnsMenuTab');
-        }
-        if (this.menuItemDisable == true) {
-            col.menuTabs = col.menuTabs.filter(c => c != 'generalMenuTab');
-        }
-        if (this.caption) {
-            col.headerName = this.caption;
-        }
-        if (this.minWidth) {
-            col.minWidth = this.minWidth;
-        }
-        if (this.maxWidth) {
-            col.maxWidth = this.maxWidth;
-        }
-        if (this.pinned) {
-            col.pinned = this.pinned === 'start' ? 'right' : 'left';
-            // TODO: Change based on layout
-        }
-        if (this.allowSorting) {
-            col.sortable = this.allowSorting;
-        }
-        if (this.sort) {
-            col.sort = this.sort;
-        }
-
-        if (this.groupIndex >= 0) {
-            col.rowGroupIndex = this.groupIndex;
-            col.rowGroup = true;
-            this.enableRowGroup = true;
-        }
-
-        if (this.treeIndex >= 0) {
-            col.rowGroupIndex = this.treeIndex;
-            col.rowGroup = false;
-        }
-        if (this.hide) {
-            col.hide = true;
-
-        }
-        if (this.enableRowGroup) {
-            col.enableRowGroup = this.enableRowGroup;
-        }
-
-        if (this.cellClass) {
-            const THAT = this;
-            if (this.cellClass instanceof Function) {
-                col.cellClass = (p) => {
-                    return THAT.cellClass({
-                        column: THAT,
-                        rowIndex: p.node.rowIndex,
-                        rowLevel: p.node.level,
-                        data: p.data,
-                        value: p.value
-                    });
-                };
-            }
-            else {
-                col.cellClass = this.cellClass;
-
-            }
-        }
-        //
-        if (this.cellTemplate != null) {
-            col.cellRendererFramework = this.cellTemplate.renderer;
-            col.cellRendererParams = this.cellTemplate.params;
-        }
-
-        if (this.checkbox) {
-            col.checkboxSelection = (params) => {
-                return true;
-            };
-            //  col.headerCheckboxSelection = this.headerCheckbox;
-        }
-        return col;
-    }
-}
-
-
-
-
-
-
-
-

package/src/lib/data-grid/columns/command-column.component.ts

@@ -1,102 +0,0 @@
-import { AXGridDataColumn } from './column.component';
-import { ChangeDetectionStrategy, Component, Input, EventEmitter, ViewEncapsulation, Output, ChangeDetectorRef } from '@angular/core';
-import { ICellRendererParams } from 'ag-grid-community';
-import { AXGridRowCommandEvent } from '../datagrid.events';
-import { AXMenuItem } from '@acorex/core';
-import { ICellRendererAngularComp } from 'ag-grid-angular';
-
-export type AXGridRowCommandFunction = (row: any) => AXMenuItem[];
-
-@Component({
-  selector: 'ax-command-column',
-  template: '',
-  providers: [{ provide: AXGridDataColumn, useExisting: AXGridCommandColumn }],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  encapsulation: ViewEncapsulation.None
-})
-export class AXGridCommandColumn extends AXGridDataColumn {
-
-
-  @Input()
-  items: AXMenuItem[] | AXGridRowCommandFunction = [];
-
-  @Output()
-  onItemClick: EventEmitter<AXGridRowCommandEvent> = new EventEmitter<AXGridRowCommandEvent>();
-
-  render() {
-    const col = super.render();
-    if (!col.cellRendererFramework) {
-      col.cellRendererFramework = CommandRenderer;
-    }
-    col.cellRendererParams = {
-      items: this.items,
-      onClick: (e) => {
-        this.onItemClick.emit({
-          command: e.name,
-          data: e.data,
-          rowIndex: e.rowIndex,
-          rowLevel: e.rowLevel,
-          htmlEvent:e.htmlEvent
-        });
-      }
-    };
-    col.sortable = false;
-    col.filter = false;
-    col.valueGetter = (params) => {
-      return this.items;
-    };
-    return col;
-  }
-}
-
-@Component({
-  selector: 'ax-command-cell',
-  template: `
-    <button
-      *ngFor="let item of items"
-      class="ax button md ax-grid-command-button {{ item.style || 'ax primary blank' }}"
-      [class.disabled]="item.disable"
-      type="button"
-      [title]="item.tooltip"
-      (click)="onClick(item,$event)"
-    >
-      <i [ngClass]="item.icon"></i>{{ item.text }}
-    </button>
-  `,
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class CommandRenderer implements ICellRendererAngularComp {
-  items: AXMenuItem[] | AXGridRowCommandFunction = [];
-  node: any;
-  private clickCallback: Function;
-
-  constructor() { }
-
-  agInit(params: ICellRendererParams): void {
-    this.mapParams(params);
-  }
-
-  refresh(params: ICellRendererParams): boolean {
-    this.mapParams(params);
-    return true;
-  }
-
-  private mapParams(params: any) {
-    this.node = params.node;
-    this.items = typeof params.items == 'function' ? params.items({ data: this.node.data }) : Array.isArray(params.items) ? params.items : [];
-    this.clickCallback = params.onClick;
-  }
-
-  onClick(item: AXMenuItem,e:MouseEvent) {
-    if (this.clickCallback && !item.disable) {
-      this.clickCallback({
-        name: item.name,
-        rowLevel: this.node.level,
-        rowIndex: this.node.rowIndex,
-        data: this.node.data,
-        htmlEvent:e
-      });
-    }
-  }
-}

package/src/lib/data-grid/columns/date-column.component.ts

@@ -1,119 +0,0 @@
-
-import {
-  Component,
-  ChangeDetectionStrategy,
-  Input,
-  ViewEncapsulation,
-  ViewChild,
-  ElementRef
-} from '@angular/core';
-import { AXGridDataColumn } from './column.component';
-import { AXDateTime, AXConfig, AXCalendarType } from '@acorex/core';
-import { AXDatePickerComponent } from '@acorex/components';
-@Component({
-  selector: 'ax-date-column',
-  template: '',
-  providers: [{ provide: AXGridDataColumn, useExisting: AXGridDateColumn }],
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class AXGridDateColumn extends AXGridDataColumn {
-  constructor() {
-    super();
-  }
-
-  @Input()
-  format: string;
-
-  @Input()
-  type: AXCalendarType = AXConfig.get('dateTime.type');
-
-  render() {
-    const col = super.render();
-    col.cellRendererParams = {
-      format: this.format,
-    };
-
-    col.comparator = (valueA: any, valueB: any) => {
-      const date1 = AXDateTime.convert(valueA);
-      const date2 = AXDateTime.convert(valueB);
-      //
-      if (date1 === null && date2 === null) {
-        return 0;
-      }
-      if (date1 === null) {
-        return -1;
-      }
-      if (date2 === null) {
-        return 1;
-      }
-      return (date1.date.getTime() - date2.date.getTime());
-    };
-
-    col.valueFormatter = (params) => {
-      const date: AXDateTime = AXDateTime.convert(params.value, this.type);
-      if (date) {
-        return date.format(this.format);
-      }
-      else {
-        return null;
-      }
-    };
-    col.filter = 'agDateColumnFilter';
-    // col.floatingFilter = true;
-    return col;
-  }
-}
-
-@Component({
-  selector: 'ax-data-picker-filter',
-  template: `<ax-date-picker [selectableHoliday]="selectableHoliday" [allowClear]="true" (onValueChanged)="onValueChanged($event)" size="sm">
-     </ax-date-picker>`,
-  host: { style: 'display: contents;' },
-  encapsulation: ViewEncapsulation.None
-})
-export class AXDatePickerFilterComponent {
-  @ViewChild(AXDatePickerComponent)
-  datePicker: AXDatePickerComponent;
-  @ViewChild('div', { read: ElementRef }) div: ElementRef;
-  selectableHoliday: boolean = false;
-  type: string = 'jalali';
-  date: Date;
-  params: any;
-  picker: any;
-
-
-  agInit(params: any): void {
-    this.params = params;
-  }
-
-  ngAfterViewInit() {
-
-  }
-  ngOnDestroy() {
-    console.log(`Destroying DateComponent`);
-  }
-
-  onDateChanged(selectedDates) {
-    //this.date = selectedDates[0] || null;
-    this.params.onDateChanged();
-  }
-
-  getDate(): Date {
-    return this.date;
-  }
-
-  setDate(date: Date): void {
-    this.date = date || null;
-    //this.picker.setDate(date);
-  }
-
-  setInputPlaceholder(placeholder: string): void {
-    //this.div.nativeElement.setAttribute('placeholder', placeholder);
-  }
-  onValueChanged(e) {
-
-    this.setDate(e.value);
-    this.onDateChanged(e.value);
-  }
-
-}