@skyux/data-manager 6.24.0 → 6.25.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4934,7 +4934,7 @@
4934
4934
  {
4935
4935
  "fileName": "data-view-grid.component.ts",
4936
4936
  "filePath": "/projects/data-manager/documentation/code-examples/data-manager/basic/data-view-grid.component.ts",
4937
- "rawContents": "import {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n Input,\n OnInit,\n} from '@angular/core';\nimport { SkyAgGridService, SkyCellType } from '@skyux/ag-grid';\nimport {\n SkyDataManagerService,\n SkyDataManagerState,\n SkyDataViewConfig,\n} from '@skyux/data-manager';\n\nimport {\n ColDef,\n ColumnApi,\n ColumnState,\n GridApi,\n GridOptions,\n GridReadyEvent,\n RowSelectedEvent,\n} from 'ag-grid-community';\n\n@Component({\n selector: 'app-data-view-grid-demo',\n templateUrl: './data-view-grid.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DataViewGridDemoComponent implements OnInit {\n @Input()\n public items: any[] = [];\n\n public viewId = 'gridView';\n\n public columnDefs: ColDef[] = [\n {\n colId: 'selected',\n field: 'selected',\n headerName: '',\n maxWidth: 50,\n type: SkyCellType.RowSelector,\n suppressMovable: true,\n lockPosition: true,\n lockVisible: true,\n },\n {\n colId: 'name',\n field: 'name',\n headerName: 'Fruit name',\n width: 150,\n },\n {\n colId: 'description',\n field: 'description',\n headerName: 'Description',\n },\n ];\n\n public dataState = new SkyDataManagerState({});\n\n public viewConfig: SkyDataViewConfig = {\n id: this.viewId,\n name: 'Grid View',\n icon: 'table',\n searchEnabled: true,\n sortEnabled: true,\n multiselectToolbarEnabled: true,\n columnPickerEnabled: true,\n filterButtonEnabled: true,\n columnOptions: [\n {\n id: 'selected',\n alwaysDisplayed: true,\n label: 'selected',\n },\n {\n id: 'name',\n label: 'Fruit name',\n description: 'The name of the fruit.',\n },\n {\n id: 'description',\n label: 'Description',\n description: 'Some information about the fruit.',\n },\n ],\n };\n\n public columnApi?: ColumnApi;\n public displayedItems: any[] = [];\n public gridApi?: GridApi;\n public gridInitialized = false;\n public gridOptions!: GridOptions;\n public noRowsTemplate: string;\n public isActive = false;\n\n constructor(\n private agGridService: SkyAgGridService,\n private changeDetector: ChangeDetectorRef,\n private dataManagerService: SkyDataManagerService\n ) {\n this.noRowsTemplate = `<div class=\"sky-font-deemphasized\">No results found.</div>`;\n }\n\n public ngOnInit(): void {\n this.displayedItems = this.items;\n\n this.dataManagerService.initDataView(this.viewConfig);\n\n this.gridOptions = this.agGridService.getGridOptions({\n gridOptions: {\n columnDefs: this.columnDefs,\n onGridReady: this.onGridReady.bind(this),\n },\n });\n\n this.dataManagerService\n .getDataStateUpdates(this.viewId)\n .subscribe((state) => {\n this.dataState = state;\n this.setInitialColumnOrder();\n this.updateData();\n this.changeDetector.detectChanges();\n });\n\n this.dataManagerService.getActiveViewIdUpdates().subscribe((id) => {\n this.isActive = id === this.viewId;\n this.changeDetector.detectChanges();\n });\n }\n\n public updateData(): void {\n this.sortItems();\n this.displayedItems = this.filterItems(this.searchItems(this.items));\n\n if (this.dataState.onlyShowSelected) {\n this.displayedItems = this.displayedItems.filter((item) => item.selected);\n }\n\n if (this.displayedItems.length > 0) {\n this.gridApi?.hideOverlay();\n } else {\n this.gridApi?.showNoRowsOverlay();\n }\n }\n\n public setInitialColumnOrder(): void {\n const viewState = this.dataState.getViewStateById(this.viewId);\n const visibleColumns = viewState.displayedColumnIds;\n\n this.columnDefs.sort((col1, col2) => {\n const col1Index = visibleColumns.findIndex(\n (colId: string) => colId === col1.colId\n );\n const col2Index = visibleColumns.findIndex(\n (colId: string) => colId === col2.colId\n );\n\n if (col1Index === -1) {\n col1.hide = true;\n return 0;\n } else if (col2Index === -1) {\n col2.hide = true;\n return 0;\n } else {\n return col1Index - col2Index;\n }\n });\n\n this.gridInitialized = true;\n }\n\n public onGridReady(event: GridReadyEvent): void {\n this.columnApi = event.columnApi;\n this.gridApi = event.api;\n this.gridApi.sizeColumnsToFit();\n this.updateData();\n }\n\n public onRowSelected(rowSelectedEvent: RowSelectedEvent): void {\n if (!rowSelectedEvent.data.selected) {\n this.updateData();\n }\n }\n\n public sortItems(): void {\n const sortOption = this.dataState.activeSortOption;\n if (this.columnApi && sortOption) {\n const sort: ColumnState[] = [\n {\n colId: sortOption.propertyName,\n sort: sortOption.descending ? 'desc' : 'asc',\n },\n ];\n\n this.columnApi.applyColumnState({\n state: sort,\n });\n }\n }\n\n public searchItems(items: any[]): any[] {\n let searchedItems = items;\n const searchText = this.dataState && this.dataState.searchText;\n\n if (searchText) {\n searchedItems = items.filter(function (item: any) {\n let property: any;\n\n for (property in item) {\n if (\n Object.prototype.hasOwnProperty.call(item, property) &&\n (property === 'name' || property === 'description')\n ) {\n const propertyText = item[property].toLowerCase();\n if (propertyText.indexOf(searchText) > -1) {\n return true;\n }\n }\n }\n\n return false;\n });\n }\n return searchedItems;\n }\n\n public filterItems(items: any[]): any[] {\n let filteredItems = items;\n const filterData = this.dataState && this.dataState.filterData;\n\n if (filterData && filterData.filters) {\n const filters = filterData.filters;\n filteredItems = items.filter((item: any) => {\n return (\n ((filters.hideOrange && item.color !== 'orange') ||\n !filters.hideOrange) &&\n ((filters.type !== 'any' && item.type === filters.type) ||\n !filters.type ||\n filters.type === 'any')\n );\n });\n }\n\n return filteredItems;\n }\n}\n"
4937
+ "rawContents": "import {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n Input,\n OnInit,\n} from '@angular/core';\nimport { SkyAgGridService, SkyCellType } from '@skyux/ag-grid';\nimport {\n SkyDataManagerService,\n SkyDataManagerState,\n SkyDataViewConfig,\n} from '@skyux/data-manager';\n\nimport {\n ColDef,\n ColumnApi,\n ColumnState,\n GridApi,\n GridOptions,\n GridReadyEvent,\n RowSelectedEvent,\n} from 'ag-grid-community';\n\n@Component({\n selector: 'app-data-view-grid-demo',\n templateUrl: './data-view-grid.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DataViewGridDemoComponent implements OnInit {\n @Input()\n public items: any[] = [];\n\n public viewId = 'gridView';\n\n public columnDefs: ColDef[] = [\n {\n colId: 'selected',\n field: 'selected',\n headerName: '',\n maxWidth: 50,\n type: SkyCellType.RowSelector,\n suppressMovable: true,\n lockPosition: true,\n lockVisible: true,\n },\n {\n colId: 'name',\n field: 'name',\n headerName: 'Fruit name',\n width: 150,\n },\n {\n colId: 'description',\n field: 'description',\n headerName: 'Description',\n },\n ];\n\n public dataState = new SkyDataManagerState({});\n\n public viewConfig: SkyDataViewConfig = {\n id: this.viewId,\n name: 'Grid View',\n icon: 'table',\n searchEnabled: true,\n sortEnabled: true,\n multiselectToolbarEnabled: true,\n columnPickerEnabled: true,\n filterButtonEnabled: true,\n columnOptions: [\n {\n id: 'selected',\n alwaysDisplayed: true,\n label: 'selected',\n },\n {\n id: 'name',\n label: 'Fruit name',\n description: 'The name of the fruit.',\n },\n {\n id: 'description',\n label: 'Description',\n description: 'Some information about the fruit.',\n },\n ],\n };\n\n public columnApi?: ColumnApi;\n public displayedItems: any[] = [];\n public gridApi?: GridApi;\n public gridInitialized = false;\n public gridOptions!: GridOptions;\n public noRowsTemplate = `<div class=\"sky-font-deemphasized\">No results found.</div>`;\n public isActive = false;\n\n constructor(\n private agGridService: SkyAgGridService,\n private changeDetector: ChangeDetectorRef,\n private dataManagerService: SkyDataManagerService\n ) {}\n\n public ngOnInit(): void {\n this.displayedItems = this.items;\n\n this.dataManagerService.initDataView(this.viewConfig);\n\n this.gridOptions = this.agGridService.getGridOptions({\n gridOptions: {\n columnDefs: this.columnDefs,\n onGridReady: this.onGridReady.bind(this),\n },\n });\n\n this.dataManagerService\n .getDataStateUpdates(this.viewId)\n .subscribe((state) => {\n this.dataState = state;\n this.setInitialColumnOrder();\n this.updateData();\n this.changeDetector.detectChanges();\n });\n\n this.dataManagerService.getActiveViewIdUpdates().subscribe((id) => {\n this.isActive = id === this.viewId;\n this.changeDetector.detectChanges();\n });\n }\n\n public updateData(): void {\n this.sortItems();\n this.displayedItems = this.filterItems(this.searchItems(this.items));\n\n if (this.dataState.onlyShowSelected) {\n this.displayedItems = this.displayedItems.filter((item) => item.selected);\n }\n\n if (this.displayedItems.length > 0) {\n this.gridApi?.hideOverlay();\n } else {\n this.gridApi?.showNoRowsOverlay();\n }\n }\n\n public setInitialColumnOrder(): void {\n const viewState = this.dataState.getViewStateById(this.viewId);\n const visibleColumns = viewState.displayedColumnIds;\n\n this.columnDefs.sort((col1, col2) => {\n const col1Index = visibleColumns.findIndex(\n (colId: string) => colId === col1.colId\n );\n const col2Index = visibleColumns.findIndex(\n (colId: string) => colId === col2.colId\n );\n\n if (col1Index === -1) {\n col1.hide = true;\n return 0;\n } else if (col2Index === -1) {\n col2.hide = true;\n return 0;\n } else {\n return col1Index - col2Index;\n }\n });\n\n this.gridInitialized = true;\n }\n\n public onGridReady(event: GridReadyEvent): void {\n this.columnApi = event.columnApi;\n this.gridApi = event.api;\n this.gridApi.sizeColumnsToFit();\n this.updateData();\n }\n\n public onRowSelected(rowSelectedEvent: RowSelectedEvent): void {\n if (!rowSelectedEvent.data.selected) {\n this.updateData();\n }\n }\n\n public sortItems(): void {\n const sortOption = this.dataState.activeSortOption;\n if (this.columnApi && sortOption) {\n const sort: ColumnState[] = [\n {\n colId: sortOption.propertyName,\n sort: sortOption.descending ? 'desc' : 'asc',\n },\n ];\n\n this.columnApi.applyColumnState({\n state: sort,\n });\n }\n }\n\n public searchItems(items: any[]): any[] {\n let searchedItems = items;\n const searchText = this.dataState && this.dataState.searchText;\n\n if (searchText) {\n searchedItems = items.filter(function (item: any) {\n let property: any;\n\n for (property in item) {\n if (\n Object.prototype.hasOwnProperty.call(item, property) &&\n (property === 'name' || property === 'description')\n ) {\n const propertyText = item[property].toLowerCase();\n if (propertyText.indexOf(searchText) > -1) {\n return true;\n }\n }\n }\n\n return false;\n });\n }\n return searchedItems;\n }\n\n public filterItems(items: any[]): any[] {\n let filteredItems = items;\n const filterData = this.dataState && this.dataState.filterData;\n\n if (filterData && filterData.filters) {\n const filters = filterData.filters;\n filteredItems = items.filter((item: any) => {\n return (\n ((filters.hideOrange && item.color !== 'orange') ||\n !filters.hideOrange) &&\n ((filters.type !== 'any' && item.type === filters.type) ||\n !filters.type ||\n filters.type === 'any')\n );\n });\n }\n\n return filteredItems;\n }\n}\n"
4938
4938
  },
