const fields = [
  { fieldName: "OrderID", dataType: "text" },
  { fieldName: "CustomerID", dataType: "text" },
  { fieldName: "EmployeeID", dataType: "text" },
  { fieldName: "Quantity", dataType: "number" },
  { fieldName: "OrderDate", dataType: "datetime" },
  { fieldName: "CompanyName", dataType: "text" },
  { fieldName: "Country", dataType: "text" },
  { fieldName: "Phone", dataType: "text" },
  { fieldName: "ProductName", dataType: "text" },
  { fieldName: "QuantityPerUnit", dataType: "text" },
  { fieldName: "UnitPrice", dataType: "number" }
];

const columns = [
  {
    name: "OrderID",
    fieldName: "OrderID",
    width: "150",
    header: { text: "Only alphabets allowed" },
    editor: { type: "line", inputCharacters: "A-Za-z" }
  },
  {
    name: "CustomerID",
    fieldName: "CustomerID",
    width: "150",
    header: { text: "Alphabets not allowed" },
    editor: { type: "line", ignoreCharacters: "A-Za-z" }
  },
  {
    name: "Quantity",
    fieldName: "Quantity",
    width: "150",
    header: { text: "Alphabets not allowed" },
    editor: { type: "number", inputCharacters: "0-9" }
  },
  {
    name: "EmployeeID",
    fieldName: "EmployeeID",
    header: { text: "Only Korean allowed" },
    editor: { type: "line", inputCharacters: "ㄱ-힣" }
  }
];

const { gridView, dataProvider } = RealGrid.createGrid("realgrid", {
  columns,
  header: { height: 40 },
  display: { rowHeight: 36, emptyMessage: "No data to display." },
  footer: { height: 40 },
  stateBar: { width: 16 },
  onInitialized: (grid) => {
    const datas = [
      ["VINET","10248","Korean Input", 1],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"],
      ["VINET","10248","Korean Input"]
    ];
    grid.getDataSource().setRows(datas);
  }
}, {
  fields
});

window.gridView = gridView;
window.dataProvider = dataProvider;