@skyux/grids 5.0.1 → 5.5.0

package/esm2015/index.js

@@ -0,0 +1,20 @@
+export * from './lib/modules/grid/grid.module';
+export * from './lib/modules/grid/grid-column.model';
+export * from './lib/modules/grid/types/grid-column-alignment';
+export * from './lib/modules/grid/types/grid-column-description-model-change';
+export * from './lib/modules/grid/types/grid-column-heading-model-change';
+export * from './lib/modules/grid/types/grid-column-inline-help-popover-model-change';
+export * from './lib/modules/grid/types/grid-column-width-model-change';
+export * from './lib/modules/grid/types/grid-message';
+export * from './lib/modules/grid/types/grid-message-type';
+export * from './lib/modules/grid/types/grid-row-delete-cancel-args';
+export * from './lib/modules/grid/types/grid-row-delete-config';
+export * from './lib/modules/grid/types/grid-row-delete-confirm-args';
+export * from './lib/modules/grid/types/grid-selected-rows-model-change';
+export * from './lib/modules/grid/types/grid-selected-rows-source';
+export * from './lib/modules/grid/types/grid-ui-config';
+// The following exports are needed internally by @skyux/list-builder-view-grids.
+// TODO: Find a way to remove them in the next major version release.
+export * from './lib/modules/grid/grid-column.component';
+export * from './lib/modules/grid/grid.component';
+//# sourceMappingURL=index.js.map

package/esm2015/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/components/grids/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,sCAAsC,CAAC;AACrD,cAAc,gDAAgD,CAAC;AAC/D,cAAc,+DAA+D,CAAC;AAC9E,cAAc,2DAA2D,CAAC;AAC1E,cAAc,uEAAuE,CAAC;AACtF,cAAc,yDAAyD,CAAC;AACxE,cAAc,uCAAuC,CAAC;AACtD,cAAc,4CAA4C,CAAC;AAC3D,cAAc,sDAAsD,CAAC;AACrE,cAAc,iDAAiD,CAAC;AAChE,cAAc,uDAAuD,CAAC;AACtE,cAAc,0DAA0D,CAAC;AACzE,cAAc,oDAAoD,CAAC;AACnE,cAAc,yCAAyC,CAAC;AAExD,iFAAiF;AACjF,qEAAqE;AACrE,cAAc,0CAA0C,CAAC;AACzD,cAAc,mCAAmC,CAAC","sourcesContent":["export * from './lib/modules/grid/grid.module';\nexport * from './lib/modules/grid/grid-column.model';\nexport * from './lib/modules/grid/types/grid-column-alignment';\nexport * from './lib/modules/grid/types/grid-column-description-model-change';\nexport * from './lib/modules/grid/types/grid-column-heading-model-change';\nexport * from './lib/modules/grid/types/grid-column-inline-help-popover-model-change';\nexport * from './lib/modules/grid/types/grid-column-width-model-change';\nexport * from './lib/modules/grid/types/grid-message';\nexport * from './lib/modules/grid/types/grid-message-type';\nexport * from './lib/modules/grid/types/grid-row-delete-cancel-args';\nexport * from './lib/modules/grid/types/grid-row-delete-config';\nexport * from './lib/modules/grid/types/grid-row-delete-confirm-args';\nexport * from './lib/modules/grid/types/grid-selected-rows-model-change';\nexport * from './lib/modules/grid/types/grid-selected-rows-source';\nexport * from './lib/modules/grid/types/grid-ui-config';\n\n// The following exports are needed internally by @skyux/list-builder-view-grids.\n// TODO: Find a way to remove them in the next major version release.\nexport * from './lib/modules/grid/grid-column.component';\nexport * from './lib/modules/grid/grid.component';\n"]}

package/esm2015/lib/modules/grid/grid-adapter.service.js

