@dmsi/wedgekit-react 0.0.1228 → 0.0.1230

package/dist/components/index.cjs

@@ -7282,7 +7282,8 @@ function Thumbnail({
   alt,
   isActive,
   onClick,
-  isPlaceholder = false
+  isPlaceholder = false,
+  onImageError
 }) {
   const [imageError, setImageError] = (0, import_react29.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
@@ -7307,6 +7308,7 @@ function Thumbnail({
           draggable: false,
           loading: "lazy",
           onError: () => {
+            onImageError == null ? void 0 : onImageError(src);
             setImageError(true);
           }
         }
@@ -7397,6 +7399,7 @@ function ProductPrimaryImage({
   scrollToZoomEnabled = false,
   className = "",
   isPlaceholder = false,
+  onImageError,
   onZoomPositionChange,
   onScrollZoom
 }) {
@@ -7486,12 +7489,13 @@ function ProductPrimaryImage({
   }, [scrollToZoomEnabled, zoomEnabled, active, onScrollZoom]);
   const handleImgError = (0, import_react30.useCallback)(
     (e) => {
+      onImageError == null ? void 0 : onImageError(imageSrc);
       if (!placeholderImageUri) return;
       const img = e.currentTarget;
       if (img.src === placeholderImageUri) return;
       img.src = placeholderImageUri;
     },
-    []
+    [imageSrc, onImageError]
   );
   const pt = lastPointRef.current;
   let lensStyle;
@@ -7740,6 +7744,7 @@ function MobileImageCarousel({
   width = 483,
   height = 483,
   onChangeIndex,
+  onImageError,
   className = ""
 }) {
   const containerRef = (0, import_react32.useRef)(null);
@@ -7894,6 +7899,7 @@ function MobileImageCarousel({
                     className: "w-full h-full object-cover",
                     draggable: false,
                     loading: distance <= 1 ? "eager" : "lazy",
+                    onError: () => onImageError == null ? void 0 : onImageError(image.src),
                     style: {
                       aspectRatio: "1 / 1"
                     }
@@ -8034,12 +8040,13 @@ function useProductImagePreview(props) {
 }
 
 // src/components/ProductImagePreview/index.tsx
+var import_react34 = require("react");
 var import_jsx_runtime53 = require("react/jsx-runtime");
 var placeholderImageUri2 = "/placeholder.svg";
-var PLACEHOLDER_IMAGES = [
-  { src: "", alt: "placeholder" },
-  { src: "", alt: "placeholder" }
-];
+function hasValidImageSource(src) {
+  const normalizedSrc = src == null ? void 0 : src.trim();
+  return !!normalizedSrc && normalizedSrc !== placeholderImageUri2 && !normalizedSrc.endsWith("/placeholder.svg") && !normalizedSrc.includes("/placeholder.svg?");
+}
 function ProductImagePreview(props) {
   const {
     width = 483,
@@ -8056,6 +8063,26 @@ function ProductImagePreview(props) {
     zoomWindowOffset = 10,
     testid
   } = props;
+  const [failedImageSources, setFailedImageSources] = (0, import_react34.useState)([]);
+  const imageSourceKey = (0, import_react34.useMemo)(
+    () => images.map((image) => image.src).join("|"),
+    [images]
+  );
+  const validImages = (0, import_react34.useMemo)(
+    () => images.filter(
+      (image) => hasValidImageSource(image.src) && failedImageSources.indexOf(image.src) === -1
+    ),
+    [failedImageSources, images]
+  );
+  const handleImageError = (0, import_react34.useCallback)((src) => {
+    if (!src) return;
+    setFailedImageSources(
+      (previousSources) => previousSources.indexOf(src) >= 0 ? previousSources : [...previousSources, src]
+    );
+  }, []);
+  (0, import_react34.useEffect)(() => {
+    setFailedImageSources([]);
+  }, [imageSourceKey]);
   const isMobile = useMatchesMobile();
   const {
     zoomPoint,
@@ -8069,7 +8096,7 @@ function ProductImagePreview(props) {
     handleZoomPositionChange,
     handleScrollZoom
   } = useProductImagePreview({
-    images,
+    images: validImages,
     currentIndex,
     zoomEnabled,
     zoomFactor,
@@ -8078,7 +8105,7 @@ function ProductImagePreview(props) {
     isMobile
   });
   if (typeof isMobile === "undefined") return null;
-  if (isMobile && !images.length)
+  if (isMobile && !validImages.length)
     return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       "img",
       {
@@ -8095,7 +8122,7 @@ function ProductImagePreview(props) {
       }
     );
   const effectiveZoomEnabled = zoomEnabled && !isMobile;
-  const showDesktopThumbnails = images.length !== 1;
+  const showDesktopThumbnails = validImages.length > 1;
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
     Stack,
     {
@@ -8115,7 +8142,8 @@ function ProductImagePreview(props) {
               scrollToZoomEnabled: scrollToZoomEnabled && !isMobile,
               onZoomPositionChange: handleZoomPositionChange,
               onScrollZoom: handleScrollZoom,
-              isPlaceholder: images.length === 0
+              isPlaceholder: validImages.length === 0,
+              onImageError: handleImageError
             }
           ) }),
           effectiveZoomEnabled && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
@@ -8136,31 +8164,30 @@ function ProductImagePreview(props) {
         isMobile && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
           MobileImageCarousel,
           {
-            images,
+            images: validImages,
             currentIndex: safeIndex,
             width,
             height,
-            onChangeIndex: handleSelect
+            onChangeIndex: handleSelect,
+            onImageError: handleImageError
           }
         ),
-        showDesktopThumbnails && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "hidden md:block", children: images.length <= 3 ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        showDesktopThumbnails && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "hidden md:block", children: validImages.length <= 3 ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
           "div",
           {
             className: "flex justify-center gap-4",
             style: { width: "100%", maxWidth: width },
             "aria-label": "Product image thumbnails",
-            children: (images.length === 0 ? PLACEHOLDER_IMAGES : images).map(
-              (img, i) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { style: { maxWidth: "115px" }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-                Thumbnail,
-                {
-                  src: img.src,
-                  alt: img.alt || `Thumbnail ${i + 1}`,
-                  isActive: i === safeIndex,
-                  onClick: () => handleSelect(i),
-                  isPlaceholder: images.length === 0
-                }
-              ) }, img.src + i)
-            )
+            children: validImages.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { style: { maxWidth: "115px" }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+              Thumbnail,
+              {
+                src: img.src,
+                alt: img.alt || `Thumbnail ${i + 1}`,
+                isActive: i === safeIndex,
+                onClick: () => handleSelect(i),
+                onImageError: handleImageError
+              }
+            ) }, img.src + i))
           }
         ) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
           Grid,
@@ -8172,25 +8199,23 @@ function ProductImagePreview(props) {
               maxWidth: width
             },
             columns: thumbsPerRow > 12 ? 12 : thumbsPerRow < 1 ? 1 : thumbsPerRow,
-            children: (images.length === 0 ? PLACEHOLDER_IMAGES : images).map(
-              (img, i) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
-                Thumbnail,
-                {
-                  src: img.src,
-                  alt: img.alt || `Thumbnail ${i + 1}`,
-                  isActive: i === safeIndex,
-                  onClick: () => handleSelect(i),
-                  isPlaceholder: images.length === 0
-                },
-                img.src + i
-              )
-            )
+            children: validImages.map((img, i) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+              Thumbnail,
+              {
+                src: img.src,
+                alt: img.alt || `Thumbnail ${i + 1}`,
+                isActive: i === safeIndex,
+                onClick: () => handleSelect(i),
+                onImageError: handleImageError
+              },
+              img.src + i
+            ))
           }
         ) }),
         /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
           CarouselPagination,
           {
-            images,
+            images: validImages,
             currentIndex: safeIndex,
             onSelect: handleSelect
           }
