@dmsi/wedgekit-react 0.0.369 → 0.0.371

package/dist/components/PDFViewer/index.js

@@ -0,0 +1,29 @@
+"use client";
+import {
+  PDFViewer
+} from "../../chunk-U6PUOGG4.js";
+import "../../chunk-EJSPFQCY.js";
+import "../../chunk-4UNWXB4A.js";
+import "../../chunk-N6PNLLNS.js";
+import "../../chunk-VJVY6NPF.js";
+import "../../chunk-2H35FETR.js";
+import "../../chunk-4RJKB7LC.js";
+import "../../chunk-XM7IQHBU.js";
+import "../../chunk-FRHPFACM.js";
+import "../../chunk-T36HX6QY.js";
+import "../../chunk-AG43RS4Q.js";
+import "../../chunk-SBRRNFOP.js";
+import "../../chunk-EU73QPW7.js";
+import "../../chunk-JUJBS4ZV.js";
+import "../../chunk-VXWSAIB5.js";
+import "../../chunk-TYTD4FLW.js";
+import "../../chunk-5UH6QUFB.js";
+import "../../chunk-V6U7LU6M.js";
+import "../../chunk-OGIFIPKH.js";
+import "../../chunk-NKUETCDA.js";
+import "../../chunk-WWAPK5PH.js";
+import "../../chunk-6CTCHYIS.js";
+import "../../chunk-ORMEWXMH.js";
+export {
+  PDFViewer
+};

package/dist/components/Password.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   InputBase
-} from "../chunk-RJUN52HJ.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-ZL5X7KP6.js";
 import "../chunk-7CS736EF.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/ProductImagePreview/CarouselPagination.cjs

@@ -0,0 +1,75 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ProductImagePreview/CarouselPagination.tsx
+var CarouselPagination_exports = {};
+__export(CarouselPagination_exports, {
+  CarouselPagination: () => CarouselPagination
+});
+module.exports = __toCommonJS(CarouselPagination_exports);
+var import_clsx = require("clsx");
+var import_jsx_runtime = require("react/jsx-runtime");
+function CarouselPagination({
+  images,
+  currentIndex,
+  onSelect,
+  className
+}) {
+  if (!(images == null ? void 0 : images.length)) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: (0, import_clsx.clsx)(
+        "flex items-center justify-center w-full px-4 md:hidden",
+        className
+      ),
+      "aria-label": "Image navigation",
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "div",
+        {
+          className: "grid gap-2 place-items-center",
+          style: {
+            gridTemplateColumns: `repeat(${Math.min(images.length, 8)}, 1fr)`
+          },
+          role: "tablist",
+          children: images.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => onSelect(index),
+              className: (0, import_clsx.clsx)(
+                "w-4 h-4 transition-all duration-200 focus:outline-none",
+                index === currentIndex ? "ring-2 ring-brand-400" : "ring ring-neutral-300"
+              ),
+              "aria-label": `Go to image ${index + 1}`,
+              role: "tab",
+              "aria-selected": index === currentIndex,
+              tabIndex: index === currentIndex ? 0 : -1
+            },
+            index
+          ))
+        }
+      )
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CarouselPagination
+});

package/dist/components/ProductImagePreview/CarouselPagination.js

@@ -0,0 +1,7 @@
+import {
+  CarouselPagination
+} from "../../chunk-MBZ55T2D.js";
+import "../../chunk-ORMEWXMH.js";
+export {
+  CarouselPagination
+};

package/dist/components/ProductImagePreview/MobileImageCarousel.cjs

