bistin · bistin · Jul 1, 2022 · Jul 1, 2022
diff --git a/addon/utils/index.ts b/addon/utils/index.ts
@@ -36,10 +36,11 @@ export type Position = {
 export function bottom(layout: Layout) {
     let max = 0,
         bottomY;
-    for (let i = 0, len = layout.length; i < len; i++) {
-        bottomY = layout[i].y + layout[i].h;
+
+    layout.forEach((layoutObj) => {
+        bottomY = layoutObj.y + layoutObj.h;
         if (bottomY > max) max = bottomY;
-    }
+    })
     return max;
 }
 
@@ -96,9 +97,8 @@ export function compact(layout: Layout, compactType: CompactType, cols: number):
     const sorted = sortLayoutItems(layout, compactType);
     // Holding for new items.
     const out = Array(layout.length);
-
-    for (let i = 0, len = sorted.length; i < len; i++) {
-        let l = cloneLayoutItem(sorted[i]);
+    sorted.forEach((item) => {
+        let l = cloneLayoutItem(item);
 
         // Don't move static elements
         if (!l.static) {
@@ -110,12 +110,11 @@ export function compact(layout: Layout, compactType: CompactType, cols: number):
         }
 
         // Add to output array to make sure they still come out in the right order.
-        out[layout.indexOf(sorted[i])] = l;
+        out[layout.indexOf(item)] = l;
 
         // Clear moved flag, if it exists.
         l.moved = false;
-    }
-
+    })
     return out;
 }
 
