@skyux/list-builder-view-grids 4.0.2 → 5.0.1

package/fesm5/skyux-list-builder-view-grids.js

@@ -1,864 +0,0 @@
-import { __decorate, __param, __extends, __spread } from 'tslib';
-import { Component, NgModule, EventEmitter, Optional, Input, Output, ViewChild, Injectable, ContentChildren, forwardRef, ChangeDetectionStrategy } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { SkyModalInstance, SkyModalModule, SkyModalService } from '@skyux/modals';
-import { SkyI18nModule, getStringForLocale, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
-import { SkyListModule, SkyListToolbarModule, ListToolbarItemModel, ListState, ListStateDispatcher, SkyListSecondaryActionsComponent, SkyListSecondaryActionsModule, ListSearchModel, ListViewComponent } from '@skyux/list-builder';
-import { SkyListViewChecklistModule } from '@skyux/list-builder-view-checklist';
-import { SkyIconModule, SkyWaitModule } from '@skyux/indicators';
-import { map, distinctUntilChanged, take, takeUntil, scan } from 'rxjs/operators';
-import { Subject, of } from 'rxjs';
-import { AsyncList, StateDispatcher, StateOrchestrator, StateNode, isObservable, getValue, getData } from '@skyux/list-builder-common';
-import { SkyGridColumnModel, SkyGridSelectedRowsSource, SkyGridMessageType, SkyGridComponent, SkyGridColumnComponent, SkyGridModule } from '@skyux/grids';
-
-/* istanbul ignore next */
-/* Code coverage having problems with no statements in classes */
-var SkyColumnSelectorContext = /** @class */ (function () {
-    function SkyColumnSelectorContext() {
-    }
-    return SkyColumnSelectorContext;
-}());
-/* istanbul ignore next */
-/* Code coverage having problems with no statements in classes */
-var SkyColumnSelectorModel = /** @class */ (function () {
-    function SkyColumnSelectorModel() {
-    }
-    return SkyColumnSelectorModel;
-}());
-
-var SkyColumnSelectorComponent = /** @class */ (function () {
-    function SkyColumnSelectorComponent(context, instance) {
-        this.context = context;
-        this.instance = instance;
-        this.newSelectedColumnIds = [];
-        this.newSelectedColumnIds = context.selectedColumnIds;
-    }
-    SkyColumnSelectorComponent.prototype.selectedColumnsChange = function (selectedMap) {
-        var _this = this;
-        this.newSelectedColumnIds = [];
-        selectedMap.forEach(function (value, key) {
-            if (value) {
-                _this.newSelectedColumnIds.push(key);
-            }
-        });
-    };
-    SkyColumnSelectorComponent.prototype.cancelChanges = function () {
-        this.instance.cancel();
-    };
-    SkyColumnSelectorComponent.prototype.applyChanges = function () {
-        this.instance.save(this.newSelectedColumnIds);
-    };
-    SkyColumnSelectorComponent.ctorParameters = function () { return [
-        { type: SkyColumnSelectorContext },
-        { type: SkyModalInstance }
-    ]; };
-    SkyColumnSelectorComponent = __decorate([
-        Component({
-            selector: 'sky-column-selector',
-            template: "<sky-modal>\n  <sky-modal-header>\n    {{'skyux_grid_column_picker_header' | skyLibResources}}\n  </sky-modal-header>\n  <sky-modal-content>\n    <sky-list #list\n      [data]=\"context.columns\"\n      [selectedIds]=\"context.selectedColumnIds\"\n      (selectedIdsChange)=\"selectedColumnsChange($event)\">\n      <sky-list-toolbar\n        [placeholder]=\"'skyux_grid_column_picker_search_placeholder' | skyLibResources\">\n      </sky-list-toolbar>\n\n      <sky-list-view-checklist label=\"heading\" description=\"description\">\n      </sky-list-view-checklist>\n    </sky-list>\n  </sky-modal-content>\n  <sky-modal-footer>\n    <button\n      sky-cmp-id=\"apply-changes\"\n      class=\"sky-btn sky-btn-primary\"\n      (click)=\"applyChanges()\">\n      {{'skyux_grid_column_picker_submit' | skyLibResources}}\n    </button>\n    <button\n      sky-cmp-id=\"cancel\"\n      class=\"sky-btn sky-btn-link\"\n      (click)=\"cancelChanges()\">\n      {{'skyux_grid_column_picker_cancel' | skyLibResources}}\n    </button>\n  </sky-modal-footer>\n</sky-modal>\n"
-        })
-    ], SkyColumnSelectorComponent);
-    return SkyColumnSelectorComponent;
-}());
-
-var SkyColumnSelectorModule = /** @class */ (function () {
-    function SkyColumnSelectorModule() {
-    }
-    SkyColumnSelectorModule = __decorate([
-        NgModule({
-            declarations: [
-                SkyColumnSelectorComponent
-            ],
-            imports: [
-                CommonModule,
-                SkyI18nModule,
-                SkyModalModule,
-                SkyListModule,
-                SkyListToolbarModule,
-                SkyListViewChecklistModule
-            ],
-            exports: [
-                SkyColumnSelectorComponent
-            ],
-            entryComponents: [
-                SkyColumnSelectorComponent
-            ]
-        })
-    ], SkyColumnSelectorModule);
-    return SkyColumnSelectorModule;
-}());
-
-var ListViewDisplayedGridColumnsLoadAction = /** @class */ (function () {
-    function ListViewDisplayedGridColumnsLoadAction(columns, refresh) {
-        if (refresh === void 0) { refresh = false; }
-        this.columns = columns;
-        this.refresh = refresh;
-    }
-    return ListViewDisplayedGridColumnsLoadAction;
-}());
-
-var SkyListColumnSelectorActionComponent = /** @class */ (function () {
-    function SkyListColumnSelectorActionComponent(listState, modalService, dispatcher, secondaryActions) {
-        this.listState = listState;
-        this.modalService = modalService;
-        this.dispatcher = dispatcher;
-        this.secondaryActions = secondaryActions;
-        this.helpOpened = new EventEmitter();
-        this.columnSelectorActionItemToolbarIndex = 7000;
-    }
-    SkyListColumnSelectorActionComponent.prototype.ngAfterContentInit = function () {
-        if (!this.secondaryActions) {
-            var columnChooserItem = new ListToolbarItemModel({
-                id: 'column-chooser',
-                template: this.columnChooserTemplate,
-                location: 'left'
-            });
-            this.dispatcher.toolbarAddItems([
-                columnChooserItem
-            ], this.columnSelectorActionItemToolbarIndex);
-        }
-    };
-    Object.defineProperty(SkyListColumnSelectorActionComponent.prototype, "isInGridView", {
-        get: function () {
-            var _this = this;
-            return this.listState.pipe(map(function (s) { return s.views.active; }), map(function (activeView) {
-                return _this.gridView && (activeView === _this.gridView.id);
-            }), distinctUntilChanged());
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(SkyListColumnSelectorActionComponent.prototype, "isInGridViewAndSecondary", {
-        get: function () {
-            var _this = this;
-            return this.listState.pipe(map(function (s) { return s.views.active; }), map(function (activeView) {
-                return _this.secondaryActions && _this.gridView && (activeView === _this.gridView.id);
-            }), distinctUntilChanged());
-        },
-        enumerable: true,
-        configurable: true
-    });
-    SkyListColumnSelectorActionComponent.prototype.openColumnSelector = function () {
-        var _this = this;
-        /* istanbul ignore else */
-        /* sanity check */
-        if (this.gridView) {
-            var columns_1 = [];
-            var selectedColumnIds_1 = [];
-            this.gridView.gridState.pipe(take(1)).subscribe(function (state) {
-                columns_1 = state.columns.items
-                    .filter(function (item) {
-                    return !item.locked;
-                })
-                    .map(function (item) {
-                    return {
-                        id: item.id,
-                        heading: item.heading,
-                        description: item.description
-                    };
-                });
-                selectedColumnIds_1 = state.displayedColumns.items
-                    .filter(function (item) {
-                    return !item.locked;
-                })
-                    .map(function (item) {
-                    return item.id;
-                });
-            });
-            var modalInstance = this.modalService.open(SkyColumnSelectorComponent, {
-                providers: [
-                    {
-                        provide: SkyColumnSelectorContext,
-                        useValue: {
-                            columns: columns_1,
-                            selectedColumnIds: selectedColumnIds_1
-                        }
-                    }
-                ],
-                helpKey: this.helpKey
-            });
-            modalInstance.helpOpened
-                .subscribe(function (helpKey) {
-                _this.helpOpened.emit(helpKey);
-                _this.helpOpened.complete();
-            });
-            modalInstance.closed.subscribe(function (result) {
-                if (result.reason === 'save' && result.data) {
-                    var newSelectedIds_1 = result.data;
-                    var newDisplayedColumns_1 = [];
-                    _this.gridView.gridState.pipe(take(1))
-                        .subscribe(function (state) {
-                        newDisplayedColumns_1 = state.columns.items.filter(function (item) {
-                            return newSelectedIds_1.indexOf(item.id) > -1 || item.locked;
-                        });
-                    });
-                    _this.gridView.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(newDisplayedColumns_1, true));
-                }
-            });
-        }
-    };
-    SkyListColumnSelectorActionComponent.ctorParameters = function () { return [
-        { type: ListState },
-        { type: SkyModalService },
-        { type: ListStateDispatcher },
-        { type: SkyListSecondaryActionsComponent, decorators: [{ type: Optional }] }
-    ]; };
-    __decorate([
-        Input()
-    ], SkyListColumnSelectorActionComponent.prototype, "gridView", void 0);
-    __decorate([
-        Input()
-    ], SkyListColumnSelectorActionComponent.prototype, "helpKey", void 0);
-    __decorate([
-        Output()
-    ], SkyListColumnSelectorActionComponent.prototype, "helpOpened", void 0);
-    __decorate([
-        ViewChild('columnChooser', {
-            static: true
-        })
-    ], SkyListColumnSelectorActionComponent.prototype, "columnChooserTemplate", void 0);
-    SkyListColumnSelectorActionComponent = __decorate([
-        Component({
-            selector: 'sky-list-column-selector-action',
-            template: "<ng-container *ngIf=\"isInGridViewAndSecondary | async\">\n  <sky-list-secondary-action>\n    <button type=\"button\" (click)=\"openColumnSelector()\">\n      {{ 'skyux_grid_columns_button' | skyLibResources }}\n    </button>\n  </sky-list-secondary-action>\n</ng-container>\n\n<ng-template #columnChooser>\n  <sky-list-column-selector-button *ngIf=\"isInGridView | async\"\n    (click)=\"openColumnSelector()\"\n  >\n  </sky-list-column-selector-button>\n</ng-template>\n"
-        }),
-        __param(3, Optional())
-    ], SkyListColumnSelectorActionComponent);
-    return SkyListColumnSelectorActionComponent;
-}());
-
-var SkyListColumnSelectorButtonComponent = /** @class */ (function () {
-    function SkyListColumnSelectorButtonComponent() {
-    }
-    SkyListColumnSelectorButtonComponent = __decorate([
-        Component({
-            selector: 'sky-list-column-selector-button',
-            template: "<button\n  class=\"sky-btn sky-btn-default\"\n  type=\"button\"\n  [attr.aria-label]=\"'skyux_grid_columns_button' | skyLibResources\"\n  [title]=\"'skyux_grid_columns_button' | skyLibResources\"\n>\n  <sky-icon\n    icon=\"columns\"\n  ></sky-icon>\n  <span\n    class=\"sky-column-selector-action-btn-text\"\n  >\n    {{ 'skyux_grid_columns_toolbar_button' | skyLibResources }}\n  </span>\n</button>\n",
-            styles: [":host .sky-column-selector-action-btn-text{display:none}:host-context(.sky-responsive-container-lg) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-md) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-sm) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-xs) .sky-column-selector-action-btn-text{display:none}@media (min-width:768px){:host .sky-column-selector-action-btn-text{display:inline}}:host-context(.sky-responsive-container-lg) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-md) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-sm) .sky-column-selector-action-btn-text{display:inline}"]
-        })
-    ], SkyListColumnSelectorButtonComponent);
-    return SkyListColumnSelectorButtonComponent;
-}());
-
-var SkyListColumnSelectorActionModule = /** @class */ (function () {
-    function SkyListColumnSelectorActionModule() {
-    }
-    SkyListColumnSelectorActionModule = __decorate([
-        NgModule({
-            declarations: [
-                SkyListColumnSelectorActionComponent,
-                SkyListColumnSelectorButtonComponent
-            ],
-            imports: [
-                CommonModule,
-                SkyI18nModule,
-                SkyModalModule,
-                SkyListSecondaryActionsModule,
-                SkyListToolbarModule,
-                SkyIconModule
-            ],
-            exports: [
-                SkyListColumnSelectorActionComponent,
-                SkyColumnSelectorModule
-            ]
-        })
-    ], SkyListColumnSelectorActionModule);
-    return SkyListColumnSelectorActionModule;
-}());
-
-var GridStateModel = /** @class */ (function () {
-    function GridStateModel() {
-        this.columns = new AsyncList();
-        this.displayedColumns = new AsyncList();
-    }
-    return GridStateModel;
-}());
-
-var GridStateDispatcher = /** @class */ (function (_super) {
-    __extends(GridStateDispatcher, _super);
-    function GridStateDispatcher() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    GridStateDispatcher = __decorate([
-        Injectable()
-    ], GridStateDispatcher);
-    return GridStateDispatcher;
-}(StateDispatcher));
-var GridStateOrchestrator = /** @class */ (function (_super) {
-    __extends(GridStateOrchestrator, _super);
-    function GridStateOrchestrator() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    return GridStateOrchestrator;
-}(StateOrchestrator));
-
-var ListViewGridColumnsLoadAction = /** @class */ (function () {
-    function ListViewGridColumnsLoadAction(columns, refresh) {
-        if (refresh === void 0) { refresh = false; }
-        this.columns = columns;
-        this.refresh = refresh;
-    }
-    return ListViewGridColumnsLoadAction;
-}());
-
-var ListViewGridColumnsOrchestrator = /** @class */ (function (_super) {
-    __extends(ListViewGridColumnsOrchestrator, _super);
-    /* istanbul ignore next */
-    function ListViewGridColumnsOrchestrator() {
-        var _this = _super.call(this) || this;
-        _this
-            .register(ListViewGridColumnsLoadAction, _this.load);
-        return _this;
-    }
-    ListViewGridColumnsOrchestrator.prototype.load = function (state, action) {
-        var newColumns = action.columns.map(function (g) { return new SkyGridColumnModel(g.template, g); });
-        if (action.refresh) {
-            return new AsyncList(__spread(newColumns), new Date());
-        }
-        return new AsyncList(__spread(state.items, newColumns), new Date());
-    };
-    return ListViewGridColumnsOrchestrator;
-}(GridStateOrchestrator));
-
-var ListViewDisplayedGridColumnsOrchestrator = /** @class */ (function (_super) {
-    __extends(ListViewDisplayedGridColumnsOrchestrator, _super);
-    /* istanbul ignore next */
-    function ListViewDisplayedGridColumnsOrchestrator() {
-        var _this = _super.call(this) || this;
-        _this
-            .register(ListViewDisplayedGridColumnsLoadAction, _this.load);
-        return _this;
-    }
-    ListViewDisplayedGridColumnsOrchestrator.prototype.load = function (state, action) {
-        var newColumns = action.columns.map(function (g) { return new SkyGridColumnModel(g.template, g); });
-        if (action.refresh) {
-            return new AsyncList(__spread(newColumns), new Date());
-        }
-        return new AsyncList(__spread(state.items, newColumns), new Date());
-    };
-    return ListViewDisplayedGridColumnsOrchestrator;
-}(GridStateOrchestrator));
-
-var GridState = /** @class */ (function (_super) {
-    __extends(GridState, _super);
-    /* istanbul ignore next */
-    function GridState(initialState, dispatcher) {
-        var _this = _super.call(this, initialState, dispatcher) || this;
-        _this
-            .register('columns', ListViewGridColumnsOrchestrator)
-            .register('displayedColumns', ListViewDisplayedGridColumnsOrchestrator)
-            .begin();
-        return _this;
-    }
-    GridState.ctorParameters = function () { return [
-        { type: GridStateModel },
-        { type: GridStateDispatcher }
-    ]; };
-    GridState = __decorate([
-        Injectable()
-    ], GridState);
-    return GridState;
-}(StateNode));
-
-/**
- * The command for the list view grid to respond to
- */
-var SkyListViewGridMessageType;
-(function (SkyListViewGridMessageType) {
-    /**
-     * Triggers a row deletion on the list view grid
-     */
-    SkyListViewGridMessageType[SkyListViewGridMessageType["PromptDeleteRow"] = 0] = "PromptDeleteRow";
-    /**
-     * Aborts a row deletion on the list view grid
-     */
-    SkyListViewGridMessageType[SkyListViewGridMessageType["AbortDeleteRow"] = 1] = "AbortDeleteRow";
-})(SkyListViewGridMessageType || (SkyListViewGridMessageType = {}));
-
-var SkyListViewGridComponent = /** @class */ (function (_super) {
-    __extends(SkyListViewGridComponent, _super);
-    function SkyListViewGridComponent(state, dispatcher, gridState, gridDispatcher) {
-        var _this = _super.call(this, state, 'Grid View') || this;
-        _this.dispatcher = dispatcher;
-        _this.gridState = gridState;
-        _this.gridDispatcher = gridDispatcher;
-        _this.fit = 'width';
-        _this.highlightSearchText = true;
-        _this.enableMultiselect = false;
-        _this.rowDeleteCancel = new EventEmitter();
-        _this.rowDeleteConfirm = new EventEmitter();
-        _this.selectedColumnIdsChange = new EventEmitter();
-        /**
-         * Message stream for communicating with the internal grid instance
-         * @interal
-         */
-        _this.gridMessageStream = new Subject();
-        _this.multiselectSelectedIds = [];
-        _this.ngUnsubscribe = new Subject();
-        _this._messageStream = new Subject();
-        return _this;
-    }
-    SkyListViewGridComponent_1 = SkyListViewGridComponent;
-    Object.defineProperty(SkyListViewGridComponent.prototype, "name", {
-        set: function (value) {
-            this.viewName = value;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(SkyListViewGridComponent.prototype, "messageStream", {
-        get: function () {
-            return this._messageStream;
-        },
-        /**
-         * Provides an observable to send commands to the grid.
-         * The commands should respect the `SkyListViewGridMessage` type. (See below.)
-         */
-        set: function (stream) {
-            if (this._messageStream) {
-                this._messageStream.unsubscribe();
-            }
-            this._messageStream = stream;
-            this.initInlineDeleteMessages();
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(SkyListViewGridComponent.prototype, "gridHeight", {
-        get: function () {
-            return (typeof this.height === 'number')
-                /* istanbul ignore next */
-                ? of(this.height)
-                : this.height;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(SkyListViewGridComponent.prototype, "gridWidth", {
-        get: function () {
-            /* istanbul ignore next */
-            return (typeof this.width === 'number')
-                ? of(this.width)
-                : this.width;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    SkyListViewGridComponent.prototype.ngAfterContentInit = function () {
-        var _this = this;
-        // Watch for selection changes and update multiselectSelectedIds for local comparison.
-        this.state.pipe(map(function (s) { return s.selected.item; }), takeUntil(this.ngUnsubscribe), distinctUntilChanged(this.selectedMapEqual))
-            .subscribe(function (items) {
-            var selectedIds = [];
-            items.selectedIdMap.forEach(function (isSelected, id) {
-                if (items.selectedIdMap.get(id) === true) {
-                    selectedIds.push(id);
-                }
-            });
-            _this.multiselectSelectedIds = selectedIds;
-        });
-        if (this.columnComponents.length === 0) {
-            throw new Error('Grid view requires at least one sky-grid-column to render.');
-        }
-        var columnModels = this.columnComponents.map(function (columnComponent) {
-            return new SkyGridColumnModel(columnComponent.template, columnComponent);
-        });
-        if (this.width && !isObservable(this.width)) {
-            this.width = of(this.width);
-        }
-        if (this.height && !isObservable(this.height)) {
-            this.height = of(this.height);
-        }
-        // Setup Observables for template
-        this.columns = this.gridState.pipe(map(function (s) { return s.columns.items; }), distinctUntilChanged(this.arraysEqual), takeUntil(this.ngUnsubscribe));
-        this.selectedColumnIds = this.getSelectedIds();
-        this.items = this.getGridItems();
-        this.loading = this.state.pipe(map(function (s) {
-            return s.items.loading;
-        }), distinctUntilChanged(), takeUntil(this.ngUnsubscribe));
-        this.sortField = this.state.pipe(map(function (s) {
-            /* istanbul ignore else */
-            /* sanity check */
-            if (s.sort && s.sort.fieldSelectors) {
-                return s.sort.fieldSelectors[0];
-            }
-            /* istanbul ignore next */
-            /* sanity check */
-            return undefined;
-        }), distinctUntilChanged(), takeUntil(this.ngUnsubscribe));
-        this.gridState.pipe(map(function (s) { return s.columns.items; }), takeUntil(this.ngUnsubscribe), distinctUntilChanged(this.arraysEqual))
-            .subscribe(function (columns) {
-            if (_this.hiddenColumns) {
-                getValue(_this.hiddenColumns, function (hiddenColumns) {
-                    _this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(columns.filter(function (x) {
-                        /* istanbul ignore next */
-                        /* sanity check */
-                        var id = x.id || x.field;
-                        return hiddenColumns.indexOf(id) === -1;
-                    }), true));
-                });
-            }
-            else if (_this.displayedColumns) {
-                getValue(_this.displayedColumns, function (displayedColumns) {
-                    _this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(columns.filter(function (x) { return displayedColumns.indexOf(x.id || x.field) !== -1; }), true));
-                });
-            }
-            else {
-                _this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(columns.filter(function (x) { return !x.hidden; }), true));
-            }
-        });
-        this.currentSearchText = this.state.pipe(map(function (s) { return s.search.searchText; }), distinctUntilChanged(), takeUntil(this.ngUnsubscribe));
-        this.gridDispatcher.next(new ListViewGridColumnsLoadAction(columnModels, true));
-        this.handleColumnChange();
-        if (this.enableMultiselect) {
-            this.dispatcher.toolbarShowMultiselectToolbar(true);
-        }
-        this.initInlineDeleteMessages();
-    };
-    SkyListViewGridComponent.prototype.ngOnDestroy = function () {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
-    };
-    /**
-     * If user makes selection, tell list-builder to update the list state.
-     * This logic should only run on user interaction - NOT programmatic updates.
-     */
-    SkyListViewGridComponent.prototype.onMultiselectSelectionChange = function (event) {
-        var _this = this;
-        if (event.source === SkyGridSelectedRowsSource.CheckboxChange ||
-            event.source === SkyGridSelectedRowsSource.RowClick) {
-            this.state.pipe(map(function (s) { return s.items.items; }), take(1))
-                .subscribe(function (items) {
-                var newItemIds = _this.arrayIntersection(items.map(function (i) { return i.id; }), _this.multiselectSelectedIds);
-                var newIds = items.filter(function (i) { return i.isSelected; }).map(function (i) { return i.id; });
-                // Check for deselected ids & send message to dispatcher.
-                var deselectedIds = _this.arrayDiff(newItemIds, newIds);
-                if (deselectedIds.length > 0) {
-                    _this.dispatcher.setSelected(deselectedIds, false);
-                }
-                // Check for selected ids & send message to dispatcher.
-                var selectedIds = _this.arrayDiff(newIds, newItemIds);
-                if (selectedIds.length > 0) {
-                    _this.dispatcher.setSelected(selectedIds, true);
-                }
-            });
-        }
-    };
-    SkyListViewGridComponent.prototype.columnIdsChanged = function (selectedColumnIds) {
-        var _this = this;
-        this.selectedColumnIds.pipe(take(1))
-            .subscribe(function (currentIds) {
-            if (!(_this.arraysEqual(selectedColumnIds, currentIds))) {
-                _this.gridState.pipe(map(function (s) { return s.columns.items; }), take(1))
-                    .subscribe(function (columns) {
-                    var displayedColumns = selectedColumnIds.map(function (columnId) { return columns.filter(function (c) { return c.id === columnId; })[0]; });
-                    _this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(displayedColumns, true));
-                });
-            }
-        });
-    };
-    SkyListViewGridComponent.prototype.cancelRowDelete = function (args) {
-        this.rowDeleteCancel.emit(args);
-    };
-    SkyListViewGridComponent.prototype.confirmRowDelete = function (args) {
-        this.rowDeleteConfirm.emit(args);
-    };
-    SkyListViewGridComponent.prototype.sortFieldChanged = function (sortField) {
-        this.dispatcher.sortSetFieldSelectors([sortField]);
-    };
-    SkyListViewGridComponent.prototype.onViewActive = function () {
-        var _this = this;
-        /*
-          Ran into problem where state updates were consumed out of order. For example, on search text
-          update, the searchText update was consumed after the resulting list item update. Scanning the
-          previous value of items lastUpdate ensures that we only receive the latest items.
-        */
-        this.gridState.pipe(takeUntil(this.ngUnsubscribe), scan(function (previousValue, newValue) {
-            if (previousValue.displayedColumns.lastUpdate > newValue.displayedColumns.lastUpdate) {
-                return previousValue;
-            }
-            else {
-                return newValue;
-            }
-        }), map(function (s) { return s.displayedColumns.items; }), distinctUntilChanged(this.arraysEqual))
-            .subscribe(function (displayedColumns) {
-            var setFunctions = _this.searchFunction !== undefined ? [_this.searchFunction] :
-                displayedColumns
-                    .map(function (column) { return function (data, searchText) {
-                    return column.searchFunction(getData(data, column.field), searchText);
-                }; })
-                    .filter(function (c) { return c !== undefined; });
-            _this.state.pipe(take(1)).subscribe(function (s) {
-                _this.dispatcher.searchSetOptions(new ListSearchModel({
-                    searchText: s.search.searchText,
-                    functions: setFunctions,
-                    fieldSelectors: displayedColumns.map(function (d) { return d.field; })
-                }));
-            });
-        });
-    };
-    SkyListViewGridComponent.prototype.initInlineDeleteMessages = function () {
-        var _this = this;
-        if (this.messageStream) {
-            this.messageStream.subscribe(function (message) {
-                if (message.type === SkyListViewGridMessageType.AbortDeleteRow) {
-                    _this.gridMessageStream.next({
-                        type: SkyGridMessageType.AbortDeleteRow,
-                        data: {
-                            abortDeleteRow: message.data.abortDeleteRow
-                        }
-                    });
-                }
-                else if (message.type === SkyListViewGridMessageType.PromptDeleteRow) {
-                    _this.gridMessageStream.next({
-                        type: SkyGridMessageType.PromptDeleteRow,
-                        data: {
-                            promptDeleteRow: message.data.promptDeleteRow
-                        }
-                    });
-                }
-            });
-        }
-    };
-    SkyListViewGridComponent.prototype.handleColumnChange = function () {
-        var _this = this;
-        // watch for changes in column components
-        this.columnComponents.changes.pipe(takeUntil(this.ngUnsubscribe))
-            .subscribe(function (columnComponents) {
-            var columnModels = _this.columnComponents.map(function (column) {
-                return new SkyGridColumnModel(column.template, column);
-            });
-            _this.gridDispatcher.next(new ListViewGridColumnsLoadAction(columnModels, true));
-        });
-        // Watch for column heading changes:
-        this.columnComponents.forEach(function (comp) {
-            comp.headingModelChanges.pipe(takeUntil(_this.ngUnsubscribe))
-                .subscribe(function (change) {
-                _this.gridComponent.updateColumnHeading(change);
-            });
-            comp.descriptionModelChanges.pipe(takeUntil(_this.ngUnsubscribe))
-                .subscribe(function (change) {
-                _this.gridComponent.updateColumnDescription(change);
-            });
-        });
-    };
-    SkyListViewGridComponent.prototype.getGridItems = function () {
-        /*
-          Same problem as above. We should move from having a state object observable with a bunch of
-          static properties to a static state object with observable properties that you can subscribe
-          to.
-        */
-        return this.state.pipe(map(function (s) {
-            return s.items;
-        }), scan(function (previousValue, newValue) {
-            if (previousValue.lastUpdate > newValue.lastUpdate) {
-                return previousValue;
-            }
-            else {
-                return newValue;
-            }
-        }), map(function (result) {
-            return result.items;
-        }), distinctUntilChanged());
-    };
-    SkyListViewGridComponent.prototype.getSelectedIds = function () {
-        var _this = this;
-        /*
-          Same problem as above. We should move from having a state object observable with a bunch of
-          static properties to a static state object with observable properties that you can subscribe
-          to.
-        */
-        return this.gridState.pipe(map(function (s) { return s.displayedColumns; }), scan(function (previousValue, newValue) {
-            if (previousValue.lastUpdate > newValue.lastUpdate) {
-                return previousValue;
-            }
-            else {
-                return newValue;
-            }
-        }), map(function (result) {
-            /* istanbul ignore next */
-            /* sanity check */
-            return result.items.map(function (column) {
-                return column.id || column.field;
-            });
-        }), distinctUntilChanged(function (previousValue, newValue) {
-            return _this.haveColumnIdsChanged(previousValue, newValue);
-        }));
-    };
-    SkyListViewGridComponent.prototype.haveColumnIdsChanged = function (previousValue, newValue) {
-        if (previousValue.length !== newValue.length) {
-            this.selectedColumnIdsChange.emit(newValue);
-            return false;
-        }
-        for (var i = 0; i < previousValue.length; i++) {
-            if (previousValue[i] !== newValue[i]) {
-                this.selectedColumnIdsChange.emit(newValue);
-                return false;
-            }
-        }
-        return true;
-    };
-    SkyListViewGridComponent.prototype.selectedMapEqual = function (prev, next) {
-        if (prev.selectedIdMap.size !== next.selectedIdMap.size) {
-            return false;
-        }
-        var keys = [];
-        next.selectedIdMap.forEach(function (value, key) {
-            keys.push(key);
-        });
-        for (var i = 0; i < keys.length; i++) {
-            var key = keys[i];
-            var value = next.selectedIdMap.get(key);
-            if (value !== prev.selectedIdMap.get(key)) {
-                return false;
-            }
-        }
-        return true;
-    };
-    SkyListViewGridComponent.prototype.arrayDiff = function (arrA, arrB) {
-        return arrA.filter(function (i) { return arrB.indexOf(i) < 0; });
-    };
-    SkyListViewGridComponent.prototype.arrayIntersection = function (arrA, arrB) {
-        return arrA.filter(function (value) { return -1 !== arrB.indexOf(value); });
-    };
-    SkyListViewGridComponent.prototype.arraysEqual = function (arrayA, arrayB) {
-        return arrayA.length === arrayB.length &&
-            arrayA.every(function (value, index) {
-                return value === arrayB[index];
-            });
-    };
-    var SkyListViewGridComponent_1;
-    SkyListViewGridComponent.ctorParameters = function () { return [
-        { type: ListState },
-        { type: ListStateDispatcher },
-        { type: GridState },
-        { type: GridStateDispatcher }
-    ]; };
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "name", null);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "displayedColumns", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "hiddenColumns", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "fit", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "width", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "height", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "highlightSearchText", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "messageStream", null);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "rowHighlightedId", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "enableMultiselect", void 0);
-    __decorate([
-        Input()
-    ], SkyListViewGridComponent.prototype, "settingsKey", void 0);
-    __decorate([
-        Output()
-    ], SkyListViewGridComponent.prototype, "rowDeleteCancel", void 0);
-    __decorate([
-        Output()
-    ], SkyListViewGridComponent.prototype, "rowDeleteConfirm", void 0);
-    __decorate([
-        Output()
-    ], SkyListViewGridComponent.prototype, "selectedColumnIdsChange", void 0);
-    __decorate([
-        ViewChild(SkyGridComponent)
-    ], SkyListViewGridComponent.prototype, "gridComponent", void 0);
-    __decorate([
-        Input('search')
-    ], SkyListViewGridComponent.prototype, "searchFunction", void 0);
-    __decorate([
-        ContentChildren(SkyGridColumnComponent)
-    ], SkyListViewGridComponent.prototype, "columnComponents", void 0);
-    SkyListViewGridComponent = SkyListViewGridComponent_1 = __decorate([
-        Component({
-            selector: 'sky-list-view-grid',
-            template: "<div *ngIf=\"active | async\">\n  <sky-grid\n    [columns]=\"columns | async\"\n    [data]=\"items | async\"\n    [enableMultiselect]=\"enableMultiselect\"\n    [fit]=\"fit\"\n    [height]=\"gridHeight | async\"\n    [highlightText]=\"highlightSearchText ? (currentSearchText | async) : undefined\"\n    [rowHighlightedId]=\"rowHighlightedId\"\n    [messageStream]=\"gridMessageStream\"\n    [selectedColumnIds]=\"selectedColumnIds | async\"\n    [selectedRowIds]=\"multiselectSelectedIds\"\n    [settingsKey]=\"settingsKey\"\n    [sortField]=\"sortField | async\"\n    [width]=\"gridWidth | async\"\n    (multiselectSelectionChange)=\"onMultiselectSelectionChange($event)\"\n    (rowDeleteCancel)=\"cancelRowDelete($event)\"\n    (rowDeleteConfirm)=\"confirmRowDelete($event)\"\n    (selectedColumnIdsChange)=\"columnIdsChanged($event)\"\n    (sortFieldChange)=\"sortFieldChanged($event)\"\n    #skyGrid\n  >\n  </sky-grid>\n  <sky-wait\n    [isWaiting]=\"loading | async\"\n  >\n  </sky-wait>\n</div>\n",
-            providers: [
-                /* tslint:disable */
-                { provide: ListViewComponent, useExisting: forwardRef(function () { return SkyListViewGridComponent_1; }) },
-                /* tslint:enable */
-                GridState,
-                GridStateDispatcher,
-                GridStateModel
-            ],
-            changeDetection: ChangeDetectionStrategy.OnPush,
-            styles: [":host ::ng-deep .sky-grid-heading{border-top:0!important}"]
-        })
-    ], SkyListViewGridComponent);
-    return SkyListViewGridComponent;
-}(ListViewComponent));
-
-var SkyListViewGridResourcesProvider = /** @class */ (function () {
-    function SkyListViewGridResourcesProvider() {
-        this.resources = { "EN-US": { "skyux_grid_column_picker_cancel": "Cancel", "skyux_grid_column_picker_header": "Choose columns to show in the list", "skyux_grid_column_picker_search_placeholder": "Search for columns", "skyux_grid_column_picker_submit": "Apply changes", "skyux_grid_columns_button": "Choose columns", "skyux_grid_columns_toolbar_button": "Columns" } };
-    }
-    SkyListViewGridResourcesProvider.prototype.getString = function (localeInfo, name) {
-        return getStringForLocale(this.resources, localeInfo.locale, name);
-    };
-    SkyListViewGridResourcesProvider = __decorate([
-        Injectable()
-    ], SkyListViewGridResourcesProvider);
-    return SkyListViewGridResourcesProvider;
-}());
-
-var SkyListViewGridResourcesModule = /** @class */ (function () {
-    function SkyListViewGridResourcesModule() {
-    }
-    SkyListViewGridResourcesModule = __decorate([
-        NgModule({
-            providers: [{
-                    provide: SKY_LIB_RESOURCES_PROVIDERS,
-                    useClass: SkyListViewGridResourcesProvider,
-                    multi: true
-                }]
-        })
-    ], SkyListViewGridResourcesModule);
-    return SkyListViewGridResourcesModule;
-}());
-
-var SkyListViewGridModule = /** @class */ (function () {
-    function SkyListViewGridModule() {
-    }
-    SkyListViewGridModule = __decorate([
-        NgModule({
-            declarations: [
-                SkyListViewGridComponent
-            ],
-            imports: [
-                CommonModule,
-                SkyWaitModule,
-                SkyGridModule,
-                SkyListViewGridResourcesModule
-            ],
-            exports: [
-                SkyListViewGridComponent,
-                SkyListColumnSelectorActionModule,
-                SkyGridModule
-            ]
-        })
-    ], SkyListViewGridModule);
-    return SkyListViewGridModule;
-}());
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { GridState, GridStateDispatcher, GridStateModel, GridStateOrchestrator, ListViewDisplayedGridColumnsLoadAction, ListViewDisplayedGridColumnsOrchestrator, ListViewGridColumnsLoadAction, ListViewGridColumnsOrchestrator, SkyColumnSelectorContext, SkyColumnSelectorModel, SkyColumnSelectorModule, SkyListColumnSelectorActionModule, SkyListViewGridComponent, SkyListViewGridMessageType, SkyListViewGridModule, SkyColumnSelectorComponent as ɵa, SkyListColumnSelectorActionComponent as ɵb, SkyListColumnSelectorButtonComponent as ɵc, SkyListViewGridResourcesModule as ɵd, SkyListViewGridResourcesProvider as ɵe };
-//# sourceMappingURL=skyux-list-builder-view-grids.js.map