@yoobic/yobi 8.5.0-4 → 8.5.0-9

package/dist/collection/components/3.organisms/virtual-scroll/virtual-scroll.js

@@ -1,5 +1,5 @@
 import { componentOnReady, findParent, gsapTo, isAnimationsDisabled, isWeb } from '@shared/utils';
-import { Component, Element, forceUpdate, h, Host, Listen, Method, Prop, readTask, State, Watch, writeTask } from '@stencil/core';
+import { forceUpdate, h, Host, readTask, writeTask } from '@stencil/core';
 import { isEqual, orderBy, uniqBy } from 'lodash-es';
 import { querySelectorAllDeep, querySelectorDeep } from '../../../utils/helpers/common-helpers';
 import { CELL_TYPE_ITEM } from './types';
@@ -497,413 +497,424 @@ export class YooVirtualScrollComponent {
     const doms = uniqBy(this.virtualDom, (node) => { var _a; return (_a = node === null || node === void 0 ? void 0 : node.cell) === null || _a === void 0 ? void 0 : _a.index; }).filter(node => ((node.cell.index >= start && node.cell.index < end) || end === 0));
     return (h(Host, { style: {
         height: this.virtualInit ? `${this.totalHeight}px` : '100vh'
-      }, class: { 'not-loaded': true } },
-      h("div", { class: "virtual-container" }, this.renderItem && (h(VirtualProxy, { dom: doms }, doms.map((node) => this.renderVirtualNode(node))))),
-      this.renderVirtualPlaceholder(),
-      h("div", { class: "loading-container", ref: el => this.loadingContainer = el })));
+      }, class: { 'not-loaded': true } }, h("div", { class: "virtual-container" }, this.renderItem && (h(VirtualProxy, { dom: doms }, doms.map((node) => this.renderVirtualNode(node))))), this.renderVirtualPlaceholder(), h("div", { class: "loading-container", ref: el => this.loadingContainer = el })));
   }
   static get is() { return "yoo-virtual-scroll"; }
   static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["virtual-scroll.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["virtual-scroll.css"]
-  }; }
-  static get properties() { return {
-    "approxItemHeight": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "It is important to provide this\nif virtual item height will be significantly larger than the default\nThe approximate height of each virtual item template's cell.\nThis dimension is used to help determine how many cells should\nbe created when initialized, and to help calculate the height of\nthe scrollable area. This height value can only use `px` units.\nNote that the actual rendered size of each cell comes from the\napp's CSS, whereas this approximation is used to help calculate\ninitial dimensions before the item has been rendered."
-      },
-      "attribute": "approx-item-height",
-      "reflect": false,
-      "defaultValue": "120"
-    },
-    "approxHeaderHeight": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The approximate height of each header template's cell.\nThis dimension is used to help determine how many cells should\nbe created when initialized, and to help calculate the height of\nthe scrollable area. This height value can only use `px` units.\nNote that the actual rendered size of each cell comes from the\napp's CSS, whereas this approximation is used to help calculate\ninitial dimensions before the item has been rendered."
+  static get originalStyleUrls() {
+    return {
+      "$": ["virtual-scroll.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["virtual-scroll.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "approxItemHeight": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "It is important to provide this\nif virtual item height will be significantly larger than the default\nThe approximate height of each virtual item template's cell.\nThis dimension is used to help determine how many cells should\nbe created when initialized, and to help calculate the height of\nthe scrollable area. This height value can only use `px` units.\nNote that the actual rendered size of each cell comes from the\napp's CSS, whereas this approximation is used to help calculate\ninitial dimensions before the item has been rendered."
+        },
+        "attribute": "approx-item-height",
+        "reflect": false,
+        "defaultValue": "120"
       },
-      "attribute": "approx-header-height",
-      "reflect": false,
-      "defaultValue": "30"
-    },
-    "approxFooterHeight": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
+      "approxHeaderHeight": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The approximate height of each header template's cell.\nThis dimension is used to help determine how many cells should\nbe created when initialized, and to help calculate the height of\nthe scrollable area. This height value can only use `px` units.\nNote that the actual rendered size of each cell comes from the\napp's CSS, whereas this approximation is used to help calculate\ninitial dimensions before the item has been rendered."
+        },
+        "attribute": "approx-header-height",
+        "reflect": false,
+        "defaultValue": "30"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The approximate width of each footer template's cell.\nThis dimension is used to help determine how many cells should\nbe created when initialized, and to help calculate the height of\nthe scrollable area. This height value can only use `px` units.\nNote that the actual rendered size of each cell comes from the\napp's CSS, whereas this approximation is used to help calculate\ninitial dimensions before the item has been rendered."
+      "approxFooterHeight": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The approximate width of each footer template's cell.\nThis dimension is used to help determine how many cells should\nbe created when initialized, and to help calculate the height of\nthe scrollable area. This height value can only use `px` units.\nNote that the actual rendered size of each cell comes from the\napp's CSS, whereas this approximation is used to help calculate\ninitial dimensions before the item has been rendered."
+        },
+        "attribute": "approx-footer-height",
+        "reflect": false,
+        "defaultValue": "30"
       },
