oliviertassinari

oliviertassinari

Features	react-data-grid	react-table	material-table	hand-sontable	ag-gird	antd	Kendo	Syncfusion	datatables.net
Stars	3.5k	7k	1k	12k					6k
Downloads	280k	1.1m	90k	190k	400k		33k	5k	550k
Bundle size	40kB	11kB	85kB	315kB	250kB		20kB	425kB	56kB
Docs traffic				95k	230k				1.3m
Row sorting	free	free	free	💰	free	free	💰	💰	free
Filtering	free	free	free	💰	free	free	💰	💰	free
Cell editing	free	free	free	💰	free	free	💰	💰	💰
Column with groups		free		💰	free	free	💰	💰	free

oliviertassinari

import React from "react";
import styled, { ThemeProvider } from "styled-components";
import { style, typography } from "@material-ui/system";

const variant = style({
  prop: "variant",
  cssProperty: false,
  themeKey: "typography"
});

oliviertassinari

import React from "react";
import Grid from "@material-ui/core/Grid";
import Paper from "@material-ui/core/Paper";
import Avatar from "@material-ui/core/Avatar";
import Divider from "@material-ui/core/Divider";
import CssBaseline from "@material-ui/core/CssBaseline";
import SignalWifiOffIcon from "@material-ui/icons/SignalWifiOff";
import Typography from "@material-ui/core/Typography";
import Button from "@material-ui/core/Button";
import { unstable_Box as Box } from "@material-ui/core/Box";

oliviertassinari

import { palette, spacing, typography } from '@material-ui/system';
import styled from 'styled-components';

const Box = styled.div`${palette}${spacing}${typography}`;
// or import { unstable_Box as Box } from '@material-ui/core/Box';

<Box
  color="primary.main"
  bgcolor="background.paper"
  fontFamily="h6.fontFamily"

oliviertassinari

import React from "react";
import { makeStyles } from "@material-ui/styles";
import Grid from "@material-ui/core/Grid";
import CssBaseline from "@material-ui/core/CssBaseline";
import Paper from "@material-ui/core/Paper";
import Avatar from "@material-ui/core/Avatar";
import Divider from "@material-ui/core/Divider";
import SignalWifiOffIcon from "@material-ui/icons/SignalWifiOff";
import Typography from "@material-ui/core/Typography";
import Button from "@material-ui/core/Button";

oliviertassinari

import warning from 'warning'

const times = new Map()

const implementations = {
  mark: {
    start: name => {
      times.set(name, performance.now())
      performance.mark(`metric_${name}_start`)
    },

oliviertassinari

import React from 'react';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';

class RootRef extends React.Component {
  componentDidMount() {
    this.props.rootRef(ReactDOM.findDOMNode(this))
  }

  componentWillUnmount() {

oliviertassinari

import React from 'react';
import classNames from 'classnames';
import PropTypes from 'prop-types';

function stylifier(higherOrderComponent) {
  return Component => styles => {
    function StyledComponent(props) {
      const { classes, className, ...other } = props;
      return <Component className={classNames(classes.root, className)} {...other} />;
    }

oliviertassinari

// @flow weak

function now() {
  return +new Date(); // timestamp in  ms
}

// Count the number of events sent over the last period of time.
const count = {
  minute: {
    slot: 0,