DataPanel

A React component for displaying table data (with lot of built in features)

<DataPanel 
  items="!ItemType[]"
  expandedItems="?Set<Id>"
  selectedItems="?Set<Id>"
  highlightedItems="?Maybe<Set<Id>>"
  highlightIdAccessor="?Function"
  onHighlightEnd="?Function"
  pending="?Boolean"
  updating="?Boolean"
  className="?" 
  style="?"
>

  <Heading className="?" style="?" titleClass="?" titleStyle="?">Panel title</Heading>

  <NoItemsMessage>No items.</NoItemsMessage>

  <CustomComponent component="React.Component" props="?Object" showIfNoItems="?Boolean"></CustomComponent>

  <Toolbar className="?" showIfNoItems="?Boolean" style="?">
    <Action onClick="!Function" className="?" disabled="?Boolean" showIfNoItems="?Boolean" style="?">Action text</Action>
    …
    <ActionGroup bsSize="?Sizes" className="?" label="?String" style="?">
      <Action … >
      <Action … >
    </ActionGroup>
    …
    <Dropdown title="!String" className="?" selectActions="?Boolean" style="?">
      <Action onClick="!Function" className="?" disabled="?Boolean" style="?">Action text</Action>
      <Divider />
      <Action … >
      …
    </Dropdown>
    …
    <FiltersDropdown buttonClass="?String" noFilterText="?String" className"?" style="?">
      <Filter active="?Boolean" disabled="?Boolean" filterKey="?String" glyph="?String" label="!String" predicate="!Function" />
    </FiltersDropdown>
    …
    <AsyncFiltersDropdown buttonClass="?String" noFilterText="?String" onReset"!Function" className"?" style="?">
      <AsyncFilter active="!Boolean" disabled="?Boolean" glyph="?String" label="!String" onFilter="!Function" />
    </AsyncFiltersDropdown>
    …
    <FiltersGroup>
      <Filter active="?Boolean" disabled="?Boolean" filterKey="?String" label="!String" predicate="!Function" />
    </FiltersGroup>
    …
    <DataPaginationNav className="?" onAsyncPageChange="?Function" style="?" />
    <Search className="?" expandable="?Boolean" style="?" />
  </Toolbar>

  <DataTable onSort="?Function" sortInfo="?SortInfo" striped="?Boolean" title="?String">
    <[*]Column className="?" header="!String" headerClassName="?" headerColSpan="?Number" hideHeader="?Boolean" style="?CSSProperties" />

    <SelectColumn idAccessor="?Function" onSelect="?Function" header="?String(Select)" />
    <ActionColumn glyph="?String" linkTo="?Function" onClick="?Function" />
    <Column cell="!Function" getAsyncSortOrder="?Function" onAsyncSort="?Function" sortBy="?Function|Function[]" searchBy="?Function" defaultSort="?String" />
    <FilterColumn getShortText="!Function" getText="!Function" sortBy="?Function|Function[]" />
    <SelectColumn idAccessor="?Function" />
    <ExpandColumn renderExpandedRow="?Function" />

    <NoFilteredItemsMessage>No filtered items.</NoFilteredItemsMessage>

  </DataTable>

  <DataPagination availableLimits="?Array(5, 10, 50)" initialLimit="?Number(10)" className="?" onAsyncLimitChange"?Function" pagination="?BasicPagination" style="?" />

</DataPanel>