@linktr.ee/messaging-react 1.31.0-rc-1776677746 → 1.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{Creator-DGe3CQ_j.js → Card-C5t3dZ5q.js} +177 -150
- package/dist/Card-C5t3dZ5q.js.map +1 -0
- package/dist/Card-Cn2va-Qr.js +205 -0
- package/dist/Card-Cn2va-Qr.js.map +1 -0
- package/dist/index.d.ts +35 -30
- package/dist/index.js +951 -956
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/ChannelView.tsx +24 -36
- package/src/components/CustomMessage/CustomMessage.stories.tsx +1 -14
- package/src/components/CustomMessage/context.tsx +20 -0
- package/src/components/CustomMessage/index.tsx +39 -28
- package/src/components/LockedAttachment/LockedAttachment.stories.tsx +8 -13
- package/src/components/LockedAttachment/components/Creator/Card.tsx +159 -0
- package/src/components/LockedAttachment/components/Creator/CardAudioPreview.tsx +161 -0
- package/src/components/LockedAttachment/components/Creator/CardCollapsedThumbnail.tsx +58 -0
- package/src/components/LockedAttachment/components/Creator/CardImagePreview.tsx +56 -0
- package/src/components/LockedAttachment/components/Creator/CardVideoPreview.tsx +91 -0
- package/src/components/LockedAttachment/components/Creator/index.tsx +2 -0
- package/src/components/LockedAttachment/components/Visitor/Card.tsx +186 -0
- package/src/components/LockedAttachment/components/Visitor/CardActions.tsx +71 -0
- package/src/components/LockedAttachment/components/Visitor/CardImagePreview.tsx +39 -0
- package/src/components/LockedAttachment/components/Visitor/CardMediaPreview.tsx +36 -0
- package/src/components/LockedAttachment/components/Visitor/CardThumbnailPreview.tsx +45 -0
- package/src/components/LockedAttachment/components/Visitor/index.ts +2 -0
- package/src/components/LockedAttachment/index.tsx +16 -23
- package/src/components/LockedAttachment/types.ts +14 -1
- package/src/components/MessagingShell/index.tsx +0 -6
- package/src/index.ts +4 -1
- package/src/types.ts +0 -21
- package/dist/Creator-DGe3CQ_j.js.map +0 -1
- package/dist/Visitor-DyJTWB2_.js +0 -204
- package/dist/Visitor-DyJTWB2_.js.map +0 -1
- package/src/components/LockedAttachment/components/Creator.tsx +0 -470
- package/src/components/LockedAttachment/components/Visitor.tsx +0 -356
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
|
|
3
|
+
import MediaPlayer from '../MediaPlayer'
|
|
4
|
+
|
|
5
|
+
import ThumbnailPreview from './CardThumbnailPreview'
|
|
6
|
+
|
|
7
|
+
interface MediaPreviewProps {
|
|
8
|
+
sourceUrl?: string
|
|
9
|
+
thumbnailUrl?: string
|
|
10
|
+
mimeType: string
|
|
11
|
+
LockIcon?: React.ElementType
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
const MediaPreview: React.FC<MediaPreviewProps> = (props) => {
|
|
15
|
+
const { sourceUrl, thumbnailUrl, mimeType, LockIcon } = props
|
|
16
|
+
|
|
17
|
+
if (LockIcon != null) {
|
|
18
|
+
return (
|
|
19
|
+
<ThumbnailPreview
|
|
20
|
+
thumbnailUrl={thumbnailUrl}
|
|
21
|
+
mimeType={mimeType}
|
|
22
|
+
LockIcon={LockIcon}
|
|
23
|
+
/>
|
|
24
|
+
)
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
return (
|
|
28
|
+
<MediaPlayer
|
|
29
|
+
source={sourceUrl ?? ''}
|
|
30
|
+
mimeType={mimeType}
|
|
31
|
+
poster={thumbnailUrl}
|
|
32
|
+
/>
|
|
33
|
+
)
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
export default MediaPreview
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
|
|
3
|
+
import { renderTypeIcon } from '../../utils/icons'
|
|
4
|
+
|
|
5
|
+
interface ThumbnailPreviewProps {
|
|
6
|
+
thumbnailUrl?: string
|
|
7
|
+
mimeType: string
|
|
8
|
+
LockIcon?: React.ElementType
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
const ThumbnailPreview: React.FC<ThumbnailPreviewProps> = (props) => {
|
|
12
|
+
const { thumbnailUrl, mimeType, LockIcon } = props
|
|
13
|
+
|
|
14
|
+
return (
|
|
15
|
+
<div className="relative aspect-video overflow-hidden bg-black/5">
|
|
16
|
+
{thumbnailUrl != null ? (
|
|
17
|
+
<img
|
|
18
|
+
src={thumbnailUrl}
|
|
19
|
+
alt=""
|
|
20
|
+
className="absolute inset-0 h-full w-full object-cover"
|
|
21
|
+
/>
|
|
22
|
+
) : (
|
|
23
|
+
<div className="absolute inset-0 flex items-center justify-center">
|
|
24
|
+
{renderTypeIcon(mimeType, {
|
|
25
|
+
className: 'size-12 text-black/20',
|
|
26
|
+
weight: 'regular',
|
|
27
|
+
})}
|
|
28
|
+
</div>
|
|
29
|
+
)}
|
|
30
|
+
{LockIcon != null ? <LockOverlay icon={LockIcon} /> : null}
|
|
31
|
+
</div>
|
|
32
|
+
)
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
const LockOverlay: React.FC<{ icon: React.ElementType }> = ({ icon: Icon }) => {
|
|
36
|
+
return (
|
|
37
|
+
<div className="absolute inset-0 bg-black/30">
|
|
38
|
+
<div className="absolute left-3 top-3 flex size-8 items-center justify-center rounded-full bg-black/60">
|
|
39
|
+
<Icon className="size-4 text-white" weight="fill" />
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
)
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
export default ThumbnailPreview
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React, { Suspense } from 'react'
|
|
2
2
|
|
|
3
|
-
import type { CreatorCardProps } from './components/Creator'
|
|
4
|
-
import type { VisitorCardProps } from './components/Visitor'
|
|
3
|
+
import type { CreatorCardProps } from './components/Creator/Card'
|
|
4
|
+
import type { VisitorCardProps } from './components/Visitor/Card'
|
|
5
5
|
|
|
6
|
-
const CreatorCardLazy = React.lazy(() => import('./components/Creator'))
|
|
7
|
-
const VisitorCardLazy = React.lazy(() => import('./components/Visitor'))
|
|
6
|
+
const CreatorCardLazy = React.lazy(() => import('./components/Creator/Card'))
|
|
7
|
+
const VisitorCardLazy = React.lazy(() => import('./components/Visitor/Card'))
|
|
8
8
|
|
|
9
9
|
const LockedAttachmentFallback = () => (
|
|
10
10
|
<div
|
|
@@ -13,27 +13,20 @@ const LockedAttachmentFallback = () => (
|
|
|
13
13
|
/>
|
|
14
14
|
)
|
|
15
15
|
|
|
16
|
-
|
|
16
|
+
const Creator = (props: CreatorCardProps) => (
|
|
17
|
+
<Suspense fallback={<LockedAttachmentFallback />}>
|
|
18
|
+
<CreatorCardLazy {...props} />
|
|
19
|
+
</Suspense>
|
|
20
|
+
)
|
|
17
21
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
22
|
+
const Visitor = (props: VisitorCardProps) => (
|
|
23
|
+
<Suspense fallback={<LockedAttachmentFallback />}>
|
|
24
|
+
<VisitorCardLazy {...props} />
|
|
25
|
+
</Suspense>
|
|
26
|
+
)
|
|
21
27
|
|
|
22
|
-
const LockedAttachment =
|
|
23
|
-
if (props.onUnlockClick != null || props.onDownloadClick != null || props.onUnlocked != null) {
|
|
24
|
-
return (
|
|
25
|
-
<Suspense fallback={<LockedAttachmentFallback />}>
|
|
26
|
-
<VisitorCardLazy {...props} />
|
|
27
|
-
</Suspense>
|
|
28
|
-
)
|
|
29
|
-
}
|
|
30
|
-
return (
|
|
31
|
-
<Suspense fallback={<LockedAttachmentFallback />}>
|
|
32
|
-
<CreatorCardLazy {...props} />
|
|
33
|
-
</Suspense>
|
|
34
|
-
)
|
|
35
|
-
}
|
|
28
|
+
const LockedAttachment = { Creator, Visitor }
|
|
36
29
|
|
|
37
30
|
export default LockedAttachment
|
|
38
31
|
export type { CreatorCardProps, VisitorCardProps }
|
|
39
|
-
export type { PaymentStatus, LockedAttachmentSource } from './types'
|
|
32
|
+
export type { PaymentStatus, LockedAttachmentSource, LockedAttachmentContextValue } from './types'
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
import type { Channel, LocalMessage } from 'stream-chat'
|
|
2
|
+
|
|
1
3
|
import type { PaymentStatus } from '../../stream-custom-data'
|
|
2
4
|
|
|
3
5
|
export interface LockedAttachmentBaseProps {
|
|
4
|
-
mimeType: string
|
|
5
6
|
title?: string
|
|
7
|
+
mimeType?: string
|
|
6
8
|
thumbnailUrl?: string
|
|
7
9
|
detail?: string
|
|
8
10
|
amountText?: string
|
|
@@ -17,3 +19,14 @@ export interface LockedAttachmentSource {
|
|
|
17
19
|
}
|
|
18
20
|
|
|
19
21
|
export type { PaymentStatus }
|
|
22
|
+
|
|
23
|
+
export interface LockedAttachmentContextValue {
|
|
24
|
+
isUnlocking: (id: string) => boolean
|
|
25
|
+
onUnlockClick?: (message: LocalMessage, channel: Channel) => void
|
|
26
|
+
onDownloadClick?: (message: LocalMessage, channel: Channel) => void
|
|
27
|
+
onFetchSource?: (message: LocalMessage, channel: Channel) => Promise<LockedAttachmentSource | void>
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
export const defaultLockedAttachmentContextValue: LockedAttachmentContextValue = {
|
|
31
|
+
isUnlocking: () => false,
|
|
32
|
+
}
|
|
@@ -42,9 +42,6 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
|
|
|
42
42
|
customProfileContent,
|
|
43
43
|
customChannelActions,
|
|
44
44
|
renderMessage,
|
|
45
|
-
onAttachmentUnlockClick,
|
|
46
|
-
onAttachmentDownloadClick,
|
|
47
|
-
onAttachmentUnlocked,
|
|
48
45
|
}) => {
|
|
49
46
|
const {
|
|
50
47
|
service,
|
|
@@ -508,9 +505,6 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
|
|
|
508
505
|
customProfileContent={customProfileContent}
|
|
509
506
|
customChannelActions={customChannelActions}
|
|
510
507
|
renderMessage={renderMessage}
|
|
511
|
-
onAttachmentUnlockClick={onAttachmentUnlockClick}
|
|
512
|
-
onAttachmentDownloadClick={onAttachmentDownloadClick}
|
|
513
|
-
onAttachmentUnlocked={onAttachmentUnlocked}
|
|
514
508
|
/>
|
|
515
509
|
</div>
|
|
516
510
|
) : initialParticipantFilter ? (
|
package/src/index.ts
CHANGED
|
@@ -16,11 +16,13 @@ export { MessageVoteButtons } from './components/CustomMessage/MessageVoteButton
|
|
|
16
16
|
|
|
17
17
|
// Providers
|
|
18
18
|
export { MessagingProvider } from './providers/MessagingProvider'
|
|
19
|
+
export { CustomMessageProvider } from './components/CustomMessage/context'
|
|
19
20
|
|
|
20
21
|
// Hooks
|
|
21
22
|
export { useMessaging } from './hooks/useMessaging'
|
|
22
23
|
export { useParticipants } from './hooks/useParticipants'
|
|
23
24
|
export { useMessageVote } from './hooks/useMessageVote'
|
|
25
|
+
export { useCustomMessage } from './components/CustomMessage/context'
|
|
24
26
|
|
|
25
27
|
// Utils
|
|
26
28
|
export { formatRelativeTime } from './utils/formatRelativeTime'
|
|
@@ -40,7 +42,8 @@ export type {
|
|
|
40
42
|
export type { MessageMetadata } from './stream-custom-data'
|
|
41
43
|
export type { AvatarProps } from './components/Avatar'
|
|
42
44
|
export type { ActionButtonProps } from './components/ActionButton'
|
|
43
|
-
export type {
|
|
45
|
+
export type { CreatorCardProps, VisitorCardProps, LockedAttachmentContextValue } from './components/LockedAttachment'
|
|
46
|
+
export type { CustomMessageRegistry } from './components/CustomMessage/context'
|
|
44
47
|
export type { AttachmentSourceType } from './components/LockedAttachment/utils/mimeType'
|
|
45
48
|
export type { Faq, FaqListProps } from './components/FaqList'
|
|
46
49
|
export type { FaqListItemProps } from './components/FaqList/FaqListItem'
|
package/src/types.ts
CHANGED
|
@@ -14,7 +14,6 @@ import type {
|
|
|
14
14
|
EmptyStateIndicatorProps,
|
|
15
15
|
} from 'stream-chat-react'
|
|
16
16
|
|
|
17
|
-
import type { LockedAttachmentSource } from './components/LockedAttachment'
|
|
18
17
|
import type { MessageMetadata } from './stream-custom-data'
|
|
19
18
|
|
|
20
19
|
export type { LockedAttachmentSource } from './components/LockedAttachment'
|
|
@@ -235,23 +234,6 @@ export interface ChannelViewProps {
|
|
|
235
234
|
message: LocalMessage
|
|
236
235
|
) => React.ReactNode
|
|
237
236
|
|
|
238
|
-
/**
|
|
239
|
-
* Called when the visitor clicks Unlock on a locked attachment card.
|
|
240
|
-
* Fire-and-forget; host is responsible for opening checkout and tracking unlock state.
|
|
241
|
-
*/
|
|
242
|
-
onAttachmentUnlockClick?: (message: LocalMessage, channel: Channel) => void
|
|
243
|
-
|
|
244
|
-
/**
|
|
245
|
-
* Called when the visitor clicks Download on an unlocked attachment card.
|
|
246
|
-
*/
|
|
247
|
-
onAttachmentDownloadClick?: (message: LocalMessage, channel: Channel) => void
|
|
248
|
-
|
|
249
|
-
/**
|
|
250
|
-
* Returns the current unlock state for a given message ID.
|
|
251
|
-
* Called by CustomMessage on each render to drive controlled props on LockedAttachment.
|
|
252
|
-
* Host owns sourceUrl / redeemUrl state.
|
|
253
|
-
*/
|
|
254
|
-
onAttachmentUnlocked?: (message: LocalMessage, channel: Channel) => LockedAttachmentSource
|
|
255
237
|
}
|
|
256
238
|
|
|
257
239
|
/**
|
|
@@ -275,9 +257,6 @@ export type ChannelViewPassthroughProps = Pick<
|
|
|
275
257
|
| 'customProfileContent'
|
|
276
258
|
| 'customChannelActions'
|
|
277
259
|
| 'renderMessage'
|
|
278
|
-
| 'onAttachmentUnlockClick'
|
|
279
|
-
| 'onAttachmentDownloadClick'
|
|
280
|
-
| 'onAttachmentUnlocked'
|
|
281
260
|
>
|
|
282
261
|
|
|
283
262
|
/**
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Creator-DGe3CQ_j.js","sources":["../src/components/LockedAttachment/components/Creator.tsx"],"sourcesContent":["import {\n CheckCircleIcon,\n EyeIcon,\n EyeSlashIcon,\n LockIcon,\n LockOpenIcon,\n PauseIcon,\n PlayIcon,\n XIcon,\n} from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport type { LockedAttachmentBaseProps } from '../types'\nimport { renderTypeIcon } from '../utils/icons'\nimport { getSourceType } from '../utils/mimeType'\n\nimport MediaPlayer from './MediaPlayer'\n\nexport interface CreatorCardProps extends LockedAttachmentBaseProps {\n isPreview?: boolean\n placeholderTitle?: string\n placeholderAmountText?: string\n sourceUrl?: string\n onDismiss?: () => void\n}\n\ninterface CloseButtonProps {\n onClose: () => void\n}\n\nconst CloseButton: React.FC<CloseButtonProps> = (props) => {\n const { onClose } = props\n return (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"absolute left-3 top-3 z-40 flex size-8 items-center justify-center rounded-full bg-black/60 text-white\"\n aria-label=\"Close preview\"\n >\n <EyeIcon className=\"size-4\" weight=\"fill\" />\n </button>\n )\n}\n\ninterface CollapsedThumbnailProps {\n thumbnailUrl?: string\n mimeType: string\n overlayIcon?: React.ElementType\n darkOverlay?: boolean\n onClick?: () => void\n}\n\nconst CollapsedThumbnail: React.FC<CollapsedThumbnailProps> = (props) => {\n const { thumbnailUrl, mimeType, overlayIcon: OverlayIcon, darkOverlay, onClick } = props\n return (\n <button\n type=\"button\"\n disabled={!onClick}\n className={classNames(\n 'relative aspect-video block w-full overflow-hidden border-0 bg-black/5 p-0 text-left appearance-none',\n { 'cursor-pointer': !!onClick, 'cursor-default': !onClick }\n )}\n onClick={onClick}\n aria-label={OverlayIcon ? 'Toggle preview' : undefined}\n >\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 {darkOverlay && (\n <div className=\"pointer-events-none absolute inset-0 bg-black/30\" />\n )}\n {OverlayIcon && (\n <div className=\"pointer-events-none absolute left-3 top-3 flex size-8 items-center justify-center rounded-full bg-black/60 text-white\">\n <OverlayIcon className=\"size-4\" weight=\"fill\" />\n </div>\n )}\n </button>\n )\n}\n\n\ninterface AudioPreviewProps {\n sourceUrl?: string\n thumbnailUrl?: string\n mimeType: string\n}\n\nconst AudioPreview: React.FC<AudioPreviewProps> = (props) => {\n const { sourceUrl, thumbnailUrl, mimeType } = props\n const [playing, setPlaying] = useState(false)\n const [played, setPlayed] = useState(0)\n const [seeking, setSeeking] = useState(false)\n const audioRef = useRef<HTMLAudioElement>(null)\n const trackRef = useRef<HTMLDivElement>(null)\n const rafRef = useRef<number | null>(null)\n\n useEffect(() => {\n const el = audioRef.current\n if (!el) return\n if (playing) {\n void el.play().catch(() => setPlaying(false))\n } else {\n el.pause()\n }\n }, [playing])\n\n useEffect(() => {\n if (!playing) {\n if (rafRef.current !== null) cancelAnimationFrame(rafRef.current)\n return\n }\n const tick = () => {\n const el = audioRef.current\n if (el && el.duration && !seeking) setPlayed(el.currentTime / el.duration)\n rafRef.current = requestAnimationFrame(tick)\n }\n rafRef.current = requestAnimationFrame(tick)\n return () => {\n if (rafRef.current !== null) cancelAnimationFrame(rafRef.current)\n }\n }, [playing, seeking])\n\n const [audioReady, setAudioReady] = useState(false)\n\n const getFraction = useCallback(\n (e: MouseEvent | TouchEvent | React.MouseEvent | React.TouchEvent) => {\n const track = trackRef.current\n if (!track) return 0\n const clientX =\n 'touches' in e\n ? (e.touches[0]?.clientX ?? e.changedTouches[0]?.clientX ?? 0)\n : e.clientX\n const rect = track.getBoundingClientRect()\n return Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n },\n []\n )\n\n const seekTo = useCallback((fraction: number) => {\n const el = audioRef.current\n if (el && el.duration) el.currentTime = fraction * el.duration\n }, [])\n\n useEffect(() => {\n if (!seeking) return\n const onMove = (e: MouseEvent | TouchEvent) => {\n const f = getFraction(e)\n setPlayed(f)\n seekTo(f)\n }\n const onUp = (e: MouseEvent | TouchEvent) => {\n setSeeking(false)\n seekTo(getFraction(e))\n }\n window.addEventListener('mousemove', onMove)\n window.addEventListener('mouseup', onUp)\n window.addEventListener('touchmove', onMove, { passive: true })\n window.addEventListener('touchend', onUp)\n return () => {\n window.removeEventListener('mousemove', onMove)\n window.removeEventListener('mouseup', onUp)\n window.removeEventListener('touchmove', onMove)\n window.removeEventListener('touchend', onUp)\n }\n }, [seeking, getFraction, seekTo])\n\n const toggle = useCallback(() => setPlaying((p) => !p), [])\n\n return (\n <div className=\"relative\">\n {sourceUrl && (\n <audio\n ref={audioRef}\n src={sourceUrl}\n loop\n onCanPlay={() => setAudioReady(true)}\n onEnded={() => {\n setPlaying(false)\n setPlayed(0)\n }}\n >\n <track kind=\"captions\" />\n </audio>\n )}\n <CollapsedThumbnail\n thumbnailUrl={thumbnailUrl}\n mimeType={mimeType}\n overlayIcon={sourceUrl && audioReady ? (playing ? PauseIcon : PlayIcon) : undefined}\n onClick={sourceUrl && audioReady ? toggle : undefined}\n />\n {sourceUrl && audioReady && (\n <div className=\"absolute inset-x-0 bottom-0 px-3 pb-2.5 pt-6 bg-gradient-to-t from-black/40 to-transparent\">\n <div\n ref={trackRef}\n role=\"slider\"\n aria-label=\"Playback position\"\n aria-valuenow={Math.round(played * 100)}\n aria-valuemin={0}\n aria-valuemax={100}\n tabIndex={0}\n className=\"relative flex h-4 w-full cursor-pointer items-center\"\n onMouseDown={(e) => {\n e.stopPropagation()\n setSeeking(true)\n const f = getFraction(e)\n setPlayed(f)\n seekTo(f)\n }}\n onTouchStart={(e) => {\n e.stopPropagation()\n setSeeking(true)\n const f = getFraction(e)\n setPlayed(f)\n seekTo(f)\n }}\n onClick={(e) => e.stopPropagation()}\n onKeyDown={(e) => {\n if (e.key === 'ArrowRight') seekTo(Math.min(1, played + 0.05))\n if (e.key === 'ArrowLeft') seekTo(Math.max(0, played - 0.05))\n }}\n >\n <div className=\"w-full overflow-hidden rounded-full bg-white/30 h-1\">\n <div\n className=\"h-full rounded-full bg-white\"\n style={{ width: `${Math.round(played * 100)}%` }}\n />\n </div>\n </div>\n </div>\n )}\n </div>\n )\n}\n\ninterface VideoPreviewProps {\n sourceUrl?: string\n thumbnailUrl?: string\n mimeType: string\n}\n\nconst VideoPreview: React.FC<VideoPreviewProps> = (props) => {\n const { sourceUrl, thumbnailUrl, mimeType } = props\n const [expanded, setExpanded] = useState(false)\n const collapse = () => setExpanded(false)\n\n if (!sourceUrl) {\n return <CollapsedThumbnail thumbnailUrl={thumbnailUrl} mimeType={mimeType} />\n }\n\n return (\n <div\n className={classNames('relative overflow-hidden', {\n 'aspect-video': !expanded,\n })}\n >\n <MediaPlayer\n source={sourceUrl}\n mimeType={mimeType}\n poster={thumbnailUrl}\n playing={expanded}\n loop={true}\n controls={false}\n muted={true}\n showProgress={true}\n onContainerClick={collapse}\n />\n {!expanded && (\n <button\n type=\"button\"\n className=\"absolute inset-0 block cursor-pointer border-0 p-0 text-left appearance-none\"\n onClick={() => setExpanded(true)}\n aria-label=\"Expand video preview\"\n >\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 <div className=\"pointer-events-none absolute left-3 top-3 flex size-8 items-center justify-center rounded-full bg-black/60 text-white\">\n <EyeSlashIcon className=\"size-4\" weight=\"fill\" />\n </div>\n </button>\n )}\n {expanded && <CloseButton onClose={collapse} />}\n </div>\n )\n}\n\ninterface ImagePreviewProps {\n sourceUrl?: string\n thumbnailUrl?: string\n mimeType: string\n title?: string\n}\n\nconst ImagePreview: React.FC<ImagePreviewProps> = (props) => {\n const { sourceUrl, thumbnailUrl, mimeType, title } = props\n const [expanded, setExpanded] = useState(false)\n\n if (expanded && sourceUrl) {\n return (\n <div className=\"relative\">\n <button\n type=\"button\"\n className=\"block w-full cursor-pointer border-0 p-0 text-left appearance-none\"\n onClick={() => setExpanded(false)}\n aria-label=\"Close preview\"\n >\n <img src={sourceUrl} alt={title ?? ''} className=\"block w-full\" />\n </button>\n <CloseButton onClose={() => setExpanded(false)} />\n </div>\n )\n }\n\n return (\n <CollapsedThumbnail\n thumbnailUrl={thumbnailUrl}\n mimeType={mimeType}\n overlayIcon={sourceUrl ? EyeSlashIcon : undefined}\n onClick={sourceUrl ? () => setExpanded(true) : undefined}\n />\n )\n}\n\n\nconst CreatorCard: React.FC<CreatorCardProps> = (props) => {\n const {\n title,\n mimeType = 'application/octet-stream',\n thumbnailUrl,\n sourceUrl,\n detail,\n amountText,\n placeholderTitle = 'Attachment title',\n placeholderAmountText,\n paymentStatus,\n onDismiss,\n isPreview = false,\n } = props\n const sourceType = getSourceType(mimeType)\n const displayAmountText = amountText ?? placeholderAmountText\n const isPlaceholderAmount = !amountText && !!placeholderAmountText\n\n let mediaPreview: React.ReactNode\n if (isPreview && sourceType === 'audio') {\n mediaPreview = (\n <AudioPreview key={sourceUrl} sourceUrl={sourceUrl} thumbnailUrl={thumbnailUrl} mimeType={mimeType} />\n )\n } else if (isPreview && sourceType === 'video') {\n mediaPreview = (\n <VideoPreview key={sourceUrl} sourceUrl={sourceUrl} thumbnailUrl={thumbnailUrl} mimeType={mimeType} />\n )\n } else if (isPreview && sourceType === 'image') {\n mediaPreview = (\n <ImagePreview\n key={sourceUrl}\n sourceUrl={sourceUrl}\n thumbnailUrl={thumbnailUrl}\n mimeType={mimeType}\n title={title}\n />\n )\n } else {\n const lockedOverlayIcon = onDismiss\n ? undefined\n : paymentStatus === 'paid'\n ? LockOpenIcon\n : LockIcon\n mediaPreview = (\n <CollapsedThumbnail\n thumbnailUrl={thumbnailUrl}\n mimeType={mimeType}\n overlayIcon={lockedOverlayIcon}\n darkOverlay\n />\n )\n }\n\n return (\n <div className=\"relative 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 {onDismiss && (\n <button\n type=\"button\"\n onClick={onDismiss}\n className=\"absolute right-3 top-3 z-50 flex size-8 items-center justify-center rounded-full bg-black/60 text-white\"\n aria-label=\"Dismiss attachment\"\n >\n <XIcon className=\"size-4\" weight=\"bold\" />\n </button>\n )}\n {mediaPreview}\n <div className=\"px-4 pb-3 pt-3\">\n <p\n className={classNames('mb-1.5 truncate text-base font-medium', {\n 'text-black/30': !title,\n 'text-black': !!title,\n })}\n >\n {title || placeholderTitle}\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 displayAmountText && (\n <>\n <span\n className={classNames('text-xs font-medium', {\n 'text-black/30': isPlaceholderAmount,\n 'text-black/55': !isPlaceholderAmount,\n })}\n >\n •\n </span>\n <span\n className={classNames('text-xs font-medium', {\n 'text-black/30': isPlaceholderAmount,\n 'text-black/55': !isPlaceholderAmount,\n })}\n >\n {displayAmountText}\n </span>\n </>\n )\n )}\n </div>\n </div>\n </div>\n )\n}\n\nexport default CreatorCard\n"],"names":["CloseButton","props","onClose","jsx","EyeIcon","CollapsedThumbnail","thumbnailUrl","mimeType","OverlayIcon","darkOverlay","onClick","jsxs","classNames","AudioPreview","sourceUrl","playing","setPlaying","useState","played","setPlayed","seeking","setSeeking","audioRef","useRef","trackRef","rafRef","useEffect","el","tick","audioReady","setAudioReady","getFraction","useCallback","e","track","clientX","_a","_b","rect","seekTo","fraction","onMove","f","onUp","toggle","p","PauseIcon","PlayIcon","VideoPreview","expanded","setExpanded","collapse","MediaPlayer","EyeSlashIcon","ImagePreview","title","CreatorCard","detail","amountText","placeholderTitle","placeholderAmountText","paymentStatus","onDismiss","isPreview","sourceType","getSourceType","displayAmountText","isPlaceholderAmount","mediaPreview","LockOpenIcon","LockIcon","XIcon","renderTypeIcon","Fragment","CheckCircleIcon"],"mappings":"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"}
|
package/dist/Visitor-DyJTWB2_.js
DELETED
|
@@ -1,204 +0,0 @@
|
|
|
1
|
-
import { jsxs as i, jsx as e, Fragment as z } from "react/jsx-runtime";
|
|
2
|
-
import { CheckCircleIcon as I, LockSimpleIcon as w, DownloadSimpleIcon as j, LockOpenIcon as S } from "@phosphor-icons/react";
|
|
3
|
-
import x, { useState as N, useEffect as T, useCallback as _ } from "react";
|
|
4
|
-
import { g as D, r as b, M as P } from "./MediaPlayer-BCsdmsON.js";
|
|
5
|
-
const h = (a) => a === "paid" ? S : w, v = (a) => {
|
|
6
|
-
const { icon: t } = a;
|
|
7
|
-
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" }) }) });
|
|
8
|
-
}, y = (a) => {
|
|
9
|
-
const { thumbnailUrl: t, mimeType: s, LockIcon: l } = a;
|
|
10
|
-
return /* @__PURE__ */ i("div", { className: "relative aspect-video overflow-hidden bg-black/5", children: [
|
|
11
|
-
t ? /* @__PURE__ */ e(
|
|
12
|
-
"img",
|
|
13
|
-
{
|
|
14
|
-
src: t,
|
|
15
|
-
alt: "",
|
|
16
|
-
className: "absolute inset-0 h-full w-full object-cover"
|
|
17
|
-
}
|
|
18
|
-
) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: b(s, {
|
|
19
|
-
className: "size-12 text-black/20",
|
|
20
|
-
weight: "regular"
|
|
21
|
-
}) }),
|
|
22
|
-
/* @__PURE__ */ e(v, { icon: l })
|
|
23
|
-
] });
|
|
24
|
-
}, F = (a) => {
|
|
25
|
-
const { sourceUrl: t, thumbnailUrl: s, mimeType: l, title: n, paymentStatus: c, isLocked: o } = a, [d, p] = N(!1);
|
|
26
|
-
return o ? /* @__PURE__ */ e(
|
|
27
|
-
y,
|
|
28
|
-
{
|
|
29
|
-
thumbnailUrl: s,
|
|
30
|
-
mimeType: l,
|
|
31
|
-
LockIcon: h(c)
|
|
32
|
-
}
|
|
33
|
-
) : /* @__PURE__ */ e("div", { className: "relative overflow-hidden bg-black/5", children: /* @__PURE__ */ e(
|
|
34
|
-
"img",
|
|
35
|
-
{
|
|
36
|
-
src: t,
|
|
37
|
-
alt: n,
|
|
38
|
-
className: `block w-full transition-opacity duration-300 ${d ? "opacity-100" : "opacity-0"}`,
|
|
39
|
-
onLoad: () => p(!0)
|
|
40
|
-
}
|
|
41
|
-
) });
|
|
42
|
-
}, M = (a) => {
|
|
43
|
-
const { thumbnailUrl: t, mimeType: s, paymentStatus: l, isLocked: n } = a;
|
|
44
|
-
return /* @__PURE__ */ i("div", { className: "relative aspect-video overflow-hidden bg-black/5", children: [
|
|
45
|
-
t ? /* @__PURE__ */ e(
|
|
46
|
-
"img",
|
|
47
|
-
{
|
|
48
|
-
src: t,
|
|
49
|
-
alt: "",
|
|
50
|
-
className: "absolute inset-0 h-full w-full object-cover"
|
|
51
|
-
}
|
|
52
|
-
) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center", children: b(s, {
|
|
53
|
-
className: "size-12 text-black/20",
|
|
54
|
-
weight: "regular"
|
|
55
|
-
}) }),
|
|
56
|
-
n && /* @__PURE__ */ e(v, { icon: h(l) })
|
|
57
|
-
] });
|
|
58
|
-
}, R = (a) => {
|
|
59
|
-
const { sourceUrl: t, thumbnailUrl: s, mimeType: l, paymentStatus: n, isLocked: c } = a;
|
|
60
|
-
return c ? /* @__PURE__ */ e(
|
|
61
|
-
y,
|
|
62
|
-
{
|
|
63
|
-
thumbnailUrl: s,
|
|
64
|
-
mimeType: l,
|
|
65
|
-
LockIcon: h(n)
|
|
66
|
-
}
|
|
67
|
-
) : /* @__PURE__ */ e(
|
|
68
|
-
P,
|
|
69
|
-
{
|
|
70
|
-
source: t,
|
|
71
|
-
mimeType: l,
|
|
72
|
-
poster: s
|
|
73
|
-
}
|
|
74
|
-
);
|
|
75
|
-
}, O = () => /* @__PURE__ */ i("span", { className: "flex items-center gap-1", children: [
|
|
76
|
-
/* @__PURE__ */ e("span", { className: "size-1 rounded-full bg-white animate-bounce [animation-delay:-0.3s]" }),
|
|
77
|
-
/* @__PURE__ */ e("span", { className: "size-1 rounded-full bg-white animate-bounce [animation-delay:-0.15s]" }),
|
|
78
|
-
/* @__PURE__ */ e("span", { className: "size-1 rounded-full bg-white animate-bounce" })
|
|
79
|
-
] }), A = (a) => {
|
|
80
|
-
const {
|
|
81
|
-
isLocked: t,
|
|
82
|
-
isUnlocking: s,
|
|
83
|
-
sourceUrl: l,
|
|
84
|
-
redeemUrl: n,
|
|
85
|
-
onUnlockClicked: c,
|
|
86
|
-
onDownloadClicked: o
|
|
87
|
-
} = a;
|
|
88
|
-
return t && c ? /* @__PURE__ */ e(
|
|
89
|
-
"button",
|
|
90
|
-
{
|
|
91
|
-
type: "button",
|
|
92
|
-
onClick: c,
|
|
93
|
-
disabled: s,
|
|
94
|
-
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",
|
|
95
|
-
children: s ? /* @__PURE__ */ e(O, {}) : /* @__PURE__ */ i(z, { children: [
|
|
96
|
-
/* @__PURE__ */ e(w, { className: "size-4", weight: "fill" }),
|
|
97
|
-
"Unlock"
|
|
98
|
-
] })
|
|
99
|
-
}
|
|
100
|
-
) : !t && o && l ? /* @__PURE__ */ i(
|
|
101
|
-
"a",
|
|
102
|
-
{
|
|
103
|
-
href: n ?? l,
|
|
104
|
-
target: "_blank",
|
|
105
|
-
rel: "noopener noreferrer",
|
|
106
|
-
onClick: o,
|
|
107
|
-
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]",
|
|
108
|
-
children: [
|
|
109
|
-
/* @__PURE__ */ e(j, { className: "size-4", weight: "bold" }),
|
|
110
|
-
"Download"
|
|
111
|
-
]
|
|
112
|
-
}
|
|
113
|
-
) : null;
|
|
114
|
-
}, B = (a) => {
|
|
115
|
-
const {
|
|
116
|
-
title: t,
|
|
117
|
-
amountText: s,
|
|
118
|
-
thumbnailUrl: l,
|
|
119
|
-
mimeType: n = "application/octet-stream",
|
|
120
|
-
detail: c,
|
|
121
|
-
onUnlocked: o,
|
|
122
|
-
onUnlockClick: d,
|
|
123
|
-
onDownloadClick: p,
|
|
124
|
-
paymentStatus: m
|
|
125
|
-
} = a, { sourceUrl: r, redeemUrl: U } = (o == null ? void 0 : o()) ?? {}, [L, g] = N(!1), u = r === void 0, k = D(n);
|
|
126
|
-
T(() => {
|
|
127
|
-
r !== void 0 && g(!1);
|
|
128
|
-
}, [r]);
|
|
129
|
-
const C = _(() => {
|
|
130
|
-
d && (g(!0), d());
|
|
131
|
-
}, [d]);
|
|
132
|
-
let f;
|
|
133
|
-
return k === "image" ? f = /* @__PURE__ */ e(
|
|
134
|
-
F,
|
|
135
|
-
{
|
|
136
|
-
sourceUrl: r,
|
|
137
|
-
thumbnailUrl: l,
|
|
138
|
-
mimeType: n,
|
|
139
|
-
title: t,
|
|
140
|
-
paymentStatus: m,
|
|
141
|
-
isLocked: u
|
|
142
|
-
},
|
|
143
|
-
r
|
|
144
|
-
) : k === "document" ? f = /* @__PURE__ */ e(
|
|
145
|
-
M,
|
|
146
|
-
{
|
|
147
|
-
thumbnailUrl: l,
|
|
148
|
-
mimeType: n,
|
|
149
|
-
paymentStatus: m,
|
|
150
|
-
isLocked: u
|
|
151
|
-
}
|
|
152
|
-
) : f = /* @__PURE__ */ e(
|
|
153
|
-
R,
|
|
154
|
-
{
|
|
155
|
-
sourceUrl: r,
|
|
156
|
-
thumbnailUrl: l,
|
|
157
|
-
mimeType: n,
|
|
158
|
-
paymentStatus: m,
|
|
159
|
-
isLocked: u
|
|
160
|
-
},
|
|
161
|
-
r
|
|
162
|
-
), /* @__PURE__ */ i("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: [
|
|
163
|
-
f,
|
|
164
|
-
/* @__PURE__ */ i("div", { className: "px-4 pb-3 pt-3", children: [
|
|
165
|
-
/* @__PURE__ */ e("p", { className: "mb-1.5 truncate text-base font-medium text-black", children: t }),
|
|
166
|
-
/* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
|
|
167
|
-
b(n, {
|
|
168
|
-
className: "size-5 shrink-0 text-black/55",
|
|
169
|
-
weight: "regular"
|
|
170
|
-
}),
|
|
171
|
-
c && /* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: c }),
|
|
172
|
-
m === "paid" ? /* @__PURE__ */ i(x.Fragment, { children: [
|
|
173
|
-
/* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: "•" }),
|
|
174
|
-
/* @__PURE__ */ e("span", { className: "text-xs font-medium text-[#008236]", children: "Purchased" }),
|
|
175
|
-
/* @__PURE__ */ e(
|
|
176
|
-
I,
|
|
177
|
-
{
|
|
178
|
-
className: "size-4 text-[#008236]",
|
|
179
|
-
weight: "bold"
|
|
180
|
-
}
|
|
181
|
-
)
|
|
182
|
-
] }) : s && /* @__PURE__ */ i(x.Fragment, { children: [
|
|
183
|
-
/* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: "•" }),
|
|
184
|
-
/* @__PURE__ */ e("span", { className: "text-xs font-medium text-black/55", children: s })
|
|
185
|
-
] })
|
|
186
|
-
] }),
|
|
187
|
-
/* @__PURE__ */ e(
|
|
188
|
-
A,
|
|
189
|
-
{
|
|
190
|
-
isLocked: u,
|
|
191
|
-
isUnlocking: L,
|
|
192
|
-
sourceUrl: r,
|
|
193
|
-
redeemUrl: U,
|
|
194
|
-
onUnlockClicked: C,
|
|
195
|
-
onDownloadClicked: p
|
|
196
|
-
}
|
|
197
|
-
)
|
|
198
|
-
] })
|
|
199
|
-
] });
|
|
200
|
-
};
|
|
201
|
-
export {
|
|
202
|
-
B as default
|
|
203
|
-
};
|
|
204
|
-
//# sourceMappingURL=Visitor-DyJTWB2_.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Visitor-DyJTWB2_.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, { useCallback, useEffect, useState } from 'react'\n\nimport type { LockedAttachmentBaseProps, LockedAttachmentSource, PaymentStatus } 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. Omit to hide the Unlock button. \n */\n onUnlockClick?: () => void\n /** \n * Called when the visitor clicks Download on an unlocked card. \n * Omit to hide the Download button.\n */\n onDownloadClick?: () => void\n /**\n * Returns current unlock state — sourceUrl (for playback) and redeemUrl (for download).\n * Bound to the message by the host before being passed down,\n * so this component receives no Stream Chat types.\n */\n onUnlocked?: () => LockedAttachmentSource\n}\n\nconst getLockIcon = (paymentStatus?: PaymentStatus): React.ElementType => {\n return paymentStatus === 'paid' ? LockOpenIcon : LockSimpleIcon\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\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 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 (\n <MediaPlayer\n source={sourceUrl!}\n mimeType={mimeType}\n poster={thumbnailUrl}\n />\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 isUnlocking?: boolean\n sourceUrl?: string\n redeemUrl?: string\n onUnlockClicked?: () => void\n onDownloadClicked?: () => void\n}\n\nconst CardActions: React.FC<CardActionsProps> = (props) => {\n const {\n isLocked,\n isUnlocking,\n sourceUrl,\n redeemUrl,\n onUnlockClicked,\n onDownloadClicked,\n } = props\n\n if (isLocked && onUnlockClicked) {\n return (\n <button\n type=\"button\"\n onClick={onUnlockClicked}\n disabled={isUnlocking}\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 {isUnlocking ? (\n <LoadingDots />\n ) : (\n <>\n <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n Unlock\n </>\n )}\n </button>\n )\n }\n\n if (!isLocked && onDownloadClicked && sourceUrl) {\n return (\n <a\n href={redeemUrl ?? sourceUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n onClick={onDownloadClicked}\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\nconst VisitorCard: React.FC<VisitorCardProps> = (props) => {\n const {\n title,\n amountText,\n thumbnailUrl,\n mimeType = 'application/octet-stream',\n detail,\n onUnlocked,\n onUnlockClick,\n onDownloadClick,\n paymentStatus,\n } = props\n\n const { sourceUrl, redeemUrl } = onUnlocked?.() ?? {}\n const [isUnlocking, setUnlocking] = useState(false)\n\n const isLocked = sourceUrl === undefined\n const sourceType = getSourceType(mimeType)\n\n useEffect(() => {\n if (sourceUrl !== undefined) {\n setUnlocking(false)\n }\n }, [sourceUrl])\n\n const onUnlockClicked = useCallback(() => {\n if (onUnlockClick) {\n setUnlocking(true)\n onUnlockClick()\n }\n }, [onUnlockClick])\n\n let mediaPreview: React.ReactNode\n if (sourceType === 'image') {\n mediaPreview = (\n <ImagePreview\n key={sourceUrl}\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 key={sourceUrl}\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 <React.Fragment>\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 </React.Fragment>\n ) : (\n amountText && (\n <React.Fragment>\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 </React.Fragment>\n )\n )}\n </div>\n <CardActions\n isLocked={isLocked}\n isUnlocking={isUnlocking}\n sourceUrl={sourceUrl}\n redeemUrl={redeemUrl}\n onUnlockClicked={onUnlockClicked}\n onDownloadClicked={onDownloadClick}\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","DocumentPreview","MediaPreview","MediaPlayer","LoadingDots","CardActions","isUnlocking","redeemUrl","onUnlockClicked","onDownloadClicked","Fragment","DownloadSimpleIcon","VisitorCard","amountText","detail","onUnlocked","onUnlockClick","onDownloadClick","setUnlocking","sourceType","getSourceType","useEffect","useCallback","mediaPreview","renderTypeIcon","React","CheckCircleIcon"],"mappings":";;;;AAgCA,MAAMA,IAAc,CAACC,MACZA,MAAkB,SAASC,IAAeC,GAO7CC,IAA0C,CAACC,MAAU;AACzD,QAAM,EAAE,MAAMC,EAAA,IAASD;AACvB,SACE,gBAAAE,EAAC,OAAA,EAAI,WAAU,gCACb,4BAAC,OAAA,EAAI,WAAU,0FACb,UAAA,gBAAAA,EAACD,KAAK,WAAU,qBAAoB,QAAO,OAAA,CAAO,GACpD,GACF;AAEJ,GAQME,IAA8C,CAACH,MAAU;AAC7D,QAAM,EAAE,cAAAI,GAAc,UAAAC,GAAU,UAAAC,EAAA,IAAaN;AAC7C,SACE,gBAAAO,EAAC,OAAA,EAAI,WAAU,oDACZ,UAAA;AAAA,IAAAH,IACC,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKE;AAAA,QACL,KAAI;AAAA,QACJ,WAAU;AAAA,MAAA;AAAA,IAAA,IAGZ,gBAAAF,EAAC,OAAA,EAAI,WAAU,qDACZ,YAAeG,GAAU;AAAA,MACxB,WAAW;AAAA,MACX,QAAQ;AAAA,IAAA,CACT,GACH;AAAA,IAEF,gBAAAH,EAACH,GAAA,EAAY,MAAMO,EAAA,CAAU;AAAA,EAAA,GAC/B;AAEJ,GAWME,IAA4C,CAACR,MAAU;AAC3D,QAAM,EAAE,WAAAS,GAAW,cAAAL,GAAc,UAAAC,GAAU,OAAAK,GAAO,eAAAd,GAAe,UAAAe,MAAaX,GACxE,CAACY,GAAaC,CAAc,IAAIC,EAAS,EAAK;AAEpD,SAAIH,IAEA,gBAAAT;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,cAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAUV,EAAYC,CAAa;AAAA,IAAA;AAAA,EAAA,IAMvC,gBAAAM,EAAC,OAAA,EAAI,WAAU,uCACb,UAAA,gBAAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKO;AAAA,MACL,KAAKC;AAAA,MACL,WAAW,gDAAgDE,IAAc,gBAAgB,WAAW;AAAA,MACpG,QAAQ,MAAMC,EAAe,EAAI;AAAA,IAAA;AAAA,EAAA,GAErC;AAEJ,GASME,IAAkD,CAACf,MAAU;AACjE,QAAM,EAAE,cAAAI,GAAc,UAAAC,GAAU,eAAAT,GAAe,UAAAe,MAAaX;AAC5D,SACE,gBAAAO,EAAC,OAAA,EAAI,WAAU,oDACZ,UAAA;AAAA,IAAAH,IACC,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKE;AAAA,QACL,KAAI;AAAA,QACJ,WAAU;AAAA,MAAA;AAAA,IAAA,IAGZ,gBAAAF,EAAC,OAAA,EAAI,WAAU,qDACZ,YAAeG,GAAU;AAAA,MACxB,WAAW;AAAA,MACX,QAAQ;AAAA,IAAA,CACT,GACH;AAAA,IAEDM,KAAY,gBAAAT,EAACH,GAAA,EAAY,MAAMJ,EAAYC,CAAa,EAAA,CAAG;AAAA,EAAA,GAC9D;AAEJ,GAUMoB,IAA4C,CAAChB,MAAU;AAC3D,QAAM,EAAE,WAAAS,GAAW,cAAAL,GAAc,UAAAC,GAAU,eAAAT,GAAe,UAAAe,MAAaX;AACvE,SAAIW,IAEA,gBAAAT;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,cAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAUV,EAAYC,CAAa;AAAA,IAAA;AAAA,EAAA,IAKvC,gBAAAM;AAAA,IAACe;AAAA,IAAA;AAAA,MACC,QAAQR;AAAA,MACR,UAAAJ;AAAA,MACA,QAAQD;AAAA,IAAA;AAAA,EAAA;AAGd,GAEMc,IAAc,MAClB,gBAAAX,EAAC,QAAA,EAAK,WAAU,2BACd,UAAA;AAAA,EAAA,gBAAAL,EAAC,QAAA,EAAK,WAAU,sEAAA,CAAsE;AAAA,EACtF,gBAAAA,EAAC,QAAA,EAAK,WAAU,uEAAA,CAAuE;AAAA,EACvF,gBAAAA,EAAC,QAAA,EAAK,WAAU,8CAAA,CAA8C;AAAA,GAChE,GAYIiB,IAA0C,CAACnB,MAAU;AACzD,QAAM;AAAA,IACJ,UAAAW;AAAA,IACA,aAAAS;AAAA,IACA,WAAAX;AAAA,IACA,WAAAY;AAAA,IACA,iBAAAC;AAAA,IACA,mBAAAC;AAAA,EAAA,IACEvB;AAEJ,SAAIW,KAAYW,IAEZ,gBAAApB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAASoB;AAAA,MACT,UAAUF;AAAA,MACV,WAAU;AAAA,MAET,UAAAA,IACC,gBAAAlB,EAACgB,GAAA,CAAA,CAAY,IAEb,gBAAAX,EAAAiB,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAtB,EAACJ,GAAA,EAAe,WAAU,UAAS,QAAO,QAAO;AAAA,QAAE;AAAA,MAAA,EAAA,CAErD;AAAA,IAAA;AAAA,EAAA,IAMJ,CAACa,KAAYY,KAAqBd,IAElC,gBAAAF;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAMc,KAAaZ;AAAA,MACnB,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,SAASc;AAAA,MACT,WAAU;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAArB,EAACuB,GAAA,EAAmB,WAAU,UAAS,QAAO,QAAO;AAAA,QAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IAMtD;AACT,GAEMC,IAA0C,CAAC1B,MAAU;AACzD,QAAM;AAAA,IACJ,OAAAU;AAAA,IACA,YAAAiB;AAAA,IACA,cAAAvB;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,QAAAuB;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,eAAAnC;AAAA,EAAA,IACEI,GAEE,EAAE,WAAAS,GAAW,WAAAY,OAAcQ,KAAA,gBAAAA,QAAkB,CAAA,GAC7C,CAACT,GAAaY,CAAY,IAAIlB,EAAS,EAAK,GAE5CH,IAAWF,MAAc,QACzBwB,IAAaC,EAAc7B,CAAQ;AAEzC,EAAA8B,EAAU,MAAM;AACd,IAAI1B,MAAc,UAChBuB,EAAa,EAAK;AAAA,EAEtB,GAAG,CAACvB,CAAS,CAAC;AAEd,QAAMa,IAAkBc,EAAY,MAAM;AACxC,IAAIN,MACFE,EAAa,EAAI,GACjBF,EAAA;AAAA,EAEJ,GAAG,CAACA,CAAa,CAAC;AAElB,MAAIO;AACJ,SAAIJ,MAAe,UACjBI,IACE,gBAAAnC;AAAA,IAACM;AAAA,IAAA;AAAA,MAEC,WAAAC;AAAA,MACA,cAAAL;AAAA,MACA,UAAAC;AAAA,MACA,OAAAK;AAAA,MACA,eAAAd;AAAA,MACA,UAAAe;AAAA,IAAA;AAAA,IANKF;AAAA,EAAA,IASAwB,MAAe,aACxBI,IACE,gBAAAnC;AAAA,IAACa;AAAA,IAAA;AAAA,MACC,cAAAX;AAAA,MACA,UAAAC;AAAA,MACA,eAAAT;AAAA,MACA,UAAAe;AAAA,IAAA;AAAA,EAAA,IAIJ0B,IACE,gBAAAnC;AAAA,IAACc;AAAA,IAAA;AAAA,MAEC,WAAAP;AAAA,MACA,cAAAL;AAAA,MACA,UAAAC;AAAA,MACA,eAAAT;AAAA,MACA,UAAAe;AAAA,IAAA;AAAA,IALKF;AAAA,EAAA,GAWT,gBAAAF,EAAC,OAAA,EAAI,WAAU,gIACZ,UAAA;AAAA,IAAA8B;AAAA,IACD,gBAAA9B,EAAC,OAAA,EAAI,WAAU,kBACb,UAAA;AAAA,MAAA,gBAAAL,EAAC,KAAA,EAAE,WAAU,oDACV,UAAAQ,GACH;AAAA,MACA,gBAAAH,EAAC,OAAA,EAAI,WAAU,2BACZ,UAAA;AAAA,QAAA+B,EAAejC,GAAU;AAAA,UACxB,WAAW;AAAA,UACX,QAAQ;AAAA,QAAA,CACT;AAAA,QACAuB,KACC,gBAAA1B,EAAC,QAAA,EAAK,WAAU,qCAAqC,UAAA0B,GAAO;AAAA,QAE7DhC,MAAkB,SACjB,gBAAAW,EAACgC,EAAM,UAAN,EACC,UAAA;AAAA,UAAA,gBAAArC,EAAC,QAAA,EAAK,WAAU,qCAAoC,UAAA,KAAC;AAAA,UACrD,gBAAAA,EAAC,QAAA,EAAK,WAAU,sCAAqC,UAAA,aAErD;AAAA,UACA,gBAAAA;AAAA,YAACsC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,QAAO;AAAA,YAAA;AAAA,UAAA;AAAA,QACT,EAAA,CACF,IAEAb,KACE,gBAAApB,EAACgC,EAAM,UAAN,EACC,UAAA;AAAA,UAAA,gBAAArC,EAAC,QAAA,EAAK,WAAU,qCAAoC,UAAA,KAAC;AAAA,UACrD,gBAAAA,EAAC,QAAA,EAAK,WAAU,qCACb,UAAAyB,EAAA,CACH;AAAA,QAAA,EAAA,CACF;AAAA,MAAA,GAGN;AAAA,MACA,gBAAAzB;AAAA,QAACiB;AAAA,QAAA;AAAA,UACC,UAAAR;AAAA,UACA,aAAAS;AAAA,UACA,WAAAX;AAAA,UACA,WAAAY;AAAA,UACA,iBAAAC;AAAA,UACA,mBAAmBS;AAAA,QAAA;AAAA,MAAA;AAAA,IACrB,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
|