@linktr.ee/messaging-react 1.30.0 → 1.30.1-rc-1776660256

package/dist/{Visitor-C9HSYm3D.js → Visitor-BACiehsg.js}

@@ -1,13 +1,13 @@
-import { jsxs as l, jsx as e, Fragment as p } from "react/jsx-runtime";
-import { CheckCircleIcon as T, LockSimpleIcon as y, DownloadSimpleIcon as P, LockOpenIcon as C } from "@phosphor-icons/react";
-import { useState as b, useEffect as L } from "react";
-import { g as D, r as g, M as U } from "./MediaPlayer-Bf-xPB8Z.js";
-const x = (s) => s === "paid" ? C : y, z = (s) => {
+import { jsxs as c, jsx as e, Fragment as g } from "react/jsx-runtime";
+import { CheckCircleIcon as P, LockSimpleIcon as U, DownloadSimpleIcon as _, LockOpenIcon as C } from "@phosphor-icons/react";
+import { useState as h, useEffect as L } from "react";
+import { g as D, r as x, M } from "./MediaPlayer-dT6eJALR.js";
+const k = (s) => s === "paid" ? C : U, z = (s) => {
   const { icon: t } = s;
   return /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-black/30", children: /* @__PURE__ */ e("div", { className: "absolute left-3 top-3 flex size-8 items-center justify-center rounded-full bg-black/60", children: /* @__PURE__ */ e(t, { className: "size-4 text-white", weight: "fill" }) }) });
 }, I = (s) => {
-  const { thumbnail: t, mimeType: n, LockIcon: a } = s;
-  return /* @__PURE__ */ l("div", { className: "relative aspect-video overflow-hidden bg-black/5", children: [
+  const { thumbnailUrl: t, mimeType: l, LockIcon: a } = s;
+  return /* @__PURE__ */ c("div", { className: "relative aspect-video overflow-hidden bg-black/5", children: [
     t ? /* @__PURE__ */ e(
       "img",
       {
@@ -15,35 +15,35 @@ const x = (s) => s === "paid" ? C : y, z = (s) => {
         alt: "",
         className: "absolute inset-0 h-full w-full object-cover"
       }
-    ) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: g(n, {
+    ) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: x(l, {
       className: "size-12 text-black/20",
       weight: "regular"
     }) }),
     /* @__PURE__ */ e(z, { icon: a })
   ] });
-}, M = (s) => {
-  const { source: t, thumbnail: n, mimeType: a, title: c, paymentStatus: i, isLocked: r } = s, [o, d] = b(!1);
+}, R = (s) => {
+  const { sourceUrl: t, thumbnailUrl: l, mimeType: a, title: n, paymentStatus: i, isLocked: o } = s, [r, d] = h(!1);
   return L(() => {
     d(!1);
-  }, [t]), r ? /* @__PURE__ */ e(
+  }, [t]), o ? /* @__PURE__ */ e(
     I,
     {
-      thumbnail: n,
+      thumbnailUrl: l,
       mimeType: a,
-      LockIcon: x(i)
+      LockIcon: k(i)
     }
   ) : /* @__PURE__ */ e("div", { className: "relative overflow-hidden bg-black/5", children: /* @__PURE__ */ e(
     "img",
     {
       src: t,
-      alt: c,
-      className: `block w-full transition-opacity duration-300 ${o ? "opacity-100" : "opacity-0"}`,
+      alt: n,
+      className: `block w-full transition-opacity duration-300 ${r ? "opacity-100" : "opacity-0"}`,
       onLoad: () => d(!0)
     }
   ) });
 }, O = (s) => {
-  const { thumbnail: t, mimeType: n, paymentStatus: a, isLocked: c } = s;
-  return /* @__PURE__ */ l("div", { className: "relative aspect-video overflow-hidden bg-black/5", children: [
+  const { thumbnailUrl: t, mimeType: l, paymentStatus: a, isLocked: n } = s;
+  return /* @__PURE__ */ c("div", { className: "relative aspect-video overflow-hidden bg-black/5", children: [
     t ? /* @__PURE__ */ e(
       "img",
       {
@@ -51,139 +51,142 @@ const x = (s) => s === "paid" ? C : y, z = (s) => {
         alt: "",
         className: "absolute inset-0 h-full w-full object-cover"
       }
-    ) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: g(n, {
+    ) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: x(l, {
       className: "size-12 text-black/20",
       weight: "regular"
     }) }),
-    c && /* @__PURE__ */ e(z, { icon: x(a) })
+    n && /* @__PURE__ */ e(z, { icon: k(a) })
   ] });
-}, R = (s) => {
-  const { source: t, thumbnail: n, mimeType: a, paymentStatus: c, isLocked: i } = s;
+}, A = (s) => {
+  const { sourceUrl: t, thumbnailUrl: l, mimeType: a, paymentStatus: n, isLocked: i } = s;
   return i ? /* @__PURE__ */ e(
     I,
     {
-      thumbnail: n,
+      thumbnailUrl: l,
       mimeType: a,
-      LockIcon: x(c)
+      LockIcon: k(n)
     }
-  ) : /* @__PURE__ */ e(U, { source: t, mimeType: a, poster: n });
-}, A = () => /* @__PURE__ */ l("span", { className: "flex items-center gap-1", children: [
+  ) : /* @__PURE__ */ e(M, { source: t, mimeType: a, poster: l });
+}, E = () => /* @__PURE__ */ c("span", { className: "flex items-center gap-1", children: [
   /* @__PURE__ */ e("span", { className: "size-1 rounded-full bg-white animate-bounce [animation-delay:-0.3s]" }),
   /* @__PURE__ */ e("span", { className: "size-1 rounded-full bg-white animate-bounce [animation-delay:-0.15s]" }),
   /* @__PURE__ */ e("span", { className: "size-1 rounded-full bg-white animate-bounce" })
-] }), E = (s) => {
-  const { isLocked: t, unlockLoading: n, source: a, onUnlock: c, onDownload: i } = s;
-  return t && c ? /* @__PURE__ */ e(
+] }), F = (s) => {
+  const { isLocked: t, unlockLoading: l, sourceUrl: a, redeemUrl: n, onUnlock: i, onDownload: o } = s;
+  return t && i ? /* @__PURE__ */ e(
     "button",
     {
       type: "button",
-      onClick: c,
-      disabled: n,
+      onClick: i,
+      disabled: l,
       className: "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",
-      children: n ? /* @__PURE__ */ e(A, {}) : /* @__PURE__ */ l(p, { children: [
-        /* @__PURE__ */ e(y, { className: "size-4", weight: "fill" }),
+      children: l ? /* @__PURE__ */ e(E, {}) : /* @__PURE__ */ c(g, { children: [
+        /* @__PURE__ */ e(U, { className: "size-4", weight: "fill" }),
         "Unlock"
       ] })
     }
-  ) : !t && i && a ? /* @__PURE__ */ l(
+  ) : !t && o && a ? /* @__PURE__ */ c(
     "a",
     {
-      href: a,
-      onClick: i,
+      href: n ?? a,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      onClick: o,
       className: "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]",
       children: [
-        /* @__PURE__ */ e(P, { className: "size-4", weight: "bold" }),
+        /* @__PURE__ */ e(_, { className: "size-4", weight: "bold" }),
         "Download"
       ]
     }
   ) : null;
-}, B = (s) => {
+}, G = (s) => {
   const {
     title: t,
-    amountText: n,
-    thumbnail: a,
-    source: c,
+    amountText: l,
+    thumbnailUrl: a,
+    sourceUrl: n,
     mimeType: i = "application/octet-stream",
-    detail: r,
-    onUnlock: o,
+    detail: o,
+    onUnlock: r,
     onDownload: d,
     paymentStatus: m
-  } = s, [u, k] = b(c), [S, w] = b(!1);
+  } = s, [u, w] = h(n), [S, v] = h(void 0), [j, N] = h(!1);
   L(() => {
-    c !== void 0 && k(c);
-  }, [c]);
-  const f = u === void 0, v = D(i), j = async () => {
-    if (o) {
-      w(!0);
+    n !== void 0 && (w(n), v(void 0));
+  }, [n]);
+  const f = u === void 0, y = D(i), T = async () => {
+    if (r) {
+      N(!0);
       try {
-        const N = await o();
-        k(N.source);
+        const b = await r();
+        w(b.sourceUrl), v(b.redeemUrl);
       } catch {
       } finally {
-        w(!1);
+        N(!1);
       }
     }
   };
-  let h;
-  return v === "image" ? h = /* @__PURE__ */ e(
-    M,
+  let p;
+  return y === "image" ? p = /* @__PURE__ */ e(
+    R,
     {
-      source: u,
-      thumbnail: a,
+      sourceUrl: u,
+      thumbnailUrl: a,
       mimeType: i,
       title: t,
       paymentStatus: m,
       isLocked: f
     }
-  ) : v === "document" ? h = /* @__PURE__ */ e(
+  ) : y === "document" ? p = /* @__PURE__ */ e(
     O,
     {
-      thumbnail: a,
+      thumbnailUrl: a,
       mimeType: i,
       paymentStatus: m,
       isLocked: f
     }
-  ) : h = /* @__PURE__ */ e(
-    R,
+  ) : p = /* @__PURE__ */ e(
+    A,
     {
-      source: u,
-      thumbnail: a,
+      sourceUrl: u,
+      thumbnailUrl: a,
       mimeType: i,
       paymentStatus: m,
       isLocked: f
     }
-  ), /* @__PURE__ */ l("div", { className: "w-[280px] select-none overflow-hidden rounded-[24px] bg-white shadow-card", children: [
-    h,
-    /* @__PURE__ */ l("div", { className: "px-4 pb-3 pt-3", children: [
+  ), /* @__PURE__ */ c("div", { className: "w-[280px] select-none overflow-hidden rounded-[24px] bg-white shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]", children: [
+    p,
+    /* @__PURE__ */ c("div", { className: "px-4 pb-3 pt-3", children: [
       /* @__PURE__ */ e("p", { className: "mb-1.5 truncate text-base font-medium text-black", children: t }),
-      /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
-        g(i, {
+      /* @__PURE__ */ c("div", { className: "flex items-center gap-1", children: [
+        x(i, {
           className: "size-5 shrink-0 text-black/55",
           weight: "regular"
         }),
-        r && /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: r }),
-        m === "paid" ? /* @__PURE__ */ l(p, { children: [
+        o && /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: o }),
+        m === "paid" ? /* @__PURE__ */ c(g, { 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(
-            T,
+            P,
             {
               className: "size-4 text-[#008236]",
               weight: "bold"
             }
           )
-        ] }) : n && /* @__PURE__ */ l(p, { children: [
+        ] }) : l && /* @__PURE__ */ c(g, { 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: n })
+          /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: l })
         ] })
       ] }),
       /* @__PURE__ */ e(
-        E,
+        F,
         {
           isLocked: f,
-          unlockLoading: S,
-          source: u,
-          onUnlock: o ? j : void 0,
+          unlockLoading: j,
+          sourceUrl: u,
+          redeemUrl: S,
+          onUnlock: r ? T : void 0,
           onDownload: d
         }
       )
@@ -191,6 +194,6 @@ const x = (s) => s === "paid" ? C : y, z = (s) => {
   ] });
 };
 export {
-  B as default
+  G as default
 };
-//# sourceMappingURL=Visitor-C9HSYm3D.js.map
+//# sourceMappingURL=Visitor-BACiehsg.js.map

package/dist/Visitor-BACiehsg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Visitor-BACiehsg.js","sources":["../src/components/LockedAttachment/components/Visitor.tsx"],"sourcesContent":["import {\n  CheckCircleIcon,\n  DownloadSimpleIcon,\n  LockOpenIcon,\n  LockSimpleIcon,\n} from '@phosphor-icons/react'\nimport React, { useEffect, useState } from 'react'\n\nimport { isDevBuild } from '../../../utils/isDevBuild'\nimport type {\n  LockedAttachmentBaseProps,\n  LockedAttachmentSource,\n  PaymentStatus,\n} from '../types'\nimport { renderTypeIcon } from '../utils/icons'\nimport { getSourceType } from '../utils/mimeType'\n\nimport MediaPlayer from './MediaPlayer'\n\nexport interface VisitorCardProps extends LockedAttachmentBaseProps {\n  /**\n   * Called when the visitor clicks Unlock. Return the resolved source URL.\n   * The component manages loading state and sets source internally on resolution.\n   * Omit to hide the Unlock button.\n   */\n  onUnlock?: () => Promise<LockedAttachmentSource>\n  /** Called when the visitor clicks Download on an unlocked card. */\n  onDownload?: () => void\n}\n\nconst getLockIcon = (paymentStatus?: PaymentStatus): React.ElementType => {\n  return paymentStatus === 'paid' ? LockOpenIcon : LockSimpleIcon\n}\n\n\ninterface LockOverlayProps {\n  icon: React.ElementType\n}\n\nconst LockOverlay: React.FC<LockOverlayProps> = (props) => {\n  const { icon: Icon } = props\n  return (\n    <div className=\"absolute inset-0 bg-black/30\">\n      <div className=\"absolute left-3 top-3 flex size-8 items-center justify-center rounded-full bg-black/60\">\n        <Icon className=\"size-4 text-white\" weight=\"fill\" />\n      </div>\n    </div>\n  )\n}\n\ninterface LockedPreviewProps {\n  thumbnailUrl?: string\n  mimeType: string\n  LockIcon: React.ElementType\n}\n\nconst LockedPreview: React.FC<LockedPreviewProps> = (props) => {\n  const { thumbnailUrl, mimeType, LockIcon } = props\n  return (\n    <div className=\"relative aspect-video overflow-hidden bg-black/5\">\n      {thumbnailUrl ? (\n        <img\n          src={thumbnailUrl}\n          alt=\"\"\n          className=\"absolute inset-0 h-full w-full object-cover\"\n        />\n      ) : (\n        <div className=\"absolute inset-0 flex items-center justify-center\">\n          {renderTypeIcon(mimeType, {\n            className: 'size-12 text-black/20',\n            weight: 'regular',\n          })}\n        </div>\n      )}\n      <LockOverlay icon={LockIcon} />\n    </div>\n  )\n}\n\n\ninterface ImagePreviewProps {\n  sourceUrl?: string\n  thumbnailUrl?: string\n  mimeType: string\n  title?: string\n  paymentStatus?: PaymentStatus\n  isLocked: boolean\n}\n\nconst ImagePreview: React.FC<ImagePreviewProps> = (props) => {\n  const { sourceUrl, thumbnailUrl, mimeType, title, paymentStatus, isLocked } = props\n  const [sourceReady, setSourceReady] = useState(false)\n\n  useEffect(() => {\n    setSourceReady(false)\n  }, [sourceUrl])\n\n  if (isLocked) {\n    return (\n      <LockedPreview\n        thumbnailUrl={thumbnailUrl}\n        mimeType={mimeType}\n        LockIcon={getLockIcon(paymentStatus)}\n      />\n    )\n  }\n\n  return (\n    <div className=\"relative overflow-hidden bg-black/5\">\n      <img\n        src={sourceUrl}\n        alt={title}\n        className={`block w-full transition-opacity duration-300 ${sourceReady ? 'opacity-100' : 'opacity-0'}`}\n        onLoad={() => setSourceReady(true)}\n      />\n    </div>\n  )\n}\n\ninterface DocumentPreviewProps {\n  thumbnailUrl?: string\n  mimeType: string\n  paymentStatus?: PaymentStatus\n  isLocked: boolean\n}\n\nconst DocumentPreview: React.FC<DocumentPreviewProps> = (props) => {\n  const { thumbnailUrl, mimeType, paymentStatus, isLocked } = props\n  return (\n    <div className=\"relative aspect-video overflow-hidden bg-black/5\">\n      {thumbnailUrl ? (\n        <img\n          src={thumbnailUrl}\n          alt=\"\"\n          className=\"absolute inset-0 h-full w-full object-cover\"\n        />\n      ) : (\n        <div className=\"absolute inset-0 flex items-center justify-center\">\n          {renderTypeIcon(mimeType, {\n            className: 'size-12 text-black/20',\n            weight: 'regular',\n          })}\n        </div>\n      )}\n      {isLocked && <LockOverlay icon={getLockIcon(paymentStatus)} />}\n    </div>\n  )\n}\n\ninterface MediaPreviewProps {\n  sourceUrl?: string\n  thumbnailUrl?: string\n  mimeType: string\n  paymentStatus?: PaymentStatus\n  isLocked: boolean\n}\n\nconst MediaPreview: React.FC<MediaPreviewProps> = (props) => {\n  const { sourceUrl, thumbnailUrl, mimeType, paymentStatus, isLocked } = props\n  if (isLocked) {\n    return (\n      <LockedPreview\n        thumbnailUrl={thumbnailUrl}\n        mimeType={mimeType}\n        LockIcon={getLockIcon(paymentStatus)}\n      />\n    )\n  }\n  return <MediaPlayer source={sourceUrl!} mimeType={mimeType} poster={thumbnailUrl} />\n}\n\n\nconst LoadingDots = () => (\n  <span className=\"flex items-center gap-1\">\n    <span className=\"size-1 rounded-full bg-white animate-bounce [animation-delay:-0.3s]\" />\n    <span className=\"size-1 rounded-full bg-white animate-bounce [animation-delay:-0.15s]\" />\n    <span className=\"size-1 rounded-full bg-white animate-bounce\" />\n  </span>\n)\n\ninterface CardActionsProps {\n  isLocked: boolean\n  unlockLoading: boolean\n  sourceUrl?: string\n  redeemUrl?: string\n  onUnlock?: () => void\n  onDownload?: () => void\n}\n\nconst CardActions: React.FC<CardActionsProps> = (props) => {\n  const { isLocked, unlockLoading, sourceUrl, redeemUrl, onUnlock, onDownload } = props\n\n  if (isLocked && onUnlock) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlock}\n        disabled={unlockLoading}\n        className=\"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        {unlockLoading ? (\n          <LoadingDots />\n        ) : (\n          <>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownload && sourceUrl) {\n    return (\n      <a\n        href={redeemUrl ?? sourceUrl}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        onClick={onDownload}\n        className=\"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]\"\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </a>\n    )\n  }\n\n  return null\n}\n\n\nconst VisitorCard: React.FC<VisitorCardProps> = (props) => {\n  const {\n    title,\n    amountText,\n    thumbnailUrl,\n    sourceUrl: sourceProp,\n    mimeType = 'application/octet-stream',\n    detail,\n    onUnlock,\n    onDownload,\n    paymentStatus,\n  } = props\n  const [sourceUrl, setSourceUrl] = useState(sourceProp)\n  const [redeemUrl, setRedeemUrl] = useState<string | undefined>(undefined)\n  const [unlockLoading, setUnlockLoading] = useState(false)\n\n  useEffect(() => {\n    if (sourceProp !== undefined) {\n      setSourceUrl(sourceProp)\n      setRedeemUrl(undefined)\n    }\n  }, [sourceProp])\n\n  const isLocked = sourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  const handleUnlock = async () => {\n    if (!onUnlock) return\n    setUnlockLoading(true)\n    try {\n      const result = await onUnlock()\n      setSourceUrl(result.sourceUrl)\n      setRedeemUrl(result.redeemUrl)\n    } catch (err) {\n      if (isDevBuild()) console.debug('[LockedAttachment] onUnlock failed', err)\n    } finally {\n      setUnlockLoading(false)\n    }\n  }\n\n  let mediaPreview: React.ReactNode\n  if (sourceType === 'image') {\n    mediaPreview = (\n      <ImagePreview\n        sourceUrl={sourceUrl}\n        thumbnailUrl={thumbnailUrl}\n        mimeType={mimeType}\n        title={title}\n        paymentStatus={paymentStatus}\n        isLocked={isLocked}\n      />\n    )\n  } else if (sourceType === 'document') {\n    mediaPreview = (\n      <DocumentPreview\n        thumbnailUrl={thumbnailUrl}\n        mimeType={mimeType}\n        paymentStatus={paymentStatus}\n        isLocked={isLocked}\n      />\n    )\n  } else {\n    mediaPreview = (\n      <MediaPreview\n        sourceUrl={sourceUrl}\n        thumbnailUrl={thumbnailUrl}\n        mimeType={mimeType}\n        paymentStatus={paymentStatus}\n        isLocked={isLocked}\n      />\n    )\n  }\n\n  return (\n    <div className=\"w-[280px] select-none overflow-hidden rounded-[24px] bg-white shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]\">\n      {mediaPreview}\n      <div className=\"px-4 pb-3 pt-3\">\n        <p className=\"mb-1.5 truncate text-base font-medium text-black\">\n          {title}\n        </p>\n        <div className=\"flex items-center gap-1\">\n          {renderTypeIcon(mimeType, {\n            className: 'size-5 shrink-0 text-black/55',\n            weight: 'regular',\n          })}\n          {detail && (\n            <span className=\"text-xs font-medium text-black/55\">{detail}</span>\n          )}\n          {paymentStatus === 'paid' ? (\n            <>\n              <span className=\"text-xs font-medium text-black/55\">•</span>\n              <span className=\"text-xs font-medium text-[#008236]\">\n                Purchased\n              </span>\n              <CheckCircleIcon\n                className=\"size-4 text-[#008236]\"\n                weight=\"bold\"\n              />\n            </>\n          ) : (\n            amountText && (\n              <>\n                <span className=\"text-xs font-medium text-black/55\">•</span>\n                <span className=\"text-xs font-medium text-black/55\">\n                  {amountText}\n                </span>\n              </>\n            )\n          )}\n        </div>\n        <CardActions\n          isLocked={isLocked}\n          unlockLoading={unlockLoading}\n          sourceUrl={sourceUrl}\n          redeemUrl={redeemUrl}\n          onUnlock={onUnlock ? handleUnlock : undefined}\n          onDownload={onDownload}\n        />\n      </div>\n    </div>\n  )\n}\n\nexport default VisitorCard\n"],"names":["getLockIcon","paymentStatus","LockOpenIcon","LockSimpleIcon","LockOverlay","props","Icon","jsx","LockedPreview","thumbnailUrl","mimeType","LockIcon","jsxs","ImagePreview","sourceUrl","title","isLocked","sourceReady","setSourceReady","useState","useEffect","DocumentPreview","MediaPreview","MediaPlayer","LoadingDots","CardActions","unlockLoading","redeemUrl","onUnlock","onDownload","Fragment","DownloadSimpleIcon","VisitorCard","amountText","sourceProp","detail","setSourceUrl","setRedeemUrl","setUnlockLoading","sourceType","getSourceType","handleUnlock","result","mediaPreview","renderTypeIcon","CheckCircleIcon"],"mappings":"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"}

package/dist/index.d.ts

@@ -278,8 +278,8 @@ export declare const LockedAttachment: (props: LockedAttachmentProps) => JSX_2.E
 declare interface LockedAttachmentBaseProps {
     title?: string;
     mimeType?: string;
-    thumbnail?: string;
-    source?: string;
+    thumbnailUrl?: string;
+    sourceUrl?: string;
     detail?: string;
     amountText?: string;
     paymentStatus?: PaymentStatus;
@@ -288,7 +288,10 @@ declare interface LockedAttachmentBaseProps {
 export declare type LockedAttachmentProps = (CreatorCardProps & Never<VisitorCardProps, 'onUnlock' | 'onDownload'>) | (VisitorCardProps & Never<CreatorCardProps, 'isPreview' | 'placeholderTitle' | 'placeholderAmountText' | 'onDismiss'>);
 
 export declare interface LockedAttachmentSource {
-    source: string;
+    /** Proxied URL used by the media player for in-app playback. */
+    sourceUrl: string;
+    /** URL opened when the visitor clicks Download — may be a file or a web destination. */
+    redeemUrl?: string;
 }
 
 declare type MessageCustomType = 'MESSAGE_TIP' | 'MESSAGE_PAID' | 'MESSAGE_CHATBOT' | 'MESSAGE_ATTACHMENT' | AgeSafetySystemType | DmAgentSystemType;

package/dist/index.js

@@ -835,10 +835,10 @@ function ws(t) {
   }, [s, n == null ? void 0 : n.userID, t.id, o]);
   return { selected: o, voteUp: l, voteDown: d };
 }
-const _s = F.lazy(() => import("./Creator-77XnrIxc.js")), Es = F.lazy(() => import("./Visitor-C9HSYm3D.js")), Je = () => /* @__PURE__ */ e(
+const _s = F.lazy(() => import("./Creator-C8EwYYcW.js")), Es = F.lazy(() => import("./Visitor-BACiehsg.js")), Je = () => /* @__PURE__ */ e(
   "div",
   {
-    className: "w-[280px] min-h-[200px] animate-pulse rounded-[24px] bg-black/[0.06] shadow-[0px_0px_0px_1px_rgba(0,0,0,0.04),0px_1px_2px_0px_rgba(0,0,0,0.04)]",
+    className: "w-[280px] min-h-[200px] animate-pulse rounded-[24px] bg-black/[0.06] shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]",
     "aria-hidden": !0
   }
 ), Ss = (t) => t.onUnlock != null || t.onDownload != null ? /* @__PURE__ */ e($e, { fallback: /* @__PURE__ */ e(Je, {}), children: /* @__PURE__ */ e(Es, { ...t }) }) : /* @__PURE__ */ e($e, { fallback: /* @__PURE__ */ e(Je, {}), children: /* @__PURE__ */ e(_s, { ...t }) }), Is = ({ filled: t }) => /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ e(
@@ -1003,7 +1003,7 @@ const _s = F.lazy(() => import("./Creator-77XnrIxc.js")), Es = F.lazy(() => impo
               {
                 title: (be = r.metadata) == null ? void 0 : be.attachment_title,
                 mimeType: (le = r.metadata) == null ? void 0 : le.attachment_mime_type,
-                thumbnail: (K = r.metadata) == null ? void 0 : K.attachment_thumbnail,
+                thumbnailUrl: (K = r.metadata) == null ? void 0 : K.attachment_thumbnail,
                 amountText: (Ce = r.metadata) == null ? void 0 : Ce.amount_text,
                 detail: (Ne = r.metadata) == null ? void 0 : Ne.attachment_detail,
                 paymentStatus: (pe = r.metadata) == null ? void 0 : pe.payment_status,