@linktr.ee/messaging-react 2.3.0-rc-1779486690 → 2.3.3-rc-1779777764

package/dist/{Card-DdpdnSh_.js → Card-Bz1cMPwJ.js}

@@ -1,9 +1,9 @@
 import { jsx as e, jsxs as o } from "react/jsx-runtime";
-import { LockSimpleIcon as A, DownloadSimpleIcon as R, CheckCircleIcon as E, ImagesIcon as F } from "@phosphor-icons/react";
-import N, { useState as O, useRef as v, useCallback as z, useEffect as P } from "react";
+import { LockSimpleIcon as D, DownloadSimpleIcon as R, CheckCircleIcon as A, ImagesIcon as E } from "@phosphor-icons/react";
+import N, { useState as F, useRef as v, useCallback as z, useEffect as O } from "react";
 import "classnames";
-import { g as S } from "./index-BCbVXFHI.js";
-import { L as T, G as _, a as $, C as q } from "./LockedThumbnail-Drsh4B5o.js";
+import { g as P } from "./index-v6yofqub.js";
+import { L as S, G as T, a as $, C as q } from "./LockedThumbnail-BkeCwTCw.js";
 const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70", H = ({
   isLocked: i,
   sourceUrl: d,
@@ -21,7 +21,7 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
         disabled: n,
         className: w,
         children: n ? /* @__PURE__ */ e("span", { className: "size-4 animate-spin rounded-full border-2 border-white/30 border-t-white" }) : /* @__PURE__ */ o(N.Fragment, { children: [
-          /* @__PURE__ */ e(A, { className: "size-4", weight: "fill" }),
+          /* @__PURE__ */ e(D, { className: "size-4", weight: "fill" }),
           "Unlock"
         ] })
       }
@@ -68,7 +68,7 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
   paymentStatus: r,
   isUnlocking: U = !1
 }) => {
-  const u = ((n == null ? void 0 : n.length) ?? 0) >= 2, [t, j] = O(), p = v(null), g = v(!1), f = v(k);
+  const u = ((n == null ? void 0 : n.length) ?? 0) >= 2, [t, j] = F(), p = v(null), g = v(!1), f = v(k);
   f.current = k;
   const I = t == null ? void 0 : t.sourceUrl, G = t == null ? void 0 : t.redeemUrl, m = z(async () => {
     var a;
@@ -81,10 +81,10 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
         g.current = !1;
       }
     }
-  }, []), B = z(() => {
+  }, []), _ = z(() => {
     r === "paid" ? m() : s == null || s();
   }, [r, m, s]);