@@ -0,0 +1,84 @@
+import { Injectable, RendererFactory2, } from '@angular/core';
+import * as i0 from "@angular/core";
+const GRID_HEADER_DRAGGING_CLASS = 'sky-grid-header-dragging';
+const GRID_HEADER_LOCKED_SELECTOR = '.sky-grid-header-locked';
+const GRID_HEADER_RESIZE_HANDLE = '.sky-grid-resize-handle';
+const GRID_ROW_DELETE_SELECTOR = '.sky-grid-row-delete-heading';
+const GRID_MULTISELECT_SELECTOR = '.sky-grid-multiselect-cell';
+/**
+ * @internal
+ */
+export class SkyGridAdapterService {
+    constructor(rendererFactory) {
+        this.rendererFactory = rendererFactory;
+        this.renderer = this.rendererFactory.createRenderer(undefined, undefined);
+    }
+    initializeDragAndDrop(dragulaService, dropCallback) {
+        dragulaService.drag.subscribe(([, source]) => source.classList.add(GRID_HEADER_DRAGGING_CLASS));
+        dragulaService.dragend.subscribe(([, source]) => source.classList.remove(GRID_HEADER_DRAGGING_CLASS));
+        dragulaService.drop.subscribe(([, , container]) => {
+            let columnIds = [];
+            let nodes = container.querySelectorAll(`th:not(${GRID_MULTISELECT_SELECTOR}):not(${GRID_ROW_DELETE_SELECTOR})`);
+            for (let i = 0; i < nodes.length; i++) {
+                let el = nodes[i];
+                let id = el.getAttribute('sky-cmp-id');
+                columnIds.push(id);
+            }
+            dropCallback(columnIds);
+        });
+        dragulaService.setOptions('sky-grid-heading', {
+            moves: (el, container, handle) => {
+                const columns = container.querySelectorAll('th div');
+                const isLeftOfLocked = this.isLeftOfLocked(handle, columns);
+                return (!el.querySelector(GRID_HEADER_LOCKED_SELECTOR) &&
+                    handle !== undefined &&
+                    !handle.matches(GRID_HEADER_RESIZE_HANDLE) &&
+                    !handle.matches(GRID_MULTISELECT_SELECTOR) &&
+                    !handle.matches(GRID_ROW_DELETE_SELECTOR) &&
+                    !isLeftOfLocked);
+            },
+            accepts: (el, target, source, sibling) => {
+                if (sibling === undefined || !sibling) {
+                    return true;
+                }
+                const columns = source.querySelectorAll('th div');
+                const siblingDiv = sibling.querySelector('div');
+                const isLeftOfLocked = this.isLeftOfLocked(siblingDiv, columns);
+                return (!sibling.matches(GRID_HEADER_LOCKED_SELECTOR) &&
+                    !sibling.matches(GRID_HEADER_RESIZE_HANDLE) &&
+                    !isLeftOfLocked);
+            },
+        });
+    }
+    getRowHeight(el, index) {
+        return (el.nativeElement.querySelectorAll('tbody tr')[index].scrollHeight + 'px');
+    }
+    setStyle(el, style, value) {
+        if (el) {
+            this.renderer.setStyle(el.nativeElement, style, value);
+        }
+    }
+    isLeftOfLocked(handle, columns) {
+        let sourceColumn = handle;
+        for (let column of Array.from(columns)) {
+            if (column.contains(handle)) {
+                sourceColumn = column;
+            }
+        }
+        for (let i = columns.length - 1; i >= 0; i--) {
+            if (columns[i].classList.contains('sky-grid-header-locked')) {
+                return true;
+            }
+            if (columns[i] === sourceColumn) {
+                break;
+            }
+        }
+        return false;
+    }
+}
+SkyGridAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridAdapterService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
+SkyGridAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridAdapterService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridAdapterService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.RendererFactory2 }]; } });
+//# sourceMappingURL=grid-adapter.service.js.map

