@shopify/shop-minis-react 0.0.27 → 0.0.29

package/dist/_virtual/index2.js

@@ -1,8 +1,8 @@
 import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
-import { __require as o } from "../shop-minis-react/node_modules/.pnpm/color@4.2.3/node_modules/color/index.js";
-var t = /* @__PURE__ */ o();
-const l = /* @__PURE__ */ r(t);
+import { __require as o } from "../shop-minis-react/node_modules/.pnpm/@videojs_xhr@2.7.0/node_modules/@videojs/xhr/lib/index.js";
+var t = o();
+const a = /* @__PURE__ */ r(t);
 export {
-  l as default
+  a as default
 };
 //# sourceMappingURL=index2.js.map

package/dist/_virtual/index3.js

@@ -1,8 +1,8 @@
 import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
-import { __require as o } from "../shop-minis-react/node_modules/.pnpm/@videojs_xhr@2.7.0/node_modules/@videojs/xhr/lib/index.js";
-var t = o();
-const a = /* @__PURE__ */ r(t);
+import { __require as o } from "../shop-minis-react/node_modules/.pnpm/color@4.2.3/node_modules/color/index.js";
+var t = /* @__PURE__ */ o();
+const l = /* @__PURE__ */ r(t);
 export {
-  a as default
+  l as default
 };
 //# sourceMappingURL=index3.js.map

package/dist/components/atoms/content-monitor.js

@@ -0,0 +1,22 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useShopActions as n } from "../../internal/useShopActions.js";
+import { LongPressDetector as s } from "./long-press-detector.js";
+function c({
+  publicId: o,
+  children: r
+}) {
+  const { showFeedbackSheet: t } = n();
+  return /* @__PURE__ */ e(
+    s,
+    {
+      onLongPress: () => {
+        o && t({ publicId: o });
+      },
+      children: r
+    }
+  );
+}
+export {
+  c as ContentMonitor
+};
+//# sourceMappingURL=content-monitor.js.map

package/dist/components/atoms/content-monitor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-monitor.js","sources":["../../../src/components/atoms/content-monitor.tsx"],"sourcesContent":["import {useShopActions} from '../../internal/useShopActions'\n\nimport {LongPressDetector} from './long-press-detector'\n\nexport function ContentMonitor({\n  publicId,\n  children,\n}: {\n  publicId?: string\n  children: React.ReactNode\n}) {\n  const {showFeedbackSheet} = useShopActions()\n\n  return (\n    <LongPressDetector\n      onLongPress={() => {\n        if (!publicId) return\n\n        showFeedbackSheet({publicId})\n      }}\n    >\n      {children}\n    </LongPressDetector>\n  )\n}\n"],"names":["ContentMonitor","publicId","children","showFeedbackSheet","useShopActions","jsx","LongPressDetector"],"mappings":";;;AAIO,SAASA,EAAe;AAAA,EAC7B,UAAAC;AAAA,EACA,UAAAC;AACF,GAGG;AACK,QAAA,EAAC,mBAAAC,EAAiB,IAAIC,EAAe;AAGzC,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAa,MAAM;AACjB,QAAKL,KAEaE,EAAA,EAAC,UAAAF,GAAS;AAAA,MAC9B;AAAA,MAEC,UAAAC;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/components/atoms/content-wrapper.js

@@ -0,0 +1,18 @@
+import { jsx as p } from "react/jsx-runtime";
+import { useContent as c } from "../../hooks/content/useContent.js";
+import { ContentMonitor as m } from "./content-monitor.js";
+function C({
+  publicId: o,
+  externalId: r,
+  children: e
+}) {
+  const { content: i, loading: t } = c({
+    identifiers: [{ publicId: o, externalId: r }],
+    skip: !o && !r
+  }), n = i?.[0];
+  return t || !n ? e({ loading: t }) : /* @__PURE__ */ p(m, { publicId: n.publicId, children: e({ content: n, loading: t }) });
+}
+export {
+  C as ContentWrapper
+};
+//# sourceMappingURL=content-wrapper.js.map

package/dist/components/atoms/content-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-wrapper.js","sources":["../../../src/components/atoms/content-wrapper.tsx"],"sourcesContent":["import {useContent} from '../../hooks/content/useContent'\nimport {Content} from '../../types'\n\nimport {ContentMonitor} from './content-monitor'\n\ninterface BaseContentWrapperProps {\n  children: ({\n    content,\n    loading,\n  }: {\n    content?: Content\n    loading: boolean\n  }) => JSX.Element | null\n}\n\ninterface PublicIdContentWrapperProps extends BaseContentWrapperProps {\n  publicId: string\n  externalId?: never\n}\n\ninterface ExternalIdContentWrapperProps extends BaseContentWrapperProps {\n  externalId: string\n  publicId?: never\n}\n\ntype ContentWrapperProps =\n  | PublicIdContentWrapperProps\n  | ExternalIdContentWrapperProps\n\n// It's too messy in the docs to show the complete types here so we show a simplified version\nexport interface ContentWrapperPropsForDocs extends BaseContentWrapperProps {\n  publicId?: string\n  externalId?: string\n}\n\nexport function ContentWrapper({\n  publicId,\n  externalId,\n  children,\n}: ContentWrapperProps) {\n  const {content, loading} = useContent({\n    identifiers: [{publicId, externalId}],\n    skip: !publicId && !externalId,\n  })\n\n  const contentItem = content?.[0]\n\n  if (loading || !contentItem) {\n    return children({loading})\n  }\n\n  return (\n    <ContentMonitor publicId={contentItem.publicId}>\n      {children({content: contentItem, loading})}\n    </ContentMonitor>\n  )\n}\n"],"names":["ContentWrapper","publicId","externalId","children","content","loading","useContent","contentItem","jsx","ContentMonitor"],"mappings":";;;AAmCO,SAASA,EAAe;AAAA,EAC7B,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AACF,GAAwB;AACtB,QAAM,EAAC,SAAAC,GAAS,SAAAC,EAAO,IAAIC,EAAW;AAAA,IACpC,aAAa,CAAC,EAAC,UAAAL,GAAU,YAAAC,GAAW;AAAA,IACpC,MAAM,CAACD,KAAY,CAACC;AAAA,EAAA,CACrB,GAEKK,IAAcH,IAAU,CAAC;AAE3B,SAAAC,KAAW,CAACE,IACPJ,EAAS,EAAC,SAAAE,GAAQ,IAIzB,gBAAAG,EAACC,GAAe,EAAA,UAAUF,EAAY,UACnC,UAASJ,EAAA,EAAC,SAASI,GAAa,SAAAF,EAAO,CAAC,EAC3C,CAAA;AAEJ;"}

package/dist/components/atoms/long-press-detector.js