@@ -8201,9 +8226,13 @@ function ProductImagePreview(props) {
 }
 
 // src/components/CompactImagesPreview.tsx
-var import_react34 = require("react");
+var import_react35 = require("react");
 var import_clsx36 = __toESM(require("clsx"), 1);
 var import_jsx_runtime54 = require("react/jsx-runtime");
+function hasValidSourceUri(uri, placeholderImageUri3) {
+  const normalizedUri = uri == null ? void 0 : uri.trim();
+  return !!normalizedUri && normalizedUri !== placeholderImageUri3 && !normalizedUri.endsWith("/placeholder.svg") && !normalizedUri.includes("/placeholder.svg?");
+}
 function CompactImagesPreview(props) {
   const {
     sources,
@@ -8220,18 +8249,38 @@ function CompactImagesPreview(props) {
     testid
   } = props;
   const isMobile = useMatchesMobile();
-  const imagesCount = sources.length;
-  const handleImgError = (0, import_react34.useCallback)(
-    (e) => {
+  const [failedSourceUris, setFailedSourceUris] = (0, import_react35.useState)([]);
+  const sourceKey = (0, import_react35.useMemo)(
+    () => sources.map((source) => source.uri).join("|"),
+    [sources]
+  );
+  const validSources = (0, import_react35.useMemo)(
+    () => sources.filter(
+      (source) => hasValidSourceUri(source.uri, placeholderImageUri3) && failedSourceUris.indexOf(source.uri) === -1
+    ),
+    [failedSourceUris, placeholderImageUri3, sources]
+  );
+  const imagesCount = validSources.length;
+  const safeCurrentSourceIndex = currentSourceIndex >= 0 && currentSourceIndex < imagesCount ? currentSourceIndex : 0;
+  (0, import_react35.useEffect)(() => {
+    setFailedSourceUris([]);
+  }, [sourceKey]);
+  const handleImgError = (0, import_react35.useCallback)(
+    (e, failedUri) => {
+      if (failedUri) {
+        setFailedSourceUris(
+          (previousUris) => previousUris.indexOf(failedUri) >= 0 ? previousUris : [...previousUris, failedUri]
+        );
+      }
       if (!placeholderImageUri3) return;
       const img = e.currentTarget;
       if (img.src === placeholderImageUri3) return;
       img.src = placeholderImageUri3;
       if (!img.alt) img.alt = placeholderAlt;
     },
-    [placeholderImageUri3, placeholderAlt]
+    [placeholderAlt, placeholderImageUri3]
   );
-  const handleThumbnailClick = (0, import_react34.useCallback)(
+  const handleThumbnailClick = (0, import_react35.useCallback)(
     (newIndex) => {
       if (newIndex === currentSourceIndex) return;
       if (newIndex < 0 || newIndex >= imagesCount) return;
@@ -8239,7 +8288,7 @@ function CompactImagesPreview(props) {
     },
     [currentSourceIndex, onChangeSource, imagesCount]
   );
-  if (!sources.length || currentSourceIndex >= sources.length || typeof isMobile === "undefined")
+  if (!validSources.length || typeof isMobile === "undefined")
     return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       "img",
       {
@@ -8253,11 +8302,11 @@ function CompactImagesPreview(props) {
         },
         src: placeholderImageUri3,
         alt: placeholderAlt,
-        onError: handleImgError,
+        onError: (event) => handleImgError(event),
         onClick: onMainImageClick
       }
     );
-  const currentSource = sources[currentSourceIndex];
+  const currentSource = validSources[safeCurrentSourceIndex];
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Stack, { "data-testid": testid, sizing: "layout", children: [
     /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       "img",
@@ -8272,11 +8321,11 @@ function CompactImagesPreview(props) {
         },
         src: currentSource.uri,
         alt: currentSource.name,
-        onError: handleImgError,
+        onError: (event) => handleImgError(event, currentSource.uri),
         onClick: onMainImageClick
       }
     ),
-    imagesCount > 1 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex flex-row flex-wrap items-center gap-3", children: sources.slice(0, 4).map((source, index) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    imagesCount > 1 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "flex flex-row flex-wrap items-center gap-3", children: validSources.slice(0, 4).map((source, index) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       "button",
       {
         "data-testid": testid ? `${testid}-thumbnail-${index}` : void 0,
@@ -8286,7 +8335,7 @@ function CompactImagesPreview(props) {
         },
         className: (0, import_clsx36.default)(
           "cursor-pointer",
-          currentSourceIndex === index && enableThumbnailBorder ? "ring-2 ring-offset-2 ring-brand-400 transition-discrete duration-300" : "ring-brand-400/0"
+          safeCurrentSourceIndex === index && enableThumbnailBorder ? "ring-2 ring-offset-2 ring-brand-400 transition-discrete duration-300" : "ring-brand-400/0"
         ),
         children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
           "img",
@@ -8299,7 +8348,7 @@ function CompactImagesPreview(props) {
               objectPosition: "center",
               objectFit: "cover"
             },
-            onError: handleImgError
+            onError: (event) => handleImgError(event, source.uri)
           }
         )
       },
@@ -8371,7 +8420,7 @@ function SimpleTable({
 }
 
 // src/components/ListGroup.tsx
-var import_react35 = require("react");
+var import_react36 = require("react");
 var import_clsx38 = __toESM(require("clsx"), 1);
 var import_jsx_runtime56 = require("react/jsx-runtime");
 function ListGroup({
@@ -8384,7 +8433,7 @@ function ListGroup({
   className,
   children
 }) {
-  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react35.useState)(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react36.useState)(defaultOpen);
   const isControlled = controlledOpen !== void 0;
   const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
   const toggle = () => {
@@ -8424,7 +8473,7 @@ function ListGroup({
 }
 
 // src/components/Pagination.tsx
-var import_react36 = require("react");
+var import_react37 = require("react");
 var import_clsx39 = __toESM(require("clsx"), 1);
 var import_jsx_runtime57 = require("react/jsx-runtime");
 var Pagination = ({
@@ -8436,7 +8485,7 @@ var Pagination = ({
   className,
   disabled
 }) => {
-  const goTo = (0, import_react36.useCallback)(
+  const goTo = (0, import_react37.useCallback)(
     (page) => {
       if (disabled) return;
       onPageChange(page);
@@ -8453,7 +8502,7 @@ var Pagination = ({
       goTo(currentPage + 1);
     }
   };
-  const pageTokens = (0, import_react36.useMemo)(() => {
+  const pageTokens = (0, import_react37.useMemo)(() => {
     if (totalPages <= 5) {
       return Array.from({ length: totalPages }, (_, i) => i + 1);
     }
@@ -8618,7 +8667,7 @@ function EmptyCartIcon() {
 }
 
 // src/components/SearchResultImage/index.tsx
-var import_react37 = require("react");
+var import_react38 = require("react");
 var import_jsx_runtime60 = require("react/jsx-runtime");
 function SearchResultImage({
   width = 20,
@@ -8626,7 +8675,7 @@ function SearchResultImage({
   src,
   alt
 }) {
-  const [imageError, setImageError] = (0, import_react37.useState)(false);
+  const [imageError, setImageError] = (0, import_react38.useState)(false);
   const showPlaceholder = imageError || !src;
   return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_jsx_runtime60.Fragment, { children: showPlaceholder ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(ImagePlaceholder, { width, height }) : /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
     "img",
@@ -8644,7 +8693,7 @@ function SearchResultImage({
 
 // src/components/Alert.tsx
 var import_clsx40 = __toESM(require("clsx"), 1);
-var import_react38 = require("react");
+var import_react39 = require("react");
 var import_jsx_runtime61 = require("react/jsx-runtime");
 function Alert(_a) {
   var _b = _a, {
@@ -8665,7 +8714,7 @@ function Alert(_a) {
     "onClose"
   ]);
   const isError = variant === "error";
-  const handleClose = (0, import_react38.useCallback)(() => {
+  const handleClose = (0, import_react39.useCallback)(() => {
     if (onClose) onClose();
   }, [onClose]);
   return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
@@ -8752,11 +8801,11 @@ function OrderCheckIcon(_a) {
 }
 
 // src/components/EditingContext.tsx
-var import_react39 = require("react");
+var import_react40 = require("react");
 var import_jsx_runtime63 = require("react/jsx-runtime");
-var EditingContext = (0, import_react39.createContext)(null);
+var EditingContext = (0, import_react40.createContext)(null);
 var useTableEditingContext = () => {
-  const context = (0, import_react39.useContext)(EditingContext);
+  const context = (0, import_react40.useContext)(EditingContext);
   if (!context) {
     throw new Error("useTableEditingContext must be used within EditingProvider");
   }
@@ -8957,7 +9006,7 @@ function AccessCard(props) {
 
 // src/components/AccessCardGroup.tsx
 var import_clsx43 = __toESM(require("clsx"), 1);
-var import_react40 = require("react");
+var import_react41 = require("react");
 var import_jsx_runtime66 = require("react/jsx-runtime");
 function AccessCardGroup(props) {
   const {
@@ -8971,7 +9020,7 @@ function AccessCardGroup(props) {
     testid,
     unavailable
   } = props;
-  const [expand, setExpand] = (0, import_react40.useState)(expanded);
+  const [expand, setExpand] = (0, import_react41.useState)(expanded);
   return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { "data-testid": testid, className: "mb-mobile-layout-group-gap desktop:mb-desktop-layout-group-gap compact:mb-desktop-compact-layout-group-gap", children: [
     /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
       "div",
@@ -9028,7 +9077,7 @@ function AccessCardGroup(props) {
 }
 
 // src/components/EmblaCarousel/index.tsx
-var import_react43 = __toESM(require("react"), 1);
+var import_react44 = __toESM(require("react"), 1);
 var import_embla_carousel_react = __toESM(require("embla-carousel-react"), 1);
 var import_embla_carousel_autoplay = __toESM(require("embla-carousel-autoplay"), 1);
 
@@ -9044,15 +9093,15 @@ var SelectedSnapDisplay = (props) => {
 };
 
 // src/components/EmblaCarousel/useSelectedSnapDisplay.ts
-var import_react41 = require("react");
+var import_react42 = require("react");
 var useSelectedSnapDisplay = (emblaApi) => {
-  const [selectedSnap, setSelectedSnap] = (0, import_react41.useState)(0);
-  const [snapCount, setSnapCount] = (0, import_react41.useState)(0);
-  const updateScrollSnapState = (0, import_react41.useCallback)((emblaApi2) => {
+  const [selectedSnap, setSelectedSnap] = (0, import_react42.useState)(0);
+  const [snapCount, setSnapCount] = (0, import_react42.useState)(0);
+  const updateScrollSnapState = (0, import_react42.useCallback)((emblaApi2) => {
     setSnapCount(emblaApi2.snapList().length);
     setSelectedSnap(emblaApi2.selectedSnap());
   }, []);
-  (0, import_react41.useEffect)(() => {
+  (0, import_react42.useEffect)(() => {
     if (!emblaApi) return;
     updateScrollSnapState(emblaApi);
     emblaApi.on("select", updateScrollSnapState);
@@ -9148,23 +9197,23 @@ var NextButton = (props) => {
 };
 
 // src/components/EmblaCarousel/usePrevNextButtons.ts
-var import_react42 = require("react");
+var import_react43 = require("react");
 var usePrevNextButtons = (emblaApi) => {
-  const [prevBtnDisabled, setPrevBtnDisabled] = (0, import_react42.useState)(true);
-  const [nextBtnDisabled, setNextBtnDisabled] = (0, import_react42.useState)(true);
-  const onPrevButtonClick = (0, import_react42.useCallback)(() => {
+  const [prevBtnDisabled, setPrevBtnDisabled] = (0, import_react43.useState)(true);
+  const [nextBtnDisabled, setNextBtnDisabled] = (0, import_react43.useState)(true);
+  const onPrevButtonClick = (0, import_react43.useCallback)(() => {
     if (!emblaApi) return;
     emblaApi.goToPrev();
   }, [emblaApi]);
-  const onNextButtonClick = (0, import_react42.useCallback)(() => {
+  const onNextButtonClick = (0, import_react43.useCallback)(() => {
     if (!emblaApi) return;
     emblaApi.goToNext();
   }, [emblaApi]);
-  const onSelect = (0, import_react42.useCallback)((emblaApi2) => {
+  const onSelect = (0, import_react43.useCallback)((emblaApi2) => {
     setPrevBtnDisabled(!emblaApi2.canGoToPrev());
     setNextBtnDisabled(!emblaApi2.canGoToNext());
   }, []);
-  (0, import_react42.useEffect)(() => {
+  (0, import_react43.useEffect)(() => {
     if (!emblaApi) return;
     onSelect(emblaApi);
     emblaApi.on("reinit", onSelect).on("select", onSelect);
@@ -9194,11 +9243,11 @@ var EmblaCarousel = ({
     options,
     autoplay ? [autoplayPlugin] : []
   );
-  const emblaRootRef = (0, import_react43.useRef)(null);
-  const [emblaHeight, setEmblaHeight] = import_react43.default.useState(
+  const emblaRootRef = (0, import_react44.useRef)(null);
+  const [emblaHeight, setEmblaHeight] = import_react44.default.useState(
     void 0
   );
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     if (!emblaApi || !leftRightChevrons) return;
     const updateHeight = () => {
       const selectedIndex = emblaApi.selectedSnap();
@@ -9214,7 +9263,7 @@ var EmblaCarousel = ({
       emblaApi.off("reinit", updateHeight);
     };
   }, [emblaApi, leftRightChevrons]);
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     var _a, _b;
     if (!emblaApi || !autoplay) return;
     (_b = (_a = emblaApi.plugins()) == null ? void 0 : _a.autoplay) == null ? void 0 : _b.play();
@@ -9226,18 +9275,18 @@ var EmblaCarousel = ({
     onNextButtonClick
   } = usePrevNextButtons(emblaApi);
   const { selectedSnap, snapCount } = useSelectedSnapDisplay(emblaApi);
-  const tweenFactor = (0, import_react43.useRef)(0);
-  const tweenNodes = (0, import_react43.useRef)([]);
+  const tweenFactor = (0, import_react44.useRef)(0);
+  const tweenNodes = (0, import_react44.useRef)([]);
   const isMobile = useMatchesMobile();
-  const setTweenNodes = (0, import_react43.useCallback)((api) => {
+  const setTweenNodes = (0, import_react44.useCallback)((api) => {
     tweenNodes.current = api.slideNodes().map((slideNode) => {
       return slideNode.querySelector(".embla__parallax__layer");
     });
   }, []);
-  const setTweenFactor = (0, import_react43.useCallback)((api) => {
+  const setTweenFactor = (0, import_react44.useCallback)((api) => {
     tweenFactor.current = TWEEN_FACTOR_BASE * api.snapList().length;
   }, []);
-  const tweenParallax = (0, import_react43.useCallback)(
+  const tweenParallax = (0, import_react44.useCallback)(
     (api, event) => {
       const engine = api.internalEngine();
       const scrollProgress = api.scrollProgress();
@@ -9270,7 +9319,7 @@ var EmblaCarousel = ({
     },
     []
   );
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     if (!emblaApi || !isMobile) return;
     setTweenNodes(emblaApi);
     setTweenFactor(emblaApi);

package/dist/components/index.js

@@ -11,11 +11,11 @@ import {
 } from "../chunk-Y5GD2FJA.js";
 import {
   ProductImagePreview
-} from "../chunk-AJGTMNW5.js";
+} from "../chunk-XW4B4CUY.js";
 import "../chunk-MBZ55T2D.js";
-import "../chunk-2IKT6IHB.js";
-import "../chunk-YCDDBSVU.js";
-import "../chunk-3X3Y4TMS.js";
+import "../chunk-S4XW2XZW.js";
+import "../chunk-65HTZ3R2.js";
+import "../chunk-JRNU5BZ4.js";
 import "../chunk-BQNPOGD5.js";
 import {
   EmblaCarousel
@@ -94,7 +94,7 @@ import {
 } from "../chunk-I3W5K76C.js";
 import {
   CompactImagesPreview
-} from "../chunk-6R5GQV6W.js";
+} from "../chunk-ICJARSLG.js";
 import "../chunk-ZRFXUER3.js";
 import "../chunk-WVGXD7HT.js";
 import "../chunk-VXWSAIB5.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dmsi/wedgekit-react",
   "private": false,
-  "version": "0.0.1228",
+  "version": "0.0.1230",
   "type": "module",
   "scripts": {
     "build": "tsup",