@bbki.ng/components 1.5.35 → 1.5.36
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1 -0
- package/dist/index.js +10 -6
- package/dist/index.mjs +10 -6
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -257,6 +257,7 @@ interface RandomRowsLayoutProps {
|
|
|
257
257
|
|
|
258
258
|
declare type ImageRenderer = (Img: ReactElement, index: number, col: number, randBool: boolean) => ReactNode;
|
|
259
259
|
interface GalleryProps extends Omit<RandomRowsLayoutProps, "classNames" | "cellsCount" | "cellRenderer"> {
|
|
260
|
+
className?: string;
|
|
260
261
|
images: ImgProps[];
|
|
261
262
|
children?: ReactNode;
|
|
262
263
|
imageRenderer?: ImageRenderer;
|
package/dist/index.js
CHANGED
|
@@ -974,7 +974,7 @@ var generateRandomColNum = (total) => {
|
|
|
974
974
|
}
|
|
975
975
|
return colNumArr;
|
|
976
976
|
};
|
|
977
|
-
var RandomRowsLayout = (props) => {
|
|
977
|
+
var RandomRowsLayout = import_react20.default.memo((props) => {
|
|
978
978
|
const {
|
|
979
979
|
cellsCount,
|
|
980
980
|
cellRenderer,
|
|
@@ -985,7 +985,7 @@ var RandomRowsLayout = (props) => {
|
|
|
985
985
|
const indexRef = import_react20.default.useRef(0);
|
|
986
986
|
import_react20.default.useEffect(() => {
|
|
987
987
|
indexRef.current = 0;
|
|
988
|
-
});
|
|
988
|
+
}, []);
|
|
989
989
|
return /* @__PURE__ */ import_react20.default.createElement("div", {
|
|
990
990
|
className: classNames8
|
|
991
991
|
}, colNums.map((colNum, row) => {
|
|
@@ -1004,7 +1004,9 @@ var RandomRowsLayout = (props) => {
|
|
|
1004
1004
|
}, cellRenderer(indexRef.current - 1, randBoolArr[col], col));
|
|
1005
1005
|
}));
|
|
1006
1006
|
}));
|
|
1007
|
-
}
|
|
1007
|
+
}, (prevProps, nextProps) => {
|
|
1008
|
+
return prevProps.cellsCount === nextProps.cellsCount;
|
|
1009
|
+
});
|
|
1008
1010
|
|
|
1009
1011
|
// src/img/Gallery.tsx
|
|
1010
1012
|
var defaultImageRenderer = (img, index, col) => {
|
|
@@ -1019,11 +1021,13 @@ var Gallery = (props) => {
|
|
|
1019
1021
|
const _a = props, {
|
|
1020
1022
|
images,
|
|
1021
1023
|
children,
|
|
1022
|
-
imageRenderer = defaultImageRenderer
|
|
1024
|
+
imageRenderer = defaultImageRenderer,
|
|
1025
|
+
className = ""
|
|
1023
1026
|
} = _a, rest = __objRest(_a, [
|
|
1024
1027
|
"images",
|
|
1025
1028
|
"children",
|
|
1026
|
-
"imageRenderer"
|
|
1029
|
+
"imageRenderer",
|
|
1030
|
+
"className"
|
|
1027
1031
|
]);
|
|
1028
1032
|
const renderImage = (index, isLargeImage, col) => {
|
|
1029
1033
|
const image = images[index];
|
|
@@ -1035,7 +1039,7 @@ var Gallery = (props) => {
|
|
|
1035
1039
|
})), index, col, isLargeImage);
|
|
1036
1040
|
};
|
|
1037
1041
|
return /* @__PURE__ */ import_react21.default.createElement("div", {
|
|
1038
|
-
className: "w-full flex justify-center"
|
|
1042
|
+
className: (0, import_classnames12.default)("w-full flex justify-center", className)
|
|
1039
1043
|
}, /* @__PURE__ */ import_react21.default.createElement(RandomRowsLayout, __spreadValues({
|
|
1040
1044
|
classNames: "mx-32 mt-128 max-w-screen-xl",
|
|
1041
1045
|
cellsCount: images.length,
|
package/dist/index.mjs
CHANGED
|
@@ -916,7 +916,7 @@ var generateRandomColNum = (total) => {
|
|
|
916
916
|
}
|
|
917
917
|
return colNumArr;
|
|
918
918
|
};
|
|
919
|
-
var RandomRowsLayout = (props) => {
|
|
919
|
+
var RandomRowsLayout = React19.memo((props) => {
|
|
920
920
|
const {
|
|
921
921
|
cellsCount,
|
|
922
922
|
cellRenderer,
|
|
@@ -927,7 +927,7 @@ var RandomRowsLayout = (props) => {
|
|
|
927
927
|
const indexRef = React19.useRef(0);
|
|
928
928
|
React19.useEffect(() => {
|
|
929
929
|
indexRef.current = 0;
|
|
930
|
-
});
|
|
930
|
+
}, []);
|
|
931
931
|
return /* @__PURE__ */ React19.createElement("div", {
|
|
932
932
|
className: classNames8
|
|
933
933
|
}, colNums.map((colNum, row) => {
|
|
@@ -946,7 +946,9 @@ var RandomRowsLayout = (props) => {
|
|
|
946
946
|
}, cellRenderer(indexRef.current - 1, randBoolArr[col], col));
|
|
947
947
|
}));
|
|
948
948
|
}));
|
|
949
|
-
}
|
|
949
|
+
}, (prevProps, nextProps) => {
|
|
950
|
+
return prevProps.cellsCount === nextProps.cellsCount;
|
|
951
|
+
});
|
|
950
952
|
|
|
951
953
|
// src/img/Gallery.tsx
|
|
952
954
|
var defaultImageRenderer = (img, index, col) => {
|
|
@@ -961,11 +963,13 @@ var Gallery = (props) => {
|
|
|
961
963
|
const _a = props, {
|
|
962
964
|
images,
|
|
963
965
|
children,
|
|
964
|
-
imageRenderer = defaultImageRenderer
|
|
966
|
+
imageRenderer = defaultImageRenderer,
|
|
967
|
+
className = ""
|
|
965
968
|
} = _a, rest = __objRest(_a, [
|
|
966
969
|
"images",
|
|
967
970
|
"children",
|
|
968
|
-
"imageRenderer"
|
|
971
|
+
"imageRenderer",
|
|
972
|
+
"className"
|
|
969
973
|
]);
|
|
970
974
|
const renderImage = (index, isLargeImage, col) => {
|
|
971
975
|
const image = images[index];
|
|
@@ -977,7 +981,7 @@ var Gallery = (props) => {
|
|
|
977
981
|
})), index, col, isLargeImage);
|
|
978
982
|
};
|
|
979
983
|
return /* @__PURE__ */ React20.createElement("div", {
|
|
980
|
-
className: "w-full flex justify-center"
|
|
984
|
+
className: classnames3("w-full flex justify-center", className)
|
|
981
985
|
}, /* @__PURE__ */ React20.createElement(RandomRowsLayout, __spreadValues({
|
|
982
986
|
classNames: "mx-32 mt-128 max-w-screen-xl",
|
|
983
987
|
cellsCount: images.length,
|