-  P(() => {
+  O(() => {
     if (!p.current || r !== "paid" || t !== void 0) return;
     const a = new IntersectionObserver(
       ([b]) => {
@@ -94,23 +94,23 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
     );
     return a.observe(p.current), () => a.disconnect();
   }, [r, t, m]);
-  const h = u ? r !== "paid" : I === void 0, C = S(c), D = r === "paid" ? /* @__PURE__ */ o(N.Fragment, { children: [
+  const h = u ? r !== "paid" : I === void 0, C = P(c), B = r === "paid" ? /* @__PURE__ */ o(N.Fragment, { children: [
     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: "•" }),
     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-[#008236]", children: "Purchased" }),
-    /* @__PURE__ */ e(E, { className: "size-4 text-[#008236]", weight: "bold" })
+    /* @__PURE__ */ e(A, { className: "size-4 text-[#008236]", weight: "bold" })
   ] }) : d != null ? /* @__PURE__ */ o(N.Fragment, { children: [
     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: "•" }),
     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: d })
   ] }) : null;
   return /* @__PURE__ */ o(
-    T,
+    S,
     {
       variant: "light",
       rootRef: p,
       "data-testid": "locked-attachment",
       children: [
         u ? /* @__PURE__ */ e(
-          _,
+          T,
           {
             variant: "light",
             gallery: n,
@@ -138,8 +138,8 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
             title: i,
             mimeType: c,
             detail: l,
-            statusBadge: D,
-            icon: u ? /* @__PURE__ */ e(F, { className: "size-5 shrink-0 text-black/55" }) : void 0,
+            statusBadge: B,
+            icon: u ? /* @__PURE__ */ e(E, { className: "size-5 shrink-0 text-black/55" }) : void 0,
             action: /* @__PURE__ */ e(
               H,
               {
@@ -147,7 +147,7 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
                 isUnlocking: U,
                 sourceUrl: u ? void 0 : I,
                 redeemUrl: G,
-                onUnlockClicked: B,
+                onUnlockClicked: _,
                 onDownloadClicked: L
               }
             )
@@ -160,4 +160,4 @@ const w = "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounde
 export {
   Y as default
 };
-//# sourceMappingURL=Card-DdpdnSh_.js.map
+//# sourceMappingURL=Card-Bz1cMPwJ.js.map

package/dist/{Card-DdpdnSh_.js.map → Card-Bz1cMPwJ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-DdpdnSh_.js","sources":["../src/components/LockedAttachment/components/Received/CardActions.tsx","../src/components/LockedAttachment/components/Received/Card.tsx"],"sourcesContent":["import { DownloadSimpleIcon, LockSimpleIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nexport interface ReceivedCardActionsProps {\n  /** Whether the card is currently locked. Drives which CTA we render. */\n  isLocked: boolean\n  /**\n   * When unlocked, the URL used as the Download link's `href` (opens in a new\n   * tab). When omitted, the Download CTA falls back to a plain `<button>`\n   * that just calls `onDownloadClicked` — useful for galleries where the\n   * single-source URL doesn't exist.\n   */\n  sourceUrl?: string\n  /** Optional alternate href that takes precedence over `sourceUrl`. */\n  redeemUrl?: string\n  onUnlockClicked?: () => void\n  onDownloadClicked?: () => void\n  isUnlocking?: boolean\n}\n\nconst buttonClass =\n  'mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70'\n\n/**\n * Renders the primary CTA below the body of a Received card.\n * - Locked + onUnlockClicked → \"Unlock\" button\n * - Unlocked + onDownloadClicked + (redeemUrl || sourceUrl) → \"Download\" link\n * - Unlocked + onDownloadClicked + no URL → \"Download\" button (e.g. gallery)\n * Otherwise renders nothing.\n */\nconst ReceivedCardActions: React.FC<ReceivedCardActionsProps> = ({\n  isLocked,\n  sourceUrl,\n  redeemUrl,\n  onUnlockClicked,\n  onDownloadClicked,\n  isUnlocking = false,\n}) => {\n  if (isLocked && onUnlockClicked != null) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlockClicked}\n        disabled={isUnlocking}\n        className={buttonClass}\n      >\n        {isUnlocking ? (\n          <span className=\"size-4 animate-spin rounded-full border-2 border-white/30 border-t-white\" />\n        ) : (\n          <React.Fragment>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </React.Fragment>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownloadClicked != null) {\n    const href = redeemUrl ?? sourceUrl\n    if (href != null) {\n      return (\n        <a\n          href={href}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={onDownloadClicked}\n          className={`${buttonClass} !text-white`}\n        >\n          <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n          Download\n        </a>\n      )\n    }\n\n    return (\n      <button\n        type=\"button\"\n        onClick={onDownloadClicked}\n        className={buttonClass}\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </button>\n    )\n  }\n\n  return null\n}\n\nexport default ReceivedCardActions\n","import { CheckCircleIcon, ImagesIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { getSourceType } from '../../../AttachmentCard'\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nimport ReceivedCardActions from './CardActions'\n\nexport interface ReceivedCardProps extends LockedAttachmentBaseProps {\n  /**\n   * Called when the recipient clicks Unlock on an unpaid attachment.\n   * Use this to open a checkout flow. Omit to hide the Unlock button.\n   */\n  onUnlockClick?: () => void\n  /**\n   * Called to fetch the attachment source — fired automatically when\n   * `paymentStatus` transitions to `'paid'`, or immediately on click when\n   * `paymentStatus` is already `'paid'`. Return a `LockedAttachmentSource`\n   * to unlock the card.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * Called when the recipient clicks Download on an unlocked card.\n   * Omit to hide the Download button.\n   */\n  onDownloadClick?: () => void\n  /**\n   * When true, shows a loading spinner on the Unlock button.\n   * Driven by the LockedAttachmentContext (e.g. checkout in progress).\n   */\n  isUnlocking?: boolean\n}\n\n/**\n * The card the recipient sees in chat for a paid attachment.\n * Matches the Received column of the messaging design system in Figma:\n * locked → blurred thumbnail + Unlock CTA, unlocked → clear image + Download CTA.\n */\nconst ReceivedCard: React.FC<ReceivedCardProps> = ({\n  title,\n  amountText,\n  thumbnailUrl,\n  mimeType = 'application/octet-stream',\n  detail,\n  gallery,\n  onUnlockClick,\n  onFetchSource,\n  onDownloadClick,\n  paymentStatus,\n  isUnlocking = false,\n}) => {\n  const isGallery = (gallery?.length ?? 0) >= 2\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n\n  const cardRef = useRef<HTMLDivElement>(null)\n  const fetchingRef = useRef(false)\n\n  const onFetchSourceRef = useRef(onFetchSource)\n  onFetchSourceRef.current = onFetchSource\n\n  const effectiveSourceUrl = source?.sourceUrl\n  const effectiveRedeemUrl = source?.redeemUrl\n\n  const fetchSource = useCallback(async (): Promise<void> => {\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    try {\n      const result = await onFetchSourceRef.current?.()\n      if (result) setSource(result)\n    } finally {\n      fetchingRef.current = false\n    }\n  }, [])\n\n  const handleUnlockClick = useCallback(() => {\n    if (paymentStatus === 'paid') {\n      void fetchSource()\n    } else {\n      onUnlockClick?.()\n    }\n  }, [paymentStatus, fetchSource, onUnlockClick])\n\n  // Auto-fetch the source once the paid card scrolls into view.\n  useEffect(() => {\n    if (!cardRef.current) return\n    if (paymentStatus !== 'paid' || source !== undefined) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          void fetchSource()\n          observer.disconnect()\n        }\n      },\n      { threshold: 1.0 }\n    )\n\n    observer.observe(cardRef.current)\n    return () => observer.disconnect()\n  }, [paymentStatus, source, fetchSource])\n\n  // For gallery, the per-item sources are carried by `gallery` itself, so\n  // the lock state is driven by paymentStatus rather than the single\n  // `effectiveSourceUrl`. Everything else still respects the source fetch.\n  const isLocked = isGallery\n    ? paymentStatus !== 'paid'\n    : effectiveSourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  const statusBadge =\n    paymentStatus === 'paid' ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-[#008236]\">Purchased</span>\n        <CheckCircleIcon className=\"size-4 text-[#008236]\" weight=\"bold\" />\n      </React.Fragment>\n    ) : amountText != null ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-black/55\">{amountText}</span>\n      </React.Fragment>\n    ) : null\n\n  // For gallery, ReceivedCardActions falls back to a plain <button>\n  // (no anchor) because the gallery has no single sourceUrl to link to —\n  // the per-item sources live on `gallery` itself.\n  const actionSourceUrl = isGallery ? undefined : effectiveSourceUrl\n\n  return (\n    <LockedCardShell\n      variant=\"light\"\n      rootRef={cardRef}\n      data-testid=\"locked-attachment\"\n    >\n      {isGallery ? (\n        <GalleryThumbnail\n          variant=\"light\"\n          gallery={gallery!}\n          title={title}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n        />\n      ) : (\n        <LockedThumbnail\n          variant=\"light\"\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          title={title}\n          source={source}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n          containedImage={\n            !isLocked && (sourceType === 'image' || sourceType === 'document')\n          }\n        />\n      )}\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-black/55\" />\n          ) : undefined\n        }\n        action={\n          <ReceivedCardActions\n            isLocked={isLocked}\n            isUnlocking={isUnlocking}\n            sourceUrl={actionSourceUrl}\n            redeemUrl={effectiveRedeemUrl}\n            onUnlockClicked={handleUnlockClick}\n            onDownloadClicked={onDownloadClick}\n          />\n        }\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ReceivedCard\n"],"names":["buttonClass","ReceivedCardActions","isLocked","sourceUrl","redeemUrl","onUnlockClicked","onDownloadClicked","isUnlocking","jsx","jsxs","React","LockSimpleIcon","href","DownloadSimpleIcon","ReceivedCard","title","amountText","thumbnailUrl","mimeType","detail","gallery","onUnlockClick","onFetchSource","onDownloadClick","paymentStatus","isGallery","source","setSource","useState","cardRef","useRef","fetchingRef","onFetchSourceRef","effectiveSourceUrl","effectiveRedeemUrl","fetchSource","useCallback","result","_a","handleUnlockClick","useEffect","observer","entry","sourceType","getSourceType","statusBadge","CheckCircleIcon","LockedCardShell","GalleryThumbnail","LockedThumbnail","CardBody","ImagesIcon"],"mappings":"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"}
+{"version":3,"file":"Card-Bz1cMPwJ.js","sources":["../src/components/LockedAttachment/components/Received/CardActions.tsx","../src/components/LockedAttachment/components/Received/Card.tsx"],"sourcesContent":["import { DownloadSimpleIcon, LockSimpleIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nexport interface ReceivedCardActionsProps {\n  /** Whether the card is currently locked. Drives which CTA we render. */\n  isLocked: boolean\n  /**\n   * When unlocked, the URL used as the Download link's `href` (opens in a new\n   * tab). When omitted, the Download CTA falls back to a plain `<button>`\n   * that just calls `onDownloadClicked` — useful for galleries where the\n   * single-source URL doesn't exist.\n   */\n  sourceUrl?: string\n  /** Optional alternate href that takes precedence over `sourceUrl`. */\n  redeemUrl?: string\n  onUnlockClicked?: () => void\n  onDownloadClicked?: () => void\n  isUnlocking?: boolean\n}\n\nconst buttonClass =\n  'mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70'\n\n/**\n * Renders the primary CTA below the body of a Received card.\n * - Locked + onUnlockClicked → \"Unlock\" button\n * - Unlocked + onDownloadClicked + (redeemUrl || sourceUrl) → \"Download\" link\n * - Unlocked + onDownloadClicked + no URL → \"Download\" button (e.g. gallery)\n * Otherwise renders nothing.\n */\nconst ReceivedCardActions: React.FC<ReceivedCardActionsProps> = ({\n  isLocked,\n  sourceUrl,\n  redeemUrl,\n  onUnlockClicked,\n  onDownloadClicked,\n  isUnlocking = false,\n}) => {\n  if (isLocked && onUnlockClicked != null) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlockClicked}\n        disabled={isUnlocking}\n        className={buttonClass}\n      >\n        {isUnlocking ? (\n          <span className=\"size-4 animate-spin rounded-full border-2 border-white/30 border-t-white\" />\n        ) : (\n          <React.Fragment>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </React.Fragment>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownloadClicked != null) {\n    const href = redeemUrl ?? sourceUrl\n    if (href != null) {\n      return (\n        <a\n          href={href}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={onDownloadClicked}\n          className={`${buttonClass} !text-white`}\n        >\n          <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n          Download\n        </a>\n      )\n    }\n\n    return (\n      <button\n        type=\"button\"\n        onClick={onDownloadClicked}\n        className={buttonClass}\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </button>\n    )\n  }\n\n  return null\n}\n\nexport default ReceivedCardActions\n","import { CheckCircleIcon, ImagesIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { getSourceType } from '../../../AttachmentCard'\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nimport ReceivedCardActions from './CardActions'\n\nexport interface ReceivedCardProps extends LockedAttachmentBaseProps {\n  /**\n   * Called when the recipient clicks Unlock on an unpaid attachment.\n   * Use this to open a checkout flow. Omit to hide the Unlock button.\n   */\n  onUnlockClick?: () => void\n  /**\n   * Called to fetch the attachment source — fired automatically when\n   * `paymentStatus` transitions to `'paid'`, or immediately on click when\n   * `paymentStatus` is already `'paid'`. Return a `LockedAttachmentSource`\n   * to unlock the card.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * Called when the recipient clicks Download on an unlocked card.\n   * Omit to hide the Download button.\n   */\n  onDownloadClick?: () => void\n  /**\n   * When true, shows a loading spinner on the Unlock button.\n   * Driven by the LockedAttachmentContext (e.g. checkout in progress).\n   */\n  isUnlocking?: boolean\n}\n\n/**\n * The card the recipient sees in chat for a paid attachment.\n * Matches the Received column of the messaging design system in Figma:\n * locked → blurred thumbnail + Unlock CTA, unlocked → clear image + Download CTA.\n */\nconst ReceivedCard: React.FC<ReceivedCardProps> = ({\n  title,\n  amountText,\n  thumbnailUrl,\n  mimeType = 'application/octet-stream',\n  detail,\n  gallery,\n  onUnlockClick,\n  onFetchSource,\n  onDownloadClick,\n  paymentStatus,\n  isUnlocking = false,\n}) => {\n  const isGallery = (gallery?.length ?? 0) >= 2\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n\n  const cardRef = useRef<HTMLDivElement>(null)\n  const fetchingRef = useRef(false)\n\n  const onFetchSourceRef = useRef(onFetchSource)\n  onFetchSourceRef.current = onFetchSource\n\n  const effectiveSourceUrl = source?.sourceUrl\n  const effectiveRedeemUrl = source?.redeemUrl\n\n  const fetchSource = useCallback(async (): Promise<void> => {\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    try {\n      const result = await onFetchSourceRef.current?.()\n      if (result) setSource(result)\n    } finally {\n      fetchingRef.current = false\n    }\n  }, [])\n\n  const handleUnlockClick = useCallback(() => {\n    if (paymentStatus === 'paid') {\n      void fetchSource()\n    } else {\n      onUnlockClick?.()\n    }\n  }, [paymentStatus, fetchSource, onUnlockClick])\n\n  // Auto-fetch the source once the paid card scrolls into view.\n  useEffect(() => {\n    if (!cardRef.current) return\n    if (paymentStatus !== 'paid' || source !== undefined) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          void fetchSource()\n          observer.disconnect()\n        }\n      },\n      { threshold: 1.0 }\n    )\n\n    observer.observe(cardRef.current)\n    return () => observer.disconnect()\n  }, [paymentStatus, source, fetchSource])\n\n  // For gallery, the per-item sources are carried by `gallery` itself, so\n  // the lock state is driven by paymentStatus rather than the single\n  // `effectiveSourceUrl`. Everything else still respects the source fetch.\n  const isLocked = isGallery\n    ? paymentStatus !== 'paid'\n    : effectiveSourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  const statusBadge =\n    paymentStatus === 'paid' ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-[#008236]\">Purchased</span>\n        <CheckCircleIcon className=\"size-4 text-[#008236]\" weight=\"bold\" />\n      </React.Fragment>\n    ) : amountText != null ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-black/55\">{amountText}</span>\n      </React.Fragment>\n    ) : null\n\n  // For gallery, ReceivedCardActions falls back to a plain <button>\n  // (no anchor) because the gallery has no single sourceUrl to link to —\n  // the per-item sources live on `gallery` itself.\n  const actionSourceUrl = isGallery ? undefined : effectiveSourceUrl\n\n  return (\n    <LockedCardShell\n      variant=\"light\"\n      rootRef={cardRef}\n      data-testid=\"locked-attachment\"\n    >\n      {isGallery ? (\n        <GalleryThumbnail\n          variant=\"light\"\n          gallery={gallery!}\n          title={title}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n        />\n      ) : (\n        <LockedThumbnail\n          variant=\"light\"\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          title={title}\n          source={source}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n          containedImage={\n            !isLocked && (sourceType === 'image' || sourceType === 'document')\n          }\n        />\n      )}\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-black/55\" />\n          ) : undefined\n        }\n        action={\n          <ReceivedCardActions\n            isLocked={isLocked}\n            isUnlocking={isUnlocking}\n            sourceUrl={actionSourceUrl}\n            redeemUrl={effectiveRedeemUrl}\n            onUnlockClicked={handleUnlockClick}\n            onDownloadClicked={onDownloadClick}\n          />\n        }\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ReceivedCard\n"],"names":["buttonClass","ReceivedCardActions","isLocked","sourceUrl","redeemUrl","onUnlockClicked","onDownloadClicked","isUnlocking","jsx","jsxs","React","LockSimpleIcon","href","DownloadSimpleIcon","ReceivedCard","title","amountText","thumbnailUrl","mimeType","detail","gallery","onUnlockClick","onFetchSource","onDownloadClick","paymentStatus","isGallery","source","setSource","useState","cardRef","useRef","fetchingRef","onFetchSourceRef","effectiveSourceUrl","effectiveRedeemUrl","fetchSource","useCallback","result","_a","handleUnlockClick","useEffect","observer","entry","sourceType","getSourceType","statusBadge","CheckCircleIcon","LockedCardShell","GalleryThumbnail","LockedThumbnail","CardBody","ImagesIcon"],"mappings":"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"}

package/dist/{Card-ot16XqS2.cjs → Card-CBWof9at.cjs}

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),b=require("@phosphor-icons/react"),a=require("react"),c=require("./LockedThumbnail-CydtYOSA.cjs"),A=({title:u,mimeType:g="application/octet-stream",thumbnailUrl:N,detail:I,amountText:j,placeholderTitle:L="Attachment title",placeholderAmountText:R,gallery:n,onDismiss:p,onPreviewClick:i,onFetchSource:o,onEditClick:v})=>{const[d,z]=a.useState(),[f,l]=a.useState(!1),[B,w]=a.useState(!1),h=a.useRef(!1),r=((n==null?void 0:n.length)??0)>=2,S=a.useCallback(async()=>{if(i==null||i(),f){l(!1);return}if(r){l(!0);return}if(d){l(!0);return}if(o&&!h.current){h.current=!0,w(!0);try{const e=await o();e&&(z(e),l(!0))}finally{h.current=!1,w(!1)}}},[f,r,d,i,o]),x=r||o||i?S:void 0,m=!f,s=B,T=t.jsxs(a.Fragment,{children:[t.jsx("span",{className:"text-xs font-medium text-white/55",children:"•"}),t.jsx("span",{className:j?"text-xs font-medium text-white/55":"text-xs font-medium text-white/30",children:j||R})]}),y=p?t.jsx("button",{type:"button",onClick:e=>{e.stopPropagation(),p()},className:"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white","aria-label":"Dismiss attachment",children:t.jsx(b.XIcon,{className:"size-3",weight:"bold"})}):void 0,q=v?t.jsx("button",{type:"button",onClick:v,"aria-label":"Edit attachment",className:"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15",children:t.jsx(b.PencilSimpleIcon,{className:"size-5",weight:"regular"})}):void 0,k=r?t.jsx(c.GalleryThumbnail,{variant:"dark",gallery:n,title:u,showLocked:m,topRight:y}):t.jsx(c.LockedThumbnail,{variant:"dark",mimeType:g,thumbnailUrl:N,title:u,source:d,showLocked:m,topRight:y});return t.jsxs(c.LockedCardShell,{variant:"dark",children:[x?t.jsx("div",{role:"button",tabIndex:s?-1:0,"aria-label":"Toggle preview","aria-busy":s,"aria-pressed":!m,"aria-disabled":s||void 0,onClick:s?void 0:x,onKeyDown:e=>{s||e.target===e.currentTarget&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),x())},className:s?"block w-full text-left":"block w-full cursor-pointer text-left",children:k}):k,t.jsx(c.CardBody,{variant:"dark",title:u,placeholderTitle:L,mimeType:g,detail:I,statusBadge:T,icon:r?t.jsx(b.ImagesIcon,{className:"size-5 shrink-0 text-white/55"}):void 0,trailingAction:q})]})};exports.default=A;
-//# sourceMappingURL=Card-ot16XqS2.cjs.map
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),b=require("@phosphor-icons/react"),a=require("react"),c=require("./LockedThumbnail-CD9YTQ0r.cjs"),A=({title:u,mimeType:g="application/octet-stream",thumbnailUrl:N,detail:I,amountText:j,placeholderTitle:L="Attachment title",placeholderAmountText:R,gallery:n,onDismiss:p,onPreviewClick:i,onFetchSource:o,onEditClick:v})=>{const[d,z]=a.useState(),[f,l]=a.useState(!1),[B,w]=a.useState(!1),h=a.useRef(!1),r=((n==null?void 0:n.length)??0)>=2,S=a.useCallback(async()=>{if(i==null||i(),f){l(!1);return}if(r){l(!0);return}if(d){l(!0);return}if(o&&!h.current){h.current=!0,w(!0);try{const e=await o();e&&(z(e),l(!0))}finally{h.current=!1,w(!1)}}},[f,r,d,i,o]),x=r||o||i?S:void 0,m=!f,s=B,T=t.jsxs(a.Fragment,{children:[t.jsx("span",{className:"text-xs font-medium text-white/55",children:"•"}),t.jsx("span",{className:j?"text-xs font-medium text-white/55":"text-xs font-medium text-white/30",children:j||R})]}),y=p?t.jsx("button",{type:"button",onClick:e=>{e.stopPropagation(),p()},className:"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white","aria-label":"Dismiss attachment",children:t.jsx(b.XIcon,{className:"size-3",weight:"bold"})}):void 0,q=v?t.jsx("button",{type:"button",onClick:v,"aria-label":"Edit attachment",className:"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15",children:t.jsx(b.PencilSimpleIcon,{className:"size-5",weight:"regular"})}):void 0,k=r?t.jsx(c.GalleryThumbnail,{variant:"dark",gallery:n,title:u,showLocked:m,topRight:y}):t.jsx(c.LockedThumbnail,{variant:"dark",mimeType:g,thumbnailUrl:N,title:u,source:d,showLocked:m,topRight:y});return t.jsxs(c.LockedCardShell,{variant:"dark",children:[x?t.jsx("div",{role:"button",tabIndex:s?-1:0,"aria-label":"Toggle preview","aria-busy":s,"aria-pressed":!m,"aria-disabled":s||void 0,onClick:s?void 0:x,onKeyDown:e=>{s||e.target===e.currentTarget&&(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),x())},className:s?"block w-full text-left":"block w-full cursor-pointer text-left",children:k}):k,t.jsx(c.CardBody,{variant:"dark",title:u,placeholderTitle:L,mimeType:g,detail:I,statusBadge:T,icon:r?t.jsx(b.ImagesIcon,{className:"size-5 shrink-0 text-white/55"}):void 0,trailingAction:q})]})};exports.default=A;
+//# sourceMappingURL=Card-CBWof9at.cjs.map

package/dist/{Card-ot16XqS2.cjs.map → Card-CBWof9at.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-ot16XqS2.cjs","sources":["../src/components/LockedAttachment/components/Composer/Card.tsx"],"sourcesContent":["import { ImagesIcon, PencilSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useRef, useState } from 'react'\n\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nexport interface ComposerCardProps extends LockedAttachmentBaseProps {\n  /** Placeholder shown in the title slot before the composer types one. */\n  placeholderTitle?: string\n  /** Placeholder shown in the amount slot before one is configured. */\n  placeholderAmountText?: string\n  /**\n   * When provided, renders a dismiss X in the thumbnail corner. Called when\n   * the composer clicks it to remove the attachment.\n   */\n  onDismiss?: () => void\n  /** Fired the first time the composer taps the thumbnail to preview. */\n  onPreviewClick?: () => void\n  /**\n   * Lazily loads the underlying source so the composer can preview the\n   * attachment they're about to send. Called the first time the thumbnail is\n   * tapped; the returned source is cached and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * When provided, renders a pencil button in the body bottom-right that the\n   * composer can use to edit the attachment metadata (e.g. open the price /\n   * gallery editor). Matches the Composer \"Button\" instance in Figma.\n   */\n  onEditClick?: () => void\n}\n\n/**\n * The card the composer sees while drafting a paid attachment.\n * Matches the Composer column of the messaging design system in Figma.\n */\nconst ComposerCard: React.FC<ComposerCardProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle = 'Attachment title',\n  placeholderAmountText,\n  gallery,\n  onDismiss,\n  onPreviewClick,\n  onFetchSource,\n  onEditClick,\n}) => {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const isGallery = (gallery?.length ?? 0) >= 2\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    // Gallery items carry their own per-item sources on the `gallery` prop, so\n    // we just flip visibility — no async source fetch is needed.\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  // Gallery is always previewable in the composer because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const togglePreview =\n    isGallery || onFetchSource || onPreviewClick ? handleToggle : undefined\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-white/55'\n            : 'text-xs font-medium text-white/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  const dismissButton = onDismiss ? (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        // Stop the click from bubbling up into the outer preview-toggle\n        // wrapper when both are wired up at the same time.\n        e.stopPropagation()\n        onDismiss()\n      }}\n      className=\"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white\"\n      aria-label=\"Dismiss attachment\"\n    >\n      <XIcon className=\"size-3\" weight=\"bold\" />\n    </button>\n  ) : undefined\n\n  const editButton = onEditClick ? (\n    <button\n      type=\"button\"\n      onClick={onEditClick}\n      aria-label=\"Edit attachment\"\n      className=\"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n    >\n      <PencilSimpleIcon className=\"size-5\" weight=\"regular\" />\n    </button>\n  ) : undefined\n\n  const thumbnail = isGallery ? (\n    <GalleryThumbnail\n      variant=\"dark\"\n      gallery={gallery!}\n      title={title}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  ) : (\n    <LockedThumbnail\n      variant=\"dark\"\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  )\n\n  return (\n    <LockedCardShell variant=\"dark\">\n      {togglePreview ? (\n        // Uses a `<div role=\"button\">` rather than a native `<button>` so the\n        // dismiss control rendered inside `thumbnail` (also a `<button>`)\n        // doesn't produce invalid nested interactive elements.\n        <div\n          role=\"button\"\n          tabIndex={isBusy ? -1 : 0}\n          aria-label=\"Toggle preview\"\n          aria-busy={isBusy}\n          aria-pressed={!showLocked}\n          aria-disabled={isBusy || undefined}\n          onClick={isBusy ? undefined : togglePreview}\n          onKeyDown={(e) => {\n            if (isBusy) return\n            // Only handle keys that originate on the wrapper itself, not on\n            // inner interactive elements (dismiss X, carousel arrows). Without\n            // this guard, pressing Enter/Space on a focused child would bubble\n            // up and toggle the preview in addition to activating the child.\n            if (e.target !== e.currentTarget) return\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              void togglePreview()\n            }\n          }}\n          className={\n            !isBusy\n              ? 'block w-full cursor-pointer text-left'\n              : 'block w-full text-left'\n          }\n        >\n          {thumbnail}\n        </div>\n      ) : (\n        thumbnail\n      )}\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-white/55\" />\n          ) : undefined\n        }\n        trailingAction={editButton}\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ComposerCard\n"],"names":["ComposerCard","title","mimeType","thumbnailUrl","detail","amountText","placeholderTitle","placeholderAmountText","gallery","onDismiss","onPreviewClick","onFetchSource","onEditClick","source","setSource","useState","isPreviewVisible","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","isGallery","handleToggle","useCallback","result","togglePreview","showLocked","isBusy","statusBadge","jsxs","React","jsx","dismissButton","XIcon","editButton","PencilSimpleIcon","thumbnail","GalleryThumbnail","LockedThumbnail","LockedCardShell","CardBody","ImagesIcon"],"mappings":"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"}
+{"version":3,"file":"Card-CBWof9at.cjs","sources":["../src/components/LockedAttachment/components/Composer/Card.tsx"],"sourcesContent":["import { ImagesIcon, PencilSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useRef, useState } from 'react'\n\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nexport interface ComposerCardProps extends LockedAttachmentBaseProps {\n  /** Placeholder shown in the title slot before the composer types one. */\n  placeholderTitle?: string\n  /** Placeholder shown in the amount slot before one is configured. */\n  placeholderAmountText?: string\n  /**\n   * When provided, renders a dismiss X in the thumbnail corner. Called when\n   * the composer clicks it to remove the attachment.\n   */\n  onDismiss?: () => void\n  /** Fired the first time the composer taps the thumbnail to preview. */\n  onPreviewClick?: () => void\n  /**\n   * Lazily loads the underlying source so the composer can preview the\n   * attachment they're about to send. Called the first time the thumbnail is\n   * tapped; the returned source is cached and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * When provided, renders a pencil button in the body bottom-right that the\n   * composer can use to edit the attachment metadata (e.g. open the price /\n   * gallery editor). Matches the Composer \"Button\" instance in Figma.\n   */\n  onEditClick?: () => void\n}\n\n/**\n * The card the composer sees while drafting a paid attachment.\n * Matches the Composer column of the messaging design system in Figma.\n */\nconst ComposerCard: React.FC<ComposerCardProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle = 'Attachment title',\n  placeholderAmountText,\n  gallery,\n  onDismiss,\n  onPreviewClick,\n  onFetchSource,\n  onEditClick,\n}) => {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const isGallery = (gallery?.length ?? 0) >= 2\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    // Gallery items carry their own per-item sources on the `gallery` prop, so\n    // we just flip visibility — no async source fetch is needed.\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  // Gallery is always previewable in the composer because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const togglePreview =\n    isGallery || onFetchSource || onPreviewClick ? handleToggle : undefined\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-white/55'\n            : 'text-xs font-medium text-white/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  const dismissButton = onDismiss ? (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        // Stop the click from bubbling up into the outer preview-toggle\n        // wrapper when both are wired up at the same time.\n        e.stopPropagation()\n        onDismiss()\n      }}\n      className=\"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white\"\n      aria-label=\"Dismiss attachment\"\n    >\n      <XIcon className=\"size-3\" weight=\"bold\" />\n    </button>\n  ) : undefined\n\n  const editButton = onEditClick ? (\n    <button\n      type=\"button\"\n      onClick={onEditClick}\n      aria-label=\"Edit attachment\"\n      className=\"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n    >\n      <PencilSimpleIcon className=\"size-5\" weight=\"regular\" />\n    </button>\n  ) : undefined\n\n  const thumbnail = isGallery ? (\n    <GalleryThumbnail\n      variant=\"dark\"\n      gallery={gallery!}\n      title={title}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  ) : (\n    <LockedThumbnail\n      variant=\"dark\"\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  )\n\n  return (\n    <LockedCardShell variant=\"dark\">\n      {togglePreview ? (\n        // Uses a `<div role=\"button\">` rather than a native `<button>` so the\n        // dismiss control rendered inside `thumbnail` (also a `<button>`)\n        // doesn't produce invalid nested interactive elements.\n        <div\n          role=\"button\"\n          tabIndex={isBusy ? -1 : 0}\n          aria-label=\"Toggle preview\"\n          aria-busy={isBusy}\n          aria-pressed={!showLocked}\n          aria-disabled={isBusy || undefined}\n          onClick={isBusy ? undefined : togglePreview}\n          onKeyDown={(e) => {\n            if (isBusy) return\n            // Only handle keys that originate on the wrapper itself, not on\n            // inner interactive elements (dismiss X, carousel arrows). Without\n            // this guard, pressing Enter/Space on a focused child would bubble\n            // up and toggle the preview in addition to activating the child.\n            if (e.target !== e.currentTarget) return\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              void togglePreview()\n            }\n          }}\n          className={\n            !isBusy\n              ? 'block w-full cursor-pointer text-left'\n              : 'block w-full text-left'\n          }\n        >\n          {thumbnail}\n        </div>\n      ) : (\n        thumbnail\n      )}\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-white/55\" />\n          ) : undefined\n        }\n        trailingAction={editButton}\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ComposerCard\n"],"names":["ComposerCard","title","mimeType","thumbnailUrl","detail","amountText","placeholderTitle","placeholderAmountText","gallery","onDismiss","onPreviewClick","onFetchSource","onEditClick","source","setSource","useState","isPreviewVisible","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","isGallery","handleToggle","useCallback","result","togglePreview","showLocked","isBusy","statusBadge","jsxs","React","jsx","dismissButton","XIcon","editButton","PencilSimpleIcon","thumbnail","GalleryThumbnail","LockedThumbnail","LockedCardShell","CardBody","ImagesIcon"],"mappings":"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"}

package/dist/{Card-CexShqpK.cjs → Card-D2KIDqPs.cjs}

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("@phosphor-icons/react"),t=require("react");require("classnames");const T=require("./index-CQ913euH.cjs"),j=require("./LockedThumbnail-CydtYOSA.cjs"),p="mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70",U=({isLocked:i,sourceUrl:u,redeemUrl:g,onUnlockClicked:l,onDownloadClicked:o,isUnlocking:r=!1})=>{if(i&&l!=null)return e.jsx("button",{type:"button",onClick:l,disabled:r,className:p,children:r?e.jsx("span",{className:"size-4 animate-spin rounded-full border-2 border-white/30 border-t-white"}):e.jsxs(t.Fragment,{children:[e.jsx(d.LockSimpleIcon,{className:"size-4",weight:"fill"}),"Unlock"]})});if(!i&&o!=null){const c=g??u;return c!=null?e.jsxs("a",{href:c,target:"_blank",rel:"noopener noreferrer",onClick:o,className:`${p} !text-white`,children:[e.jsx(d.DownloadSimpleIcon,{className:"size-4",weight:"bold"}),"Download"]}):e.jsxs("button",{type:"button",onClick:o,className:p,children:[e.jsx(d.DownloadSimpleIcon,{className:"size-4",weight:"bold"}),"Download"]})}return null},B=({title:i,amountText:u,thumbnailUrl:g,mimeType:l="application/octet-stream",detail:o,gallery:r,onUnlockClick:c,onFetchSource:N,onDownloadClick:I,paymentStatus:n,isUnlocking:C=!1})=>{const f=((r==null?void 0:r.length)??0)>=2,[s,q]=t.useState(),v=t.useRef(null),w=t.useRef(!1),x=t.useRef(N);x.current=N;const k=s==null?void 0:s.sourceUrl,z=s==null?void 0:s.redeemUrl,h=t.useCallback(async()=>{var a;if(!w.current){w.current=!0;try{const b=await((a=x.current)==null?void 0:a.call(x));b&&q(b)}finally{w.current=!1}}},[]),L=t.useCallback(()=>{n==="paid"?h():c==null||c()},[n,h,c]);t.useEffect(()=>{if(!v.current||n!=="paid"||s!==void 0)return;const a=new IntersectionObserver(([b])=>{b.isIntersecting&&(h(),a.disconnect())},{threshold:1});return a.observe(v.current),()=>a.disconnect()},[n,s,h]);const m=f?n!=="paid":k===void 0,R=T.getSourceType(l),D=n==="paid"?e.jsxs(t.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-black/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-[#008236]",children:"Purchased"}),e.jsx(d.CheckCircleIcon,{className:"size-4 text-[#008236]",weight:"bold"})]}):u!=null?e.jsxs(t.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-black/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-black/55",children:u})]}):null,S=f?void 0:k;return e.jsxs(j.LockedCardShell,{variant:"light",rootRef:v,"data-testid":"locked-attachment",children:[f?e.jsx(j.GalleryThumbnail,{variant:"light",gallery:r,title:i,showLocked:m,paymentStatus:n}):e.jsx(j.LockedThumbnail,{variant:"light",mimeType:l,thumbnailUrl:g,title:i,source:s,showLocked:m,paymentStatus:n,containedImage:!m&&(R==="image"||R==="document")}),e.jsx(j.CardBody,{variant:"light",title:i,mimeType:l,detail:o,statusBadge:D,icon:f?e.jsx(d.ImagesIcon,{className:"size-5 shrink-0 text-black/55"}):void 0,action:e.jsx(U,{isLocked:m,isUnlocking:C,sourceUrl:S,redeemUrl:z,onUnlockClicked:L,onDownloadClicked:I})})]})};exports.default=B;
-//# sourceMappingURL=Card-CexShqpK.cjs.map
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("@phosphor-icons/react"),t=require("react");require("classnames");const T=require("./index-DuGzAVyy.cjs"),j=require("./LockedThumbnail-CD9YTQ0r.cjs"),p="mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70",U=({isLocked:i,sourceUrl:u,redeemUrl:g,onUnlockClicked:l,onDownloadClicked:o,isUnlocking:r=!1})=>{if(i&&l!=null)return e.jsx("button",{type:"button",onClick:l,disabled:r,className:p,children:r?e.jsx("span",{className:"size-4 animate-spin rounded-full border-2 border-white/30 border-t-white"}):e.jsxs(t.Fragment,{children:[e.jsx(d.LockSimpleIcon,{className:"size-4",weight:"fill"}),"Unlock"]})});if(!i&&o!=null){const c=g??u;return c!=null?e.jsxs("a",{href:c,target:"_blank",rel:"noopener noreferrer",onClick:o,className:`${p} !text-white`,children:[e.jsx(d.DownloadSimpleIcon,{className:"size-4",weight:"bold"}),"Download"]}):e.jsxs("button",{type:"button",onClick:o,className:p,children:[e.jsx(d.DownloadSimpleIcon,{className:"size-4",weight:"bold"}),"Download"]})}return null},B=({title:i,amountText:u,thumbnailUrl:g,mimeType:l="application/octet-stream",detail:o,gallery:r,onUnlockClick:c,onFetchSource:N,onDownloadClick:I,paymentStatus:n,isUnlocking:C=!1})=>{const f=((r==null?void 0:r.length)??0)>=2,[s,q]=t.useState(),v=t.useRef(null),w=t.useRef(!1),x=t.useRef(N);x.current=N;const k=s==null?void 0:s.sourceUrl,z=s==null?void 0:s.redeemUrl,h=t.useCallback(async()=>{var a;if(!w.current){w.current=!0;try{const b=await((a=x.current)==null?void 0:a.call(x));b&&q(b)}finally{w.current=!1}}},[]),L=t.useCallback(()=>{n==="paid"?h():c==null||c()},[n,h,c]);t.useEffect(()=>{if(!v.current||n!=="paid"||s!==void 0)return;const a=new IntersectionObserver(([b])=>{b.isIntersecting&&(h(),a.disconnect())},{threshold:1});return a.observe(v.current),()=>a.disconnect()},[n,s,h]);const m=f?n!=="paid":k===void 0,R=T.getSourceType(l),D=n==="paid"?e.jsxs(t.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-black/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-[#008236]",children:"Purchased"}),e.jsx(d.CheckCircleIcon,{className:"size-4 text-[#008236]",weight:"bold"})]}):u!=null?e.jsxs(t.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-black/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-black/55",children:u})]}):null,S=f?void 0:k;return e.jsxs(j.LockedCardShell,{variant:"light",rootRef:v,"data-testid":"locked-attachment",children:[f?e.jsx(j.GalleryThumbnail,{variant:"light",gallery:r,title:i,showLocked:m,paymentStatus:n}):e.jsx(j.LockedThumbnail,{variant:"light",mimeType:l,thumbnailUrl:g,title:i,source:s,showLocked:m,paymentStatus:n,containedImage:!m&&(R==="image"||R==="document")}),e.jsx(j.CardBody,{variant:"light",title:i,mimeType:l,detail:o,statusBadge:D,icon:f?e.jsx(d.ImagesIcon,{className:"size-5 shrink-0 text-black/55"}):void 0,action:e.jsx(U,{isLocked:m,isUnlocking:C,sourceUrl:S,redeemUrl:z,onUnlockClicked:L,onDownloadClicked:I})})]})};exports.default=B;
+//# sourceMappingURL=Card-D2KIDqPs.cjs.map

package/dist/{Card-CexShqpK.cjs.map → Card-D2KIDqPs.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-CexShqpK.cjs","sources":["../src/components/LockedAttachment/components/Received/CardActions.tsx","../src/components/LockedAttachment/components/Received/Card.tsx"],"sourcesContent":["import { DownloadSimpleIcon, LockSimpleIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nexport interface ReceivedCardActionsProps {\n  /** Whether the card is currently locked. Drives which CTA we render. */\n  isLocked: boolean\n  /**\n   * When unlocked, the URL used as the Download link's `href` (opens in a new\n   * tab). When omitted, the Download CTA falls back to a plain `<button>`\n   * that just calls `onDownloadClicked` — useful for galleries where the\n   * single-source URL doesn't exist.\n   */\n  sourceUrl?: string\n  /** Optional alternate href that takes precedence over `sourceUrl`. */\n  redeemUrl?: string\n  onUnlockClicked?: () => void\n  onDownloadClicked?: () => void\n  isUnlocking?: boolean\n}\n\nconst buttonClass =\n  'mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70'\n\n/**\n * Renders the primary CTA below the body of a Received card.\n * - Locked + onUnlockClicked → \"Unlock\" button\n * - Unlocked + onDownloadClicked + (redeemUrl || sourceUrl) → \"Download\" link\n * - Unlocked + onDownloadClicked + no URL → \"Download\" button (e.g. gallery)\n * Otherwise renders nothing.\n */\nconst ReceivedCardActions: React.FC<ReceivedCardActionsProps> = ({\n  isLocked,\n  sourceUrl,\n  redeemUrl,\n  onUnlockClicked,\n  onDownloadClicked,\n  isUnlocking = false,\n}) => {\n  if (isLocked && onUnlockClicked != null) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlockClicked}\n        disabled={isUnlocking}\n        className={buttonClass}\n      >\n        {isUnlocking ? (\n          <span className=\"size-4 animate-spin rounded-full border-2 border-white/30 border-t-white\" />\n        ) : (\n          <React.Fragment>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </React.Fragment>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownloadClicked != null) {\n    const href = redeemUrl ?? sourceUrl\n    if (href != null) {\n      return (\n        <a\n          href={href}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={onDownloadClicked}\n          className={`${buttonClass} !text-white`}\n        >\n          <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n          Download\n        </a>\n      )\n    }\n\n    return (\n      <button\n        type=\"button\"\n        onClick={onDownloadClicked}\n        className={buttonClass}\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </button>\n    )\n  }\n\n  return null\n}\n\nexport default ReceivedCardActions\n","import { CheckCircleIcon, ImagesIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { getSourceType } from '../../../AttachmentCard'\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nimport ReceivedCardActions from './CardActions'\n\nexport interface ReceivedCardProps extends LockedAttachmentBaseProps {\n  /**\n   * Called when the recipient clicks Unlock on an unpaid attachment.\n   * Use this to open a checkout flow. Omit to hide the Unlock button.\n   */\n  onUnlockClick?: () => void\n  /**\n   * Called to fetch the attachment source — fired automatically when\n   * `paymentStatus` transitions to `'paid'`, or immediately on click when\n   * `paymentStatus` is already `'paid'`. Return a `LockedAttachmentSource`\n   * to unlock the card.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * Called when the recipient clicks Download on an unlocked card.\n   * Omit to hide the Download button.\n   */\n  onDownloadClick?: () => void\n  /**\n   * When true, shows a loading spinner on the Unlock button.\n   * Driven by the LockedAttachmentContext (e.g. checkout in progress).\n   */\n  isUnlocking?: boolean\n}\n\n/**\n * The card the recipient sees in chat for a paid attachment.\n * Matches the Received column of the messaging design system in Figma:\n * locked → blurred thumbnail + Unlock CTA, unlocked → clear image + Download CTA.\n */\nconst ReceivedCard: React.FC<ReceivedCardProps> = ({\n  title,\n  amountText,\n  thumbnailUrl,\n  mimeType = 'application/octet-stream',\n  detail,\n  gallery,\n  onUnlockClick,\n  onFetchSource,\n  onDownloadClick,\n  paymentStatus,\n  isUnlocking = false,\n}) => {\n  const isGallery = (gallery?.length ?? 0) >= 2\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n\n  const cardRef = useRef<HTMLDivElement>(null)\n  const fetchingRef = useRef(false)\n\n  const onFetchSourceRef = useRef(onFetchSource)\n  onFetchSourceRef.current = onFetchSource\n\n  const effectiveSourceUrl = source?.sourceUrl\n  const effectiveRedeemUrl = source?.redeemUrl\n\n  const fetchSource = useCallback(async (): Promise<void> => {\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    try {\n      const result = await onFetchSourceRef.current?.()\n      if (result) setSource(result)\n    } finally {\n      fetchingRef.current = false\n    }\n  }, [])\n\n  const handleUnlockClick = useCallback(() => {\n    if (paymentStatus === 'paid') {\n      void fetchSource()\n    } else {\n      onUnlockClick?.()\n    }\n  }, [paymentStatus, fetchSource, onUnlockClick])\n\n  // Auto-fetch the source once the paid card scrolls into view.\n  useEffect(() => {\n    if (!cardRef.current) return\n    if (paymentStatus !== 'paid' || source !== undefined) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          void fetchSource()\n          observer.disconnect()\n        }\n      },\n      { threshold: 1.0 }\n    )\n\n    observer.observe(cardRef.current)\n    return () => observer.disconnect()\n  }, [paymentStatus, source, fetchSource])\n\n  // For gallery, the per-item sources are carried by `gallery` itself, so\n  // the lock state is driven by paymentStatus rather than the single\n  // `effectiveSourceUrl`. Everything else still respects the source fetch.\n  const isLocked = isGallery\n    ? paymentStatus !== 'paid'\n    : effectiveSourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  const statusBadge =\n    paymentStatus === 'paid' ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-[#008236]\">Purchased</span>\n        <CheckCircleIcon className=\"size-4 text-[#008236]\" weight=\"bold\" />\n      </React.Fragment>\n    ) : amountText != null ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-black/55\">{amountText}</span>\n      </React.Fragment>\n    ) : null\n\n  // For gallery, ReceivedCardActions falls back to a plain <button>\n  // (no anchor) because the gallery has no single sourceUrl to link to —\n  // the per-item sources live on `gallery` itself.\n  const actionSourceUrl = isGallery ? undefined : effectiveSourceUrl\n\n  return (\n    <LockedCardShell\n      variant=\"light\"\n      rootRef={cardRef}\n      data-testid=\"locked-attachment\"\n    >\n      {isGallery ? (\n        <GalleryThumbnail\n          variant=\"light\"\n          gallery={gallery!}\n          title={title}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n        />\n      ) : (\n        <LockedThumbnail\n          variant=\"light\"\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          title={title}\n          source={source}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n          containedImage={\n            !isLocked && (sourceType === 'image' || sourceType === 'document')\n          }\n        />\n      )}\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-black/55\" />\n          ) : undefined\n        }\n        action={\n          <ReceivedCardActions\n            isLocked={isLocked}\n            isUnlocking={isUnlocking}\n            sourceUrl={actionSourceUrl}\n            redeemUrl={effectiveRedeemUrl}\n            onUnlockClicked={handleUnlockClick}\n            onDownloadClicked={onDownloadClick}\n          />\n        }\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ReceivedCard\n"],"names":["buttonClass","ReceivedCardActions","isLocked","sourceUrl","redeemUrl","onUnlockClicked","onDownloadClicked","isUnlocking","jsx","jsxs","React","LockSimpleIcon","href","DownloadSimpleIcon","ReceivedCard","title","amountText","thumbnailUrl","mimeType","detail","gallery","onUnlockClick","onFetchSource","onDownloadClick","paymentStatus","isGallery","source","setSource","useState","cardRef","useRef","fetchingRef","onFetchSourceRef","effectiveSourceUrl","effectiveRedeemUrl","fetchSource","useCallback","result","_a","handleUnlockClick","useEffect","observer","entry","sourceType","getSourceType","statusBadge","CheckCircleIcon","actionSourceUrl","LockedCardShell","GalleryThumbnail","LockedThumbnail","CardBody","ImagesIcon"],"mappings":"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"}
+{"version":3,"file":"Card-D2KIDqPs.cjs","sources":["../src/components/LockedAttachment/components/Received/CardActions.tsx","../src/components/LockedAttachment/components/Received/Card.tsx"],"sourcesContent":["import { DownloadSimpleIcon, LockSimpleIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nexport interface ReceivedCardActionsProps {\n  /** Whether the card is currently locked. Drives which CTA we render. */\n  isLocked: boolean\n  /**\n   * When unlocked, the URL used as the Download link's `href` (opens in a new\n   * tab). When omitted, the Download CTA falls back to a plain `<button>`\n   * that just calls `onDownloadClicked` — useful for galleries where the\n   * single-source URL doesn't exist.\n   */\n  sourceUrl?: string\n  /** Optional alternate href that takes precedence over `sourceUrl`. */\n  redeemUrl?: string\n  onUnlockClicked?: () => void\n  onDownloadClicked?: () => void\n  isUnlocking?: boolean\n}\n\nconst buttonClass =\n  'mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70'\n\n/**\n * Renders the primary CTA below the body of a Received card.\n * - Locked + onUnlockClicked → \"Unlock\" button\n * - Unlocked + onDownloadClicked + (redeemUrl || sourceUrl) → \"Download\" link\n * - Unlocked + onDownloadClicked + no URL → \"Download\" button (e.g. gallery)\n * Otherwise renders nothing.\n */\nconst ReceivedCardActions: React.FC<ReceivedCardActionsProps> = ({\n  isLocked,\n  sourceUrl,\n  redeemUrl,\n  onUnlockClicked,\n  onDownloadClicked,\n  isUnlocking = false,\n}) => {\n  if (isLocked && onUnlockClicked != null) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlockClicked}\n        disabled={isUnlocking}\n        className={buttonClass}\n      >\n        {isUnlocking ? (\n          <span className=\"size-4 animate-spin rounded-full border-2 border-white/30 border-t-white\" />\n        ) : (\n          <React.Fragment>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </React.Fragment>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownloadClicked != null) {\n    const href = redeemUrl ?? sourceUrl\n    if (href != null) {\n      return (\n        <a\n          href={href}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={onDownloadClicked}\n          className={`${buttonClass} !text-white`}\n        >\n          <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n          Download\n        </a>\n      )\n    }\n\n    return (\n      <button\n        type=\"button\"\n        onClick={onDownloadClicked}\n        className={buttonClass}\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </button>\n    )\n  }\n\n  return null\n}\n\nexport default ReceivedCardActions\n","import { CheckCircleIcon, ImagesIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { getSourceType } from '../../../AttachmentCard'\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nimport ReceivedCardActions from './CardActions'\n\nexport interface ReceivedCardProps extends LockedAttachmentBaseProps {\n  /**\n   * Called when the recipient clicks Unlock on an unpaid attachment.\n   * Use this to open a checkout flow. Omit to hide the Unlock button.\n   */\n  onUnlockClick?: () => void\n  /**\n   * Called to fetch the attachment source — fired automatically when\n   * `paymentStatus` transitions to `'paid'`, or immediately on click when\n   * `paymentStatus` is already `'paid'`. Return a `LockedAttachmentSource`\n   * to unlock the card.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * Called when the recipient clicks Download on an unlocked card.\n   * Omit to hide the Download button.\n   */\n  onDownloadClick?: () => void\n  /**\n   * When true, shows a loading spinner on the Unlock button.\n   * Driven by the LockedAttachmentContext (e.g. checkout in progress).\n   */\n  isUnlocking?: boolean\n}\n\n/**\n * The card the recipient sees in chat for a paid attachment.\n * Matches the Received column of the messaging design system in Figma:\n * locked → blurred thumbnail + Unlock CTA, unlocked → clear image + Download CTA.\n */\nconst ReceivedCard: React.FC<ReceivedCardProps> = ({\n  title,\n  amountText,\n  thumbnailUrl,\n  mimeType = 'application/octet-stream',\n  detail,\n  gallery,\n  onUnlockClick,\n  onFetchSource,\n  onDownloadClick,\n  paymentStatus,\n  isUnlocking = false,\n}) => {\n  const isGallery = (gallery?.length ?? 0) >= 2\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n\n  const cardRef = useRef<HTMLDivElement>(null)\n  const fetchingRef = useRef(false)\n\n  const onFetchSourceRef = useRef(onFetchSource)\n  onFetchSourceRef.current = onFetchSource\n\n  const effectiveSourceUrl = source?.sourceUrl\n  const effectiveRedeemUrl = source?.redeemUrl\n\n  const fetchSource = useCallback(async (): Promise<void> => {\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    try {\n      const result = await onFetchSourceRef.current?.()\n      if (result) setSource(result)\n    } finally {\n      fetchingRef.current = false\n    }\n  }, [])\n\n  const handleUnlockClick = useCallback(() => {\n    if (paymentStatus === 'paid') {\n      void fetchSource()\n    } else {\n      onUnlockClick?.()\n    }\n  }, [paymentStatus, fetchSource, onUnlockClick])\n\n  // Auto-fetch the source once the paid card scrolls into view.\n  useEffect(() => {\n    if (!cardRef.current) return\n    if (paymentStatus !== 'paid' || source !== undefined) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          void fetchSource()\n          observer.disconnect()\n        }\n      },\n      { threshold: 1.0 }\n    )\n\n    observer.observe(cardRef.current)\n    return () => observer.disconnect()\n  }, [paymentStatus, source, fetchSource])\n\n  // For gallery, the per-item sources are carried by `gallery` itself, so\n  // the lock state is driven by paymentStatus rather than the single\n  // `effectiveSourceUrl`. Everything else still respects the source fetch.\n  const isLocked = isGallery\n    ? paymentStatus !== 'paid'\n    : effectiveSourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  const statusBadge =\n    paymentStatus === 'paid' ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-[#008236]\">Purchased</span>\n        <CheckCircleIcon className=\"size-4 text-[#008236]\" weight=\"bold\" />\n      </React.Fragment>\n    ) : amountText != null ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-black/55\">{amountText}</span>\n      </React.Fragment>\n    ) : null\n\n  // For gallery, ReceivedCardActions falls back to a plain <button>\n  // (no anchor) because the gallery has no single sourceUrl to link to —\n  // the per-item sources live on `gallery` itself.\n  const actionSourceUrl = isGallery ? undefined : effectiveSourceUrl\n\n  return (\n    <LockedCardShell\n      variant=\"light\"\n      rootRef={cardRef}\n      data-testid=\"locked-attachment\"\n    >\n      {isGallery ? (\n        <GalleryThumbnail\n          variant=\"light\"\n          gallery={gallery!}\n          title={title}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n        />\n      ) : (\n        <LockedThumbnail\n          variant=\"light\"\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          title={title}\n          source={source}\n          showLocked={isLocked}\n          paymentStatus={paymentStatus}\n          containedImage={\n            !isLocked && (sourceType === 'image' || sourceType === 'document')\n          }\n        />\n      )}\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-black/55\" />\n          ) : undefined\n        }\n        action={\n          <ReceivedCardActions\n            isLocked={isLocked}\n            isUnlocking={isUnlocking}\n            sourceUrl={actionSourceUrl}\n            redeemUrl={effectiveRedeemUrl}\n            onUnlockClicked={handleUnlockClick}\n            onDownloadClicked={onDownloadClick}\n          />\n        }\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ReceivedCard\n"],"names":["buttonClass","ReceivedCardActions","isLocked","sourceUrl","redeemUrl","onUnlockClicked","onDownloadClicked","isUnlocking","jsx","jsxs","React","LockSimpleIcon","href","DownloadSimpleIcon","ReceivedCard","title","amountText","thumbnailUrl","mimeType","detail","gallery","onUnlockClick","onFetchSource","onDownloadClick","paymentStatus","isGallery","source","setSource","useState","cardRef","useRef","fetchingRef","onFetchSourceRef","effectiveSourceUrl","effectiveRedeemUrl","fetchSource","useCallback","result","_a","handleUnlockClick","useEffect","observer","entry","sourceType","getSourceType","statusBadge","CheckCircleIcon","actionSourceUrl","LockedCardShell","GalleryThumbnail","LockedThumbnail","CardBody","ImagesIcon"],"mappings":"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"}

package/dist/{Card-4takoN_-.js → Card-D9iWkHKh.js}

@@ -1,8 +1,8 @@
 import { jsxs as x, jsx as e } from "react/jsx-runtime";
 import { CheckCircleIcon as T, ImagesIcon as j } from "@phosphor-icons/react";
 import k, { useState as b, useRef as z, useCallback as C } from "react";
-import { L as D, C as V, G as A, a as E } from "./LockedThumbnail-Drsh4B5o.js";
-const M = ({
+import { L as D, C as V, G as _, a as A } from "./LockedThumbnail-BkeCwTCw.js";
+const J = ({
   title: o,
   mimeType: p = "application/octet-stream",
   thumbnailUrl: N,
@@ -44,7 +44,7 @@ const M = ({
     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-white/55", children: "•" }),
     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-white/55", children: g })
   ] }) : null, w = r ? /* @__PURE__ */ e(
-    A,
+    _,
     {
       variant: "dark",
       gallery: i,
@@ -53,7 +53,7 @@ const M = ({
       paymentStatus: c
     }
   ) : /* @__PURE__ */ e(
-    E,
+    A,
     {
       variant: "dark",
       mimeType: p,
@@ -102,6 +102,6 @@ const M = ({
   ] });
 };
 export {
-  M as default
+  J as default
 };
-//# sourceMappingURL=Card-4takoN_-.js.map
+//# sourceMappingURL=Card-D9iWkHKh.js.map

package/dist/{Card-4takoN_-.js.map → Card-D9iWkHKh.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-4takoN_-.js","sources":["../src/components/LockedAttachment/components/Sent/Card.tsx"],"sourcesContent":["import { CheckCircleIcon, ImagesIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useRef, useState } from 'react'\n\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nexport interface SentCardProps extends LockedAttachmentBaseProps {\n  /** Placeholder shown in the title slot when no title is set. */\n  placeholderTitle?: string\n  /** Fired the first time the sender taps the thumbnail to preview their own attachment. */\n  onPreviewClick?: () => void\n  /**\n   * Lazily loads the underlying source so the sender can preview the attachment.\n   * Called the first time the thumbnail is tapped; the returned source is cached\n   * and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n}\n\n/**\n * The card the sender sees in chat after a paid attachment has been posted.\n * Matches the Sent column of the messaging design system in Figma.\n */\nconst SentCard: React.FC<SentCardProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle = 'Attachment title',\n  paymentStatus,\n  gallery,\n  onPreviewClick,\n  onFetchSource,\n}) => {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const isGallery = (gallery?.length ?? 0) >= 2\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    // Gallery items carry their own per-item sources on the `gallery` prop, so\n    // we just flip visibility — no async source fetch is needed.\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  // Gallery is always previewable for the sender because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const togglePreview =\n    isGallery || onFetchSource || onPreviewClick ? handleToggle : undefined\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge =\n    paymentStatus === 'paid' ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-[#34c759]\">Sold</span>\n        <CheckCircleIcon className=\"size-4 text-[#34c759]\" weight=\"bold\" />\n      </React.Fragment>\n    ) : amountText ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-white/55\">{amountText}</span>\n      </React.Fragment>\n    ) : null\n\n  const thumbnail = isGallery ? (\n    <GalleryThumbnail\n      variant=\"dark\"\n      gallery={gallery!}\n      title={title}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n    />\n  ) : (\n    <LockedThumbnail\n      variant=\"dark\"\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n    />\n  )\n\n  return (\n    <LockedCardShell variant=\"dark\">\n      {togglePreview ? (\n        // Uses a `<div role=\"button\">` rather than a native `<button>` so the\n        // gallery's carousel arrow `<button>`s rendered inside `thumbnail`\n        // don't produce invalid nested interactive elements.\n        <div\n          role=\"button\"\n          tabIndex={isBusy ? -1 : 0}\n          aria-label=\"Toggle preview\"\n          aria-busy={isBusy}\n          aria-pressed={!showLocked}\n          aria-disabled={isBusy || undefined}\n          onClick={isBusy ? undefined : togglePreview}\n          onKeyDown={(e) => {\n            if (isBusy) return\n            // Only handle keys that originate on the wrapper itself, not on\n            // inner interactive elements (gallery carousel arrows). Without\n            // this guard, pressing Enter/Space on a focused child would bubble\n            // up and toggle the preview in addition to activating the child.\n            if (e.target !== e.currentTarget) return\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              void togglePreview()\n            }\n          }}\n          className={\n            !isBusy\n              ? 'block w-full cursor-pointer text-left'\n              : 'block w-full text-left'\n          }\n        >\n          {thumbnail}\n        </div>\n      ) : (\n        thumbnail\n      )}\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-white/55\" />\n          ) : undefined\n        }\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default SentCard\n"],"names":["SentCard","title","mimeType","thumbnailUrl","detail","amountText","placeholderTitle","paymentStatus","gallery","onPreviewClick","onFetchSource","source","setSource","useState","isPreviewVisible","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","isGallery","handleToggle","useCallback","result","togglePreview","showLocked","isBusy","statusBadge","jsxs","React","jsx","CheckCircleIcon","thumbnail","GalleryThumbnail","LockedThumbnail","LockedCardShell","e","CardBody","ImagesIcon"],"mappings":"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"}
+{"version":3,"file":"Card-D9iWkHKh.js","sources":["../src/components/LockedAttachment/components/Sent/Card.tsx"],"sourcesContent":["import { CheckCircleIcon, ImagesIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useRef, useState } from 'react'\n\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nexport interface SentCardProps extends LockedAttachmentBaseProps {\n  /** Placeholder shown in the title slot when no title is set. */\n  placeholderTitle?: string\n  /** Fired the first time the sender taps the thumbnail to preview their own attachment. */\n  onPreviewClick?: () => void\n  /**\n   * Lazily loads the underlying source so the sender can preview the attachment.\n   * Called the first time the thumbnail is tapped; the returned source is cached\n   * and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n}\n\n/**\n * The card the sender sees in chat after a paid attachment has been posted.\n * Matches the Sent column of the messaging design system in Figma.\n */\nconst SentCard: React.FC<SentCardProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle = 'Attachment title',\n  paymentStatus,\n  gallery,\n  onPreviewClick,\n  onFetchSource,\n}) => {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const isGallery = (gallery?.length ?? 0) >= 2\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    // Gallery items carry their own per-item sources on the `gallery` prop, so\n    // we just flip visibility — no async source fetch is needed.\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  // Gallery is always previewable for the sender because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const togglePreview =\n    isGallery || onFetchSource || onPreviewClick ? handleToggle : undefined\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge =\n    paymentStatus === 'paid' ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-[#34c759]\">Sold</span>\n        <CheckCircleIcon className=\"size-4 text-[#34c759]\" weight=\"bold\" />\n      </React.Fragment>\n    ) : amountText ? (\n      <React.Fragment>\n        <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n        <span className=\"text-xs font-medium text-white/55\">{amountText}</span>\n      </React.Fragment>\n    ) : null\n\n  const thumbnail = isGallery ? (\n    <GalleryThumbnail\n      variant=\"dark\"\n      gallery={gallery!}\n      title={title}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n    />\n  ) : (\n    <LockedThumbnail\n      variant=\"dark\"\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n    />\n  )\n\n  return (\n    <LockedCardShell variant=\"dark\">\n      {togglePreview ? (\n        // Uses a `<div role=\"button\">` rather than a native `<button>` so the\n        // gallery's carousel arrow `<button>`s rendered inside `thumbnail`\n        // don't produce invalid nested interactive elements.\n        <div\n          role=\"button\"\n          tabIndex={isBusy ? -1 : 0}\n          aria-label=\"Toggle preview\"\n          aria-busy={isBusy}\n          aria-pressed={!showLocked}\n          aria-disabled={isBusy || undefined}\n          onClick={isBusy ? undefined : togglePreview}\n          onKeyDown={(e) => {\n            if (isBusy) return\n            // Only handle keys that originate on the wrapper itself, not on\n            // inner interactive elements (gallery carousel arrows). Without\n            // this guard, pressing Enter/Space on a focused child would bubble\n            // up and toggle the preview in addition to activating the child.\n            if (e.target !== e.currentTarget) return\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              void togglePreview()\n            }\n          }}\n          className={\n            !isBusy\n              ? 'block w-full cursor-pointer text-left'\n              : 'block w-full text-left'\n          }\n        >\n          {thumbnail}\n        </div>\n      ) : (\n        thumbnail\n      )}\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-white/55\" />\n          ) : undefined\n        }\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default SentCard\n"],"names":["SentCard","title","mimeType","thumbnailUrl","detail","amountText","placeholderTitle","paymentStatus","gallery","onPreviewClick","onFetchSource","source","setSource","useState","isPreviewVisible","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","isGallery","handleToggle","useCallback","result","togglePreview","showLocked","isBusy","statusBadge","jsxs","React","jsx","CheckCircleIcon","thumbnail","GalleryThumbnail","LockedThumbnail","LockedCardShell","e","CardBody","ImagesIcon"],"mappings":"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"}

package/dist/{Card-BuROm0u7.js → Card-DFG3rvzF.js}

@@ -1,8 +1,8 @@
 import { jsxs as y, jsx as t } from "react/jsx-runtime";
 import { ImagesIcon as A, PencilSimpleIcon as C, XIcon as D } from "@phosphor-icons/react";
-import V, { useState as h, useRef as E, useCallback as K } from "react";
-import { L as P, C as S, G as X, a as q } from "./LockedThumbnail-Drsh4B5o.js";
-const Q = ({
+import V, { useState as h, useRef as _, useCallback as E } from "react";
+import { L as K, C as P, G as S, a as X } from "./LockedThumbnail-BkeCwTCw.js";
+const O = ({
   title: l,
   mimeType: b = "application/octet-stream",
   thumbnailUrl: N,
@@ -12,12 +12,12 @@ const Q = ({
   placeholderAmountText: z,
   gallery: r,
   onDismiss: p,
-  onPreviewClick: a,
+  onPreviewClick: s,
   onFetchSource: n,
   onEditClick: x
 }) => {
-  const [c, B] = h(), [u, o] = h(!1), [R, w] = h(!1), d = E(!1), i = ((r == null ? void 0 : r.length) ?? 0) >= 2, j = K(async () => {
-    if (a == null || a(), u) {
+  const [c, B] = h(), [u, o] = h(!1), [R, w] = h(!1), d = _(!1), i = ((r == null ? void 0 : r.length) ?? 0) >= 2, j = E(async () => {
+    if (s == null || s(), u) {
       o(!1);
       return;
     }
@@ -38,7 +38,7 @@ const Q = ({
         d.current = !1, w(!1);
       }
     }
-  }, [u, i, c, a, n]), f = i || n || a ? j : void 0, m = !u, s = R, G = /* @__PURE__ */ y(V.Fragment, { children: [
+  }, [u, i, c, s, n]), f = i || n || s ? j : void 0, m = !u, a = R, G = /* @__PURE__ */ y(V.Fragment, { children: [
     /* @__PURE__ */ t("span", { className: "text-xs font-medium text-white/55", children: "•" }),
     /* @__PURE__ */ t(
       "span",
@@ -68,7 +68,7 @@ const Q = ({
       children: /* @__PURE__ */ t(C, { className: "size-5", weight: "regular" })
     }
   ) : void 0, k = i ? /* @__PURE__ */ t(
-    X,
+    S,
     {
       variant: "dark",
       gallery: r,
@@ -77,7 +77,7 @@ const Q = ({
       topRight: v
     }
   ) : /* @__PURE__ */ t(
-    q,
+    X,
     {
       variant: "dark",
       mimeType: b,
@@ -88,7 +88,7 @@ const Q = ({
       topRight: v
     }
   );
-  return /* @__PURE__ */ y(P, { variant: "dark", children: [
+  return /* @__PURE__ */ y(K, { variant: "dark", children: [
     f ? (
       // Uses a `<div role="button">` rather than a native `<button>` so the
       // dismiss control rendered inside `thumbnail` (also a `<button>`)
@@ -97,22 +97,22 @@ const Q = ({
         "div",
         {
           role: "button",
-          tabIndex: s ? -1 : 0,
+          tabIndex: a ? -1 : 0,
           "aria-label": "Toggle preview",
-          "aria-busy": s,
+          "aria-busy": a,
           "aria-pressed": !m,
-          "aria-disabled": s || void 0,
-          onClick: s ? void 0 : f,
+          "aria-disabled": a || void 0,
+          onClick: a ? void 0 : f,
           onKeyDown: (e) => {
-            s || e.target === e.currentTarget && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), f());
+            a || e.target === e.currentTarget && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), f());
           },
-          className: s ? "block w-full text-left" : "block w-full cursor-pointer text-left",
+          className: a ? "block w-full text-left" : "block w-full cursor-pointer text-left",
           children: k
         }
       )
     ) : k,
     /* @__PURE__ */ t(
-      S,
+      P,
       {
         variant: "dark",
         title: l,
@@ -127,6 +127,6 @@ const Q = ({
   ] });
 };
 export {
-  Q as default
+  O as default
 };
-//# sourceMappingURL=Card-BuROm0u7.js.map
+//# sourceMappingURL=Card-DFG3rvzF.js.map

package/dist/{Card-BuROm0u7.js.map → Card-DFG3rvzF.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-BuROm0u7.js","sources":["../src/components/LockedAttachment/components/Composer/Card.tsx"],"sourcesContent":["import { ImagesIcon, PencilSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useRef, useState } from 'react'\n\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nexport interface ComposerCardProps extends LockedAttachmentBaseProps {\n  /** Placeholder shown in the title slot before the composer types one. */\n  placeholderTitle?: string\n  /** Placeholder shown in the amount slot before one is configured. */\n  placeholderAmountText?: string\n  /**\n   * When provided, renders a dismiss X in the thumbnail corner. Called when\n   * the composer clicks it to remove the attachment.\n   */\n  onDismiss?: () => void\n  /** Fired the first time the composer taps the thumbnail to preview. */\n  onPreviewClick?: () => void\n  /**\n   * Lazily loads the underlying source so the composer can preview the\n   * attachment they're about to send. Called the first time the thumbnail is\n   * tapped; the returned source is cached and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * When provided, renders a pencil button in the body bottom-right that the\n   * composer can use to edit the attachment metadata (e.g. open the price /\n   * gallery editor). Matches the Composer \"Button\" instance in Figma.\n   */\n  onEditClick?: () => void\n}\n\n/**\n * The card the composer sees while drafting a paid attachment.\n * Matches the Composer column of the messaging design system in Figma.\n */\nconst ComposerCard: React.FC<ComposerCardProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle = 'Attachment title',\n  placeholderAmountText,\n  gallery,\n  onDismiss,\n  onPreviewClick,\n  onFetchSource,\n  onEditClick,\n}) => {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const isGallery = (gallery?.length ?? 0) >= 2\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    // Gallery items carry their own per-item sources on the `gallery` prop, so\n    // we just flip visibility — no async source fetch is needed.\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  // Gallery is always previewable in the composer because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const togglePreview =\n    isGallery || onFetchSource || onPreviewClick ? handleToggle : undefined\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-white/55'\n            : 'text-xs font-medium text-white/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  const dismissButton = onDismiss ? (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        // Stop the click from bubbling up into the outer preview-toggle\n        // wrapper when both are wired up at the same time.\n        e.stopPropagation()\n        onDismiss()\n      }}\n      className=\"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white\"\n      aria-label=\"Dismiss attachment\"\n    >\n      <XIcon className=\"size-3\" weight=\"bold\" />\n    </button>\n  ) : undefined\n\n  const editButton = onEditClick ? (\n    <button\n      type=\"button\"\n      onClick={onEditClick}\n      aria-label=\"Edit attachment\"\n      className=\"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n    >\n      <PencilSimpleIcon className=\"size-5\" weight=\"regular\" />\n    </button>\n  ) : undefined\n\n  const thumbnail = isGallery ? (\n    <GalleryThumbnail\n      variant=\"dark\"\n      gallery={gallery!}\n      title={title}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  ) : (\n    <LockedThumbnail\n      variant=\"dark\"\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  )\n\n  return (\n    <LockedCardShell variant=\"dark\">\n      {togglePreview ? (\n        // Uses a `<div role=\"button\">` rather than a native `<button>` so the\n        // dismiss control rendered inside `thumbnail` (also a `<button>`)\n        // doesn't produce invalid nested interactive elements.\n        <div\n          role=\"button\"\n          tabIndex={isBusy ? -1 : 0}\n          aria-label=\"Toggle preview\"\n          aria-busy={isBusy}\n          aria-pressed={!showLocked}\n          aria-disabled={isBusy || undefined}\n          onClick={isBusy ? undefined : togglePreview}\n          onKeyDown={(e) => {\n            if (isBusy) return\n            // Only handle keys that originate on the wrapper itself, not on\n            // inner interactive elements (dismiss X, carousel arrows). Without\n            // this guard, pressing Enter/Space on a focused child would bubble\n            // up and toggle the preview in addition to activating the child.\n            if (e.target !== e.currentTarget) return\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              void togglePreview()\n            }\n          }}\n          className={\n            !isBusy\n              ? 'block w-full cursor-pointer text-left'\n              : 'block w-full text-left'\n          }\n        >\n          {thumbnail}\n        </div>\n      ) : (\n        thumbnail\n      )}\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-white/55\" />\n          ) : undefined\n        }\n        trailingAction={editButton}\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ComposerCard\n"],"names":["ComposerCard","title","mimeType","thumbnailUrl","detail","amountText","placeholderTitle","placeholderAmountText","gallery","onDismiss","onPreviewClick","onFetchSource","onEditClick","source","setSource","useState","isPreviewVisible","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","isGallery","handleToggle","useCallback","result","togglePreview","showLocked","isBusy","statusBadge","jsxs","React","jsx","dismissButton","XIcon","editButton","PencilSimpleIcon","thumbnail","GalleryThumbnail","LockedThumbnail","LockedCardShell","CardBody","ImagesIcon"],"mappings":"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"}
+{"version":3,"file":"Card-DFG3rvzF.js","sources":["../src/components/LockedAttachment/components/Composer/Card.tsx"],"sourcesContent":["import { ImagesIcon, PencilSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useRef, useState } from 'react'\n\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n} from '../../types'\nimport CardBody from '../_shared/CardBody'\nimport GalleryThumbnail from '../_shared/GalleryThumbnail'\nimport LockedCardShell from '../_shared/LockedCardShell'\nimport LockedThumbnail from '../_shared/LockedThumbnail'\n\nexport interface ComposerCardProps extends LockedAttachmentBaseProps {\n  /** Placeholder shown in the title slot before the composer types one. */\n  placeholderTitle?: string\n  /** Placeholder shown in the amount slot before one is configured. */\n  placeholderAmountText?: string\n  /**\n   * When provided, renders a dismiss X in the thumbnail corner. Called when\n   * the composer clicks it to remove the attachment.\n   */\n  onDismiss?: () => void\n  /** Fired the first time the composer taps the thumbnail to preview. */\n  onPreviewClick?: () => void\n  /**\n   * Lazily loads the underlying source so the composer can preview the\n   * attachment they're about to send. Called the first time the thumbnail is\n   * tapped; the returned source is cached and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /**\n   * When provided, renders a pencil button in the body bottom-right that the\n   * composer can use to edit the attachment metadata (e.g. open the price /\n   * gallery editor). Matches the Composer \"Button\" instance in Figma.\n   */\n  onEditClick?: () => void\n}\n\n/**\n * The card the composer sees while drafting a paid attachment.\n * Matches the Composer column of the messaging design system in Figma.\n */\nconst ComposerCard: React.FC<ComposerCardProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle = 'Attachment title',\n  placeholderAmountText,\n  gallery,\n  onDismiss,\n  onPreviewClick,\n  onFetchSource,\n  onEditClick,\n}) => {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const isGallery = (gallery?.length ?? 0) >= 2\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    // Gallery items carry their own per-item sources on the `gallery` prop, so\n    // we just flip visibility — no async source fetch is needed.\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  // Gallery is always previewable in the composer because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const togglePreview =\n    isGallery || onFetchSource || onPreviewClick ? handleToggle : undefined\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-white/55'\n            : 'text-xs font-medium text-white/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  const dismissButton = onDismiss ? (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        // Stop the click from bubbling up into the outer preview-toggle\n        // wrapper when both are wired up at the same time.\n        e.stopPropagation()\n        onDismiss()\n      }}\n      className=\"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white\"\n      aria-label=\"Dismiss attachment\"\n    >\n      <XIcon className=\"size-3\" weight=\"bold\" />\n    </button>\n  ) : undefined\n\n  const editButton = onEditClick ? (\n    <button\n      type=\"button\"\n      onClick={onEditClick}\n      aria-label=\"Edit attachment\"\n      className=\"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n    >\n      <PencilSimpleIcon className=\"size-5\" weight=\"regular\" />\n    </button>\n  ) : undefined\n\n  const thumbnail = isGallery ? (\n    <GalleryThumbnail\n      variant=\"dark\"\n      gallery={gallery!}\n      title={title}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  ) : (\n    <LockedThumbnail\n      variant=\"dark\"\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      topRight={dismissButton}\n    />\n  )\n\n  return (\n    <LockedCardShell variant=\"dark\">\n      {togglePreview ? (\n        // Uses a `<div role=\"button\">` rather than a native `<button>` so the\n        // dismiss control rendered inside `thumbnail` (also a `<button>`)\n        // doesn't produce invalid nested interactive elements.\n        <div\n          role=\"button\"\n          tabIndex={isBusy ? -1 : 0}\n          aria-label=\"Toggle preview\"\n          aria-busy={isBusy}\n          aria-pressed={!showLocked}\n          aria-disabled={isBusy || undefined}\n          onClick={isBusy ? undefined : togglePreview}\n          onKeyDown={(e) => {\n            if (isBusy) return\n            // Only handle keys that originate on the wrapper itself, not on\n            // inner interactive elements (dismiss X, carousel arrows). Without\n            // this guard, pressing Enter/Space on a focused child would bubble\n            // up and toggle the preview in addition to activating the child.\n            if (e.target !== e.currentTarget) return\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              void togglePreview()\n            }\n          }}\n          className={\n            !isBusy\n              ? 'block w-full cursor-pointer text-left'\n              : 'block w-full text-left'\n          }\n        >\n          {thumbnail}\n        </div>\n      ) : (\n        thumbnail\n      )}\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={\n          isGallery ? (\n            <ImagesIcon className=\"size-5 shrink-0 text-white/55\" />\n          ) : undefined\n        }\n        trailingAction={editButton}\n      />\n    </LockedCardShell>\n  )\n}\n\nexport default ComposerCard\n"],"names":["ComposerCard","title","mimeType","thumbnailUrl","detail","amountText","placeholderTitle","placeholderAmountText","gallery","onDismiss","onPreviewClick","onFetchSource","onEditClick","source","setSource","useState","isPreviewVisible","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","isGallery","handleToggle","useCallback","result","togglePreview","showLocked","isBusy","statusBadge","jsxs","React","jsx","dismissButton","XIcon","editButton","PencilSimpleIcon","thumbnail","GalleryThumbnail","LockedThumbnail","LockedCardShell","CardBody","ImagesIcon"],"mappings":"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"}

package/dist/{Card-CgpHBx-W.cjs → Card-DgXoTo6c.cjs}

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),w=require("@phosphor-icons/react"),s=require("react"),o=require("./LockedThumbnail-CydtYOSA.cjs"),R=({title:u,mimeType:j="application/octet-stream",thumbnailUrl:p,detail:N,amountText:g,placeholderTitle:I="Attachment title",paymentStatus:d,gallery:i,onPreviewClick:a,onFetchSource:c})=>{const[f,L]=s.useState(),[x,l]=s.useState(!1),[y,v]=s.useState(!1),h=s.useRef(!1),n=((i==null?void 0:i.length)??0)>=2,T=s.useCallback(async()=>{if(a==null||a(),x){l(!1);return}if(n){l(!0);return}if(f){l(!0);return}if(c&&!h.current){h.current=!0,v(!0);try{const t=await c();t&&(L(t),l(!0))}finally{h.current=!1,v(!1)}}},[x,n,f,a,c]),m=n||c||a?T:void 0,b=!x,r=y,q=d==="paid"?e.jsxs(s.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-white/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-[#34c759]",children:"Sold"}),e.jsx(w.CheckCircleIcon,{className:"size-4 text-[#34c759]",weight:"bold"})]}):g?e.jsxs(s.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-white/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-white/55",children:g})]}):null,k=n?e.jsx(o.GalleryThumbnail,{variant:"dark",gallery:i,title:u,showLocked:b,paymentStatus:d}):e.jsx(o.LockedThumbnail,{variant:"dark",mimeType:j,thumbnailUrl:p,title:u,source:f,showLocked:b,paymentStatus:d});return e.jsxs(o.LockedCardShell,{variant:"dark",children:[m?e.jsx("div",{role:"button",tabIndex:r?-1:0,"aria-label":"Toggle preview","aria-busy":r,"aria-pressed":!b,"aria-disabled":r||void 0,onClick:r?void 0:m,onKeyDown:t=>{r||t.target===t.currentTarget&&(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),m())},className:r?"block w-full text-left":"block w-full cursor-pointer text-left",children:k}):k,e.jsx(o.CardBody,{variant:"dark",title:u,placeholderTitle:I,mimeType:j,detail:N,statusBadge:q,icon:n?e.jsx(w.ImagesIcon,{className:"size-5 shrink-0 text-white/55"}):void 0})]})};exports.default=R;
-//# sourceMappingURL=Card-CgpHBx-W.cjs.map
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),w=require("@phosphor-icons/react"),s=require("react"),o=require("./LockedThumbnail-CD9YTQ0r.cjs"),R=({title:u,mimeType:j="application/octet-stream",thumbnailUrl:p,detail:N,amountText:g,placeholderTitle:I="Attachment title",paymentStatus:d,gallery:i,onPreviewClick:a,onFetchSource:c})=>{const[f,L]=s.useState(),[x,l]=s.useState(!1),[y,v]=s.useState(!1),h=s.useRef(!1),n=((i==null?void 0:i.length)??0)>=2,T=s.useCallback(async()=>{if(a==null||a(),x){l(!1);return}if(n){l(!0);return}if(f){l(!0);return}if(c&&!h.current){h.current=!0,v(!0);try{const t=await c();t&&(L(t),l(!0))}finally{h.current=!1,v(!1)}}},[x,n,f,a,c]),m=n||c||a?T:void 0,b=!x,r=y,q=d==="paid"?e.jsxs(s.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-white/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-[#34c759]",children:"Sold"}),e.jsx(w.CheckCircleIcon,{className:"size-4 text-[#34c759]",weight:"bold"})]}):g?e.jsxs(s.Fragment,{children:[e.jsx("span",{className:"text-xs font-medium text-white/55",children:"•"}),e.jsx("span",{className:"text-xs font-medium text-white/55",children:g})]}):null,k=n?e.jsx(o.GalleryThumbnail,{variant:"dark",gallery:i,title:u,showLocked:b,paymentStatus:d}):e.jsx(o.LockedThumbnail,{variant:"dark",mimeType:j,thumbnailUrl:p,title:u,source:f,showLocked:b,paymentStatus:d});return e.jsxs(o.LockedCardShell,{variant:"dark",children:[m?e.jsx("div",{role:"button",tabIndex:r?-1:0,"aria-label":"Toggle preview","aria-busy":r,"aria-pressed":!b,"aria-disabled":r||void 0,onClick:r?void 0:m,onKeyDown:t=>{r||t.target===t.currentTarget&&(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),m())},className:r?"block w-full text-left":"block w-full cursor-pointer text-left",children:k}):k,e.jsx(o.CardBody,{variant:"dark",title:u,placeholderTitle:I,mimeType:j,detail:N,statusBadge:q,icon:n?e.jsx(w.ImagesIcon,{className:"size-5 shrink-0 text-white/55"}):void 0})]})};exports.default=R;
+//# sourceMappingURL=Card-DgXoTo6c.cjs.map