@skyux/ag-grid 8.3.1 → 8.4.0
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.
- package/documentation.json +1 -1
- package/package.json +12 -12
package/documentation.json
CHANGED
|
@@ -5136,7 +5136,7 @@
|
|
|
5136
5136
|
{
|
|
5137
5137
|
"fileName": "data-manager-data-entry-grid-docs-demo-view-grid.component.ts",
|
|
5138
5138
|
"filePath": "/projects/ag-grid/documentation/code-examples/data-entry-grid/data-manager-added/data-manager-data-entry-grid-docs-demo-view-grid.component.ts",
|
|
5139
|
-
"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 GridApi,\n GridOptions,\n GridReadyEvent,\n RowSelectedEvent,\n ValueFormatterParams,\n} from 'ag-grid-community';\n\nimport { SkyAgGridDemoRow } from '
|
|
5139
|
+
"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 GridApi,\n GridOptions,\n GridReadyEvent,\n RowSelectedEvent,\n ValueFormatterParams,\n} from 'ag-grid-community';\n\nimport { SkyAgGridDemoRow } from './data-manager-data-entry-grid-docs-demo-data';\n\n@Component({\n selector: 'app-data-manager-data-entry-grid-docs-demo-view-grid',\n templateUrl:\n './data-manager-data-entry-grid-docs-demo-view-grid.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DataManagerDataEntryGridDocsDemoViewGridComponent\n implements OnInit\n{\n @Input()\n public set items(value: SkyAgGridDemoRow[]) {\n this._items = value;\n this.changeDetector.markForCheck();\n if (this.gridApi) {\n this.gridApi.refreshCells();\n }\n }\n\n public viewId = 'dataEntryGridWithDataManagerView';\n\n public columnDefs: ColDef[] = [\n {\n field: 'selected',\n type: SkyCellType.RowSelector,\n },\n {\n field: 'name',\n headerName: 'Name',\n },\n {\n field: 'age',\n headerName: 'Age',\n type: SkyCellType.Number,\n maxWidth: 60,\n },\n {\n field: 'startDate',\n headerName: 'Start date',\n type: SkyCellType.Date,\n sort: 'asc',\n },\n {\n field: 'endDate',\n headerName: 'End date',\n type: SkyCellType.Date,\n valueFormatter: this.endDateFormatter,\n },\n {\n field: 'department',\n headerName: 'Department',\n type: SkyCellType.Autocomplete,\n },\n {\n field: 'jobTitle',\n headerName: 'Title',\n type: SkyCellType.Autocomplete,\n },\n {\n field: 'validationCurrency',\n headerName: 'Validation currency',\n type: [SkyCellType.CurrencyValidator],\n },\n {\n field: 'validationDate',\n headerName: 'Validation date',\n type: [SkyCellType.Date, SkyCellType.Validator],\n cellRendererParams: {\n skyComponentProperties: {\n validator: (value: Date): boolean =>\n !!value && value > new Date(1985, 9, 26),\n validatorMessage: 'Please enter a future date',\n },\n },\n },\n ];\n\n public dataState = new SkyDataManagerState({});\n\n public columnApi?: ColumnApi;\n public displayedItems: SkyAgGridDemoRow[] = [];\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 public viewConfig: SkyDataViewConfig = {\n id: this.viewId,\n name: 'Data 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 label: 'selected',\n alwaysDisplayed: true,\n },\n {\n id: 'name',\n label: 'Name',\n description: 'The name of the employee.',\n },\n {\n id: 'age',\n label: 'Age',\n description: 'The age of the employee.',\n },\n {\n id: 'startDate',\n label: 'Start date',\n description: 'The start date of the employee.',\n },\n {\n id: 'endDate',\n label: 'End date',\n description: 'The end date of the employee.',\n },\n {\n id: 'department',\n label: 'Department',\n description: 'The department of the employee',\n },\n {\n id: 'jobTitle',\n label: 'Title',\n description: 'The job title of the employee.',\n },\n {\n id: 'validationCurrency',\n label: 'Validation currency',\n description: 'An example column for currency validation.',\n },\n {\n id: 'validationDate',\n label: 'Validation date',\n description: 'An example column for date validation.',\n },\n ],\n };\n\n private _items: SkyAgGridDemoRow[] = [];\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 this.changeDetector.markForCheck();\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 this.changeDetector.markForCheck();\n }\n\n public onGridReady(gridReadyEvent: GridReadyEvent): void {\n this.gridApi = gridReadyEvent.api;\n this.gridApi.sizeColumnsToFit();\n this.columnApi = gridReadyEvent.columnApi;\n this.updateData();\n this.changeDetector.markForCheck();\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 this.columnApi.applyColumnState({\n state: [\n {\n colId: sortOption.propertyName,\n sort: sortOption.descending ? 'desc' : 'asc',\n },\n ],\n });\n }\n }\n\n public searchItems(items: SkyAgGridDemoRow[]): SkyAgGridDemoRow[] {\n let searchedItems = items;\n const searchText = this.dataState && this.dataState.searchText;\n\n if (searchText) {\n searchedItems = items.filter(function (item: SkyAgGridDemoRow) {\n let property: keyof typeof item;\n for (property in item) {\n if (\n Object.prototype.hasOwnProperty.call(item, property) &&\n property === 'name'\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\n return searchedItems;\n }\n\n public filterItems(items: SkyAgGridDemoRow[]): SkyAgGridDemoRow[] {\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: SkyAgGridDemoRow) => {\n return (\n ((filters.hideSales && item.department.name !== 'Sales') ||\n !filters.hideSales) &&\n ((filters.jobTitle !== 'any' &&\n item.jobTitle?.name === filters.jobTitle) ||\n !filters.jobTitle ||\n filters.jobTitle === 'any')\n );\n });\n }\n\n return filteredItems;\n }\n\n private endDateFormatter(params: ValueFormatterParams): string {\n const dateConfig = { year: 'numeric', month: '2-digit', day: '2-digit' };\n return params.value\n ? params.value.toLocaleDateString('en-us', dateConfig)\n : 'N/A';\n }\n}\n"
|
|
5140
5140
|
},
|
|
5141
5141
|
{
|
|
5142
5142
|
"fileName": "data-manager-data-entry-grid-docs-demo.component.html",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@skyux/ag-grid",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.4.0",
|
|
4
4
|
"author": "Blackbaud, Inc.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"blackbaud",
|
|
@@ -35,17 +35,17 @@
|
|
|
35
35
|
"@angular/common": "^15.2.9",
|
|
36
36
|
"@angular/core": "^15.2.9",
|
|
37
37
|
"@angular/forms": "^15.2.9",
|
|
38
|
-
"@skyux/autonumeric": "8.
|
|
39
|
-
"@skyux/core": "8.
|
|
40
|
-
"@skyux/data-manager": "8.
|
|
41
|
-
"@skyux/datetime": "8.
|
|
42
|
-
"@skyux/forms": "8.
|
|
43
|
-
"@skyux/i18n": "8.
|
|
44
|
-
"@skyux/indicators": "8.
|
|
45
|
-
"@skyux/layout": "8.
|
|
46
|
-
"@skyux/lookup": "8.
|
|
47
|
-
"@skyux/popovers": "8.
|
|
48
|
-
"@skyux/theme": "8.
|
|
38
|
+
"@skyux/autonumeric": "8.4.0",
|
|
39
|
+
"@skyux/core": "8.4.0",
|
|
40
|
+
"@skyux/data-manager": "8.4.0",
|
|
41
|
+
"@skyux/datetime": "8.4.0",
|
|
42
|
+
"@skyux/forms": "8.4.0",
|
|
43
|
+
"@skyux/i18n": "8.4.0",
|
|
44
|
+
"@skyux/indicators": "8.4.0",
|
|
45
|
+
"@skyux/layout": "8.4.0",
|
|
46
|
+
"@skyux/lookup": "8.4.0",
|
|
47
|
+
"@skyux/popovers": "8.4.0",
|
|
48
|
+
"@skyux/theme": "8.4.0",
|
|
49
49
|
"ag-grid-angular": "^28.2.1",
|
|
50
50
|
"ag-grid-community": "^28.2.1"
|
|
51
51
|
},
|