@enadhq/enad-react-sdk 1.0.2 → 1.1.0

package/dist/client/storefront/components/product-recommendations.mjs

@@ -1,108 +1,88 @@
 "use client";
+import { useIcon } from "../../icons/icon-context.mjs";
+import { cn } from "../../ui/utils.mjs";
+import { getMotionConfig } from "../../motion/config.mjs";
+import { staggerChildStyle, staggerEntryClass } from "../../motion/stagger.mjs";
+import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { cn } from "../../ui/utils";
-import { useIcon } from "../../icons/icon-context";
-import { getMotionConfig } from "../../motion/config";
-import { staggerEntryClass, staggerChildStyle } from "../../motion/stagger";
-function ProductRecommendations({
-  title,
-  children,
-  viewAllHref,
-  viewAllLabel = "View all",
-  showArrows = true,
-  delight = 0,
-  className
-}) {
-  const scrollRef = React.useRef(null);
-  const motion = React.useMemo(() => getMotionConfig(delight), [delight]);
-  const [canScrollLeft, setCanScrollLeft] = React.useState(false);
-  const [canScrollRight, setCanScrollRight] = React.useState(false);
-  const ChevronLeftIcon = useIcon("chevronLeft");
-  const ChevronRightIcon = useIcon("chevronRight");
-  const updateScrollState = React.useCallback(() => {
-    const el = scrollRef.current;
-    if (!el) return;
-    setCanScrollLeft(el.scrollLeft > 1);
-    setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);
-  }, []);
-  React.useEffect(() => {
-    const el = scrollRef.current;
-    if (!el) return;
-    updateScrollState();
-    el.addEventListener("scroll", updateScrollState, { passive: true });
-    const ro = new ResizeObserver(updateScrollState);
-    ro.observe(el);
-    return () => {
-      el.removeEventListener("scroll", updateScrollState);
-      ro.disconnect();
-    };
-  }, [updateScrollState]);
-  const scroll = (direction) => {
-    const el = scrollRef.current;
-    if (!el) return;
-    const distance = el.clientWidth * 0.8;
-    el.scrollBy({
-      left: direction === "left" ? -distance : distance,
-      behavior: "smooth"
-    });
-  };
-  return /* @__PURE__ */ jsxs("section", { className: cn("flex flex-col gap-4", className), children: [
-    (title || viewAllHref) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      title && /* @__PURE__ */ jsx("h2", { className: "font-enad text-xl font-semibold", children: title }),
-      viewAllHref && /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: viewAllHref,
-          className: "text-sm font-medium underline underline-offset-4 hover:text-(--enad-button-bg) transition-colors",
-          children: viewAllLabel
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "relative group/recs", children: [
-      showArrows && canScrollLeft && /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => scroll("left"),
-          className: "absolute left-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)",
-          "aria-label": "Scroll left",
-          children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "size-5" })
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: scrollRef,
-          className: "flex gap-4 overflow-x-auto scroll-smooth snap-x snap-mandatory scrollbar-none pb-1",
-          children: React.Children.map(children, (child, i) => /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: cn(
-                "w-[260px] shrink-0 snap-start sm:w-[280px] lg:w-[300px]",
-                staggerEntryClass(motion)
-              ),
-              style: staggerChildStyle(i, motion),
-              children: child
-            },
-            i
-          ))
-        }
-      ),
-      showArrows && canScrollRight && /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => scroll("right"),
-          className: "absolute right-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)",
-          "aria-label": "Scroll right",
-          children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-5" })
-        }
-      )
-    ] })
-  ] });
+//#region src/client/storefront/components/product-recommendations.tsx
+function ProductRecommendations({ title, children, viewAllHref, viewAllLabel = "View all", showArrows = true, delight = 0, className }) {
+	const scrollRef = React$1.useRef(null);
+	const motion = React$1.useMemo(() => getMotionConfig(delight), [delight]);
+	const [canScrollLeft, setCanScrollLeft] = React$1.useState(false);
+	const [canScrollRight, setCanScrollRight] = React$1.useState(false);
+	const ChevronLeftIcon = useIcon("chevronLeft");
+	const ChevronRightIcon = useIcon("chevronRight");
+	const updateScrollState = React$1.useCallback(() => {
+		const el = scrollRef.current;
+		if (!el) return;
+		setCanScrollLeft(el.scrollLeft > 1);
+		setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);
+	}, []);
+	React$1.useEffect(() => {
+		const el = scrollRef.current;
+		if (!el) return;
+		updateScrollState();
+		el.addEventListener("scroll", updateScrollState, { passive: true });
+		const ro = new ResizeObserver(updateScrollState);
+		ro.observe(el);
+		return () => {
+			el.removeEventListener("scroll", updateScrollState);
+			ro.disconnect();
+		};
+	}, [updateScrollState]);
+	const scroll = (direction) => {
+		const el = scrollRef.current;
+		if (!el) return;
+		const distance = el.clientWidth * .8;
+		el.scrollBy({
+			left: direction === "left" ? -distance : distance,
+			behavior: "smooth"
+		});
+	};
+	return /* @__PURE__ */ jsxs("section", {
+		className: cn("flex flex-col gap-4", className),
+		children: [(title || viewAllHref) && /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center justify-between",
+			children: [title && /* @__PURE__ */ jsx("h2", {
+				className: "font-enad text-xl font-semibold",
+				children: title
+			}), viewAllHref && /* @__PURE__ */ jsx("a", {
+				href: viewAllHref,
+				className: "text-sm font-medium underline underline-offset-4 hover:text-(--enad-button-bg) transition-colors",
+				children: viewAllLabel
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "relative group/recs",
+			children: [
+				showArrows && canScrollLeft && /* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: () => scroll("left"),
+					className: "absolute left-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)",
+					"aria-label": "Scroll left",
+					children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "size-5" })
+				}),
+				/* @__PURE__ */ jsx("div", {
+					ref: scrollRef,
+					className: "flex gap-4 overflow-x-auto scroll-smooth snap-x snap-mandatory scrollbar-none pb-1",
+					children: React$1.Children.map(children, (child, i) => /* @__PURE__ */ jsx("div", {
+						className: cn("w-[260px] shrink-0 snap-start sm:w-[280px] lg:w-[300px]", staggerEntryClass(motion)),
+						style: staggerChildStyle(i, motion),
+						children: child
+					}, i))
+				}),
+				showArrows && canScrollRight && /* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: () => scroll("right"),
+					className: "absolute right-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)",
+					"aria-label": "Scroll right",
+					children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-5" })
+				})
+			]
+		})]
+	});
 }
-export {
-  ProductRecommendations
-};
+//#endregion
+export { ProductRecommendations };
+
 //# sourceMappingURL=product-recommendations.mjs.map

package/dist/client/storefront/components/product-recommendations.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/client/storefront/components/product-recommendations.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../ui/utils\";\nimport { useIcon } from \"../../icons/icon-context\";\nimport { getMotionConfig, type MotionConfig } from \"../../motion/config\";\nimport { staggerEntryClass, staggerChildStyle } from \"../../motion/stagger\";\n\n/* ─── Types ─── */\n\nexport interface ProductRecommendationsProps {\n  title?: string;\n  /** Optional variant label for styling/semantics */\n  variant?: \"related\" | \"recent\" | \"complete-the-look\";\n  /** Product cards to render — pass <ProductCard> elements */\n  children: React.ReactNode;\n  /** \"View all\" link */\n  viewAllHref?: string;\n  viewAllLabel?: string;\n  /** Show navigation arrows on desktop */\n  showArrows?: boolean;\n  /** Delight level (0-100) for stagger entry animation. 0 = no animation. */\n  delight?: number;\n  className?: string;\n}\n\n/* ─── Component ─── */\n\nexport function ProductRecommendations({\n  title,\n  children,\n  viewAllHref,\n  viewAllLabel = \"View all\",\n  showArrows = true,\n  delight = 0,\n  className,\n}: ProductRecommendationsProps) {\n  const scrollRef = React.useRef<HTMLDivElement>(null);\n  const motion = React.useMemo(() => getMotionConfig(delight), [delight]);\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n  const ChevronLeftIcon = useIcon(\"chevronLeft\");\n  const ChevronRightIcon = useIcon(\"chevronRight\");\n\n  const updateScrollState = React.useCallback(() => {\n    const el = scrollRef.current;\n    if (!el) return;\n    setCanScrollLeft(el.scrollLeft > 1);\n    setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);\n  }, []);\n\n  React.useEffect(() => {\n    const el = scrollRef.current;\n    if (!el) return;\n    updateScrollState();\n    el.addEventListener(\"scroll\", updateScrollState, { passive: true });\n    const ro = new ResizeObserver(updateScrollState);\n    ro.observe(el);\n    return () => {\n      el.removeEventListener(\"scroll\", updateScrollState);\n      ro.disconnect();\n    };\n  }, [updateScrollState]);\n\n  const scroll = (direction: \"left\" | \"right\") => {\n    const el = scrollRef.current;\n    if (!el) return;\n    const distance = el.clientWidth * 0.8;\n    el.scrollBy({\n      left: direction === \"left\" ? -distance : distance,\n      behavior: \"smooth\",\n    });\n  };\n\n  return (\n    <section className={cn(\"flex flex-col gap-4\", className)}>\n      {/* Header */}\n      {(title || viewAllHref) && (\n        <div className=\"flex items-center justify-between\">\n          {title && <h2 className=\"font-enad text-xl font-semibold\">{title}</h2>}\n          {viewAllHref && (\n            <a\n              href={viewAllHref}\n              className=\"text-sm font-medium underline underline-offset-4 hover:text-(--enad-button-bg) transition-colors\"\n            >\n              {viewAllLabel}\n            </a>\n          )}\n        </div>\n      )}\n\n      {/* Scrollable row */}\n      <div className=\"relative group/recs\">\n        {showArrows && canScrollLeft && (\n          <button\n            type=\"button\"\n            onClick={() => scroll(\"left\")}\n            className=\"absolute left-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)\"\n            aria-label=\"Scroll left\"\n          >\n            <ChevronLeftIcon className=\"size-5\" />\n          </button>\n        )}\n\n        <div\n          ref={scrollRef}\n          className=\"flex gap-4 overflow-x-auto scroll-smooth snap-x snap-mandatory scrollbar-none pb-1\"\n        >\n          {React.Children.map(children, (child, i) => (\n            <div\n              key={i}\n              className={cn(\n                \"w-[260px] shrink-0 snap-start sm:w-[280px] lg:w-[300px]\",\n                staggerEntryClass(motion),\n              )}\n              style={staggerChildStyle(i, motion)}\n            >\n              {child}\n            </div>\n          ))}\n        </div>\n\n        {showArrows && canScrollRight && (\n          <button\n            type=\"button\"\n            onClick={() => scroll(\"right\")}\n            className=\"absolute right-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)\"\n            aria-label=\"Scroll right\"\n          >\n            <ChevronRightIcon className=\"size-5\" />\n          </button>\n        )}\n      </div>\n    </section>\n  );\n}\n"],"mappings":";AA8EQ,SACY,KADZ;AA5ER,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,eAAe;AACxB,SAAS,uBAA0C;AACnD,SAAS,mBAAmB,yBAAyB;AAsB9C,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,aAAa;AAAA,EACb,UAAU;AAAA,EACV;AACF,GAAgC;AAC9B,QAAM,YAAY,MAAM,OAAuB,IAAI;AACnD,QAAM,SAAS,MAAM,QAAQ,MAAM,gBAAgB,OAAO,GAAG,CAAC,OAAO,CAAC;AACtE,QAAM,CAAC,eAAe,gBAAgB,IAAI,MAAM,SAAS,KAAK;AAC9D,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,MAAM,SAAS,KAAK;AAChE,QAAM,kBAAkB,QAAQ,aAAa;AAC7C,QAAM,mBAAmB,QAAQ,cAAc;AAE/C,QAAM,oBAAoB,MAAM,YAAY,MAAM;AAChD,UAAM,KAAK,UAAU;AACrB,QAAI,CAAC,GAAI;AACT,qBAAiB,GAAG,aAAa,CAAC;AAClC,sBAAkB,GAAG,aAAa,GAAG,cAAc,GAAG,cAAc,CAAC;AAAA,EACvE,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,MAAM;AACpB,UAAM,KAAK,UAAU;AACrB,QAAI,CAAC,GAAI;AACT,sBAAkB;AAClB,OAAG,iBAAiB,UAAU,mBAAmB,EAAE,SAAS,KAAK,CAAC;AAClE,UAAM,KAAK,IAAI,eAAe,iBAAiB;AAC/C,OAAG,QAAQ,EAAE;AACb,WAAO,MAAM;AACX,SAAG,oBAAoB,UAAU,iBAAiB;AAClD,SAAG,WAAW;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,iBAAiB,CAAC;AAEtB,QAAM,SAAS,CAAC,cAAgC;AAC9C,UAAM,KAAK,UAAU;AACrB,QAAI,CAAC,GAAI;AACT,UAAM,WAAW,GAAG,cAAc;AAClC,OAAG,SAAS;AAAA,MACV,MAAM,cAAc,SAAS,CAAC,WAAW;AAAA,MACzC,UAAU;AAAA,IACZ,CAAC;AAAA,EACH;AAEA,SACE,qBAAC,aAAQ,WAAW,GAAG,uBAAuB,SAAS,GAEnD;AAAA,cAAS,gBACT,qBAAC,SAAI,WAAU,qCACZ;AAAA,eAAS,oBAAC,QAAG,WAAU,mCAAmC,iBAAM;AAAA,MAChE,eACC;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UAET;AAAA;AAAA,MACH;AAAA,OAEJ;AAAA,IAIF,qBAAC,SAAI,WAAU,uBACZ;AAAA,oBAAc,iBACb;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAS,MAAM,OAAO,MAAM;AAAA,UAC5B,WAAU;AAAA,UACV,cAAW;AAAA,UAEX,8BAAC,mBAAgB,WAAU,UAAS;AAAA;AAAA,MACtC;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,WAAU;AAAA,UAET,gBAAM,SAAS,IAAI,UAAU,CAAC,OAAO,MACpC;AAAA,YAAC;AAAA;AAAA,cAEC,WAAW;AAAA,gBACT;AAAA,gBACA,kBAAkB,MAAM;AAAA,cAC1B;AAAA,cACA,OAAO,kBAAkB,GAAG,MAAM;AAAA,cAEjC;AAAA;AAAA,YAPI;AAAA,UAQP,CACD;AAAA;AAAA,MACH;AAAA,MAEC,cAAc,kBACb;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAS,MAAM,OAAO,OAAO;AAAA,UAC7B,WAAU;AAAA,UACV,cAAW;AAAA,UAEX,8BAAC,oBAAiB,WAAU,UAAS;AAAA;AAAA,MACvC;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"file":"product-recommendations.mjs","names":["React"],"sources":["../../../../src/client/storefront/components/product-recommendations.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../ui/utils\";\nimport { useIcon } from \"../../icons/icon-context\";\nimport { getMotionConfig } from \"../../motion/config\";\nimport { staggerEntryClass, staggerChildStyle } from \"../../motion/stagger\";\n\n/* ─── Types ─── */\n\nexport interface ProductRecommendationsProps {\n  title?: string;\n  /** Optional variant label for styling/semantics */\n  variant?: \"related\" | \"recent\" | \"complete-the-look\";\n  /** Product cards to render — pass <ProductCard> elements */\n  children: React.ReactNode;\n  /** \"View all\" link */\n  viewAllHref?: string;\n  viewAllLabel?: string;\n  /** Show navigation arrows on desktop */\n  showArrows?: boolean;\n  /** Delight level (0-100) for stagger entry animation. 0 = no animation. */\n  delight?: number;\n  className?: string;\n}\n\n/* ─── Component ─── */\n\nexport function ProductRecommendations({\n  title,\n  children,\n  viewAllHref,\n  viewAllLabel = \"View all\",\n  showArrows = true,\n  delight = 0,\n  className,\n}: ProductRecommendationsProps) {\n  const scrollRef = React.useRef<HTMLDivElement>(null);\n  const motion = React.useMemo(() => getMotionConfig(delight), [delight]);\n  const [canScrollLeft, setCanScrollLeft] = React.useState(false);\n  const [canScrollRight, setCanScrollRight] = React.useState(false);\n  const ChevronLeftIcon = useIcon(\"chevronLeft\");\n  const ChevronRightIcon = useIcon(\"chevronRight\");\n\n  const updateScrollState = React.useCallback(() => {\n    const el = scrollRef.current;\n    if (!el) return;\n    setCanScrollLeft(el.scrollLeft > 1);\n    setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);\n  }, []);\n\n  React.useEffect(() => {\n    const el = scrollRef.current;\n    if (!el) return;\n    updateScrollState();\n    el.addEventListener(\"scroll\", updateScrollState, { passive: true });\n    const ro = new ResizeObserver(updateScrollState);\n    ro.observe(el);\n    return () => {\n      el.removeEventListener(\"scroll\", updateScrollState);\n      ro.disconnect();\n    };\n  }, [updateScrollState]);\n\n  const scroll = (direction: \"left\" | \"right\") => {\n    const el = scrollRef.current;\n    if (!el) return;\n    const distance = el.clientWidth * 0.8;\n    el.scrollBy({\n      left: direction === \"left\" ? -distance : distance,\n      behavior: \"smooth\",\n    });\n  };\n\n  return (\n    <section className={cn(\"flex flex-col gap-4\", className)}>\n      {/* Header */}\n      {(title || viewAllHref) && (\n        <div className=\"flex items-center justify-between\">\n          {title && <h2 className=\"font-enad text-xl font-semibold\">{title}</h2>}\n          {viewAllHref && (\n            <a\n              href={viewAllHref}\n              className=\"text-sm font-medium underline underline-offset-4 hover:text-(--enad-button-bg) transition-colors\"\n            >\n              {viewAllLabel}\n            </a>\n          )}\n        </div>\n      )}\n\n      {/* Scrollable row */}\n      <div className=\"relative group/recs\">\n        {showArrows && canScrollLeft && (\n          <button\n            type=\"button\"\n            onClick={() => scroll(\"left\")}\n            className=\"absolute left-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)\"\n            aria-label=\"Scroll left\"\n          >\n            <ChevronLeftIcon className=\"size-5\" />\n          </button>\n        )}\n\n        <div\n          ref={scrollRef}\n          className=\"flex gap-4 overflow-x-auto scroll-smooth snap-x snap-mandatory scrollbar-none pb-1\"\n        >\n          {React.Children.map(children, (child, i) => (\n            <div\n              key={i}\n              className={cn(\n                \"w-[260px] shrink-0 snap-start sm:w-[280px] lg:w-[300px]\",\n                staggerEntryClass(motion),\n              )}\n              style={staggerChildStyle(i, motion)}\n            >\n              {child}\n            </div>\n          ))}\n        </div>\n\n        {showArrows && canScrollRight && (\n          <button\n            type=\"button\"\n            onClick={() => scroll(\"right\")}\n            className=\"absolute right-0 top-1/2 -translate-y-1/2 z-10 hidden md:flex size-10 items-center justify-center rounded-full bg-(--enad-surface)/90 shadow-md border border-(--enad-border-color)/50 opacity-0 group-hover/recs:opacity-100 focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-opacity hover:bg-(--enad-surface)\"\n            aria-label=\"Scroll right\"\n          >\n            <ChevronRightIcon className=\"size-5\" />\n          </button>\n        )}\n      </div>\n    </section>\n  );\n}\n"],"mappings":";;;;;;;;AA4BA,SAAgB,uBAAuB,EACrC,OACA,UACA,aACA,eAAe,YACf,aAAa,MACb,UAAU,GACV,aAC8B;CAC9B,MAAM,YAAYA,QAAM,OAAuB,KAAK;CACpD,MAAM,SAASA,QAAM,cAAc,gBAAgB,QAAQ,EAAE,CAAC,QAAQ,CAAC;CACvE,MAAM,CAAC,eAAe,oBAAoBA,QAAM,SAAS,MAAM;CAC/D,MAAM,CAAC,gBAAgB,qBAAqBA,QAAM,SAAS,MAAM;CACjE,MAAM,kBAAkB,QAAQ,cAAc;CAC9C,MAAM,mBAAmB,QAAQ,eAAe;CAEhD,MAAM,oBAAoBA,QAAM,kBAAkB;EAChD,MAAM,KAAK,UAAU;AACrB,MAAI,CAAC,GAAI;AACT,mBAAiB,GAAG,aAAa,EAAE;AACnC,oBAAkB,GAAG,aAAa,GAAG,cAAc,GAAG,cAAc,EAAE;IACrE,EAAE,CAAC;AAEN,SAAM,gBAAgB;EACpB,MAAM,KAAK,UAAU;AACrB,MAAI,CAAC,GAAI;AACT,qBAAmB;AACnB,KAAG,iBAAiB,UAAU,mBAAmB,EAAE,SAAS,MAAM,CAAC;EACnE,MAAM,KAAK,IAAI,eAAe,kBAAkB;AAChD,KAAG,QAAQ,GAAG;AACd,eAAa;AACX,MAAG,oBAAoB,UAAU,kBAAkB;AACnD,MAAG,YAAY;;IAEhB,CAAC,kBAAkB,CAAC;CAEvB,MAAM,UAAU,cAAgC;EAC9C,MAAM,KAAK,UAAU;AACrB,MAAI,CAAC,GAAI;EACT,MAAM,WAAW,GAAG,cAAc;AAClC,KAAG,SAAS;GACV,MAAM,cAAc,SAAS,CAAC,WAAW;GACzC,UAAU;GACX,CAAC;;AAGJ,QACE,qBAAC,WAAD;EAAS,WAAW,GAAG,uBAAuB,UAAU;YAAxD,EAEI,SAAS,gBACT,qBAAC,OAAD;GAAK,WAAU;aAAf,CACG,SAAS,oBAAC,MAAD;IAAI,WAAU;cAAmC;IAAW,CAAA,EACrE,eACC,oBAAC,KAAD;IACE,MAAM;IACN,WAAU;cAET;IACC,CAAA,CAEF;MAIR,qBAAC,OAAD;GAAK,WAAU;aAAf;IACG,cAAc,iBACb,oBAAC,UAAD;KACE,MAAK;KACL,eAAe,OAAO,OAAO;KAC7B,WAAU;KACV,cAAW;eAEX,oBAAC,iBAAD,EAAiB,WAAU,UAAW,CAAA;KAC/B,CAAA;IAGX,oBAAC,OAAD;KACE,KAAK;KACL,WAAU;eAETA,QAAM,SAAS,IAAI,WAAW,OAAO,MACpC,oBAAC,OAAD;MAEE,WAAW,GACT,2DACA,kBAAkB,OAAO,CAC1B;MACD,OAAO,kBAAkB,GAAG,OAAO;gBAElC;MACG,EARC,EAQD,CACN;KACE,CAAA;IAEL,cAAc,kBACb,oBAAC,UAAD;KACE,MAAK;KACL,eAAe,OAAO,QAAQ;KAC9B,WAAU;KACV,cAAW;eAEX,oBAAC,kBAAD,EAAkB,WAAU,UAAW,CAAA;KAChC,CAAA;IAEP;KACE"}

package/dist/client/storefront/components/product-tabs.d.ts

@@ -1,12 +1,21 @@
-export interface ProductTab {
-    id: string;
-    label: string;
-    content: React.ReactNode;
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/components/product-tabs.d.ts
+interface ProductTab {
+  id: string;
+  label: string;
+  content: React.ReactNode;
 }
-export interface ProductTabsProps {
-    tabs: ProductTab[];
-    defaultTab?: string;
-    className?: string;
+interface ProductTabsProps {
+  tabs: ProductTab[];
+  defaultTab?: string;
+  className?: string;
 }
-export declare function ProductTabs({ tabs, defaultTab, className }: ProductTabsProps): import("react/jsx-runtime").JSX.Element | null;
+declare function ProductTabs({
+  tabs,
+  defaultTab,
+  className
+}: ProductTabsProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { ProductTab, ProductTabs, ProductTabsProps };
 //# sourceMappingURL=product-tabs.d.ts.map

package/dist/client/storefront/components/product-tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"product-tabs.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/components/product-tabs.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,UAAU,EAAE,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,SAAc,EAAE,EAAE,gBAAgB,kDAwEjF"}
+{"version":3,"file":"product-tabs.d.ts","names":[],"sources":["../../../../src/client/storefront/components/product-tabs.tsx"],"mappings":";;;UAIiB,UAAA;EACf,EAAA;EACA,KAAA;EACA,OAAA,EAAS,KAAA,CAAM,SAAA;AAAA;AAAA,UAGA,gBAAA;EACf,IAAA,EAAM,UAAA;EACN,UAAA;EACA,SAAA;AAAA;AAAA,iBAGc,WAAA,CAAA;EAAc,IAAA;EAAM,UAAA;EAAY;AAAA,GAAkB,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/client/storefront/components/product-tabs.mjs

@@ -1,64 +1,56 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/client/storefront/components/product-tabs.tsx
 function ProductTabs({ tabs, defaultTab, className = "" }) {
-  const [activeTab, setActiveTab] = useState(() => defaultTab || tabs[0]?.id || "");
-  if (tabs.length === 0) return null;
-  const activePanel = tabs.find((tab) => tab.id === activeTab);
-  return /* @__PURE__ */ jsxs("div", { className: `font-enad ${className}`, children: [
-    /* @__PURE__ */ jsx("div", { className: "flex border-b border-(--enad-border-color)", role: "tablist", children: tabs.map((tab) => {
-      const isActive = tab.id === activeTab;
-      return /* @__PURE__ */ jsx(
-        "button",
-        {
-          role: "tab",
-          id: `tab-${tab.id}`,
-          "aria-selected": isActive,
-          "aria-controls": `panel-${tab.id}`,
-          tabIndex: isActive ? 0 : -1,
-          onClick: () => setActiveTab(tab.id),
-          onKeyDown: (e) => {
-            const currentIndex = tabs.findIndex((t) => t.id === activeTab);
-            let nextIndex;
-            if (e.key === "ArrowRight") {
-              nextIndex = (currentIndex + 1) % tabs.length;
-            } else if (e.key === "ArrowLeft") {
-              nextIndex = (currentIndex - 1 + tabs.length) % tabs.length;
-            } else if (e.key === "Home") {
-              nextIndex = 0;
-            } else if (e.key === "End") {
-              nextIndex = tabs.length - 1;
-            }
-            if (nextIndex !== void 0) {
-              e.preventDefault();
-              const nextTab = tabs[nextIndex];
-              if (nextTab) {
-                setActiveTab(nextTab.id);
-                const el = document.getElementById(`tab-${nextTab.id}`);
-                el?.focus();
-              }
-            }
-          },
-          className: `px-4 py-3 text-sm font-medium transition-colors border-b-2 -mb-px ${isActive ? "border-(--enad-button-bg) text-(--enad-text-primary-color)" : "border-transparent text-(--enad-text-muted-color) hover:text-(--enad-text-primary-color) hover:border-(--enad-border-color)"}`,
-          children: tab.label
-        },
-        tab.id
-      );
-    }) }),
-    activePanel && /* @__PURE__ */ jsx(
-      "div",
-      {
-        role: "tabpanel",
-        id: `panel-${activePanel.id}`,
-        "aria-labelledby": `tab-${activePanel.id}`,
-        tabIndex: 0,
-        className: "py-4 text-(--enad-text-primary-color)",
-        children: activePanel.content
-      }
-    )
-  ] });
+	const [activeTab, setActiveTab] = useState(() => defaultTab || tabs[0]?.id || "");
+	if (tabs.length === 0) return null;
+	const activePanel = tabs.find((tab) => tab.id === activeTab);
+	return /* @__PURE__ */ jsxs("div", {
+		className: `font-enad ${className}`,
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "flex border-b border-(--enad-border-color)",
+			role: "tablist",
+			children: tabs.map((tab) => {
+				const isActive = tab.id === activeTab;
+				return /* @__PURE__ */ jsx("button", {
+					role: "tab",
+					id: `tab-${tab.id}`,
+					"aria-selected": isActive,
+					"aria-controls": `panel-${tab.id}`,
+					tabIndex: isActive ? 0 : -1,
+					onClick: () => setActiveTab(tab.id),
+					onKeyDown: (e) => {
+						const currentIndex = tabs.findIndex((t) => t.id === activeTab);
+						let nextIndex;
+						if (e.key === "ArrowRight") nextIndex = (currentIndex + 1) % tabs.length;
+						else if (e.key === "ArrowLeft") nextIndex = (currentIndex - 1 + tabs.length) % tabs.length;
+						else if (e.key === "Home") nextIndex = 0;
+						else if (e.key === "End") nextIndex = tabs.length - 1;
+						if (nextIndex !== void 0) {
+							e.preventDefault();
+							const nextTab = tabs[nextIndex];
+							if (nextTab) {
+								setActiveTab(nextTab.id);
+								document.getElementById(`tab-${nextTab.id}`)?.focus();
+							}
+						}
+					},
+					className: `px-4 py-3 text-sm font-medium transition-colors border-b-2 -mb-px ${isActive ? "border-(--enad-button-bg) text-(--enad-text-primary-color)" : "border-transparent text-(--enad-text-muted-color) hover:text-(--enad-text-primary-color) hover:border-(--enad-border-color)"}`,
+					children: tab.label
+				}, tab.id);
+			})
+		}), activePanel && /* @__PURE__ */ jsx("div", {
+			role: "tabpanel",
+			id: `panel-${activePanel.id}`,
+			"aria-labelledby": `tab-${activePanel.id}`,
+			tabIndex: 0,
+			className: "py-4 text-(--enad-text-primary-color)",
+			children: activePanel.content
+		})]
+	});
 }
-export {
-  ProductTabs
-};
+//#endregion
+export { ProductTabs };
+
 //# sourceMappingURL=product-tabs.mjs.map

package/dist/client/storefront/components/product-tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/client/storefront/components/product-tabs.tsx"],"sourcesContent":["\"use client\"\n\nimport { useState } from \"react\"\n\nexport interface ProductTab {\n  id: string\n  label: string\n  content: React.ReactNode\n}\n\nexport interface ProductTabsProps {\n  tabs: ProductTab[]\n  defaultTab?: string\n  className?: string\n}\n\nexport function ProductTabs({ tabs, defaultTab, className = \"\" }: ProductTabsProps) {\n  const [activeTab, setActiveTab] = useState(() => defaultTab || tabs[0]?.id || \"\")\n\n  if (tabs.length === 0) return null\n\n  const activePanel = tabs.find((tab) => tab.id === activeTab)\n\n  return (\n    <div className={`font-enad ${className}`}>\n      {/* Tab list */}\n      <div className=\"flex border-b border-(--enad-border-color)\" role=\"tablist\">\n        {tabs.map((tab) => {\n          const isActive = tab.id === activeTab\n          return (\n            <button\n              key={tab.id}\n              role=\"tab\"\n              id={`tab-${tab.id}`}\n              aria-selected={isActive}\n              aria-controls={`panel-${tab.id}`}\n              tabIndex={isActive ? 0 : -1}\n              onClick={() => setActiveTab(tab.id)}\n              onKeyDown={(e) => {\n                const currentIndex = tabs.findIndex((t) => t.id === activeTab)\n                let nextIndex: number | undefined\n\n                if (e.key === \"ArrowRight\") {\n                  nextIndex = (currentIndex + 1) % tabs.length\n                } else if (e.key === \"ArrowLeft\") {\n                  nextIndex = (currentIndex - 1 + tabs.length) % tabs.length\n                } else if (e.key === \"Home\") {\n                  nextIndex = 0\n                } else if (e.key === \"End\") {\n                  nextIndex = tabs.length - 1\n                }\n\n                if (nextIndex !== undefined) {\n                  e.preventDefault()\n                  const nextTab = tabs[nextIndex]\n                  if (nextTab) {\n                    setActiveTab(nextTab.id)\n                    const el = document.getElementById(`tab-${nextTab.id}`)\n                    el?.focus()\n                  }\n                }\n              }}\n              className={`px-4 py-3 text-sm font-medium transition-colors border-b-2 -mb-px ${\n                isActive\n                  ? \"border-(--enad-button-bg) text-(--enad-text-primary-color)\"\n                  : \"border-transparent text-(--enad-text-muted-color) hover:text-(--enad-text-primary-color) hover:border-(--enad-border-color)\"\n              }`}\n            >\n              {tab.label}\n            </button>\n          )\n        })}\n      </div>\n\n      {/* Tab panel */}\n      {activePanel && (\n        <div\n          role=\"tabpanel\"\n          id={`panel-${activePanel.id}`}\n          aria-labelledby={`tab-${activePanel.id}`}\n          tabIndex={0}\n          className=\"py-4 text-(--enad-text-primary-color)\"\n        >\n          {activePanel.content}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":";AAwBI,SAMQ,KANR;AAtBJ,SAAS,gBAAgB;AAclB,SAAS,YAAY,EAAE,MAAM,YAAY,YAAY,GAAG,GAAqB;AAClF,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,MAAM,cAAc,KAAK,CAAC,GAAG,MAAM,EAAE;AAEhF,MAAI,KAAK,WAAW,EAAG,QAAO;AAE9B,QAAM,cAAc,KAAK,KAAK,CAAC,QAAQ,IAAI,OAAO,SAAS;AAE3D,SACE,qBAAC,SAAI,WAAW,aAAa,SAAS,IAEpC;AAAA,wBAAC,SAAI,WAAU,8CAA6C,MAAK,WAC9D,eAAK,IAAI,CAAC,QAAQ;AACjB,YAAM,WAAW,IAAI,OAAO;AAC5B,aACE;AAAA,QAAC;AAAA;AAAA,UAEC,MAAK;AAAA,UACL,IAAI,OAAO,IAAI,EAAE;AAAA,UACjB,iBAAe;AAAA,UACf,iBAAe,SAAS,IAAI,EAAE;AAAA,UAC9B,UAAU,WAAW,IAAI;AAAA,UACzB,SAAS,MAAM,aAAa,IAAI,EAAE;AAAA,UAClC,WAAW,CAAC,MAAM;AAChB,kBAAM,eAAe,KAAK,UAAU,CAAC,MAAM,EAAE,OAAO,SAAS;AAC7D,gBAAI;AAEJ,gBAAI,EAAE,QAAQ,cAAc;AAC1B,2BAAa,eAAe,KAAK,KAAK;AAAA,YACxC,WAAW,EAAE,QAAQ,aAAa;AAChC,2BAAa,eAAe,IAAI,KAAK,UAAU,KAAK;AAAA,YACtD,WAAW,EAAE,QAAQ,QAAQ;AAC3B,0BAAY;AAAA,YACd,WAAW,EAAE,QAAQ,OAAO;AAC1B,0BAAY,KAAK,SAAS;AAAA,YAC5B;AAEA,gBAAI,cAAc,QAAW;AAC3B,gBAAE,eAAe;AACjB,oBAAM,UAAU,KAAK,SAAS;AAC9B,kBAAI,SAAS;AACX,6BAAa,QAAQ,EAAE;AACvB,sBAAM,KAAK,SAAS,eAAe,OAAO,QAAQ,EAAE,EAAE;AACtD,oBAAI,MAAM;AAAA,cACZ;AAAA,YACF;AAAA,UACF;AAAA,UACA,WAAW,qEACT,WACI,+DACA,6HACN;AAAA,UAEC,cAAI;AAAA;AAAA,QArCA,IAAI;AAAA,MAsCX;AAAA,IAEJ,CAAC,GACH;AAAA,IAGC,eACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,IAAI,SAAS,YAAY,EAAE;AAAA,QAC3B,mBAAiB,OAAO,YAAY,EAAE;AAAA,QACtC,UAAU;AAAA,QACV,WAAU;AAAA,QAET,sBAAY;AAAA;AAAA,IACf;AAAA,KAEJ;AAEJ;","names":[]}
+{"version":3,"file":"product-tabs.mjs","names":[],"sources":["../../../../src/client/storefront/components/product-tabs.tsx"],"sourcesContent":["\"use client\"\n\nimport { useState } from \"react\"\n\nexport interface ProductTab {\n  id: string\n  label: string\n  content: React.ReactNode\n}\n\nexport interface ProductTabsProps {\n  tabs: ProductTab[]\n  defaultTab?: string\n  className?: string\n}\n\nexport function ProductTabs({ tabs, defaultTab, className = \"\" }: ProductTabsProps) {\n  const [activeTab, setActiveTab] = useState(() => defaultTab || tabs[0]?.id || \"\")\n\n  if (tabs.length === 0) return null\n\n  const activePanel = tabs.find((tab) => tab.id === activeTab)\n\n  return (\n    <div className={`font-enad ${className}`}>\n      {/* Tab list */}\n      <div className=\"flex border-b border-(--enad-border-color)\" role=\"tablist\">\n        {tabs.map((tab) => {\n          const isActive = tab.id === activeTab\n          return (\n            <button\n              key={tab.id}\n              role=\"tab\"\n              id={`tab-${tab.id}`}\n              aria-selected={isActive}\n              aria-controls={`panel-${tab.id}`}\n              tabIndex={isActive ? 0 : -1}\n              onClick={() => setActiveTab(tab.id)}\n              onKeyDown={(e) => {\n                const currentIndex = tabs.findIndex((t) => t.id === activeTab)\n                let nextIndex: number | undefined\n\n                if (e.key === \"ArrowRight\") {\n                  nextIndex = (currentIndex + 1) % tabs.length\n                } else if (e.key === \"ArrowLeft\") {\n                  nextIndex = (currentIndex - 1 + tabs.length) % tabs.length\n                } else if (e.key === \"Home\") {\n                  nextIndex = 0\n                } else if (e.key === \"End\") {\n                  nextIndex = tabs.length - 1\n                }\n\n                if (nextIndex !== undefined) {\n                  e.preventDefault()\n                  const nextTab = tabs[nextIndex]\n                  if (nextTab) {\n                    setActiveTab(nextTab.id)\n                    const el = document.getElementById(`tab-${nextTab.id}`)\n                    el?.focus()\n                  }\n                }\n              }}\n              className={`px-4 py-3 text-sm font-medium transition-colors border-b-2 -mb-px ${\n                isActive\n                  ? \"border-(--enad-button-bg) text-(--enad-text-primary-color)\"\n                  : \"border-transparent text-(--enad-text-muted-color) hover:text-(--enad-text-primary-color) hover:border-(--enad-border-color)\"\n              }`}\n            >\n              {tab.label}\n            </button>\n          )\n        })}\n      </div>\n\n      {/* Tab panel */}\n      {activePanel && (\n        <div\n          role=\"tabpanel\"\n          id={`panel-${activePanel.id}`}\n          aria-labelledby={`tab-${activePanel.id}`}\n          tabIndex={0}\n          className=\"py-4 text-(--enad-text-primary-color)\"\n        >\n          {activePanel.content}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":";;;;AAgBA,SAAgB,YAAY,EAAE,MAAM,YAAY,YAAY,MAAwB;CAClF,MAAM,CAAC,WAAW,gBAAgB,eAAe,cAAc,KAAK,IAAI,MAAM,GAAG;AAEjF,KAAI,KAAK,WAAW,EAAG,QAAO;CAE9B,MAAM,cAAc,KAAK,MAAM,QAAQ,IAAI,OAAO,UAAU;AAE5D,QACE,qBAAC,OAAD;EAAK,WAAW,aAAa;YAA7B,CAEE,oBAAC,OAAD;GAAK,WAAU;GAA6C,MAAK;aAC9D,KAAK,KAAK,QAAQ;IACjB,MAAM,WAAW,IAAI,OAAO;AAC5B,WACE,oBAAC,UAAD;KAEE,MAAK;KACL,IAAI,OAAO,IAAI;KACf,iBAAe;KACf,iBAAe,SAAS,IAAI;KAC5B,UAAU,WAAW,IAAI;KACzB,eAAe,aAAa,IAAI,GAAG;KACnC,YAAY,MAAM;MAChB,MAAM,eAAe,KAAK,WAAW,MAAM,EAAE,OAAO,UAAU;MAC9D,IAAI;AAEJ,UAAI,EAAE,QAAQ,aACZ,cAAa,eAAe,KAAK,KAAK;eAC7B,EAAE,QAAQ,YACnB,cAAa,eAAe,IAAI,KAAK,UAAU,KAAK;eAC3C,EAAE,QAAQ,OACnB,aAAY;eACH,EAAE,QAAQ,MACnB,aAAY,KAAK,SAAS;AAG5B,UAAI,cAAc,KAAA,GAAW;AAC3B,SAAE,gBAAgB;OAClB,MAAM,UAAU,KAAK;AACrB,WAAI,SAAS;AACX,qBAAa,QAAQ,GAAG;AACb,iBAAS,eAAe,OAAO,QAAQ,KAAK,EACnD,OAAO;;;;KAIjB,WAAW,qEACT,WACI,+DACA;eAGL,IAAI;KACE,EAtCF,IAAI,GAsCF;KAEX;GACE,CAAA,EAGL,eACC,oBAAC,OAAD;GACE,MAAK;GACL,IAAI,SAAS,YAAY;GACzB,mBAAiB,OAAO,YAAY;GACpC,UAAU;GACV,WAAU;aAET,YAAY;GACT,CAAA,CAEJ"}

package/dist/client/storefront/components/quick-view.d.ts

@@ -1,25 +1,39 @@
-import * as React from "react";
-import type { ImageAsset } from "../types";
-export interface QuickViewProduct {
-    title: string;
-    images?: ImageAsset[];
-    price?: React.ReactNode;
-    description?: string;
-    href?: string;
+import { ImageAsset } from "../types.js";
+import * as React$1 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/components/quick-view.d.ts
+interface QuickViewProduct {
+  title: string;
+  images?: ImageAsset[];
+  price?: React$1.ReactNode;
+  description?: string;
+  href?: string;
 }
-export interface QuickViewProps {
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    product: QuickViewProduct | null;
-    /** Presentation mode */
-    mode?: "sheet" | "modal";
-    /** Side when mode is "sheet" */
-    side?: "right" | "left";
-    /** Slot for variant selector, add-to-cart, wishlist, etc. */
-    children?: React.ReactNode;
-    /** Link label for "View full details" */
-    viewDetailsLabel?: string;
-    className?: string;
+interface QuickViewProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  product: QuickViewProduct | null;
+  /** Presentation mode */
+  mode?: "sheet" | "modal";
+  /** Side when mode is "sheet" */
+  side?: "right" | "left";
+  /** Slot for variant selector, add-to-cart, wishlist, etc. */
+  children?: React$1.ReactNode;
+  /** Link label for "View full details" */
+  viewDetailsLabel?: string;
+  className?: string;
 }
-export declare function QuickView({ open, onOpenChange, product, mode, side, viewDetailsLabel, children, className, }: QuickViewProps): import("react/jsx-runtime").JSX.Element | null;
+declare function QuickView({
+  open,
+  onOpenChange,
+  product,
+  mode,
+  side,
+  viewDetailsLabel,
+  children,
+  className
+}: QuickViewProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { QuickView, QuickViewProduct, QuickViewProps };
 //# sourceMappingURL=quick-view.d.ts.map

package/dist/client/storefront/components/quick-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"quick-view.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/components/quick-view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAI3C,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,wBAAwB;IACxB,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IACzB,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,yCAAyC;IACzC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,IAAc,EACd,IAAc,EACd,gBAAsC,EACtC,QAAQ,EACR,SAAS,GACV,EAAE,cAAc,kDAoEhB"}
+{"version":3,"file":"quick-view.d.ts","names":[],"sources":["../../../../src/client/storefront/components/quick-view.tsx"],"mappings":";;;;;UAUiB,gBAAA;EACf,KAAA;EACA,MAAA,GAAS,UAAA;EACT,KAAA,GAAQ,OAAA,CAAM,SAAA;EACd,WAAA;EACA,IAAA;AAAA;AAAA,UAGe,cAAA;EACf,IAAA;EACA,YAAA,GAAe,IAAA;EACf,OAAA,EAAS,gBAAA;EARD;EAUR,IAAA;EATA;EAWA,IAAA;EAVI;EAYJ,QAAA,GAAW,OAAA,CAAM,SAAA;EATF;EAWf,gBAAA;EACA,SAAA;AAAA;AAAA,iBAKc,SAAA,CAAA;EACd,IAAA;EACA,YAAA;EACA,OAAA;EACA,IAAA;EACA,IAAA;EACA,gBAAA;EACA,QAAA;EACA;AAAA,GACC,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}