4939
4939
  {
4940
4940
  "fileName": "data-view-repeater.component.html",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyux/data-manager",
3
- "version": "6.24.0",
3
+ "version": "6.25.1",
4
4
  "author": "Blackbaud, Inc.",
5
5
  "keywords": [
6
6
  "blackbaud",
@@ -35,14 +35,14 @@
35
35
  "@angular/common": "^13.3.2",
36
36
  "@angular/core": "^13.3.2",
37
37
  "@angular/forms": "^13.3.2",
38
- "@skyux/core": "6.24.0",
39
- "@skyux/forms": "6.24.0",
40
- "@skyux/i18n": "6.24.0",
41
- "@skyux/indicators": "6.24.0",
42
- "@skyux/layout": "6.24.0",
43
- "@skyux/lists": "6.24.0",
44
- "@skyux/lookup": "6.24.0",
45
- "@skyux/modals": "6.24.0"
38
+ "@skyux/core": "6.25.1",
39
+ "@skyux/forms": "6.25.1",
40
+ "@skyux/i18n": "6.25.1",
41
+ "@skyux/indicators": "6.25.1",
42
+ "@skyux/layout": "6.25.1",
43
+ "@skyux/lists": "6.25.1",
44
+ "@skyux/lookup": "6.25.1",
45
+ "@skyux/modals": "6.25.1"
46
46
  },
47
47
  "dependencies": {
48
48
  "tslib": "^2.3.1"