vanilla-recycler-view
Version:
high performance UI rendering library for web browser
2 lines • 15.4 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.VanillaRecyclerView=t():e.VanillaRecyclerView=t()}(self,(function(){return function(){"use strict";var e={151:function(e,t,r){Object.defineProperty(t,"__esModule",{value:!0});const n=r(655);n.__exportStar(r(29),t),n.__exportStar(r(156),t),n.__exportStar(r(503),t)},156:function(e,t){Object.defineProperty(t,"__esModule",{value:!0}),t.toPx=t.parsePx=void 0,t.parsePx=function(e){return Number(e.split("px")[0])},t.toPx=function(e){return e.toString()+"px"}},29:function(e,t,r){Object.defineProperty(t,"__esModule",{value:!0}),t.VanillaRecyclerView=t.DIRECTION=t.DEFAULT_ITEM_SIZE=void 0,r(520);const n=r(151);var i;t.DEFAULT_ITEM_SIZE=50,function(e){e.VERTICAL="vertical",e.HORIZONTAL="horizontal"}(i=t.DIRECTION||(t.DIRECTION={}));t.VanillaRecyclerView=class{constructor(e,r){this.virtualElements=[],this.mountedVirtualElements=[],this.pendingUnmount=[],this.reusables=[],this.root=e,r.direction?this._direction=r.direction:this._direction=i.VERTICAL,r.preload?this._preload=r.preload:this._preload=t.DEFAULT_ITEM_SIZE,r.size?this._size=r.size:this._size=t.DEFAULT_ITEM_SIZE,this._renderer=r.renderer,this.root.classList.add("recycler_view_root"),this._direction===i.VERTICAL?this.root.classList.add(i.VERTICAL):this._direction===i.HORIZONTAL&&this.root.classList.add(i.HORIZONTAL),this.container=document.createElement("div"),this.container.classList.add("recycler_view_container"),this.setData(r.data),this.root.appendChild(this.container),this.root.addEventListener("scroll",this.onScroll.bind(this)),document.body.addEventListener("zoom",(()=>this.onScroll()))}onScroll(){const{scrollTop:e,scrollLeft:t}=this.root,{height:r,width:o}=this.root.getBoundingClientRect(),a=this.getMaxScrollSize(),s=(()=>{let e=0;switch(this._direction){case i.VERTICAL:e=this.root.clientHeight;break;case i.HORIZONTAL:e=this.root.clientWidth}return a>e?a:e})();let l=0,c=0,u=0;switch(this._direction){case i.VERTICAL:l=e+r,c=e-this._preload,u=e+r+this._preload;break;case i.HORIZONTAL:l=t+o,c=t-this._preload,u=t+o+this._preload}const h=this.virtualElements.filter((e=>e.start>=c&&e.start+e.size<=u)),f=[],p=[];h.forEach((e=>{-1===this.mountedVirtualElements.indexOf(e)?p.push(e):f.push(e)}));this.pendingUnmount.concat(this.mountedVirtualElements.filter((e=>-1===h.indexOf(e)))).forEach((e=>{if(e.isMounted()){const t=e.unmountRenderer();this.reusables.push(t)}})),p.forEach((e=>{const t=(()=>{var t;const r=this.getNextReusable(),n=r&&r.renderer.onMount&&r.renderer.onMount({api:this,data:e.data,index:e.index});return r&&n?r:(null===(t=null==r?void 0:r.wrapperElement.parentElement)||void 0===t||t.removeChild(r.wrapperElement),this.createReusable(e))})();e.mountRenderer(t)})),f.forEach((e=>{e.updatePosition()})),this.reusables.forEach((e=>{var t;let a=0;switch(this._direction){case i.VERTICAL:a=(0,n.parsePx)(e.wrapperElement.style.top)+r;break;case i.HORIZONTAL:a=(0,n.parsePx)(e.wrapperElement.style.left)+o}a>s&&(null===(t=e.wrapperElement.parentElement)||void 0===t||t.removeChild(e.wrapperElement))})),this.pendingUnmount=[],this.mountedVirtualElements=h}getSize(e,t){return"function"==typeof this._size?this._size({api:this,data:t,index:e}):this._size}createReusable(e){const t=document.createElement("div");t.classList.add("recycler_view_item");const r=new this._renderer;r.initialize({api:this,data:e.data,index:e.index});const n=r.getLayout();return t.appendChild(n),{wrapperElement:t,renderer:r}}getNextReusable(){return this.reusables&&this.reusables.length?this.reusables.splice(0,1)[0]:null}setData(e){this.reusables=[],this.pendingUnmount=this.virtualElements.slice(),this.virtualElements=[],this.calculateSize(),this.onScroll(),this.virtualElements=e.map((e=>new n.VirtualElement(this,e))),this.calculateSize(),this.onScroll()}calculateSize(){const e=this.virtualElements.reduce(((e,t,r)=>{const n=this.getSize(r,t.data);return t.setIndex(r),t.setPosition(e,n),e+n}),0);switch(this._direction){case i.VERTICAL:this.container.style.height=(0,n.toPx)(e);break;case i.HORIZONTAL:this.container.style.width=(0,n.toPx)(e);break;default:throw new Error("not supported direction")}}getMaxScrollSize(){switch(this._direction){case i.VERTICAL:return(0,n.parsePx)(this.container.style.height);case i.HORIZONTAL:return(0,n.parsePx)(this.container.style.width)}}splice(e,t){this.pendingUnmount=void 0===t?this.virtualElements.splice(e):this.virtualElements.splice(e,t),this.calculateSize(),this.onScroll()}insert(e,...t){const r=this.virtualElements.slice(0,e),i=this.virtualElements.slice(e),o=t.map((e=>new n.VirtualElement(this,e)));this.virtualElements=[...r,...o,...i],this.calculateSize(),this.onScroll()}push(...e){const t=e.map((e=>new n.VirtualElement(this,e)));this.virtualElements.push(...t),this.calculateSize(),this.onScroll()}}},503:function(e,t,r){Object.defineProperty(t,"__esModule",{value:!0}),t.VirtualElement=void 0;const n=r(151);t.VirtualElement=class{constructor(e,t){this.index=0,this.start=0,this.size=0,this.wrapperElement=null,this.renderer=null,this.parent=e,this.data=t}setPosition(e,t){this.start=e,this.size=t}setIndex(e){this.index=e}updatePosition(){if(!this.wrapperElement)throw new Error("element not mounted");switch(this.parent._direction){case n.DIRECTION.VERTICAL:this.wrapperElement.style.top=(0,n.toPx)(this.start),this.wrapperElement.style.height=(0,n.toPx)(this.size);break;case n.DIRECTION.HORIZONTAL:this.wrapperElement.style.left=(0,n.toPx)(this.start),this.wrapperElement.style.width=(0,n.toPx)(this.size)}}isMounted(){return!!this.renderer&&!!this.wrapperElement}mountRenderer(e){if(this.wrapperElement||this.renderer)throw new Error("reusable already mounted");switch(this.parent._direction){case n.DIRECTION.VERTICAL:e.wrapperElement.style.top=(0,n.toPx)(this.start),e.wrapperElement.style.height=(0,n.toPx)(this.size);break;case n.DIRECTION.HORIZONTAL:e.wrapperElement.style.left=(0,n.toPx)(this.start),e.wrapperElement.style.width=(0,n.toPx)(this.size)}this.wrapperElement=e.wrapperElement,this.renderer=e.renderer,this.wrapperElement.parentElement||this.parent.container.appendChild(this.wrapperElement)}unmountRenderer(){const e=this.renderer,t=this.wrapperElement;if(e&&t)return this.renderer=null,this.wrapperElement=null,e.onUnmount&&e.onUnmount({api:this.parent,data:this.data,index:this.index}),{renderer:e,wrapperElement:t};throw new Error("renderer not mounted")}destroyRenderer(){var e;const t=this.unmountRenderer();null===(e=t.wrapperElement.parentElement)||void 0===e||e.removeChild(t.wrapperElement)}}},607:function(e,t,r){Object.defineProperty(t,"__esModule",{value:!0});const n=r(655),i=r(151);n.__exportStar(r(151),t),t.default=i.VanillaRecyclerView},520:function(){const{width:e,height:t}=document.body.getClientRects()[0];let r=e,n=t;setInterval((()=>{const{width:e,height:t}=document.body.getClientRects()[0];if(e!==r||t!==n){const i=document.createEvent("CustomEvent");i.initCustomEvent("zoom",!1,!1,{detail:{width:e,height:t}}),document.body.dispatchEvent(i),r=e,n=t}}),100)},655:function(e,t,r){r.r(t),r.d(t,{__assign:function(){return o},__asyncDelegator:function(){return b},__asyncGenerator:function(){return E},__asyncValues:function(){return O},__await:function(){return v},__awaiter:function(){return u},__classPrivateFieldGet:function(){return S},__classPrivateFieldIn:function(){return T},__classPrivateFieldSet:function(){return R},__createBinding:function(){return f},__decorate:function(){return s},__exportStar:function(){return p},__extends:function(){return i},__generator:function(){return h},__importDefault:function(){return I},__importStar:function(){return P},__makeTemplateObject:function(){return x},__metadata:function(){return c},__param:function(){return l},__read:function(){return y},__rest:function(){return a},__spread:function(){return m},__spreadArray:function(){return _},__spreadArrays:function(){return w},__values:function(){return d}});var n=function(e,t){return n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])},n(e,t)};function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}n(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}var o=function(){return o=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var i in t=arguments[r])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},o.apply(this,arguments)};function a(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(e);i<n.length;i++)t.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(e,n[i])&&(r[n[i]]=e[n[i]])}return r}function s(e,t,r,n){var i,o=arguments.length,a=o<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,r):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,r,n);else for(var s=e.length-1;s>=0;s--)(i=e[s])&&(a=(o<3?i(a):o>3?i(t,r,a):i(t,r))||a);return o>3&&a&&Object.defineProperty(t,r,a),a}function l(e,t){return function(r,n){t(r,n,e)}}function c(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function u(e,t,r,n){return new(r||(r=Promise))((function(i,o){function a(e){try{l(n.next(e))}catch(e){o(e)}}function s(e){try{l(n.throw(e))}catch(e){o(e)}}function l(e){var t;e.done?i(e.value):(t=e.value,t instanceof r?t:new r((function(e){e(t)}))).then(a,s)}l((n=n.apply(e,t||[])).next())}))}function h(e,t){var r,n,i,o,a={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return o={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function s(o){return function(s){return function(o){if(r)throw new TypeError("Generator is already executing.");for(;a;)try{if(r=1,n&&(i=2&o[0]?n.return:o[0]?n.throw||((i=n.return)&&i.call(n),0):n.next)&&!(i=i.call(n,o[1])).done)return i;switch(n=0,i&&(o=[2&o[0],i.value]),o[0]){case 0:case 1:i=o;break;case 4:return a.label++,{value:o[1],done:!1};case 5:a.label++,n=o[1],o=[0];continue;case 7:o=a.ops.pop(),a.trys.pop();continue;default:if(!(i=a.trys,(i=i.length>0&&i[i.length-1])||6!==o[0]&&2!==o[0])){a=0;continue}if(3===o[0]&&(!i||o[1]>i[0]&&o[1]<i[3])){a.label=o[1];break}if(6===o[0]&&a.label<i[1]){a.label=i[1],i=o;break}if(i&&a.label<i[2]){a.label=i[2],a.ops.push(o);break}i[2]&&a.ops.pop(),a.trys.pop();continue}o=t.call(e,a)}catch(e){o=[6,e],n=0}finally{r=i=0}if(5&o[0])throw o[1];return{value:o[0]?o[1]:void 0,done:!0}}([o,s])}}}var f=Object.create?function(e,t,r,n){void 0===n&&(n=r);var i=Object.getOwnPropertyDescriptor(t,r);i&&!("get"in i?!t.__esModule:i.writable||i.configurable)||(i={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,i)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]};function p(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||f(t,e,r)}function d(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],n=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function y(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,i,o=r.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(e){i={error:e}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function m(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(y(arguments[t]));return e}function w(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;var n=Array(e),i=0;for(t=0;t<r;t++)for(var o=arguments[t],a=0,s=o.length;a<s;a++,i++)n[i]=o[a];return n}function _(e,t,r){if(r||2===arguments.length)for(var n,i=0,o=t.length;i<o;i++)!n&&i in t||(n||(n=Array.prototype.slice.call(t,0,i)),n[i]=t[i]);return e.concat(n||Array.prototype.slice.call(t))}function v(e){return this instanceof v?(this.v=e,this):new v(e)}function E(e,t,r){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var n,i=r.apply(e,t||[]),o=[];return n={},a("next"),a("throw"),a("return"),n[Symbol.asyncIterator]=function(){return this},n;function a(e){i[e]&&(n[e]=function(t){return new Promise((function(r,n){o.push([e,t,r,n])>1||s(e,t)}))})}function s(e,t){try{(r=i[e](t)).value instanceof v?Promise.resolve(r.value.v).then(l,c):u(o[0][2],r)}catch(e){u(o[0][3],e)}var r}function l(e){s("next",e)}function c(e){s("throw",e)}function u(e,t){e(t),o.shift(),o.length&&s(o[0][0],o[0][1])}}function b(e){var t,r;return t={},n("next"),n("throw",(function(e){throw e})),n("return"),t[Symbol.iterator]=function(){return this},t;function n(n,i){t[n]=e[n]?function(t){return(r=!r)?{value:v(e[n](t)),done:"return"===n}:i?i(t):t}:i}}function O(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,r=e[Symbol.asyncIterator];return r?r.call(e):(e=d(e),t={},n("next"),n("throw"),n("return"),t[Symbol.asyncIterator]=function(){return this},t);function n(r){t[r]=e[r]&&function(t){return new Promise((function(n,i){(function(e,t,r,n){Promise.resolve(n).then((function(t){e({value:t,done:r})}),t)})(n,i,(t=e[r](t)).done,t.value)}))}}}function x(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var g=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function P(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&f(t,e,r);return g(t,e),t}function I(e){return e&&e.__esModule?e:{default:e}}function S(e,t,r,n){if("a"===r&&!n)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!n:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?n:"a"===r?n.call(e):n?n.value:t.get(e)}function R(e,t,r,n,i){if("m"===n)throw new TypeError("Private method is not writable");if("a"===n&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!i:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?i.call(e,r):i?i.value=r:t.set(e,r),r}function T(e,t){if(null===t||"object"!=typeof t&&"function"!=typeof t)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?t===e:e.has(t)}}},t={};function r(n){var i=t[n];if(void 0!==i)return i.exports;var o=t[n]={exports:{}};return e[n](o,o.exports,r),o.exports}r.d=function(e,t){for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n=r(607);return n=n.default}()}));
//# sourceMappingURL=vanilla-recycler-view.min.js.map