@@ -0,0 +1,33 @@
+import { jsx as i } from "react/jsx-runtime";
+import * as t from "react";
+import { motion as s } from "../../shop-minis-react/node_modules/.pnpm/motion@12.17.3_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/motion/dist/es/framer-motion/dist/es/render/components/motion/proxy.js";
+const l = ({
+  onLongPress: e,
+  delay: o = 500,
+  children: c,
+  ...a
+}) => {
+  const r = t.useRef(void 0), u = t.useCallback(() => {
+    r.current = window.setTimeout(() => {
+      e(), r.current = void 0;
+    }, o);
+  }, [e, o]), n = t.useCallback(() => {
+    r.current && (clearTimeout(r.current), r.current = void 0);
+  }, []);
+  return t.useEffect(() => () => {
+    r.current && clearTimeout(r.current);
+  }, []), /* @__PURE__ */ i(
+    s.div,
+    {
+      onTapStart: u,
+      onTap: n,
+      onTapCancel: n,
+      ...a,
+      children: c
+    }
+  );
+};
+export {
+  l as LongPressDetector
+};
+//# sourceMappingURL=long-press-detector.js.map

package/dist/components/atoms/long-press-detector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"long-press-detector.js","sources":["../../../src/components/atoms/long-press-detector.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {motion, HTMLMotionProps} from 'motion/react'\n\ninterface LongPressDetectorProps extends HTMLMotionProps<'div'> {\n  onLongPress: () => void\n  delay?: number\n  children: React.ReactNode\n}\n\nexport const LongPressDetector = ({\n  onLongPress,\n  delay = 500,\n  children,\n  ...motionProps\n}: LongPressDetectorProps) => {\n  const longPressTimeoutRef = React.useRef<number | undefined>(undefined)\n\n  const handleTapStart = React.useCallback(() => {\n    longPressTimeoutRef.current = window.setTimeout(() => {\n      onLongPress()\n      longPressTimeoutRef.current = undefined\n    }, delay)\n  }, [onLongPress, delay])\n\n  const handleTapEnd = React.useCallback(() => {\n    if (longPressTimeoutRef.current) {\n      clearTimeout(longPressTimeoutRef.current)\n      longPressTimeoutRef.current = undefined\n    }\n  }, [])\n\n  // Cleanup timer on unmount\n  React.useEffect(() => {\n    return () => {\n      if (longPressTimeoutRef.current) {\n        clearTimeout(longPressTimeoutRef.current)\n      }\n    }\n  }, [])\n\n  return (\n    <motion.div\n      onTapStart={handleTapStart}\n      onTap={handleTapEnd}\n      onTapCancel={handleTapEnd}\n      {...motionProps}\n    >\n      {children}\n    </motion.div>\n  )\n}\n"],"names":["LongPressDetector","onLongPress","delay","children","motionProps","longPressTimeoutRef","React","handleTapStart","handleTapEnd","jsx","motion"],"mappings":";;;AAUO,MAAMA,IAAoB,CAAC;AAAA,EAChC,aAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,GAAGC;AACL,MAA8B;AACtB,QAAAC,IAAsBC,EAAM,OAA2B,MAAS,GAEhEC,IAAiBD,EAAM,YAAY,MAAM;AACzB,IAAAD,EAAA,UAAU,OAAO,WAAW,MAAM;AACxC,MAAAJ,EAAA,GACZI,EAAoB,UAAU;AAAA,OAC7BH,CAAK;AAAA,EAAA,GACP,CAACD,GAAaC,CAAK,CAAC,GAEjBM,IAAeF,EAAM,YAAY,MAAM;AAC3C,IAAID,EAAoB,YACtB,aAAaA,EAAoB,OAAO,GACxCA,EAAoB,UAAU;AAAA,EAElC,GAAG,EAAE;AAGL,SAAAC,EAAM,UAAU,MACP,MAAM;AACX,IAAID,EAAoB,WACtB,aAAaA,EAAoB,OAAO;AAAA,EAE5C,GACC,EAAE,GAGH,gBAAAI;AAAA,IAACC,EAAO;AAAA,IAAP;AAAA,MACC,YAAYH;AAAA,MACZ,OAAOC;AAAA,MACP,aAAaA;AAAA,MACZ,GAAGJ;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/components/commerce/product-link.js

@@ -1,16 +1,16 @@
-import { jsxs as c, jsx as t, Fragment as F } from "react/jsx-runtime";
+import { jsxs as c, jsx as t, Fragment as j } from "react/jsx-runtime";
 import * as w from "react";
-import { cva as j } from "../../shop-minis-react/node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { useShopNavigation as O } from "../../hooks/navigation/useShopNavigation.js";
-import { useSavedProductsActions as M } from "../../hooks/user/useSavedProductsActions.js";
-import { formatMoney as A } from "../../lib/formatMoney.js";
+import { cva as O } from "../../shop-minis-react/node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { useShopNavigation as M } from "../../hooks/navigation/useShopNavigation.js";
+import { useSavedProductsActions as D } from "../../hooks/user/useSavedProductsActions.js";
+import { formatMoney as z } from "../../lib/formatMoney.js";
 import { cn as n } from "../../lib/utils.js";
