@nodeject/ui-components/esm/lists/DragDropList.js

UI library for non-trivial components

import * as React from 'react';
import { VariableSizeList as List } from 'react-window';
import * as styles from './VirtualList.module.less';
var itemCount = 145;
// These row heights are arbitrary.
// Yours should be based on the content of the row.
var rowSizes = new Array(itemCount).fill(true).map(function () { return 25 + Math.round(Math.random() * 50); });
var getItemSize = function (index) {
    return rowSizes[index];
};
var Row = function (_a) {
    var data = _a.data, index = _a.index, style = _a.style;
    return (React.createElement("div", { className: index % 2 ? styles.listItemOdd : styles.listItemEven, style: style },
        "Row ",
        index));
};
var test = function (index) {
};
export var DragNDropList = function (props) {
    var data = props.data;
    return (React.createElement("div", { className: styles.list, style: { width: '300px' } },
        React.createElement(List, { height: 500, itemCount: data.itemIds.length, itemData: data, estimatedItemSize: 40, itemSize: getItemSize, width: '100%' }, Row)));
};