@html-next/vertical-collection 4.0.2 → 5.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@html-next/vertical-collection",
-  "version": "4.0.2",
+  "version": "5.0.0",
   "description": "infinite-scroll, done right. done.",
   "keywords": [
     "occlusion",
@@ -23,6 +23,14 @@
     "name": "Chris Thoburn (@runspired)",
     "url": "https://runspired.com"
   },
+  "exports": {
+    ".": {
+      "default": "./dist/index.js"
+    },
+    "./-private/index": {
+      "default": "./dist/-private/index.js"
+    }
+  },
   "contributors": [
     {
       "name": "Chris Garrett (@pzuraq)",
@@ -35,94 +43,71 @@
       "url": "https://github.com/rwwagner90"
     }
   ],
-  "directories": {
-    "doc": "doc",
-    "test": "tests"
-  },
-  "scripts": {
-    "build": "ember build --environment=production",
-    "lint": "npm-run-all --aggregate-output --continue-on-error --parallel \"lint:!(fix)\"",
-    "lint:fix": "npm-run-all --aggregate-output --continue-on-error --parallel lint:*:fix",
-    "lint:js": "eslint . --cache",
-    "lint:js:fix": "eslint . --fix",
-    "start": "ember serve",
-    "test": "npm-run-all lint test:*",
-    "test:ember": "ember test",
-    "test:ember-compatibility": "ember try:each"
-  },
+  "files": [
+    "src",
+    "dist",
+    "addon-shim.cjs"
+  ],
   "dependencies": {
-    "babel6-plugin-strip-class-callcheck": "^6.0.0",
-    "broccoli-funnel": "^3.0.8",
-    "broccoli-merge-trees": "^4.2.0",
-    "broccoli-rollup": "^5.0.0",
-    "ember-cli-babel": "^7.12.0",
-    "ember-cli-htmlbars": "^6.0.0",
-    "ember-cli-version-checker": "^5.1.2",
-    "ember-raf-scheduler": "^0.3.0"
+    "@embroider/addon-shim": "^1.10.2",
+    "ember-raf-scheduler": "~0.3.0"
   },
   "devDependencies": {
-    "@ember/optional-features": "^2.0.0",
-    "@ember/test-helpers": "^2.8.1",
-    "babel-eslint": "^10.1.0",
-    "bootstrap": "~3.3.5",
-    "broccoli-asset-rev": "^3.0.0",
-    "ember-auto-import": "^2.4.2",
-    "ember-cli": "~3.28.0",
-    "ember-cli-dependency-checker": "^3.2.0",
-    "ember-cli-eslint": "^5.1.0",
-    "ember-cli-fastboot": "^2.1.3",
-    "ember-cli-github-pages": "^0.2.2",
-    "ember-cli-inject-live-reload": "^2.1.0",
-    "ember-cli-sri": "^2.1.1",
-    "ember-cli-terser": "^4.0.2",
-    "ember-code-snippet": "^2.4.1",
-    "ember-data": "~3.12.0",
-    "ember-disable-prototype-extensions": "^1.1.3",
-    "ember-export-application-global": "^2.0.1",
-    "ember-load-initializers": "^2.1.2",
+    "@babel/eslint-parser": "^7.22.10",
+    "@ember/test-waiters": "~3.1.0",
+    "@embroider/addon-dev": "^8.2.0",
+    "@eslint/js": "^9.39.2",
+    "@rollup/plugin-babel": "^6.1.0",
+    "babel-plugin-ember-template-compilation": "^4.0.0",
+    "concurrently": "^8.2.0",
+    "ember-inflector": "^6.0.0",
     "ember-perf-timeline": "^2.0.0",
-    "ember-qunit": "^5.1.5",
-    "ember-resolver": "^8.0.2",
-    "ember-source": "~3.12.0",
-    "ember-source-channel-url": "^3.0.0",
-    "ember-try": "^2.0.0",
-    "eslint": "^7.32.0",
-    "eslint-plugin-ember": "^6.7.1",
-    "eslint-plugin-node": "^9.1.0",
-    "loader.js": "^4.7.0",
-    "npm-run-all": "^4.1.5",
-    "qunit": "^2.19.1",
-    "qunit-dom": "^1.0.0",
-    "release-it": "^14.2.1",
-    "release-it-lerna-changelog": "^3.1.0",
-    "webpack": "^5.0.0"
+    "ember-qunit": "^7.0.0",
+    "ember-source": "~5.2.0",
+    "ember-template-lint": "^5.11.2",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-ember": "^12.7.5",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-n": "^17.23.2",
+    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-qunit": "^8.0.0",
+    "globals": "^16.5.0",
+    "prettier": "^3.0.2",
+    "prettier-plugin-ember-template-tag": "^2.0.6",
+    "rollup": "^4.56.0",
+    "stylelint": "^17.0.0",
+    "stylelint-config-standard": "^40.0.0",
+    "stylelint-prettier": "^5.0.3"
   },
   "engines": {
-    "node": ">= 14.*"
+    "node": ">= 18"
+  },
+  "volta": {
+    "node": "18.20.5",
+    "pnpm": "10.10.0"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "ember-addon": {
-    "configPath": "tests/dummy/config"
+  "ember": {
+    "edition": "octane"
   },
-  "release-it": {
-    "plugins": {
-      "release-it-lerna-changelog": {
-        "infile": "CHANGELOG.md",
-        "launchEditor": true
-      }
-    },
-    "git": {
-      "tagName": "v${version}"
-    },
-    "github": {
-      "release": true,
-      "tokenRef": "GITHUB_AUTH"
-    }
+  "ember-addon": {
+    "version": 2,
+    "type": "addon",
+    "main": "addon-main.cjs",
+    "app-js": {}
   },
-  "volta": {
-    "node": "14.18.2",
-    "yarn": "1.22.17"
+  "scripts": {
+    "build": "rollup --config",
+    "format": "prettier . --cache --write",
+    "lint": "concurrently \"pnpm:lint:*(!fix)\" --names \"lint:\"",
+    "lint:css": "stylelint \"**/*.css\"",
+    "lint:css:fix": "concurrently \"pnpm:lint:css -- --fix\"",
+    "lint:fix": "concurrently \"pnpm:lint:*:fix\" --names \"fix:\" && pnpm run format",
+    "lint:js": "eslint . --cache",
+    "lint:format": "prettier . --cache --check",
+    "lint:js:fix": "eslint . --fix"
   }
-}
+}

package/{addon → src}/-private/data-view/elements/occluded-content.js

@@ -1,7 +1,7 @@
 import { set } from '@ember/object';
 import { DEBUG } from '@glimmer/env';
 
-import document from '../../utils/document-shim';
+import document from '../../utils/document-shim.js';
 
 let OC_IDENTITY = 0;
 

package/{addon/-private/data-view → src/-private/data-view/elements}/viewport-container.js

@@ -13,58 +13,68 @@
  *
  */
 export function ViewportContainer() {
-
   // A bug occurs in Chrome when we reload the browser at a lower
   // scrollTop, window.scrollY becomes stuck on a single value.
   Object.defineProperty(this, 'scrollTop', {
     get() {
-      return document.body.scrollTop
-        || document.documentElement.scrollTop;
+      return document.body.scrollTop || document.documentElement.scrollTop;
     },
     set(v) {
       document.body.scrollTop = document.documentElement.scrollTop = v;
-    }
+    },
   });
 
   Object.defineProperty(this, 'scrollLeft', {
     get() {
-      return window.scrollX
-        || window.pageXOffset
-        || document.body.scrollLeft
-        || document.documentElement.scrollLeft;
+      return (
+        window.scrollX ||
+        window.pageXOffset ||
+        document.body.scrollLeft ||
+        document.documentElement.scrollLeft
+      );
     },
     set(v) {
-      window.scrollX
-        = window.pageXOffset
-        = document.body.scrollLeft
-        = document.documentElement.scrollLeft = v;
-    }
+      window.scrollX =
+        window.pageXOffset =
+        document.body.scrollLeft =
+        document.documentElement.scrollLeft =
+          v;
+    },
   });
 
   Object.defineProperty(this, 'offsetHeight', {
     get() {
       return window.innerHeight;
-    }
+    },
   });
 }
 
