{
  "$schema": "https://ai.syncfusion.com/schema/registry-item.json",
  "name": "grid-default",
  "framework": "javascript",
  "type": "registry:component",
  "component": "Grid",
  "variant": "default",
  "dependencies": [
    "@syncfusion/ej2-grids"
  ],
  "description": "Data grid with paging, sorting, filtering, validation, toolbar, and editing for orders.",
  "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/javascript/llms.txt",
    "skillPack": "syncfusion/javascript-ui-components-skills",
    "docs": "https://ai.syncfusion.com/gallery/javascript/grid-default.md"
  },
  "files": [
    {
      "target": "src/components/grid-default/default.html",
      "content": "<div class=\"control-section\">\n    <div class=\"content-wrapper\">\n        <div id=\"Grid\">\n        </div>\n    </div>\n</div>\n"
    },
    {
      "target": "src/components/grid-default/default.ts",
      "content": "import { Grid, Selection, Sort, Filter, Edit, Toolbar } from '@syncfusion/ej2-grids';\nimport { Query, DataManager } from '@syncfusion/ej2-data';\nimport { orderData } from '../data-source';\n\nGrid.Inject(Selection, Sort, Filter, Edit, Toolbar);\n\n/**\n * Default Grid sample\n */\n(window as any).default = (): void => {\n    let data: Object = new DataManager(orderData as JSON[]).executeLocal(new Query().take(15));\n    let grid: Grid = new Grid(\n        {\n            dataSource: data,\n            allowSorting: true,\n            allowFiltering: true,\n            filterSettings: { type: 'Excel' },\n            toolbar: ['Add', 'Edit', 'Delete', 'Update', 'Cancel'],\n            editSettings: { allowAdding: true, allowEditing: true, allowDeleting: true },\n            columns: [\n                { field: 'OrderID', headerText: 'Order ID', width: 180, textAlign: 'Right', isPrimaryKey: true, validationRules: { required: true, number: true } },\n                { field: 'CustomerName', headerText: 'Customer Name', width: 150, validationRules: { required: true, minLength: 5 } },\n                { field: 'OrderDate', headerText: 'Order Date', width: 130, format: 'yMd', textAlign: 'Right', editType: 'datepickeredit' },\n                { field: 'Freight', width: 120, format: 'C2', textAlign: 'Right', editType: 'numericedit', validationRules: { required: true, min: 0 } },\n                { field: 'ShippedDate', headerText: 'Shipped Date', width: 140, format: 'yMd', textAlign: 'Right', editType: 'datepickeredit' },\n                { field: 'ShipCountry', headerText: 'Ship Country', width: 150, editType: 'dropdownedit' }\n            ]\n        });\n    grid.appendTo('#Grid');\n};\n"
    }
  ]
}