@linktr.ee/messaging-react 4.4.3 → 4.4.4-rc-1788190776

package/src/components/RichCard/RichCard.test.tsx

@@ -78,7 +78,7 @@ describe('RichCard', () => {
   })
 
   it('renders up to three fanned images for the fan presentation', async () => {
-    const { container } = renderWithProviders(
+    renderWithProviders(
       <RichCard.Received
         title="Collection"
         images={[HERO, IMG_2, IMG_3]}
@@ -88,12 +88,12 @@ describe('RichCard', () => {
     await screen.findByTestId('rich-card')
     // Three <img> nodes render; all are decorative (alt=""), so the fan is out
     // of the a11y tree — the accessible content is the card's title/subtitle.
-    expect(container.querySelectorAll('img')).toHaveLength(3)
+    expect(screen.getAllByRole('img', { hidden: true })).toHaveLength(3)
     expect(screen.queryByAltText('Collection')).toBeNull()
   })
 
   it('drops a failed fan image and re-fans the survivors', async () => {
-    const { container } = renderWithProviders(
+    renderWithProviders(
       <RichCard.Received
         title="Collection"
         images={[HERO, IMG_2, IMG_3]}
@@ -101,15 +101,15 @@ describe('RichCard', () => {
       />
     )
     await screen.findByTestId('rich-card')
-    const images = container.querySelectorAll('img')
+    const images = screen.getAllByRole('img', { hidden: true })
     expect(images).toHaveLength(3)
     // A decorative tile 404s — it's removed and the survivors re-fan.
     fireEvent.error(images[2])
-    expect(container.querySelectorAll('img')).toHaveLength(2)
+    expect(screen.getAllByRole('img', { hidden: true })).toHaveLength(2)
   })
 
   it('keeps fan thumbnails decorative (empty alt)', async () => {
-    const { container } = renderWithProviders(
+    renderWithProviders(
       <RichCard.Received
         title="Collection"
         images={[HERO, IMG_2, IMG_3]}
@@ -117,13 +117,13 @@ describe('RichCard', () => {
       />
     )
     await screen.findByTestId('rich-card')
-    const imgs = Array.from(container.querySelectorAll('img'))
+    const imgs = screen.getAllByRole('img', { hidden: true })
     expect(imgs).toHaveLength(3)
     expect(imgs.every((img) => img.getAttribute('alt') === '')).toBe(true)
   })
 
   it('resets failed fan tiles when the image set changes', async () => {
-    const { container, rerender } = renderWithProviders(
+    const { rerender } = renderWithProviders(
       <RichCard.Received
         title="Collection"
         images={[HERO, IMG_2, IMG_3]}
@@ -131,8 +131,8 @@ describe('RichCard', () => {
       />
     )
     await screen.findByTestId('rich-card')
-    fireEvent.error(container.querySelectorAll('img')[2])
-    expect(container.querySelectorAll('img')).toHaveLength(2)
+    fireEvent.error(screen.getAllByRole('img', { hidden: true })[2])
+    expect(screen.getAllByRole('img', { hidden: true })).toHaveLength(2)
     // A recycled card with a new collection clears the stale failure tracking.
     rerender(
       <RichCard.Received
@@ -145,19 +145,17 @@ describe('RichCard', () => {
         imagePresentation="fan"
       />
     )
-    expect(container.querySelectorAll('img')).toHaveLength(3)
+    expect(screen.getAllByRole('img', { hidden: true })).toHaveLength(3)
   })
 
   it('defaults presentation from image count (>=2 fans)', async () => {
-    const { container } = renderWithProviders(
-      <RichCard.Sent title="Two" images={[HERO, IMG_2]} />
-    )
+    renderWithProviders(<RichCard.Sent title="Two" images={[HERO, IMG_2]} />)
     await screen.findByTestId('rich-card')
-    expect(container.querySelectorAll('img')).toHaveLength(2)
+    expect(screen.getAllByRole('img', { hidden: true })).toHaveLength(2)
   })
 
   it('drops a failed hero image to the placeholder rather than a broken image', async () => {
-    const { container } = renderWithProviders(
+    renderWithProviders(
       <RichCard.Received
         title="Welcome"
         images={[HERO]}
@@ -168,7 +166,7 @@ describe('RichCard', () => {
     // The hero errors → useChinPalette clears the URL → CardThumbnail falls
     // through to its type-icon placeholder, so no <img> remains.
     fireEvent.error(img)
-    expect(container.querySelectorAll('img')).toHaveLength(0)
+    expect(screen.queryAllByRole('img', { hidden: true })).toHaveLength(0)
   })
 
   it('does not pin the card to a fixed height (grows for tall content)', async () => {
@@ -185,6 +183,7 @@ describe('RichCard', () => {
       />
     )
     const card = await screen.findByTestId('rich-card')
+    // eslint-disable-next-line local/no-style-only-assertion -- MES-1349: not reserving the fixed box is the contract; jsdom has no layout to observe it.
     expect(card.className).not.toContain('h-[250px]')
   })
 
@@ -209,43 +208,14 @@ describe('RichCard', () => {
         ]}
       />
     )
-    // Secondary labels render inside a truncating span, so resolve the anchor/
-    // button from the label node.
-    const link = (await screen.findByText('Shop now')).closest('a')
-    expect(link).not.toBeNull()
+    const link = await screen.findByRole('link', { name: 'Shop now' })
     expect(link).toHaveAttribute('href', 'https://tr.ee/x')
     expect(link).toHaveAttribute('target', '_blank')
 
-    const button = screen.getByText('Set up').closest('button')
-    expect(button).not.toBeNull()
-    fireEvent.click(button as HTMLButtonElement)
+    fireEvent.click(screen.getByRole('button', { name: 'Set up' }))
     expect(onClick).toHaveBeenCalledTimes(1)
   })
 
-  it('stacks a primary footer full-width and lays a secondary footer inline', async () => {
-    const { rerender } = renderWithProviders(
-      <RichCard.Received
-        title="Card"
-        images={[HERO]}
-        actions={[{ label: 'Set up welcome message', variant: 'primary' }]}
-      />
-    )
-    // Primary → stacked, full-width button.
-    expect(await screen.findByText('Set up welcome message')).toHaveClass(
-      'w-full'
-    )
-
-    rerender(
-      <RichCard.Received
-        title="Card"
-        images={[HERO]}
-        actions={[{ label: 'Shop now', href: 'tr.ee/x', variant: 'secondary' }]}
-      />
-    )
-    // Secondary → inline, content-width button (no w-full).
-    expect(screen.getByText('Shop now').closest('a')).not.toHaveClass('w-full')
-  })
-
   it('lays a secondary chin out as a row: copy left, action right', async () => {
     const { rerender } = renderWithProviders(
       <RichCard.Received
@@ -255,11 +225,10 @@ describe('RichCard', () => {
         actions={[{ label: 'Open', href: 'tr.ee/c', variant: 'secondary' }]}
       />
     )
-    // The action shares one justify-between row with the title/subtitle copy.
-    const link = await screen.findByText('Open')
-    const row = link.closest('.justify-between')
-    expect(row).not.toBeNull()
-    expect(row?.textContent).toContain('Test collection')
+    // The action shares one row with the title/subtitle copy.
+    const row = await screen.findByTestId('rich-card-chin-row')
+    expect(row).toContainElement(screen.getByRole('link', { name: 'Open' }))
+    expect(row).toHaveTextContent('Test collection')
 
     // Primary stays stacked below the copy — no chin row.
     rerender(
@@ -269,6 +238,7 @@ describe('RichCard', () => {
         actions={[{ label: 'Set up', variant: 'primary' }]}
       />
     )
-    expect(screen.getByText('Set up').closest('.justify-between')).toBeNull()
+    expect(screen.getByText('Set up')).toBeInTheDocument()
+    expect(screen.queryByTestId('rich-card-chin-row')).not.toBeInTheDocument()
   })
 })

package/src/components/RichCard/RichCardBody.tsx

@@ -151,7 +151,10 @@ const RichCardBody: React.FC<RichCardBodyProps> = ({
   return (
     <div className="shrink-0 px-4 py-3">
       {inline ? (
-        <div className="flex items-center justify-between gap-3">
+        <div
+          data-testid="rich-card-chin-row"
+          className="flex items-center justify-between gap-3"
+        >
           {textBlock}
           <RichCardFooter surface={ctaSurface} actions={actions} layout="row" />
         </div>

package/src/hooks/useChannelModerationActions.ts

@@ -175,58 +175,43 @@ export const useChannelModerationActions = ({
     }
   }
 
-  const handleBlockUser = async () => {
+  const makeModerationAction = (kind: 'block' | 'unblock') => async () => {
     if (isUpdatingBlockStatus || !service) return
 
     // Fire analytics callback before action
     onBlockParticipantClick?.()
 
+    const userId = participant?.user?.id
     if (debug) {
-      console.log(`[${logLabel}] Block member`, participant?.user?.id)
+      console.log(
+        `[${logLabel}] ${kind === 'block' ? 'Block' : 'Unblock'} member`,
+        userId
+      )
     }
     setIsUpdatingBlockStatus(true)
 
     try {
-      await service.blockUser(participant?.user?.id)
-
-      if (onBlockParticipant) {
-        await onBlockParticipant(participant?.user?.id)
+      if (kind === 'block') {
+        await service.blockUser(userId)
+      } else {
+        await service.unBlockUser(userId)
       }
 
-      onActionComplete?.()
-    } catch (error) {
-      console.error(`[${logLabel}] Failed to block member`, error)
-    } finally {
-      setIsUpdatingBlockStatus(false)
-    }
-  }
-
-  const handleUnblockUser = async () => {
-    if (isUpdatingBlockStatus || !service) return
-
-    // Fire analytics callback before action
-    onBlockParticipantClick?.()
-
-    if (debug) {
-      console.log(`[${logLabel}] Unblock member`, participant?.user?.id)
-    }
-    setIsUpdatingBlockStatus(true)
-
-    try {
-      await service.unBlockUser(participant?.user?.id)
-
       if (onBlockParticipant) {
-        await onBlockParticipant(participant?.user?.id)
+        await onBlockParticipant(userId)
       }
 
       onActionComplete?.()
     } catch (error) {
-      console.error(`[${logLabel}] Failed to unblock member`, error)
+      console.error(`[${logLabel}] Failed to ${kind} member`, error)
     } finally {
       setIsUpdatingBlockStatus(false)
     }
   }
 
+  const handleBlockUser = makeModerationAction('block')
+  const handleUnblockUser = makeModerationAction('unblock')
+
   const handleReportUser = () => {
     // Fire analytics callback before action
     onReportParticipantClick?.()

package/src/logging/index.test.tsx

@@ -22,6 +22,7 @@ const ErrorEmitter: React.FC<{ error: Error }> = ({ error }) => {
 /** Emits one line at every level so partial-sink fallback is observable. */
 const AllLevelsEmitter: React.FC = () => {
   const logger = useMessagingLogger()
+  // eslint-disable-next-line testing-library/no-debugging-utils -- this is the messaging logger's debug level, not screen.debug()
   logger.debug('debug line', 1)
   logger.info('info line', 2)
   logger.warn('warn line', 3)

package/src/providers/MessagingProvider.test.tsx

@@ -157,21 +157,20 @@ describe('MessagingProvider', () => {
     // Re-render with a NEW inline serviceConfig object (same apiKey). The
     // service is created once per client lifetime, so a serviceConfig change
     // neither recreates the service nor tears down the live connection.
-    await act(async () => {
-      rerender(
-        <MessagingProvider
-          apiKey="mock-api-key"
-          user={user}
-          serviceConfig={{
-            fetchToken: async () => 'token',
-            createChannel: async () => ({ channelId: 'ch-2' }),
-          }}
-        >
-          <div />
-        </MessagingProvider>
-      )
-    })
+    rerender(
+      <MessagingProvider
+        apiKey="mock-api-key"
+        user={user}
+        serviceConfig={{
+          fetchToken: async () => 'token',
+          createChannel: async () => ({ channelId: 'ch-2' }),
+        }}
+      >
+        <div />
+      </MessagingProvider>
+    )
 
+    await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(1))
     expect(disconnectUser).not.toHaveBeenCalled()
   })
 
@@ -203,19 +202,18 @@ describe('MessagingProvider', () => {
     // Toggling `debug` changes the internal debugLog identity. The client
     // cleanup must stay keyed on the client's lifetime, not on debugLog, so the
     // live connection is not torn down for a logging change.
-    await act(async () => {
-      rerender(
-        <MessagingProvider
-          apiKey="mock-api-key"
-          user={user}
-          serviceConfig={serviceConfig}
-          debug={true}
-        >
-          <div />
-        </MessagingProvider>
-      )
-    })
+    rerender(
+      <MessagingProvider
+        apiKey="mock-api-key"
+        user={user}
+        serviceConfig={serviceConfig}
+        debug={true}
+      >
+        <div />
+      </MessagingProvider>
+    )
 
+    await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(1))
     expect(disconnectUser).not.toHaveBeenCalled()
   })
 
@@ -246,21 +244,19 @@ describe('MessagingProvider', () => {
     await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(1))
     expect(connectUser).toHaveBeenLastCalledWith(guestUser)
 
-    await act(async () => {
-      rerender(
-        <MessagingProvider
-          key="authed"
-          apiKey="mock-api-key"
-          user={authedUser}
-          serviceConfig={{
-            fetchToken: async () => 'token',
-            createChannel: async () => ({ channelId: 'ch-1' }),
-          }}
-        >
-          <div />
-        </MessagingProvider>
-      )
-    })
+    rerender(
+      <MessagingProvider
+        key="authed"
+        apiKey="mock-api-key"
+        user={authedUser}
+        serviceConfig={{
+          fetchToken: async () => 'token',
+          createChannel: async () => ({ channelId: 'ch-1' }),
+        }}
+      >
+        <div />
+      </MessagingProvider>
+    )
 
     await waitFor(() => expect(disconnectUser).toHaveBeenCalled())
     await waitFor(() => expect(connectUser).toHaveBeenCalledTimes(2))

package/dist/AttachmentCard-BqwWgqvi.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AttachmentCard-BqwWgqvi.js","names":[],"sources":["../src/utils/cdnImageUrl.ts","../src/utils/nativeMediaPlayers.ts","../src/components/AttachmentCard/utils/mimeType.ts","../src/components/AttachmentCard/utils/icons.ts","../src/utils/isDevBuild.ts","../src/components/AttachmentCard/MediaPlayer.tsx","../src/components/AttachmentCard/Thumbnail.tsx"],"sourcesContent":["const LINKTREE_CDN_HOSTS = ['linktr.ee']\n\nconst ATTACHMENT_IMAGE_SIZE_PRESET = 'messaging-attachment-v1_0'\n\nfunction hostnameFromUrl(url: string): string | null {\n  try {\n    return new URL(url).hostname.toLowerCase()\n  } catch {\n    return null\n  }\n}\n\nfunction isLinktreeCdnHost(hostname: string): boolean {\n  return LINKTREE_CDN_HOSTS.some(\n    (host) => hostname === host || hostname.endsWith(`.${host}`)\n  )\n}\n\nexport function optimizeMessagingAttachmentUrl(\n  url: string | undefined | null\n): string | undefined {\n  const trimmed = url?.trim()\n  if (!trimmed) return undefined\n\n  const hostname = hostnameFromUrl(trimmed)\n  if (!hostname || !isLinktreeCdnHost(hostname)) return trimmed\n\n  const parsedUrl = new URL(trimmed)\n  const isAlreadyMessagingOptimized =\n    parsedUrl.searchParams.get('io') === 'true' &&\n    parsedUrl.searchParams.get('size') === ATTACHMENT_IMAGE_SIZE_PRESET\n\n  if (isAlreadyMessagingOptimized) {\n    return trimmed\n  }\n\n  parsedUrl.searchParams.set('io', 'true')\n  parsedUrl.searchParams.set('size', ATTACHMENT_IMAGE_SIZE_PRESET)\n\n  return parsedUrl.toString()\n}\n","/**\n * Attribute marking every native `<audio>` / `<video>` the toolkit\n * renders on a message surface, so opening one player can silence the\n * others.\n *\n * stream-chat-react's `AudioPlayerPool` — what `useActiveAudioPlayer()`\n * reads — only knows the players *it* mounts, i.e. voice recordings.\n * Everything the toolkit draws itself is a plain native element that\n * never registers there: `MessageAttachment.Audio`, a playable\n * `LinkAttachment` card, and `AttachmentCard`'s `MediaPlayer`. Pausing\n * the pool alone therefore left thread audio sounding underneath an\n * opened video viewer on the production `StreamAttachmentMessage` path,\n * which is exactly the surface the mutual exclusion exists for\n * (MES-1353).\n */\nexport const NATIVE_PLAYER_ATTRIBUTE = 'data-mes-native-player'\n\n/**\n * Spread onto a native player element to enrol it. Keyed off the\n * constant so the marker and the query below can't drift apart.\n */\nexport const nativePlayerProps = { [NATIVE_PLAYER_ATTRIBUTE]: '' } as const\n\n/**\n * Pauses every enrolled player except `except`.\n *\n * No `paused` check: pausing an already-paused element is a no-op per\n * spec, and reading `paused` first would only add a branch that jsdom\n * answers differently from a browser.\n */\nexport const pauseNativeMediaPlayers = (\n  except?: HTMLMediaElement | null\n): void => {\n  if (typeof document === 'undefined') return\n\n  document\n    .querySelectorAll<HTMLMediaElement>(`[${NATIVE_PLAYER_ATTRIBUTE}]`)\n    .forEach((player) => {\n      if (player !== except) player.pause()\n    })\n}\n","export type AttachmentSourceType = 'image' | 'audio' | 'video' | 'document'\n\nexport type DocumentIconType =\n  | 'pdf'\n  | 'doc'\n  | 'xls'\n  | 'csv'\n  | 'ppt'\n  | 'zip'\n  | 'text'\n  | 'markdown'\n  | 'generic'\n\nconst DOCUMENT_ICON_PATTERNS: Array<[RegExp, DocumentIconType]> = [\n  [/pdf/, 'pdf'],\n  [/wordprocessingml|msword|\\.doc/, 'doc'],\n  [/spreadsheetml|ms-excel|\\.xls/, 'xls'],\n  [/csv/, 'csv'],\n  [/presentationml|ms-powerpoint|\\.ppt/, 'ppt'],\n  [/zip|x-rar|x-7z|x-tar|x-gzip/, 'zip'],\n  [/plain|rtf/, 'text'],\n  [/markdown/, 'markdown'],\n]\n\nexport function getSourceType(mimeType: string): AttachmentSourceType {\n  if (mimeType.startsWith('video/')) return 'video'\n  if (mimeType.startsWith('audio/')) return 'audio'\n  if (mimeType.startsWith('image/')) return 'image'\n  return 'document'\n}\n\nexport function getDocumentIconType(mimeType: string): DocumentIconType {\n  const match = DOCUMENT_ICON_PATTERNS.find(([pattern]) =>\n    pattern.test(mimeType)\n  )\n  return match ? match[1] : 'generic'\n}\n","import {\n  FileIcon,\n  FileCsvIcon,\n  FileDocIcon,\n  FileMdIcon,\n  FilePdfIcon,\n  FilePptIcon,\n  FileTextIcon,\n  FileXlsIcon,\n  FileZipIcon,\n  ImageIcon,\n  SpeakerHighIcon,\n  VideoCameraIcon,\n  IconProps,\n} from '@phosphor-icons/react'\nimport React from 'react'\n\nimport { getDocumentIconType, getSourceType } from './mimeType'\nimport type { AttachmentSourceType } from './mimeType'\n\nconst MEDIA_TYPE_ICON: Record<AttachmentSourceType, React.ElementType> = {\n  video: VideoCameraIcon,\n  audio: SpeakerHighIcon,\n  image: ImageIcon,\n  document: FileIcon,\n}\n\nconst DOCUMENT_ICON_COMPONENT = {\n  pdf: FilePdfIcon,\n  doc: FileDocIcon,\n  xls: FileXlsIcon,\n  csv: FileCsvIcon,\n  ppt: FilePptIcon,\n  zip: FileZipIcon,\n  text: FileTextIcon,\n  markdown: FileMdIcon,\n  generic: FileIcon,\n} as const\n\nfunction getTypeIcon(mimeType: string): React.ElementType {\n  const sourceType = getSourceType(mimeType)\n  if (sourceType !== 'document') return MEDIA_TYPE_ICON[sourceType]\n  return DOCUMENT_ICON_COMPONENT[getDocumentIconType(mimeType)]\n}\n\n/** Use instead of `<TypeIcon />` where TypeIcon = getTypeIcon(mime) to satisfy react-hooks/static-components. */\nexport function renderTypeIcon(\n  mimeType: string,\n  props: IconProps\n): React.ReactElement {\n  return React.createElement(getTypeIcon(mimeType), props)\n}\n","/**\n * True in Vite dev builds (`import.meta.env.DEV`). Uses a type assertion so\n * `tsc` does not rely on ambient `ImportMeta` merging (vite/client).\n */\nexport function isDevBuild(): boolean {\n  return (\n    typeof import.meta !== 'undefined' &&\n    (import.meta as unknown as { env?: { DEV?: boolean } }).env?.DEV === true\n  )\n}\n","import { CircleNotchIcon, PauseIcon, PlayIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { isDevBuild } from '../../utils/isDevBuild'\nimport { nativePlayerProps } from '../../utils/nativeMediaPlayers'\n\nimport { renderTypeIcon } from './utils/icons'\nimport { getSourceType } from './utils/mimeType'\n\ntype TouchEventUnion =\n  MouseEvent | TouchEvent | React.MouseEvent | React.TouchEvent\n\nconst getClientXFromEvent = (e: TouchEventUnion): number => {\n  if ('touches' in e) {\n    return e.touches[0]?.clientX ?? e.changedTouches[0]?.clientX ?? 0\n  }\n  return e.clientX\n}\n\nexport interface MediaPlayerProps {\n  source: string\n  mimeType: string\n  poster?: string\n  autoPlay?: boolean\n  /** Controlled playing state. When provided, syncs to internal play/pause. */\n  playing?: boolean\n  loop?: boolean\n  controls?: boolean\n  showProgress?: boolean\n  /** When true, requests muted playback (helps autoplay policies on video). */\n  muted?: boolean\n  /**\n   * When provided, overrides the default click-to-play-toggle behaviour on the\n   * player container. The play/pause button (which calls stopPropagation) is\n   * unaffected, so inline playback still works.\n   */\n  onContainerClick?: (e: React.MouseEvent) => void\n}\n\nconst MediaPlayer: React.FC<MediaPlayerProps> = ({\n  source,\n  mimeType,\n  poster,\n  autoPlay = false,\n  playing: playingProp,\n  loop = false,\n  controls = true,\n  showProgress = false,\n  muted = false,\n  onContainerClick,\n}) => {\n  // --- Derived ---\n  const sourceType = getSourceType(mimeType)\n\n  // --- Refs ---\n  const playerRef = useRef<HTMLMediaElement>(null)\n  const trackRef = useRef<HTMLDivElement>(null)\n  const rafRef = useRef<number | null>(null)\n  const prevPlayingPropRef = useRef(playingProp)\n\n  // --- State: playback ---\n  const [playing, setPlaying] = useState(autoPlay)\n  const [played, setPlayed] = useState(0)\n  const [seeking, setSeeking] = useState(false)\n\n  // --- State: UI ---\n  const [scrubberHovered, setScrubberHovered] = useState(false)\n  /** Set when autoplay/play() was rejected so user can start via gesture (no controls UI). */\n  const [manualPlayRequired, setManualPlayRequired] = useState(false)\n\n  // --- State: loading ---\n  const [buffering, setBuffering] = useState(false)\n  /** True until the first canPlay fires for the current source — hides controls/spinner behind poster. */\n  const [initialLoad, setInitialLoad] = useState(true)\n  const [videoAspect, setVideoAspect] = useState<number | null>(null)\n\n  // --- Callbacks ---\n  const startPlaybackFromGesture = useCallback(() => {\n    setManualPlayRequired(false)\n    setPlaying(true)\n  }, [])\n\n  const getFraction = useCallback((e: TouchEventUnion) => {\n    const track = trackRef.current\n    if (!track) return 0\n    const rect = track.getBoundingClientRect()\n    return Math.max(\n      0,\n      Math.min(1, (getClientXFromEvent(e) - rect.left) / rect.width)\n    )\n  }, [])\n\n  const seekTo = useCallback((fraction: number) => {\n    const el = playerRef.current\n    if (el && el.duration) el.currentTime = fraction * el.duration\n  }, [])\n\n  const handleTrackPointerDown = (\n    e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>\n  ) => {\n    e.stopPropagation()\n    setSeeking(true)\n    const fraction = getFraction(e)\n    setPlayed(fraction)\n    seekTo(fraction)\n  }\n\n  const handleScrubberKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLDivElement>) => {\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    [seekTo, played]\n  )\n\n  // --- Effects ---\n\n  // Sync controlled playing prop to internal state\n  useEffect(() => {\n    if (\n      playingProp !== undefined &&\n      playingProp !== prevPlayingPropRef.current\n    ) {\n      prevPlayingPropRef.current = playingProp\n      setPlaying(playingProp)\n    }\n  }, [playingProp])\n\n  // RAF-driven progress updates\n  useEffect(() => {\n    if (!playing) {\n      if (rafRef.current !== null) {\n        cancelAnimationFrame(rafRef.current)\n        rafRef.current = null\n      }\n      return\n    }\n    const tick = () => {\n      const el = playerRef.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  // ReactPlayer v3 uses native HTML media elements and does not support a\n  // declarative `playing` prop — playback must be driven imperatively.\n  useEffect(() => {\n    const el = playerRef.current\n    if (!el) return\n    if (playing) {\n      void el.play().catch((err) => {\n        setPlaying(false)\n        setManualPlayRequired(true)\n        if (isDevBuild()) {\n          console.debug('[MediaPlayer] play() failed', err)\n        }\n      })\n    } else {\n      el.pause()\n    }\n  }, [playing])\n\n  // Global seeking listeners\n  useEffect(() => {\n    if (!seeking) return\n    const onMove = (e: MouseEvent | TouchEvent) => setPlayed(getFraction(e))\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  // --- Derived render values ---\n  // Use natural aspect ratio once metadata loads, fall back to 16:9 before then.\n  const aspectStyle = videoAspect\n    ? { aspectRatio: String(videoAspect) }\n    : undefined\n  const aspectClass = !videoAspect ? ' aspect-video' : ''\n  const scrubberPercent = Math.round(played * 100)\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={0}\n      className={`relative cursor-pointer overflow-hidden bg-black ${aspectClass}`}\n      style={aspectStyle}\n      onClick={(e) => {\n        if (onContainerClick) {\n          onContainerClick(e)\n          return\n        }\n        if (manualPlayRequired) return\n        if (controls) setPlaying((p) => !p)\n      }}\n      onKeyDown={(e) => {\n        if (e.key !== 'Enter' && e.key !== ' ') return\n        e.preventDefault()\n        if (onContainerClick) {\n          onContainerClick(e as unknown as React.MouseEvent)\n          return\n        }\n        if (manualPlayRequired) return\n        if (controls) setPlaying((p) => !p)\n      }}\n    >\n      {/* For audio, poster persists as a visual background. For video, hide once loaded. */}\n      {poster && (sourceType === 'audio' || initialLoad) && (\n        <img\n          src={poster}\n          alt=\"\"\n          className=\"absolute inset-0 h-full w-full object-cover\"\n        />\n      )}\n      {!poster && (sourceType === 'audio' || initialLoad) && (\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=\"absolute inset-0\">\n        {sourceType === 'audio' ? (\n          <audio\n            {...nativePlayerProps}\n            ref={playerRef as React.RefObject<HTMLAudioElement>}\n            src={source}\n            loop={loop}\n            muted={muted}\n            style={{ width: '100%', height: '100%' }}\n            onLoadStart={() => setBuffering(true)}\n            onCanPlay={() => {\n              setBuffering(false)\n              setInitialLoad(false)\n            }}\n            onWaiting={() => setBuffering(true)}\n            onPlay={() => setManualPlayRequired(false)}\n            onEnded={() => {\n              if (!loop) {\n                setPlaying(false)\n                setPlayed(0)\n              }\n            }}\n          >\n            <track kind=\"captions\" />\n          </audio>\n        ) : (\n          <video\n            ref={playerRef as React.RefObject<HTMLVideoElement>}\n            src={source}\n            loop={loop}\n            muted={muted}\n            playsInline\n            style={{ width: '100%', height: '100%' }}\n            onLoadStart={() => setBuffering(true)}\n            onCanPlay={() => {\n              setBuffering(false)\n              setInitialLoad(false)\n            }}\n            onWaiting={() => setBuffering(true)}\n            onPlay={() => setManualPlayRequired(false)}\n            onLoadedMetadata={() => {\n              const el = playerRef.current\n              if (\n                el instanceof HTMLVideoElement &&\n                el.videoWidth &&\n                el.videoHeight\n              ) {\n                setVideoAspect(el.videoWidth / el.videoHeight)\n              }\n            }}\n            onEnded={() => {\n              if (!loop) {\n                setPlaying(false)\n                setPlayed(0)\n              }\n            }}\n          >\n            <track kind=\"captions\" />\n          </video>\n        )}\n      </div>\n\n      {buffering && !manualPlayRequired && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center\">\n          <CircleNotchIcon\n            className=\"size-8 animate-spin text-white/80\"\n            weight=\"bold\"\n          />\n        </div>\n      )}\n\n      {manualPlayRequired && !controls && (\n        <div\n          className=\"absolute inset-0 z-30 flex cursor-pointer items-center justify-center bg-black/35\"\n          role=\"button\"\n          tabIndex={0}\n          aria-label=\"Play preview\"\n          onClick={(e) => {\n            e.stopPropagation()\n            startPlaybackFromGesture()\n          }}\n          onKeyDown={(e) => {\n            if (e.key !== 'Enter' && e.key !== ' ') return\n            e.preventDefault()\n            e.stopPropagation()\n            startPlaybackFromGesture()\n          }}\n        >\n          <span className=\"flex size-16 items-center justify-center rounded-full bg-white/20 text-white backdrop-blur-sm\">\n            <PlayIcon className=\"size-9 translate-x-0.5\" weight=\"fill\" />\n          </span>\n        </div>\n      )}\n\n      {showProgress && !controls && (\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            role=\"slider\"\n            aria-label=\"Playback position\"\n            aria-valuenow={scrubberPercent}\n            aria-valuemin={0}\n            aria-valuemax={100}\n            tabIndex={0}\n            ref={trackRef}\n            className=\"relative flex h-4 w-full cursor-pointer items-center\"\n            onMouseDown={handleTrackPointerDown}\n            onTouchStart={handleTrackPointerDown}\n            onClick={(e) => e.stopPropagation()}\n            onKeyDown={handleScrubberKeyDown}\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: `${scrubberPercent}%` }}\n              />\n            </div>\n          </div>\n        </div>\n      )}\n\n      {controls && (\n        <div className=\"absolute inset-x-0 bottom-0 flex items-center gap-2 bg-gradient-to-t from-black/60 to-transparent px-3 pb-2.5 pt-6 transition-all duration-200\">\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation()\n              setPlaying((p) => !p)\n            }}\n            className=\"shrink-0 text-white\"\n            aria-label={playing ? 'Pause' : 'Play'}\n          >\n            {playing ? (\n              <PauseIcon className=\"size-5\" weight=\"fill\" />\n            ) : (\n              <PlayIcon className=\"size-5 translate-x-px\" weight=\"fill\" />\n            )}\n          </button>\n\n          <div\n            role=\"slider\"\n            aria-label=\"Playback position\"\n            aria-valuenow={scrubberPercent}\n            aria-valuemin={0}\n            aria-valuemax={100}\n            tabIndex={0}\n            ref={trackRef}\n            className=\"relative flex h-4 w-full cursor-pointer items-center\"\n            onMouseDown={handleTrackPointerDown}\n            onTouchStart={handleTrackPointerDown}\n            onClick={(e) => e.stopPropagation()}\n            onMouseEnter={() => setScrubberHovered(true)}\n            onMouseLeave={() => setScrubberHovered(false)}\n            onKeyDown={handleScrubberKeyDown}\n          >\n            <div\n              className={`w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${scrubberHovered || seeking ? 'h-1.5' : 'h-1'}`}\n            >\n              <div\n                className=\"h-full rounded-full bg-white\"\n                style={{ width: `${scrubberPercent}%` }}\n              />\n            </div>\n            <div\n              className={`absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${scrubberHovered || seeking ? 'scale-100 opacity-100' : 'scale-0 opacity-0'}`}\n              style={{ left: `${scrubberPercent}%` }}\n            />\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default MediaPlayer\n","import React, { useState } from 'react'\n\nimport { optimizeMessagingAttachmentUrl } from '../../utils/cdnImageUrl'\n\nimport MediaPlayer, { type MediaPlayerProps } from './MediaPlayer'\nimport { renderTypeIcon } from './utils/icons'\nimport { getSourceType } from './utils/mimeType'\n\nexport type AttachmentThumbnailVariant = 'light' | 'dark'\n\nexport interface AttachmentThumbnailProps {\n  mimeType: string\n  sourceUrl?: string\n  thumbnailUrl?: string\n  title?: string\n  variant: AttachmentThumbnailVariant\n  /** Extra props passed to MediaPlayer when source is video or audio. */\n  mediaPlayerProps?: Partial<\n    Pick<\n      MediaPlayerProps,\n      'autoPlay' | 'loop' | 'muted' | 'controls' | 'onContainerClick'\n    >\n  >\n  /**\n   * When true (Visitor unlocked image/document), use aspect-video + object-contain fade-in.\n   */\n  containedImage?: boolean\n}\n\nconst placeholderIconClass = (variant: AttachmentThumbnailVariant) =>\n  variant === 'dark' ? 'size-12 text-white/20' : 'size-12 text-black/20'\n\nconst posterShellClass = (variant: AttachmentThumbnailVariant) =>\n  variant === 'dark'\n    ? 'aspect-video overflow-hidden bg-white/10'\n    : 'aspect-video overflow-hidden bg-black/5'\n\n/**\n * Renders the media preview area for attachment cards (LockedAttachment, MediaMessage).\n * Overlays (dim, lock, eye toggle) are composed by the parent.\n */\nconst AttachmentThumbnail: React.FC<AttachmentThumbnailProps> = ({\n  mimeType,\n  sourceUrl,\n  thumbnailUrl,\n  title,\n  variant,\n  mediaPlayerProps,\n  containedImage = false,\n}) => {\n  const sourceType = getSourceType(mimeType)\n  const [sourceReady, setSourceReady] = useState(false)\n  const optimizedSourceUrl = optimizeMessagingAttachmentUrl(sourceUrl)\n  const optimizedThumbnailUrl = optimizeMessagingAttachmentUrl(thumbnailUrl)\n\n  if (sourceUrl && (sourceType === 'video' || sourceType === 'audio')) {\n    return (\n      <MediaPlayer\n        source={sourceUrl}\n        mimeType={mimeType}\n        poster={optimizedThumbnailUrl}\n        controls\n        {...mediaPlayerProps}\n      />\n    )\n  }\n\n  if (sourceUrl && sourceType === 'image') {\n    if (containedImage) {\n      return (\n        <div className={`relative ${posterShellClass(variant)}`}>\n          <img\n            src={optimizedSourceUrl ?? sourceUrl}\n            alt={title ?? ''}\n            className={`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${sourceReady ? 'opacity-100' : 'opacity-0'}`}\n            draggable={false}\n            onLoad={() => setSourceReady(true)}\n          />\n        </div>\n      )\n    }\n    return (\n      <img\n        src={optimizedSourceUrl ?? sourceUrl}\n        alt={title ?? ''}\n        className=\"block w-full\"\n        draggable={false}\n      />\n    )\n  }\n\n  if (sourceUrl && sourceType === 'document') {\n    if (thumbnailUrl) {\n      if (containedImage) {\n        return (\n          <div className={`relative ${posterShellClass(variant)}`}>\n            <img\n              src={optimizedThumbnailUrl ?? thumbnailUrl}\n              alt={title ?? ''}\n              className={`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${sourceReady ? 'opacity-100' : 'opacity-0'}`}\n              draggable={false}\n              onLoad={() => setSourceReady(true)}\n            />\n          </div>\n        )\n      }\n      return (\n        <img\n          src={optimizedThumbnailUrl ?? thumbnailUrl}\n          alt=\"\"\n          className=\"block w-full\"\n          draggable={false}\n        />\n      )\n    }\n    return (\n      <div\n        className={`flex aspect-video w-full items-center justify-center ${variant === 'dark' ? 'bg-white/10' : 'bg-black/5'}`}\n      >\n        {renderTypeIcon(mimeType, {\n          className: placeholderIconClass(variant),\n          weight: 'regular',\n        })}\n      </div>\n    )\n  }\n\n  // Poster-only or empty (no sourceUrl)\n  if (thumbnailUrl) {\n    return (\n      <div className={`relative ${posterShellClass(variant)}`}>\n        <img\n          src={optimizedThumbnailUrl ?? thumbnailUrl}\n          alt={title ?? ''}\n          draggable={false}\n          className=\"absolute inset-0 h-full w-full object-cover\"\n        />\n      </div>\n    )\n  }\n\n  return (\n    <div\n      className={`flex aspect-video w-full items-center justify-center ${variant === 'dark' ? 'bg-white/10' : 'bg-black/5'}`}\n    >\n      {renderTypeIcon(mimeType, {\n        className: placeholderIconClass(variant),\n        weight: 'regular',\n      })}\n    </div>\n  )\n}\n\nexport default AttachmentThumbnail\n"],"mappings":"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"}

package/dist/AttachmentCard-DUrgGRsq.cjs

@@ -1,2 +0,0 @@
-const e=require("./rolldown-runtime-BocRIvOZ.cjs");let t=require("react");t=e.t(t,1);let n=require("react/jsx-runtime"),r=require("classnames");r=e.t(r,1);let i=require("@phosphor-icons/react");var a=[`linktr.ee`],o=`messaging-attachment-v1_0`;function s(e){try{return new URL(e).hostname.toLowerCase()}catch{return null}}function c(e){return a.some(t=>e===t||e.endsWith(`.${t}`))}function l(e){let t=e?.trim();if(!t)return;let n=s(t);if(!n||!c(n))return t;let r=new URL(t);return r.searchParams.get(`io`)===`true`&&r.searchParams.get(`size`)===o?t:(r.searchParams.set(`io`,`true`),r.searchParams.set(`size`,o),r.toString())}var u=`data-mes-native-player`,d={[u]:``},f=e=>{typeof document>`u`||document.querySelectorAll(`[${u}]`).forEach(t=>{t!==e&&t.pause()})},p=[[/pdf/,`pdf`],[/wordprocessingml|msword|\.doc/,`doc`],[/spreadsheetml|ms-excel|\.xls/,`xls`],[/csv/,`csv`],[/presentationml|ms-powerpoint|\.ppt/,`ppt`],[/zip|x-rar|x-7z|x-tar|x-gzip/,`zip`],[/plain|rtf/,`text`],[/markdown/,`markdown`]];function m(e){return e.startsWith(`video/`)?`video`:e.startsWith(`audio/`)?`audio`:e.startsWith(`image/`)?`image`:`document`}function h(e){let t=p.find(([t])=>t.test(e));return t?t[1]:`generic`}var g={video:i.VideoCameraIcon,audio:i.SpeakerHighIcon,image:i.ImageIcon,document:i.FileIcon},_={pdf:i.FilePdfIcon,doc:i.FileDocIcon,xls:i.FileXlsIcon,csv:i.FileCsvIcon,ppt:i.FilePptIcon,zip:i.FileZipIcon,text:i.FileTextIcon,markdown:i.FileMdIcon,generic:i.FileIcon};function v(e){let t=m(e);return t===`document`?_[h(e)]:g[t]}function y(e,n){return t.default.createElement(v(e),n)}function b(){return!1}var x=e=>`touches`in e?e.touches[0]?.clientX??e.changedTouches[0]?.clientX??0:e.clientX,S=({source:e,mimeType:r,poster:a,autoPlay:o=!1,playing:s,loop:c=!1,controls:l=!0,showProgress:u=!1,muted:f=!1,onContainerClick:p})=>{let h=m(r),g=(0,t.useRef)(null),_=(0,t.useRef)(null),v=(0,t.useRef)(null),S=(0,t.useRef)(s),[C,w]=(0,t.useState)(o),[T,E]=(0,t.useState)(0),[D,O]=(0,t.useState)(!1),[k,A]=(0,t.useState)(!1),[j,M]=(0,t.useState)(!1),[N,P]=(0,t.useState)(!1),[F,I]=(0,t.useState)(!0),[L,R]=(0,t.useState)(null),z=(0,t.useCallback)(()=>{M(!1),w(!0)},[]),B=(0,t.useCallback)(e=>{let t=_.current;if(!t)return 0;let n=t.getBoundingClientRect();return Math.max(0,Math.min(1,(x(e)-n.left)/n.width))},[]),V=(0,t.useCallback)(e=>{let t=g.current;t&&t.duration&&(t.currentTime=e*t.duration)},[]),H=e=>{e.stopPropagation(),O(!0);let t=B(e);E(t),V(t)},U=(0,t.useCallback)(e=>{e.key===`ArrowRight`&&V(Math.min(1,T+.05)),e.key===`ArrowLeft`&&V(Math.max(0,T-.05))},[V,T]);(0,t.useEffect)(()=>{s!==void 0&&s!==S.current&&(S.current=s,w(s))},[s]),(0,t.useEffect)(()=>{if(!C){v.current!==null&&(cancelAnimationFrame(v.current),v.current=null);return}let e=()=>{let t=g.current;t&&t.duration&&!D&&E(t.currentTime/t.duration),v.current=requestAnimationFrame(e)};return v.current=requestAnimationFrame(e),()=>{v.current!==null&&cancelAnimationFrame(v.current)}},[C,D]),(0,t.useEffect)(()=>{let e=g.current;e&&(C?e.play().catch(e=>{w(!1),M(!0),b()&&console.debug(`[MediaPlayer] play() failed`,e)}):e.pause())},[C]),(0,t.useEffect)(()=>{if(!D)return;let e=e=>E(B(e)),t=e=>{O(!1),V(B(e))};return window.addEventListener(`mousemove`,e),window.addEventListener(`mouseup`,t),window.addEventListener(`touchmove`,e,{passive:!0}),window.addEventListener(`touchend`,t),()=>{window.removeEventListener(`mousemove`,e),window.removeEventListener(`mouseup`,t),window.removeEventListener(`touchmove`,e),window.removeEventListener(`touchend`,t)}},[D,B,V]);let W=L?{aspectRatio:String(L)}:void 0,G=L?``:` aspect-video`,K=Math.round(T*100);return(0,n.jsxs)(`div`,{role:`button`,tabIndex:0,className:`relative cursor-pointer overflow-hidden bg-black ${G}`,style:W,onClick:e=>{if(p){p(e);return}j||l&&w(e=>!e)},onKeyDown:e=>{if(e.key===`Enter`||e.key===` `){if(e.preventDefault(),p){p(e);return}j||l&&w(e=>!e)}},children:[a&&(h===`audio`||F)&&(0,n.jsx)(`img`,{src:a,alt:``,className:`absolute inset-0 h-full w-full object-cover`}),!a&&(h===`audio`||F)&&(0,n.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:y(r,{className:`size-12 text-black/20`,weight:`regular`})}),(0,n.jsx)(`div`,{className:`absolute inset-0`,children:h===`audio`?(0,n.jsx)(`audio`,{...d,ref:g,src:e,loop:c,muted:f,style:{width:`100%`,height:`100%`},onLoadStart:()=>P(!0),onCanPlay:()=>{P(!1),I(!1)},onWaiting:()=>P(!0),onPlay:()=>M(!1),onEnded:()=>{c||(w(!1),E(0))},children:(0,n.jsx)(`track`,{kind:`captions`})}):(0,n.jsx)(`video`,{ref:g,src:e,loop:c,muted:f,playsInline:!0,style:{width:`100%`,height:`100%`},onLoadStart:()=>P(!0),onCanPlay:()=>{P(!1),I(!1)},onWaiting:()=>P(!0),onPlay:()=>M(!1),onLoadedMetadata:()=>{let e=g.current;e instanceof HTMLVideoElement&&e.videoWidth&&e.videoHeight&&R(e.videoWidth/e.videoHeight)},onEnded:()=>{c||(w(!1),E(0))},children:(0,n.jsx)(`track`,{kind:`captions`})})}),N&&!j&&(0,n.jsx)(`div`,{className:`absolute inset-0 z-10 flex items-center justify-center`,children:(0,n.jsx)(i.CircleNotchIcon,{className:`size-8 animate-spin text-white/80`,weight:`bold`})}),j&&!l&&(0,n.jsx)(`div`,{className:`absolute inset-0 z-30 flex cursor-pointer items-center justify-center bg-black/35`,role:`button`,tabIndex:0,"aria-label":`Play preview`,onClick:e=>{e.stopPropagation(),z()},onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),e.stopPropagation(),z())},children:(0,n.jsx)(`span`,{className:`flex size-16 items-center justify-center rounded-full bg-white/20 text-white backdrop-blur-sm`,children:(0,n.jsx)(i.PlayIcon,{className:`size-9 translate-x-0.5`,weight:`fill`})})}),u&&!l&&(0,n.jsx)(`div`,{className:`absolute inset-x-0 bottom-0 px-3 pb-2.5 pt-6 bg-gradient-to-t from-black/40 to-transparent`,children:(0,n.jsx)(`div`,{role:`slider`,"aria-label":`Playback position`,"aria-valuenow":K,"aria-valuemin":0,"aria-valuemax":100,tabIndex:0,ref:_,className:`relative flex h-4 w-full cursor-pointer items-center`,onMouseDown:H,onTouchStart:H,onClick:e=>e.stopPropagation(),onKeyDown:U,children:(0,n.jsx)(`div`,{className:`w-full overflow-hidden rounded-full bg-white/30 h-1`,children:(0,n.jsx)(`div`,{className:`h-full rounded-full bg-white`,style:{width:`${K}%`}})})})}),l&&(0,n.jsxs)(`div`,{className:`absolute inset-x-0 bottom-0 flex items-center gap-2 bg-gradient-to-t from-black/60 to-transparent px-3 pb-2.5 pt-6 transition-all duration-200`,children:[(0,n.jsx)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),w(e=>!e)},className:`shrink-0 text-white`,"aria-label":C?`Pause`:`Play`,children:C?(0,n.jsx)(i.PauseIcon,{className:`size-5`,weight:`fill`}):(0,n.jsx)(i.PlayIcon,{className:`size-5 translate-x-px`,weight:`fill`})}),(0,n.jsxs)(`div`,{role:`slider`,"aria-label":`Playback position`,"aria-valuenow":K,"aria-valuemin":0,"aria-valuemax":100,tabIndex:0,ref:_,className:`relative flex h-4 w-full cursor-pointer items-center`,onMouseDown:H,onTouchStart:H,onClick:e=>e.stopPropagation(),onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1),onKeyDown:U,children:[(0,n.jsx)(`div`,{className:`w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${k||D?`h-1.5`:`h-1`}`,children:(0,n.jsx)(`div`,{className:`h-full rounded-full bg-white`,style:{width:`${K}%`}})}),(0,n.jsx)(`div`,{className:`absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${k||D?`scale-100 opacity-100`:`scale-0 opacity-0`}`,style:{left:`${K}%`}})]})]})]})},C=e=>e===`dark`?`size-12 text-white/20`:`size-12 text-black/20`,w=e=>e===`dark`?`aspect-video overflow-hidden bg-white/10`:`aspect-video overflow-hidden bg-black/5`,T=({mimeType:e,sourceUrl:r,thumbnailUrl:i,title:a,variant:o,mediaPlayerProps:s,containedImage:c=!1})=>{let u=m(e),[d,f]=(0,t.useState)(!1),p=l(r),h=l(i);return r&&(u===`video`||u===`audio`)?(0,n.jsx)(S,{source:r,mimeType:e,poster:h,controls:!0,...s}):r&&u===`image`?c?(0,n.jsx)(`div`,{className:`relative ${w(o)}`,children:(0,n.jsx)(`img`,{src:p??r,alt:a??``,className:`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${d?`opacity-100`:`opacity-0`}`,draggable:!1,onLoad:()=>f(!0)})}):(0,n.jsx)(`img`,{src:p??r,alt:a??``,className:`block w-full`,draggable:!1}):r&&u===`document`?i?c?(0,n.jsx)(`div`,{className:`relative ${w(o)}`,children:(0,n.jsx)(`img`,{src:h??i,alt:a??``,className:`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${d?`opacity-100`:`opacity-0`}`,draggable:!1,onLoad:()=>f(!0)})}):(0,n.jsx)(`img`,{src:h??i,alt:``,className:`block w-full`,draggable:!1}):(0,n.jsx)(`div`,{className:`flex aspect-video w-full items-center justify-center ${o===`dark`?`bg-white/10`:`bg-black/5`}`,children:y(e,{className:C(o),weight:`regular`})}):i?(0,n.jsx)(`div`,{className:`relative ${w(o)}`,children:(0,n.jsx)(`img`,{src:h??i,alt:a??``,draggable:!1,className:`absolute inset-0 h-full w-full object-cover`})}):(0,n.jsx)(`div`,{className:`flex aspect-video w-full items-center justify-center ${o===`dark`?`bg-white/10`:`bg-black/5`}`,children:y(e,{className:C(o),weight:`regular`})})};Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,"s",{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return T}});
-//# sourceMappingURL=AttachmentCard-DUrgGRsq.cjs.map

package/dist/AttachmentCard-DUrgGRsq.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"AttachmentCard-DUrgGRsq.cjs","names":[],"sources":["../src/utils/cdnImageUrl.ts","../src/utils/nativeMediaPlayers.ts","../src/components/AttachmentCard/utils/mimeType.ts","../src/components/AttachmentCard/utils/icons.ts","../src/utils/isDevBuild.ts","../src/components/AttachmentCard/MediaPlayer.tsx","../src/components/AttachmentCard/Thumbnail.tsx"],"sourcesContent":["const LINKTREE_CDN_HOSTS = ['linktr.ee']\n\nconst ATTACHMENT_IMAGE_SIZE_PRESET = 'messaging-attachment-v1_0'\n\nfunction hostnameFromUrl(url: string): string | null {\n  try {\n    return new URL(url).hostname.toLowerCase()\n  } catch {\n    return null\n  }\n}\n\nfunction isLinktreeCdnHost(hostname: string): boolean {\n  return LINKTREE_CDN_HOSTS.some(\n    (host) => hostname === host || hostname.endsWith(`.${host}`)\n  )\n}\n\nexport function optimizeMessagingAttachmentUrl(\n  url: string | undefined | null\n): string | undefined {\n  const trimmed = url?.trim()\n  if (!trimmed) return undefined\n\n  const hostname = hostnameFromUrl(trimmed)\n  if (!hostname || !isLinktreeCdnHost(hostname)) return trimmed\n\n  const parsedUrl = new URL(trimmed)\n  const isAlreadyMessagingOptimized =\n    parsedUrl.searchParams.get('io') === 'true' &&\n    parsedUrl.searchParams.get('size') === ATTACHMENT_IMAGE_SIZE_PRESET\n\n  if (isAlreadyMessagingOptimized) {\n    return trimmed\n  }\n\n  parsedUrl.searchParams.set('io', 'true')\n  parsedUrl.searchParams.set('size', ATTACHMENT_IMAGE_SIZE_PRESET)\n\n  return parsedUrl.toString()\n}\n","/**\n * Attribute marking every native `<audio>` / `<video>` the toolkit\n * renders on a message surface, so opening one player can silence the\n * others.\n *\n * stream-chat-react's `AudioPlayerPool` — what `useActiveAudioPlayer()`\n * reads — only knows the players *it* mounts, i.e. voice recordings.\n * Everything the toolkit draws itself is a plain native element that\n * never registers there: `MessageAttachment.Audio`, a playable\n * `LinkAttachment` card, and `AttachmentCard`'s `MediaPlayer`. Pausing\n * the pool alone therefore left thread audio sounding underneath an\n * opened video viewer on the production `StreamAttachmentMessage` path,\n * which is exactly the surface the mutual exclusion exists for\n * (MES-1353).\n */\nexport const NATIVE_PLAYER_ATTRIBUTE = 'data-mes-native-player'\n\n/**\n * Spread onto a native player element to enrol it. Keyed off the\n * constant so the marker and the query below can't drift apart.\n */\nexport const nativePlayerProps = { [NATIVE_PLAYER_ATTRIBUTE]: '' } as const\n\n/**\n * Pauses every enrolled player except `except`.\n *\n * No `paused` check: pausing an already-paused element is a no-op per\n * spec, and reading `paused` first would only add a branch that jsdom\n * answers differently from a browser.\n */\nexport const pauseNativeMediaPlayers = (\n  except?: HTMLMediaElement | null\n): void => {\n  if (typeof document === 'undefined') return\n\n  document\n    .querySelectorAll<HTMLMediaElement>(`[${NATIVE_PLAYER_ATTRIBUTE}]`)\n    .forEach((player) => {\n      if (player !== except) player.pause()\n    })\n}\n","export type AttachmentSourceType = 'image' | 'audio' | 'video' | 'document'\n\nexport type DocumentIconType =\n  | 'pdf'\n  | 'doc'\n  | 'xls'\n  | 'csv'\n  | 'ppt'\n  | 'zip'\n  | 'text'\n  | 'markdown'\n  | 'generic'\n\nconst DOCUMENT_ICON_PATTERNS: Array<[RegExp, DocumentIconType]> = [\n  [/pdf/, 'pdf'],\n  [/wordprocessingml|msword|\\.doc/, 'doc'],\n  [/spreadsheetml|ms-excel|\\.xls/, 'xls'],\n  [/csv/, 'csv'],\n  [/presentationml|ms-powerpoint|\\.ppt/, 'ppt'],\n  [/zip|x-rar|x-7z|x-tar|x-gzip/, 'zip'],\n  [/plain|rtf/, 'text'],\n  [/markdown/, 'markdown'],\n]\n\nexport function getSourceType(mimeType: string): AttachmentSourceType {\n  if (mimeType.startsWith('video/')) return 'video'\n  if (mimeType.startsWith('audio/')) return 'audio'\n  if (mimeType.startsWith('image/')) return 'image'\n  return 'document'\n}\n\nexport function getDocumentIconType(mimeType: string): DocumentIconType {\n  const match = DOCUMENT_ICON_PATTERNS.find(([pattern]) =>\n    pattern.test(mimeType)\n  )\n  return match ? match[1] : 'generic'\n}\n","import {\n  FileIcon,\n  FileCsvIcon,\n  FileDocIcon,\n  FileMdIcon,\n  FilePdfIcon,\n  FilePptIcon,\n  FileTextIcon,\n  FileXlsIcon,\n  FileZipIcon,\n  ImageIcon,\n  SpeakerHighIcon,\n  VideoCameraIcon,\n  IconProps,\n} from '@phosphor-icons/react'\nimport React from 'react'\n\nimport { getDocumentIconType, getSourceType } from './mimeType'\nimport type { AttachmentSourceType } from './mimeType'\n\nconst MEDIA_TYPE_ICON: Record<AttachmentSourceType, React.ElementType> = {\n  video: VideoCameraIcon,\n  audio: SpeakerHighIcon,\n  image: ImageIcon,\n  document: FileIcon,\n}\n\nconst DOCUMENT_ICON_COMPONENT = {\n  pdf: FilePdfIcon,\n  doc: FileDocIcon,\n  xls: FileXlsIcon,\n  csv: FileCsvIcon,\n  ppt: FilePptIcon,\n  zip: FileZipIcon,\n  text: FileTextIcon,\n  markdown: FileMdIcon,\n  generic: FileIcon,\n} as const\n\nfunction getTypeIcon(mimeType: string): React.ElementType {\n  const sourceType = getSourceType(mimeType)\n  if (sourceType !== 'document') return MEDIA_TYPE_ICON[sourceType]\n  return DOCUMENT_ICON_COMPONENT[getDocumentIconType(mimeType)]\n}\n\n/** Use instead of `<TypeIcon />` where TypeIcon = getTypeIcon(mime) to satisfy react-hooks/static-components. */\nexport function renderTypeIcon(\n  mimeType: string,\n  props: IconProps\n): React.ReactElement {\n  return React.createElement(getTypeIcon(mimeType), props)\n}\n","/**\n * True in Vite dev builds (`import.meta.env.DEV`). Uses a type assertion so\n * `tsc` does not rely on ambient `ImportMeta` merging (vite/client).\n */\nexport function isDevBuild(): boolean {\n  return (\n    typeof import.meta !== 'undefined' &&\n    (import.meta as unknown as { env?: { DEV?: boolean } }).env?.DEV === true\n  )\n}\n","import { CircleNotchIcon, PauseIcon, PlayIcon } from '@phosphor-icons/react'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { isDevBuild } from '../../utils/isDevBuild'\nimport { nativePlayerProps } from '../../utils/nativeMediaPlayers'\n\nimport { renderTypeIcon } from './utils/icons'\nimport { getSourceType } from './utils/mimeType'\n\ntype TouchEventUnion =\n  MouseEvent | TouchEvent | React.MouseEvent | React.TouchEvent\n\nconst getClientXFromEvent = (e: TouchEventUnion): number => {\n  if ('touches' in e) {\n    return e.touches[0]?.clientX ?? e.changedTouches[0]?.clientX ?? 0\n  }\n  return e.clientX\n}\n\nexport interface MediaPlayerProps {\n  source: string\n  mimeType: string\n  poster?: string\n  autoPlay?: boolean\n  /** Controlled playing state. When provided, syncs to internal play/pause. */\n  playing?: boolean\n  loop?: boolean\n  controls?: boolean\n  showProgress?: boolean\n  /** When true, requests muted playback (helps autoplay policies on video). */\n  muted?: boolean\n  /**\n   * When provided, overrides the default click-to-play-toggle behaviour on the\n   * player container. The play/pause button (which calls stopPropagation) is\n   * unaffected, so inline playback still works.\n   */\n  onContainerClick?: (e: React.MouseEvent) => void\n}\n\nconst MediaPlayer: React.FC<MediaPlayerProps> = ({\n  source,\n  mimeType,\n  poster,\n  autoPlay = false,\n  playing: playingProp,\n  loop = false,\n  controls = true,\n  showProgress = false,\n  muted = false,\n  onContainerClick,\n}) => {\n  // --- Derived ---\n  const sourceType = getSourceType(mimeType)\n\n  // --- Refs ---\n  const playerRef = useRef<HTMLMediaElement>(null)\n  const trackRef = useRef<HTMLDivElement>(null)\n  const rafRef = useRef<number | null>(null)\n  const prevPlayingPropRef = useRef(playingProp)\n\n  // --- State: playback ---\n  const [playing, setPlaying] = useState(autoPlay)\n  const [played, setPlayed] = useState(0)\n  const [seeking, setSeeking] = useState(false)\n\n  // --- State: UI ---\n  const [scrubberHovered, setScrubberHovered] = useState(false)\n  /** Set when autoplay/play() was rejected so user can start via gesture (no controls UI). */\n  const [manualPlayRequired, setManualPlayRequired] = useState(false)\n\n  // --- State: loading ---\n  const [buffering, setBuffering] = useState(false)\n  /** True until the first canPlay fires for the current source — hides controls/spinner behind poster. */\n  const [initialLoad, setInitialLoad] = useState(true)\n  const [videoAspect, setVideoAspect] = useState<number | null>(null)\n\n  // --- Callbacks ---\n  const startPlaybackFromGesture = useCallback(() => {\n    setManualPlayRequired(false)\n    setPlaying(true)\n  }, [])\n\n  const getFraction = useCallback((e: TouchEventUnion) => {\n    const track = trackRef.current\n    if (!track) return 0\n    const rect = track.getBoundingClientRect()\n    return Math.max(\n      0,\n      Math.min(1, (getClientXFromEvent(e) - rect.left) / rect.width)\n    )\n  }, [])\n\n  const seekTo = useCallback((fraction: number) => {\n    const el = playerRef.current\n    if (el && el.duration) el.currentTime = fraction * el.duration\n  }, [])\n\n  const handleTrackPointerDown = (\n    e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>\n  ) => {\n    e.stopPropagation()\n    setSeeking(true)\n    const fraction = getFraction(e)\n    setPlayed(fraction)\n    seekTo(fraction)\n  }\n\n  const handleScrubberKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLDivElement>) => {\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    [seekTo, played]\n  )\n\n  // --- Effects ---\n\n  // Sync controlled playing prop to internal state\n  useEffect(() => {\n    if (\n      playingProp !== undefined &&\n      playingProp !== prevPlayingPropRef.current\n    ) {\n      prevPlayingPropRef.current = playingProp\n      setPlaying(playingProp)\n    }\n  }, [playingProp])\n\n  // RAF-driven progress updates\n  useEffect(() => {\n    if (!playing) {\n      if (rafRef.current !== null) {\n        cancelAnimationFrame(rafRef.current)\n        rafRef.current = null\n      }\n      return\n    }\n    const tick = () => {\n      const el = playerRef.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  // ReactPlayer v3 uses native HTML media elements and does not support a\n  // declarative `playing` prop — playback must be driven imperatively.\n  useEffect(() => {\n    const el = playerRef.current\n    if (!el) return\n    if (playing) {\n      void el.play().catch((err) => {\n        setPlaying(false)\n        setManualPlayRequired(true)\n        if (isDevBuild()) {\n          console.debug('[MediaPlayer] play() failed', err)\n        }\n      })\n    } else {\n      el.pause()\n    }\n  }, [playing])\n\n  // Global seeking listeners\n  useEffect(() => {\n    if (!seeking) return\n    const onMove = (e: MouseEvent | TouchEvent) => setPlayed(getFraction(e))\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  // --- Derived render values ---\n  // Use natural aspect ratio once metadata loads, fall back to 16:9 before then.\n  const aspectStyle = videoAspect\n    ? { aspectRatio: String(videoAspect) }\n    : undefined\n  const aspectClass = !videoAspect ? ' aspect-video' : ''\n  const scrubberPercent = Math.round(played * 100)\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={0}\n      className={`relative cursor-pointer overflow-hidden bg-black ${aspectClass}`}\n      style={aspectStyle}\n      onClick={(e) => {\n        if (onContainerClick) {\n          onContainerClick(e)\n          return\n        }\n        if (manualPlayRequired) return\n        if (controls) setPlaying((p) => !p)\n      }}\n      onKeyDown={(e) => {\n        if (e.key !== 'Enter' && e.key !== ' ') return\n        e.preventDefault()\n        if (onContainerClick) {\n          onContainerClick(e as unknown as React.MouseEvent)\n          return\n        }\n        if (manualPlayRequired) return\n        if (controls) setPlaying((p) => !p)\n      }}\n    >\n      {/* For audio, poster persists as a visual background. For video, hide once loaded. */}\n      {poster && (sourceType === 'audio' || initialLoad) && (\n        <img\n          src={poster}\n          alt=\"\"\n          className=\"absolute inset-0 h-full w-full object-cover\"\n        />\n      )}\n      {!poster && (sourceType === 'audio' || initialLoad) && (\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=\"absolute inset-0\">\n        {sourceType === 'audio' ? (\n          <audio\n            {...nativePlayerProps}\n            ref={playerRef as React.RefObject<HTMLAudioElement>}\n            src={source}\n            loop={loop}\n            muted={muted}\n            style={{ width: '100%', height: '100%' }}\n            onLoadStart={() => setBuffering(true)}\n            onCanPlay={() => {\n              setBuffering(false)\n              setInitialLoad(false)\n            }}\n            onWaiting={() => setBuffering(true)}\n            onPlay={() => setManualPlayRequired(false)}\n            onEnded={() => {\n              if (!loop) {\n                setPlaying(false)\n                setPlayed(0)\n              }\n            }}\n          >\n            <track kind=\"captions\" />\n          </audio>\n        ) : (\n          <video\n            ref={playerRef as React.RefObject<HTMLVideoElement>}\n            src={source}\n            loop={loop}\n            muted={muted}\n            playsInline\n            style={{ width: '100%', height: '100%' }}\n            onLoadStart={() => setBuffering(true)}\n            onCanPlay={() => {\n              setBuffering(false)\n              setInitialLoad(false)\n            }}\n            onWaiting={() => setBuffering(true)}\n            onPlay={() => setManualPlayRequired(false)}\n            onLoadedMetadata={() => {\n              const el = playerRef.current\n              if (\n                el instanceof HTMLVideoElement &&\n                el.videoWidth &&\n                el.videoHeight\n              ) {\n                setVideoAspect(el.videoWidth / el.videoHeight)\n              }\n            }}\n            onEnded={() => {\n              if (!loop) {\n                setPlaying(false)\n                setPlayed(0)\n              }\n            }}\n          >\n            <track kind=\"captions\" />\n          </video>\n        )}\n      </div>\n\n      {buffering && !manualPlayRequired && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center\">\n          <CircleNotchIcon\n            className=\"size-8 animate-spin text-white/80\"\n            weight=\"bold\"\n          />\n        </div>\n      )}\n\n      {manualPlayRequired && !controls && (\n        <div\n          className=\"absolute inset-0 z-30 flex cursor-pointer items-center justify-center bg-black/35\"\n          role=\"button\"\n          tabIndex={0}\n          aria-label=\"Play preview\"\n          onClick={(e) => {\n            e.stopPropagation()\n            startPlaybackFromGesture()\n          }}\n          onKeyDown={(e) => {\n            if (e.key !== 'Enter' && e.key !== ' ') return\n            e.preventDefault()\n            e.stopPropagation()\n            startPlaybackFromGesture()\n          }}\n        >\n          <span className=\"flex size-16 items-center justify-center rounded-full bg-white/20 text-white backdrop-blur-sm\">\n            <PlayIcon className=\"size-9 translate-x-0.5\" weight=\"fill\" />\n          </span>\n        </div>\n      )}\n\n      {showProgress && !controls && (\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            role=\"slider\"\n            aria-label=\"Playback position\"\n            aria-valuenow={scrubberPercent}\n            aria-valuemin={0}\n            aria-valuemax={100}\n            tabIndex={0}\n            ref={trackRef}\n            className=\"relative flex h-4 w-full cursor-pointer items-center\"\n            onMouseDown={handleTrackPointerDown}\n            onTouchStart={handleTrackPointerDown}\n            onClick={(e) => e.stopPropagation()}\n            onKeyDown={handleScrubberKeyDown}\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: `${scrubberPercent}%` }}\n              />\n            </div>\n          </div>\n        </div>\n      )}\n\n      {controls && (\n        <div className=\"absolute inset-x-0 bottom-0 flex items-center gap-2 bg-gradient-to-t from-black/60 to-transparent px-3 pb-2.5 pt-6 transition-all duration-200\">\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation()\n              setPlaying((p) => !p)\n            }}\n            className=\"shrink-0 text-white\"\n            aria-label={playing ? 'Pause' : 'Play'}\n          >\n            {playing ? (\n              <PauseIcon className=\"size-5\" weight=\"fill\" />\n            ) : (\n              <PlayIcon className=\"size-5 translate-x-px\" weight=\"fill\" />\n            )}\n          </button>\n\n          <div\n            role=\"slider\"\n            aria-label=\"Playback position\"\n            aria-valuenow={scrubberPercent}\n            aria-valuemin={0}\n            aria-valuemax={100}\n            tabIndex={0}\n            ref={trackRef}\n            className=\"relative flex h-4 w-full cursor-pointer items-center\"\n            onMouseDown={handleTrackPointerDown}\n            onTouchStart={handleTrackPointerDown}\n            onClick={(e) => e.stopPropagation()}\n            onMouseEnter={() => setScrubberHovered(true)}\n            onMouseLeave={() => setScrubberHovered(false)}\n            onKeyDown={handleScrubberKeyDown}\n          >\n            <div\n              className={`w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${scrubberHovered || seeking ? 'h-1.5' : 'h-1'}`}\n            >\n              <div\n                className=\"h-full rounded-full bg-white\"\n                style={{ width: `${scrubberPercent}%` }}\n              />\n            </div>\n            <div\n              className={`absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${scrubberHovered || seeking ? 'scale-100 opacity-100' : 'scale-0 opacity-0'}`}\n              style={{ left: `${scrubberPercent}%` }}\n            />\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default MediaPlayer\n","import React, { useState } from 'react'\n\nimport { optimizeMessagingAttachmentUrl } from '../../utils/cdnImageUrl'\n\nimport MediaPlayer, { type MediaPlayerProps } from './MediaPlayer'\nimport { renderTypeIcon } from './utils/icons'\nimport { getSourceType } from './utils/mimeType'\n\nexport type AttachmentThumbnailVariant = 'light' | 'dark'\n\nexport interface AttachmentThumbnailProps {\n  mimeType: string\n  sourceUrl?: string\n  thumbnailUrl?: string\n  title?: string\n  variant: AttachmentThumbnailVariant\n  /** Extra props passed to MediaPlayer when source is video or audio. */\n  mediaPlayerProps?: Partial<\n    Pick<\n      MediaPlayerProps,\n      'autoPlay' | 'loop' | 'muted' | 'controls' | 'onContainerClick'\n    >\n  >\n  /**\n   * When true (Visitor unlocked image/document), use aspect-video + object-contain fade-in.\n   */\n  containedImage?: boolean\n}\n\nconst placeholderIconClass = (variant: AttachmentThumbnailVariant) =>\n  variant === 'dark' ? 'size-12 text-white/20' : 'size-12 text-black/20'\n\nconst posterShellClass = (variant: AttachmentThumbnailVariant) =>\n  variant === 'dark'\n    ? 'aspect-video overflow-hidden bg-white/10'\n    : 'aspect-video overflow-hidden bg-black/5'\n\n/**\n * Renders the media preview area for attachment cards (LockedAttachment, MediaMessage).\n * Overlays (dim, lock, eye toggle) are composed by the parent.\n */\nconst AttachmentThumbnail: React.FC<AttachmentThumbnailProps> = ({\n  mimeType,\n  sourceUrl,\n  thumbnailUrl,\n  title,\n  variant,\n  mediaPlayerProps,\n  containedImage = false,\n}) => {\n  const sourceType = getSourceType(mimeType)\n  const [sourceReady, setSourceReady] = useState(false)\n  const optimizedSourceUrl = optimizeMessagingAttachmentUrl(sourceUrl)\n  const optimizedThumbnailUrl = optimizeMessagingAttachmentUrl(thumbnailUrl)\n\n  if (sourceUrl && (sourceType === 'video' || sourceType === 'audio')) {\n    return (\n      <MediaPlayer\n        source={sourceUrl}\n        mimeType={mimeType}\n        poster={optimizedThumbnailUrl}\n        controls\n        {...mediaPlayerProps}\n      />\n    )\n  }\n\n  if (sourceUrl && sourceType === 'image') {\n    if (containedImage) {\n      return (\n        <div className={`relative ${posterShellClass(variant)}`}>\n          <img\n            src={optimizedSourceUrl ?? sourceUrl}\n            alt={title ?? ''}\n            className={`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${sourceReady ? 'opacity-100' : 'opacity-0'}`}\n            draggable={false}\n            onLoad={() => setSourceReady(true)}\n          />\n        </div>\n      )\n    }\n    return (\n      <img\n        src={optimizedSourceUrl ?? sourceUrl}\n        alt={title ?? ''}\n        className=\"block w-full\"\n        draggable={false}\n      />\n    )\n  }\n\n  if (sourceUrl && sourceType === 'document') {\n    if (thumbnailUrl) {\n      if (containedImage) {\n        return (\n          <div className={`relative ${posterShellClass(variant)}`}>\n            <img\n              src={optimizedThumbnailUrl ?? thumbnailUrl}\n              alt={title ?? ''}\n              className={`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${sourceReady ? 'opacity-100' : 'opacity-0'}`}\n              draggable={false}\n              onLoad={() => setSourceReady(true)}\n            />\n          </div>\n        )\n      }\n      return (\n        <img\n          src={optimizedThumbnailUrl ?? thumbnailUrl}\n          alt=\"\"\n          className=\"block w-full\"\n          draggable={false}\n        />\n      )\n    }\n    return (\n      <div\n        className={`flex aspect-video w-full items-center justify-center ${variant === 'dark' ? 'bg-white/10' : 'bg-black/5'}`}\n      >\n        {renderTypeIcon(mimeType, {\n          className: placeholderIconClass(variant),\n          weight: 'regular',\n        })}\n      </div>\n    )\n  }\n\n  // Poster-only or empty (no sourceUrl)\n  if (thumbnailUrl) {\n    return (\n      <div className={`relative ${posterShellClass(variant)}`}>\n        <img\n          src={optimizedThumbnailUrl ?? thumbnailUrl}\n          alt={title ?? ''}\n          draggable={false}\n          className=\"absolute inset-0 h-full w-full object-cover\"\n        />\n      </div>\n    )\n  }\n\n  return (\n    <div\n      className={`flex aspect-video w-full items-center justify-center ${variant === 'dark' ? 'bg-white/10' : 'bg-black/5'}`}\n    >\n      {renderTypeIcon(mimeType, {\n        className: placeholderIconClass(variant),\n        weight: 'regular',\n      })}\n    </div>\n  )\n}\n\nexport default AttachmentThumbnail\n"],"mappings":"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"}