@bbki.ng/components 1.5.38 → 1.5.39
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 -13
- package/dist/index.mjs +10 -13
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -865,11 +865,6 @@ var calcDefaultImgSize = (img, defaultWidth, scale) => {
|
|
|
865
865
|
height: finalWidth / whRatio
|
|
866
866
|
};
|
|
867
867
|
};
|
|
868
|
-
var delay = (time) => {
|
|
869
|
-
return new Promise((resolve) => {
|
|
870
|
-
setTimeout(resolve, time);
|
|
871
|
-
});
|
|
872
|
-
};
|
|
873
868
|
|
|
874
869
|
// src/img/Img.tsx
|
|
875
870
|
var emptyDataURL = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
|
|
@@ -881,7 +876,8 @@ var Img = (props) => {
|
|
|
881
876
|
avgColor,
|
|
882
877
|
thumbnailSrc,
|
|
883
878
|
processType,
|
|
884
|
-
size
|
|
879
|
+
size,
|
|
880
|
+
removeBlurBgAfterLoad
|
|
885
881
|
} = props;
|
|
886
882
|
const { width, height } = calcDefaultImgSize(props, renderedWidth, size === "normal" ? 0.6 : 1);
|
|
887
883
|
const [loaded, setLoaded] = (0, import_react19.useState)(false);
|
|
@@ -889,15 +885,14 @@ var Img = (props) => {
|
|
|
889
885
|
const baseWrapperStyle = {
|
|
890
886
|
width: "initial",
|
|
891
887
|
height: "initial",
|
|
892
|
-
backgroundColor: avgColor || "unset"
|
|
893
|
-
};
|
|
894
|
-
const dynamicWrapperStyle = loaded ? {
|
|
895
|
-
backgroundImage: "none"
|
|
896
|
-
} : {
|
|
897
888
|
backgroundSize: "cover",
|
|
898
889
|
backgroundPosition: "0% 0%",
|
|
890
|
+
backgroundColor: avgColor || "#f1f1f1",
|
|
899
891
|
backgroundImage: `url(${thumbnailSrc ? thumbnailSrc : addOssWebpProcessStyle(src, "thumbnail" /* THUMBNAIL */)})`
|
|
900
892
|
};
|
|
893
|
+
const dynamicWrapperStyle = loaded && removeBlurBgAfterLoad ? {
|
|
894
|
+
backgroundImage: "none"
|
|
895
|
+
} : {};
|
|
901
896
|
const handleImgLoad = (img) => {
|
|
902
897
|
const updateFunc = async () => {
|
|
903
898
|
const p = "decode" in img ? img.decode : Promise.resolve;
|
|
@@ -905,11 +900,13 @@ var Img = (props) => {
|
|
|
905
900
|
await p();
|
|
906
901
|
} catch (e) {
|
|
907
902
|
}
|
|
908
|
-
await delay(500);
|
|
909
903
|
setDecoded(true);
|
|
910
|
-
await delay(500);
|
|
911
904
|
setLoaded(true);
|
|
912
905
|
};
|
|
906
|
+
if (img.complete) {
|
|
907
|
+
updateFunc().then();
|
|
908
|
+
return;
|
|
909
|
+
}
|
|
913
910
|
img.onload = updateFunc;
|
|
914
911
|
};
|
|
915
912
|
return /* @__PURE__ */ import_react19.default.createElement("span", {
|
package/dist/index.mjs
CHANGED
|
@@ -807,11 +807,6 @@ var calcDefaultImgSize = (img, defaultWidth, scale) => {
|
|
|
807
807
|
height: finalWidth / whRatio
|
|
808
808
|
};
|
|
809
809
|
};
|
|
810
|
-
var delay = (time) => {
|
|
811
|
-
return new Promise((resolve) => {
|
|
812
|
-
setTimeout(resolve, time);
|
|
813
|
-
});
|
|
814
|
-
};
|
|
815
810
|
|
|
816
811
|
// src/img/Img.tsx
|
|
817
812
|
var emptyDataURL = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
|
|
@@ -823,7 +818,8 @@ var Img = (props) => {
|
|
|
823
818
|
avgColor,
|
|
824
819
|
thumbnailSrc,
|
|
825
820
|
processType,
|
|
826
|
-
size
|
|
821
|
+
size,
|
|
822
|
+
removeBlurBgAfterLoad
|
|
827
823
|
} = props;
|
|
828
824
|
const { width, height } = calcDefaultImgSize(props, renderedWidth, size === "normal" ? 0.6 : 1);
|
|
829
825
|
const [loaded, setLoaded] = useState5(false);
|
|
@@ -831,15 +827,14 @@ var Img = (props) => {
|
|
|
831
827
|
const baseWrapperStyle = {
|
|
832
828
|
width: "initial",
|
|
833
829
|
height: "initial",
|
|
834
|
-
backgroundColor: avgColor || "unset"
|
|
835
|
-
};
|
|
836
|
-
const dynamicWrapperStyle = loaded ? {
|
|
837
|
-
backgroundImage: "none"
|
|
838
|
-
} : {
|
|
839
830
|
backgroundSize: "cover",
|
|
840
831
|
backgroundPosition: "0% 0%",
|
|
832
|
+
backgroundColor: avgColor || "#f1f1f1",
|
|
841
833
|
backgroundImage: `url(${thumbnailSrc ? thumbnailSrc : addOssWebpProcessStyle(src, "thumbnail" /* THUMBNAIL */)})`
|
|
842
834
|
};
|
|
835
|
+
const dynamicWrapperStyle = loaded && removeBlurBgAfterLoad ? {
|
|
836
|
+
backgroundImage: "none"
|
|
837
|
+
} : {};
|
|
843
838
|
const handleImgLoad = (img) => {
|
|
844
839
|
const updateFunc = async () => {
|
|
845
840
|
const p = "decode" in img ? img.decode : Promise.resolve;
|
|
@@ -847,11 +842,13 @@ var Img = (props) => {
|
|
|
847
842
|
await p();
|
|
848
843
|
} catch (e) {
|
|
849
844
|
}
|
|
850
|
-
await delay(500);
|
|
851
845
|
setDecoded(true);
|
|
852
|
-
await delay(500);
|
|
853
846
|
setLoaded(true);
|
|
854
847
|
};
|
|
848
|
+
if (img.complete) {
|
|
849
|
+
updateFunc().then();
|
|
850
|
+
return;
|
|
851
|
+
}
|
|
855
852
|
img.onload = updateFunc;
|
|
856
853
|
};
|
|
857
854
|
return /* @__PURE__ */ React18.createElement("span", {
|