All Versions
96
Latest Version
Avg Release Cycle
42 days
Latest Release
1400 days ago

Changelog History
Page 8

  • v1.1.0-beta.3 Changes

    March 07, 2018

    ๐Ÿ› Bug Fixes

    • react-grid-bootstrap4: fix the 'Nothing to show' message (#816) (34167bb)
    • react-grid-bootstrap4: get rid cursor poiner on disabled item (#799) (1d59052)

    ๐Ÿ”‹ Features

    • react-grid: add search panel plugin (#726) (c8e79fb)
    • react-grid: extract the Table plugin components (#766) (e626a66)
    • react-grid: support center alignment for columns (#804) (209d1c9)
  • v1.1.0-beta.2 Changes

    March 02, 2018

    ๐Ÿ› Bug Fixes

    • react-grid: fix empty message styles (#776) (f814360)

    ๐Ÿ”‹ Features

    • react-grid-bootstrap4: support the bootstrap4 theme (#681) (c3d58f0)
  • v1.1.0-beta.1 Changes

    February 22, 2018

    ๐Ÿ› Bug Fixes

    • react-grid: allow adding custom styles to some components (#728) (7580410)
    • react-grid: fix reordering after grouping (#744) (4de38d7)
    • react-grid-bootstrap3: repair column chooser positioning (#740) (4c4ed15)
    • ๐Ÿ’ป react-grid-material-ui: remove PagingPanel's border-top (#751) (353e486)

    ๐Ÿ”‹ Features

    • react-grid: add the ability to prevent column filtering (#702) (f3d3f10)
    • react-grid: add the ability to prevent column visibility toggling (#705) (2cdfe06)
    • react-grid: add the ability to prevent editing by a column (#729) (3c88c4c)
    • react-grid: add the ability to sort/group by the particular column (#692) (b5d0e2f)
    • react-grid: add TypeScript definitions (#710) (7dfc052)
  • v1.0.3 Changes

    March 02, 2018

    ๐Ÿ› Bug Fixes

    • react-grid: fix incorrect initial options handling (#797) (1220664)
    • react-grid: make EditingState pure (#796) (b409c11)
  • v1.0.2 Changes

    March 01, 2018
    • react-grid: rework controlled mode (#779) (a412dda), closes #762
    • ๐Ÿ’ป react-grid-material-ui: update material-ui and material-ui-icons version to 1.0.0-beta.35 (#784) (d96b1be)
  • v1.0.1 Changes

    February 16, 2018

    ๐Ÿ› Bug Fixes

    • react-grid: calculate visible rows when rendering VirtualTable (#749) (424a48c), closes #748
    • react-grid: fix hidden tall rows in VirtualTable (#747) (dc02bd5), closes #745
    • ๐Ÿ’ป react-grid-material-ui: update material-ui version to 1.0.0-beta.33 (#750) (4bf8810)
  • v1.0.0 Changes

    February 02, 2018

    ๐Ÿ”จ Code Refactoring

    • react-core: rename PluginContainer to Plugin (#712) (30734d8)
    • react-grid: rename expanded details getter (#713) (771eb3f)

    ๐Ÿ’ฅ BREAKING CHANGES

    • react-core: The PluginContainer component has been renamed to Plugin.
    • react-grid: The expandedRowIds getter of the RowDetailState plugin has been renamed to expandedDetailRowIds.
  • v1.0.0-rc.2 Changes

    January 26, 2018

    ๐Ÿ› Bug Fixes

    • react-core: fix crash when using with webpack-dev-server and Hot Module Reloading (#694) (bdc944b)
    • react-grid-bootstrap3: align header and data cell texts (#687) (b34f142)
    • react-grid-bootstrap3: correct grouping icon alignment (#686) (fb30cc3)
    • ๐Ÿ’ป react-grid-material-ui: use long paths for modules (#684) (b32f79c)
  • v1.0.0-rc.1 Changes

    January 18, 2018

    ๐Ÿ› Bug Fixes

    • react-core: clear text selection when dragging (#669) (b7c2eac)
    • react-grid: display empty message when all data columns are hidden (#670) (44d7622)
    • react-grid: set higher precedence to props in state plugins (#663) (bb5ef97), closes #662
    • react-grid: update render component in correct lifecycle hook (#655) (c56ff88), closes #649
    • react-grid-bootstrap3: repair keyboard navigation in column chooser (#666) (7f2b461)
    • ๐Ÿ’ป react-grid-material-ui: disable ripple on active page button (#682) (c75078d)
    • ๐Ÿ’ป react-grid-material-ui: import 'VisibilityOff' icon from separate file (#640) (7b71ebc)

    ๐Ÿ”จ Code Refactoring

    • react-grid: change columnWidth type from object to array (#613) (6f4d19f)
    • react-grid: change the 'expandedGroups' Getter data type (#661) (f078d3a)
    • react-grid: change the 'selection' Getter data type (#656) (262d169)
    • react-grid: rename the *hiddenColumns getters and props (#651) (068604d)
    • react-grid: rename the changedRows Getter and dependent properties (#657) (26735c7)
    • react-grid: rename the deletedRows Getter and dependent properties (#652) (ae78d23)
    • react-grid: rename the expandedRows Getter and dependent properties (#653) (db56cad)
    • react-grid: rename the groupByColumn action to changeColumnGrouping (#660) (a3974bd)
    • react-grid: rename the setColumnFilter action to changeColumnFilter (#659) (eec6c41)
    • react-grid: rename the setColumnSorting action to changeColumnSorting (#658) (e4f9c12)
    • react-grid: rename the setDetailRowExpanded action (#648) (1285a14)
    • react-grid: standardize draft change actions in GroupingState (#668) (43593eb)
    • react-grid: standardize draft change actions in TableColumnResizing (#665) (3fec37a)
    • react-grid: use the 'state' name as a parameter in toggle actions (#645) (6c3f15d)
    • react-grid: rename the EditingState plugin properties (#650) (4d7fe82)

    ๐Ÿ’ฅ BREAKING CHANGES

    • react-grid: The draftGrouping getter does not contain information about draft mode anymore. The draftGroupingChange, and cancelGroupingChange actions have been renamed to draftColumnGrouping, and cancelColumnGroupingDraft.
    • react-grid: The type of the TableColumnResizing plugin's columnWidths and defaultColumnWidths properties has been changed from object to array to improve API consistency.

    Before:

      <Grid>
        <TableColumnResizing columnWidths={{ a: 120 }} />
      </Grid>
    

    After:

      <Grid>
        <TableColumnResizing columnWidths={[{ columnName: a, width: 120 }]} />
      </Grid>
    
    • react-grid: The changeDraftTableColumnWidth action has been renamed to draftTableColumnWidth. The functionality that resets draft column width has been moved from from the draftTableColumnWidth action into the separate cancelTableColumnWidthDraft action.

    The onDraftWidthChange event of the TableHeaderRow's cellComponent has been renamed to onWidthDraft. The functionality that cancels draft width changes has been extracted to the onWidthDraftCancel event.

    • react-grid: The the GroupingState plugin's groupByColumn action has been renamed to changeColumnGrouping.
    • react-grid: We changed the selection getter's data type from Set to Array to improve the API consistency.
    • react-grid: We renamed the following TableColumnVisibility plugin's properties to improve the API consistency:

      • hiddenColumns => hiddenColumnNames
      • defaultHiddenColumns => defaultHiddenColumnNames
      • onHiddenColumnsChange => onHiddenColumnNamesChange

    The hiddenColumns getter has been renamed to hiddenColumnNames.

    • react-grid: The following RowDetailState plugin's properties have been renamed to improve the API consistency:

      • expandedRows => expandedRowIds
      • defaultExpandedRows => defaultExpandedRowIds
      • onExpandedRowsChange => onExpandedRowIdsChange

    The expandedRows getter has been renamed to expandedRowIds.

    • react-grid: The following EditingState plugin's properties have been renamed to improve the API consistency:

      • changedRows => rowChanges
      • defaultChangedRows => defaultRowChanges
      • onChangedRowsChange => onRowChangesChange

    The changedRows getter has been renamed to rowChanges.

    • react-grid: The FilteringState plugin's setColumnFilter action has been renamed to changeColumnFilter.
    • react-grid: The RowDetailState plugin's setDetailRowExpanded action has been renamed to toggleDetailRowExpanded.
    • react-grid: The toggleSelection action's selected parameter has been renamed to state.
    • react-grid: We changed the expandedGroups getter's data type from Set to Array to improve the API consistency.
    • react-grid: The following EditingState plugin's properties have been renamed to improve the API consistency:

      • deletedRows => deletedRowIds
      • defaultDeletedRows => defaultDeletedRowIds
      • onDeletedRowsChange => onDeletedRowIdsChange
      • editingRows => editingRowIds
      • defaultEditingRows => defaultEditingRowIds
      • onEditingRowsChange => onEditingRowIdsChange

    The deletedRows getter has been renamed to deletedRowIds. The editingRows getter has been renamed to editingRowIds.

    • react-grid: The SortingState plugin's setColumnSorting action has been renamed to changeColumnSorting.
  • v1.0.0-beta.3 Changes

    December 28, 2017

    ๐Ÿ› Bug Fixes

    • grid-core: fix blinks when reordering group items (#573) (739c664)
    • react-grid: correct state helper & editing state (#623) (3cd07bd)
    • react-grid: fix blinks when reordering header-cell items (#590) (e94b824)
    • react-grid: fix incorrect applying of several actions in a batch (#560) (7c3ff9b), closes #549
    • react-grid: remove outline from header cell when mouse click (#576) (807597b)
    • ๐Ÿ’ป react-grid-material-ui: add border beetwin rows and pager panel (#622) (d7cb9c7)
    • ๐Ÿ’ป react-grid-material-ui: use theme constant in the table header background (#602) (797e134)

    ๐Ÿ”จ Code Refactoring

    • react-grid: add the toolbar (#585) (70fdc25)
    • react-grid: cancel column sorting by passing null to the direction argument (#620) (3abe8f9)
    • react-grid: extract table column extension (#586) (7f57be2)
    • react-grid: get rid of explicit column resizing enabling (#597) (f215103)
    • react-grid: get rid of explicit dragging enabling (#583) (60797c2)
    • react-grid: give column properties greater precedence (#617) (4a2924c)
    • react-grid: remove totalCount property from PagingState to CustomPaging (#555) (95fe97d)
    • react-grid: rename data processing plugins (#612) (468dde4)
    • react-grid: rename DragDropContext to DragDropProvider (#611) (26d303e)
    • react-grid: rename properties from allow* to *Enabled (#618) (6c291e8)
    • react-grid: rename some group and paging properties (#581) (6300249)
    • react-grid: specify typed columns directly in DataTypeProvider (#591) (6ed28e4)
    • react-grid: swap args in the createRowChange function (#619) (1178ee1)
    • react-grid: switch to column extensions in EditingState (#604) (d56b3f0)
    • react-grid: switch to column extensions in LocalFiltering (#594) (955da48)
    • react-grid: switch to column extensions in LocalGrouping (#601) (9efc007)
    • react-grid: switch to column extensions in LocalSorting (#603) (08c96da)
    • react-grid: switch to column extensions in TableGroupRow (#609) (373d4d8)

    ๐Ÿ”‹ Features

    • react-grid: add the ColumnChooser plugin (#607) (16eb588)

    ๐Ÿ’ฅ BREAKING CHANGES

    • react-grid: We have moved the PagingState plugin's totalCount property to the CustomPaging plugin to improve API consistency. Now, you can add the CustomPaging plugin to a project and specify its totalCount property to implement remote paging.

    Before:

      <Grid>
        <...>
        <PagingState totalCount={10} />
      </Grid>
    

    After:

      <Grid>
        <...>
        <PagingState />
        <CustomPaging totalCount={10} />
      </Grid>
    
    • react-grid: To simplify working and make consistent API, some plugins properties have been renamed.
      • The TableHeaderRow plugin's allowGroupingByClick property has been renamed to showGroupingControls.
      • The GroupingPanel plugin's allowUngroupingByClick property has been renamed to showGroupingControls.
      • The PagingPanel plugin's allowedPageSizes property has been renamed to pageSizes.
    • react-grid: A column's getCellValue function has gotten higher priority than that defined in the Grid component.
    • react-grid: The createRowChange function arguments order has been changed to (row: any, value: any, columnName: string) to improve the API consistency. Now, the EditingState plugin's createRowChange function has the same signature as the column extension's one.
    • react-grid: We have renamed the following plugins that process data to make the Grid API more consistent:

      • LocalFiltering => IntegratedFiltering
      • LocalGrouping => IntegratedGrouping
      • LocalPaging => IntegratedPaging
      • LocalSelection => IntegratedSelection
      • LocalSorting => IntegratedSorting
    • react-grid: We removed the LocalSorting plugin's getColumnIdentity property to improve API consistency. Now, use the column extension's criteria property to specify an individual column's grouping criteria.

    Before:

      const columns = [{ name: 'field' }, { name: 'field2' }];
      const fieldGroupCriteria = /* custom group criteria */;
      const getColumnIdentity = (columnName) => {
        if (name === 'field') return fieldGroupCriteria;
      };
    
      <Grid columns={columns}>
        <LocalGrouping getColumnIdentity={getColumnIdentity} />
      </Grid>
    

    After:

      const columns= [{ name: 'field' }, { name: 'field2' }];
      const fieldGroupCriteria = /* custom group criteria */;
      const integratedGroupingColumnExtensions = [
        { columnName: 'field', criteria: fieldGroupCriteria },
      ];
    
      <Grid columns={columns}>
        <IntegratedGrouping columnExtensions={integratedGroupingColumnExtensions} />
      </Grid>
    
    • react-grid: We removed the cancel argument from the SortingState plugin's setColumnSorting action and from the onSort event of the TableHeaderCellProps and GroupPanelItemProps component properties. Now, you can pass null to the direction argument to cancel sorting by column.
    • react-grid: The TableHeaderCellProps interface's allowResizing property has been renamed to resizingEnabled to improve the API consistency.
    • react-grid: We removed the getColumnCompare property from the LocalSorting plugin to improve API consistency. Now, use the columnExtension property to specify individual column sorting options.

    Before:

      const columns = [{ name: 'field' }, { name: 'field2' }];
      const fieldCompare = /* custom sort compare */;
      const getColumnCompare = (columnName) => {
        if (name === 'field') return fieldCompare;
      };
    
      <Grid columns={columns}>
        <LocalSorting getColumnCompare={getColumnCompare} />
      </Grid>
    

    After:

      const columns= [{ name: 'field' }, { name: 'field2' }];
      const fieldCompare = /* custom sort compare */;
      const integratedSortingColumnExtensions = [
        { columnName: 'field', compare: fieldIdentity },
      ];
    
      <Grid columns={columns}>
        <IntegratedSorting columnExtensions={integratedSortingColumnExtensions} />
      </Grid>
    
    • react-grid: We have integrated the column chooser into the Grid as a plugin to simplify the API. Now, use the column chooser as follows:
      <Grid>
        {/* ... */}
        <TableColumnVisibility
          /* props */
        />
        <Toolbar />
        <ColumnChooser />
      </Grid>
    

    For details, see Controlling Column Visibility.

    • react-grid: We extracted the column's showWhenGrouped property that the TableGroupRow plugin handles to a column extension to improve the API readability. The TableGroupRow plugin's showColumnsWhenGrouped property type has been changed to boolean and this property affects all columns. If you need to control specific columns' visibility, use column extensions.

    Before:

      const columns = [{ name: 'field', showWhenGrouped: true }, { name: 'field2' }];
    
      <Grid columns={columns}>
        <TableGroupRow />
      </Grid>
    

    After:

      const columns= [{ name: 'field' }, { name: 'field2' }];
      const tableGroupColumnExtensions = [
        { columnName: 'field', showWhenGrouped: true },
      ];
    
      <Grid columns={columns}>
        <TableGroupRow columnExtensions={tableGroupColumnExtensions} />
      </Grid>
    

    Note that column extension properties have higher priority than corresponding plugin properties.

    • react-grid: We renamed the DragDropContext plugin to DragDropProvider to improve API consistency.
    • react-grid: We removed the allowResizing property from the TableHeaderRow plugin to simplify the API. Now, adding the TableColumnResizing plugin enables column resizing.
    • react-grid: In order to improve API readability, we extracted the width and align column properties that the Table and VirtualTable plugins handle into a separate property. Now, the width and align properties in the Grid columns are no longer supported. Use a TableColumnExtension instead:

    Before:

      const columns= [{ name: 'field', width: 100 }, { name: 'field2' }];
    
      <Grid columns={columns}>
        <Table />
      </Grid>
    

    After:

      const columns= [{ name: 'field1' }, { name: 'field2' }];
      const tableColumnExtensions = [{ columnName: 'field1', width: 100 }];
    
      <Grid columns={columns}>
        <Table columnExtensions={tableColumnExtensions} />
      </Grid>
    
    • react-grid: In order to simplify API, we changed the way the DataTypeProvider plugin detects columns associated with a type. Now, to associate a custom formatter and editor with a column, pass a column array to the DataTypeProvider's for field:

    Before:

      const columns= [{ name: 'field', dataType: 'boolean' }, { name: 'field2' }];
    
      <Grid columns={columns}>
        <DataTypeProvider type="boolean" />
      </Grid>
    

    After:

      const columns= [{ name: 'field1' }, { name: 'field2' }];
      const booleanColumns = ['field1'];
    
      <Grid columns={columns}>
        <DataTypeProvider for={booleanColumns} />
      </Grid>
    
    • react-grid: In order to improve API consistency, we've decided to replace the getColumnPredicate function in the LocalFiltering plugin with the LocalFilteringColumnExtension.

    Before:

      const columns = [{ name: 'field' }, { name: 'field2' }];
      const fieldPredicate = /* custom filtering predicate */;
      const getColumnPredicate = (columnName) => {
        if (name === 'field') return fieldPredicate;
      };
    
      <Grid columns={columns}>
        <LocalFiltering getColumnPredicate={getColumnPredicate} />
      </Grid>
    

    After:

      const columns= [{ name: 'field' }, { name: 'field2' }];
      const fieldPredicate = /* custom filtering predicate */;
      const integratedFilteringColumnExtensions = [
        { columnName: 'field', predicate: fieldPredicate },
      ];
    
      <Grid columns={columns}>
        <IntegratedFiltering columnExtensions={integratedFilteringColumnExtensions} />
      </Grid>
    
    • react-grid: In order to simplify API, we've decided to remove allowDragging properties in TableHeaderRow and GroupingPanel plugins. Now, to enable dragging it is enough to add the DragDropContext plugin.
    • react-grid: ย  ๐Ÿ”Œ To provide a more convenient and flexible way to render elements that are placed within a Grid header we add the Toolbar plugin. For this reason, the GroupingPanel plugin has the Toolbar dependency: ย  ```js import { // ... Toolbar, GroupingPanel } from '@devexpress/dx-react-grid-material-ui';

    {/* ... */}

      ย 
      To simplify Grid's markup we removed header placeholder and footer placeholder components.
      If you're customizing Grid appearance using the `headerPlaceholderComponent` and `footerPlaceholderComponent` properties, your code should be updated as follows:
      ย 
      Before:
    
      ```js
      <Grid
        headerPlaceholderTemplate={() => (<div />)}
        footerPlaceholderTemplate={() => (<div />)}
      >
      {/* ... */}
      </Grid>
    

    After:

      import { Template, TemplatePlaceholder } from '@devexpress/dx-react-core';
    
      <Grid>
        <Template name="header">
          <TemplatePlaceholder />
          {/* Custom markup */}
        </Template>
        <Template name="footer">
          <TemplatePlaceholder />
          {/* Custom markup */}
        </Template>
        {/* ... */}
      </Grid>
    
    • react-grid: We extracted the column's createRowChange property that the EditingState plugin handles to a column extension to improve API readability.

    Before:

      const columns = [{ name: 'field', createRowChange: (row, value) => { /* logic */ } }, { name: 'field2' }];
    
      <Grid columns={columns}>
        <EditingState />
      </Grid>
    

    After:

      const columns= [{ name: 'field' }, { name: 'field2' }];
      const editingColumnExtensions = [
        { columnName: 'field', createRowChange: (row, value) => { /* logic */ } },
      ];
    
      <Grid columns={columns}>
        <EditingState columnExtensions={editingColumnExtensions} />
      </Grid>
    

    Note that column extension properties have higher priority than corresponding plugin properties.