How to use the react-virtualized/dist/commonjs/CellMeasurer.CellMeasurerCache function in react-virtualized

To help you get started, we’ve selected a few react-virtualized examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github uber / baseweb / src / table / examples.js View on Github external
'London No. 1 Anywhere London No. 1 Anywhere London No. 1 Anywhere London No. 1 Anywhere London No. 1 Anywhere London No. 1 Anywhere London No. 1 Anywhere',
  ],
  ['4', 'Jane', 'Red', 34, 'London No. 1 Anywhere'],
  ['4', 'Jane', 'Red', 34, 'London No. 1 Anywhere'],
  ['4', 'Jane', 'Red', 34, 'London No. 1 Anywhere'],
  ['4', 'Jane', 'Red', 34, 'London No. 1 Anywhere'],
  ['4', 'Jane', 'Red', 34, 'London No. 1 Anywhere'],
  ['4', 'Jane', 'Red', 34, 'London No. 1 Anywhere'],
].map(row => [`${row[1]} ${row[2]}`, row[3], row[4]]); // selects data to display

const DATA = data
  .concat(data)
  .concat(data)
  .concat(data);

const cache = new CellMeasurerCache({
  defaultHeight: 36,
});

const FullHeight = styled('div', {height: '100%'});

// eslint-disable-next-line flowtype/no-weak-types
function Virtual(props: any) {
  return (
    
      
        {props.columns.map((column, index) => (
          {column}
        ))}
github olymp / olymp / cms / cloudinary / views / gallery.es6 View on Github external
constructor(props) {
    super(props);

    this.columnCount = 0;
    this.columnHeights = {};
    this.cache = new CellMeasurerCache({
      defaultHeight: columnHeight,
      defaultWidth: columnWidth,
      fixedWidth: true,
    });
  }
github olymp / olymp / _ / cms / cloudinary / views / gallery.js View on Github external
_AutoSizer2.default,
        {
          selection: selection,
          disableHeight: useBodyScroll,
          height: height,
          overscanByPixels: overscanByPixels,
          onResize: _this.onResize,
          scrollTop: scrollTop
        },
        _this.renderMasonry
      );
    };

    _this.columnCount = 0;
    _this.columnHeights = {};
    _this.cache = new _CellMeasurer.CellMeasurerCache({
      defaultHeight: columnHeight,
      defaultWidth: columnWidth,
      fixedWidth: true
    });
    return _this;
  }
github facebookarchive / atom-ide-ui / modules / nuclide-commons-ui / ScrollableResults.js View on Github external
constructor(props: Props) {
    super(props);
    this.state = {
      collapsed: new Map(),
      collapseNew: false,
      grep: null,
      grepInvert: false,
    };
    this.disposables = new UniversalDisposable();
    this._measurementCache = new CellMeasurerCache();
  }
github uber / baseweb / documentation-site / examples / table / virtual-horizontal-scroll.tsx View on Github external
['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
];

const COLUMNS = ['Name', 'Age', 'Address'];

const WIDTH = 1000;

const cache = new CellMeasurerCache({
  defaultHeight: 36,
  fixedHeight: true,
});

export default () => {
  const [css] = useStyletron();
  return (
    <div>
      
        
          {COLUMNS.map((column, index) =&gt; (
            </div>
github uber / baseweb / documentation-site / examples / table / virtual-horizontal-scroll.js View on Github external
['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
];

const COLUMNS = ['Name', 'Age', 'Address'];

const WIDTH = 1000;

const cache = new CellMeasurerCache({
  defaultHeight: 36,
  fixedHeight: true,
});

export default () =&gt; {
  const [css] = useStyletron();
  return (
    <div>
      
        
          {COLUMNS.map((column, index) =&gt; (
            </div>
github uber / baseweb / documentation-site / examples / table / virtual.js View on Github external
['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
];

const COLUMNS = ['Name', 'Age', 'Address'];

const cache = new CellMeasurerCache({
  defaultHeight: 36,
  fixedWidth: true,
});

export default () =&gt; {
  const [css] = useStyletron();
  return (
    <div>
      
        
          {COLUMNS.map((column, index) =&gt; (
            </div>
github uber / baseweb / documentation-site / examples / table / virtual.tsx View on Github external
['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
  ['Sarah Brown', 31, '100 Broadway st. New York City, New York'],
  ['Jane Smith', 32, '100 Market st. San Francisco, California'],
  ['Joe Black', 33, '100 Macquarie st. Sydney, Australia'],
];

const COLUMNS = ['Name', 'Age', 'Address'];

const cache = new CellMeasurerCache({
  defaultHeight: 36,
  fixedWidth: true,
});

export default () =&gt; {
  const [css] = useStyletron();
  return (
    <div>
      
        
          {COLUMNS.map((column, index) =&gt; (
            </div>