package/esm2015/lib/modules/grid/grid-adapter.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-adapter.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/grids/src/lib/modules/grid/grid-adapter.service.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Injectable,\n  Renderer2,\n  RendererFactory2,\n  ElementRef,\n} from '@angular/core';\n\nimport { DragulaService } from 'ng2-dragula';\n\nconst GRID_HEADER_DRAGGING_CLASS = 'sky-grid-header-dragging';\nconst GRID_HEADER_LOCKED_SELECTOR = '.sky-grid-header-locked';\nconst GRID_HEADER_RESIZE_HANDLE = '.sky-grid-resize-handle';\nconst GRID_ROW_DELETE_SELECTOR = '.sky-grid-row-delete-heading';\nconst GRID_MULTISELECT_SELECTOR = '.sky-grid-multiselect-cell';\n\n/**\n * @internal\n */\n@Injectable()\nexport class SkyGridAdapterService {\n  private renderer: Renderer2;\n\n  constructor(private rendererFactory: RendererFactory2) {\n    this.renderer = this.rendererFactory.createRenderer(undefined, undefined);\n  }\n\n  public initializeDragAndDrop(\n    dragulaService: DragulaService,\n    dropCallback: (newColumnIds: Array<string>) => void\n  ) {\n    dragulaService.drag.subscribe(([, source]: Array<HTMLElement>) =>\n      source.classList.add(GRID_HEADER_DRAGGING_CLASS)\n    );\n\n    dragulaService.dragend.subscribe(([, source]: Array<HTMLElement>) =>\n      source.classList.remove(GRID_HEADER_DRAGGING_CLASS)\n    );\n\n    dragulaService.drop.subscribe(([, , container]: Array<HTMLElement>) => {\n      let columnIds: string[] = [];\n      let nodes = container.querySelectorAll(\n        `th:not(${GRID_MULTISELECT_SELECTOR}):not(${GRID_ROW_DELETE_SELECTOR})`\n      );\n      for (let i = 0; i < nodes.length; i++) {\n        let el = nodes[i];\n        let id = el.getAttribute('sky-cmp-id');\n        columnIds.push(id);\n      }\n      dropCallback(columnIds);\n    });\n\n    dragulaService.setOptions('sky-grid-heading', {\n      moves: (el: HTMLElement, container: HTMLElement, handle: HTMLElement) => {\n        const columns: NodeListOf<HTMLElement> =\n          container.querySelectorAll('th div');\n        const isLeftOfLocked = this.isLeftOfLocked(handle, columns);\n\n        return (\n          !el.querySelector(GRID_HEADER_LOCKED_SELECTOR) &&\n          handle !== undefined &&\n          !handle.matches(GRID_HEADER_RESIZE_HANDLE) &&\n          !handle.matches(GRID_MULTISELECT_SELECTOR) &&\n          !handle.matches(GRID_ROW_DELETE_SELECTOR) &&\n          !isLeftOfLocked\n        );\n      },\n      accepts: (\n        el: HTMLElement,\n        target: HTMLElement,\n        source: HTMLElement,\n        sibling: HTMLElement\n      ) => {\n        if (sibling === undefined || !sibling) {\n          return true;\n        }\n\n        const columns: NodeListOf<HTMLElement> =\n          source.querySelectorAll('th div');\n        const siblingDiv = sibling.querySelector('div');\n        const isLeftOfLocked = this.isLeftOfLocked(siblingDiv, columns);\n\n        return (\n          !sibling.matches(GRID_HEADER_LOCKED_SELECTOR) &&\n          !sibling.matches(GRID_HEADER_RESIZE_HANDLE) &&\n          !isLeftOfLocked\n        );\n      },\n    });\n  }\n\n  public getRowHeight(el: ElementRef, index: number): string {\n    return (\n      el.nativeElement.querySelectorAll('tbody tr')[index].scrollHeight + 'px'\n    );\n  }\n\n  public setStyle(el: ElementRef, style: string, value: string): void {\n    if (el) {\n      this.renderer.setStyle(el.nativeElement, style, value);\n    }\n  }\n\n  private isLeftOfLocked(\n    handle: HTMLElement,\n    columns: NodeListOf<HTMLElement>\n  ): boolean {\n    let sourceColumn = handle;\n    for (let column of Array.from(columns)) {\n      if (column.contains(handle)) {\n        sourceColumn = column;\n      }\n    }\n\n    for (let i = columns.length - 1; i >= 0; i--) {\n      if (columns[i].classList.contains('sky-grid-header-locked')) {\n        return true;\n      }\n\n      if (columns[i] === sourceColumn) {\n        break;\n      }\n    }\n\n    return false;\n  }\n}\n"]}

package/esm2015/lib/modules/grid/grid-cell.component.js

