{
  "$schema": "https://ai.syncfusion.com/schema/registry-item.json",
  "name": "grid-default",
  "framework": "angular",
  "type": "registry:component",
  "component": "Grid",
  "variant": "default",
  "dependencies": [
    "@syncfusion/ej2-angular-grids"
  ],
  "description": "Data grid with paging, sorting, filtering, validation, toolbar, and editing via GridModule.",
  "meta": {
    "essentialStudioRelease": "2026 Volume 2 (v34.1.29)",
    "license": "commercial-or-community",
    "licenseNote": "The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md",
    "requiresLicenseKey": true,
    "requiresServerEndpoint": false,
    "platformIndex": "https://ai.syncfusion.com/angular/llms.txt",
    "skillPack": "syncfusion/angular-ui-components-skills",
    "docs": "https://ai.syncfusion.com/gallery/angular/grid-default.md"
  },
  "files": [
    {
      "target": "src/components/grid-default/grid.component.html",
      "content": "<div class=\"grid-container\" style=\"margin: 50px 90px\">\n  <ejs-grid [dataSource]='data' height='350' [allowSorting]='true' [allowFiltering]='true' [filterSettings]='filterSettings' [editSettings]='editSettings' [toolbar]='toolbar'>\n      <e-columns>\n          <e-column field='OrderID' headerText='Order ID' width='180' textAlign='Right' isPrimaryKey='true' [validationRules]='orderIdRules'></e-column>\n          <e-column field='CustomerName' headerText='Customer Name' width='150' [validationRules]='customerIdRules'></e-column>\n          <e-column field='OrderDate' headerText='Order Date' width='130' format=\"yMd\" textAlign='Right' editType='datepickeredit'></e-column>\n          <e-column field='Freight' headerText='Freight' width='120' format='C2' textAlign='Right' editType='numericedit' [validationRules]='freightRules'></e-column>\n          <e-column field='ShippedDate' headerText='Shipped Date' width='130' format=\"yMd\" textAlign='Right' editType='datepickeredit'></e-column>\n          <e-column field='ShipCountry' headerText='Ship Country' width='150' editType='dropdownedit'></e-column>\n      </e-columns>\n    </ejs-grid>\n</div>\n"
    },
    {
      "target": "src/components/grid-default/grid.component.ts",
      "content": "import { Component } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { GridModule, PageService, SortService, FilterService, ToolbarService, EditService, SelectionService } from '@syncfusion/ej2-angular-grids';\n\n@Component({\n  selector: 'app-grid',\n  standalone: true,\n  imports: [CommonModule, GridModule],\n  providers: [PageService, SortService, FilterService, ToolbarService, EditService, SelectionService],\n  templateUrl: './grid.component.html'\n})\n\nexport class GridComponent {\n  public data: Object[] = [\n    { 'OrderID': 10248, 'CustomerName': 'Maria ', 'OrderDate': new Date('1996-07-04'), 'ShippedDate': new Date('1996-07-16'), 'Freight': 32.38, 'ShipCountry': 'France' },\n    { 'OrderID': 10249, 'CustomerName': 'Ana Trujillo', 'OrderDate': new Date('1996-07-05'), 'ShippedDate': new Date('1996-07-10'), 'Freight': 11.61, 'ShipCountry': 'Germany' },\n    { 'OrderID': 10250, 'CustomerName': 'Antonio Moreno', 'OrderDate': new Date('1996-07-08'), 'ShippedDate': new Date('1996-07-12'), 'Freight': 65.83, 'ShipCountry': 'Brazil' },\n    { 'OrderID': 10251, 'CustomerName': 'Thomas Hardy', 'OrderDate': new Date('1996-07-08'), 'ShippedDate': new Date('1996-07-15'), 'Freight': 41.34, 'ShipCountry': 'France' },\n    { 'OrderID': 10252, 'CustomerName': 'Christina Berglund', 'OrderDate': new Date('1996-07-09'), 'ShippedDate': new Date('1996-07-11'), 'Freight': 51.3, 'ShipCountry': 'Belgium' },\n    { 'OrderID': 10253, 'CustomerName': 'Hanna Moos', 'OrderDate': new Date('1996-07-10'), 'ShippedDate': new Date('1996-07-16'), 'Freight': 58.17, 'ShipCountry': 'Brazil' },\n    { 'OrderID': 10254, 'CustomerName': 'Frédérique Citeaux', 'OrderDate': new Date('1996-07-11'), 'ShippedDate': new Date('1996-07-23'), 'Freight': 22.98, 'ShipCountry': 'Switzerland' },\n    { 'OrderID': 10255, 'CustomerName': 'Martín Sommer', 'OrderDate': new Date('1996-07-12'), 'ShippedDate': new Date('1996-07-15'), 'Freight': 148.33, 'ShipCountry': 'Switzerland' },\n    { 'OrderID': 10256, 'CustomerName': 'Laurence Lebihan', 'OrderDate': new Date('1996-07-15'), 'ShippedDate': new Date('1996-07-17'), 'Freight': 13.97, 'ShipCountry': 'Brazil' },\n    { 'OrderID': 10257, 'CustomerName': 'Elizabeth Lincoln', 'OrderDate': new Date('1996-07-16'), 'ShippedDate': new Date('1996-07-22'), 'Freight': 81.91, 'ShipCountry': 'Venezuela' },\n    { 'OrderID': 10258, 'CustomerName': 'Victoria Ashworth', 'OrderDate': new Date('1996-07-17'), 'ShippedDate': new Date('1996-07-23'), 'Freight': 140.51, 'ShipCountry': 'Austria' },\n    { 'OrderID': 10259, 'CustomerName': 'Patricio Simpson', 'OrderDate': new Date('1996-07-18'), 'ShippedDate': new Date('1996-07-25'), 'Freight': 3.25, 'ShipCountry': 'Mexico' },\n    { 'OrderID': 10260, 'CustomerName': 'Francisco Chang', 'OrderDate': new Date('1996-07-19'), 'ShippedDate': new Date('1996-07-29'), 'Freight': 55.09, 'ShipCountry': 'Germany' },\n    { 'OrderID': 10261, 'CustomerName': 'Yang Wang', 'OrderDate': new Date('1996-07-19'), 'ShippedDate': new Date('1996-07-30'), 'Freight': 3.05, 'ShipCountry': 'Brazil' },\n    { 'OrderID': 10262, 'CustomerName': 'Pedro Afonso', 'OrderDate': new Date('1996-07-22'), 'ShippedDate': new Date('1996-07-25'), 'Freight': 48.29, 'ShipCountry': 'USA' }\n  ];\n\n  public filterSettings = {\n    type: 'Excel'\n  };\n\n  public toolbar = ['Add', 'Edit', 'Delete', 'Update', 'Cancel'];\n\n  public editSettings = {\n    allowEditing: true,\n    allowAdding: true,\n    allowDeleting: true\n  };\n\n  public customerIdRules = {\n    required: true,\n    minLength: 5\n  };\n\n  public orderIdRules = {\n    required: true,\n    number: true\n  };\n\n  public freightRules = {\n    required: true,\n    min: 0\n  };\n}\n"
    }
  ]
}