-import { FavoriteButton as D } from "../atoms/favorite-button.js";
-import { Touchable as z } from "../atoms/touchable.js";
-import { Card as q, CardContent as B, CardAction as U } from "../ui/card.js";
-import _ from "../../shop-minis-react/node_modules/.pnpm/lucide-react@0.513.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/star.js";
-import { Root as E } from "../../shop-minis-react/node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.6_react@19.1.0/node_modules/@radix-ui/react-slot/dist/index.js";
-const G = j("", {
+import { FavoriteButton as q } from "../atoms/favorite-button.js";
+import { Touchable as T } from "../atoms/touchable.js";
+import { Card as B, CardContent as U, CardAction as _ } from "../ui/card.js";
+import E from "../../shop-minis-react/node_modules/.pnpm/lucide-react@0.513.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/star.js";
+import { Root as G } from "../../shop-minis-react/node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.6_react@19.1.0/node_modules/@radix-ui/react-slot/dist/index.js";
+const H = O("", {
   variants: {
     layout: {
       horizontal: "w-full !flex-row items-center gap-3 px-4 py-3",
@@ -27,16 +27,16 @@ const G = j("", {
     discount: "none"
   }
 });
-function H({
-  className: o,
-  layout: e,
+function J({
+  className: e,
+  layout: o,
   discount: r,
-  asChild: i = !1,
+  asChild: a = !1,
   onPress: l,
-  ...a
+  ...s
 }) {
   return /* @__PURE__ */ t(
-    z,
+    T,
     {
       onClick: l,
       whileTap: { opacity: 0.7 },
@@ -44,22 +44,22 @@ function H({
         opacity: { type: "tween", duration: 0.08, ease: "easeInOut" }
       },
       children: /* @__PURE__ */ t(
-        i ? E : q,
+        a ? G : B,
         {
           className: n(
-            G({ layout: e, discount: r }),
+            H({ layout: o, discount: r }),
             "border-0 bg-white rounded-xl shadow-lg shadow-black/10",
-            o
+            e
           ),
-          ...a
+          ...s
         }
       )
     }
   );
 }
-function J({
-  className: o,
-  layout: e = "horizontal",
+function K({
+  className: e,
+  layout: o = "horizontal",
   ...r
 }) {
   return /* @__PURE__ */ t(
@@ -68,32 +68,32 @@ function J({
       "data-slot": "product-link-image",
       className: n(
         "overflow-hidden rounded-md bg-muted",
-        e === "horizontal" ? "h-16 w-16 flex-shrink-0" : "aspect-square w-full",
-        o
+        o === "horizontal" ? "h-16 w-16 flex-shrink-0" : "aspect-square w-full",
+        e
       ),
       ...r
     }
   );
 }
-function K({
-  className: o,
-  layout: e = "horizontal",
+function Q({
+  className: e,
+  layout: o = "horizontal",
   ...r
 }) {
   return /* @__PURE__ */ t(
-    B,
+    U,
     {
       className: n(
-        e === "horizontal" ? "flex-1 min-w-0 space-y-1 px-0 py-0" : "space-y-2",
-        o
+        o === "horizontal" ? "flex-1 min-w-0 space-y-1 px-0 py-0" : "space-y-2",
+        e
       ),
       ...r
     }
   );
 }
-function Q({
-  className: o,
-  children: e,
+function W({
+  className: e,
+  children: o,
   ...r
 }) {
   return /* @__PURE__ */ t(
@@ -102,188 +102,192 @@ function Q({
       "data-slot": "product-link-title",
       className: n(
         "text-sm font-medium leading-tight text-gray-900 truncate overflow-hidden whitespace-nowrap text-ellipsis",
-        o
+        e
       ),
       ...r,
-      children: e
+      children: o
     }
   );
 }
-function W({ className: o, ...e }) {
+function X({ className: e, ...o }) {
   return /* @__PURE__ */ t(
     "div",
     {
       "data-slot": "product-link-price",
-      className: n("flex items-center gap-2", o),
-      ...e
+      className: n("flex items-center gap-2", e),
+      ...o
     }
   );
 }
-function X({
-  className: o,
-  ...e
+function Y({
+  className: e,
+  ...o
 }) {
   return /* @__PURE__ */ t(
     "span",
     {
       "data-slot": "product-link-current-price",
-      className: n("text-sm font-semibold text-gray-900", o),
-      ...e
+      className: n("text-sm font-semibold text-gray-900", e),
+      ...o
     }
   );
 }
-function Y({
-  className: o,
-  ...e
+function Z({
+  className: e,
+  ...o
 }) {
   return /* @__PURE__ */ t(
     "span",
     {
       "data-slot": "product-link-original-price",
-      className: n("text-sm text-gray-500 line-through", o),
-      ...e
+      className: n("text-sm text-gray-500 line-through", e),
+      ...o
     }
   );
 }
-function Z({
-  className: o,
-  ...e
+function $({
+  className: e,
+  ...o
 }) {
   return /* @__PURE__ */ t(
     "span",
     {
       "data-slot": "product-link-discount-price",
-      className: n("text-sm font-semibold text-red-600", o),
-      ...e
+      className: n("text-sm font-semibold text-red-600", e),
+      ...o
     }
   );
 }
-function $({ className: o, ...e }) {
+function tt({ className: e, ...o }) {
   return /* @__PURE__ */ t(
     "div",
     {
       "data-slot": "product-link-rating",
       className: n(
         "flex items-center gap-1 text-xs text-muted-foreground",
-        o
+        e
       ),
-      ...e
+      ...o
     }
   );
 }
-function tt({
-  className: o,
-  onPress: e,
+function et({
+  className: e,
+  onPress: o,
   filled: r = !1,
-  ...i
+  ...a
 }) {
   return /* @__PURE__ */ t(
-    U,
+    _,
     {
-      className: n("flex-shrink-0 self-center px-0 py-0", o),
-      ...i,
+      className: n("flex-shrink-0 self-center px-0 py-0", e),
+      ...a,
       children: /* @__PURE__ */ t(
-        z,
+        T,
         {
           stopPropagation: !0,
-          onClick: e,
+          onClick: o,
           whileTap: { opacity: 0.7, scale: 0.95 },
           transition: {
             opacity: { type: "tween", duration: 0.08, ease: "easeInOut" },
             scale: { type: "tween", duration: 0.08, ease: "easeInOut" }
           },
-          children: /* @__PURE__ */ t(D, { filled: r, onClick: e })
+          children: /* @__PURE__ */ t(q, { filled: r, onClick: o })
         }
       )
     }
   );
 }
-function mt({ product: o, hideFavoriteAction: e = !1 }) {
-  const { navigateToProduct: r } = O(), { saveProduct: i, unsaveProduct: l } = M(), {
-    id: a,
-    title: u,
-    featuredImage: P,
+function pt({
+  product: e,
+  hideFavoriteAction: o = !1,
+  onClick: r
+}) {
+  const { navigateToProduct: a } = M(), { saveProduct: l, unsaveProduct: s } = D(), {
+    id: i,
+    title: P,
+    featuredImage: N,
     reviewAnalytics: C,
     price: m,
     compareAtPrice: p,
-    isFavorited: T,
+    isFavorited: R,
     selectedVariant: f,
     defaultVariantId: h,
     shop: g
-  } = o, [x, N] = w.useState(T), y = C?.averageRating, I = C?.reviewCount, v = m?.amount ? A(m?.amount, m?.currencyCode) : void 0, L = P?.url, R = P?.altText || u, k = p?.amount ? A(p?.amount, p?.currencyCode) : void 0, b = k && k !== v, S = w.useCallback(() => {
-    r({
-      productId: a
-    });
-  }, [r, a]), V = w.useCallback(async () => {
-    const s = x;
-    N(!s);
+  } = e, [x, I] = w.useState(R), y = C?.averageRating, L = C?.reviewCount, v = m?.amount ? z(m?.amount, m?.currencyCode) : void 0, b = N?.url, S = N?.altText || P, k = p?.amount ? z(p?.amount, p?.currencyCode) : void 0, A = k && k !== v, V = w.useCallback(() => {
+    a({
+      productId: i
+    }), r?.(e);
+  }, [a, i, r, e]), F = w.useCallback(async () => {
+    const d = x;
+    I(!d);
     try {
-      s ? await l({
-        productId: a,
+      d ? await s({
+        productId: i,
         shopId: g.id,
         productVariantId: f?.id || h
-      }) : await i({
-        productId: a,
+      }) : await l({
+        productId: i,
         shopId: g.id,
         productVariantId: f?.id || h
       });
     } catch {
-      N(s);
+      I(d);
     }
   }, [
     x,
-    a,
+    i,
     g.id,
     f?.id,
     h,
-    i,
-    l
+    l,
+    s
   ]);
   return /* @__PURE__ */ c(
-    H,
+    J,
     {
       layout: "horizontal",
-      discount: b ? "small" : "none",
-      onPress: S,
+      discount: A ? "small" : "none",
+      onPress: V,
       children: [
-        /* @__PURE__ */ t(J, { layout: "horizontal", children: L ? /* @__PURE__ */ t(
+        /* @__PURE__ */ t(K, { layout: "horizontal", children: b ? /* @__PURE__ */ t(
           "img",
           {
-            src: L,
-            alt: R,
+            src: b,
+            alt: S,
             className: "h-full w-full object-cover"
           }
         ) : /* @__PURE__ */ t("div", { className: "h-full w-full bg-muted flex items-center justify-center text-muted-foreground text-xs", children: "No Image" }) }),
-        /* @__PURE__ */ c(K, { layout: "horizontal", children: [
-          /* @__PURE__ */ t(Q, { children: u }),
-          I && y && /* @__PURE__ */ t($, { children: /* @__PURE__ */ c("div", { className: "flex items-center gap-1", children: [
-            Array.from({ length: 5 }, (s, d) => /* @__PURE__ */ t(
-              _,
+        /* @__PURE__ */ c(Q, { layout: "horizontal", children: [
+          /* @__PURE__ */ t(W, { children: P }),
+          L && y ? /* @__PURE__ */ t(tt, { children: /* @__PURE__ */ c("div", { className: "flex items-center gap-1", children: [
+            Array.from({ length: 5 }, (d, u) => /* @__PURE__ */ t(
+              E,
               {
-                fill: d < Math.floor(y) ? "currentColor" : "none",
+                fill: u < Math.floor(y) ? "currentColor" : "none",
                 className: n(
                   "h-3 w-3",
-                  d < Math.floor(y) ? "text-primary" : "text-gray-300"
+                  u < Math.floor(y) ? "text-primary" : "text-gray-300"
                 )
               },
-              d
+              u
             )),
             /* @__PURE__ */ c("span", { className: "text-xs text-gray-600 ml-1", children: [
               "(",
-              I,
+              L,
               ")"
             ] })
-          ] }) }),
-          /* @__PURE__ */ t(W, { children: b ? /* @__PURE__ */ c(F, { children: [
-            /* @__PURE__ */ t(Z, { children: v }),
-            /* @__PURE__ */ t(Y, { children: k })
-          ] }) : /* @__PURE__ */ t(X, { children: v }) })
+          ] }) }) : null,
+          /* @__PURE__ */ t(X, { children: A ? /* @__PURE__ */ c(j, { children: [
+            /* @__PURE__ */ t($, { children: v }),
+            /* @__PURE__ */ t(Z, { children: k })
+          ] }) : /* @__PURE__ */ t(Y, { children: v }) })
         ] }),
-        e ? null : /* @__PURE__ */ t(
-          tt,
+        o ? null : /* @__PURE__ */ t(
+          et,
           {
             filled: x,
-            onPress: V
+            onPress: F
           }
         )
       ]
@@ -291,6 +295,6 @@ function mt({ product: o, hideFavoriteAction: e = !1 }) {
   );
 }
 export {
-  mt as ProductLink
+  pt as ProductLink
 };
 //# sourceMappingURL=product-link.js.map

package/dist/components/commerce/product-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"product-link.js","sources":["../../../src/components/commerce/product-link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {type Product} from '@shopify/shop-minis-platform'\nimport {cva, type VariantProps} from 'class-variance-authority'\nimport {Star} from 'lucide-react'\nimport {Slot as SlotPrimitive} from 'radix-ui'\n\nimport {useShopNavigation} from '../../hooks/navigation/useShopNavigation'\nimport {useSavedProductsActions} from '../../hooks/user/useSavedProductsActions'\nimport {formatMoney} from '../../lib/formatMoney'\nimport {cn} from '../../lib/utils'\nimport {FavoriteButton} from '../atoms/favorite-button'\nimport {Touchable} from '../atoms/touchable'\nimport {Card, CardContent, CardAction} from '../ui/card'\n\nconst productLinkVariants = cva('', {\n  variants: {\n    layout: {\n      horizontal: 'w-full !flex-row items-center gap-3 px-4 py-3',\n      vertical: 'flex-col',\n    },\n    discount: {\n      none: '',\n      small: '',\n      large: '',\n    },\n  },\n  defaultVariants: {\n    layout: 'horizontal',\n    discount: 'none',\n  },\n})\n\n// Primitive components (building blocks)\nexport interface ProductLinkRootProps\n  extends React.ComponentProps<typeof Card>,\n    VariantProps<typeof productLinkVariants> {\n  layout?: 'horizontal' | 'vertical'\n  asChild?: boolean\n  onPress?: () => void\n}\n\nfunction ProductLinkRoot({\n  className,\n  layout,\n  discount,\n  asChild = false,\n  onPress,\n  ...props\n}: ProductLinkRootProps) {\n  const Comp = asChild ? SlotPrimitive.Root : Card\n\n  return (\n    <Touchable\n      onClick={onPress}\n      whileTap={{opacity: 0.7}}\n      transition={{\n        opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},\n      }}\n    >\n      <Comp\n        className={cn(\n          productLinkVariants({layout, discount}),\n          'border-0 bg-white rounded-xl shadow-lg shadow-black/10',\n          className\n        )}\n        {...props}\n      />\n    </Touchable>\n  )\n}\n\nfunction ProductLinkImage({\n  className,\n  layout = 'horizontal',\n  ...props\n}: React.ComponentProps<'div'> & {layout?: 'horizontal' | 'vertical'}) {\n  return (\n    <div\n      data-slot=\"product-link-image\"\n      className={cn(\n        'overflow-hidden rounded-md bg-muted',\n        layout === 'horizontal'\n          ? 'h-16 w-16 flex-shrink-0'\n          : 'aspect-square w-full',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkInfo({\n  className,\n  layout = 'horizontal',\n  ...props\n}: React.ComponentProps<typeof CardContent> & {\n  layout?: 'horizontal' | 'vertical'\n}) {\n  return (\n    <CardContent\n      className={cn(\n        layout === 'horizontal'\n          ? 'flex-1 min-w-0 space-y-1 px-0 py-0'\n          : 'space-y-2',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkTitle({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<'h3'>) {\n  return (\n    <h3\n      data-slot=\"product-link-title\"\n      className={cn(\n        'text-sm font-medium leading-tight text-gray-900 truncate overflow-hidden whitespace-nowrap text-ellipsis',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </h3>\n  )\n}\n\nfunction ProductLinkPrice({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"product-link-price\"\n      className={cn('flex items-center gap-2', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkCurrentPrice({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"product-link-current-price\"\n      className={cn('text-sm font-semibold text-gray-900', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkOriginalPrice({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"product-link-original-price\"\n      className={cn('text-sm text-gray-500 line-through', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkDiscountPrice({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"product-link-discount-price\"\n      className={cn('text-sm font-semibold text-red-600', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkRating({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"product-link-rating\"\n      className={cn(\n        'flex items-center gap-1 text-xs text-muted-foreground',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkActions({\n  className,\n  onPress,\n  filled = false,\n  ...props\n}: React.ComponentProps<typeof CardAction> & {\n  onPress?: () => void\n  filled?: boolean\n}) {\n  return (\n    <CardAction\n      className={cn('flex-shrink-0 self-center px-0 py-0', className)}\n      {...props}\n    >\n      <Touchable\n        stopPropagation\n        onClick={onPress}\n        whileTap={{opacity: 0.7, scale: 0.95}}\n        transition={{\n          opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},\n          scale: {type: 'tween', duration: 0.08, ease: 'easeInOut'},\n        }}\n      >\n        <FavoriteButton filled={filled} onClick={onPress} />\n      </Touchable>\n    </CardAction>\n  )\n}\n\nexport interface ProductLinkProps {\n  product: Product\n  hideFavoriteAction?: boolean\n}\n\n// Composed ProductLink component\nfunction ProductLink({product, hideFavoriteAction = false}: ProductLinkProps) {\n  const {navigateToProduct} = useShopNavigation()\n  const {saveProduct, unsaveProduct} = useSavedProductsActions()\n\n  const {\n    id,\n    title,\n    featuredImage,\n    reviewAnalytics,\n    price,\n    compareAtPrice,\n    isFavorited,\n    selectedVariant,\n    defaultVariantId,\n    shop,\n  } = product\n\n  // Local state for optimistic UI updates\n  const [isFavoritedLocal, setIsFavoritedLocal] = React.useState(isFavorited)\n\n  const averageRating = reviewAnalytics?.averageRating\n  const reviewCount = reviewAnalytics?.reviewCount\n  const amount = price?.amount\n    ? formatMoney(price?.amount, price?.currencyCode)\n    : undefined\n  const imageUrl = featuredImage?.url\n  const imageAltText = featuredImage?.altText || title\n  const compareAtPriceAmount = compareAtPrice?.amount\n    ? formatMoney(compareAtPrice?.amount, compareAtPrice?.currencyCode)\n    : undefined\n  const hasDiscount = compareAtPriceAmount && compareAtPriceAmount !== amount\n\n  const handlePress = React.useCallback(() => {\n    navigateToProduct({\n      productId: id,\n    })\n  }, [navigateToProduct, id])\n\n  const handleActionPress = React.useCallback(async () => {\n    const previousState = isFavoritedLocal\n\n    // Optimistic update\n    setIsFavoritedLocal(!previousState)\n\n    try {\n      if (previousState) {\n        await unsaveProduct({\n          productId: id,\n          shopId: shop.id,\n          productVariantId: selectedVariant?.id || defaultVariantId,\n        })\n      } else {\n        await saveProduct({\n          productId: id,\n          shopId: shop.id,\n          productVariantId: selectedVariant?.id || defaultVariantId,\n        })\n      }\n    } catch (error) {\n      // Revert optimistic update on error\n      setIsFavoritedLocal(previousState)\n    }\n  }, [\n    isFavoritedLocal,\n    id,\n    shop.id,\n    selectedVariant?.id,\n    defaultVariantId,\n    saveProduct,\n    unsaveProduct,\n  ])\n\n  return (\n    <ProductLinkRoot\n      layout=\"horizontal\"\n      discount={hasDiscount ? 'small' : 'none'}\n      onPress={handlePress}\n    >\n      <ProductLinkImage layout=\"horizontal\">\n        {imageUrl ? (\n          <img\n            src={imageUrl}\n            alt={imageAltText}\n            className=\"h-full w-full object-cover\"\n          />\n        ) : (\n          <div className=\"h-full w-full bg-muted flex items-center justify-center text-muted-foreground text-xs\">\n            No Image\n          </div>\n        )}\n      </ProductLinkImage>\n\n      <ProductLinkInfo layout=\"horizontal\">\n        <ProductLinkTitle>{title}</ProductLinkTitle>\n\n        {reviewCount && averageRating && (\n          <ProductLinkRating>\n            <div className=\"flex items-center gap-1\">\n              {Array.from({length: 5}, (_, i) => (\n                <Star\n                  key={i}\n                  fill={\n                    i < Math.floor(averageRating!) ? 'currentColor' : 'none'\n                  }\n                  className={cn(\n                    'h-3 w-3',\n                    i < Math.floor(averageRating!)\n                      ? 'text-primary'\n                      : 'text-gray-300'\n                  )}\n                />\n              ))}\n              <span className=\"text-xs text-gray-600 ml-1\">\n                ({reviewCount})\n              </span>\n            </div>\n          </ProductLinkRating>\n        )}\n\n        <ProductLinkPrice>\n          {hasDiscount ? (\n            <>\n              <ProductLinkDiscountPrice>{amount}</ProductLinkDiscountPrice>\n              <ProductLinkOriginalPrice>\n                {compareAtPriceAmount}\n              </ProductLinkOriginalPrice>\n            </>\n          ) : (\n            <ProductLinkCurrentPrice>{amount}</ProductLinkCurrentPrice>\n          )}\n        </ProductLinkPrice>\n      </ProductLinkInfo>\n\n      {hideFavoriteAction ? null : (\n        <ProductLinkActions\n          filled={isFavoritedLocal}\n          onPress={handleActionPress}\n        />\n      )}\n    </ProductLinkRoot>\n  )\n}\n\nexport {ProductLink}\n"],"names":["productLinkVariants","cva","ProductLinkRoot","className","layout","discount","asChild","onPress","props","jsx","Touchable","SlotPrimitive.Root","Card","cn","ProductLinkImage","ProductLinkInfo","CardContent","ProductLinkTitle","children","ProductLinkPrice","ProductLinkCurrentPrice","ProductLinkOriginalPrice","ProductLinkDiscountPrice","ProductLinkRating","ProductLinkActions","filled","CardAction","FavoriteButton","ProductLink","product","hideFavoriteAction","navigateToProduct","useShopNavigation","saveProduct","unsaveProduct","useSavedProductsActions","id","title","featuredImage","reviewAnalytics","price","compareAtPrice","isFavorited","selectedVariant","defaultVariantId","shop","isFavoritedLocal","setIsFavoritedLocal","React","averageRating","reviewCount","amount","formatMoney","imageUrl","imageAltText","compareAtPriceAmount","hasDiscount","handlePress","handleActionPress","previousState","jsxs","_","i","Star","Fragment"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,IAAsBC,EAAI,IAAI;AAAA,EAClC,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,YAAY;AAAA,MACZ,UAAU;AAAA,IACZ;AAAA,IACA,UAAU;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,EAEX;AAAA,EACA,iBAAiB;AAAA,IACf,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAEd,CAAC;AAWD,SAASC,EAAgB;AAAA,EACvB,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,SAAAC;AAAA,EACA,GAAGC;AACL,GAAyB;AAIrB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAASH;AAAA,MACT,UAAU,EAAC,SAAS,IAAG;AAAA,MACvB,YAAY;AAAA,QACV,SAAS,EAAC,MAAM,SAAS,UAAU,MAAM,MAAM,YAAW;AAAA,MAC5D;AAAA,MAEA,UAAA,gBAAAE;AAAA,QAVSH,IAAUK,IAAqBC;AAAA,QAUvC;AAAA,UACC,WAAWC;AAAA,YACTb,EAAoB,EAAC,QAAAI,GAAQ,UAAAC,GAAS;AAAA,YACtC;AAAA,YACAF;AAAA,UACF;AAAA,UACC,GAAGK;AAAA,QAAA;AAAA,MAAA;AAAA,IACN;AAAA,EACF;AAEJ;AAEA,SAASM,EAAiB;AAAA,EACxB,WAAAX;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,GAAGI;AACL,GAAuE;AAEnE,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI;AAAA,QACT;AAAA,QACAT,MAAW,eACP,4BACA;AAAA,QACJD;AAAA,MACF;AAAA,MACC,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASO,EAAgB;AAAA,EACvB,WAAAZ;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,GAAGI;AACL,GAEG;AAEC,SAAA,gBAAAC;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,WAAWH;AAAA,QACTT,MAAW,eACP,uCACA;AAAA,QACJD;AAAA,MACF;AAAA,MACC,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASS,EAAiB;AAAA,EACxB,WAAAd;AAAA,EACA,UAAAe;AAAA,EACA,GAAGV;AACL,GAA+B;AAE3B,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI;AAAA,QACT;AAAA,QACAV;AAAA,MACF;AAAA,MACC,GAAGK;AAAA,MAEH,UAAAU;AAAA,IAAA;AAAA,EACH;AAEJ;AAEA,SAASC,EAAiB,EAAC,WAAAhB,GAAW,GAAGK,KAAqC;AAE1E,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI,EAAG,2BAA2BV,CAAS;AAAA,MACjD,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASY,EAAwB;AAAA,EAC/B,WAAAjB;AAAA,EACA,GAAGK;AACL,GAAiC;AAE7B,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI,EAAG,uCAAuCV,CAAS;AAAA,MAC7D,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASa,EAAyB;AAAA,EAChC,WAAAlB;AAAA,EACA,GAAGK;AACL,GAAiC;AAE7B,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI,EAAG,sCAAsCV,CAAS;AAAA,MAC5D,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASc,EAAyB;AAAA,EAChC,WAAAnB;AAAA,EACA,GAAGK;AACL,GAAiC;AAE7B,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI,EAAG,sCAAsCV,CAAS;AAAA,MAC5D,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASe,EAAkB,EAAC,WAAApB,GAAW,GAAGK,KAAqC;AAE3E,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWI;AAAA,QACT;AAAA,QACAV;AAAA,MACF;AAAA,MACC,GAAGK;AAAA,IAAA;AAAA,EACN;AAEJ;AAEA,SAASgB,GAAmB;AAAA,EAC1B,WAAArB;AAAA,EACA,SAAAI;AAAA,EACA,QAAAkB,IAAS;AAAA,EACT,GAAGjB;AACL,GAGG;AAEC,SAAA,gBAAAC;AAAA,IAACiB;AAAA,IAAA;AAAA,MACC,WAAWb,EAAG,uCAAuCV,CAAS;AAAA,MAC7D,GAAGK;AAAA,MAEJ,UAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,iBAAe;AAAA,UACf,SAASH;AAAA,UACT,UAAU,EAAC,SAAS,KAAK,OAAO,KAAI;AAAA,UACpC,YAAY;AAAA,YACV,SAAS,EAAC,MAAM,SAAS,UAAU,MAAM,MAAM,YAAW;AAAA,YAC1D,OAAO,EAAC,MAAM,SAAS,UAAU,MAAM,MAAM,YAAW;AAAA,UAC1D;AAAA,UAEA,UAAC,gBAAAE,EAAAkB,GAAA,EAAe,QAAAF,GAAgB,SAASlB,EAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACpD;AAAA,EACF;AAEJ;AAQA,SAASqB,GAAY,EAAC,SAAAC,GAAS,oBAAAC,IAAqB,MAA0B;AACtE,QAAA,EAAC,mBAAAC,EAAiB,IAAIC,EAAkB,GACxC,EAAC,aAAAC,GAAa,eAAAC,EAAa,IAAIC,EAAwB,GAEvD;AAAA,IACJ,IAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,MAAAC;AAAA,EAAA,IACEhB,GAGE,CAACiB,GAAkBC,CAAmB,IAAIC,EAAM,SAASN,CAAW,GAEpEO,IAAgBV,GAAiB,eACjCW,IAAcX,GAAiB,aAC/BY,IAASX,GAAO,SAClBY,EAAYZ,GAAO,QAAQA,GAAO,YAAY,IAC9C,QACEa,IAAWf,GAAe,KAC1BgB,IAAehB,GAAe,WAAWD,GACzCkB,IAAuBd,GAAgB,SACzCW,EAAYX,GAAgB,QAAQA,GAAgB,YAAY,IAChE,QACEe,IAAcD,KAAwBA,MAAyBJ,GAE/DM,IAAcT,EAAM,YAAY,MAAM;AACxB,IAAAjB,EAAA;AAAA,MAChB,WAAWK;AAAA,IAAA,CACZ;AAAA,EAAA,GACA,CAACL,GAAmBK,CAAE,CAAC,GAEpBsB,IAAoBV,EAAM,YAAY,YAAY;AACtD,UAAMW,IAAgBb;AAGtB,IAAAC,EAAoB,CAACY,CAAa;AAE9B,QAAA;AACF,MAAIA,IACF,MAAMzB,EAAc;AAAA,QAClB,WAAWE;AAAA,QACX,QAAQS,EAAK;AAAA,QACb,kBAAkBF,GAAiB,MAAMC;AAAA,MAAA,CAC1C,IAED,MAAMX,EAAY;AAAA,QAChB,WAAWG;AAAA,QACX,QAAQS,EAAK;AAAA,QACb,kBAAkBF,GAAiB,MAAMC;AAAA,MAAA,CAC1C;AAAA,YAEW;AAEd,MAAAG,EAAoBY,CAAa;AAAA,IAAA;AAAA,EACnC,GACC;AAAA,IACDb;AAAA,IACAV;AAAA,IACAS,EAAK;AAAA,IACLF,GAAiB;AAAA,IACjBC;AAAA,IACAX;AAAA,IACAC;AAAA,EAAA,CACD;AAGC,SAAA,gBAAA0B;AAAA,IAAC1D;AAAA,IAAA;AAAA,MACC,QAAO;AAAA,MACP,UAAUsD,IAAc,UAAU;AAAA,MAClC,SAASC;AAAA,MAET,UAAA;AAAA,QAAC,gBAAAhD,EAAAK,GAAA,EAAiB,QAAO,cACtB,UACCuC,IAAA,gBAAA5C;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK4C;AAAA,YACL,KAAKC;AAAA,YACL,WAAU;AAAA,UAAA;AAAA,QAAA,IAGX,gBAAA7C,EAAA,OAAA,EAAI,WAAU,yFAAwF,qBAEvG,CAAA,GAEJ;AAAA,QAEA,gBAAAmD,EAAC7C,GAAgB,EAAA,QAAO,cACtB,UAAA;AAAA,UAAA,gBAAAN,EAACQ,KAAkB,UAAMoB,EAAA,CAAA;AAAA,UAExBa,KAAeD,KACd,gBAAAxC,EAACc,KACC,UAAC,gBAAAqC,EAAA,OAAA,EAAI,WAAU,2BACZ,UAAA;AAAA,YAAA,MAAM,KAAK,EAAC,QAAQ,KAAI,CAACC,GAAGC,MAC3B,gBAAArD;AAAA,cAACsD;AAAA,cAAA;AAAA,gBAEC,MACED,IAAI,KAAK,MAAMb,CAAc,IAAI,iBAAiB;AAAA,gBAEpD,WAAWpC;AAAA,kBACT;AAAA,kBACAiD,IAAI,KAAK,MAAMb,CAAc,IACzB,iBACA;AAAA,gBAAA;AAAA,cACN;AAAA,cATKa;AAAA,YAAA,CAWR;AAAA,YACD,gBAAAF,EAAC,QAAK,EAAA,WAAU,8BAA6B,UAAA;AAAA,cAAA;AAAA,cACzCV;AAAA,cAAY;AAAA,YAAA,EAChB,CAAA;AAAA,UAAA,EAAA,CACF,EACF,CAAA;AAAA,UAGF,gBAAAzC,EAACU,GACE,EAAA,UAAAqC,IAEG,gBAAAI,EAAAI,GAAA,EAAA,UAAA;AAAA,YAAA,gBAAAvD,EAACa,KAA0B,UAAO6B,EAAA,CAAA;AAAA,YAClC,gBAAA1C,EAACY,KACE,UACHkC,EAAA,CAAA;AAAA,UAAA,EACF,CAAA,IAEA,gBAAA9C,EAACW,GAAyB,EAAA,UAAA+B,EAAA,CAAO,EAErC,CAAA;AAAA,QAAA,GACF;AAAA,QAECrB,IAAqB,OACpB,gBAAArB;AAAA,UAACe;AAAA,UAAA;AAAA,YACC,QAAQsB;AAAA,YACR,SAASY;AAAA,UAAA;AAAA,QAAA;AAAA,MACX;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}
+{"version":3,"file":"product-link.js","sources":["../../../src/components/commerce/product-link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {type Product} from '@shopify/shop-minis-platform'\nimport {cva, type VariantProps} from 'class-variance-authority'\nimport {Star} from 'lucide-react'\nimport {Slot as SlotPrimitive} from 'radix-ui'\n\nimport {useShopNavigation} from '../../hooks/navigation/useShopNavigation'\nimport {useSavedProductsActions} from '../../hooks/user/useSavedProductsActions'\nimport {formatMoney} from '../../lib/formatMoney'\nimport {cn} from '../../lib/utils'\nimport {FavoriteButton} from '../atoms/favorite-button'\nimport {Touchable} from '../atoms/touchable'\nimport {Card, CardContent, CardAction} from '../ui/card'\n\nconst productLinkVariants = cva('', {\n  variants: {\n    layout: {\n      horizontal: 'w-full !flex-row items-center gap-3 px-4 py-3',\n      vertical: 'flex-col',\n    },\n    discount: {\n      none: '',\n      small: '',\n      large: '',\n    },\n  },\n  defaultVariants: {\n    layout: 'horizontal',\n    discount: 'none',\n  },\n})\n\n// Primitive components (building blocks)\nexport interface ProductLinkRootProps\n  extends React.ComponentProps<typeof Card>,\n    VariantProps<typeof productLinkVariants> {\n  layout?: 'horizontal' | 'vertical'\n  asChild?: boolean\n  onPress?: () => void\n}\n\nfunction ProductLinkRoot({\n  className,\n  layout,\n  discount,\n  asChild = false,\n  onPress,\n  ...props\n}: ProductLinkRootProps) {\n  const Comp = asChild ? SlotPrimitive.Root : Card\n\n  return (\n    <Touchable\n      onClick={onPress}\n      whileTap={{opacity: 0.7}}\n      transition={{\n        opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},\n      }}\n    >\n      <Comp\n        className={cn(\n          productLinkVariants({layout, discount}),\n          'border-0 bg-white rounded-xl shadow-lg shadow-black/10',\n          className\n        )}\n        {...props}\n      />\n    </Touchable>\n  )\n}\n\nfunction ProductLinkImage({\n  className,\n  layout = 'horizontal',\n  ...props\n}: React.ComponentProps<'div'> & {layout?: 'horizontal' | 'vertical'}) {\n  return (\n    <div\n      data-slot=\"product-link-image\"\n      className={cn(\n        'overflow-hidden rounded-md bg-muted',\n        layout === 'horizontal'\n          ? 'h-16 w-16 flex-shrink-0'\n          : 'aspect-square w-full',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkInfo({\n  className,\n  layout = 'horizontal',\n  ...props\n}: React.ComponentProps<typeof CardContent> & {\n  layout?: 'horizontal' | 'vertical'\n}) {\n  return (\n    <CardContent\n      className={cn(\n        layout === 'horizontal'\n          ? 'flex-1 min-w-0 space-y-1 px-0 py-0'\n          : 'space-y-2',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkTitle({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<'h3'>) {\n  return (\n    <h3\n      data-slot=\"product-link-title\"\n      className={cn(\n        'text-sm font-medium leading-tight text-gray-900 truncate overflow-hidden whitespace-nowrap text-ellipsis',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </h3>\n  )\n}\n\nfunction ProductLinkPrice({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"product-link-price\"\n      className={cn('flex items-center gap-2', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkCurrentPrice({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"product-link-current-price\"\n      className={cn('text-sm font-semibold text-gray-900', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkOriginalPrice({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"product-link-original-price\"\n      className={cn('text-sm text-gray-500 line-through', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkDiscountPrice({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"product-link-discount-price\"\n      className={cn('text-sm font-semibold text-red-600', className)}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkRating({className, ...props}: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"product-link-rating\"\n      className={cn(\n        'flex items-center gap-1 text-xs text-muted-foreground',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ProductLinkActions({\n  className,\n  onPress,\n  filled = false,\n  ...props\n}: React.ComponentProps<typeof CardAction> & {\n  onPress?: () => void\n  filled?: boolean\n}) {\n  return (\n    <CardAction\n      className={cn('flex-shrink-0 self-center px-0 py-0', className)}\n      {...props}\n    >\n      <Touchable\n        stopPropagation\n        onClick={onPress}\n        whileTap={{opacity: 0.7, scale: 0.95}}\n        transition={{\n          opacity: {type: 'tween', duration: 0.08, ease: 'easeInOut'},\n          scale: {type: 'tween', duration: 0.08, ease: 'easeInOut'},\n        }}\n      >\n        <FavoriteButton filled={filled} onClick={onPress} />\n      </Touchable>\n    </CardAction>\n  )\n}\n\nexport interface ProductLinkProps {\n  product: Product\n  hideFavoriteAction?: boolean\n  onClick?: (product: Product) => void\n}\n\n// Composed ProductLink component\nfunction ProductLink({\n  product,\n  hideFavoriteAction = false,\n  onClick,\n}: ProductLinkProps) {\n  const {navigateToProduct} = useShopNavigation()\n  const {saveProduct, unsaveProduct} = useSavedProductsActions()\n\n  const {\n    id,\n    title,\n    featuredImage,\n    reviewAnalytics,\n    price,\n    compareAtPrice,\n    isFavorited,\n    selectedVariant,\n    defaultVariantId,\n    shop,\n  } = product\n\n  // Local state for optimistic UI updates\n  const [isFavoritedLocal, setIsFavoritedLocal] = React.useState(isFavorited)\n\n  const averageRating = reviewAnalytics?.averageRating\n  const reviewCount = reviewAnalytics?.reviewCount\n  const amount = price?.amount\n    ? formatMoney(price?.amount, price?.currencyCode)\n    : undefined\n  const imageUrl = featuredImage?.url\n  const imageAltText = featuredImage?.altText || title\n  const compareAtPriceAmount = compareAtPrice?.amount\n    ? formatMoney(compareAtPrice?.amount, compareAtPrice?.currencyCode)\n    : undefined\n  const hasDiscount = compareAtPriceAmount && compareAtPriceAmount !== amount\n\n  const handlePress = React.useCallback(() => {\n    navigateToProduct({\n      productId: id,\n    })\n    onClick?.(product)\n  }, [navigateToProduct, id, onClick, product])\n\n  const handleActionPress = React.useCallback(async () => {\n    const previousState = isFavoritedLocal\n\n    // Optimistic update\n    setIsFavoritedLocal(!previousState)\n\n    try {\n      if (previousState) {\n        await unsaveProduct({\n          productId: id,\n          shopId: shop.id,\n          productVariantId: selectedVariant?.id || defaultVariantId,\n        })\n      } else {\n        await saveProduct({\n          productId: id,\n          shopId: shop.id,\n          productVariantId: selectedVariant?.id || defaultVariantId,\n        })\n      }\n    } catch (error) {\n      // Revert optimistic update on error\n      setIsFavoritedLocal(previousState)\n    }\n  }, [\n    isFavoritedLocal,\n    id,\n    shop.id,\n    selectedVariant?.id,\n    defaultVariantId,\n    saveProduct,\n    unsaveProduct,\n  ])\n\n  return (\n    <ProductLinkRoot\n      layout=\"horizontal\"\n      discount={hasDiscount ? 'small' : 'none'}\n      onPress={handlePress}\n    >\n      <ProductLinkImage layout=\"horizontal\">\n        {imageUrl ? (\n          <img\n            src={imageUrl}\n            alt={imageAltText}\n            className=\"h-full w-full object-cover\"\n          />\n        ) : (\n          <div className=\"h-full w-full bg-muted flex items-center justify-center text-muted-foreground text-xs\">\n            No Image\n          </div>\n        )}\n      </ProductLinkImage>\n\n      <ProductLinkInfo layout=\"horizontal\">\n        <ProductLinkTitle>{title}</ProductLinkTitle>\n\n        {reviewCount && averageRating ? (\n          <ProductLinkRating>\n            <div className=\"flex items-center gap-1\">\n              {Array.from({length: 5}, (_, i) => (\n                <Star\n                  key={i}\n                  fill={\n                    i < Math.floor(averageRating!) ? 'currentColor' : 'none'\n                  }\n                  className={cn(\n                    'h-3 w-3',\n                    i < Math.floor(averageRating!)\n                      ? 'text-primary'\n                      : 'text-gray-300'\n                  )}\n                />\n              ))}\n              <span className=\"text-xs text-gray-600 ml-1\">\n                ({reviewCount})\n              </span>\n            </div>\n          </ProductLinkRating>\n        ) : null}\n\n        <ProductLinkPrice>\n          {hasDiscount ? (\n            <>\n              <ProductLinkDiscountPrice>{amount}</ProductLinkDiscountPrice>\n              <ProductLinkOriginalPrice>\n                {compareAtPriceAmount}\n              </ProductLinkOriginalPrice>\n            </>\n          ) : (\n            <ProductLinkCurrentPrice>{amount}</ProductLinkCurrentPrice>\n          )}\n        </ProductLinkPrice>\n      </ProductLinkInfo>\n\n      {hideFavoriteAction ? null : (\n        <ProductLinkActions\n          filled={isFavoritedLocal}\n          onPress={handleActionPress}\n        />\n      )}\n    </ProductLinkRoot>\n  )\n}\n\nexport {ProductLink}\n"],"names":["productLinkVariants","cva","ProductLinkRoot","className","layout","discount","asChild","onPress","props","jsx","Touchable","SlotPrimitive.Root","Card","cn","ProductLinkImage","ProductLinkInfo","CardContent","ProductLinkTitle","children","ProductLinkPrice","ProductLinkCurrentPrice","ProductLinkOriginalPrice","ProductLinkDiscountPrice","ProductLinkRating","ProductLinkActions","filled","CardAction","FavoriteButton","ProductLink","product","hideFavoriteAction","onClick","navigateToProduct","useShopNavigation","saveProduct","unsaveProduct","useSavedProductsActions","id","title","featuredImage","reviewAnalytics","price","compareAtPrice","isFavorited","selectedVariant","defaultVariantId","shop","isFavoritedLocal","setIsFavoritedLocal","React","averageRating","reviewCount","amount","formatMoney","imageUrl","imageAltText","compareAtPriceAmount","hasDiscount","handlePress","handleActionPress","previousState","jsxs","_","i","Star","Fragment"],"mappings":"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"}