@@ -0,0 +1,214 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ProductImagePreview/MobileImageCarousel.tsx
+var MobileImageCarousel_exports = {};
+__export(MobileImageCarousel_exports, {
+  MobileImageCarousel: () => MobileImageCarousel
+});
+module.exports = __toCommonJS(MobileImageCarousel_exports);
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+function MobileImageCarousel({
+  images,
+  currentIndex,
+  width = 483,
+  height = 483,
+  onChangeIndex,
+  className = ""
+}) {
+  const containerRef = (0, import_react.useRef)(null);
+  const [isDragging, setIsDragging] = (0, import_react.useState)(false);
+  const [startX, setStartX] = (0, import_react.useState)(0);
+  const [currentTranslate, setCurrentTranslate] = (0, import_react.useState)(0);
+  const [prevTranslate, setPrevTranslate] = (0, import_react.useState)(0);
+  const [containerWidth, setContainerWidth] = (0, import_react.useState)(width);
+  const imageSize = Math.min(containerWidth * 0.6, height * 0.6);
+  const gap = 16;
+  const getTranslateX = (0, import_react.useCallback)(
+    (index) => {
+      const containerCenter = containerWidth / 2;
+      const imageCenter = imageSize / 2;
+      const totalOffset = index * (imageSize + gap);
+      return containerCenter - imageCenter - totalOffset;
+    },
+    [containerWidth, imageSize, gap]
+  );
+  (0, import_react.useEffect)(() => {
+    const translateX = getTranslateX(currentIndex);
+    setCurrentTranslate(translateX);
+    setPrevTranslate(translateX);
+  }, [currentIndex, getTranslateX]);
+  (0, import_react.useEffect)(() => {
+    const updateContainerWidth = () => {
+      if (containerRef.current) {
+        const rect = containerRef.current.getBoundingClientRect();
+        setContainerWidth(rect.width);
+      }
+    };
+    updateContainerWidth();
+    const resizeObserver = new ResizeObserver(updateContainerWidth);
+    if (containerRef.current) {
+      resizeObserver.observe(containerRef.current);
+    }
+    return () => resizeObserver.disconnect();
+  }, []);
+  const handleStart = (0, import_react.useCallback)((clientX) => {
+    setIsDragging(true);
+    setStartX(clientX);
+  }, []);
+  const handleMove = (0, import_react.useCallback)(
+    (clientX) => {
+      if (!isDragging) return;
+      const currentPosition = clientX;
+      const diff = currentPosition - startX;
+      setCurrentTranslate(prevTranslate + diff);
+    },
+    [isDragging, startX, prevTranslate]
+  );
+  const handleEnd = (0, import_react.useCallback)(() => {
+    if (!isDragging) return;
+    setIsDragging(false);
+    const moved = currentTranslate - prevTranslate;
+    const threshold = imageSize / 3;
+    let newIndex = currentIndex;
+    if (moved > threshold && currentIndex > 0) {
+      newIndex = currentIndex - 1;
+    } else if (moved < -threshold && currentIndex < images.length - 1) {
+      newIndex = currentIndex + 1;
+    }
+    if (newIndex !== currentIndex) {
+      onChangeIndex(newIndex);
+    } else {
+      setCurrentTranslate(prevTranslate);
+    }
+  }, [
+    isDragging,
+    currentTranslate,
+    prevTranslate,
+    currentIndex,
+    imageSize,
+    images.length,
+    onChangeIndex
+  ]);
+  const handleMouseDown = (e) => {
+    e.preventDefault();
+    handleStart(e.clientX);
+  };
+  const handleMouseMove = (e) => {
+    e.preventDefault();
+    handleMove(e.clientX);
+  };
+  const handleMouseUp = () => {
+    handleEnd();
+  };
+  const handleMouseLeave = () => {
+    handleEnd();
+  };
+  const handleTouchStart = (e) => {
+    handleStart(e.touches[0].clientX);
+  };
+  const handleTouchMove = (e) => {
+    handleMove(e.touches[0].clientX);
+  };
+  const handleTouchEnd = () => {
+    handleEnd();
+  };
+  const handleImageClick = (0, import_react.useCallback)(
+    (index) => {
+      if (!isDragging && index !== currentIndex) {
+        onChangeIndex(index);
+      }
+    },
+    [isDragging, currentIndex, onChangeIndex]
+  );
+  if (!images.length) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `md:hidden w-full ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ref: containerRef,
+      className: "relative overflow-hidden cursor-grab active:cursor-grabbing select-none w-full",
+      style: {
+        height: imageSize
+      },
+      onMouseDown: handleMouseDown,
+      onMouseMove: handleMouseMove,
+      onMouseUp: handleMouseUp,
+      onMouseLeave: handleMouseLeave,
+      onTouchStart: handleTouchStart,
+      onTouchMove: handleTouchMove,
+      onTouchEnd: handleTouchEnd,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "div",
+        {
+          className: "flex items-center",
+          style: {
+            transform: `translateX(${currentTranslate}px)`,
+            transition: isDragging ? "none" : "transform 0.3s ease-out",
+            gap: `${gap}px`
+          },
+          children: images.map((image, index) => {
+            const isActive = index === currentIndex;
+            const distance = Math.abs(index - currentIndex);
+            const shouldRender = distance <= 2;
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "div",
+              {
+                className: "flex-shrink-0 transition-opacity duration-300",
+                style: {
+                  width: imageSize,
+                  height: imageSize,
+                  opacity: isActive ? 1 : Math.max(0.3, 1 - distance * 0.3)
+                },
+                onClick: () => handleImageClick(index),
+                children: shouldRender ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "img",
+                  {
+                    src: image.src,
+                    alt: image.alt || `Product image ${index + 1}`,
+                    className: "w-full h-full object-cover",
+                    draggable: false,
+                    loading: distance <= 1 ? "eager" : "lazy",
+                    style: {
+                      aspectRatio: "1 / 1"
+                    }
+                  }
+                ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "div",
+                  {
+                    className: "w-full h-full bg-neutral-100 rounded-md border border-gray-200",
+                    style: {
+                      aspectRatio: "1 / 1"
+                    },
+                    "aria-hidden": "true"
+                  }
+                )
+              },
+              image.src + index
+            );
+          })
+        }
+      )
+    }
+  ) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MobileImageCarousel
+});

package/dist/components/ProductImagePreview/MobileImageCarousel.js

@@ -0,0 +1,7 @@
+import {
+  MobileImageCarousel
+} from "../../chunk-2IKT6IHB.js";
+import "../../chunk-ORMEWXMH.js";
+export {
+  MobileImageCarousel
+};

package/dist/components/ProductImagePreview/ProductPrimaryImage.cjs

@@ -0,0 +1,255 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/ProductImagePreview/ProductPrimaryImage.tsx
+var ProductPrimaryImage_exports = {};
+__export(ProductPrimaryImage_exports, {
+  ProductPrimaryImage: () => ProductPrimaryImage
+});
+module.exports = __toCommonJS(ProductPrimaryImage_exports);
+var import_react2 = require("react");
+
+// src/components/Spinner.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Spinner = ({ size = "small", testid }) => {
+  const dimension = size === "large" ? 48 : 24;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "svg",
+    {
+      "data-testid": testid,
+      width: dimension,
+      height: dimension,
+      viewBox: "0 0 24 24",
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "#1D1E1E",
+      className: "spinner",
+      "aria-label": "Loading",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "4", r: "2", opacity: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17.666", cy: "6.334", r: "2", opacity: "0.125" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "20", cy: "12", r: "2", opacity: "0.25" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17.666", cy: "17.666", r: "2", opacity: "0.375" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "20", r: "2", opacity: "0.5" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6.334", cy: "17.666", r: "2", opacity: "0.625" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "4", cy: "12", r: "2", opacity: "0.75" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6.334", cy: "6.334", r: "2", opacity: "0.875" })
+      ]
+    }
+  );
+};
+Spinner.displayName = "Spinner";
+
+// src/components/ImagePlaceholder.tsx
+var import_react = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function ImagePlaceholder(props) {
+  const clipId = (0, import_react.useId)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "svg",
+    __spreadProps(__spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 242,
+      height: 243,
+      fill: "none"
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { width: props.width, height: props.width, fill: "#F7F7F7", rx: 2 }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("clipPath", { id: clipId, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("rect", { width: props.width, height: props.width, fill: "#fff", rx: 2 }) }) })
+      ]
+    })
+  );
+}
+
+// src/components/ProductImagePreview/ProductPrimaryImage.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function ProductPrimaryImage({
+  image,
+  width,
+  height,
+  zoomEnabled = false,
+  zoomLensSize = 140,
+  scrollToZoomEnabled = false,
+  className = "",
+  isPlaceholder = false,
+  onZoomPositionChange,
+  onScrollZoom
+}) {
+  const containerRef = (0, import_react2.useRef)(null);
+  const lastPointRef = (0, import_react2.useRef)(null);
+  const rafRef = (0, import_react2.useRef)(null);
+  const [active, setActive] = (0, import_react2.useState)(false);
+  const [, forceRerender] = (0, import_react2.useState)(0);
+  const [imageLoading, setImageLoading] = (0, import_react2.useState)(true);
+  const [imageError, setImageError] = (0, import_react2.useState)(false);
+  const imageSrc = (0, import_react2.useMemo)(() => image == null ? void 0 : image.src, [image == null ? void 0 : image.src]);
+  const schedule = () => {
+    if (rafRef.current != null) return;
+    rafRef.current = requestAnimationFrame(() => {
+      rafRef.current = null;
+      forceRerender((n) => n + 1);
+    });
+  };
+  const handlePointerEnter = (0, import_react2.useCallback)(() => {
+    if (!zoomEnabled) return;
+    setActive(true);
+    const el = containerRef.current;
+    if (el) {
+      const r = el.getBoundingClientRect();
+      const pt2 = lastPointRef.current;
+      onZoomPositionChange == null ? void 0 : onZoomPositionChange(
+        pt2 ? __spreadProps(__spreadValues({}, pt2), { w: r.width, h: r.height, lensSize: zoomLensSize }) : null,
+        true
+      );
+    }
+  }, [zoomEnabled, onZoomPositionChange, zoomLensSize]);
+  const handlePointerLeave = (0, import_react2.useCallback)(() => {
+    if (!zoomEnabled) return;
+    setActive(false);
+    lastPointRef.current = null;
+    onZoomPositionChange == null ? void 0 : onZoomPositionChange(null, false);
+  }, [zoomEnabled, onZoomPositionChange]);
+  const handlePointerMove = (0, import_react2.useCallback)(
+    (e) => {
+      if (!zoomEnabled || !active) return;
+      if (e.pointerType === "touch") return;
+      const el = containerRef.current;
+      if (!el) return;
+      const rect = el.getBoundingClientRect();
+      const rawX = (e.clientX - rect.left) / rect.width;
+      const rawY = (e.clientY - rect.top) / rect.height;
+      const size = zoomLensSize != null ? zoomLensSize : 140;
+      const left = Math.max(
+        0,
+        Math.min(rect.width - size, rawX * rect.width - size / 2)
+      );
+      const top = Math.max(
+        0,
+        Math.min(rect.height - size, rawY * rect.height - size / 2)
+      );
+      const centerXNorm = (left + size / 2) / rect.width;
+      const centerYNorm = (top + size / 2) / rect.height;
+      lastPointRef.current = {
+        x: centerXNorm,
+        y: centerYNorm
+      };
+      schedule();
+      onZoomPositionChange == null ? void 0 : onZoomPositionChange(
+        lastPointRef.current ? __spreadProps(__spreadValues({}, lastPointRef.current), {
+          w: rect.width,
+          h: rect.height,
+          lensSize: zoomLensSize
+        }) : null,
+        true
+      );
+    },
+    [zoomEnabled, active, onZoomPositionChange, zoomLensSize]
+  );
+  (0, import_react2.useEffect)(() => {
+    const container = containerRef.current;
+    if (!container || !scrollToZoomEnabled) return;
+    const handleNativeWheel = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (!zoomEnabled || !active) return;
+      const delta = e.deltaY > 0 ? -0.2 : 0.2;
+      onScrollZoom == null ? void 0 : onScrollZoom(delta);
+    };
+    container.addEventListener("wheel", handleNativeWheel, { passive: false });
+    return () => {
+      container.removeEventListener("wheel", handleNativeWheel);
+    };
+  }, [scrollToZoomEnabled, zoomEnabled, active, onScrollZoom]);
+  if (!image && !isPlaceholder) return null;
+  const pt = lastPointRef.current;
+  let lensStyle;
+  if (pt && active && zoomEnabled) {
+    const size = zoomLensSize;
+    const leftRaw = pt.x * width - size / 2;
+    const topRaw = pt.y * height - size / 2;
+    lensStyle = {
+      width: size,
+      height: size,
+      left: Math.max(0, Math.min(width - size, leftRaw)),
+      top: Math.max(0, Math.min(height - size, topRaw))
+    };
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    "div",
+    {
+      ref: containerRef,
+      className: [
+        "relative overflow-hidden bg-white rounded flex items-center justify-center select-none",
+        zoomEnabled ? "cursor-crosshair" : "",
+        className
+      ].join(" "),
+      style: { maxWidth: width, maxHeight: height, aspectRatio: "1 / 1" },
+      onPointerEnter: handlePointerEnter,
+      onPointerLeave: handlePointerLeave,
+      onPointerMove: handlePointerMove,
+      children: [
+        imageLoading && !imageError && !isPlaceholder && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-neutral-50", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Spinner, { size: "small" }) }),
+        isPlaceholder ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ImagePlaceholder, { width, height }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          "img",
+          {
+            src: imageSrc,
+            alt: (image == null ? void 0 : image.alt) || "Product image",
+            className: "object-cover w-full h-full select-none",
+            draggable: false,
+            loading: "lazy",
+            onLoad: () => setImageLoading(false),
+            onError: () => {
+              setImageLoading(false);
+              setImageError(true);
+            }
+          },
+          imageSrc
+        ),
+        zoomEnabled && active && lensStyle && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          "div",
+          {
+            "aria-hidden": true,
+            className: "absolute pointer-events-none border border-white/70 shadow-[0_0_0_1px_rgba(0,0,0,0.15)] rounded-md bg-white/10 backdrop-blur-[1px]",
+            style: lensStyle
+          }
+        )
+      ]
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ProductPrimaryImage
+});

package/dist/components/ProductImagePreview/ProductPrimaryImage.js

@@ -0,0 +1,9 @@
+import {
+  ProductPrimaryImage
+} from "../../chunk-CQFPNZTN.js";
+import "../../chunk-SBRRNFOP.js";
+import "../../chunk-QVWYTQKL.js";
+import "../../chunk-ORMEWXMH.js";
+export {
+  ProductPrimaryImage
+};