-ViewportContainer.prototype.addEventListener = function addEventListener(event, handler, options) {
+ViewportContainer.prototype.addEventListener = function addEventListener(
+  event,
+  handler,
+  options,
+) {
   return window.addEventListener(event, handler, options);
 };
 
-ViewportContainer.prototype.removeEventListener = function addEventListener(event, handler, options) {
+ViewportContainer.prototype.removeEventListener = function addEventListener(
+  event,
+  handler,
+  options,
+) {
   return window.removeEventListener(event, handler, options);
 };
 
-ViewportContainer.prototype.getBoundingClientRect = function getBoundingClientRect() {
-  return {
-    height: window.innerHeight,
-    width: window.innerWidth,
-    top: 0,
-    left: 0,
-    right: window.innerWidth,
-    bottom: window.innerHeight
+ViewportContainer.prototype.getBoundingClientRect =
+  function getBoundingClientRect() {
+    return {
+      height: window.innerHeight,
+      width: window.innerWidth,
+      top: 0,
+      left: 0,
+      right: window.innerWidth,
+      bottom: window.innerHeight,
+    };
   };
-};
 
 export default new ViewportContainer();

package/{addon → src}/-private/data-view/elements/virtual-component.js

@@ -2,7 +2,7 @@ import { set } from '@ember/object';
 import { assert } from '@ember/debug';
 import { DEBUG } from '@glimmer/env';
 
-import document from '../../utils/document-shim';
+import document from '../../utils/document-shim.js';
 
 let VC_IDENTITY = 0;
 
@@ -16,8 +16,10 @@ export default class VirtualComponent {
     // We check to see if the document exists in Fastboot. Since RAF won't run in
     // Fastboot, we'll never have to use these text nodes for measurements, so they
     // can be empty
-    this.upperBound = document !== undefined ? document.createTextNode('') : null;
-    this.lowerBound = document !== undefined ? document.createTextNode('') : null;
+    this.upperBound =
+      document !== undefined ? document.createTextNode('') : null;
+    this.lowerBound =
+      document !== undefined ? document.createTextNode('') : null;
 
     this.rendered = false;
 
@@ -55,11 +57,17 @@ export default class VirtualComponent {
 
         const text = upperBound.textContent;
 
-        assert(`All content inside of vertical-collection must be wrapped in an element. Detected a text node with content: ${text}`, text === '' || text.match(/^\s+$/));
+        assert(
+          `All content inside of vertical-collection must be wrapped in an element. Detected a text node with content: ${text}`,
+          text === '' || text.match(/^\s+$/),
+        );
       }
     }
 
-    assert('Items in a vertical collection require atleast one element in them', top !== Infinity && bottom !== -Infinity);
+    assert(
+      'Items in a vertical collection require atleast one element in them',
+      top !== Infinity && bottom !== -Infinity,
+    );
 
     const height = bottom - top;
 

package/{addon → src}/-private/data-view/radar/dynamic-radar.js

@@ -1,9 +1,9 @@
 import { DEBUG } from '@glimmer/env';
 
-import Radar from './radar';
-import SkipList from '../skip-list';
-import roundTo from '../utils/round-to';
-import getScaledClientRect from '../../utils/element/get-scaled-client-rect';
+import Radar from './radar.js';
+import SkipList from '../skip-list.js';
+import roundTo from '../utils/round-to.js';
+import getScaledClientRect from '../../utils/element/get-scaled-client-rect.js';
 
 export default class DynamicRadar extends Radar {
   constructor(parentToken, options) {
@@ -26,9 +26,8 @@ export default class DynamicRadar extends Radar {
     }
   }
 
-  destroy() {
-    super.destroy();
-
+  willDestroy() {
+    super.willDestroy();
     this.skipList = null;
   }
 
@@ -66,7 +65,10 @@ export default class DynamicRadar extends Radar {
 
     // Create the SkipList only after the estimateHeight has been calculated the first time
     if (this.skipList === null) {
-      this.skipList = new SkipList(this.totalItems, this._calculatedEstimateHeight);
+      this.skipList = new SkipList(
+        this.totalItems,
+        this._calculatedEstimateHeight,
+      );
     } else {
       this.skipList.defaultValue = this._calculatedEstimateHeight;
     }
@@ -80,7 +82,7 @@ export default class DynamicRadar extends Radar {
       visibleBottom,
       totalItems,
 
-      _didReset
+      _didReset,
     } = this;
 
     if (totalItems === 0) {
@@ -101,8 +103,10 @@ export default class DynamicRadar extends Radar {
 
     const { values } = skipList;
 
-    let { totalBefore, index: firstVisibleIndex } = this.skipList.find(visibleTop);
-    let { totalAfter, index: lastVisibleIndex } = this.skipList.find(visibleBottom);
+    let { totalBefore, index: firstVisibleIndex } =
+      this.skipList.find(visibleTop);
+    let { totalAfter, index: lastVisibleIndex } =
+      this.skipList.find(visibleBottom);
 
     const maxIndex = totalItems - 1;
 
@@ -127,11 +131,8 @@ export default class DynamicRadar extends Radar {
   }
 
   _calculateScrollDiff() {
-    const {
-      firstItemIndex,
-      _prevFirstVisibleIndex,
-      _prevFirstItemIndex
-    } = this;
+    const { firstItemIndex, _prevFirstVisibleIndex, _prevFirstItemIndex } =
+      this;
 
     let beforeVisibleDiff = 0;
 
@@ -142,7 +143,10 @@ export default class DynamicRadar extends Radar {
       // (the delta). We want to measure the delta of exactly this number of items, because
       // items that are after the first visible item should not affect the scroll position,
       // and neither should items already rendered before the first visible item.
-      const measureLimit = Math.min(Math.abs(firstItemIndex - _prevFirstItemIndex), _prevFirstVisibleIndex - firstItemIndex);
+      const measureLimit = Math.min(
+        Math.abs(firstItemIndex - _prevFirstItemIndex),
+        _prevFirstVisibleIndex - firstItemIndex,
+      );
 
       beforeVisibleDiff = Math.round(this._measure(measureLimit));
     }
@@ -151,10 +155,7 @@ export default class DynamicRadar extends Radar {
   }
 
   _shouldScheduleRerender() {
-    const {
-      firstItemIndex,
-      lastItemIndex
-    } = this;
+    const { firstItemIndex, lastItemIndex } = this;
 
     this._updateConstants();
     this._measure();
@@ -163,7 +164,9 @@ export default class DynamicRadar extends Radar {
     // case we want to check them _after_ the change.
     const { firstVisibleIndex, lastVisibleIndex } = this;
 
-    return firstVisibleIndex < firstItemIndex || lastVisibleIndex > lastItemIndex;
+    return (
+      firstVisibleIndex < firstItemIndex || lastVisibleIndex > lastItemIndex
+    );
   }
 
   _measure(measureLimit = null) {
@@ -172,12 +175,13 @@ export default class DynamicRadar extends Radar {
       skipList,
 
       _occludedContentBefore,
-      _transformScale
+      _transformScale,
     } = this;
 
-    const numToMeasure = measureLimit !== null
-      ? Math.min(measureLimit, orderedComponents.length)
-      : orderedComponents.length;
+    const numToMeasure =
+      measureLimit !== null
+        ? Math.min(measureLimit, orderedComponents.length)
+        : orderedComponents.length;
 
     let totalDelta = 0;
 
@@ -186,17 +190,19 @@ export default class DynamicRadar extends Radar {
       const previousItem = orderedComponents[i - 1];
       const itemIndex = currentItem.index;
 
-      const {
-        top: currentItemTop,
-        height: currentItemHeight
-      } = getScaledClientRect(currentItem, _transformScale);
+      const { top: currentItemTop, height: currentItemHeight } =
+        getScaledClientRect(currentItem, _transformScale);
 
       let margin;
 
       if (previousItem !== undefined) {
-        margin = currentItemTop - getScaledClientRect(previousItem, _transformScale).bottom;
+        margin =
+          currentItemTop -
+          getScaledClientRect(previousItem, _transformScale).bottom;
       } else {
-        margin = currentItemTop - getScaledClientRect(_occludedContentBefore, _transformScale).bottom;
+        margin =
+          currentItemTop -
+          getScaledClientRect(_occludedContentBefore, _transformScale).bottom;
       }
 
       const newHeight = roundTo(currentItemHeight + margin);
@@ -215,7 +221,7 @@ export default class DynamicRadar extends Radar {
   }
 
   _didEarthquake(scrollDiff) {
-    return scrollDiff > (this._minHeight / 2);
+    return scrollDiff > this._minHeight / 2;
   }
 
   get total() {
@@ -239,9 +245,7 @@ export default class DynamicRadar extends Radar {
   }
 
   get firstVisibleIndex() {
-    const {
-      visibleTop
-    } = this;
+    const { visibleTop } = this;
 
     const { index } = this.skipList.find(visibleTop);
 
@@ -249,10 +253,7 @@ export default class DynamicRadar extends Radar {
   }
 
   get lastVisibleIndex() {
-    const {
-      visibleBottom,
-      totalItems
-    } = this;
+    const { visibleBottom, totalItems } = this;
 
     const { index } = this.skipList.find(visibleBottom);