ag-grid-angular - npm Package Compare versions

Comparing version 32.3.3 to 33.0.0

lib/angularFrameworkComponentWrapper.d.ts

@@ -0,4 +1,4 @@
+import type { ComponentRef, ViewContainerRef } from '@angular/core';
 import type { FrameworkComponentWrapper, WrappableInterface } from 'ag-grid-community';
 import { BaseComponentWrapper } from 'ag-grid-community';
-import type { ComponentRef, ViewContainerRef } from '@angular/core';
 import type { AngularFrameworkOverrides } from './angularFrameworkOverrides';
@@ -5,0 +5,0 @@ import * as i0 from "@angular/core";

lib/angularFrameworkOverrides.d.ts

@@ -1,4 +0,4 @@
-import type { FrameworkOverridesIncomingSource } from 'ag-grid-community';
+import { NgZone } from '@angular/core';
+import type { FrameworkOverridesIncomingSource, IFrameworkEventListenerService, LocalEventService } from 'ag-grid-community';
 import { VanillaFrameworkOverrides } from 'ag-grid-community';
-import { NgZone } from '@angular/core';
 import * as i0 from "@angular/core";
@@ -11,2 +11,8 @@ export declare class AngularFrameworkOverrides extends VanillaFrameworkOverrides {
     wrapIncoming: <T>(callback: () => T, source?: FrameworkOverridesIncomingSource) => T;
+    /**
+     * The shouldWrapOutgoing property is used to determine if events should be run outside of Angular or not.
+     * If an event handler is registered outside of Angular then we should not wrap the event handler
+     * with runInsideAngular() as the user may not have wanted this.
+     * This is also used to not wrap internal event listeners that are registered with RowNodes and Columns.
+     */
     get shouldWrapOutgoing(): boolean;
@@ -18,2 +24,4 @@ /**
     wrapOutgoing: <T>(callback: () => T) => T;
+    createLocalEventListenerWrapper(existingFrameworkEventListenerService: IFrameworkEventListenerService<any, any> | undefined, localEventService: LocalEventService<any>): IFrameworkEventListenerService<any, any> | undefined;
+    createGlobalEventListenerWrapper(): IFrameworkEventListenerService<any, any>;
     isFrameworkComponent(comp: any): boolean;
@@ -20,0 +28,0 @@ runInsideAngular<T>(callback: () => T): T;

package.json

 {
   "name": "ag-grid-angular",
-  "version": "32.3.3",
+  "version": "33.0.0",
   "license": "MIT",
   "peerDependencies": {
-    "ag-grid-community": "32.3.3",
-    "@angular/common": ">= 16.0.0",
-    "@angular/core": ">= 16.0.0"
+    "@angular/common": ">= 17.0.0",
+    "@angular/core": ">= 17.0.0"
   },
   "dependencies": {
+    "ag-grid-community": "33.0.0",
     "tslib": "^2.3.0"
@@ -12,0 +12,0 @@ },

README.md

@@ -60,23 +60,24 @@ # Angular Data Grid | Angular Table
 
--   [📖 Overview](#-overview)
-    -   [Features](#features)
-    -   [Examples](#examples)
--   [⚡️ Quick Start](#️-quick-start)
-    -   [Installation](#installation)
-    -   [Setup](#setup)
-    -   [Seed Projects](#seed-projects)
--   [🛠️ Customisations](#️-customisations)
-    -   [Custom Components](#custom-components)
-    -   [Themes](#themes)
-    -   [Custom Themes](#custom-themes)
--   [🌍 Community](#-community)
-    -   [Tools \& Extensions](#tools--extensions)
-    -   [Showcase](#showcase)
-    -   [Stargazers](#stargazers)
--   [🤝 Support](#-support)
-    -   [Enterprise Support](#enterprise-support)
-    -   [Bug Reports](#bug-reports)
-    -   [Questions](#questions)
-    -   [Contributing](#contributing)
--   [⚠️ License](#️-license)
+-   [Angular Data Grid | Angular Table]
+    -   [📖 Overview](#overview)
+        -   [Features](#features)
+        -   [Examples](#examples)
+    -   [⚡️ Quick Start](#️quick-start)
+        -   [Installation](#installation)
+        -   [Setup](#setup)
+        -   [Seed Projects](#seed-projects)
+    -   [🛠️ Customisations](#️customisations)
+        -   [Custom Components](#custom-components)
+        -   [Themes](#themes)
+        -   [Custom Themes](#custom-themes)
+    -   [🌍 Community](#community)
+        -   [Tools \& Extensions](#tools--extensions)
+        -   [Showcase](#showcase)
+        -   [Stargazers](#stargazers)
+    -   [🤝 Support](#support)
+        -   [Enterprise Support](#enterprise-support)
+        -   [Bug Reports](#bug-reports)
+        -   [Questions](#questions)
+        -   [Contributing](#contributing)
+    -   [⚠️ License](#️license)
 
@@ -238,28 +239,7 @@ </details>
   [rowData]="rowData"
-  [columnDefs]="colDefs" />
+  [columnDefs]="colDefs"
+  style="height: 500px;" />
 `;
 ```
 
-**4. Styling the Data Grid**
-
-Import the required dependencies into your styles.css file.
-
-```js
-/* Core Data Grid CSS */
-import 'ag-grid-community/styles/ag-grid.css';
-
-/* Quartz Theme Specific CSS */
-import 'ag-grid-community/styles/ag-theme-quartz.css';
-```
-
-Add the class and style props to the ag-grid-angular component.
-
-```js
-<ag-grid-angular
-class="ag-theme-quartz"
-style="height: 500px;"
-...
-/>
-```
-
 <!-- END SETUP -->
@@ -376,3 +356,3 @@
 
-AG Grid has 4 [themes](https://ag-grid.com/angular-data-grid/global-style/?utm_source=ag-grid-angular-readme&utm_medium=repository&utm_campaign=github), each available in `light` & `dark` modes. We also supply each theme with an `auto` mode that can toggle the theme based on the users' system preferences:
+AG Grid has 4 [themes](https://ag-grid.com/angular-data-grid/themes/?utm_source=ag-grid-angular-readme&utm_medium=repository&utm_campaign=github), each available in `light` & `dark` modes:
 
@@ -430,15 +410,5 @@ <table>
 
-To apply a theme, add the relevant CSS Class to the Data Grid container. For example, to apply the Quartz theme, use the CSS class `ag-theme-quartz`:
-
-```js
-<div
-    id="myGrid"
-    style="height: 150px; width: 600px"
-    class="ag-theme-quartz"
-></div>
-```
-
 ### Custom Themes
 
-All AG Grid themes can be customised using [CSS variables](https://www.ag-grid.com/angular-data-grid/global-style-customisation-variables/?utm_source=ag-grid-angular-readme&utm_medium=repository&utm_campaign=github), or you can create a new theme from scratch with the help of our [Theme Builder](https://www.ag-grid.com/theme-builder/?utm_source=ag-grid-angular-readme&utm_medium=repository&utm_campaign=github) or [Figma Design System](https://www.figma.com/community/file/1360600846643230092/ag-grid-design-system).
+All AG Grid themes can be customised using the [Theming API](https://www.ag-grid.com/angular-data-grid/theming/?utm_source=ag-grid-angular-readme&utm_medium=repository&utm_campaign=github), or you can create a new theme from scratch with the help of our [Theme Builder](https://www.ag-grid.com/theme-builder/?utm_source=ag-grid-angular-readme&utm_medium=repository&utm_campaign=github) or [Figma Design System](https://www.figma.com/community/file/1360600846643230092/ag-grid-design-system).
 
@@ -445,0 +415,0 @@ ## 🌍 Community

No alert changes

Improved metrics

Total package byte prevSize

926604

increased by6.9%

Number of package files

21

increased by10.53%

Lines of code

8121

increased by8.08%

Worsened metrics

Number of lines in readme file

525

decreased by-5.41%

Dependency changes

• + Addedag-grid-community@33.0.0

• + Addedag-charts-types@11.0.0(transitive)

• + Addedag-grid-community@33.0.0(transitive)

• - Removedag-charts-types@10.3.3(transitive)

• - Removedag-grid-community@32.3.3(transitive)