@@ -0,0 +1,46 @@
+import { Component, Input, ViewChild, ViewContainerRef, TemplateRef, ChangeDetectionStrategy, } from '@angular/core';
+import { getData, ListItemModel } from '@skyux/list-builder-common';
+import * as i0 from "@angular/core";
+/**
+ * @internal
+ */
+export class SkyGridCellComponent {
+    ngOnInit() {
+        this.container.createEmbeddedView(this.template, this);
+    }
+    get row() {
+        return this.item.data;
+    }
+    get value() {
+        if (this.item.data && (this.fieldSelector || this.columnId)) {
+            return getData(this.item.data, this.fieldSelector || this.columnId);
+        }
+        return undefined;
+    }
+}
+SkyGridCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SkyGridCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyGridCellComponent, selector: "sky-grid-cell", inputs: { item: "item", columnId: "columnId", template: "template", fieldSelector: "fieldSelector" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["cell"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: '<ng-template #cell></ng-template>', isInline: true, styles: [":host{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:8px;min-height:35px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridCellComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sky-grid-cell',
+                    template: '<ng-template #cell></ng-template>',
+                    styleUrls: ['./grid-cell.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { item: [{
+                type: Input
+            }], columnId: [{
+                type: Input
+            }], template: [{
+                type: Input
+            }], fieldSelector: [{
+                type: Input
+            }], container: [{
+                type: ViewChild,
+                args: ['cell', {
+                        read: ViewContainerRef,
+                        static: true,
+                    }]
+            }] } });
+//# sourceMappingURL=grid-cell.component.js.map

