react-photo-album - npm Package Compare versions

Comparing version 2.0.0-rc.2 to 2.0.0-rc.3

dist/index.d.ts

@@ -85,4 +85,2 @@ import * as React from 'react';
     rowConstraints?: ResponsiveParameter<RowConstraints>;
-    /** Additional columnn constraints */
-    columnConstraints?: ResponsiveParameter<ColumnConstraints>;
     /** Photo album width at various viewport sizes. */
@@ -137,4 +135,2 @@ sizes?: ResponsiveSizes;
     columns: number;
-    /** Additional column constraints */
-    columnConstraints?: ColumnConstraints;
 };
@@ -194,6 +190,2 @@ declare type LayoutOptions<T extends Photo = Photo> = ColumnsLayoutOptions<T> | RowsLayoutOptions<T>;
 };
-declare type ColumnConstraints = {
-    /** minimum number of columns in 'masonry' or 'columns' layout when there isn't enough photos to fill all the columns */
-    minColumns?: number;
-};
 /** internal instrumentation for research and performance testing purposes, subject to change without notice */
@@ -208,2 +200,2 @@ declare type Instrumentation = {
 
-export { ClickHandler, ColumnConstraints, ColumnContainerProps, ColumnsLayoutOptions, ComponentsProps, ComponentsPropsParameter, ContainerProps, GenericLayoutOptions, Image, Instrumentation, LayoutOptions, LayoutType, Photo, PhotoAlbum, PhotoAlbumProps, PhotoLayout, PhotoProps, RenderColumnContainer, RenderContainer, RenderContainerProps, RenderPhoto, RenderRowContainer, ResponsiveParameter, ResponsiveParameterProvider, ResponsiveSizes, RowConstraints, RowContainerProps, RowsLayoutOptions, PhotoAlbum as default };
+export { ClickHandler, ColumnContainerProps, ColumnsLayoutOptions, ComponentsProps, ComponentsPropsParameter, ContainerProps, GenericLayoutOptions, Image, Instrumentation, LayoutOptions, LayoutType, Photo, PhotoAlbum, PhotoAlbumProps, PhotoLayout, PhotoProps, RenderColumnContainer, RenderContainer, RenderContainerProps, RenderPhoto, RenderRowContainer, ResponsiveParameter, ResponsiveParameterProvider, ResponsiveSizes, RowConstraints, RowContainerProps, RowsLayoutOptions, PhotoAlbum as default };

dist/index.js

@@ -176,7 +176,7 @@ 'use strict';
         return undefined;
-    const result = [];
+    const layout = [];
     for (let i = 1; i < path.length; i += 1) {
         const row = photos.map((photo, index) => ({ photo, index })).slice(+path[i - 1], +path[i]);
         const height = getCommonHeight(row.map(({ photo }) => photo), containerWidth, spacing, padding);
-        result.push(row.map(({ photo, index }, photoIndex) => ({
+        layout.push(row.map(({ photo, index }, photoIndex) => ({
             photo,
@@ -192,4 +192,4 @@ layout: {
     }
-    (_b = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onFinishLayout) === null || _b === void 0 ? void 0 : _b.call(instrumentation, result);
-    return result;
+    (_b = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onFinishLayout) === null || _b === void 0 ? void 0 : _b.call(instrumentation, layout);
+    return layout;
 };
@@ -397,3 +397,2 @@
 const computeColumnsModel = ({ photos, layoutOptions, targetColumnWidth, instrumentation, }) => {
-    var _a;
     const { columns, spacing, padding, containerWidth } = layoutOptions;
@@ -403,8 +402,9 @@ const columnsGaps = [];
     if (photos.length <= columns) {
-        for (let index = 0; index < photos.length; index += 1) {
-            columnsGaps[index] = 2 * padding;
-            columnsRatios[index] = ratio(photos[index]);
+        const averageRatio = photos.length > 0 ? photos.reduce((acc, photo) => acc + ratio(photo), 0) / photos.length : 1;
+        for (let i = 0; i < columns; i += 1) {
+            columnsGaps[i] = 2 * padding;
+            columnsRatios[i] = i < photos.length ? ratio(photos[i]) : averageRatio;
         }
         const columnsModel = buildColumnsModel({
-            path: Array.from({ length: photos.length + 1 }).map((_, index) => index),
+            path: Array.from({ length: columns + 1 }).map((_, index) => Math.min(index, photos.length)),
             photos,
@@ -417,8 +417,2 @@ columnsRatios,
         });
-        for (let i = photos.length; i < (((_a = layoutOptions.columnConstraints) === null || _a === void 0 ? void 0 : _a.minColumns) || 0); i += 1) {
-            columnsGaps[i] = 0;
-            columnsRatios[i] =
-                photos.length > 0 ? photos.reduce((acc, photo) => acc + ratio(photo), 0) / photos.length : 1;
-            columnsModel[i] = [];
-        }
         return { columnsGaps, columnsRatios, columnsModel };
@@ -483,14 +477,7 @@ }
 const computeColumnsLayout = ({ photos, layoutOptions, instrumentation, }) => {
-    var _a, _b, _c;
+    var _a, _b;
     (_a = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onStartLayout) === null || _a === void 0 ? void 0 : _a.call(instrumentation);
-    const result = computeLayout({
-        photos,
-        layoutOptions: {
-            ...layoutOptions,
-            columns: Math.min(layoutOptions.columns, Math.max(photos.length, ((_b = layoutOptions.columnConstraints) === null || _b === void 0 ? void 0 : _b.minColumns) || 0)),
-        },
-        instrumentation,
-    });
-    (_c = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onFinishLayout) === null || _c === void 0 ? void 0 : _c.call(instrumentation, result);
-    return result;
+    const layout = computeLayout({ photos, layoutOptions, instrumentation });
+    (_b = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onFinishLayout) === null || _b === void 0 ? void 0 : _b.call(instrumentation, layout);
+    return layout;
 };
@@ -542,7 +529,6 @@
 const computeMasonryLayout = (props) => {
-    var _a, _b, _c;
+    var _a, _b;
     const { photos, layoutOptions, instrumentation } = props;
-    const { spacing, padding, containerWidth } = layoutOptions;
-    const columns = Math.min(layoutOptions.columns, Math.max(photos.length, ((_a = layoutOptions.columnConstraints) === null || _a === void 0 ? void 0 : _a.minColumns) || 0));
-    (_b = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onStartLayout) === null || _b === void 0 ? void 0 : _b.call(instrumentation);
+    const { columns, spacing, padding, containerWidth } = layoutOptions;
+    (_a = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onStartLayout) === null || _a === void 0 ? void 0 : _a.call(instrumentation);
     const columnWidth = (containerWidth - spacing * (columns - 1) - 2 * padding * columns) / columns;
@@ -568,3 +554,3 @@ if (columnWidth <= 0) {
     }, Array.from({ length: columns }).map(() => []));
-    const result = columnsModel.map((column) => column.map(({ photo, index }, photoIndex) => ({
+    const layout = columnsModel.map((column) => column.map(({ photo, index }, photoIndex) => ({
         photo,
@@ -579,4 +565,4 @@ layout: {
     })));
-    (_c = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onFinishLayout) === null || _c === void 0 ? void 0 : _c.call(instrumentation, result);
-    return result;
+    (_b = instrumentation === null || instrumentation === void 0 ? void 0 : instrumentation.onFinishLayout) === null || _b === void 0 ? void 0 : _b.call(instrumentation, layout);
+    return layout;
 };
@@ -683,3 +669,3 @@
 
-const resolveLayoutOptions = ({ layout, onClick, viewportWidth, containerWidth, targetRowHeight, rowConstraints, columnConstraints, columns, spacing, padding, sizes, }) => ({
+const resolveLayoutOptions = ({ layout, onClick, viewportWidth, containerWidth, targetRowHeight, rowConstraints, columns, spacing, padding, sizes, }) => ({
     layout,
@@ -699,3 +685,2 @@ onClick,
     rowConstraints: unwrapParameter(rowConstraints, containerWidth),
-    columnConstraints: unwrapParameter(columnConstraints, containerWidth),
     sizes,
@@ -702,0 +687,0 @@ });

package.json

 {
     "name": "react-photo-album",
-    "version": "2.0.0-rc.2",
+    "version": "2.0.0-rc.3",
     "description": "Responsive photo gallery component for React",
@@ -5,0 +5,0 @@ "author": "Igor Danchenko",

No alert changes

Worsened metrics

Total package byte prevSize

84118

decreased by-2.21%

Lines of code

1533

decreased by-2.42%

No dependency changes