@snowcone-app/ui 0.2.0 → 0.2.2

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.js CHANGED
@@ -9768,6 +9768,7 @@ var HeroProductImage = memo2(function HeroProductImage2({
9768
9768
  const [prevUrl, setPrevUrl] = useState30(null);
9769
9769
  const [showNew, setShowNew] = useState30(false);
9770
9770
  const [renderedUrl, setRenderedUrl] = useState30(displayUrl);
9771
+ const [firstImageLoaded, setFirstImageLoaded] = useState30(false);
9771
9772
  const prevDisplayUrlRef = useRef22(displayUrl);
9772
9773
  const signHintShownRef = useRef22(false);
9773
9774
  useEffect31(() => {
@@ -9847,6 +9848,7 @@ var HeroProductImage = memo2(function HeroProductImage2({
9847
9848
  style,
9848
9849
  "data-hero-image": "true",
9849
9850
  children: [
9851
+ !firstImageLoaded && /* @__PURE__ */ jsx59("div", { className: "absolute inset-0 bg-muted-foreground/20 animate-pulse" }),
9850
9852
  renderedUrl && /* @__PURE__ */ jsx59(
9851
9853
  "img",
9852
9854
  {
@@ -9859,6 +9861,7 @@ var HeroProductImage = memo2(function HeroProductImage2({
9859
9861
  fetchPriority: "high",
9860
9862
  onClick,
9861
9863
  onLoad: () => {
9864
+ setFirstImageLoaded(true);
9862
9865
  if (!onLoadCalledRef.current && onLoad) {
9863
9866
  onLoadCalledRef.current = true;
9864
9867
  onLoad();
@@ -9866,6 +9869,7 @@ var HeroProductImage = memo2(function HeroProductImage2({
9866
9869
  onUrlGeneratedRef.current?.(renderedUrl);
9867
9870
  },
9868
9871
  onError: () => {
9872
+ setFirstImageLoaded(true);
9869
9873
  onError?.();
9870
9874
  if (process.env.NODE_ENV !== "production" && !signHintShownRef.current && renderedUrl && /\/[A-Za-z0-9]+\?/.test(renderedUrl) && !/[?&]signature=/.test(renderedUrl)) {
9871
9875
  signHintShownRef.current = true;
@@ -9891,8 +9895,7 @@ var HeroProductImage = memo2(function HeroProductImage2({
9891
9895
  },
9892
9896
  onTransitionEnd: handleCrossfadeEnd
9893
9897
  }
9894
- ),
9895
- !renderedUrl && /* @__PURE__ */ jsx59("div", { className: "absolute inset-0 bg-zinc-200" })
9898
+ )
9896
9899
  ]
9897
9900
  }
9898
9901
  );