@nordicsemiconductor/pc-nrfconnect-shared 113.0.0 → 114.0.0

package/Changelog.md

@@ -7,6 +7,12 @@ This project does _not_ adhere to
 [Semantic Versioning](https://semver.org/spec/v2.0.0.html) but contrary to it
 every new version is a new major version.
 
+## 114 - 2023-09-26
+
+### Fixed
+
+-   `MasonryLayout` excess scrolling white space.
+
 ## 113 - 2023-09-25
 
 ### Fixed

package/coverage/cobertura-coverage.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" ?>
 <!DOCTYPE coverage SYSTEM "http://cobertura.sourceforge.net/xml/coverage-04.dtd">
-<coverage lines-valid="3208" lines-covered="1788" line-rate="0.5573" branches-valid="1532" branches-covered="448" branch-rate="0.2924" timestamp="1695639056715" complexity="0" version="0.1">
+<coverage lines-valid="3208" lines-covered="1788" line-rate="0.5573" branches-valid="1532" branches-covered="448" branch-rate="0.2924" timestamp="1695717218556" complexity="0" version="0.1">
   <sources>
     <source>/home/vsts/work/1/s</source>
   </sources>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@nordicsemiconductor/pc-nrfconnect-shared",
-    "version": "113.0.0",
+    "version": "114.0.0",
     "description": "Shared commodities for developing pc-nrfconnect-* packages",
     "repository": {
         "type": "git",

package/src/MasonryLayout/MasonryLayout.tsx

@@ -103,7 +103,7 @@ export default ({
         const generateMetaData = (col: number) => {
             let child = masonryLayoutRef.current?.firstElementChild;
             const offsetHeightMatrix: number[][] = [];
-            const scrollHeightMatrix: number[][] = [];
+            const scrollHeightOffsetMatrix: number[][] = [];
             const zeroHeightChildren: boolean[] = [];
 
             let i = 0;
@@ -114,12 +114,12 @@ export default ({
 
                         if (offsetHeightMatrix[rowIndex] === undefined) {
                             offsetHeightMatrix[rowIndex] = [];
-                            scrollHeightMatrix[rowIndex] = [];
+                            scrollHeightOffsetMatrix[rowIndex] = [];
                         }
 
                         const offsetHeightRow = offsetHeightMatrix[rowIndex];
-                        const scrollHeightRow = scrollHeightMatrix[rowIndex];
-                        let scrollHeightRowDiff = 0;
+                        const scrollHeightRow =
+                            scrollHeightOffsetMatrix[rowIndex];
                         const columnIndex = i % col;
 
                         i += 1;
@@ -128,22 +128,17 @@ export default ({
                             Number.parseInt(styles.margin, 10)
                         ) {
                             offsetHeightRow[columnIndex] = 0;
+                            scrollHeightRow[columnIndex] = 0;
                             zeroHeightChildren.push(true);
                         } else {
                             offsetHeightRow[columnIndex] =
                                 child.offsetHeight + 1; // 1px to round as value might be decimal
-                            scrollHeightRowDiff =
+                            scrollHeightRow[columnIndex] =
                                 child.scrollHeight +
                                 9 -
                                 offsetHeightRow[columnIndex]; // 8 border bottom + 1px to round as value might be decimal
                             zeroHeightChildren.push(false);
                         }
-
-                        scrollHeightRow[columnIndex] =
-                            offsetHeightMatrix.reduce(
-                                (p, c) => p + c[columnIndex],
-                                0
-                            ) + scrollHeightRowDiff;
                     }
 
                     child = child.nextElementSibling;
@@ -152,7 +147,7 @@ export default ({
 
             return {
                 offsetHeightMatrix,
-                scrollHeightMatrix,
+                scrollHeightOffsetMatrix,
                 hiddenChildren: zeroHeightChildren,
             };
         };
@@ -160,22 +155,32 @@ export default ({
         const calcData = (col: number) => {
             const metaData = generateMetaData(col);
             const heights: number[] = Array(col).fill(0);
+            const individualHeights: number[][] = [];
             const newOrder: number[] = [];
 
-            metaData.offsetHeightMatrix.forEach(row => {
-                row.forEach(itemHeight => {
+            metaData.offsetHeightMatrix.forEach((row, rowIndex) => {
+                row.forEach((itemHeight, columnIndex) => {
                     const smallest =
                         heights.findIndex(h => h === Math.min(...heights)) ?? 0;
                     heights[smallest] += itemHeight;
+
+                    if (individualHeights[rowIndex] === undefined) {
+                        individualHeights[rowIndex] = [];
+                    }
+
+                    // add all offset heights of above items excluding scroll height of above items but including scoll geight of this item
+                    individualHeights[rowIndex][smallest] =
+                        heights[smallest] +
+                        metaData.scrollHeightOffsetMatrix[rowIndex][
+                            columnIndex
+                        ];
+
                     newOrder.push(smallest + 1);
                 });
             });
 
             return {
-                maxHeight: Math.max(
-                    ...heights,
-                    ...metaData.scrollHeightMatrix.flat()
-                ),
+                maxHeight: Math.max(...individualHeights.flat()),
                 order: newOrder,
                 columnHeights: heights,
                 columns: Math.min(

package/typings/generated/src/MasonryLayout/MasonryLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MasonryLayout.d.ts","sourceRoot":"","sources":["../../../../src/MasonryLayout/MasonryLayout.tsx"],"names":[],"mappings":"AAKA,OAAc,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAM9E,UAAU,uBAAuB;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAiED;;;;;;GAMG;6DAKA,kBAAkB,uBAAuB,CAAC;AAJ7C,wBAiKE"}
+{"version":3,"file":"MasonryLayout.d.ts","sourceRoot":"","sources":["../../../../src/MasonryLayout/MasonryLayout.tsx"],"names":[],"mappings":"AAKA,OAAc,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAM9E,UAAU,uBAAuB;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAiED;;;;;;GAMG;6DAKA,kBAAkB,uBAAuB,CAAC;AAJ7C,wBAsKE"}