simple-virtual-list/index.js

A simple and basic React virtual list

"use strict";function l(e){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var p=e(require("react"));function u(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(u=function(e){return e?r:t})(e)}function e(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!==l(e)&&"function"!=typeof e)return{default:e};t=u(t);if(t&&t.has(e))return t.get(e);var r,n,o={},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&((n=i?Object.getOwnPropertyDescriptor(e,r):null)&&(n.get||n.set)?Object.defineProperty(o,r,n):o[r]=e[r]);return o.default=e,t&&t.set(e,o),o}function y(e,t){return a(e)||i(e,t)||n(e,t)||r()}function r(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function n(e,t){if(e){if("string"==typeof e)return o(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Map"===(r="Object"===r&&e.constructor?e.constructor.name:r)||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?o(e,t):void 0}}function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function i(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i=[],l=!0,u=!1;try{for(r=r.call(e);!(l=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);l=!0);}catch(e){u=!0,o=e}finally{try{l||null==r.return||r.return()}finally{if(u)throw o}}return i}}function a(e){if(Array.isArray(e))return e}var t=function(e){var t=e.datasource,n=e.rowHeight,o=e.itemKey,i=e.renderItem,e=e.display,n=n||21,r=y((0,p.useState)(0),2),l=r[0],u=r[1],a=(0,p.useRef)(),c=(0,p.useRef)();if((0,p.useEffect)(function(){a.current&&(a.current.onscroll=function(e){clearTimeout(c.current),c.current=setTimeout(function(){var e=a.current.scrollTop;u(e)},100)})},[]),!t[0].title&&!e)throw new ReferenceError("title key is not present in few records. please provie display prop if there is no title key in your records");var f=e||"title",s=Math.floor((l-50*n)/n),r=Math.floor((l+50*n)/n),s=s<0?0:s,e=t.slice(s,r);return p.default.createElement("div",{className:"simple-virtual-list-container",ref:a},p.default.createElement("style",null,"\n            .simple-virtual-list-container {\n              height: 100%;\n              overflow: auto;\n              position: relative;\n              border: 1px solid #000;\n            }\n            .simple-virtual-list-container .simple-virtual-list-list-item {\n              position: absolute;\n              width: 100%;\n            }\n          "),p.default.createElement("div",{style:{height:"".concat(t.length*n,"px")}},e.map(function(e,t){var r=s*n+t*n,t=o?e[o]:"key"+(t+1),e=i?i(e):e[f];return p.default.createElement("div",{className:"simple-virtual-list-list-item",key:t,style:{top:"".concat(r,"px")}},e)})))},c=t;exports.default=c;