-      "attribute": "approx-footer-height",
-      "reflect": false,
-      "defaultValue": "30"
-    },
-    "headerFn": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "HeaderFn",
-        "resolved": "(item: any, index: number, items: any[]) => string",
-        "references": {
-          "HeaderFn": {
-            "location": "import",
-            "path": "./interfaces"
+      "headerFn": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "HeaderFn",
+          "resolved": "(item: any, index: number, items: any[]) => string",
+          "references": {
+            "HeaderFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Section headers and the data used within its given\ntemplate can be dynamically created by passing a function to `headerFn`.\nFor example, a large list of contacts usually has dividers between each\nletter in the alphabet. App's can provide their own custom `headerFn`\nwhich is called with each record within the dataset. The logic within\nthe header function can decide if the header template should be used,\nand what data to give to the header template. The function must return\n`null` if a header cell shouldn't be created."
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Section headers and the data used within its given\ntemplate can be dynamically created by passing a function to `headerFn`.\nFor example, a large list of contacts usually has dividers between each\nletter in the alphabet. App's can provide their own custom `headerFn`\nwhich is called with each record within the dataset. The logic within\nthe header function can decide if the header template should be used,\nand what data to give to the header template. The function must return\n`null` if a header cell shouldn't be created."
-      }
-    },
-    "footerFn": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "HeaderFn",
-        "resolved": "(item: any, index: number, items: any[]) => string",
-        "references": {
-          "HeaderFn": {
-            "location": "import",
-            "path": "./interfaces"
+      "footerFn": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "HeaderFn",
+          "resolved": "(item: any, index: number, items: any[]) => string",
+          "references": {
+            "HeaderFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Section footers and the data used within its given\ntemplate can be dynamically created by passing a function to `footerFn`.\nThe logic within the footer function can decide if the footer template\nshould be used, and what data to give to the footer template. The function\nmust return `null` if a footer cell shouldn't be created."
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Section footers and the data used within its given\ntemplate can be dynamically created by passing a function to `footerFn`.\nThe logic within the footer function can decide if the footer template\nshould be used, and what data to give to the footer template. The function\nmust return `null` if a footer cell shouldn't be created."
-      }
-    },
-    "items": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "any[]",
-        "resolved": "any[]",
-        "references": {}
+      "items": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "any[]",
+          "resolved": "any[]",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The data that builds the templates within the virtual scroll.\nIt's important to note that when this data has changed, then the\nentire virtual scroll is reset, which is an expensive operation and\nshould be avoided if possible."
+        }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "The data that builds the templates within the virtual scroll.\nIt's important to note that when this data has changed, then the\nentire virtual scroll is reset, which is an expensive operation and\nshould be avoided if possible."
-      }
-    },
-    "itemHeight": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "ItemHeightFn",
-        "resolved": "(item: any, index: number) => number",
-        "references": {
-          "ItemHeightFn": {
-            "location": "import",
-            "path": "./interfaces"
+      "itemHeight": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ItemHeightFn",
+          "resolved": "(item: any, index: number) => number",
+          "references": {
+            "ItemHeightFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "An optional function that maps each item within their height.\nWhen this function is provides, heavy optimizations and fast path can be taked by\n`ion-virtual-scroll` leading to massive performance improvements.\n\nThis function allows to skip all DOM reads, which can be Doing so leads\nto massive performance"
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "An optional function that maps each item within their height.\nWhen this function is provides, heavy optimizations and fast path can be taked by\n`ion-virtual-scroll` leading to massive performance improvements.\n\nThis function allows to skip all DOM reads, which can be Doing so leads\nto massive performance"
-      }
-    },
-    "headerHeight": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "HeaderHeightFn",
-        "resolved": "(item: any, index: number) => number",
-        "references": {
-          "HeaderHeightFn": {
-            "location": "import",
-            "path": "./interfaces"
+      "headerHeight": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "HeaderHeightFn",
+          "resolved": "(item: any, index: number) => number",
+          "references": {
+            "HeaderHeightFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "An optional function that maps each item header within their height."
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "An optional function that maps each item header within their height."
-      }
-    },
-    "shouldReRender": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "An optional prop that ensures heigts of items recalculated.\nShould be used when using the same instance of the component but udpating all items"
+      "shouldReRender": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "An optional prop that ensures heigts of items recalculated.\nShould be used when using the same instance of the component but udpating all items"
+        },
+        "attribute": "should-re-render",
+        "reflect": false,
+        "defaultValue": "true"
       },