package/esm2015/lib/modules/grid/grid-cell.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-cell.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/grids/src/lib/modules/grid/grid-cell.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,KAAK,EACL,SAAS,EACT,gBAAgB,EAChB,WAAW,EAEX,uBAAuB,GACxB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;;AAEpE;;GAEG;AAOH,MAAM,OAAO,oBAAoB;IAmBxB,QAAQ;QACb,IAAI,CAAC,SAAS,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;IACzD,CAAC;IAED,IAAI,GAAG;QACL,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB,CAAC;IAED,IAAI,KAAK;QACP,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ,CAAC,EAAE;YAC3D,OAAO,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC;SACrE;QAED,OAAO,SAAS,CAAC;IACnB,CAAC;;kHAjCU,oBAAoB;sGAApB,oBAAoB,yOAcvB,gBAAgB,2CAlBd,mCAAmC;4FAIlC,oBAAoB;kBANhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,eAAe;oBACzB,QAAQ,EAAE,mCAAmC;oBAC7C,SAAS,EAAE,CAAC,4BAA4B,CAAC;oBACzC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD;8BAGQ,IAAI;sBADV,KAAK;gBAIC,QAAQ;sBADd,KAAK;gBAIE,QAAQ;sBADf,KAAK;gBAIE,aAAa;sBADpB,KAAK;gBAOE,SAAS;sBAJhB,SAAS;uBAAC,MAAM,EAAE;wBACjB,IAAI,EAAE,gBAAgB;wBACtB,MAAM,EAAE,IAAI;qBACb","sourcesContent":["import {\n  Component,\n  Input,\n  ViewChild,\n  ViewContainerRef,\n  TemplateRef,\n  OnInit,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { getData, ListItemModel } from '@skyux/list-builder-common';\n\n/**\n * @internal\n */\n@Component({\n  selector: 'sky-grid-cell',\n  template: '<ng-template #cell></ng-template>',\n  styleUrls: ['./grid-cell.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyGridCellComponent implements OnInit {\n  @Input()\n  public item: ListItemModel;\n\n  @Input()\n  public columnId: string;\n\n  @Input()\n  private template: TemplateRef<any>;\n\n  @Input()\n  private fieldSelector: string;\n\n  @ViewChild('cell', {\n    read: ViewContainerRef,\n    static: true,\n  })\n  private container: ViewContainerRef;\n\n  public ngOnInit() {\n    this.container.createEmbeddedView(this.template, this);\n  }\n\n  get row() {\n    return this.item.data;\n  }\n\n  get value() {\n    if (this.item.data && (this.fieldSelector || this.columnId)) {\n      return getData(this.item.data, this.fieldSelector || this.columnId);\n    }\n\n    return undefined;\n  }\n}\n"]}

package/esm2015/lib/modules/grid/grid-column.component.js

@@ -0,0 +1,116 @@
+import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, Input, QueryList, TemplateRef, } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Specifies the column information.
+ */
+export class SkyGridColumnComponent {
+    constructor() {
+        /**
+         * Specifies the horizontal alignment of the column's data and header.
+         * Options include: `"left"`, `"center"`, and `"right"`.
+         * @default "left"
+         */
+        this.alignment = 'left';
+        /**
+         * Indicates whether the column sorts the grid when users click the column header.
+         * @default true
+         */
+        this.isSortable = true;
+        /**
+         * Specifies a search function to apply for the specific column. By default,
+         * the column executes a string compare on the column data.
+         * @default (value, searchText) => value.toString().toLowerCase().indexOf(searchText) !== -1
+         */
+        // eslint-disable-next-line @angular-eslint/no-input-rename
+        this.searchFunction = this.search;
+        this.descriptionChanges = new EventEmitter();
+        this.descriptionModelChanges = new EventEmitter();
+        this.headingChanges = new EventEmitter();
+        this.headingModelChanges = new EventEmitter();
+        this.inlineHelpPopoverModelChanges = new EventEmitter();
+    }
+    ngOnChanges(changes) {
+        if (changes.heading && changes.heading.firstChange === false) {
+            this.headingChanges.emit(this.heading);
+            this.headingModelChanges.emit({
+                value: this.heading,
+                id: this.id,
+                field: this.field,
+            });
+        }
+        if (changes.description && changes.description.firstChange === false) {
+            this.descriptionChanges.emit(this.description);
+            this.descriptionModelChanges.emit({
+                value: this.description,
+                id: this.id,
+                field: this.field,
+            });
+        }
+        if (changes.inlineHelpPopover &&
+            changes.inlineHelpPopover.firstChange === false) {
+            this.inlineHelpPopoverModelChanges.emit({
+                value: this.inlineHelpPopover,
+                id: this.id,
+                field: this.field,
+            });
+        }
+    }
+    get template() {
+        if (this.templates.length > 0) {
+            return this.templates.first;
+        }
+        return this.templateInput;
+    }
+    search(value, searchText) {
+        /* tslint:disable:no-null-keyword */
+        if (value !== undefined && value !== null) {
+            return value.toString().toLowerCase().indexOf(searchText) !== -1;
+        }
+        /* tslint:enable */
+        return false;
+    }
+}
+SkyGridColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SkyGridColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyGridColumnComponent, selector: "sky-grid-column", inputs: { alignment: "alignment", description: "description", excludeFromHighlighting: "excludeFromHighlighting", field: "field", heading: "heading", hidden: "hidden", id: "id", inlineHelpPopover: "inlineHelpPopover", isSortable: "isSortable", locked: "locked", searchFunction: ["search", "searchFunction"], type: "type", templateInput: ["template", "templateInput"], width: "width" }, queries: [{ propertyName: "templates", predicate: TemplateRef }], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SkyGridColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sky-grid-column',
+                    template: '<ng-content></ng-content>',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { alignment: [{
+                type: Input
+            }], description: [{
+                type: Input
+            }], excludeFromHighlighting: [{
+                type: Input
+            }], field: [{
+                type: Input
+            }], heading: [{
+                type: Input
+            }], hidden: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], inlineHelpPopover: [{
+                type: Input
+            }], isSortable: [{
+                type: Input
+            }], locked: [{
+                type: Input
+            }], searchFunction: [{
+                type: Input,
+                args: ['search']
+            }], type: [{
+                type: Input
+            }], templateInput: [{
+                type: Input,
+                args: ['template']
+            }], width: [{
+                type: Input
+            }], templates: [{
+                type: ContentChildren,
+                args: [TemplateRef]
+            }] } });
+//# sourceMappingURL=grid-column.component.js.map