@@ -140,14 +139,17 @@ function resolveCompactionCollision(
     // Go through each item we collide with.
     for (let i = itemIndex + 1; i < layout.length; i++) {
         const otherItem = layout[i];
+        if(!otherItem) {
+            continue;
+        }
         // Ignore static items
         if (otherItem.static) continue;
 
         // Optimization: we can break early if we know we're past this el
         // We can do this b/c it's a sorted layout
         if (otherItem.y > item.y + item.h) break;
 
-        if (collides(item, otherItem)) {
+        if (collides(item, otherItem) && sizeProp) {
             resolveCompactionCollision(layout, otherItem, moveToCoord + item[sizeProp], axis);
         }
     }
@@ -211,6 +213,9 @@ export function correctBounds(layout: Layout, bounds: { cols: number }) {
     const collidesWith = getStatics(layout);
     for (let i = 0, len = layout.length; i < len; i++) {
         const l = layout[i];
+        if(!l) {
+            continue;
+        }
         // Overflows right
         if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;
         // Overflows left
@@ -239,7 +244,7 @@ export function correctBounds(layout: Layout, bounds: { cols: number }) {
  */
 export function getLayoutItem(layout: Layout, id: string): LayoutItem | undefined {
     for (let i = 0, len = layout.length; i < len; i++) {
-        if (layout[i].i === id) return layout[i];
+        if (layout[i]?.i === id) return layout[i];
     }
     return;
 }
@@ -254,7 +259,8 @@ export function getLayoutItem(layout: Layout, id: string): LayoutItem | undefine
  */
 export function getFirstCollision(layout: Layout, layoutItem: LayoutItem): LayoutItem | undefined {
     for (let i = 0, len = layout.length; i < len; i++) {
-        if (collides(layout[i], layoutItem)) return layout[i];
+        const layoutObj = layout[i];
+        if(layoutObj && collides(layoutObj, layoutItem)) return layout[i];
     }
     return;
 }
@@ -328,14 +334,15 @@ export function moveElement(
     }
 
     // Move each item that collides away from this element.
-    for (let i = 0, len = collisions.length; i < len; i++) {
-        const collision = collisions[i];
+    collisions.forEach((collision) => {
+    //for (let i = 0, len = collisions.length; i < len; i++) {
+      //  const collision = collisions[i];
         log(
             `Resolving collision between ${l.i} at [${l.x},${l.y}] and ${collision.i} at [${collision.x},${collision.y}]`,
         );
 
         // Short circuit so we can't infinite loop
-        if (collision.moved) continue;
+        if (collision.moved) return;
 
         // Don't move static items - we have to move *this* element away
         if (collision.static) {
@@ -357,7 +364,7 @@ export function moveElement(
                 cols,
             );
         }
-    }
+    });
 
     return layout;
 }
@@ -565,19 +572,22 @@ export function validateLayout(layout: Layout, contextName = 'Layout') {
     if (!Array.isArray(layout)) throw new Error(contextName + ' must be an array!');
     for (let i = 0, len = layout.length; i < len; i++) {
         const item = layout[i];
-        for (let j = 0; j < subProps.length; j++) {
-            if (typeof item[subProps[j]] !== 'number') {
+        if(!item) {
+            continue;
+        }
+        subProps.forEach(subProp => {
+            if (typeof item[subProp] !== 'number') {
                 throw new Error(
                     'ReactGridLayout: ' +
                         contextName +
                         '[' +
                         i +
                         '].' +
-                        subProps[j] +
+                        subProp +
                         ' must be a number!',
                 );
             }
-        }
+        })
         if (item.i && typeof item.i !== 'string') {
             throw new Error('ReactGridLayout: ' + contextName + '[' + i + '].i must be a string!');
         }

diff --git a/package.json b/package.json
@@ -34,7 +34,7 @@
     "@babel/core": "^7.10.3",
     "ember-cli-babel": "^7.26.11",
     "ember-cli-htmlbars": "^6.0.1",
-    "ember-cli-typescript": "^4.1.0"
+    "ember-cli-typescript": "^5.1.0"
   },
   "devDependencies": {
     "@ember/optional-features": "^2.0.0",
@@ -43,29 +43,33 @@
     "@embroider/test-setup": "^1.6.0",
     "@glimmer/component": "^1.1.2",
     "@glimmer/tracking": "^1.1.2",
-    "@types/ember-data": "^3.16.9",
-    "@types/ember-qunit": "^3.4.13",
-    "@types/ember-resolver": "^5.0.10",
-    "@types/ember__application": "^3.16.2",
-    "@types/ember__array": "^3.16.3",
-    "@types/ember__component": "^3.16.4",
-    "@types/ember__controller": "^3.16.4",
-    "@types/ember__debug": "^3.16.3",
-    "@types/ember__engine": "^3.16.2",
-    "@types/ember__error": "^3.16.1",
-    "@types/ember__object": "^3.12.3",
-    "@types/ember__polyfills": "^3.12.1",
-    "@types/ember__routing": "^3.16.9",
-    "@types/ember__runloop": "^3.16.3",
-    "@types/ember__service": "^3.16.1",
-    "@types/ember__string": "^3.16.3",
-    "@types/ember__template": "^3.16.1",
-    "@types/ember__test": "^3.16.1",
-    "@types/ember__test-helpers": "^1.7.3",
-    "@types/ember__utils": "^3.16.2",
-    "@types/htmlbars-inline-precompile": "^1.0.1",
-    "@types/qunit": "^2.11.1",
-    "@types/rsvp": "^4.0.3",
+    "@types/ember-data": "^4.0.2",
+    "@types/ember-data__adapter": "^4.0.0",
+    "@types/ember-data__model": "^4.0.0",
+    "@types/ember-data__serializer": "^4.0.0",
+    "@types/ember-data__store": "^4.0.0",
+    "@types/ember-qunit": "^5.0.0",
+    "@types/ember-resolver": "^5.0.11",
+    "@types/ember__application": "^4.0.0",
+    "@types/ember__array": "^4.0.1",
+    "@types/ember__component": "^4.0.8",
+    "@types/ember__controller": "^4.0.0",
+    "@types/ember__debug": "^4.0.1",
+    "@types/ember__engine": "^4.0.0",
+    "@types/ember__error": "^4.0.0",
+    "@types/ember__object": "^4.0.2",
+    "@types/ember__polyfills": "^4.0.0",
+    "@types/ember__routing": "^4.0.7",
+    "@types/ember__runloop": "^4.0.1",
+    "@types/ember__service": "^4.0.0",
+    "@types/ember__string": "^3.0.9",
+    "@types/ember__template": "^4.0.0",
+    "@types/ember__test": "^4.0.0",
+    "@types/ember__test-helpers": "^2.6.1",
+    "@types/ember__utils": "^4.0.0",
+    "@types/htmlbars-inline-precompile": "^3.0.0",
+    "@types/qunit": "^2.19.1",
+    "@types/rsvp": "^4.0.4",
     "babel-eslint": "^10.1.0",
     "broccoli-asset-rev": "^3.0.0",
     "ember-auto-import": "^2.4.1",
@@ -97,7 +101,7 @@
     "prettier": "^2.6.2",
     "qunit": "^2.19.1",
     "qunit-dom": "^2.0.0",
-    "typescript": "^4.1.5",
+    "typescript": "^4.7.4",
     "webpack": "^5.72.1"
   },
   "engines": {

diff --git a/tests/dummy/app/config/environment.d.ts b/tests/dummy/app/config/environment.d.ts
@@ -8,7 +8,7 @@ declare const config: {
   environment: string;
   modulePrefix: string;
   podModulePrefix: string;
-  locationType: string;
+  locationType: 'history' | 'hash' | 'none' | 'auto';
   rootURL: string;
   APP: Record<string, unknown>;
 };
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,25 +1,70 @@
 {
   "compilerOptions": {
-    "target": "es2020",
-    "allowJs": true,
+    "target": "ES2021",
+    "module": "ES2020",
     "moduleResolution": "node",
-    "allowSyntheticDefaultImports": true,
-    "noImplicitAny": true,
-    "noImplicitThis": true,
-    "alwaysStrict": true,
-    "strictNullChecks": true,
-    "strictPropertyInitialization": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noImplicitReturns": true,
-    "noEmitOnError": false,
+
+    // Trying to check Ember apps and addons with `allowJs: true` is a recipe
+    // for many unresolveable type errors, because with *considerable* extra
+    // configuration it ends up including many files which are *not* valid and
+    // cannot be: they *appear* to be resolve-able to TS, but are in fact not in
+    // valid Node-resolveable locations and may not have TS-ready types. This
+    // will likely improve over time
+    "allowJs": true,
+
+    // --- TS for SemVer Types compatibility
+    // Strictness settings -- you should *not* change these: Ember code is not
+    // guaranteed to type check with these set to looser values.
+    "strict": true,
+    "noUncheckedIndexedAccess": true,
+
+    // Interop: these are viral and will require anyone downstream of your
+    // package to *also* set them to true. If you *must* enable them to consume
+    // an upstream package, you should document that for downstream consumers to
+    // be aware of.
+    //
+    // These *are* safe for apps to enable, since they do not *have* downstream
+    // consumers; but leaving them off is still preferred when possible, since
+    // it makes it easier to switch between apps and addons and have the same
+    // rules for what can be imported and how.
+    "allowSyntheticDefaultImports": false,
+    "esModuleInterop": false,
+
+    // --- Lint-style rules
+
+    // TypeScript also supplies some lint-style checks; nearly all of them are
+    // better handled by ESLint with the `@typescript-eslint`. This one is more
+    // like a safety check, though, so we leave it on.
+    "noPropertyAccessFromIndexSignature": true,
+
+    // --- Compilation/integration settings
+    // Setting `noEmitOnError` here allows ember-cli-typescript to catch errors
+    // and inject them into Ember CLI's build error reporting, which provides
+    // nice feedback for when
+    "noEmitOnError": true,
+
+    // We use Babel for emitting runtime code, because it's very important that
+    // we always and only use the same transpiler for non-stable features, in
+    // particular decorators. If you were to change this to `true`, it could
+    // lead to accidentally generating code with `tsc` instead of Babel, and
+    // could thereby result in broken code at runtime.
     "noEmit": true,
+
+    // Ember makes heavy use of decorators; TS does not support them at all
+    // without this flag.
+    "experimentalDecorators": true,
+
+    // Support generation of source maps. Note: you must *also* enable source
+    // maps in your `ember-cli-babel` config and/or `babel.config.js`.
+    "declaration": true,
+    "declarationMap": true,
     "inlineSourceMap": true,
     "inlineSources": true,
+
+    // The combination of `baseUrl` with `paths` allows Ember's classic package
+    // layout, which is not resolveable with the Node resolution algorithm, to
+    // work with TypeScript.
     "baseUrl": ".",
-    "module": "es6",
-    "experimentalDecorators": true,
     "paths": {
       "dummy/tests/*": [
         "tests/*"