react-justified-layout-ts 1.1.2 → 1.1.3

package/dist/TSJustifiedLayout.d.ts

@@ -10,5 +10,5 @@ export interface TSJustifiedLayoutProps {
     children: any[];
     showWidows?: boolean;
 }
-declare function TSJustifiedLayout({ children, layoutItems, itemSpacing, rowSpacing, showWidows, targetRowHeight, targetRowHeightTolerance, width }: TSJustifiedLayoutProps): React.JSX.Element;
+declare const TSJustifiedLayout: React.MemoExoticComponent<({ children, layoutItems, itemSpacing, rowSpacing, showWidows, targetRowHeight, targetRowHeightTolerance, width }: TSJustifiedLayoutProps) => React.JSX.Element>;
 export { TSJustifiedLayout };

package/dist/TSJustifiedLayout.js

@@ -25,7 +25,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TSJustifiedLayout = void 0;
 const react_1 = __importStar(require("react"));
-function TSJustifiedLayout({ children, layoutItems, itemSpacing = 10, rowSpacing = 10, showWidows = true, targetRowHeight = 320, targetRowHeightTolerance = .25, width }) {
+const TSJustifiedLayout = (0, react_1.memo)(({ children, layoutItems, itemSpacing = 10, rowSpacing = 10, showWidows = true, targetRowHeight = 320, targetRowHeightTolerance = .25, width }) => {
     const minAspectRatio = width / targetRowHeight * (1 - targetRowHeightTolerance);
     const maxAspectRatio = width / targetRowHeight * (1 + targetRowHeightTolerance);
     /**
@@ -82,7 +82,6 @@ function TSJustifiedLayout({ children, layoutItems, itemSpacing = 10, rowSpacing
     }
     const rows = [];
     let rowBuffer = [];
-    console.log(rows);
     layoutItems.forEach((value) => {
         const isItemSuccessfullyAdded = addItem(value);
         if (!isItemSuccessfullyAdded) {
@@ -90,7 +89,6 @@ function TSJustifiedLayout({ children, layoutItems, itemSpacing = 10, rowSpacing
         }
     });
     // Handle leftover content
-    console.log(rows);
     if (showWidows) {
         rows.push({ items: rowBuffer, height: rows.length === 0 ? targetRowHeight : rows[rows.length - 1].height });
     }
@@ -101,15 +99,14 @@ function TSJustifiedLayout({ children, layoutItems, itemSpacing = 10, rowSpacing
      */
     function renderChildren(isLast) {
         childNodeCounter++;
-        return (0, react_1.cloneElement)(children[childNodeCounter], Object.assign(Object.assign({}, children[childNodeCounter].props), { style: Object.assign(Object.assign(Object.assign({}, children[childNodeCounter].props.style), { maxWidth: '100%' }), (isLast ? { maxHeight: '100%' } : {})) }));
+        return (0, react_1.cloneElement)(children[childNodeCounter], Object.assign(Object.assign({}, children[childNodeCounter].props), { style: Object.assign(Object.assign(Object.assign({}, children[childNodeCounter].props.style), { maxWidth: "100%" }), (isLast ? { maxHeight: "100%" } : {})) }));
     }
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", { style: { width: "100%" } }),
         react_1.default.createElement("div", { style: { width: "100%" } }, rows.map((value, index, array) => {
             let isLastRow = index === array.length - 1 && showWidows;
             return react_1.default.createElement("div", { style: Object.assign({ display: "flex", flexDirection: "row", gap: itemSpacing, marginBottom: rowSpacing }, (isLastRow ? { height: value.height } : {})) }, value.items.map((aspectRatio) => {
                 return react_1.default.createElement("div", { style: isLastRow ? { aspectRatio: aspectRatio } : { flex: aspectRatio } }, renderChildren(isLastRow));
             }));
         }))));
-}
+});
 exports.TSJustifiedLayout = TSJustifiedLayout;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-justified-layout-ts",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "A component based off Flickr's justified layout that is compatible with Typescript",
   "main": "./dist/TSJustifiedLayout.js",
   "types": "./dist/TSJustifiedLayout.d.ts",