package/esm2015/lib/modules/grid/grid-column.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-column.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/grids/src/lib/modules/grid/grid-column.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,eAAe,EACf,YAAY,EACZ,KAAK,EAEL,SAAS,EAET,WAAW,GACZ,MAAM,eAAe,CAAC;;AAUvB;;GAEG;AAMH,MAAM,OAAO,sBAAsB;IALnC;QAME;;;;WAIG;QAEI,cAAS,GAA2B,MAAM,CAAC;QAmDlD;;;WAGG;QAEI,eAAU,GAAY,IAAI,CAAC;QAWlC;;;;WAIG;QACH,2DAA2D;QAEpD,mBAAc,GACnB,IAAI,CAAC,MAAM,CAAC;QA0BP,uBAAkB,GAAyB,IAAI,YAAY,EAAU,CAAC;QAEtE,4BAAuB,GAC5B,IAAI,YAAY,EAAuC,CAAC;QAEnD,mBAAc,GAAyB,IAAI,YAAY,EAAU,CAAC;QAElE,wBAAmB,GACxB,IAAI,YAAY,EAAmC,CAAC;QAE/C,kCAA6B,GAClC,IAAI,YAAY,EAA6C,CAAC;KAmDjE;IA9CQ,WAAW,CAAC,OAAsB;QACvC,IAAI,OAAO,CAAC,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,WAAW,KAAK,KAAK,EAAE;YAC5D,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACvC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC;gBAC5B,KAAK,EAAE,IAAI,CAAC,OAAO;gBACnB,EAAE,EAAE,IAAI,CAAC,EAAE;gBACX,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ;QACD,IAAI,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,WAAW,CAAC,WAAW,KAAK,KAAK,EAAE;YACpE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;YAC/C,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC;gBAChC,KAAK,EAAE,IAAI,CAAC,WAAW;gBACvB,EAAE,EAAE,IAAI,CAAC,EAAE;gBACX,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ;QACD,IACE,OAAO,CAAC,iBAAiB;YACzB,OAAO,CAAC,iBAAiB,CAAC,WAAW,KAAK,KAAK,EAC/C;YACA,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC;gBACtC,KAAK,EAAE,IAAI,CAAC,iBAAiB;gBAC7B,EAAE,EAAE,IAAI,CAAC,EAAE;gBACX,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ;IACH,CAAC;IAED,IAAW,QAAQ;QACjB,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YAC7B,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;SAC7B;QAED,OAAO,IAAI,CAAC,aAAa,CAAC;IAC5B,CAAC;IAEO,MAAM,CAAC,KAAU,EAAE,UAAkB;QAC3C,oCAAoC;QACpC,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE;YACzC,OAAO,KAAK,CAAC,QAAQ,EAAE,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC;SAClE;QACD,mBAAmB;QAEnB,OAAO,KAAK,CAAC;IACf,CAAC;;oHAzKU,sBAAsB;wGAAtB,sBAAsB,mdAyHhB,WAAW,kDA5HlB,2BAA2B;4FAG1B,sBAAsB;kBALlC,SAAS;mBAAC;oBACT,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,2BAA2B;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD;8BAQQ,SAAS;sBADf,KAAK;gBAOC,WAAW;sBADjB,KAAK;gBAQC,uBAAuB;sBAD7B,KAAK;gBAUC,KAAK;sBADX,KAAK;gBAOC,OAAO;sBADb,KAAK;gBAQC,MAAM;sBADZ,KAAK;gBASC,EAAE;sBADR,KAAK;gBAOC,iBAAiB;sBADvB,KAAK;gBAQC,UAAU;sBADhB,KAAK;gBAUC,MAAM;sBADZ,KAAK;gBAUC,cAAc;sBADpB,KAAK;uBAAC,QAAQ;gBAQR,IAAI;sBADV,KAAK;gBAYC,aAAa;sBADnB,KAAK;uBAAC,UAAU;gBAQV,KAAK;sBADX,KAAK;gBAiBE,SAAS;sBADhB,eAAe;uBAAC,WAAW","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ContentChildren,\n  EventEmitter,\n  Input,\n  OnChanges,\n  QueryList,\n  SimpleChanges,\n  TemplateRef,\n} from '@angular/core';\n\nimport { SkyGridColumnAlignment } from './types/grid-column-alignment';\n\nimport { SkyGridColumnDescriptionModelChange } from './types/grid-column-description-model-change';\n\nimport { SkyGridColumnHeadingModelChange } from './types/grid-column-heading-model-change';\n\nimport { SkyGridColumnInlineHelpPopoverModelChange } from './types/grid-column-inline-help-popover-model-change';\n\n/**\n * Specifies the column information.\n */\n@Component({\n  selector: 'sky-grid-column',\n  template: '<ng-content></ng-content>',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SkyGridColumnComponent implements OnChanges {\n  /**\n   * Specifies the horizontal alignment of the column's data and header.\n   * Options include: `\"left\"`, `\"center\"`, and `\"right\"`.\n   * @default \"left\"\n   */\n  @Input()\n  public alignment: SkyGridColumnAlignment = 'left';\n\n  /**\n   * Specifies a description for the column.\n   */\n  @Input()\n  public description: string;\n\n  /**\n   * Indicates whether to disable the highlighting of search text in the column.\n   * @default false\n   */\n  @Input()\n  public excludeFromHighlighting: boolean;\n\n  /**\n   * Specifies the property to retrieve cell information from an entry on the grid `data` array.\n   * You must provide either the `id` or `field` property for every column,\n   * but do not provide both. If `id` does not exist on a column, then `field` is the entry\n   * for the grid `selectedColumnIds` array.\n   */\n  @Input()\n  public field: string;\n\n  /**\n   * Specifies text to display in the column header.\n   */\n  @Input()\n  public heading: string;\n\n  /**\n   * Indicates whether the column is initially hidden when grid `selectedColumnIds` are not provided.\n   * @default false\n   */\n  @Input()\n  public hidden: boolean;\n\n  /**\n   * Specifies a unique ID for the column. You must provide either the `id` or `field` property\n   * for every column, but do not provide both. If `field` does not exist on a column,\n   * then the `id` property retrieves cell information from an entry on the grid `data` array.\n   */\n  @Input()\n  public id: string;\n\n  /**\n   * Specifies a template to display inside an inline help popup for this column.\n   */\n  @Input()\n  public inlineHelpPopover: any;\n\n  /**\n   * Indicates whether the column sorts the grid when users click the column header.\n   * @default true\n   */\n  @Input()\n  public isSortable: boolean = true;\n\n  /**\n   * Indicates whether the column is locked. The intent is to display locked columns first\n   * on the left side of the grid. If set to `true`, then users cannot drag the column\n   * to another position and or drag other columns before the locked column.\n   * @default false\n   */\n  @Input()\n  public locked: boolean;\n\n  /**\n   * Specifies a search function to apply for the specific column. By default,\n   * the column executes a string compare on the column data.\n   * @default (value, searchText) => value.toString().toLowerCase().indexOf(searchText) !== -1\n   */\n  // eslint-disable-next-line @angular-eslint/no-input-rename\n  @Input('search')\n  public searchFunction: (value: any, searchText: string) => boolean =\n    this.search;\n\n  /**\n   * @internal\n   */\n  @Input()\n  public type: string;\n\n  /**\n   * Specifies a template for a column. This can be assigned as a reference\n   * to the `template` attribute, or it can be assigned as a child of the `template` element\n   * inside the `sky-grid-column` component. The template has access to the `value` variable,\n   * which contains the value passed to the column, and the `row` variable, which contains\n   * the entire row data.\n   */\n  // eslint-disable-next-line @angular-eslint/no-input-rename\n  @Input('template')\n  public templateInput: TemplateRef<any>;\n\n  /**\n   * Specifies the width of the column in pixels.\n   * If undefined, the column width is evenly distributed.\n   */\n  @Input()\n  public width: number;\n\n  public descriptionChanges: EventEmitter<string> = new EventEmitter<string>();\n\n  public descriptionModelChanges =\n    new EventEmitter<SkyGridColumnDescriptionModelChange>();\n\n  public headingChanges: EventEmitter<string> = new EventEmitter<string>();\n\n  public headingModelChanges =\n    new EventEmitter<SkyGridColumnHeadingModelChange>();\n\n  public inlineHelpPopoverModelChanges =\n    new EventEmitter<SkyGridColumnInlineHelpPopoverModelChange>();\n\n  @ContentChildren(TemplateRef)\n  private templates: QueryList<TemplateRef<any>>;\n\n  public ngOnChanges(changes: SimpleChanges): void {\n    if (changes.heading && changes.heading.firstChange === false) {\n      this.headingChanges.emit(this.heading);\n      this.headingModelChanges.emit({\n        value: this.heading,\n        id: this.id,\n        field: this.field,\n      });\n    }\n    if (changes.description && changes.description.firstChange === false) {\n      this.descriptionChanges.emit(this.description);\n      this.descriptionModelChanges.emit({\n        value: this.description,\n        id: this.id,\n        field: this.field,\n      });\n    }\n    if (\n      changes.inlineHelpPopover &&\n      changes.inlineHelpPopover.firstChange === false\n    ) {\n      this.inlineHelpPopoverModelChanges.emit({\n        value: this.inlineHelpPopover,\n        id: this.id,\n        field: this.field,\n      });\n    }\n  }\n\n  public get template(): TemplateRef<any> {\n    if (this.templates.length > 0) {\n      return this.templates.first;\n    }\n\n    return this.templateInput;\n  }\n\n  private search(value: any, searchText: string): boolean {\n    /* tslint:disable:no-null-keyword */\n    if (value !== undefined && value !== null) {\n      return value.toString().toLowerCase().indexOf(searchText) !== -1;\n    }\n    /* tslint:enable */\n\n    return false;\n  }\n}\n"]}

package/esm2015/lib/modules/grid/grid-column.model.js

@@ -0,0 +1,25 @@
+/**
+ * @internal
+ */
+export class SkyGridColumnModel {
+    constructor(template, data) {
+        this.isSortable = true;
+        this.template = template;
+        if (data) {
+            this.id = data.id || data.field;
+            this.type = data.type;
+            this.field = data.field;
+            this.heading = data.heading;
+            this.inlineHelpPopover = data.inlineHelpPopover;
+            this.width = data.width ? Number(data.width) : undefined;
+            this.hidden = data.hidden;
+            this.locked = data.locked;
+            this.description = data.description;
+            this.searchFunction = data.searchFunction;
+            this.isSortable = data.isSortable;
+            this.excludeFromHighlighting = data.excludeFromHighlighting;
+            this.alignment = data.alignment;
+        }
+    }
+}
+//# sourceMappingURL=grid-column.model.js.map

package/esm2015/lib/modules/grid/grid-column.model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-column.model.js","sourceRoot":"","sources":["../../../../../../../../libs/components/grids/src/lib/modules/grid/grid-column.model.ts"],"names":[],"mappings":"AAIA;;GAEG;AACH,MAAM,OAAO,kBAAkB;IAqB7B,YAAY,QAA0B,EAAE,IAAU;QAV3C,eAAU,GAAY,IAAI,CAAC;QAWhC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAEzB,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC;YAChC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;YACtB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;YACxB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;YAC5B,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,iBAAiB,CAAC;YAChD,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;YACzD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;YAC1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;YAC1B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC;YACpC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;YAC1C,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;YAClC,IAAI,CAAC,uBAAuB,GAAG,IAAI,CAAC,uBAAuB,CAAC;YAC5D,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC;SACjC;IACH,CAAC;CACF","sourcesContent":["import { TemplateRef } from '@angular/core';\n\nimport { SkyGridColumnAlignment } from './types/grid-column-alignment';\n\n/**\n * @internal\n */\nexport class SkyGridColumnModel {\n  public template: TemplateRef<any>;\n  public id: string;\n  public field: string;\n  public heading: string;\n  public inlineHelpPopover: any;\n  public type: string;\n  public width: number;\n  public hidden: boolean;\n  public locked: boolean;\n  public description: string;\n  public isSortable: boolean = true;\n  public excludeFromHighlighting: boolean;\n\n  /**\n   * The horizontal alignment of the column's data and header.\n   */\n  public alignment: SkyGridColumnAlignment;\n\n  public searchFunction: (data: any, searchText: string) => boolean;\n\n  constructor(template: TemplateRef<any>, data?: any) {\n    this.template = template;\n\n    if (data) {\n      this.id = data.id || data.field;\n      this.type = data.type;\n      this.field = data.field;\n      this.heading = data.heading;\n      this.inlineHelpPopover = data.inlineHelpPopover;\n      this.width = data.width ? Number(data.width) : undefined;\n      this.hidden = data.hidden;\n      this.locked = data.locked;\n      this.description = data.description;\n      this.searchFunction = data.searchFunction;\n      this.isSortable = data.isSortable;\n      this.excludeFromHighlighting = data.excludeFromHighlighting;\n      this.alignment = data.alignment;\n    }\n  }\n}\n"]}