-      "attribute": "should-re-render",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "footerHeight": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "FooterHeightFn",
-        "resolved": "(item: any, index: number) => number",
-        "references": {
-          "FooterHeightFn": {
-            "location": "import",
-            "path": "./interfaces"
+      "footerHeight": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "FooterHeightFn",
+          "resolved": "(item: any, index: number) => number",
+          "references": {
+            "FooterHeightFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "An optional function that maps each item footer within their height."
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "An optional function that maps each item footer within their height."
-      }
-    },
-    "renderItem": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "(item: any, index: number) => any",
-        "resolved": "(item: any, index: number) => any",
-        "references": {}
+      "renderItem": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(item: any, index: number) => any",
+          "resolved": "(item: any, index: number) => any",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "NOTE: only JSX API for stencil.\n\nProvide a render function for the items to be rendered. Returns a JSX virtual-dom."
+        }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "NOTE: only JSX API for stencil.\n\nProvide a render function for the items to be rendered. Returns a JSX virtual-dom."
-      }
-    },
-    "renderPlaceholder": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "() => JSX.Element[]",
-        "resolved": "() => Element[]",
-        "references": {
-          "JSX": {
-            "location": "global"
+      "renderPlaceholder": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "() => JSX.Element[]",
+          "resolved": "() => Element[]",
+          "references": {
+            "JSX": {
+              "location": "global"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    },
-    "renderHeader": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "(item: any, index: number) => any",
-        "resolved": "(item: any, index: number) => any",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "NOTE: only JSX API for stencil.\n\nProvide a render function for the header to be rendered. Returns a JSX virtual-dom."
-      }
-    },
-    "renderFooter": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "(item: any, index: number) => any",
-        "resolved": "(item: any, index: number) => any",
-        "references": {}
+      "renderHeader": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(item: any, index: number) => any",
+          "resolved": "(item: any, index: number) => any",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "NOTE: only JSX API for stencil.\n\nProvide a render function for the header to be rendered. Returns a JSX virtual-dom."
+        }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "NOTE: only JSX API for stencil.\n\nProvide a render function for the footer to be rendered. Returns a JSX virtual-dom."
-      }
-    },
-    "nodeRender": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "ItemRenderFn",
-        "resolved": "(el: HTMLElement, cell: Cell, domIndex: number) => HTMLElement",
-        "references": {
-          "ItemRenderFn": {
-            "location": "import",
-            "path": "./interfaces"
-          }
+      "renderFooter": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(item: any, index: number) => any",
+          "resolved": "(item: any, index: number) => any",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "NOTE: only JSX API for stencil.\n\nProvide a render function for the footer to be rendered. Returns a JSX virtual-dom."
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "NOTE: only Vanilla JS API."
-      }
-    },
-    "domRender": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DomRenderFn",
-        "resolved": "(dom: VirtualNode[]) => void",
-        "references": {
-          "DomRenderFn": {
-            "location": "import",
-            "path": "./interfaces"
+      "nodeRender": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ItemRenderFn",
+          "resolved": "(el: HTMLElement, cell: Cell, domIndex: number) => HTMLElement",
+          "references": {
+            "ItemRenderFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "NOTE: only Vanilla JS API."
         }
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [{
-            "name": "internal",
-            "text": undefined
-          }],
-        "text": ""
-      }
-    }
-  }; }
-  static get states() { return {
-    "totalHeight": {}
-  }; }
-  static get methods() { return {
-    "positionForItem": {
-      "complexType": {
-        "signature": "(index: number) => Promise<number>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
+      "domRender": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "DomRenderFn",
+          "resolved": "(dom: VirtualNode[]) => void",
+          "references": {
+            "DomRenderFn": {
+              "location": "import",
+              "path": "./interfaces"
+            }
           }
         },
-        "return": "Promise<number>"
-      },
-      "docs": {
-        "text": "Returns the position of the virtual item at the given index.",
-        "tags": []
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
+          "text": ""
+        }
       }
-    },
-    "checkRange": {
-      "complexType": {
-        "signature": "(offset: number, len?: number) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+    };
+  }
+  static get states() {
+    return {
+      "totalHeight": {}
+    };
+  }
+  static get methods() {
+    return {
+      "positionForItem": {
+        "complexType": {
+          "signature": "(index: number) => Promise<number>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<number>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "Returns the position of the virtual item at the given index.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "This method marks a subset of items as dirty, so they can be re-rendered. Items should be marked as\ndirty any time the content or their style changes.\n\nThe subset of items to be updated can are specifing by an offset and a length.",
-        "tags": []
-      }
-    },
-    "checkEnd": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "checkRange": {
+        "complexType": {
+          "signature": "(offset: number, len?: number) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }, {
+              "tags": [],
+              "text": ""
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "This method marks a subset of items as dirty, so they can be re-rendered. Items should be marked as\ndirty any time the content or their style changes.\n\nThe subset of items to be updated can are specifing by an offset and a length.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "This method marks the tail the items array as dirty, so they can be re-rendered.\n\nIt's equivalent to calling:\n\n```js\nvirtualScroll.checkRange(lastItemLen);\n```",
-        "tags": []
+      "checkEnd": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "This method marks the tail the items array as dirty, so they can be re-rendered.\n\nIt's equivalent to calling:\n\n```js\nvirtualScroll.checkRange(lastItemLen);\n```",
+          "tags": []
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "itemHeight",
-      "methodName": "itemsChanged"
-    }, {
-      "propName": "headerHeight",
-      "methodName": "itemsChanged"
-    }, {
-      "propName": "footerHeight",
-      "methodName": "itemsChanged"
-    }, {
-      "propName": "items",
-      "methodName": "itemsChanged"
-    }, {
-      "propName": "shouldReRender",
-      "methodName": "shouldRender"
-    }]; }
-  static get listeners() { return [{
-      "name": "resize",
-      "method": "onResize",
-      "target": "window",
-      "capture": false,
-      "passive": true
-    }, {
-      "name": "viewToggled",
-      "method": "onViewToggled",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "itemHeightUpdated",
-      "method": "onItemHeightUpdated",
-      "target": "window",
-      "capture": false,
-      "passive": false
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "itemHeight",
+        "methodName": "itemsChanged"
+      }, {
+        "propName": "headerHeight",
+        "methodName": "itemsChanged"
+      }, {
+        "propName": "footerHeight",
+        "methodName": "itemsChanged"
+      }, {
+        "propName": "items",
+        "methodName": "itemsChanged"
+      }, {
+        "propName": "shouldReRender",
+        "methodName": "shouldRender"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "resize",
+        "method": "onResize",
+        "target": "window",
+        "capture": false,
+        "passive": true
+      }, {
+        "name": "viewToggled",
+        "method": "onViewToggled",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "itemHeightUpdated",
+        "method": "onItemHeightUpdated",
+        "target": "window",
+        "capture": false,
+        "passive": false
+      }];
+  }
 }
 const VirtualProxy = ({ dom }, children, utils) => {
   return utils.map(children, (child, i) => {