anchor.diff:  [classname]#ExternalResource# are currently supported for images in
   [classname]#Grid#.
   
  -ifdef::web[]
   +
   [source, java]
   ----
  
positive.code:     new Person("Johannes Kepler", 1571));
  
  // Create a grid bound to the list
  Grid<Person> grid = new Grid<>(people);
  grid.addColumn("Name", Person::getName);
  grid.addColumn("Year of birth", Person::getBirthYear);
  layout.addComponent(grid);
  ----
  
  In addition to list you can pass items individually:
  
  [source, java]
  ----
  grid.setItems(new Person("Nicolaus Copernicus", 1543),
                new Person("Galileo Galilei", 1564));
  ----
  
  Note that you can not use [methodname]#addRow()# to add items if the container
  is read-only or has read-only columns, such as generated columns.
  
  
  
  [[components.grid.selection]]
  == Handling Selection Changes
  
  Selection in [classname]#Grid# is handled a bit differently from other selection
  components, as it is not an [classname]#AbstractSelect#. Grid supports both
  single and multiple selection, defined by the __selection model__. Selection
  events can be handled with a [interfacename]#SelectionListener#.
  
  [[components.grid.selection.mode]]
  === Selection Models
  
  A [classname]#Grid# can be set to be in [literal]#++SINGLE++# (default),
  [literal]#++MULTI++#, or [literal]#++NONE++# selection mode, defined in the
  [interfacename]#SelectionMode# enum.
  
  
  [source, java]
  ----
  // Use single-selection mode (default)
  grid.setSelectionMode(SelectionMode.SINGLE);
  ----
  
  Empty (null) selection is allowed by default, but can be disabled
  with [methodname]#setDeselectAllowed()# in single-selection mode.
  
  [source, java]
  ----
  // Pre-select 3rd item from the person list
  grid.select(personList.get(2));
  
  ----
  
  
  [[components.grid.selection.single]]
  === Handling Selection
  
  Changes in the selection can be handled with a
  [interfacename]#SelectionListener#. You need to implement the
  [methodname]#select()# method, which gets a [classname]#SelectionEvent# as
  parameter. In addition to selection, you can handle clicks on rows or cells with
  a [interfacename]#CellClickListener#.
  
  You can get the new selection from the selection event with
  [methodname]#getSelected()#, which returns a set of items, or more simply
  from the grid.
  
  For example:
  
  [source, java]
  ----
  grid.addSelectionListener(selectionEvent -> {
      // Get selection from the selection model
      Collection<Person> selectedPersons =
          selectionEvent.getSelected();
      if (!selectedPersons.isEmpty())
          Notification.show("Selected " + selectedPersons);
      else
          Notification.show("Nothing selected");
  });
  ----
  
  The current selection can be obtained from the [classname]#Grid# object by
  [methodname]#getSelectedItem()# or [methodname]#getSelectedItems()#, which return
  one (in single-selection mode) or all (in multi-selection mode) selected items.
  
  
  [WARNING]
  ====
  If you change the data source for a grid, it will clear the selection. To keep
  the previous selection you must reset the selection afterwards using the
  [methodname]#select()# method.
  ====
  
  [[components.grid.selection.multi]]
  === Multiple Selection
  
  In the multiple selection mode, a user can select multiple items by clicking on
  the checkboxes in the leftmost column, or by using the kbd:[Space] to select/deselect the currently focused row.
  Space bar is the default key for toggling the selection, but it can be customized.
  
  [[figure.components.grid.selection.multi]]
  .Multiple Selection in  [classname]#Grid#
  image::img/grid-selection-multi.png[width=50%, scaledwidth=75%]
  
  You can use [methodname]#select()# to add items to the selection.
  
  
  [source, java]
  ----
  // Grid in multi-selection mode
  Grid<Person> grid = Grid<>(personList)
  grid.setSelectionMode(SelectionMode.MULTI);
  
  // Items 2-4
  personList.subList(2,3).forEach(grid::select);
  
  ----
  
  The current selection can be read with [methodname]#getSelected()#
  in the [classname]#Grid#.
  
  
  [source, java]
  ----
  // Allow deleting the selected items
  Button delSelected = new Button("Delete Selected", e -> {
      // Delete all selected data items
      for (Person person: selection.getSelected())
          personList.remove(person);
  
      // Disable after deleting
      e.getButton().setEnabled(false);
  
      // Reset grid content from the list
      grid.setItems(personList);
  });
  delSelected.setEnabled(!grid.getSelected().isEmpty());
  ----
  
  Changes in the selection can be handled with a
  [interfacename]#SelectionListener#. The selection event object provides
  [methodname]#getAdded()# and [methodname]#getRemoved()# to allow determining the
  differences in the selection change.
  
  
  [source, java]
  ----
  // Handle selection changes
  grid.addSelectionListener(selection -> { // Java 8
      Notification.show(selection.getAdded().size() +
                        " items added, " +
                        selection.getRemoved().size() +
                        " removed.");
  
      // Allow deleting only if there's any selected
      deleteSelected.setEnabled(
           grid.getSelectedRows().size() > 0);
  });
  ----
  
  
  
negative.code: 
      });
      cell.setComponent(filterField);
  }
  ----
  ////
  
  
  [[components.grid.sorting]]
  == Sorting
  