@skyux/list-builder-view-grids 5.7.2 → 6.0.0-beta.2

package/fesm2015/skyux-list-builder-view-grids.mjs

@@ -0,0 +1,905 @@
+import * as i4$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { Component, NgModule, EventEmitter, Optional, Input, Output, ViewChild, Injectable, forwardRef, ChangeDetectionStrategy, ContentChildren } from '@angular/core';
+import * as i5 from '@skyux/i18n';
+import { SkyI18nModule, getLibStringForLocale, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
+import * as i1 from '@skyux/list-builder';
+import { SkyListModule, SkyListToolbarModule, ListToolbarItemModel, SkyListSecondaryActionsModule, ListViewComponent, ListSearchModel } from '@skyux/list-builder';
+import * as i4 from '@skyux/list-builder-view-checklist';
+import { SkyListViewChecklistModule } from '@skyux/list-builder-view-checklist';
+import * as i2 from '@skyux/modals';
+import { SkyModalModule } from '@skyux/modals';
+import * as i1$1 from '@skyux/indicators';
+import { SkyIconModule, SkyWaitModule } from '@skyux/indicators';
+import { map, distinctUntilChanged, take, takeUntil, scan } from 'rxjs/operators';
+import * as i4$2 from '@skyux/grids';
+import { SkyGridColumnModel, SkyGridSelectedRowsSource, SkyGridMessageType, SkyGridColumnComponent, SkyGridComponent, SkyGridModule } from '@skyux/grids';
+import { AsyncList, StateDispatcher, StateOrchestrator, StateNode, isObservable, getValue, getData } from '@skyux/list-builder-common';
+import { Subject, of } from 'rxjs';
+
+/* istanbul ignore next */
+/* Code coverage having problems with no statements in classes */
+class SkyColumnSelectorContext {
+}
+/* istanbul ignore next */
+/* Code coverage having problems with no statements in classes */
+class SkyColumnSelectorModel {
+}
+
+class SkyColumnSelectorComponent {
+    constructor(context, instance) {
+        this.context = context;
+        this.instance = instance;
+        this.newSelectedColumnIds = [];
+        this.newSelectedColumnIds = context.selectedColumnIds;
+    }
+    selectedColumnsChange(selectedMap) {
+        this.newSelectedColumnIds = [];
+        selectedMap.forEach((value, key) => {
+            if (value) {
+                this.newSelectedColumnIds.push(key);
+            }
+        });
+    }
+    cancelChanges() {
+        this.instance.cancel();
+    }
+    applyChanges() {
+        this.instance.save(this.newSelectedColumnIds);
+    }
+}
+SkyColumnSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyColumnSelectorComponent, deps: [{ token: SkyColumnSelectorContext }, { token: i2.SkyModalInstance }], target: i0.ɵɵFactoryTarget.Component });
+SkyColumnSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: SkyColumnSelectorComponent, selector: "sky-column-selector", ngImport: i0, 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\n      #list\n      [data]=\"context.columns\"\n      [selectedIds]=\"context.selectedColumnIds\"\n      (selectedIdsChange)=\"selectedColumnsChange($event)\"\n    >\n      <sky-list-toolbar\n        [placeholder]=\"\n          'skyux_grid_column_picker_search_placeholder' | skyLibResources\n        \"\n      >\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    >\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    >\n      {{ 'skyux_grid_column_picker_cancel' | skyLibResources }}\n    </button>\n  </sky-modal-footer>\n</sky-modal>\n", components: [{ type: i2.λ5, selector: "sky-modal", inputs: ["ariaRole", "tiledBody"] }, { type: i2.λ4, selector: "sky-modal-header" }, { type: i2.λ2, selector: "sky-modal-content" }, { type: i1.SkyListComponent, selector: "sky-list", inputs: ["data", "dataProvider", "defaultView", "initialTotal", "selectedIds", "sortFields", "appliedFilters", "search"], outputs: ["selectedIdsChange", "appliedFiltersChange"] }, { type: i1.SkyListToolbarComponent, selector: "sky-list-toolbar", inputs: ["inMemorySearchEnabled", "placeholder", "searchEnabled", "sortSelectorEnabled", "toolbarType", "searchText"] }, { type: i4.SkyListViewChecklistComponent, selector: "sky-list-view-checklist", inputs: ["name", "search", "label", "description", "selectMode", "showOnlySelected"] }, { type: i2.λ3, selector: "sky-modal-footer" }], pipes: { "skyLibResources": i5.SkyLibResourcesPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyColumnSelectorComponent, decorators: [{
+            type: Component,
+            args: [{ 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\n      #list\n      [data]=\"context.columns\"\n      [selectedIds]=\"context.selectedColumnIds\"\n      (selectedIdsChange)=\"selectedColumnsChange($event)\"\n    >\n      <sky-list-toolbar\n        [placeholder]=\"\n          'skyux_grid_column_picker_search_placeholder' | skyLibResources\n        \"\n      >\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    >\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    >\n      {{ 'skyux_grid_column_picker_cancel' | skyLibResources }}\n    </button>\n  </sky-modal-footer>\n</sky-modal>\n" }]
+        }], ctorParameters: function () { return [{ type: SkyColumnSelectorContext }, { type: i2.SkyModalInstance }]; } });
+
+class SkyColumnSelectorModule {
+}
+SkyColumnSelectorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyColumnSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SkyColumnSelectorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyColumnSelectorModule, declarations: [SkyColumnSelectorComponent], imports: [CommonModule,
+        SkyI18nModule,
+        SkyModalModule,
+        SkyListModule,
+        SkyListToolbarModule,
+        SkyListViewChecklistModule] });
+SkyColumnSelectorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyColumnSelectorModule, imports: [[
+            CommonModule,
+            SkyI18nModule,
+            SkyModalModule,
+            SkyListModule,
+            SkyListToolbarModule,
+            SkyListViewChecklistModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyColumnSelectorModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [SkyColumnSelectorComponent],
+                    imports: [
+                        CommonModule,
+                        SkyI18nModule,
+                        SkyModalModule,
+                        SkyListModule,
+                        SkyListToolbarModule,
+                        SkyListViewChecklistModule,
+                    ],
+                }]
+        }] });
+
+/**
+ * @internal
+ */
+class ListViewDisplayedGridColumnsLoadAction {
+    constructor(columns, refresh = false) {
+        this.columns = columns;
+        this.refresh = refresh;
+    }
+}
+
+class SkyListColumnSelectorButtonComponent {
+}
+SkyListColumnSelectorButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SkyListColumnSelectorButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: SkyListColumnSelectorButtonComponent, selector: "sky-list-column-selector-button", ngImport: i0, 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 icon=\"columns\"></sky-icon>\n  <span class=\"sky-column-selector-action-btn-text\">\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-xs) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-sm) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-md) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-lg) .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-sm) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-md) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-lg) .sky-column-selector-action-btn-text{display:inline}\n"], components: [{ type: i1$1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], pipes: { "skyLibResources": i5.SkyLibResourcesPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorButtonComponent, decorators: [{
+            type: Component,
+            args: [{ 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 icon=\"columns\"></sky-icon>\n  <span class=\"sky-column-selector-action-btn-text\">\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-xs) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-sm) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-md) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-lg) .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-sm) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-md) .sky-column-selector-action-btn-text,:host-context(.sky-responsive-container-lg) .sky-column-selector-action-btn-text{display:inline}\n"] }]
+        }] });
+
+/**
+ * Provides a column selector modal for a list grid view when placed in a
+ * [list toolbar](https://developer.blackbaud.com/skyux/components/list/toolbar).
+ */
+class SkyListColumnSelectorActionComponent {
+    constructor(listState, modalService, dispatcher, secondaryActions) {
+        this.listState = listState;
+        this.modalService = modalService;
+        this.dispatcher = dispatcher;
+        this.secondaryActions = secondaryActions;
+        /**
+         * Fires when users click the help button and broadcasts the `helpKey`.
+         */
+        this.helpOpened = new EventEmitter();
+        this.columnSelectorActionItemToolbarIndex = 7000;
+    }
+    ngAfterContentInit() {
+        if (!this.secondaryActions) {
+            const columnChooserItem = new ListToolbarItemModel({
+                id: 'column-chooser',
+                template: this.columnChooserTemplate,
+                location: 'left',
+            });
+            this.dispatcher.toolbarAddItems([columnChooserItem], this.columnSelectorActionItemToolbarIndex);
+        }
+    }
+    get isInGridView() {
+        return this.listState.pipe(map((s) => s.views.active), map((activeView) => {
+            return this.gridView && activeView === this.gridView.id;
+        }), distinctUntilChanged());
+    }
+    get isInGridViewAndSecondary() {
+        return this.listState.pipe(map((s) => s.views.active), map((activeView) => {
+            return (this.secondaryActions &&
+                this.gridView &&
+                activeView === this.gridView.id);
+        }), distinctUntilChanged());
+    }
+    openColumnSelector() {
+        /* istanbul ignore else */
+        /* sanity check */
+        if (this.gridView) {
+            let columns = [];
+            let selectedColumnIds = [];
+            this.gridView.gridState
+                .pipe(take(1))
+                .subscribe((state) => {
+                columns = state.columns.items
+                    .filter((item) => {
+                    return !item.locked;
+                })
+                    .map((item) => {
+                    return {
+                        id: item.id,
+                        heading: item.heading,
+                        description: item.description,
+                    };
+                });
+                selectedColumnIds = state.displayedColumns.items
+                    .filter((item) => {
+                    return !item.locked;
+                })
+                    .map((item) => {
+                    return item.id;
+                });
+            });
+            const modalInstance = this.modalService.open(SkyColumnSelectorComponent, {
+                providers: [
+                    {
+                        provide: SkyColumnSelectorContext,
+                        useValue: {
+                            columns,
+                            selectedColumnIds,
+                        },
+                    },
+                ],
+                helpKey: this.helpKey,
+            });
+            modalInstance.helpOpened.subscribe((helpKey) => {
+                this.helpOpened.emit(helpKey);
+                this.helpOpened.complete();
+            });
+            modalInstance.closed.subscribe((result) => {
+                if (result.reason === 'save' && result.data) {
+                    const newSelectedIds = result.data;
+                    let newDisplayedColumns = [];
+                    this.gridView.gridState
+                        .pipe(take(1))
+                        .subscribe((state) => {
+                        newDisplayedColumns = state.columns.items.filter((item) => {
+                            return newSelectedIds.indexOf(item.id) > -1 || item.locked;
+                        });
+                    });
+                    this.gridView.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(newDisplayedColumns, true));
+                }
+            });
+        }
+    }
+}
+SkyListColumnSelectorActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorActionComponent, deps: [{ token: i1.ListState }, { token: i2.SkyModalService }, { token: i1.ListStateDispatcher }, { token: i1.SkyListSecondaryActionsComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+SkyListColumnSelectorActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: SkyListColumnSelectorActionComponent, selector: "sky-list-column-selector-action", inputs: { gridView: "gridView", helpKey: "helpKey" }, outputs: { helpOpened: "helpOpened" }, viewQueries: [{ propertyName: "columnChooserTemplate", first: true, predicate: ["columnChooser"], descendants: true, static: true }], ngImport: i0, 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\n    *ngIf=\"isInGridView | async\"\n    (click)=\"openColumnSelector()\"\n  >\n  </sky-list-column-selector-button>\n</ng-template>\n", components: [{ type: i1.λ6, selector: "sky-list-secondary-action" }, { type: SkyListColumnSelectorButtonComponent, selector: "sky-list-column-selector-button" }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4$1.AsyncPipe, "skyLibResources": i5.SkyLibResourcesPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorActionComponent, decorators: [{
+            type: Component,
+            args: [{ 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\n    *ngIf=\"isInGridView | async\"\n    (click)=\"openColumnSelector()\"\n  >\n  </sky-list-column-selector-button>\n</ng-template>\n" }]
+        }], ctorParameters: function () {
+        return [{ type: i1.ListState }, { type: i2.SkyModalService }, { type: i1.ListStateDispatcher }, { type: i1.SkyListSecondaryActionsComponent, decorators: [{
+                        type: Optional
+                    }] }];
+    }, propDecorators: { gridView: [{
+                type: Input
+            }], helpKey: [{
+                type: Input
+            }], helpOpened: [{
+                type: Output
+            }], columnChooserTemplate: [{
+                type: ViewChild,
+                args: ['columnChooser', {
+                        static: true,
+                    }]
+            }] } });
+
+class SkyListColumnSelectorActionModule {
+}
+SkyListColumnSelectorActionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorActionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SkyListColumnSelectorActionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorActionModule, declarations: [SkyListColumnSelectorActionComponent,
+        SkyListColumnSelectorButtonComponent], imports: [CommonModule,
+        SkyI18nModule,
+        SkyModalModule,
+        SkyListSecondaryActionsModule,
+        SkyListToolbarModule,
+        SkyIconModule], exports: [SkyListColumnSelectorActionComponent, SkyColumnSelectorModule] });
+SkyListColumnSelectorActionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorActionModule, imports: [[
+            CommonModule,
+            SkyI18nModule,
+            SkyModalModule,
+            SkyListSecondaryActionsModule,
+            SkyListToolbarModule,
+            SkyIconModule,
+        ], SkyColumnSelectorModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListColumnSelectorActionModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        SkyListColumnSelectorActionComponent,
+                        SkyListColumnSelectorButtonComponent,
+                    ],
+                    imports: [
+                        CommonModule,
+                        SkyI18nModule,
+                        SkyModalModule,
+                        SkyListSecondaryActionsModule,
+                        SkyListToolbarModule,
+                        SkyIconModule,
+                    ],
+                    exports: [SkyListColumnSelectorActionComponent, SkyColumnSelectorModule],
+                }]
+        }] });
+
+/**
+ * @internal
+ */
+class ListViewGridColumnsLoadAction {
+    constructor(columns, refresh = false) {
+        this.columns = columns;
+        this.refresh = refresh;
+    }
+}
+
+/**
+ * @internal
+ */
+class GridStateModel {
+    constructor() {
+        this.columns = new AsyncList();
+        this.displayedColumns = new AsyncList();
+    }
+}
+
+/**
+ * @internal
+ */
+class GridStateDispatcher extends StateDispatcher {
+}
+GridStateDispatcher.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: GridStateDispatcher, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+GridStateDispatcher.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: GridStateDispatcher });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: GridStateDispatcher, decorators: [{
+            type: Injectable
+        }] });
+/**
+ * @internal
+ */
+class GridStateOrchestrator extends StateOrchestrator {
+}
+
+/**
+ * @internal
+ */
+class ListViewGridColumnsOrchestrator extends GridStateOrchestrator {
+    /* istanbul ignore next */
+    constructor() {
+        super();
+        this.register(ListViewGridColumnsLoadAction, this.load);
+    }
+    load(state, action) {
+        const newColumns = action.columns.map((g) => new SkyGridColumnModel(g.template, g));
+        if (action.refresh) {
+            return new AsyncList([...newColumns], new Date());
+        }
+        return new AsyncList([...state.items, ...newColumns], new Date());
+    }
+}
+
+/**
+ * @internal
+ */
+class ListViewDisplayedGridColumnsOrchestrator extends GridStateOrchestrator {
+    /* istanbul ignore next */
+    constructor() {
+        super();
+        this.register(ListViewDisplayedGridColumnsLoadAction, this.load);
+    }
+    load(state, action) {
+        const newColumns = action.columns.map((g) => new SkyGridColumnModel(g.template, g));
+        if (action.refresh) {
+            return new AsyncList([...newColumns], new Date());
+        }
+        return new AsyncList([...state.items, ...newColumns], new Date());
+    }
+}
+
+/**
+ * @internal
+ */
+class GridState extends StateNode {
+    /* istanbul ignore next */
+    constructor(initialState, dispatcher) {
+        super(initialState, dispatcher);
+        this.register('columns', ListViewGridColumnsOrchestrator)
+            .register('displayedColumns', ListViewDisplayedGridColumnsOrchestrator)
+            .begin();
+    }
+}
+GridState.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: GridState, deps: [{ token: GridStateModel }, { token: GridStateDispatcher }], target: i0.ɵɵFactoryTarget.Injectable });
+GridState.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: GridState });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: GridState, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: GridStateModel }, { type: GridStateDispatcher }]; } });
+
+/**
+ * The command for the list view grid to respond to.
+ */
+var SkyListViewGridMessageType;
+(function (SkyListViewGridMessageType) {
+    /**
+     * Deletes of a row in the list view grid.
+     */
+    SkyListViewGridMessageType[SkyListViewGridMessageType["PromptDeleteRow"] = 0] = "PromptDeleteRow";
+    /**
+     * Cancels the deletion of a row in the list view grid.
+     */
+    SkyListViewGridMessageType[SkyListViewGridMessageType["AbortDeleteRow"] = 1] = "AbortDeleteRow";
+})(SkyListViewGridMessageType || (SkyListViewGridMessageType = {}));
+
+/**
+ * Displays a grid for a
+ * [SKY UX-themed list of data](https://developer.blackbaud.com/skyux/components/list/overview)
+ * using the [grid component](https://developer.blackbaud.com/skyux/components/grid).
+ * You must install `SkyListModule` as a dependency.
+ */
+class SkyListViewGridComponent extends ListViewComponent {
+    constructor(state, dispatcher, gridState, gridDispatcher) {
+        super(state, 'Grid View');
+        this.dispatcher = dispatcher;
+        this.gridState = gridState;
+        this.gridDispatcher = gridDispatcher;
+        /**
+         * Specifies how the grid fits to its parent. `"width"` fits the grid to the parent's full
+         * width, and `"scroll"` allows the grid to exceed the parent's width. If the grid does not have
+         * enough columns to fill the parent's width, it always stretches to the parent's full width.
+         * @default "width"
+         */
+        this.fit = 'width';
+        /**
+         * Indicates whether to highlight search text within the grid.
+         * @default true
+         */
+        this.highlightSearchText = true;
+        /**
+         * Indicates whether to enable the multiselect feature to display a column of checkboxes
+         * on the left side of the grid. Multiselect also displays an action bar with buttons to
+         * select and clear all checkboxes. Multiselect defaults to the `id` property on the list's
+         * `data` object.
+         * @default false
+         */
+        this.enableMultiselect = false;
+        /**
+         * Fires when users cancel the deletion of a row.
+         */
+        this.rowDeleteCancel = new EventEmitter();
+        /**
+         * Fires when users confirm the deletion of a row.
+         */
+        this.rowDeleteConfirm = new EventEmitter();
+        /**
+         * Fires when columns change. This includes changes to the displayed columns and changes
+         * to the order of columns. The event emits an array of IDs for the displayed columns that
+         * reflects the column order.
+         */
+        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();
+    }
+    /**
+     * Specifies the name of the view.
+     * @required
+     */
+    set name(value) {
+        this.viewName = value;
+    }
+    /**
+     * Provides an observable to send commands to the grid.
+     * The commands should respect the `SkyListViewGridMessage` type.
+     */
+    set messageStream(stream) {
+        /* istanbul ignore else */
+        if (this._messageStream) {
+            this._messageStream.unsubscribe();
+        }
+        this._messageStream = stream;
+        this.initInlineDeleteMessages();
+    }
+    get messageStream() {
+        return this._messageStream;
+    }
+    get gridHeight() {
+        /* istanbul ignore next */
+        return typeof this.height === 'number'
+            ? of(this.height)
+            : this.height;
+    }
+    get gridWidth() {
+        /* istanbul ignore next */
+        return typeof this.width === 'number'
+            ? of(this.width)
+            : this.width;
+    }
+    ngAfterContentInit() {
+        // Watch for selection changes and update multiselectSelectedIds for local comparison.
+        this.state
+            .pipe(map((s) => s.selected.item), takeUntil(this.ngUnsubscribe), distinctUntilChanged(this.selectedMapEqual))
+            .subscribe((items) => {
+            const selectedIds = [];
+            items.selectedIdMap.forEach((isSelected, id) => {
+                if (items.selectedIdMap.get(id) === true) {
+                    selectedIds.push(id);
+                }
+            });
+            this.multiselectSelectedIds = selectedIds;
+        });
+        /* istanbul ignore next */
+        if (this.columnComponents.length === 0) {
+            throw new Error('Grid view requires at least one sky-grid-column to render.');
+        }
+        const columnModels = this.columnComponents.map((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((s) => s.columns.items), distinctUntilChanged(this.arraysEqual), takeUntil(this.ngUnsubscribe));
+        this.selectedColumnIds = this.getSelectedIds();
+        this.items = this.getGridItems();
+        this.loading = this.state.pipe(map((s) => {
+            return s.items.loading;
+        }), distinctUntilChanged(), takeUntil(this.ngUnsubscribe));
+        this.sortField = this.state.pipe(map((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((s) => s.columns.items), takeUntil(this.ngUnsubscribe), distinctUntilChanged(this.arraysEqual))
+            .subscribe((columns) => {
+            /* istanbul ignore else */
+            if (this.hiddenColumns) {
+                getValue(this.hiddenColumns, (hiddenColumns) => {
+                    this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(columns.filter((x) => {
+                        /* istanbul ignore next */
+                        /* sanity check */
+                        const id = x.id || x.field;
+                        return hiddenColumns.indexOf(id) === -1;
+                    }), true));
+                });
+            }
+            else if (this.displayedColumns) {
+                /* istanbul ignore next */
+                getValue(this.displayedColumns, (displayedColumns) => {
+                    this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(columns.filter((x) => displayedColumns.indexOf(x.id || x.field) !== -1), true));
+                });
+            }
+            else {
+                this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(columns.filter((x) => !x.hidden), true));
+            }
+        });
+        this.currentSearchText = this.state.pipe(map((s) => 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();
+    }
+    ngOnDestroy() {
+        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.
+     */
+    onMultiselectSelectionChange(event) {
+        if (event.source === SkyGridSelectedRowsSource.CheckboxChange ||
+            event.source === SkyGridSelectedRowsSource.RowClick) {
+            this.state
+                .pipe(map((s) => s.items.items), take(1))
+                .subscribe((items) => {
+                const newItemIds = this.arrayIntersection(items.map((i) => i.id), this.multiselectSelectedIds);
+                const newIds = items.filter((i) => i.isSelected).map((i) => i.id);
+                // Check for deselected ids & send message to dispatcher.
+                const deselectedIds = this.arrayDiff(newItemIds, newIds);
+                if (deselectedIds.length > 0) {
+                    this.dispatcher.setSelected(deselectedIds, false);
+                }
+                // Check for selected ids & send message to dispatcher.
+                const selectedIds = this.arrayDiff(newIds, newItemIds);
+                if (selectedIds.length > 0) {
+                    this.dispatcher.setSelected(selectedIds, true);
+                }
+            });
+        }
+    }
+    columnIdsChanged(selectedColumnIds) {
+        this.selectedColumnIds.pipe(take(1)).subscribe((currentIds) => {
+            if (!this.arraysEqual(selectedColumnIds, currentIds)) {
+                this.gridState
+                    .pipe(map((s) => s.columns.items), take(1))
+                    .subscribe((columns) => {
+                    const displayedColumns = selectedColumnIds.map((columnId) => columns.filter((c) => c.id === columnId)[0]);
+                    this.gridDispatcher.next(new ListViewDisplayedGridColumnsLoadAction(displayedColumns, true));
+                });
+            }
+        });
+    }
+    cancelRowDelete(args) {
+        this.rowDeleteCancel.emit(args);
+    }
+    confirmRowDelete(args) {
+        this.rowDeleteConfirm.emit(args);
+    }
+    sortFieldChanged(sortField) {
+        this.dispatcher.sortSetFieldSelectors([sortField]);
+    }
+    onViewActive() {
+        /*
+          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((previousValue, newValue) => {
+            if (previousValue.displayedColumns.lastUpdate >
+                newValue.displayedColumns.lastUpdate) {
+                return previousValue;
+            }
+            else {
+                return newValue;
+            }
+        }), map((s) => s.displayedColumns.items), distinctUntilChanged(this.arraysEqual))
+            .subscribe((displayedColumns) => {
+            const setFunctions = this.searchFunction !== undefined
+                ? [this.searchFunction]
+                : displayedColumns
+                    .map((column) => (data, searchText) => column.searchFunction(getData(data, column.field), searchText))
+                    .filter((c) => c !== undefined);
+            this.state.pipe(take(1)).subscribe((s) => {
+                this.dispatcher.searchSetOptions(new ListSearchModel({
+                    searchText: s.search.searchText,
+                    functions: setFunctions,
+                    fieldSelectors: displayedColumns.map((d) => d.field),
+                }));
+            });
+        });
+    }
+    initInlineDeleteMessages() {
+        /* istanbul ignore next */
+        if (this.messageStream) {
+            this.messageStream.subscribe((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,
+                        },
+                    });
+                }
+            });
+        }
+    }
+    handleColumnChange() {
+        // watch for changes in column components
+        this.columnComponents.changes
+            .pipe(takeUntil(this.ngUnsubscribe))
+            .subscribe((columnComponents) => {
+            const columnModels = this.columnComponents.map((column) => {
+                return new SkyGridColumnModel(column.template, column);
+            });
+            this.gridDispatcher.next(new ListViewGridColumnsLoadAction(columnModels, true));
+        });
+        // Watch for column heading changes:
+        this.columnComponents.forEach((comp) => {
+            comp.headingModelChanges
+                .pipe(takeUntil(this.ngUnsubscribe))
+                .subscribe((change) => {
+                this.gridComponent.updateColumnHeading(change);
+            });
+            comp.descriptionModelChanges
+                .pipe(takeUntil(this.ngUnsubscribe))
+                .subscribe((change) => {
+                this.gridComponent.updateColumnDescription(change);
+            });
+        });
+    }
+    getGridItems() {
+        /*
+          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((s) => {
+            return s.items;
+        }), scan((previousValue, newValue) => {
+            if (previousValue.lastUpdate > newValue.lastUpdate) {
+                return previousValue;
+            }
+            else {
+                return newValue;
+            }
+        }), map((result) => {
+            return result.items;
+        }), distinctUntilChanged());
+    }
+    getSelectedIds() {
+        /*
+          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((s) => s.displayedColumns), scan((previousValue, newValue) => {
+            if (previousValue.lastUpdate > newValue.lastUpdate) {
+                return previousValue;
+            }
+            else {
+                return newValue;
+            }
+        }), map((result) => {
+            /* istanbul ignore next */
+            /* sanity check */
+            return result.items.map((column) => {
+                return column.id || column.field;
+            });
+        }), distinctUntilChanged((previousValue, newValue) => {
+            return this.haveColumnIdsChanged(previousValue, newValue);
+        }));
+    }
+    haveColumnIdsChanged(previousValue, newValue) {
+        if (previousValue.length !== newValue.length) {
+            this.selectedColumnIdsChange.emit(newValue);
+            return false;
+        }
+        for (let i = 0; i < previousValue.length; i++) {
+            /* istanbul ignore if */
+            if (previousValue[i] !== newValue[i]) {
+                this.selectedColumnIdsChange.emit(newValue);
+                return false;
+            }
+        }
+        return true;
+    }
+    selectedMapEqual(prev, next) {
+        if (prev.selectedIdMap.size !== next.selectedIdMap.size) {
+            return false;
+        }
+        const keys = [];
+        next.selectedIdMap.forEach((value, key) => {
+            keys.push(key);
+        });
+        for (let i = 0; i < keys.length; i++) {
+            const key = keys[i];
+            const value = next.selectedIdMap.get(key);
+            if (value !== prev.selectedIdMap.get(key)) {
+                return false;
+            }
+        }
+        return true;
+    }
+    arrayDiff(arrA, arrB) {
+        return arrA.filter((i) => arrB.indexOf(i) < 0);
+    }
+    arrayIntersection(arrA, arrB) {
+        return arrA.filter((value) => -1 !== arrB.indexOf(value));
+    }
+    arraysEqual(arrayA, arrayB) {
+        return (arrayA.length === arrayB.length &&
+            arrayA.every((value, index) => value === arrayB[index]));
+    }
+}
+SkyListViewGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListViewGridComponent, deps: [{ token: i1.ListState }, { token: i1.ListStateDispatcher }, { token: GridState }, { token: GridStateDispatcher }], target: i0.ɵɵFactoryTarget.Component });
+SkyListViewGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: SkyListViewGridComponent, selector: "sky-list-view-grid", inputs: { name: "name", displayedColumns: "displayedColumns", hiddenColumns: "hiddenColumns", fit: "fit", width: "width", height: "height", highlightSearchText: "highlightSearchText", messageStream: "messageStream", rowHighlightedId: "rowHighlightedId", enableMultiselect: "enableMultiselect", settingsKey: "settingsKey", searchFunction: ["search", "searchFunction"] }, outputs: { rowDeleteCancel: "rowDeleteCancel", rowDeleteConfirm: "rowDeleteConfirm", selectedColumnIdsChange: "selectedColumnIdsChange" }, providers: [
+        /* tslint:disable */
+        {
+            provide: ListViewComponent,
+            useExisting: forwardRef(() => SkyListViewGridComponent),
+        },
+        /* tslint:enable */
+        GridState,
+        GridStateDispatcher,
+        GridStateModel,
+    ], queries: [{ propertyName: "columnComponents", predicate: SkyGridColumnComponent }], viewQueries: [{ propertyName: "gridComponent", first: true, predicate: SkyGridComponent, descendants: true }], usesInheritance: true, ngImport: i0, 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]=\"\n      highlightSearchText ? (currentSearchText | async) : undefined\n    \"\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 [isWaiting]=\"loading | async\"> </sky-wait>\n</div>\n", styles: [":host ::ng-deep .sky-grid-heading{border-top:0!important}\n"], components: [{ type: i4$2.SkyGridComponent, selector: "sky-grid", inputs: ["columns", "data", "enableMultiselect", "fit", "hasToolbar", "height", "highlightText", "messageStream", "multiselectRowId", "rowHighlightedId", "selectedColumnIds", "selectedRowIds", "settingsKey", "sortField", "width"], outputs: ["columnWidthChange", "multiselectSelectionChange", "rowDeleteCancel", "rowDeleteConfirm", "selectedColumnIdsChange", "sortFieldChange"] }, { type: i1$1.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4$1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListViewGridComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sky-list-view-grid', providers: [
+                        /* tslint:disable */
+                        {
+                            provide: ListViewComponent,
+                            useExisting: forwardRef(() => SkyListViewGridComponent),
+                        },
+                        /* tslint:enable */
+                        GridState,
+                        GridStateDispatcher,
+                        GridStateModel,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, 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]=\"\n      highlightSearchText ? (currentSearchText | async) : undefined\n    \"\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 [isWaiting]=\"loading | async\"> </sky-wait>\n</div>\n", styles: [":host ::ng-deep .sky-grid-heading{border-top:0!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.ListState }, { type: i1.ListStateDispatcher }, { type: GridState }, { type: GridStateDispatcher }]; }, propDecorators: { name: [{
+                type: Input
+            }], displayedColumns: [{
+                type: Input
+            }], hiddenColumns: [{
+                type: Input
+            }], fit: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], highlightSearchText: [{
+                type: Input
+            }], messageStream: [{
+                type: Input
+            }], rowHighlightedId: [{
+                type: Input
+            }], enableMultiselect: [{
+                type: Input
+            }], settingsKey: [{
+                type: Input
+            }], rowDeleteCancel: [{
+                type: Output
+            }], rowDeleteConfirm: [{
+                type: Output
+            }], selectedColumnIdsChange: [{
+                type: Output
+            }], gridComponent: [{
+                type: ViewChild,
+                args: [SkyGridComponent]
+            }], searchFunction: [{
+                type: Input,
+                args: ['search']
+            }], columnComponents: [{
+                type: ContentChildren,
+                args: [SkyGridColumnComponent]
+            }] } });
+
+/**
+ * NOTICE: DO NOT MODIFY THIS FILE!
+ * The contents of this file were automatically generated by
+ * the 'ng generate @skyux/i18n:lib-resources-module lib/modules/shared/sky-list-builder-view-grids' schematic.
+ * To update this file, simply rerun the command.
+ */
+const RESOURCES = {
+    'EN-US': {
+        skyux_grid_column_picker_cancel: { message: 'Cancel' },
+        skyux_grid_column_picker_header: {
+            message: 'Choose columns to show in the list',
+        },
+        skyux_grid_column_picker_search_placeholder: {
+            message: 'Search for columns',
+        },
+        skyux_grid_column_picker_submit: { message: 'Apply changes' },
+        skyux_grid_columns_button: { message: 'Choose columns' },
+        skyux_grid_columns_toolbar_button: { message: 'Columns' },
+    },
+};
+class SkyListBuilderViewGridsResourcesProvider {
+    getString(localeInfo, name) {
+        return getLibStringForLocale(RESOURCES, localeInfo.locale, name);
+    }
+}
+/**
+ * Import into any component library module that needs to use resource strings.
+ */
+class SkyListBuilderViewGridsResourcesModule {
+}
+SkyListBuilderViewGridsResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListBuilderViewGridsResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SkyListBuilderViewGridsResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListBuilderViewGridsResourcesModule, exports: [SkyI18nModule] });
+SkyListBuilderViewGridsResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListBuilderViewGridsResourcesModule, providers: [
+        {
+            provide: SKY_LIB_RESOURCES_PROVIDERS,
+            useClass: SkyListBuilderViewGridsResourcesProvider,
+            multi: true,
+        },
+    ], imports: [SkyI18nModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListBuilderViewGridsResourcesModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: [SkyI18nModule],
+                    providers: [
+                        {
+                            provide: SKY_LIB_RESOURCES_PROVIDERS,
+                            useClass: SkyListBuilderViewGridsResourcesProvider,
+                            multi: true,
+                        },
+                    ],
+                }]
+        }] });
+
+class SkyListViewGridModule {
+}
+SkyListViewGridModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListViewGridModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SkyListViewGridModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListViewGridModule, declarations: [SkyListViewGridComponent], imports: [CommonModule,
+        SkyWaitModule,
+        SkyGridModule,
+        SkyListBuilderViewGridsResourcesModule], exports: [SkyListViewGridComponent,
+        SkyListColumnSelectorActionModule,
+        SkyGridModule] });
+SkyListViewGridModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListViewGridModule, imports: [[
+            CommonModule,
+            SkyWaitModule,
+            SkyGridModule,
+            SkyListBuilderViewGridsResourcesModule,
+        ], SkyListColumnSelectorActionModule,
+        SkyGridModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SkyListViewGridModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [SkyListViewGridComponent],
+                    imports: [
+                        CommonModule,
+                        SkyWaitModule,
+                        SkyGridModule,
+                        SkyListBuilderViewGridsResourcesModule,
+                    ],
+                    exports: [
+                        SkyListViewGridComponent,
+                        SkyListColumnSelectorActionModule,
+                        SkyGridModule,
+                    ],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { GridState, GridStateDispatcher, GridStateModel, GridStateOrchestrator, ListViewDisplayedGridColumnsLoadAction, ListViewDisplayedGridColumnsOrchestrator, ListViewGridColumnsLoadAction, ListViewGridColumnsOrchestrator, SkyColumnSelectorContext, SkyColumnSelectorModel, SkyColumnSelectorModule, SkyListColumnSelectorActionModule, SkyListViewGridComponent, SkyListViewGridMessageType, SkyListViewGridModule, SkyListColumnSelectorActionComponent as λ1 };
+//# sourceMappingURL=skyux-list-builder-view-grids.mjs.map