@linktr.ee/messaging-react 3.12.2-rc-1784012711 → 3.12.2-rc-1784017872

package/dist/{Card-Bs3dV_7R.cjs.map → Card-xlNNaZJO.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Card-Bs3dV_7R.cjs","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/CardBody.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/LockBadge.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/GalleryThumbnail.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/SingleThumbnail.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/CardThumbnail.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/MediaShell.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/PreviewToggle.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/usePreviewToggle.ts","../src/components/CustomMessage/LockedAttachment/components/_shared/useReceivedSource.ts","../src/components/CustomMessage/LockedAttachment/components/Media/CardActions.tsx","../src/components/CustomMessage/LockedAttachment/components/Media/Card.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport React from 'react'\n\nimport { renderTypeIcon } from '../../../../AttachmentCard'\n\nimport type { CardVariant } from './MediaShell'\n\nexport interface CardBodyProps {\n  variant: CardVariant\n  title?: string\n  placeholderTitle?: string\n  mimeType: string\n  detail?: string\n  statusBadge?: React.ReactNode\n  action?: React.ReactNode\n  /** Overrides the auto-detected type icon (used by Gallery to swap in an `Images` icon). */\n  icon?: React.ReactNode\n  /** Optional control rendered on the right of the title/status block (e.g. Composer edit pencil). */\n  trailingAction?: React.ReactNode\n}\n\n/**\n * Title + status row layout shared by Composer and `LockedAttachment.Media`.\n * Layout matches the Figma `Container > Labels` group (16px h-padding, 12px v-padding,\n * 4px gap between title and status row, 4px gap inside status row).\n */\nconst CardBody: React.FC<CardBodyProps> = ({\n  variant,\n  title,\n  placeholderTitle = 'Attachment title',\n  mimeType,\n  detail,\n  statusBadge,\n  action,\n  icon,\n  trailingAction,\n}) => {\n  const isDark = variant === 'dark'\n  const displayTitle = title || placeholderTitle\n  const titleDimmed = !title\n\n  const typeIcon =\n    icon ??\n    renderTypeIcon(mimeType, {\n      className: classNames(\n        'size-5 shrink-0',\n        isDark ? 'text-white/55' : 'text-black/55'\n      ),\n      weight: 'regular',\n    })\n\n  return (\n    <div className=\"px-4 py-3\">\n      <div className=\"flex items-end gap-3\">\n        <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n          {displayTitle.trim() !== '' && (\n            <p\n              className={classNames('truncate text-base font-medium leading-6', {\n                'text-black/90': !isDark && !titleDimmed,\n                'text-black/30': !isDark && titleDimmed,\n                'text-white/30': isDark && titleDimmed,\n                'text-white': isDark && !titleDimmed,\n              })}\n            >\n              {displayTitle}\n            </p>\n          )}\n\n          <div className=\"flex flex-wrap items-center gap-1\">\n            {typeIcon}\n\n            {detail != null && detail !== '' && (\n              <span\n                className={classNames(\n                  'text-xs font-medium',\n                  isDark ? 'text-white/55' : 'text-black/55'\n                )}\n              >\n                {detail}\n              </span>\n            )}\n\n            {statusBadge}\n          </div>\n        </div>\n\n        {trailingAction && <div className=\"shrink-0\">{trailingAction}</div>}\n      </div>\n\n      {action}\n    </div>\n  )\n}\n\nexport default CardBody\n","import { LockOpenIcon, LockSimpleIcon, PlayIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport { getSourceType } from '../../../../AttachmentCard'\nimport type { PaymentStatus } from '../../types'\n\nexport interface LockBadgeProps {\n  paymentStatus?: PaymentStatus\n  mimeType?: string\n  /**\n   * Overrides the `mimeType`-derived playable check. Lets a caller that\n   * already knows per-item playability (e.g. `GalleryThumbnail`, checking a\n   * carousel item's own mimeType rather than the card's single `mimeType`)\n   * skip re-deriving it.\n   */\n  isPlayable?: boolean\n  /** Whether the item is still locked. Play only ever shows once unlocked —\n   * a locked item always shows the lock, even for otherwise-playable media. */\n  isLocked: boolean\n}\n\n/**\n * Centered 48x48 lock badge that overlays the thumbnail of any locked attachment.\n * Uses `bg-black/30`. Stays `pointer-events-none` so clicks pass through to\n * the underlying player/toggle; the play state highlights via `group-hover`\n * (same `bg-black/40` as the gallery's prev/next arrows) — the ancestor\n * providing `group` must wrap the actual clickable/hoverable player area.\n *\n * For playable media (video/audio) that's unlocked, the badge shows a play\n * icon instead of a lock — matching the convention used by `GalleryThumbnail`.\n */\nexport const LockBadge: React.FC<LockBadgeProps> = ({\n  paymentStatus,\n  mimeType,\n  isPlayable,\n  isLocked,\n}) => {\n  const sourceType = mimeType ? getSourceType(mimeType) : undefined\n  const resolvedIsPlayable =\n    isPlayable ?? (sourceType === 'video' || sourceType === 'audio')\n\n  const Icon =\n    resolvedIsPlayable && !isLocked\n      ? PlayIcon\n      : paymentStatus === 'paid'\n        ? LockOpenIcon\n        : LockSimpleIcon\n  return (\n    <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n      <div\n        className={classNames(\n          'flex size-12 items-center justify-center rounded-full bg-black/30 text-white',\n          Icon === PlayIcon && 'group-hover:bg-black/40'\n        )}\n      >\n        <Icon className=\"size-6\" weight=\"fill\" />\n      </div>\n    </div>\n  )\n}\n\nexport default LockBadge\n","import { CaretLeftIcon, CaretRightIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React, { useState } from 'react'\n\nimport { AttachmentThumbnail, getSourceType } from '../../../../AttachmentCard'\nimport type {\n  LockedAttachmentGalleryItem,\n  PaymentStatus,\n} from '../../types'\n\nimport { LockBadge } from './LockBadge'\nimport type { CardVariant } from './MediaShell'\n\nexport interface GalleryThumbnailProps {\n  variant: CardVariant\n  gallery: LockedAttachmentGalleryItem[]\n  title?: string\n  /** When true, all items are shown blurred + the locked/play badge is overlaid. */\n  showLocked: boolean\n  paymentStatus?: PaymentStatus\n  /** Top-right slot (e.g. dismiss X on Composer). Rendered inside the thumbnail. */\n  topRight?: React.ReactNode\n}\n\nfunction isPlayableItem(item: LockedAttachmentGalleryItem): boolean {\n  const sourceType = getSourceType(item.mimeType)\n  return sourceType === 'video' || sourceType === 'audio'\n}\n\n/**\n * Mixed-media carousel used by every LockedAttachment card when its `gallery`\n * prop has 2+ items. Matches the \"Gallery\" frames in the Figma design system:\n * 337/386 aspect ratio, prev/next caret buttons, a counter pill, and a center\n * lock / play indicator that swaps based on the current item.\n */\nconst GalleryThumbnail: React.FC<GalleryThumbnailProps> = ({\n  variant,\n  gallery,\n  title,\n  showLocked,\n  paymentStatus,\n  topRight,\n}) => {\n  const [index, setIndex] = useState(0)\n  const total = gallery.length\n  const safeIndex = Math.min(index, total - 1)\n  const current = gallery[safeIndex]\n  const isVideoItem = isPlayableItem(current)\n\n  // Stop propagation so arrow taps don't bubble up to the outer preview-toggle\n  // wrapper on PreviewMediaCard / OwnMediaCard.\n  const goPrev = (e: React.MouseEvent) => {\n    e.stopPropagation()\n    setIndex((i) => Math.max(0, i - 1))\n  }\n  const goNext = (e: React.MouseEvent) => {\n    e.stopPropagation()\n    setIndex((i) => Math.min(total - 1, i + 1))\n  }\n  const atStart = safeIndex === 0\n  const atEnd = safeIndex === total - 1\n\n  const isDark = variant === 'dark'\n\n  // Locked + unlocked render entirely separate trees so the locked state\n  // doesn't end up stacking a blurred `<img>` on top of an underlying\n  // `AttachmentThumbnail` (whose `bg-white/10` poster shell otherwise\n  // shows through as a visible horizontal seam).\n  //\n  // The locked placeholder is absolutely positioned, so it needs the fixed\n  // 337/386 box for height; unlocked content (video, natural-sized image)\n  // manages its own height and can expand/shrink per item.\n  //\n  // The locked branch uses `filter: blur` on a single full-size `<img>`\n  // — not `backdrop-filter` — so the rounded corners are clipped\n  // normally without any clip-path workarounds (see SingleThumbnail).\n  return (\n    <div\n      className={classNames(\n        'group relative overflow-hidden rounded-t-md',\n        showLocked ? 'aspect-[337/386]' : undefined\n      )}\n    >\n      {showLocked ? (\n        <div\n          className={classNames(\n            'absolute inset-0',\n            isDark ? 'bg-white/10' : 'bg-black/5'\n          )}\n        >\n          {current.thumbnailUrl && (\n            <img\n              src={current.thumbnailUrl}\n              alt=\"\"\n              aria-hidden\n              draggable={false}\n              // `scale-110` hides the fuzzy edge that `filter: blur` leaves\n              // around the image bounds.\n              className=\"absolute inset-0 h-full w-full scale-110 object-cover blur-[40px]\"\n            />\n          )}\n        </div>\n      ) : (\n        <AttachmentThumbnail\n          key={safeIndex}\n          mimeType={current.mimeType}\n          sourceUrl={current.sourceUrl}\n          thumbnailUrl={current.thumbnailUrl}\n          title={title}\n          variant={variant}\n          mediaPlayerProps={{ autoPlay: true }}\n        />\n      )}\n\n      {/* LOCK while locked. Once unlocked, video/audio autoplays via\n          `mediaPlayerProps` and MediaPlayer already has its own inline\n          controls, so no separate Play affordance is shown. */}\n      {showLocked && (\n        <LockBadge\n          paymentStatus={paymentStatus}\n          isPlayable={isVideoItem}\n          isLocked={showLocked}\n        />\n      )}\n\n      {total > 1 && (\n        <React.Fragment>\n          <button\n            type=\"button\"\n            onClick={goPrev}\n            disabled={atStart}\n            aria-label=\"Previous item\"\n            className={classNames(\n              'absolute left-3 top-1/2 -translate-y-1/2 flex size-7 items-center justify-center rounded-full bg-black/30 text-white transition-opacity',\n              atStart ? 'opacity-40' : 'hover:bg-black/40'\n            )}\n          >\n            <CaretLeftIcon className=\"size-5\" weight=\"bold\" />\n          </button>\n          <button\n            type=\"button\"\n            onClick={goNext}\n            disabled={atEnd}\n            aria-label=\"Next item\"\n            className={classNames(\n              'absolute right-3 top-1/2 -translate-y-1/2 flex size-7 items-center justify-center rounded-full bg-black/30 text-white transition-opacity',\n              atEnd ? 'opacity-40' : 'hover:bg-black/40'\n            )}\n          >\n            <CaretRightIcon className=\"size-5\" weight=\"bold\" />\n          </button>\n\n          <div className=\"pointer-events-none absolute bottom-10 left-1/2 flex size-8 -translate-x-1/2 items-center justify-center rounded-full bg-black/30\">\n            <span className=\"text-xs font-medium leading-none text-white\">\n              {safeIndex + 1}/{total}\n            </span>\n          </div>\n        </React.Fragment>\n      )}\n\n      {topRight && (\n        <div className=\"pointer-events-auto absolute right-3 top-3 z-10\">\n          {topRight}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default GalleryThumbnail\n","import classNames from 'classnames'\nimport React from 'react'\n\nimport {\n  AttachmentThumbnail,\n  renderTypeIcon,\n} from '../../../../AttachmentCard'\nimport type { LockedAttachmentSource, PaymentStatus } from '../../types'\n\nimport { LockBadge } from './LockBadge'\nimport type { CardVariant } from './MediaShell'\n\nexport interface SingleThumbnailProps {\n  variant: CardVariant\n  mimeType: string\n  thumbnailUrl?: string\n  title?: string\n  /**\n   * When provided, the underlying source is shown unblurred (preview / unlocked state).\n   * When undefined, the thumbnail is treated as locked: blurred with a central lock badge.\n   */\n  source?: LockedAttachmentSource\n  /**\n   * Forces the locked appearance even when a source is provided. Used for the\n   * Composer card where the locked treatment is the default and the user toggles\n   * a preview in place.\n   */\n  showLocked: boolean\n  paymentStatus?: PaymentStatus\n  /** Top-right overlay (e.g. dismiss X on Composer). Rendered inside the thumbnail. */\n  topRight?: React.ReactNode\n  /** When true, renders the unlocked image with aspect-video + object-contain. */\n  containedImage?: boolean\n}\n\n/**\n * Renders the 180px-tall media area for a LockedAttachment card.\n * Handles three visual states:\n *   - locked:       blurred thumbnail + centered 48px lock badge\n *   - preview/paid: clear thumbnail (the underlying source)\n *   - empty:        type-icon placeholder\n */\nconst SingleThumbnail: React.FC<SingleThumbnailProps> = ({\n  variant,\n  mimeType,\n  thumbnailUrl,\n  title,\n  source,\n  showLocked,\n  paymentStatus,\n  topRight,\n  containedImage = false,\n}) => {\n  const effectiveSourceUrl = showLocked ? undefined : source?.sourceUrl\n  const effectiveThumbnailUrl = showLocked\n    ? thumbnailUrl\n    : (source?.thumbnailUrl ?? thumbnailUrl)\n\n  const isDark = variant === 'dark'\n\n  // Locked + unlocked render entirely separate trees so the locked state\n  // doesn't end up stacking a blurred `<img>` on top of an underlying\n  // `AttachmentThumbnail` (whose `bg-white/10` poster shell otherwise\n  // shows through as a visible horizontal seam at the 16:9 boundary).\n  //\n  // The locked branch uses `filter: blur` on a single full-size `<img>`\n  // — not `backdrop-filter` — because `backdrop-filter` paints in its\n  // own compositing layer that escapes ancestor `overflow: hidden` on\n  // Chrome/Safari and flattens the card's top corners. `filter` is\n  // clipped normally, so the rounded corners stay round without any\n  // clip-path workarounds.\n  return (\n    <div className=\"relative overflow-hidden rounded-t-md\">\n      {showLocked ? (\n        <div\n          className={classNames(\n            'relative aspect-video overflow-hidden',\n            isDark ? 'bg-white/10' : 'bg-black/5'\n          )}\n        >\n          {effectiveThumbnailUrl ? (\n            <img\n              src={effectiveThumbnailUrl}\n              alt=\"\"\n              aria-hidden\n              draggable={false}\n              // `scale-110` hides the fuzzy semi-transparent edge that\n              // `filter: blur` leaves around the image bounds.\n              className=\"absolute inset-0 h-full w-full scale-110 object-cover blur-[40px]\"\n            />\n          ) : (\n            <div className=\"absolute inset-0 flex items-center justify-center\">\n              {renderTypeIcon(mimeType, {\n                className: isDark\n                  ? 'size-12 text-white/20'\n                  : 'size-12 text-black/20',\n                weight: 'regular',\n              })}\n            </div>\n          )}\n          <LockBadge\n            paymentStatus={paymentStatus}\n            mimeType={mimeType}\n            isLocked={showLocked}\n          />\n        </div>\n      ) : (\n        <AttachmentThumbnail\n          mimeType={mimeType}\n          sourceUrl={effectiveSourceUrl}\n          thumbnailUrl={effectiveThumbnailUrl}\n          title={title}\n          variant={variant}\n          containedImage={containedImage}\n          mediaPlayerProps={\n            effectiveSourceUrl\n              ? { autoPlay: true, loop: true, controls: true, muted: false }\n              : undefined\n          }\n        />\n      )}\n\n      {topRight && (\n        <div className=\"pointer-events-auto absolute right-3 top-3 z-10\">\n          {topRight}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default SingleThumbnail\n","import { ImagesIcon } from '@phosphor-icons/react'\nimport type React from 'react'\n\nimport type {\n  LockedAttachmentGalleryItem,\n  LockedAttachmentSource,\n  PaymentStatus,\n} from '../../types'\n\nimport GalleryThumbnail from './GalleryThumbnail'\nimport type { CardVariant } from './MediaShell'\nimport SingleThumbnail from './SingleThumbnail'\n\nexport interface CardThumbnailProps {\n  variant: CardVariant\n  gallery: LockedAttachmentGalleryItem[]\n  title?: string\n  showLocked: boolean\n  paymentStatus?: PaymentStatus\n  /** Single-asset props — ignored when the card renders as a gallery. */\n  mimeType: string\n  thumbnailUrl?: string\n  source?: LockedAttachmentSource\n  containedImage?: boolean\n  /** Top-right overlay (e.g. Composer dismiss X). Rendered inside the thumbnail. */\n  topRight?: React.ReactNode\n}\n\n/** True when the card should render as a mixed-media carousel (2+ items). */\nexport const isGalleryCard = (\n  gallery: LockedAttachmentGalleryItem[]\n): boolean => gallery.length >= 2\n\n/**\n * The body-row icon a card shows when it renders as a gallery — `CardBody`\n * otherwise auto-detects the icon from `mimeType`. Returned as a ready node so\n * every card shares the same size/tone treatment.\n */\nexport const galleryBodyIcon = (\n  variant: CardVariant\n): React.ReactNode => (\n  <ImagesIcon\n    className={\n      variant === 'dark'\n        ? 'size-5 shrink-0 text-white/55'\n        : 'size-5 shrink-0 text-black/55'\n    }\n  />\n)\n\n/**\n * Owns the single-vs-gallery thumbnail decision shared by Composer /\n * `LockedAttachment.Media` cards: renders `GalleryThumbnail` for a 2+ item `gallery`,\n * else `SingleThumbnail` for the single asset. Callers pass the superset of\n * props; the unused half is ignored by whichever branch renders.\n */\nconst CardThumbnail: React.FC<CardThumbnailProps> = ({\n  variant,\n  gallery,\n  title,\n  showLocked,\n  paymentStatus,\n  mimeType,\n  thumbnailUrl,\n  source,\n  containedImage,\n  topRight,\n}) =>\n  isGalleryCard(gallery) ? (\n    <GalleryThumbnail\n      variant={variant}\n      gallery={gallery}\n      title={title}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n      topRight={topRight}\n    />\n  ) : (\n    <SingleThumbnail\n      variant={variant}\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n      topRight={topRight}\n      containedImage={containedImage}\n    />\n  )\n\nexport default CardThumbnail\n","import classNames from 'classnames'\nimport React from 'react'\n\nexport type CardVariant = 'dark' | 'light'\n\nexport interface MediaShellProps {\n  variant: CardVariant\n  children: React.ReactNode\n  rootRef?: React.Ref<HTMLDivElement>\n  'data-testid'?: string\n}\n\n/**\n * Outer chrome for every LockedAttachment card.\n * Mirrors the 16px radius treatment from the Figma design system.\n */\nconst MediaShell: React.FC<MediaShellProps> = ({\n  variant,\n  children,\n  rootRef,\n  'data-testid': dataTestId,\n}) => (\n  <div\n    ref={rootRef}\n    data-testid={dataTestId}\n    className={classNames(\n      'relative w-[280px] select-none overflow-hidden rounded-md',\n      variant === 'dark' ? 'bg-[#1e2330]' : 'bg-white',\n      'shadow-[0_1px_2px_rgba(0,0,0,0.08)]'\n    )}\n  >\n    {children}\n  </div>\n)\n\nexport default MediaShell\n","import React from 'react'\n\nexport interface PreviewToggleProps {\n  /** Toggles the preview; omit to render `children` with no wrapper at all (nothing to toggle). */\n  onToggle: (() => void | Promise<void>) | undefined\n  isBusy: boolean\n  isPreviewVisible: boolean\n  children: React.ReactNode\n}\n\n/**\n * Makes a locked thumbnail clickable to toggle its preview. Uses a\n * `role=\"button\"` div rather than a native `<button>` because the thumbnail\n * it wraps can itself contain interactive children (gallery carousel arrows,\n * a Composer dismiss X) — nesting a real `<button>` around those would\n * produce invalid, inaccessible nested-interactive-element markup.\n */\nconst PreviewToggle: React.FC<PreviewToggleProps> = ({\n  onToggle,\n  isBusy,\n  isPreviewVisible,\n  children,\n}) => {\n  if (!onToggle) return <React.Fragment>{children}</React.Fragment>\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={isBusy ? -1 : 0}\n      aria-label=\"Toggle preview\"\n      aria-busy={isBusy}\n      aria-pressed={isPreviewVisible}\n      aria-disabled={isBusy || undefined}\n      onClick={isBusy ? undefined : onToggle}\n      onKeyDown={(e) => {\n        if (isBusy) return\n        // Only handle keys that originate on the wrapper itself, not on\n        // inner interactive elements (dismiss X, carousel arrows). Without\n        // this guard, pressing Enter/Space on a focused child would bubble\n        // up and toggle the preview in addition to activating the child.\n        if (e.target !== e.currentTarget) return\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault()\n          void onToggle()\n        }\n      }}\n      className={\n        !isBusy\n          ? 'block w-full cursor-pointer text-left'\n          : 'block w-full text-left'\n      }\n    >\n      {children}\n    </div>\n  )\n}\n\nexport default PreviewToggle\n","import { useCallback, useRef, useState } from 'react'\n\nimport type { LockedAttachmentSource } from '../../types'\n\nexport interface UsePreviewToggleOptions {\n  /** Gallery items carry their own per-item sources on the `gallery` prop already, so toggling skips the async fetch entirely. */\n  isGallery: boolean\n  /**\n   * Lazily loads the underlying source; the resolved value is cached in\n   * `source` and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /** Fired on every toggle tap, before any visibility/fetch logic runs. */\n  onPreviewClick?: () => void\n}\n\nexport interface UsePreviewToggleResult {\n  source: LockedAttachmentSource | undefined\n  isPreviewVisible: boolean\n  isLoadingPreview: boolean\n  handleToggle: () => Promise<void>\n  /**\n   * `handleToggle` when the card can actually be previewed (gallery, or a\n   * fetch/click handler is wired), else `undefined` — pass straight to\n   * `PreviewToggle.onToggle` so a non-previewable card renders no\n   * toggle affordance.\n   */\n  togglePreview: (() => Promise<void>) | undefined\n}\n\n/**\n * Shared preview-toggle state for Composer/Media isMine: flips a locked thumbnail to\n * its unlocked preview, lazily fetching and caching the source on first\n * reveal. Media !isMine doesn't use this — it fetches on scroll-into-view/paid\n * instead of on a toggle tap.\n */\nexport function usePreviewToggle({\n  isGallery,\n  onFetchSource,\n  onPreviewClick,\n}: UsePreviewToggleOptions): UsePreviewToggleResult {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  const togglePreview =\n    isGallery || onFetchSource != null || onPreviewClick != null\n      ? handleToggle\n      : undefined\n\n  return {\n    source,\n    isPreviewVisible,\n    isLoadingPreview,\n    handleToggle,\n    togglePreview,\n  }\n}\n","import { useCallback, useEffect, useRef, useState } from 'react'\n\nimport type {\n  FetchSourceHandler,\n  LockedAttachmentSource,\n  PaymentStatus,\n} from '../../types'\n\nexport interface UseReceivedSourceOptions {\n  paymentStatus?: PaymentStatus\n  onFetchSource?: FetchSourceHandler\n  /** Called on Unlock click while the card is still unpaid (opens checkout). */\n  onUnlockClick?: () => void\n}\n\nexport interface UseReceivedSourceResult {\n  source: LockedAttachmentSource | undefined\n  /** Attach to the card root so the paid-source auto-fetch can observe it. */\n  cardRef: React.RefObject<HTMLDivElement>\n  /** Fetches the source when already paid, else defers to `onUnlockClick`. */\n  handleUnlockClick: () => void\n}\n\n/**\n * Media !isMine's source-reveal logic: unlike Composer/Media isMine's\n * tap-to-toggle (`usePreviewToggle`), the recipient's card reveals its source\n * by fetching once — on click when already paid, or automatically the first\n * time a paid card scrolls fully into view. The fetch is guarded so it runs\n * at most once in flight.\n */\nexport function useReceivedSource({\n  paymentStatus,\n  onFetchSource,\n  onUnlockClick,\n}: UseReceivedSourceOptions): UseReceivedSourceResult {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n\n  const cardRef = useRef<HTMLDivElement>(null)\n  const fetchingRef = useRef(false)\n\n  const onFetchSourceRef = useRef(onFetchSource)\n  onFetchSourceRef.current = onFetchSource\n\n  const fetchSource = useCallback(async (): Promise<void> => {\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    try {\n      const result = await onFetchSourceRef.current?.()\n      if (result) setSource(result)\n    } finally {\n      fetchingRef.current = false\n    }\n  }, [])\n\n  const handleUnlockClick = useCallback(() => {\n    if (paymentStatus === 'paid') {\n      void fetchSource()\n    } else {\n      onUnlockClick?.()\n    }\n  }, [paymentStatus, fetchSource, onUnlockClick])\n\n  // Auto-fetch the source once the paid card scrolls into view.\n  useEffect(() => {\n    if (!cardRef.current) return\n    if (paymentStatus !== 'paid' || source !== undefined) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          void fetchSource()\n          observer.disconnect()\n        }\n      },\n      { threshold: 1.0 }\n    )\n\n    observer.observe(cardRef.current)\n    return () => observer.disconnect()\n  }, [paymentStatus, source, fetchSource])\n\n  return { source, cardRef, handleUnlockClick }\n}\n","import { DownloadSimpleIcon, LockSimpleIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nimport LoadingDots from '../_shared/LoadingDots'\n\nexport interface ReceivedCardActionsProps {\n  /** Whether the card is currently locked. Drives which CTA we render. */\n  isLocked: boolean\n  /**\n   * When unlocked, the URL used as the Download link's `href` (opens in a new\n   * tab). When omitted, the Download CTA falls back to a plain `<button>`\n   * that just calls `onDownloadClicked` — useful for galleries where the\n   * single-source URL doesn't exist.\n   */\n  sourceUrl?: string\n  /** Optional alternate href that takes precedence over `sourceUrl`. */\n  redeemUrl?: string\n  onUnlockClicked?: () => void\n  onDownloadClicked?: () => void\n  isUnlocking?: boolean\n}\n\nconst buttonClass =\n  'mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928]'\n\n/**\n * Renders the primary CTA below the body of a Received card.\n * - Locked + onUnlockClicked → \"Unlock\" button\n * - Unlocked + onDownloadClicked + (redeemUrl || sourceUrl) → \"Download\" link\n * - Unlocked + onDownloadClicked + no URL → \"Download\" button (e.g. gallery)\n * Otherwise renders nothing.\n */\nconst ReceivedCardActions: React.FC<ReceivedCardActionsProps> = ({\n  isLocked,\n  sourceUrl,\n  redeemUrl,\n  onUnlockClicked,\n  onDownloadClicked,\n  isUnlocking = false,\n}) => {\n  if (isLocked && onUnlockClicked != null) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlockClicked}\n        disabled={isUnlocking}\n        aria-label={isUnlocking ? 'Unlocking' : 'Unlock'}\n        aria-busy={isUnlocking}\n        title={isUnlocking ? 'Unlocking' : 'Unlock'}\n        className={buttonClass}\n      >\n        {isUnlocking ? (\n          <LoadingDots />\n        ) : (\n          <React.Fragment>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </React.Fragment>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownloadClicked != null) {\n    const href = redeemUrl ?? sourceUrl\n    if (href != null) {\n      return (\n        <a\n          href={href}\n          aria-label=\"Download\"\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={onDownloadClicked}\n          className={`${buttonClass} !text-white`}\n        >\n          <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n          Download\n        </a>\n      )\n    }\n\n    return (\n      <button\n        type=\"button\"\n        onClick={onDownloadClicked}\n        aria-label=\"Download\"\n        className={buttonClass}\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </button>\n    )\n  }\n\n  return null\n}\n\nexport default ReceivedCardActions\n","import { PencilSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nimport { getSourceType } from '../../../../AttachmentCard'\nimport CardBody from '../_shared/CardBody'\nimport CardThumbnail, {\n  galleryBodyIcon,\n  isGalleryCard,\n} from '../_shared/CardThumbnail'\nimport MediaShell from '../_shared/MediaShell'\nimport PreviewToggle from '../_shared/PreviewToggle'\nimport PurchaseStatusBadge from '../_shared/PurchaseStatusBadge'\nimport { usePreviewToggle } from '../_shared/usePreviewToggle'\nimport { useReceivedSource } from '../_shared/useReceivedSource'\n\nimport ReceivedCardActions from './CardActions'\nimport type {\n  MediaCardDraftProps,\n  MediaCardOtherProps,\n  MediaCardOwnProps,\n  MediaCardPreviewProps,\n  MediaCardProps,\n} from './types'\n\nexport type { MediaCardProps } from './types'\n\n/**\n * Media card while still drafting — the locked thumbnail (single or gallery)\n * the composer taps to preview the attachment they're about to send, plus\n * the title/price body with optional dismiss X and edit pencil.\n */\nconst DraftMediaCard: React.FC<MediaCardDraftProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle,\n  placeholderAmountText,\n  gallery = [],\n  onDismiss,\n  onPreviewClick,\n  onFetchSource,\n  onEditClick,\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  // Gallery is always previewable in the composer because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const { source, isPreviewVisible, isLoadingPreview, togglePreview } =\n    usePreviewToggle({ isGallery, onFetchSource, onPreviewClick })\n\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-white/55'\n            : 'text-xs font-medium text-white/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  const dismissButton = onDismiss ? (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        // Stop the click from bubbling up into the outer preview-toggle\n        // wrapper when both are wired up at the same time.\n        e.stopPropagation()\n        onDismiss()\n      }}\n      className=\"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white\"\n      aria-label=\"Dismiss attachment\"\n    >\n      <XIcon className=\"size-3\" weight=\"bold\" />\n    </button>\n  ) : undefined\n\n  const editButton = onEditClick ? (\n    <button\n      type=\"button\"\n      onClick={onEditClick}\n      aria-label=\"Edit attachment\"\n      className=\"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n    >\n      <PencilSimpleIcon className=\"size-5\" weight=\"regular\" />\n    </button>\n  ) : undefined\n\n  return (\n    <MediaShell variant=\"dark\">\n      <PreviewToggle\n        onToggle={togglePreview}\n        isBusy={isBusy}\n        isPreviewVisible={!showLocked}\n      >\n        <CardThumbnail\n          variant=\"dark\"\n          gallery={gallery}\n          title={title}\n          showLocked={showLocked}\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          source={source}\n          topRight={dismissButton}\n        />\n      </PreviewToggle>\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={isGallery ? galleryBodyIcon('dark') : undefined}\n        trailingAction={editButton}\n      />\n    </MediaShell>\n  )\n}\n\n/**\n * Static mockup of what the recipient will see before purchase — always\n * locked/blurred (the lock badge renders from `showLocked` alone, no toggle\n * wiring needed), no interactivity, no real content revealed.\n */\nconst PreviewMediaCard: React.FC<MediaCardPreviewProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle,\n  placeholderAmountText,\n  gallery = [],\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-black/55'\n            : 'text-xs font-medium text-black/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  return (\n    <MediaShell variant=\"light\">\n      <CardThumbnail\n        variant=\"light\"\n        gallery={gallery}\n        title={title}\n        showLocked\n        mimeType={mimeType}\n        thumbnailUrl={thumbnailUrl}\n      />\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={isGallery ? galleryBodyIcon('light') : undefined}\n      />\n    </MediaShell>\n  )\n}\n/**\n * The sender's ('mine') view of a paid media attachment: the locked\n * thumbnail (single or gallery) they can tap to preview their own\n * attachment, plus the title/purchase-status body.\n */\nconst OwnMediaCard: React.FC<MediaCardOwnProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle,\n  paymentStatus = 'pending',\n  gallery = [],\n  onPreviewClick,\n  onFetchSource,\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  // Gallery is always previewable for the sender because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const { source, isPreviewVisible, isLoadingPreview, togglePreview } =\n    usePreviewToggle({ isGallery, onFetchSource, onPreviewClick })\n\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  return (\n    <MediaShell variant=\"dark\">\n      <PreviewToggle\n        onToggle={togglePreview}\n        isBusy={isBusy}\n        isPreviewVisible={!showLocked}\n      >\n        <CardThumbnail\n          variant=\"dark\"\n          gallery={gallery}\n          title={title}\n          showLocked={showLocked}\n          paymentStatus={paymentStatus}\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          source={source}\n        />\n      </PreviewToggle>\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={\n          <PurchaseStatusBadge\n            isMine={true}\n            paymentStatus={paymentStatus}\n            amountText={amountText}\n          />\n        }\n        icon={isGallery ? galleryBodyIcon('dark') : undefined}\n      />\n    </MediaShell>\n  )\n}\n\n/**\n * The recipient's ('other') view of a paid media attachment: the locked\n * thumbnail (single or gallery) with an Unlock/Download CTA. The source is\n * revealed by fetching once — on click when already paid, or automatically\n * the first time a paid card scrolls into view.\n */\nconst OtherMediaCard: React.FC<MediaCardOtherProps> = ({\n  title,\n  amountText,\n  thumbnailUrl,\n  mimeType = 'application/octet-stream',\n  detail,\n  gallery = [],\n  onUnlockClick,\n  onFetchSource,\n  onDownloadClick,\n  paymentStatus,\n  isUnlocking = false,\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  const { source, cardRef, handleUnlockClick } = useReceivedSource({\n    paymentStatus,\n    onFetchSource,\n    onUnlockClick,\n  })\n\n  const effectiveSourceUrl = source?.sourceUrl\n  const effectiveRedeemUrl = source?.redeemUrl\n\n  // For gallery, the per-item sources are carried by `gallery` itself, so\n  // the lock state is driven by paymentStatus rather than the single\n  // `effectiveSourceUrl`. Everything else still respects the source fetch.\n  const isLocked = isGallery\n    ? paymentStatus !== 'paid'\n    : effectiveSourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  // For gallery, ReceivedCardActions falls back to a plain <button>\n  // (no anchor) because the gallery has no single sourceUrl to link to —\n  // the per-item sources live on `gallery` itself.\n  const actionSourceUrl = isGallery ? undefined : effectiveSourceUrl\n\n  return (\n    <MediaShell\n      variant=\"light\"\n      rootRef={cardRef}\n      data-testid=\"locked-attachment\"\n    >\n      <CardThumbnail\n        variant=\"light\"\n        gallery={gallery}\n        title={title}\n        showLocked={isLocked}\n        paymentStatus={paymentStatus}\n        mimeType={mimeType}\n        thumbnailUrl={thumbnailUrl}\n        source={source}\n        containedImage={!isLocked && sourceType === 'document'}\n      />\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={\n          <PurchaseStatusBadge\n            isMine={false}\n            paymentStatus={paymentStatus}\n            amountText={amountText}\n          />\n        }\n        icon={isGallery ? galleryBodyIcon('light') : undefined}\n        action={\n          <ReceivedCardActions\n            isLocked={isLocked}\n            isUnlocking={isUnlocking}\n            sourceUrl={actionSourceUrl}\n            redeemUrl={effectiveRedeemUrl}\n            onUnlockClicked={handleUnlockClick}\n            onDownloadClicked={onDownloadClick}\n          />\n        }\n      />\n    </MediaShell>\n  )\n}\n\n/**\n * The card either party sees for a paid media attachment. `isDraft`/`isPreview`\n * select the composer's own drafting view / a static receiver-side mockup;\n * otherwise `isMine` selects the sender's sent view vs. the recipient's\n * unlock/download view.\n */\nconst MediaCard: React.FC<MediaCardProps> = (props) => {\n  if (props.isDraft) {\n    return <DraftMediaCard {...props} />\n  } else if (props.isPreview) {\n    return <PreviewMediaCard {...props} />\n  } else if (props.isMine) {\n    return <OwnMediaCard {...props} />\n  } else {\n    return <OtherMediaCard {...props} />\n  }\n}\n\nexport default MediaCard\n"],"names":["CardBody","variant","title","placeholderTitle","mimeType","detail","statusBadge","action","icon","trailingAction","isDark","displayTitle","titleDimmed","typeIcon","renderTypeIcon","classNames","jsxs","jsx","LockBadge","paymentStatus","isPlayable","isLocked","sourceType","getSourceType","Icon","PlayIcon","LockOpenIcon","LockSimpleIcon","isPlayableItem","item","GalleryThumbnail","gallery","showLocked","topRight","index","setIndex","useState","total","safeIndex","current","isVideoItem","goPrev","e","i","goNext","atStart","atEnd","AttachmentThumbnail","React","CaretLeftIcon","CaretRightIcon","SingleThumbnail","thumbnailUrl","source","containedImage","effectiveSourceUrl","effectiveThumbnailUrl","isGalleryCard","galleryBodyIcon","ImagesIcon","CardThumbnail","MediaShell","children","rootRef","dataTestId","PreviewToggle","onToggle","isBusy","isPreviewVisible","usePreviewToggle","isGallery","onFetchSource","onPreviewClick","setSource","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","handleToggle","useCallback","result","togglePreview","useReceivedSource","onUnlockClick","cardRef","onFetchSourceRef","fetchSource","_a","handleUnlockClick","useEffect","observer","entry","buttonClass","ReceivedCardActions","sourceUrl","redeemUrl","onUnlockClicked","onDownloadClicked","isUnlocking","LoadingDots","href","DownloadSimpleIcon","DraftMediaCard","amountText","placeholderAmountText","onDismiss","onEditClick","dismissButton","XIcon","editButton","PencilSimpleIcon","PreviewMediaCard","OwnMediaCard","PurchaseStatusBadge","OtherMediaCard","onDownloadClick","effectiveRedeemUrl","actionSourceUrl","MediaCard","props"],"mappings":"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"}
+{"version":3,"file":"Card-xlNNaZJO.cjs","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/CardBody.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/LockBadge.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/GalleryThumbnail.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/SingleThumbnail.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/CardThumbnail.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/MediaShell.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/PreviewToggle.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/usePreviewToggle.ts","../src/components/CustomMessage/LockedAttachment/components/_shared/useReceivedSource.ts","../src/components/CustomMessage/LockedAttachment/components/Media/CardActions.tsx","../src/components/CustomMessage/LockedAttachment/components/Media/Card.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport React from 'react'\n\nimport { renderTypeIcon } from '../../../../AttachmentCard'\n\nimport type { CardVariant } from './MediaShell'\n\nexport interface CardBodyProps {\n  variant: CardVariant\n  title?: string\n  placeholderTitle?: string\n  mimeType: string\n  detail?: string\n  statusBadge?: React.ReactNode\n  action?: React.ReactNode\n  /** Overrides the auto-detected type icon (used by Gallery to swap in an `Images` icon). */\n  icon?: React.ReactNode\n  /** Optional control rendered on the right of the title/status block (e.g. Composer edit pencil). */\n  trailingAction?: React.ReactNode\n}\n\n/**\n * Title + status row layout shared by Composer and `LockedAttachment.Media`.\n * Layout matches the Figma `Container > Labels` group (16px h-padding, 12px v-padding,\n * 4px gap between title and status row, 4px gap inside status row).\n */\nconst CardBody: React.FC<CardBodyProps> = ({\n  variant,\n  title,\n  placeholderTitle = 'Attachment title',\n  mimeType,\n  detail,\n  statusBadge,\n  action,\n  icon,\n  trailingAction,\n}) => {\n  const isDark = variant === 'dark'\n  const displayTitle = title || placeholderTitle\n  const titleDimmed = !title\n\n  const typeIcon =\n    icon ??\n    renderTypeIcon(mimeType, {\n      className: classNames(\n        'size-5 shrink-0',\n        isDark ? 'text-white/55' : 'text-black/55'\n      ),\n      weight: 'regular',\n    })\n\n  return (\n    <div className=\"px-4 py-3\">\n      <div className=\"flex items-end gap-3\">\n        <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n          {displayTitle.trim() !== '' && (\n            <p\n              className={classNames('truncate text-base font-medium leading-6', {\n                'text-black/90': !isDark && !titleDimmed,\n                'text-black/30': !isDark && titleDimmed,\n                'text-white/30': isDark && titleDimmed,\n                'text-white': isDark && !titleDimmed,\n              })}\n            >\n              {displayTitle}\n            </p>\n          )}\n\n          <div className=\"flex flex-wrap items-center gap-1\">\n            {typeIcon}\n\n            {detail != null && detail !== '' && (\n              <span\n                className={classNames(\n                  'text-xs font-medium',\n                  isDark ? 'text-white/55' : 'text-black/55'\n                )}\n              >\n                {detail}\n              </span>\n            )}\n\n            {statusBadge}\n          </div>\n        </div>\n\n        {trailingAction && <div className=\"shrink-0\">{trailingAction}</div>}\n      </div>\n\n      {action}\n    </div>\n  )\n}\n\nexport default CardBody\n","import { LockOpenIcon, LockSimpleIcon, PlayIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport { getSourceType } from '../../../../AttachmentCard'\nimport type { PaymentStatus } from '../../types'\n\nexport interface LockBadgeProps {\n  paymentStatus?: PaymentStatus\n  mimeType?: string\n  /**\n   * Overrides the `mimeType`-derived playable check. Lets a caller that\n   * already knows per-item playability (e.g. `GalleryThumbnail`, checking a\n   * carousel item's own mimeType rather than the card's single `mimeType`)\n   * skip re-deriving it.\n   */\n  isPlayable?: boolean\n  /** Whether the item is still locked. Play only ever shows once unlocked —\n   * a locked item always shows the lock, even for otherwise-playable media. */\n  isLocked: boolean\n}\n\n/**\n * Centered 48x48 lock badge that overlays the thumbnail of any locked attachment.\n * Uses `bg-black/30`. Stays `pointer-events-none` so clicks pass through to\n * the underlying player/toggle; the play state highlights via `group-hover`\n * (same `bg-black/40` as the gallery's prev/next arrows) — the ancestor\n * providing `group` must wrap the actual clickable/hoverable player area.\n *\n * For playable media (video/audio) that's unlocked, the badge shows a play\n * icon instead of a lock — matching the convention used by `GalleryThumbnail`.\n */\nexport const LockBadge: React.FC<LockBadgeProps> = ({\n  paymentStatus,\n  mimeType,\n  isPlayable,\n  isLocked,\n}) => {\n  const sourceType = mimeType ? getSourceType(mimeType) : undefined\n  const resolvedIsPlayable =\n    isPlayable ?? (sourceType === 'video' || sourceType === 'audio')\n\n  const Icon =\n    resolvedIsPlayable && !isLocked\n      ? PlayIcon\n      : paymentStatus === 'paid'\n        ? LockOpenIcon\n        : LockSimpleIcon\n  return (\n    <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n      <div\n        className={classNames(\n          'flex size-12 items-center justify-center rounded-full bg-black/30 text-white',\n          Icon === PlayIcon && 'group-hover:bg-black/40'\n        )}\n      >\n        <Icon className=\"size-6\" weight=\"fill\" />\n      </div>\n    </div>\n  )\n}\n\nexport default LockBadge\n","import { CaretLeftIcon, CaretRightIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React, { useState } from 'react'\n\nimport { AttachmentThumbnail, getSourceType } from '../../../../AttachmentCard'\nimport type {\n  LockedAttachmentGalleryItem,\n  PaymentStatus,\n} from '../../types'\n\nimport { LockBadge } from './LockBadge'\nimport type { CardVariant } from './MediaShell'\n\nexport interface GalleryThumbnailProps {\n  variant: CardVariant\n  gallery: LockedAttachmentGalleryItem[]\n  title?: string\n  /** When true, all items are shown blurred + the locked/play badge is overlaid. */\n  showLocked: boolean\n  paymentStatus?: PaymentStatus\n  /** Top-right slot (e.g. dismiss X on Composer). Rendered inside the thumbnail. */\n  topRight?: React.ReactNode\n}\n\nfunction isPlayableItem(item: LockedAttachmentGalleryItem): boolean {\n  const sourceType = getSourceType(item.mimeType)\n  return sourceType === 'video' || sourceType === 'audio'\n}\n\n/**\n * Mixed-media carousel used by every LockedAttachment card when its `gallery`\n * prop has 2+ items. Matches the \"Gallery\" frames in the Figma design system:\n * 337/386 aspect ratio, prev/next caret buttons, a counter pill, and a center\n * lock / play indicator that swaps based on the current item.\n */\nconst GalleryThumbnail: React.FC<GalleryThumbnailProps> = ({\n  variant,\n  gallery,\n  title,\n  showLocked,\n  paymentStatus,\n  topRight,\n}) => {\n  const [index, setIndex] = useState(0)\n  const total = gallery.length\n  const safeIndex = Math.min(index, total - 1)\n  const current = gallery[safeIndex]\n  const isVideoItem = isPlayableItem(current)\n\n  // Stop propagation so arrow taps don't bubble up to the outer preview-toggle\n  // wrapper on PreviewMediaCard / OwnMediaCard.\n  const goPrev = (e: React.MouseEvent) => {\n    e.stopPropagation()\n    setIndex((i) => Math.max(0, i - 1))\n  }\n  const goNext = (e: React.MouseEvent) => {\n    e.stopPropagation()\n    setIndex((i) => Math.min(total - 1, i + 1))\n  }\n  const atStart = safeIndex === 0\n  const atEnd = safeIndex === total - 1\n\n  const isDark = variant === 'dark'\n\n  // Locked + unlocked render entirely separate trees so the locked state\n  // doesn't end up stacking a blurred `<img>` on top of an underlying\n  // `AttachmentThumbnail` (whose `bg-white/10` poster shell otherwise\n  // shows through as a visible horizontal seam).\n  //\n  // The locked placeholder is absolutely positioned, so it needs the fixed\n  // 337/386 box for height; unlocked content (video, natural-sized image)\n  // manages its own height and can expand/shrink per item.\n  //\n  // The locked branch uses `filter: blur` on a single full-size `<img>`\n  // — not `backdrop-filter` — so the rounded corners are clipped\n  // normally without any clip-path workarounds (see SingleThumbnail).\n  return (\n    <div\n      className={classNames(\n        'group relative overflow-hidden rounded-t-md',\n        showLocked ? 'aspect-[337/386]' : undefined\n      )}\n    >\n      {showLocked ? (\n        <div\n          className={classNames(\n            'absolute inset-0',\n            isDark ? 'bg-white/10' : 'bg-black/5'\n          )}\n        >\n          {current.thumbnailUrl && (\n            <img\n              src={current.thumbnailUrl}\n              alt=\"\"\n              aria-hidden\n              draggable={false}\n              // `scale-110` hides the fuzzy edge that `filter: blur` leaves\n              // around the image bounds.\n              className=\"absolute inset-0 h-full w-full scale-110 object-cover blur-[40px]\"\n            />\n          )}\n        </div>\n      ) : (\n        <AttachmentThumbnail\n          key={safeIndex}\n          mimeType={current.mimeType}\n          sourceUrl={current.sourceUrl}\n          thumbnailUrl={current.thumbnailUrl}\n          title={title}\n          variant={variant}\n          mediaPlayerProps={{ autoPlay: true }}\n        />\n      )}\n\n      {/* LOCK while locked. Once unlocked, video/audio autoplays via\n          `mediaPlayerProps` and MediaPlayer already has its own inline\n          controls, so no separate Play affordance is shown. */}\n      {showLocked && (\n        <LockBadge\n          paymentStatus={paymentStatus}\n          isPlayable={isVideoItem}\n          isLocked={showLocked}\n        />\n      )}\n\n      {total > 1 && (\n        <React.Fragment>\n          <button\n            type=\"button\"\n            onClick={goPrev}\n            disabled={atStart}\n            aria-label=\"Previous item\"\n            className={classNames(\n              'absolute left-3 top-1/2 -translate-y-1/2 flex size-7 items-center justify-center rounded-full bg-black/30 text-white transition-opacity',\n              atStart ? 'opacity-40' : 'hover:bg-black/40'\n            )}\n          >\n            <CaretLeftIcon className=\"size-5\" weight=\"bold\" />\n          </button>\n          <button\n            type=\"button\"\n            onClick={goNext}\n            disabled={atEnd}\n            aria-label=\"Next item\"\n            className={classNames(\n              'absolute right-3 top-1/2 -translate-y-1/2 flex size-7 items-center justify-center rounded-full bg-black/30 text-white transition-opacity',\n              atEnd ? 'opacity-40' : 'hover:bg-black/40'\n            )}\n          >\n            <CaretRightIcon className=\"size-5\" weight=\"bold\" />\n          </button>\n\n          <div className=\"pointer-events-none absolute bottom-10 left-1/2 flex size-8 -translate-x-1/2 items-center justify-center rounded-full bg-black/30\">\n            <span className=\"text-xs font-medium leading-none text-white\">\n              {safeIndex + 1}/{total}\n            </span>\n          </div>\n        </React.Fragment>\n      )}\n\n      {topRight && (\n        <div className=\"pointer-events-auto absolute right-3 top-3 z-10\">\n          {topRight}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default GalleryThumbnail\n","import classNames from 'classnames'\nimport React from 'react'\n\nimport {\n  AttachmentThumbnail,\n  renderTypeIcon,\n} from '../../../../AttachmentCard'\nimport type { LockedAttachmentSource, PaymentStatus } from '../../types'\n\nimport { LockBadge } from './LockBadge'\nimport type { CardVariant } from './MediaShell'\n\nexport interface SingleThumbnailProps {\n  variant: CardVariant\n  mimeType: string\n  thumbnailUrl?: string\n  title?: string\n  /**\n   * When provided, the underlying source is shown unblurred (preview / unlocked state).\n   * When undefined, the thumbnail is treated as locked: blurred with a central lock badge.\n   */\n  source?: LockedAttachmentSource\n  /**\n   * Forces the locked appearance even when a source is provided. Used for the\n   * Composer card where the locked treatment is the default and the user toggles\n   * a preview in place.\n   */\n  showLocked: boolean\n  paymentStatus?: PaymentStatus\n  /** Top-right overlay (e.g. dismiss X on Composer). Rendered inside the thumbnail. */\n  topRight?: React.ReactNode\n  /** When true, renders the unlocked image with aspect-video + object-contain. */\n  containedImage?: boolean\n}\n\n/**\n * Renders the 180px-tall media area for a LockedAttachment card.\n * Handles three visual states:\n *   - locked:       blurred thumbnail + centered 48px lock badge\n *   - preview/paid: clear thumbnail (the underlying source)\n *   - empty:        type-icon placeholder\n */\nconst SingleThumbnail: React.FC<SingleThumbnailProps> = ({\n  variant,\n  mimeType,\n  thumbnailUrl,\n  title,\n  source,\n  showLocked,\n  paymentStatus,\n  topRight,\n  containedImage = false,\n}) => {\n  const effectiveSourceUrl = showLocked ? undefined : source?.sourceUrl\n  const effectiveThumbnailUrl = showLocked\n    ? thumbnailUrl\n    : (source?.thumbnailUrl ?? thumbnailUrl)\n\n  const isDark = variant === 'dark'\n\n  // Locked + unlocked render entirely separate trees so the locked state\n  // doesn't end up stacking a blurred `<img>` on top of an underlying\n  // `AttachmentThumbnail` (whose `bg-white/10` poster shell otherwise\n  // shows through as a visible horizontal seam at the 16:9 boundary).\n  //\n  // The locked branch uses `filter: blur` on a single full-size `<img>`\n  // — not `backdrop-filter` — because `backdrop-filter` paints in its\n  // own compositing layer that escapes ancestor `overflow: hidden` on\n  // Chrome/Safari and flattens the card's top corners. `filter` is\n  // clipped normally, so the rounded corners stay round without any\n  // clip-path workarounds.\n  return (\n    <div className=\"relative overflow-hidden rounded-t-md\">\n      {showLocked ? (\n        <div\n          className={classNames(\n            'relative aspect-video overflow-hidden',\n            isDark ? 'bg-white/10' : 'bg-black/5'\n          )}\n        >\n          {effectiveThumbnailUrl ? (\n            <img\n              src={effectiveThumbnailUrl}\n              alt=\"\"\n              aria-hidden\n              draggable={false}\n              // `scale-110` hides the fuzzy semi-transparent edge that\n              // `filter: blur` leaves around the image bounds.\n              className=\"absolute inset-0 h-full w-full scale-110 object-cover blur-[40px]\"\n            />\n          ) : (\n            <div className=\"absolute inset-0 flex items-center justify-center\">\n              {renderTypeIcon(mimeType, {\n                className: isDark\n                  ? 'size-12 text-white/20'\n                  : 'size-12 text-black/20',\n                weight: 'regular',\n              })}\n            </div>\n          )}\n          <LockBadge\n            paymentStatus={paymentStatus}\n            mimeType={mimeType}\n            isLocked={showLocked}\n          />\n        </div>\n      ) : (\n        <AttachmentThumbnail\n          mimeType={mimeType}\n          sourceUrl={effectiveSourceUrl}\n          thumbnailUrl={effectiveThumbnailUrl}\n          title={title}\n          variant={variant}\n          containedImage={containedImage}\n          mediaPlayerProps={\n            effectiveSourceUrl\n              ? { autoPlay: true, loop: true, controls: true, muted: false }\n              : undefined\n          }\n        />\n      )}\n\n      {topRight && (\n        <div className=\"pointer-events-auto absolute right-3 top-3 z-10\">\n          {topRight}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport default SingleThumbnail\n","import { ImagesIcon } from '@phosphor-icons/react'\nimport type React from 'react'\n\nimport type {\n  LockedAttachmentGalleryItem,\n  LockedAttachmentSource,\n  PaymentStatus,\n} from '../../types'\n\nimport GalleryThumbnail from './GalleryThumbnail'\nimport type { CardVariant } from './MediaShell'\nimport SingleThumbnail from './SingleThumbnail'\n\nexport interface CardThumbnailProps {\n  variant: CardVariant\n  gallery: LockedAttachmentGalleryItem[]\n  title?: string\n  showLocked: boolean\n  paymentStatus?: PaymentStatus\n  /** Single-asset props — ignored when the card renders as a gallery. */\n  mimeType: string\n  thumbnailUrl?: string\n  source?: LockedAttachmentSource\n  containedImage?: boolean\n  /** Top-right overlay (e.g. Composer dismiss X). Rendered inside the thumbnail. */\n  topRight?: React.ReactNode\n}\n\n/** True when the card should render as a mixed-media carousel (2+ items). */\nexport const isGalleryCard = (\n  gallery: LockedAttachmentGalleryItem[]\n): boolean => gallery.length >= 2\n\n/**\n * The body-row icon a card shows when it renders as a gallery — `CardBody`\n * otherwise auto-detects the icon from `mimeType`. Returned as a ready node so\n * every card shares the same size/tone treatment.\n */\nexport const galleryBodyIcon = (\n  variant: CardVariant\n): React.ReactNode => (\n  <ImagesIcon\n    className={\n      variant === 'dark'\n        ? 'size-5 shrink-0 text-white/55'\n        : 'size-5 shrink-0 text-black/55'\n    }\n  />\n)\n\n/**\n * Owns the single-vs-gallery thumbnail decision shared by Composer /\n * `LockedAttachment.Media` cards: renders `GalleryThumbnail` for a 2+ item `gallery`,\n * else `SingleThumbnail` for the single asset. Callers pass the superset of\n * props; the unused half is ignored by whichever branch renders.\n */\nconst CardThumbnail: React.FC<CardThumbnailProps> = ({\n  variant,\n  gallery,\n  title,\n  showLocked,\n  paymentStatus,\n  mimeType,\n  thumbnailUrl,\n  source,\n  containedImage,\n  topRight,\n}) =>\n  isGalleryCard(gallery) ? (\n    <GalleryThumbnail\n      variant={variant}\n      gallery={gallery}\n      title={title}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n      topRight={topRight}\n    />\n  ) : (\n    <SingleThumbnail\n      variant={variant}\n      mimeType={mimeType}\n      thumbnailUrl={thumbnailUrl}\n      title={title}\n      source={source}\n      showLocked={showLocked}\n      paymentStatus={paymentStatus}\n      topRight={topRight}\n      containedImage={containedImage}\n    />\n  )\n\nexport default CardThumbnail\n","import classNames from 'classnames'\nimport React from 'react'\n\nexport type CardVariant = 'dark' | 'light'\n\nexport interface MediaShellProps {\n  variant: CardVariant\n  children: React.ReactNode\n  rootRef?: React.Ref<HTMLDivElement>\n  'data-testid'?: string\n}\n\n/**\n * Outer chrome for every LockedAttachment card.\n * Mirrors the 16px radius treatment from the Figma design system.\n */\nconst MediaShell: React.FC<MediaShellProps> = ({\n  variant,\n  children,\n  rootRef,\n  'data-testid': dataTestId,\n}) => (\n  <div\n    ref={rootRef}\n    data-testid={dataTestId}\n    className={classNames(\n      'relative w-[280px] select-none overflow-hidden rounded-md',\n      variant === 'dark' ? 'bg-[#1e2330]' : 'bg-white',\n      'shadow-[0_1px_2px_rgba(0,0,0,0.08)]'\n    )}\n  >\n    {children}\n  </div>\n)\n\nexport default MediaShell\n","import React from 'react'\n\nexport interface PreviewToggleProps {\n  /** Toggles the preview; omit to render `children` with no wrapper at all (nothing to toggle). */\n  onToggle: (() => void | Promise<void>) | undefined\n  isBusy: boolean\n  isPreviewVisible: boolean\n  children: React.ReactNode\n}\n\n/**\n * Makes a locked thumbnail clickable to toggle its preview. Uses a\n * `role=\"button\"` div rather than a native `<button>` because the thumbnail\n * it wraps can itself contain interactive children (gallery carousel arrows,\n * a Composer dismiss X) — nesting a real `<button>` around those would\n * produce invalid, inaccessible nested-interactive-element markup.\n */\nconst PreviewToggle: React.FC<PreviewToggleProps> = ({\n  onToggle,\n  isBusy,\n  isPreviewVisible,\n  children,\n}) => {\n  if (!onToggle) return <React.Fragment>{children}</React.Fragment>\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={isBusy ? -1 : 0}\n      aria-label=\"Toggle preview\"\n      aria-busy={isBusy}\n      aria-pressed={isPreviewVisible}\n      aria-disabled={isBusy || undefined}\n      onClick={isBusy ? undefined : onToggle}\n      onKeyDown={(e) => {\n        if (isBusy) return\n        // Only handle keys that originate on the wrapper itself, not on\n        // inner interactive elements (dismiss X, carousel arrows). Without\n        // this guard, pressing Enter/Space on a focused child would bubble\n        // up and toggle the preview in addition to activating the child.\n        if (e.target !== e.currentTarget) return\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault()\n          void onToggle()\n        }\n      }}\n      className={\n        !isBusy\n          ? 'block w-full cursor-pointer text-left'\n          : 'block w-full text-left'\n      }\n    >\n      {children}\n    </div>\n  )\n}\n\nexport default PreviewToggle\n","import { useCallback, useRef, useState } from 'react'\n\nimport type { LockedAttachmentSource } from '../../types'\n\nexport interface UsePreviewToggleOptions {\n  /** Gallery items carry their own per-item sources on the `gallery` prop already, so toggling skips the async fetch entirely. */\n  isGallery: boolean\n  /**\n   * Lazily loads the underlying source; the resolved value is cached in\n   * `source` and reused on subsequent toggles.\n   */\n  onFetchSource?: () => Promise<LockedAttachmentSource | void>\n  /** Fired on every toggle tap, before any visibility/fetch logic runs. */\n  onPreviewClick?: () => void\n}\n\nexport interface UsePreviewToggleResult {\n  source: LockedAttachmentSource | undefined\n  isPreviewVisible: boolean\n  isLoadingPreview: boolean\n  handleToggle: () => Promise<void>\n  /**\n   * `handleToggle` when the card can actually be previewed (gallery, or a\n   * fetch/click handler is wired), else `undefined` — pass straight to\n   * `PreviewToggle.onToggle` so a non-previewable card renders no\n   * toggle affordance.\n   */\n  togglePreview: (() => Promise<void>) | undefined\n}\n\n/**\n * Shared preview-toggle state for Composer/Media isMine: flips a locked thumbnail to\n * its unlocked preview, lazily fetching and caching the source on first\n * reveal. Media !isMine doesn't use this — it fetches on scroll-into-view/paid\n * instead of on a toggle tap.\n */\nexport function usePreviewToggle({\n  isGallery,\n  onFetchSource,\n  onPreviewClick,\n}: UsePreviewToggleOptions): UsePreviewToggleResult {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n  const [isPreviewVisible, setIsPreviewVisible] = useState(false)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n  const fetchingRef = useRef(false)\n\n  const handleToggle = useCallback(async () => {\n    onPreviewClick?.()\n    if (isPreviewVisible) {\n      setIsPreviewVisible(false)\n      return\n    }\n    if (isGallery) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (source) {\n      setIsPreviewVisible(true)\n      return\n    }\n    if (!onFetchSource) return\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    setIsLoadingPreview(true)\n    try {\n      const result = await onFetchSource()\n      if (result) {\n        setSource(result)\n        setIsPreviewVisible(true)\n      }\n    } finally {\n      fetchingRef.current = false\n      setIsLoadingPreview(false)\n    }\n  }, [isPreviewVisible, isGallery, source, onPreviewClick, onFetchSource])\n\n  const togglePreview =\n    isGallery || onFetchSource != null || onPreviewClick != null\n      ? handleToggle\n      : undefined\n\n  return {\n    source,\n    isPreviewVisible,\n    isLoadingPreview,\n    handleToggle,\n    togglePreview,\n  }\n}\n","import { useCallback, useEffect, useRef, useState } from 'react'\n\nimport type {\n  FetchSourceHandler,\n  LockedAttachmentSource,\n  PaymentStatus,\n} from '../../types'\n\nexport interface UseReceivedSourceOptions {\n  paymentStatus?: PaymentStatus\n  onFetchSource?: FetchSourceHandler\n  /** Called on Unlock click while the card is still unpaid (opens checkout). */\n  onUnlockClick?: () => void\n}\n\nexport interface UseReceivedSourceResult {\n  source: LockedAttachmentSource | undefined\n  /** Attach to the card root so the paid-source auto-fetch can observe it. */\n  cardRef: React.RefObject<HTMLDivElement>\n  /** Fetches the source when already paid, else defers to `onUnlockClick`. */\n  handleUnlockClick: () => void\n}\n\n/**\n * Media !isMine's source-reveal logic: unlike Composer/Media isMine's\n * tap-to-toggle (`usePreviewToggle`), the recipient's card reveals its source\n * by fetching once — on click when already paid, or automatically the first\n * time a paid card scrolls fully into view. The fetch is guarded so it runs\n * at most once in flight.\n */\nexport function useReceivedSource({\n  paymentStatus,\n  onFetchSource,\n  onUnlockClick,\n}: UseReceivedSourceOptions): UseReceivedSourceResult {\n  const [source, setSource] = useState<LockedAttachmentSource | undefined>()\n\n  const cardRef = useRef<HTMLDivElement>(null)\n  const fetchingRef = useRef(false)\n\n  const onFetchSourceRef = useRef(onFetchSource)\n  onFetchSourceRef.current = onFetchSource\n\n  const fetchSource = useCallback(async (): Promise<void> => {\n    if (fetchingRef.current) return\n    fetchingRef.current = true\n    try {\n      const result = await onFetchSourceRef.current?.()\n      if (result) setSource(result)\n    } finally {\n      fetchingRef.current = false\n    }\n  }, [])\n\n  const handleUnlockClick = useCallback(() => {\n    if (paymentStatus === 'paid') {\n      void fetchSource()\n    } else {\n      onUnlockClick?.()\n    }\n  }, [paymentStatus, fetchSource, onUnlockClick])\n\n  // Auto-fetch the source once the paid card scrolls into view.\n  useEffect(() => {\n    if (!cardRef.current) return\n    if (paymentStatus !== 'paid' || source !== undefined) return\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          void fetchSource()\n          observer.disconnect()\n        }\n      },\n      { threshold: 1.0 }\n    )\n\n    observer.observe(cardRef.current)\n    return () => observer.disconnect()\n  }, [paymentStatus, source, fetchSource])\n\n  return { source, cardRef, handleUnlockClick }\n}\n","import { DownloadSimpleIcon, LockSimpleIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nimport LoadingDots from '../_shared/LoadingDots'\n\nexport interface ReceivedCardActionsProps {\n  /** Whether the card is currently locked. Drives which CTA we render. */\n  isLocked: boolean\n  /**\n   * When unlocked, the URL used as the Download link's `href` (opens in a new\n   * tab). When omitted, the Download CTA falls back to a plain `<button>`\n   * that just calls `onDownloadClicked` — useful for galleries where the\n   * single-source URL doesn't exist.\n   */\n  sourceUrl?: string\n  /** Optional alternate href that takes precedence over `sourceUrl`. */\n  redeemUrl?: string\n  onUnlockClicked?: () => void\n  onDownloadClicked?: () => void\n  isUnlocking?: boolean\n}\n\nconst buttonClass =\n  'mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928]'\n\n/**\n * Renders the primary CTA below the body of a Received card.\n * - Locked + onUnlockClicked → \"Unlock\" button\n * - Unlocked + onDownloadClicked + (redeemUrl || sourceUrl) → \"Download\" link\n * - Unlocked + onDownloadClicked + no URL → \"Download\" button (e.g. gallery)\n * Otherwise renders nothing.\n */\nconst ReceivedCardActions: React.FC<ReceivedCardActionsProps> = ({\n  isLocked,\n  sourceUrl,\n  redeemUrl,\n  onUnlockClicked,\n  onDownloadClicked,\n  isUnlocking = false,\n}) => {\n  if (isLocked && onUnlockClicked != null) {\n    return (\n      <button\n        type=\"button\"\n        onClick={onUnlockClicked}\n        disabled={isUnlocking}\n        aria-label={isUnlocking ? 'Unlocking' : 'Unlock'}\n        aria-busy={isUnlocking}\n        title={isUnlocking ? 'Unlocking' : 'Unlock'}\n        className={buttonClass}\n      >\n        {isUnlocking ? (\n          <LoadingDots />\n        ) : (\n          <React.Fragment>\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" />\n            Unlock\n          </React.Fragment>\n        )}\n      </button>\n    )\n  }\n\n  if (!isLocked && onDownloadClicked != null) {\n    const href = redeemUrl ?? sourceUrl\n    if (href != null) {\n      return (\n        <a\n          href={href}\n          aria-label=\"Download\"\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={onDownloadClicked}\n          className={`${buttonClass} !text-white`}\n        >\n          <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n          Download\n        </a>\n      )\n    }\n\n    return (\n      <button\n        type=\"button\"\n        onClick={onDownloadClicked}\n        aria-label=\"Download\"\n        className={buttonClass}\n      >\n        <DownloadSimpleIcon className=\"size-4\" weight=\"bold\" />\n        Download\n      </button>\n    )\n  }\n\n  return null\n}\n\nexport default ReceivedCardActions\n","import { PencilSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport React from 'react'\n\nimport { getSourceType } from '../../../../AttachmentCard'\nimport CardBody from '../_shared/CardBody'\nimport CardThumbnail, {\n  galleryBodyIcon,\n  isGalleryCard,\n} from '../_shared/CardThumbnail'\nimport MediaShell from '../_shared/MediaShell'\nimport PreviewToggle from '../_shared/PreviewToggle'\nimport PurchaseStatusBadge from '../_shared/PurchaseStatusBadge'\nimport { usePreviewToggle } from '../_shared/usePreviewToggle'\nimport { useReceivedSource } from '../_shared/useReceivedSource'\n\nimport ReceivedCardActions from './CardActions'\nimport type {\n  MediaCardDraftProps,\n  MediaCardOtherProps,\n  MediaCardOwnProps,\n  MediaCardPreviewProps,\n  MediaCardProps,\n} from './types'\n\nexport type { MediaCardProps } from './types'\n\n/**\n * Media card while still drafting — the locked thumbnail (single or gallery)\n * the composer taps to preview the attachment they're about to send, plus\n * the title/price body with optional dismiss X and edit pencil.\n */\nconst DraftMediaCard: React.FC<MediaCardDraftProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle,\n  placeholderAmountText,\n  gallery = [],\n  onDismiss,\n  onPreviewClick,\n  onFetchSource,\n  onEditClick,\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  // Gallery is always previewable in the composer because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const { source, isPreviewVisible, isLoadingPreview, togglePreview } =\n    usePreviewToggle({ isGallery, onFetchSource, onPreviewClick })\n\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-white/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-white/55'\n            : 'text-xs font-medium text-white/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  const dismissButton = onDismiss ? (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        // Stop the click from bubbling up into the outer preview-toggle\n        // wrapper when both are wired up at the same time.\n        e.stopPropagation()\n        onDismiss()\n      }}\n      className=\"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white\"\n      aria-label=\"Dismiss attachment\"\n    >\n      <XIcon className=\"size-3\" weight=\"bold\" />\n    </button>\n  ) : undefined\n\n  const editButton = onEditClick ? (\n    <button\n      type=\"button\"\n      onClick={onEditClick}\n      aria-label=\"Edit attachment\"\n      className=\"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n    >\n      <PencilSimpleIcon className=\"size-5\" weight=\"regular\" />\n    </button>\n  ) : undefined\n\n  return (\n    <MediaShell variant=\"dark\">\n      <PreviewToggle\n        onToggle={togglePreview}\n        isBusy={isBusy}\n        isPreviewVisible={!showLocked}\n      >\n        <CardThumbnail\n          variant=\"dark\"\n          gallery={gallery}\n          title={title}\n          showLocked={showLocked}\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          source={source}\n          topRight={dismissButton}\n        />\n      </PreviewToggle>\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={isGallery ? galleryBodyIcon('dark') : undefined}\n        trailingAction={editButton}\n      />\n    </MediaShell>\n  )\n}\n\n/**\n * Static mockup of what the recipient will see before purchase — always\n * locked/blurred (the lock badge renders from `showLocked` alone, no toggle\n * wiring needed), no interactivity, no real content revealed.\n */\nconst PreviewMediaCard: React.FC<MediaCardPreviewProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle,\n  placeholderAmountText,\n  gallery = [],\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  const statusBadge = (\n    <React.Fragment>\n      <span className=\"text-xs font-medium text-black/55\">&bull;</span>\n      <span\n        className={\n          amountText\n            ? 'text-xs font-medium text-black/55'\n            : 'text-xs font-medium text-black/30'\n        }\n      >\n        {amountText || placeholderAmountText}\n      </span>\n    </React.Fragment>\n  )\n\n  return (\n    <MediaShell variant=\"light\">\n      <CardThumbnail\n        variant=\"light\"\n        gallery={gallery}\n        title={title}\n        showLocked\n        mimeType={mimeType}\n        thumbnailUrl={thumbnailUrl}\n      />\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={statusBadge}\n        icon={isGallery ? galleryBodyIcon('light') : undefined}\n      />\n    </MediaShell>\n  )\n}\n/**\n * The sender's ('mine') view of a paid media attachment: the locked\n * thumbnail (single or gallery) they can tap to preview their own\n * attachment, plus the title/purchase-status body.\n */\nconst OwnMediaCard: React.FC<MediaCardOwnProps> = ({\n  title,\n  mimeType = 'application/octet-stream',\n  thumbnailUrl,\n  detail,\n  amountText,\n  placeholderTitle,\n  paymentStatus = 'pending',\n  gallery = [],\n  onPreviewClick,\n  onFetchSource,\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  // Gallery is always previewable for the sender because each item's source\n  // is already provided up-front via `gallery[*].sourceUrl`.\n  const { source, isPreviewVisible, isLoadingPreview, togglePreview } =\n    usePreviewToggle({ isGallery, onFetchSource, onPreviewClick })\n\n  const showLocked = !isPreviewVisible\n  const isBusy = isLoadingPreview\n\n  return (\n    <MediaShell variant=\"dark\">\n      <PreviewToggle\n        onToggle={togglePreview}\n        isBusy={isBusy}\n        isPreviewVisible={!showLocked}\n      >\n        <CardThumbnail\n          variant=\"dark\"\n          gallery={gallery}\n          title={title}\n          showLocked={showLocked}\n          paymentStatus={paymentStatus}\n          mimeType={mimeType}\n          thumbnailUrl={thumbnailUrl}\n          source={source}\n        />\n      </PreviewToggle>\n\n      <CardBody\n        variant=\"dark\"\n        title={title}\n        placeholderTitle={placeholderTitle}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={\n          <PurchaseStatusBadge\n            isMine={true}\n            paymentStatus={paymentStatus}\n            amountText={amountText}\n          />\n        }\n        icon={isGallery ? galleryBodyIcon('dark') : undefined}\n      />\n    </MediaShell>\n  )\n}\n\n/**\n * The recipient's ('other') view of a paid media attachment: the locked\n * thumbnail (single or gallery) with an Unlock/Download CTA. The source is\n * revealed by fetching once — on click when already paid, or automatically\n * the first time a paid card scrolls into view.\n */\nconst OtherMediaCard: React.FC<MediaCardOtherProps> = ({\n  title,\n  amountText,\n  thumbnailUrl,\n  mimeType = 'application/octet-stream',\n  detail,\n  gallery = [],\n  onUnlockClick,\n  onFetchSource,\n  onDownloadClick,\n  paymentStatus,\n  isUnlocking = false,\n}) => {\n  const isGallery = isGalleryCard(gallery)\n\n  const { source, cardRef, handleUnlockClick } = useReceivedSource({\n    paymentStatus,\n    onFetchSource,\n    onUnlockClick,\n  })\n\n  const effectiveSourceUrl = source?.sourceUrl\n  const effectiveRedeemUrl = source?.redeemUrl\n\n  // For gallery, the per-item sources are carried by `gallery` itself, so\n  // the lock state is driven by paymentStatus rather than the single\n  // `effectiveSourceUrl`. Everything else still respects the source fetch.\n  const isLocked = isGallery\n    ? paymentStatus !== 'paid'\n    : effectiveSourceUrl === undefined\n  const sourceType = getSourceType(mimeType)\n\n  // For gallery, ReceivedCardActions falls back to a plain <button>\n  // (no anchor) because the gallery has no single sourceUrl to link to —\n  // the per-item sources live on `gallery` itself.\n  const actionSourceUrl = isGallery ? undefined : effectiveSourceUrl\n\n  return (\n    <MediaShell\n      variant=\"light\"\n      rootRef={cardRef}\n      data-testid=\"locked-attachment\"\n    >\n      <CardThumbnail\n        variant=\"light\"\n        gallery={gallery}\n        title={title}\n        showLocked={isLocked}\n        paymentStatus={paymentStatus}\n        mimeType={mimeType}\n        thumbnailUrl={thumbnailUrl}\n        source={source}\n        containedImage={!isLocked && sourceType === 'document'}\n      />\n\n      <CardBody\n        variant=\"light\"\n        title={title}\n        mimeType={mimeType}\n        detail={detail}\n        statusBadge={\n          <PurchaseStatusBadge\n            isMine={false}\n            paymentStatus={paymentStatus}\n            amountText={amountText}\n          />\n        }\n        icon={isGallery ? galleryBodyIcon('light') : undefined}\n        action={\n          <ReceivedCardActions\n            isLocked={isLocked}\n            isUnlocking={isUnlocking}\n            sourceUrl={actionSourceUrl}\n            redeemUrl={effectiveRedeemUrl}\n            onUnlockClicked={handleUnlockClick}\n            onDownloadClicked={onDownloadClick}\n          />\n        }\n      />\n    </MediaShell>\n  )\n}\n\n/**\n * The card either party sees for a paid media attachment. `isDraft`/`isPreview`\n * select the composer's own drafting view / a static receiver-side mockup;\n * otherwise `isMine` selects the sender's sent view vs. the recipient's\n * unlock/download view.\n */\nconst MediaCard: React.FC<MediaCardProps> = (props) => {\n  if (props.isDraft) {\n    return <DraftMediaCard {...props} />\n  } else if (props.isPreview) {\n    return <PreviewMediaCard {...props} />\n  } else if (props.isMine) {\n    return <OwnMediaCard {...props} />\n  } else {\n    return <OtherMediaCard {...props} />\n  }\n}\n\nexport default MediaCard\n"],"names":["CardBody","variant","title","placeholderTitle","mimeType","detail","statusBadge","action","icon","trailingAction","isDark","displayTitle","titleDimmed","typeIcon","renderTypeIcon","classNames","jsxs","jsx","LockBadge","paymentStatus","isPlayable","isLocked","sourceType","getSourceType","Icon","PlayIcon","LockOpenIcon","LockSimpleIcon","isPlayableItem","item","GalleryThumbnail","gallery","showLocked","topRight","index","setIndex","useState","total","safeIndex","current","isVideoItem","goPrev","e","i","goNext","atStart","atEnd","AttachmentThumbnail","React","CaretLeftIcon","CaretRightIcon","SingleThumbnail","thumbnailUrl","source","containedImage","effectiveSourceUrl","effectiveThumbnailUrl","isGalleryCard","galleryBodyIcon","ImagesIcon","CardThumbnail","MediaShell","children","rootRef","dataTestId","PreviewToggle","onToggle","isBusy","isPreviewVisible","usePreviewToggle","isGallery","onFetchSource","onPreviewClick","setSource","setIsPreviewVisible","isLoadingPreview","setIsLoadingPreview","fetchingRef","useRef","handleToggle","useCallback","result","togglePreview","useReceivedSource","onUnlockClick","cardRef","onFetchSourceRef","fetchSource","_a","handleUnlockClick","useEffect","observer","entry","buttonClass","ReceivedCardActions","sourceUrl","redeemUrl","onUnlockClicked","onDownloadClicked","isUnlocking","LoadingDots","href","DownloadSimpleIcon","DraftMediaCard","amountText","placeholderAmountText","onDismiss","onEditClick","dismissButton","XIcon","editButton","PencilSimpleIcon","PreviewMediaCard","OwnMediaCard","PurchaseStatusBadge","OtherMediaCard","onDownloadClick","effectiveRedeemUrl","actionSourceUrl","MediaCard","props"],"mappings":"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"}

package/dist/index-BMr8tbg4.cjs

@@ -0,0 +1,2 @@
+"use strict";const t=require("react/jsx-runtime"),m=require("react"),Ss=require("@linktr.ee/messaging-core"),$e=require("stream-chat"),w=require("stream-chat-react"),_=require("@phosphor-icons/react"),k=require("classnames"),He=require("stream-chat-react/experimental"),Pt=m.createContext({service:null,client:null,isConnected:!1,isLoading:!1,error:null,capabilities:{},refreshConnection:async()=>{},debug:!1}),Ye=()=>m.useContext(Pt),Is=({children:e,user:s,serviceConfig:n,apiKey:a,capabilities:r={},debug:i=!1,client:l})=>{var C,T;const o=m.useCallback((A,...O)=>{i&&console.log(`🔥 [MessagingProvider] ${A}`,...O)},[i]);o("🔄 RENDER START",{userId:s==null?void 0:s.id,apiKey:(a==null?void 0:a.substring(0,8))+"...",serviceConfig:!!n,capabilities:Object.keys(r)});const[d,u]=m.useState(null),[f,x]=m.useState(null),[h,c]=m.useState(!1),[p,b]=m.useState(!1),[v,g]=m.useState(null),N=m.useRef(!1),j=m.useRef(null),S=m.useRef(n);S.current=n;const F=m.useRef(i);F.current=i;const E=m.useRef({userId:s==null?void 0:s.id,apiKey:a,serviceConfig:n,capabilities:r}),L=m.useRef(0);L.current++,o("📊 RENDER INFO",{renderCount:L.current,currentProps:{userId:s==null?void 0:s.id,apiKey:(a==null?void 0:a.substring(0,8))+"..."},propChanges:{userChanged:E.current.userId!==(s==null?void 0:s.id),apiKeyChanged:E.current.apiKey!==a,serviceConfigChanged:E.current.serviceConfig!==n,capabilitiesChanged:E.current.capabilities!==r}}),E.current={userId:s==null?void 0:s.id,apiKey:a,serviceConfig:n,capabilities:r};const $=m.useRef(null);!l&&a&&((C=$.current)==null?void 0:C.apiKey)!==a&&($.current={apiKey:a,client:new $e.StreamChat(a)});const P=l||(a?((T=$.current)==null?void 0:T.client)??null:null);m.useEffect(()=>{const A=L.current,O=S.current;if(l){j.current=null,u(null),x(null),c(!1),g(null),b(!1);return}if(!a||!P||!O){o("⚠️ SERVICE INIT SKIPPED",{renderCount:A,reason:"Missing apiKey, client, or serviceConfig"});return}o("🚀 CREATING SERVICE",{renderCount:A,apiKey:(a==null?void 0:a.substring(0,8))+"..."});const B=new Ss.StreamChatService({...O,apiKey:a,debug:F.current,client:P});j.current=B,u(B),o("✅ SERVICE SET",{renderCount:A,serviceInstance:!!B})},[a,P,l]);const D=m.useRef(null);m.useEffect(()=>{var O,B;if(o("🔗 USER CONNECTION EFFECT TRIGGERED",{hasService:!!d,hasUser:!!s,userId:s==null?void 0:s.id,isConnecting:N.current,isConnected:h,dependencies:{service:!!d,userId:s==null?void 0:s.id}}),l)return;if(!d||!s){o("⚠️ USER CONNECTION SKIPPED","Missing service or user");return}if(N.current){o("⚠️ USER CONNECTION SKIPPED","Already connecting");return}if(((O=D.current)==null?void 0:O.serviceId)===d&&((B=D.current)==null?void 0:B.userId)===s.id){o("⚠️ USER CONNECTION SKIPPED","Already connected this user with this service");return}(async()=>{o("🚀 STARTING USER CONNECTION",{userId:s.id}),N.current=!0,b(!0),g(null);try{o("📞 CALLING SERVICE.CONNECTUSER",{userId:s.id});const V=await d.connectUser(s);x(V),c(!0),D.current={serviceId:d,userId:s.id},o("✅ USER CONNECTION SUCCESS",{userId:s.id,clientId:V.userID})}catch(V){const K=V instanceof Error?V.message:"Connection failed";g(K),o("❌ USER CONNECTION ERROR",{userId:s.id,error:K})}finally{b(!1),N.current=!1,o("🔄 USER CONNECTION FINISHED",{userId:s.id,isConnected:h})}})()},[d,s,o,h,l]),m.useEffect(()=>{const A=P;return()=>{var O;A&&(D.current=null,(O=j.current)==null||O.disconnectUser().catch(console.error))}},[P]);const I=m.useCallback(async()=>{if(o("🔄 REFRESH CONNECTION CALLED",{hasService:!!d,hasUser:!!s}),!l){if(!d||!s){o("⚠️ REFRESH CONNECTION SKIPPED","Missing service or user");return}o("🚀 STARTING CONNECTION REFRESH",{userId:s.id}),b(!0);try{o("🔌 DISCONNECTING FOR REFRESH"),await d.disconnectUser(),o("📞 RECONNECTING FOR REFRESH");const A=await d.connectUser(s);x(A),c(!0),g(null),o("✅ CONNECTION REFRESH SUCCESS",{userId:s.id})}catch(A){const O=A instanceof Error?A.message:"Refresh failed";g(O),o("❌ CONNECTION REFRESH ERROR",{userId:s.id,error:O})}finally{b(!1),o("🔄 CONNECTION REFRESH FINISHED",{userId:s.id})}}},[d,s,o,l]),M=m.useMemo(()=>(o("💫 CONTEXT VALUE MEMOIZATION",{hasService:!!d,hasClient:!!f,isConnected:h,isLoading:p,hasError:!!v,capabilitiesKeys:Object.keys(r)}),{service:l?null:d,client:l??f,isConnected:l?!0:h,isLoading:l?!1:p,error:l?null:v,capabilities:r,refreshConnection:I,debug:i}),[d,f,l,h,p,v,r,I,i,o]);return o("🔄 RENDER END",{renderCount:L.current,willRenderChat:!!P,contextValueReady:!!M}),t.jsx(Pt.Provider,{value:M,children:P?t.jsx(w.Chat,{client:P,customClasses:{channelList:"str-chat__channel-list str-chat__channel-list-react bg-transparent lg:border-r-2 border-r-0 border-[#0000000A]"},children:e}):e})},Ot=()=>Ye(),qe=e=>{var a,r;const[s,n]=m.useState(!!((r=(a=e==null?void 0:e.state)==null?void 0:a.membership)!=null&&r.pinned_at));return m.useEffect(()=>{var l;if(!e){n(!1);return}n(!!((l=e.state.membership)!=null&&l.pinned_at));const i=o=>{var d;n(o!=null&&o.member?!!o.member.pinned_at:!!((d=e.state.membership)!=null&&d.pinned_at))};return e.on("member.updated",i),()=>{e.off("member.updated",i)}},[e]),s},Es="linktree-official",Ms="linktree-official-sender";function ge(e,s,n){const a=Object.values(e||{});if(n===Es){const r=a.find(i=>{var l;return((l=i.user)==null?void 0:l.id)===Ms});if(r)return r}return a.find(r=>{var i;return((i=r.user)==null?void 0:i.id)&&r.user.id!==s})}const Ts=/^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;function $t(e){return Ts.test(e.trim())}function Et(e,s){const n=e==null?void 0:e.trim();return!n||s&&n===s?!1:!$t(n)}function Ie(e){return Et(e==null?void 0:e.name,e==null?void 0:e.id)?e.name.trim():Et(e==null?void 0:e.username,e==null?void 0:e.id)?e.username.trim():"Unknown member"}const Mt=[{emoji:"🍎",bgColor:"#FFD1DD"},{emoji:"🍌",bgColor:"#FFF1C9"},{emoji:"🍇",bgColor:"#E6D9FF"},{emoji:"🍊",bgColor:"#D6F4FF"},{emoji:"🍓",bgColor:"#FFE0AE"},{emoji:"🥥",bgColor:"#F7E7D8"},{emoji:"🍒",bgColor:"#DFF4D8"},{emoji:"🥭",bgColor:"#FFD8C2"},{emoji:"🍉",bgColor:"#D6EBFF"},{emoji:"🍋",bgColor:"#CAEEB5"},{emoji:"🥝",bgColor:"#FFE7C7"},{emoji:"🫒",bgColor:"#F6E3B4"},{emoji:"🍈",bgColor:"#D9F7E1"}];function As(e){let s=0;for(let n=0;n<e.length;n++){const a=e.charCodeAt(n);s=(s<<5)-s+a,s=s&s}return Math.abs(s)}function Bt(e){return Mt[As(e)%Mt.length]}function Rs(e){return Bt(e).emoji}function Ls(e){return Bt(e).bgColor}const Q=({id:e,image:s,size:n=40,className:a,starred:r=!1,shape:i="squircle",dmAgentEnabled:l=!1})=>{const o=Rs(e),d=Ls(e),u=.45,x=n<32?Math.round(n*u):n<56?14:n<120?18:36,h=n>=40?2:1,c=i==="circle"?{borderRadius:"50%"}:{borderRadius:"1rem"},p=t.jsx("div",{className:"h-full w-full overflow-hidden",style:c,children:s?t.jsx("img",{src:s,alt:"",className:"h-full w-full object-cover"}):t.jsx("div",{"aria-hidden":"true",className:k("avatar-fallback flex h-full w-full items-center justify-center font-semibold select-none transition-colors"),style:{fontSize:x,lineHeight:1},children:o})});return t.jsxs("div",{className:k("relative flex-shrink-0",a),style:{"--str-chat__avatar-size":`${n}px`,width:`${n}px`,height:`${n}px`,backgroundColor:s?void 0:d,...c},children:[r&&t.jsx("div",{"aria-hidden":"true",className:"absolute -left-1.5 -top-1.5 z-10 flex size-5 items-center justify-center rounded-full bg-white shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]",children:t.jsx(_.StarIcon,{className:"size-3 text-yellow-600",weight:"duotone"})}),t.jsx("div",{"data-testid":"avatar-ring",className:k("h-full w-full","bg-transparent"),style:{...c,...l&&{borderWidth:`${h}px`,borderStyle:"solid",borderColor:"var(--AI-Gradient, #7F22FE)",boxShadow:"inset 0 1px 2px 0 rgba(255, 255, 255, 0.5)"}},children:p})]})},Ds="https://linktr.ee/s/about/trust-center/report",Fs=({channel:e,participant:s,showBlockParticipant:n=!0,enabled:a=!0,onLeaveConversation:r,onBlockParticipant:i,onDeleteConversationClick:l,onBlockParticipantClick:o,onReportParticipantClick:d,onActionComplete:u,logLabel:f="useChannelModerationActions"})=>{var M;const{service:x,debug:h}=Ye(),c=(M=s==null?void 0:s.user)==null?void 0:M.id,p=!!(a&&n&&x&&c),[b,v]=m.useState(!1),[g,N]=m.useState(null),[j,S]=m.useState(!1),[F,E]=m.useState(!1),L=p&&((g==null?void 0:g.participantId)!==c||(g==null?void 0:g.service)!==x);return m.useEffect(()=>{if(!p||!x||!c){v(!1),N(null);return}let C=!1;return(async()=>{try{const T=await x.getBlockedUsers();if(C)return;v(T.some(A=>A.blocked_user_id===c))}catch(T){C||console.error(`[${f}] Failed to check blocked status:`,T)}finally{C||N({participantId:c,service:x})}})(),()=>{C=!0}},[p,x,c,f]),{isParticipantBlocked:b,isCheckingBlockedStatus:L,isLeaving:j,isUpdatingBlockStatus:F,handleLeaveConversation:async()=>{var C;if(!j){l==null||l(),h&&console.log(`[${f}] Leave conversation`,e.cid),S(!0);try{const T=((C=e._client)==null?void 0:C.userID)??null;await e.hide(T,!1),r&&await r(e),u==null||u()}catch(T){console.error(`[${f}] Failed to leave conversation`,T)}finally{S(!1)}}},handleBlockUser:async()=>{var C,T,A;if(!(F||!x)){o==null||o(),h&&console.log(`[${f}] Block member`,(C=s==null?void 0:s.user)==null?void 0:C.id),E(!0);try{await x.blockUser((T=s==null?void 0:s.user)==null?void 0:T.id),i&&await i((A=s==null?void 0:s.user)==null?void 0:A.id),u==null||u()}catch(O){console.error(`[${f}] Failed to block member`,O)}finally{E(!1)}}},handleUnblockUser:async()=>{var C,T,A;if(!(F||!x)){o==null||o(),h&&console.log(`[${f}] Unblock member`,(C=s==null?void 0:s.user)==null?void 0:C.id),E(!0);try{await x.unBlockUser((T=s==null?void 0:s.user)==null?void 0:T.id),i&&await i((A=s==null?void 0:s.user)==null?void 0:A.id),u==null||u()}catch(O){console.error(`[${f}] Failed to unblock member`,O)}finally{E(!1)}}},handleReportUser:()=>{d==null||d(),u==null||u(),window.open(Ds,"_blank","noopener,noreferrer")}}},me=({variant:e="default",className:s,children:n,...a})=>{const r=e==="danger";return t.jsx("button",{type:"button",className:k("flex w-full items-center gap-3 rounded-lg px-4 py-3 text-left text-sm transition-colors focus-ring disabled:cursor-not-allowed disabled:opacity-60",r?"text-danger hover:bg-danger/50":"text-charcoal hover:bg-sand",s),...a,children:n})},Be=({channel:e,participant:s,showDeleteConversation:n=!0,showBlockParticipant:a=!0,showReportParticipant:r=!0,onLeaveConversation:i,onBlockParticipant:l,onDeleteConversationClick:o,onBlockParticipantClick:d,onReportParticipantClick:u,customChannelActions:f,triggerClassName:x})=>{const[h,c]=m.useState(!1),p=m.useRef(null),b=m.useId(),v=m.useCallback(()=>c(!1),[]),{isParticipantBlocked:g,isCheckingBlockedStatus:N,isLeaving:j,isUpdatingBlockStatus:S,handleLeaveConversation:F,handleBlockUser:E,handleUnblockUser:L,handleReportUser:$}=Fs({channel:e,participant:s,showBlockParticipant:a,enabled:h,onLeaveConversation:i,onBlockParticipant:l,onDeleteConversationClick:o,onBlockParticipantClick:d,onReportParticipantClick:u,onActionComplete:v,logLabel:"ChannelActionsMenu"});return m.useEffect(()=>{if(!h)return;const D=M=>{p.current&&!p.current.contains(M.target)&&c(!1)},I=M=>{M.key==="Escape"&&c(!1)};return document.addEventListener("mousedown",D),document.addEventListener("keydown",I),()=>{document.removeEventListener("mousedown",D),document.removeEventListener("keydown",I)}},[h]),!s||!(n||a||r||!!f)?null:t.jsxs("div",{ref:p,className:"relative",children:[t.jsxs("button",{className:x,type:"button","aria-haspopup":"true","aria-expanded":h,"aria-controls":h?b:void 0,onClick:()=>c(D=>!D),children:[t.jsx(_.DotsThreeIcon,{className:"size-5 text-black/90"}),t.jsx("span",{className:"sr-only",children:"More options"})]}),h&&t.jsx("div",{id:b,"aria-label":"Conversation options",className:k("absolute right-0 top-full z-50 mt-2 w-56 overflow-hidden","rounded-lg border border-sand bg-white p-1 shadow-max-elevation-light"),children:t.jsxs("ul",{className:"flex flex-col gap-1",children:[n&&t.jsx("li",{children:t.jsxs(me,{onClick:F,disabled:j,"aria-busy":j,children:[j?t.jsx(_.SpinnerGapIcon,{className:"h-5 w-5 animate-spin"}):t.jsx(_.SignOutIcon,{className:"h-5 w-5"}),t.jsx("span",{children:"Delete Conversation"})]})}),a&&t.jsx("li",{children:N?t.jsxs(me,{disabled:!0,"aria-busy":!0,children:[t.jsx(_.SpinnerGapIcon,{className:"h-5 w-5 animate-spin"}),t.jsx("span",{children:"Block"})]}):g?t.jsxs(me,{onClick:L,disabled:S,"aria-busy":S,children:[S?t.jsx(_.SpinnerGapIcon,{className:"h-5 w-5 animate-spin"}):t.jsx(_.ProhibitInsetIcon,{className:"h-5 w-5"}),t.jsx("span",{children:"Unblock"})]}):t.jsxs(me,{onClick:E,disabled:S,"aria-busy":S,children:[S?t.jsx(_.SpinnerGapIcon,{className:"h-5 w-5 animate-spin"}):t.jsx(_.ProhibitInsetIcon,{className:"h-5 w-5"}),t.jsx("span",{children:"Block"})]})}),r&&t.jsx("li",{children:t.jsxs(me,{variant:"danger",onClick:$,children:[t.jsx(_.FlagIcon,{className:"h-5 w-5"}),t.jsx("span",{children:"Report"})]})}),f]})})]})},Le="flex size-10 flex-shrink-0 items-center justify-center rounded-full bg-white/65 shadow-[0px_4px_8px_0px_rgba(0,0,0,0.06),0px_0px_0px_1px_rgba(0,0,0,0.04)] backdrop-blur-[40px] transition-filter duration-150 hover:brightness-95 aria-expanded:brightness-95 focus-ring",zs="CUSTOMER_PAID",Ps="Replies instantly with AI assistant",Os=e=>typeof e=="string"&&e.trim().replace(/[\s-]+/g,"_").toUpperCase()===zs,$s=({className:e,onBack:s,showBackButton:n,showStarButton:a=!1,dmAgentEnabled:r=!1,onLeaveConversation:i,onBlockParticipant:l,showDeleteConversation:o=!0,showBlockParticipant:d=!0,showReportParticipant:u=!0,onDeleteConversationClick:f,onBlockParticipantClick:x,onReportParticipantClick:h,customChannelActions:c,renderChannelActions:p,showChannelInfo:b=!0,onParticipantNameClick:v})=>{var P,D,I,M;const{channel:g}=w.useChannelStateContext(),{client:N}=w.useChatContext(),j=m.useMemo(()=>{var C;return ge((C=g.state)==null?void 0:C.members,N==null?void 0:N.userID,g.type)},[(P=g.state)==null?void 0:P.members,N==null?void 0:N.userID,g.type]),S=Ie(j==null?void 0:j.user),F=(D=j==null?void 0:j.user)==null?void 0:D.image,E=qe(g),L=Os((I=g.data)==null?void 0:I.customer_tag)&&(j==null?void 0:j.is_follower)===!0,$=async()=>{try{E?await g.unpin():await g.pin()}catch(C){console.error("[ChannelHeaderRedesign] Failed to update pinned status:",C)}};return t.jsx("div",{className:k("@container bg-[linear-gradient(180deg,#FBFAF9_0%,rgba(251,250,249,0.92)_58%,rgba(251,250,249,0)_100%)]",e),children:t.jsxs("div",{className:"grid min-h-[100px] grid-cols-[minmax(40px,1fr)_auto_minmax(40px,1fr)] items-start pb-2 pt-5 @lg:min-h-[104px] @lg:pt-6",children:[t.jsx("div",{className:"flex items-start",children:n&&t.jsx("button",{className:k(Le,"messaging-channel-view-back-button-mobile messaging-channel-view-back-button-desktop"),onClick:s||(()=>{}),type:"button","aria-label":"Back to conversations",children:t.jsx(_.ArrowLeftIcon,{className:"size-5 text-black/90"})})}),t.jsx("div",{className:"flex min-w-0 justify-center","data-dd-privacy":"mask",children:t.jsxs("button",{type:"button",onClick:v,"aria-label":`View details for ${S}`,className:"group flex min-w-0 max-w-full appearance-none flex-col items-center border-0 bg-transparent px-2 focus-ring focus-visible:outline-none",children:[t.jsx(Q,{id:((M=j==null?void 0:j.user)==null?void 0:M.id)||g.id||"unknown",name:S,image:F,dmAgentEnabled:r,shape:"circle",size:48,className:"-mb-2"}),t.jsxs("span",{className:"relative z-10 flex max-w-full flex-col items-center justify-center rounded-full border border-white/10 bg-white/65 py-1.5 pl-3 pr-2 shadow-[0px_0px_0px_0px_rgba(0,0,0,0.04),0px_1px_2px_0px_rgba(0,0,0,0.04),0px_8px_32px_0px_rgba(0,0,0,0.1)] backdrop-blur-[2px] transition-filter duration-150 group-hover:brightness-95",children:[t.jsxs("span",{className:"flex max-w-full items-center justify-center",children:[t.jsx("span",{className:"min-w-0 truncate text-sm font-bold leading-[1.43] tracking-[0.28px] text-black/90",children:S}),t.jsxs("span",{className:"ml-2 flex gap-1",children:[L&&t.jsx("span",{"aria-label":"Paid customer",className:"flex size-4 shrink-0 items-center justify-center rounded-full bg-[#34C759] text-white",children:t.jsx(_.CurrencyDollarIcon,{className:"size-2.5",weight:"bold"})}),a&&E&&t.jsx("span",{"aria-label":"Starred conversation",className:"flex size-4 shrink-0 items-center justify-center rounded-full bg-[#FFD60A] text-white",children:t.jsx(_.StarIcon,{className:"size-2.5",weight:"fill"})}),t.jsx(_.CaretRightIcon,{"aria-hidden":"true",className:"size-4 shrink-0 text-black/65",weight:"bold"})]})]}),r&&t.jsxs("span",{className:"mt-1 flex items-center gap-1 px-1 pb-0.5 text-[10px] leading-3 text-black/55",children:[t.jsx(_.SparkleIcon,{className:"size-3 shrink-0 text-black/55"}),t.jsx("span",{children:Ps})]})]})]})}),t.jsxs("div",{className:"flex items-start justify-end gap-2",children:[a&&t.jsx("button",{className:Le,onClick:$,type:"button","aria-pressed":E,"aria-label":E?"Unstar conversation":"Star conversation",children:t.jsx(_.StarIcon,{className:k("size-5",{"text-[#FFD60A]":E,"text-black/90":!E}),weight:E?"fill":"regular"})}),b&&(p!==void 0?p:t.jsx(Be,{channel:g,participant:j,showDeleteConversation:o,showBlockParticipant:d,showReportParticipant:u,onLeaveConversation:i,onBlockParticipant:l,onDeleteConversationClick:f,onBlockParticipantClick:x,onReportParticipantClick:h,customChannelActions:c,triggerClassName:Le}))]})]})})},Bs=e=>t.jsx(w.DateSeparator,{...e,position:"center"}),Ue="vote_up",Ve="vote_down";function Us(e){return e!=null&&e.length?e.some(s=>s.type===Ve)?"down":e.some(s=>s.type===Ue)?"up":null:null}function Ut(e){const{channel:s}=w.useChannelStateContext(),{client:n}=w.useChatContext("useMessageVote"),a=m.useMemo(()=>Us(e.own_reactions),[e.own_reactions]),r=m.useCallback(async()=>{if(n!=null&&n.userID)try{a==="up"?await s.deleteReaction(e.id,Ue):await s.sendReaction(e.id,{type:Ue},{enforce_unique:!0,skip_push:!0})}catch{}},[s,n==null?void 0:n.userID,e.id,a]),i=m.useCallback(async()=>{if(n!=null&&n.userID)try{a==="down"?await s.deleteReaction(e.id,Ve):await s.sendReaction(e.id,{type:Ve},{enforce_unique:!0,skip_push:!0})}catch{}},[s,n==null?void 0:n.userID,e.id,a]);return{selected:a,voteUp:r,voteDown:i}}function Vt(e){return(e==null?void 0:e.trim().toLowerCase().split(/[-_]/)[0])||void 0}function Xe({message:e,viewerLanguage:s}){var r;const n=e==null?void 0:e.text,a=Vt(s);return a?((r=e==null?void 0:e.i18n)==null?void 0:r[`${a}_text`])??n:n}const Vs=[[/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 se(e){return e.startsWith("video/")?"video":e.startsWith("audio/")?"audio":e.startsWith("image/")?"image":"document"}function Gt(e){const s=Vs.find(([n])=>n.test(e));return s?s[1]:"generic"}const Gs={video:_.VideoCameraIcon,audio:_.SpeakerHighIcon,image:_.ImageIcon,document:_.FileIcon},Hs={pdf:_.FilePdfIcon,doc:_.FileDocIcon,xls:_.FileXlsIcon,csv:_.FileCsvIcon,ppt:_.FilePptIcon,zip:_.FileZipIcon,text:_.FileTextIcon,markdown:_.FileMdIcon,generic:_.FileIcon};function Ys(e){const s=se(e);return s!=="document"?Gs[s]:Hs[Gt(e)]}function oe(e,s){return m.createElement(Ys(e),s)}const qs=e=>{var s,n;return"touches"in e?((s=e.touches[0])==null?void 0:s.clientX)??((n=e.changedTouches[0])==null?void 0:n.clientX)??0:e.clientX},Xs=({source:e,mimeType:s,poster:n,autoPlay:a=!1,playing:r,loop:i=!1,controls:l=!0,showProgress:o=!1,muted:d=!1,onContainerClick:u})=>{const f=se(s),x=m.useRef(null),h=m.useRef(null),c=m.useRef(null),p=m.useRef(r),[b,v]=m.useState(a),[g,N]=m.useState(0),[j,S]=m.useState(!1),[F,E]=m.useState(!1),[L,$]=m.useState(!1),[P,D]=m.useState(!1),[I,M]=m.useState(!0),[C,T]=m.useState(null),A=m.useCallback(()=>{$(!1),v(!0)},[]),O=m.useCallback(y=>{const R=h.current;if(!R)return 0;const G=R.getBoundingClientRect();return Math.max(0,Math.min(1,(qs(y)-G.left)/G.width))},[]),B=m.useCallback(y=>{const R=x.current;R&&R.duration&&(R.currentTime=y*R.duration)},[]),V=y=>{y.stopPropagation(),S(!0);const R=O(y);N(R),B(R)};m.useEffect(()=>{r!==void 0&&r!==p.current&&(p.current=r,v(r))},[r]),m.useEffect(()=>{if(!b){c.current!==null&&(cancelAnimationFrame(c.current),c.current=null);return}const y=()=>{const R=x.current;R&&R.duration&&!j&&N(R.currentTime/R.duration),c.current=requestAnimationFrame(y)};return c.current=requestAnimationFrame(y),()=>{c.current!==null&&cancelAnimationFrame(c.current)}},[b,j]),m.useEffect(()=>{const y=x.current;y&&(b?y.play().catch(R=>{v(!1),$(!0)}):y.pause())},[b]),m.useEffect(()=>{if(!j)return;const y=G=>N(O(G)),R=G=>{S(!1),B(O(G))};return window.addEventListener("mousemove",y),window.addEventListener("mouseup",R),window.addEventListener("touchmove",y,{passive:!0}),window.addEventListener("touchend",R),()=>{window.removeEventListener("mousemove",y),window.removeEventListener("mouseup",R),window.removeEventListener("touchmove",y),window.removeEventListener("touchend",R)}},[j,O,B]);const K=C?{aspectRatio:String(C)}:void 0,Z=C?"":" aspect-video",X=Math.round(g*100);return t.jsxs("div",{role:"button",tabIndex:0,className:`relative cursor-pointer overflow-hidden bg-black ${Z}`,style:K,onClick:y=>{if(u){u(y);return}L||l&&v(R=>!R)},onKeyDown:y=>{if(!(y.key!=="Enter"&&y.key!==" ")){if(y.preventDefault(),u){u(y);return}L||l&&v(R=>!R)}},children:[n&&(f==="audio"||I)&&t.jsx("img",{src:n,alt:"",className:"absolute inset-0 h-full w-full object-cover"}),!n&&(f==="audio"||I)&&t.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:oe(s,{className:"size-12 text-black/20",weight:"regular"})}),t.jsx("div",{className:"absolute inset-0",children:f==="audio"?t.jsx("audio",{ref:x,src:e,loop:i,muted:d,style:{width:"100%",height:"100%"},onLoadStart:()=>D(!0),onCanPlay:()=>{D(!1),M(!1)},onWaiting:()=>D(!0),onPlay:()=>$(!1),onEnded:()=>{i||(v(!1),N(0))},children:t.jsx("track",{kind:"captions"})}):t.jsx("video",{ref:x,src:e,loop:i,muted:d,playsInline:!0,style:{width:"100%",height:"100%"},onLoadStart:()=>D(!0),onCanPlay:()=>{D(!1),M(!1)},onWaiting:()=>D(!0),onPlay:()=>$(!1),onLoadedMetadata:()=>{const y=x.current;y instanceof HTMLVideoElement&&y.videoWidth&&y.videoHeight&&T(y.videoWidth/y.videoHeight)},onEnded:()=>{i||(v(!1),N(0))},children:t.jsx("track",{kind:"captions"})})}),P&&!L&&t.jsx("div",{className:"absolute inset-0 z-10 flex items-center justify-center",children:t.jsx(_.CircleNotchIcon,{className:"size-8 animate-spin text-white/80",weight:"bold"})}),L&&!l&&t.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:y=>{y.stopPropagation(),A()},onKeyDown:y=>{y.key!=="Enter"&&y.key!==" "||(y.preventDefault(),y.stopPropagation(),A())},children:t.jsx("span",{className:"flex size-16 items-center justify-center rounded-full bg-white/20 text-white backdrop-blur-sm",children:t.jsx(_.PlayIcon,{className:"size-9 translate-x-0.5",weight:"fill"})})}),o&&!l&&t.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:t.jsx("div",{role:"slider","aria-label":"Playback position","aria-valuenow":X,"aria-valuemin":0,"aria-valuemax":100,tabIndex:0,ref:h,className:"relative flex h-4 w-full cursor-pointer items-center",onMouseDown:V,onTouchStart:V,onClick:y=>y.stopPropagation(),onKeyDown:y=>{y.key==="ArrowRight"&&B(Math.min(1,g+.05)),y.key==="ArrowLeft"&&B(Math.max(0,g-.05))},children:t.jsx("div",{className:"w-full overflow-hidden rounded-full bg-white/30 h-1",children:t.jsx("div",{className:"h-full rounded-full bg-white",style:{width:`${X}%`}})})})}),l&&t.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:[t.jsx("button",{type:"button",onClick:y=>{y.stopPropagation(),v(R=>!R)},className:"shrink-0 text-white","aria-label":b?"Pause":"Play",children:b?t.jsx(_.PauseIcon,{className:"size-5",weight:"fill"}):t.jsx(_.PlayIcon,{className:"size-5 translate-x-px",weight:"fill"})}),t.jsxs("div",{role:"slider","aria-label":"Playback position","aria-valuenow":X,"aria-valuemin":0,"aria-valuemax":100,tabIndex:0,ref:h,className:"relative flex h-4 w-full cursor-pointer items-center",onMouseDown:V,onTouchStart:V,onClick:y=>y.stopPropagation(),onMouseEnter:()=>E(!0),onMouseLeave:()=>E(!1),onKeyDown:y=>{y.key==="ArrowRight"&&B(Math.min(1,g+.05)),y.key==="ArrowLeft"&&B(Math.max(0,g-.05))},children:[t.jsx("div",{className:`w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${F||j?"h-1.5":"h-1"}`,children:t.jsx("div",{className:"h-full rounded-full bg-white",style:{width:`${X}%`}})}),t.jsx("div",{className:`absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${F||j?"scale-100 opacity-100":"scale-0 opacity-0"}`,style:{left:`${X}%`}})]})]})]})},Tt=e=>e==="dark"?"size-12 text-white/20":"size-12 text-black/20",Ws=e=>e==="dark"?"aspect-video overflow-hidden bg-white/10":"aspect-video overflow-hidden bg-black/5",We=({mimeType:e,sourceUrl:s,thumbnailUrl:n,title:a,variant:r,mediaPlayerProps:i,containedImage:l=!1})=>{const o=se(e),[d,u]=m.useState(!1);return s&&(o==="video"||o==="audio")?t.jsx(Xs,{source:s,mimeType:e,poster:n,controls:!0,...i}):s&&o==="image"?l?t.jsx("div",{className:"relative aspect-video overflow-hidden bg-black/5",children:t.jsx("img",{src:s,alt:a??"",className:`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${d?"opacity-100":"opacity-0"}`,draggable:!1,onLoad:()=>u(!0)})}):t.jsx("img",{src:s,alt:a??"",className:"block w-full",draggable:!1}):s&&o==="document"?n?l?t.jsx("div",{className:"relative aspect-video overflow-hidden bg-black/5",children:t.jsx("img",{src:n,alt:a??"",className:`absolute inset-0 h-full w-full object-contain transition-opacity duration-300 ${d?"opacity-100":"opacity-0"}`,draggable:!1,onLoad:()=>u(!0)})}):t.jsx("img",{src:n,alt:"",className:"block w-full",draggable:!1}):t.jsx("div",{className:`flex aspect-video w-full items-center justify-center ${r==="dark"?"bg-white/10":"bg-black/5"}`,children:oe(e,{className:Tt(r),weight:"regular"})}):n?t.jsx("div",{className:`relative ${Ws(r)}`,children:t.jsx("img",{src:n,alt:a??"",draggable:!1,className:"absolute inset-0 h-full w-full object-cover"})}):t.jsx("div",{className:`flex aspect-video w-full items-center justify-center ${r==="dark"?"bg-white/10":"bg-black/5"}`,children:oe(e,{className:Tt(r),weight:"regular"})})},Ht=({variant:e,thumbnail:s,title:n,placeholderTitle:a="Attachment title",mimeType:r,detail:i,statusBadge:l,action:o,topLeft:d,topRight:u,rootRef:f,"data-testid":x})=>{const h=e==="dark",c=h?n??a:n??"",p=h&&!n;return t.jsxs("div",{ref:f,"data-testid":x,className:k("relative w-[280px] select-none overflow-hidden rounded-[24px] shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]",h?"bg-[#1e2330]":"bg-white"),children:[d?t.jsx("div",{className:"pointer-events-auto absolute left-3 top-3 z-50",children:d}):null,u?t.jsx("div",{className:"pointer-events-auto absolute right-3 top-3 z-50",children:u}):null,s,t.jsxs("div",{className:"px-4 pb-3 pt-3",children:[c.trim()!==""&&t.jsx("p",{className:k("mb-0.5 truncate text-base font-medium",{"text-black":!h,"text-white/30":h&&p,"text-white":h&&!p}),children:c}),t.jsxs("div",{className:"flex flex-wrap items-center gap-1",children:[oe(r,{className:k("size-5 shrink-0",h?"text-white/55":"text-black/55"),weight:"regular"}),i!=null&&i!==""&&t.jsx("span",{className:k("text-xs font-medium",h?"text-white/55":"text-black/55"),children:i}),l]}),o]})]})};function Yt(e){return e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(1)} KB`:`${(e/(1024*1024)).toFixed(1)} MB`}function Ke(e){return`w-[280px] select-none overflow-hidden rounded-[24px] ${e?"bg-[#1e2330]":"bg-[#F3F3F1]"} shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]`}function Ks(e){return e?"bg-white/10":"bg-black/5"}function Zs(e){return e?"text-white":"text-black"}function Js(e){return e?"text-white/55":"text-black/55"}function Qs(e){return e?"text-white/40":"text-black/40"}function en(e){return e?"text-white/20":"text-black/20"}const Ze=({attachment:e,isMyMessage:s})=>{const{title:n,text:a,image_url:r,og_scrape_url:i,title_link:l}=e,o=i??l,d=typeof o=="string"&&o.trim()!==""?o:void 0,u=t.jsxs(m.Fragment,{children:[t.jsx("div",{className:"p-2",children:r?t.jsx("img",{src:r,alt:n??"",className:"aspect-video w-full rounded-[20px] object-cover"}):t.jsx("div",{className:`aspect-video w-full rounded-[20px] ${Ks(s)} flex items-center justify-center`,children:t.jsx(_.LinkIcon,{className:`size-12 ${en(s)}`})})}),t.jsxs("div",{className:"px-3 pb-3",children:[n&&t.jsx("p",{className:`truncate text-[14px] font-medium leading-5 ${Zs(s)}`,children:n}),a&&t.jsx("p",{className:`truncate text-[12px] leading-4 ${Js(s)}`,children:a}),d&&t.jsx("p",{className:`mt-1 truncate text-[12px] leading-4 ${Qs(s)}`,children:d})]})]});return d?t.jsx("a",{href:d,target:"_blank",rel:"noopener noreferrer",className:"block no-underline",children:u}):t.jsx("div",{className:"block",children:u})};function Je(e){return e.type==="link"||!!e.og_scrape_url&&!e.asset_url}function Ee(e){var s;return(s=e.attachments)==null?void 0:s.find(Je)}async function tn(e,s){let n;try{n=s??new URL(e).pathname.split("/").pop()??"download"}catch{n=s??"download"}const a=await fetch(e,{mode:"cors"});if(!a.ok)throw new Error(`HTTP ${a.status}`);const r=await a.blob(),i=URL.createObjectURL(r),l=document.createElement("a");l.href=i,l.download=n,l.style.display="none",document.body.appendChild(l),l.click(),document.body.removeChild(l),URL.revokeObjectURL(i)}const sn=({url:e,filename:s})=>{const[n,a]=m.useState(!1),r=i=>{i.stopPropagation();const l=window.open("","_blank","noopener,noreferrer");a(!0),tn(e,s).then(()=>{l==null||l.close()}).catch(()=>{l&&(l.location.href=e)}).finally(()=>a(!1))};return t.jsx("button",{type:"button",onClick:r,disabled: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",children:n?t.jsx(_.CircleNotchIcon,{className:"size-4 animate-spin text-white",weight:"bold"}):t.jsxs(m.Fragment,{children:[t.jsx(_.DownloadSimpleIcon,{className:"size-4 text-white",weight:"bold"}),"Download"]})})};function Me(e){var x,h,c,p;const s=(x=e.attachments)==null?void 0:x.find(b=>b.type==="video"&&b.asset_url),n=(h=e.attachments)==null?void 0:h.find(b=>b.type==="image"&&b.image_url),a=(c=e.attachments)==null?void 0:c.find(b=>b.type==="audio"&&b.asset_url),r=(p=e.attachments)==null?void 0:p.find(b=>b.type==="file"&&b.asset_url),i=s??n??a??r,l=(s==null?void 0:s.asset_url)??(n==null?void 0:n.image_url)??(a==null?void 0:a.asset_url)??(r==null?void 0:r.asset_url);if(!l)return null;const o=(i==null?void 0:i.mime_type)??((i==null?void 0:i.type)==="image"?"image/jpeg":(i==null?void 0:i.type)==="video"?"video/mp4":(i==null?void 0:i.type)==="audio"?"audio/mpeg":"application/octet-stream"),d=i==null?void 0:i.title,u=i==null?void 0:i.file_size,f=s==null?void 0:s.thumb_url;return{resolvedUrl:l,resolvedType:o,title:d,fileSize:u,thumbnailUrl:f}}const qt=({resolvedUrl:e,resolvedType:s,title:n,fileSize:a,thumbnailUrl:r})=>{const i=a!==void 0?Yt(a):void 0;return t.jsx(Ht,{variant:"dark",title:n,placeholderTitle:"",mimeType:s,detail:i,thumbnail:t.jsx(We,{mimeType:s,sourceUrl:e,thumbnailUrl:r,title:n,variant:"dark"})})},Xt=({resolvedUrl:e,resolvedType:s,title:n,fileSize:a,thumbnailUrl:r})=>{const i=se(s),l=a!==void 0?Yt(a):void 0;return t.jsx(Ht,{variant:"light",title:n,mimeType:s,detail:l,thumbnail:t.jsx(We,{mimeType:s,sourceUrl:e,thumbnailUrl:r,title:n,variant:"light",containedImage:i==="image"||i==="document"}),action:t.jsx(sn,{url:e,filename:n})})},nn=({message:e,isMyMessage:s=!1})=>{const n=Ee(e),a=Me(e);if(!n&&!a)return null;const r=s?"str-chat__message str-chat__message-simple str-chat__message--me str-chat__message-simple--me":"str-chat__message str-chat__message-simple str-chat__message--other";return t.jsxs("div",{className:r,"data-dd-privacy":"mask",children:[!s&&e.user&&t.jsx(Q,{className:"str-chat__avatar str-chat__message-sender-avatar",id:e.user.id,image:e.user.image,name:e.user.name??e.user.id}),t.jsx("div",{className:"str-chat__message-inner",style:{marginInlineEnd:0,marginInlineStart:0},children:t.jsx("div",{className:"str-chat__message-bubble-wrapper",children:t.jsx("div",{className:"str-chat__message-bubble","data-attachment-bubble":"true",style:{padding:0,borderRadius:0,overflow:"visible",background:"transparent"},children:n?t.jsx("div",{className:Ke(s),children:t.jsx(Ze,{attachment:n,isMyMessage:s})}):s?t.jsx(qt,{...a}):t.jsx(Xt,{...a})})})})]})},an=({message:e})=>{const s=Ee(e);if(s)return t.jsx("div",{className:Ke(!0),"data-dd-privacy":"mask",children:t.jsx(Ze,{attachment:s,isMyMessage:!0})});const n=Me(e);return n?t.jsx("div",{style:{display:"contents"},"data-dd-privacy":"mask",children:t.jsx(qt,{...n})}):null},rn=({message:e})=>{const s=Ee(e);if(s)return t.jsx("div",{className:Ke(!1),"data-dd-privacy":"mask",children:t.jsx(Ze,{attachment:s,isMyMessage:!1})});const n=Me(e);return n?t.jsx("div",{style:{display:"contents"},"data-dd-privacy":"mask",children:t.jsx(Xt,{...n})}):null},on=Object.assign(nn,{Creator:an,Visitor:rn}),ln={dark:"bg-[#1e2330]",light:"bg-[#f2f1ef]"},cn={dark:"text-white",light:"text-[#000000]"},dn={dark:"border-white/[0.08]",light:"border-black/[0.08]"},un=e=>e==="dark"?"sender":"receiver",mn={sender:{single:"rounded-tl-[18px] rounded-tr-[18px] rounded-bl-[18px] rounded-br-[18px]",first:"rounded-tl-[18px] rounded-tr-[18px] rounded-bl-[18px] rounded-br-[4px]",middle:"rounded-tl-[18px] rounded-tr-[4px] rounded-bl-[18px] rounded-br-[4px]",end:"rounded-tl-[18px] rounded-tr-[4px] rounded-bl-[18px] rounded-br-[18px]"},receiver:{single:"rounded-tl-[18px] rounded-tr-[18px] rounded-bl-[18px] rounded-br-[18px]",first:"rounded-tl-[18px] rounded-tr-[18px] rounded-bl-[4px] rounded-br-[18px]",middle:"rounded-tl-[4px] rounded-tr-[18px] rounded-bl-[4px] rounded-br-[18px]",end:"rounded-tl-[4px] rounded-tr-[18px] rounded-bl-[18px] rounded-br-[18px]"}},pe=({variant:e,text:s,bordered:n=!0,groupPosition:a="single",className:r,children:i,"data-testid":l})=>{const o=s!=null&&s!=="",d=mn[un(e)][a];return t.jsxs("div",{"data-testid":l,"data-group-position":a,className:k("relative w-[280px] overflow-hidden px-2 py-2",d,ln[e],cn[e],n&&"border",n&&dn[e],r),children:[i,o?t.jsx("p",{className:k("whitespace-pre-wrap break-words leading-snug","pt-2","px-2"),children:s}):null]})},be=({onClick:e,variant:s="overlay",ariaLabel:n="Dismiss attachment"})=>t.jsx("button",{type:"button",onClick:a=>{a.stopPropagation(),e()},"aria-label":n,className:k("flex size-6 items-center justify-center rounded-full text-white",s==="overlay"?"bg-[#121110]/85 backdrop-blur":"bg-white/15 hover:bg-white/25"),children:t.jsx(_.XIcon,{className:"size-3",weight:"bold"})}),ve=e=>e==="received"?"light":"dark",Wt=({firstOfGroup:e,endOfGroup:s,groupedByUser:n})=>!n||e&&s?"single":e?"first":s?"end":"middle",xn=({src:e,mimeType:s,filename:n,items:a})=>a&&a.length>0?a:e?[{src:e,mimeType:s,filename:n}]:[],hn=({item:e,preload:s,trailingAction:n})=>t.jsxs("div",{className:"flex items-center gap-2",children:[t.jsx("audio",{src:e.src,controls:!0,preload:e.preload??s,className:"block min-w-0 flex-1",children:e.mimeType?t.jsx("source",{src:e.src,type:e.mimeType}):null}),n??null]}),Qe=({state:e,src:s,mimeType:n,filename:a,items:r,text:i,groupPosition:l,preload:o,onDismiss:d})=>{const u=ve(e),f=e==="composer"&&!!d,x=xn({src:s,mimeType:n,filename:a,items:r});if(x.length===0)return null;const h=o??(x.length>1?"none":"metadata");return t.jsx(pe,{variant:u,text:i,groupPosition:l,"data-testid":"audio-attachment",children:t.jsx("div",{className:"flex flex-col gap-2",children:x.map((c,p)=>t.jsx(hn,{item:c,preload:h,trailingAction:f&&p===0?t.jsx(be,{onClick:d,variant:"inline"}):void 0},`${c.src}-${p}`))})})},fn=e=>t.jsx(Qe,{...e,state:"composer"}),gn=e=>t.jsx(Qe,{...e,state:"sent"}),pn=e=>t.jsx(Qe,{...e,state:"received"}),bn={Composer:fn,Sent:gn,Received:pn};function Kt(e){return!Number.isFinite(e)||e<0?"":e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(1)} KB`:e<1024*1024*1024?`${(e/(1024*1024)).toFixed(2)} MB`:`${(e/(1024*1024*1024)).toFixed(2)} GB`}const vn={pdf:"PDF",doc:"DOC",xls:"XLS",csv:"CSV",ppt:"PPT",zip:"ZIP",text:"TXT",markdown:"MD"};function Zt(e,s){if(s){const r=s.lastIndexOf(".");if(r>0&&r<s.length-1){const i=s.slice(r+1);if(i&&i.length<=5)return i.toUpperCase()}}if(!e)return;if(se(e)==="document"){const r=Gt(e),i=vn[r];if(i)return i;if(e==="application/octet-stream")return}const a=e.split("/")[1];if(!(!a||a==="*"))return a.toUpperCase()}function Jt(e,s,n){const a=Zt(e,s),r=typeof n=="number"&&n>0?Kt(n):void 0;return[a,r].filter(Boolean).join(" · ")||void 0}function te(e){try{const n=new URL(e).pathname.split("/").pop();return n&&n.length>0?decodeURIComponent(n):"download"}catch{return"download"}}const jn={dark:"text-white/55",light:"text-black/65"},wn={dark:"bg-white/10",light:"bg-black/5"},_n={dark:"text-white/85",light:"text-black/85"},Qt=({variant:e,filename:s,title:n,mimeType:a="application/octet-stream",fileSize:r,onActivate:i,activateLabel:l,trailingAction:o})=>{const d=n??s??"File",u=Jt(a,s,r),f=t.jsx("div",{className:k("flex size-10 shrink-0 items-center justify-center rounded-sm",wn[e]),"aria-hidden":!0,children:oe(a,{className:k("size-6",_n[e]),weight:"regular"})}),x=t.jsxs("div",{className:"flex min-w-0 flex-1 flex-col text-left",children:[t.jsx("p",{className:"truncate font-medium leading-snug",children:d}),u?t.jsx("p",{className:k("truncate text-xs leading-4",jn[e]),children:u}):null]}),h=i?t.jsxs("button",{type:"button",onClick:i,"aria-label":l,className:k("flex min-w-0 flex-1 items-center gap-3 rounded-sm text-left transition-colors",e==="dark"?"hover:bg-white/[0.04]":"hover:bg-black/[0.04]"),children:[f,x]}):t.jsxs(t.Fragment,{children:[f,x]});return t.jsxs("div",{className:"flex items-center gap-3 px-3 py-2",children:[h,o?t.jsx("div",{className:"shrink-0",children:o}):null]})};async function es(e,s){const n=s??te(e);try{const a=await fetch(e,{mode:"cors"});if(!a.ok)throw new Error(`HTTP ${a.status}`);const r=await a.blob(),i=URL.createObjectURL(r),l=document.createElement("a");l.href=i,l.download=n,l.style.display="none",document.body.appendChild(l),l.click(),document.body.removeChild(l),URL.revokeObjectURL(i)}catch{if(!window.open(e,"_blank","noopener,noreferrer")){const r=document.createElement("a");r.href=e,r.download=n,r.target="_blank",r.rel="noopener noreferrer",r.style.display="none",document.body.appendChild(r),r.click(),document.body.removeChild(r)}}}const Nn=({src:e,filename:s,fileSize:n,mimeType:a,title:r,items:i})=>i&&i.length>0?i:e?[{src:e,filename:s,fileSize:n,mimeType:a,title:r}]:[],yn=({variant:e,item:s,index:n,onActivate:a,trailingAction:r})=>{const i=s.filename??te(s.src);return t.jsx(Qt,{variant:e,filename:i,title:s.title,mimeType:s.mimeType??"application/octet-stream",fileSize:s.fileSize,onActivate:()=>a(n),activateLabel:`Download ${i}`,trailingAction:r})},et=({state:e,src:s,filename:n,fileSize:a,mimeType:r,title:i,items:l,text:o,groupPosition:d,onClick:u,onDismiss:f})=>{const x=ve(e),h=e==="composer"&&!!f,c=Nn({src:s,filename:n,fileSize:a,mimeType:r,title:i,items:l}),p=v=>{if((u==null?void 0:u(v))===!1)return;const g=c[v];if(!g)return;const N=g.filename??te(g.src);es(g.src,N)};if(c.length===0)return null;const b=t.jsx("span",{className:k("flex size-8 items-center justify-center rounded-full",x==="dark"?"text-white/70":"text-black/70"),"aria-hidden":!0,children:t.jsx(_.DownloadSimpleIcon,{className:"size-5",weight:"bold"})});return t.jsx(pe,{variant:x,text:o,groupPosition:d,"data-testid":"file-attachment",children:t.jsx("div",{className:"flex flex-col gap-2",children:c.map((v,g)=>{const N=h&&g===0?t.jsx(be,{onClick:f,variant:"inline"}):b;return t.jsx(yn,{variant:x,item:v,index:g,onActivate:p,trailingAction:N},`${v.src}-${g}`)})})})},Cn=e=>t.jsx(et,{...e,state:"composer"}),kn=e=>t.jsx(et,{...e,state:"sent"}),Sn=e=>t.jsx(et,{...e,state:"received"}),In={Composer:Cn,Sent:kn,Received:Sn},tt=({onPrev:e,onNext:s,prevLabel:n="Previous",nextLabel:a="Next"})=>t.jsxs(t.Fragment,{children:[t.jsx("button",{type:"button",onClick:e,"aria-label":n,className:"mes-media-viewer__nav mes-media-viewer__nav--prev",children:t.jsx(_.CaretLeftIcon,{size:20,weight:"bold","aria-hidden":!0})}),t.jsx("button",{type:"button",onClick:s,"aria-label":a,className:"mes-media-viewer__nav mes-media-viewer__nav--next",children:t.jsx(_.CaretRightIcon,{size:20,weight:"bold","aria-hidden":!0})})]}),ts=({url:e,filename:s,variant:n="pill",label:a="Download",iconOnly:r,tone:i="dark",onTriggered:l})=>{const[o,d]=m.useState(!1),u=m.useCallback(c=>{c.stopPropagation(),!o&&(d(!0),es(e,s).catch(()=>{}).finally(()=>{d(!1),l==null||l()}))},[o,e,s,l]),f=r??n!=="pill",h={className:k(n==="pill"?"size-4":"size-5","shrink-0"),weight:"bold"};if(n==="inline"){const c={dark:"text-white/70 hover:bg-white/[0.08] hover:text-white",light:"text-black/70 hover:bg-black/[0.08] hover:text-black"};return t.jsx("button",{type:"button",onClick:u,disabled:o,"aria-label":a,className:k("flex size-8 shrink-0 items-center justify-center rounded-full transition-colors disabled:opacity-70",c[i]),children:o?t.jsx(_.CircleNotchIcon,{className:"size-4 animate-spin",weight:"bold","aria-hidden":!0}):t.jsx(_.DownloadSimpleIcon,{className:"size-5 shrink-0",weight:"bold","aria-hidden":!0})})}return n==="viewer"?t.jsx("button",{type:"button",onClick:u,disabled:o,"aria-label":a,className:"mes-media-viewer__action",children:o?t.jsx(_.CircleNotchIcon,{size:20,weight:"bold","aria-hidden":!0}):t.jsx(_.DownloadSimpleIcon,{size:20,weight:"bold","aria-hidden":!0})}):t.jsxs("button",{type:"button",onClick:u,disabled:o,"aria-label":f?a:void 0,className:k("mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full px-4 text-sm font-medium leading-none transition-colors disabled:opacity-70",i==="dark"?"bg-[#121110] text-white hover:bg-[#2a2928]":"bg-white text-[#121110] hover:bg-white/90"),children:[o?t.jsx(_.CircleNotchIcon,{className:"size-4 animate-spin",weight:"bold","aria-hidden":!0}):t.jsx(_.DownloadSimpleIcon,{...h,"aria-hidden":!0}),f?null:a]})},De=(e,s,n)=>Math.min(Math.max(e,s),n),st=({length:e,initialIndex:s,open:n})=>{const a=De(s,0,Math.max(e-1,0)),[r,i]=m.useState(a);m.useEffect(()=>{n&&i(De(s,0,Math.max(e-1,0)))},[n,s,e]),m.useEffect(()=>{i(d=>De(d,0,Math.max(e-1,0)))},[e]);const l=m.useCallback(()=>{e<=1||i(d=>d<=0?e-1:d-1)},[e]),o=m.useCallback(()=>{e<=1||i(d=>d>=e-1?0:d+1)},[e]);return m.useEffect(()=>{if(!n||e<=1)return;const d=u=>{if(u.key!=="ArrowLeft"&&u.key!=="ArrowRight")return;const f=document.activeElement;f&&(f.tagName==="VIDEO"||f.tagName==="AUDIO")||(u.preventDefault(),u.key==="ArrowLeft"?l():o())};return window.addEventListener("keydown",d),()=>window.removeEventListener("keydown",d)},[n,e,l,o]),{index:r,prev:l,next:o}},nt=({open:e,onClose:s,ariaLabel:n,counter:a,actions:r,children:i,"data-testid":l})=>{const o=m.useRef(null),d=m.useRef(null);m.useEffect(()=>{var h;const x=o.current;if(x){if(e){if(!x.open)if(typeof x.showModal=="function")try{x.showModal()}catch{x.setAttribute("open","")}else x.setAttribute("open","");const c=typeof document<"u"?document.activeElement:null;return(h=d.current)==null||h.focus(),()=>{if(x.open)if(typeof x.close=="function")try{x.close()}catch{x.removeAttribute("open")}else x.removeAttribute("open");c&&document.body.contains(c)&&c.focus()}}if(x.open)if(typeof x.close=="function")try{x.close()}catch{x.removeAttribute("open")}else x.removeAttribute("open")}},[e]);const u=()=>{s()},f=x=>{x.target===o.current&&s()};return t.jsxs("dialog",{ref:o,className:"mes-media-viewer","aria-label":n??"Attachment viewer","data-testid":l,onClose:u,onClick:f,children:[t.jsxs("div",{className:"mes-media-viewer__chrome",children:[a?t.jsx("span",{className:"mes-media-viewer__counter",children:a}):null,t.jsxs("div",{className:"mes-media-viewer__actions",children:[r,t.jsx("button",{ref:d,type:"button",onClick:s,"aria-label":"Close viewer",className:"mes-media-viewer__action",children:t.jsx(_.XIcon,{size:20,weight:"bold","aria-hidden":!0})})]})]}),t.jsx("div",{className:"mes-media-viewer__body",children:i})]})},ss=({open:e,items:s,initialIndex:n=0,onClose:a})=>{const{index:r,prev:i,next:l}=st({length:s.length,initialIndex:n,open:e}),o=s[r],d=m.useMemo(()=>(o==null?void 0:o.filename)??(o?te(o.src):"image"),[o]);return o?t.jsxs(nt,{open:e,onClose:a,ariaLabel:d,counter:s.length>1?`${r+1} / ${s.length}`:void 0,actions:t.jsx(ts,{url:o.src,filename:d,variant:"viewer",label:`Download ${d}`}),"data-testid":"image-viewer",children:[t.jsx("img",{src:o.src,alt:o.alt??d,draggable:!1,loading:"eager",decoding:"async",className:"mes-media-viewer__image"},`${r}:${o.src}`),s.length>1?t.jsx(tt,{onPrev:i,onNext:l,prevLabel:"Previous image",nextLabel:"Next image"}):null]}):null},En="relative block size-full overflow-hidden bg-black/5 outline-none focus-visible:ring-2 focus-visible:ring-white/80 focus-visible:ring-offset-2 focus-visible:ring-offset-black",ns=({tiles:e,onTileActivate:s,maxVisible:n=4,className:a})=>{const r=e.length;if(r===0)return null;const i=e.slice(0,Math.min(r,n)),l=r-i.length,o=(d,u,f)=>{const x=k(En,"h-full w-full");return s?t.jsxs("button",{type:"button",onClick:()=>s(u),"aria-label":d.ariaLabel??`Open media ${u+1}`,className:k(x,"cursor-zoom-in"),children:[d.content,f]},u):t.jsxs("div",{className:x,children:[d.content,f]},u)};return i.length===1?t.jsx("div",{className:k("aspect-square w-full",a),children:o(i[0],0)}):i.length===2?t.jsx("div",{className:k("grid aspect-[16/9] w-full grid-cols-2 gap-0.5",a),children:i.map((d,u)=>o(d,u))}):i.length===3?t.jsxs("div",{className:k("grid aspect-[4/3] w-full grid-cols-2 grid-rows-2 gap-0.5",a),children:[t.jsx("div",{className:"row-span-2",children:o(i[0],0)}),o(i[1],1),o(i[2],2)]}):t.jsx("div",{className:k("grid aspect-[4/3] w-full grid-cols-2 grid-rows-2 gap-0.5",a),children:i.map((d,u)=>{const f=l>0&&u===i.length-1;return o(d,u,f?t.jsxs("div",{className:"absolute inset-0 flex items-center justify-center bg-black/55 text-2xl font-semibold text-white",children:["+",l]}):null)})})},je=e=>{const[s,n]=m.useState(!1),[a,r]=m.useState(0),i=m.useCallback(o=>{(e==null?void 0:e(o))!==!1&&(r(o),n(!0))},[e]),l=m.useCallback(()=>n(!1),[]);return{viewerOpen:s,viewerIndex:a,handleActivate:i,closeViewer:l}},Mn=(e,s,n,a)=>({ariaLabel:`Open image ${s+1} of ${n}`,content:t.jsx("img",{src:e.src,alt:e.alt??"",width:e.width,height:e.height,draggable:!1,loading:e.loading??a,decoding:"async",className:"absolute inset-0 size-full rounded-md object-cover"})}),Tn=({src:e,alt:s,items:n})=>n&&n.length>0?n:e?[{src:e,alt:s}]:[],as=(e,s)=>e.map((n,a)=>({src:n.src,alt:n.alt,filename:s&&e.length===1?s:s?`${s} (${a+1})`:void 0})),An=({src:e,alt:s,filename:n,loading:a="lazy",onClick:r,onDismiss:i})=>{const{viewerOpen:l,viewerIndex:o,handleActivate:d,closeViewer:u}=je(r);return t.jsxs("div",{className:"relative w-fit",children:[t.jsx("button",{type:"button",onClick:()=>d(0),"aria-label":"Open image",className:"block size-[280px] cursor-zoom-in overflow-hidden rounded-md outline-none focus-visible:ring-2 focus-visible:ring-black/40",children:t.jsx("img",{src:e,alt:s??"",draggable:!1,loading:a,decoding:"async",className:"size-full object-cover"})}),i?t.jsx("div",{className:"absolute right-2 top-2 z-10",children:t.jsx(be,{onClick:i})}):null,t.jsx(ss,{open:l,items:as([{src:e,alt:s}],n),initialIndex:o,onClose:u})]})},rs=({state:e,src:s,alt:n,filename:a,items:r,text:i,groupPosition:l,loading:o="lazy",onClick:d})=>{const u=Tn({src:s,alt:n,items:r}),f=ve(e),{viewerOpen:x,viewerIndex:h,handleActivate:c,closeViewer:p}=je(d);if(u.length===0)return null;const b=u.map((v,g)=>Mn(v,g,u.length,o));return t.jsxs(pe,{variant:f,text:i,groupPosition:l,"data-testid":"image-attachment",children:[t.jsx("div",{className:"relative",children:t.jsx(ns,{tiles:b,onTileActivate:c})}),t.jsx(ss,{open:x,items:as(u,a),initialIndex:h,onClose:p})]})},Rn=e=>t.jsx(An,{...e}),Ln=e=>t.jsx(rs,{...e,state:"sent"}),Dn=e=>t.jsx(rs,{...e,state:"received"}),Fn={Composer:Rn,Sent:Ln,Received:Dn},zn=({open:e,items:s,initialIndex:n=0,onClose:a})=>{const{index:r,prev:i,next:l}=st({length:s.length,initialIndex:n,open:e}),o=s[r],d=m.useMemo(()=>(o==null?void 0:o.filename)??(o?te(o.src):"document"),[o]),u=m.useMemo(()=>o?Pn(o.src):void 0,[o]);return!o||!u?null:t.jsxs(nt,{open:e,onClose:a,ariaLabel:d,counter:s.length>1?`${r+1} / ${s.length}`:void 0,"data-testid":"pdf-viewer",children:[t.jsx("iframe",{src:u,title:d,className:"mes-media-viewer__iframe",sandbox:"allow-scripts allow-forms allow-popups allow-downloads"},`${r}:${o.src}`),s.length>1?t.jsx(tt,{onPrev:i,onNext:l,prevLabel:"Previous document",nextLabel:"Next document"}):null]})},Pn=e=>{const s=e.indexOf("#"),n=s===-1?e:e.slice(0,s),a=s===-1?"":e.slice(s+1),r=new URLSearchParams(a);return r.has("toolbar")||r.set("toolbar","0"),r.has("navpanes")||r.set("navpanes","0"),`${n}#${r.toString()}`},On=({src:e,filename:s,fileSize:n,title:a,items:r})=>r&&r.length>0?r:e?[{src:e,filename:s,fileSize:n,title:a}]:[],$n=({variant:e,item:s,index:n,onActivate:a,trailingAction:r})=>{const i=s.filename??te(s.src);return t.jsx(Qt,{variant:e,filename:i,title:s.title,mimeType:"application/pdf",fileSize:s.fileSize,onActivate:()=>a(n),activateLabel:`Open ${i}`,trailingAction:r})},at=({state:e,src:s,filename:n,fileSize:a,title:r,items:i,text:l,groupPosition:o,onClick:d,onDismiss:u})=>{const f=ve(e),x=On({src:s,filename:n,fileSize:a,title:r,items:i}),{viewerOpen:h,viewerIndex:c,handleActivate:p,closeViewer:b}=je(d),v=e==="composer"&&!!u;if(x.length===0)return null;const g=x.map(N=>({src:N.src,filename:N.filename??te(N.src)}));return t.jsxs(pe,{variant:f,text:l,groupPosition:o,"data-testid":"pdf-attachment",children:[t.jsx("div",{className:"flex flex-col gap-2",children:x.map((N,j)=>{const S=N.filename??te(N.src),F=v&&j===0?t.jsx(be,{onClick:u,variant:"inline"}):e==="composer"?void 0:t.jsx(ts,{url:N.src,filename:S,variant:"inline",label:`Download ${S}`,tone:f});return t.jsx($n,{variant:f,item:N,index:j,onActivate:p,trailingAction:F},`${N.src}-${j}`)})}),t.jsx(zn,{open:h,items:g,initialIndex:c,onClose:b})]})},Bn=e=>t.jsx(at,{...e,state:"composer"}),Un=e=>t.jsx(at,{...e,state:"sent"}),Vn=e=>t.jsx(at,{...e,state:"received"}),Gn={Composer:Bn,Sent:Un,Received:Vn},is=({open:e,items:s,initialIndex:n=0,onClose:a})=>{const{index:r,prev:i,next:l}=st({length:s.length,initialIndex:n,open:e}),o=s[r],d=m.useMemo(()=>(o==null?void 0:o.filename)??(o?te(o.src):"video"),[o]);return o?t.jsxs(nt,{open:e,onClose:a,ariaLabel:d,counter:s.length>1?`${r+1} / ${s.length}`:void 0,"data-testid":"video-viewer",children:[t.jsx("video",{src:o.src,poster:o.poster,controls:!0,autoPlay:!0,muted:!0,playsInline:!0,preload:o.preload??"metadata",className:"mes-media-viewer__video",children:o.mimeType?t.jsx("source",{src:o.src,type:o.mimeType}):null},`${r}:${o.src}`),s.length>1?t.jsx(tt,{onPrev:i,onNext:l,prevLabel:"Previous video",nextLabel:"Next video"}):null]}):null},Hn=()=>t.jsx("div",{className:"pointer-events-none absolute inset-0 flex items-center justify-center",children:t.jsx("span",{className:"flex size-12 items-center justify-center rounded-full bg-black/55 text-white backdrop-blur",children:t.jsx(_.PlayIcon,{className:"size-6",weight:"fill","aria-hidden":!0})})}),os=({item:e,index:s})=>t.jsxs("div",{className:"absolute inset-0 size-full bg-[#0d0d0d]",children:[e.poster?t.jsx("img",{src:e.poster,alt:`Video ${s+1} thumbnail`,draggable:!1,loading:"lazy",decoding:"async",className:"absolute inset-0 size-full rounded-md object-cover"}):t.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:t.jsx(_.VideoCameraIcon,{className:"size-16 rounded-md text-white/30",weight:"regular","aria-hidden":!0})}),t.jsx(Hn,{})]}),Yn=(e,s,n)=>({ariaLabel:`Play video ${s+1} of ${n}`,content:t.jsx(os,{item:e,index:s})}),qn=({src:e,poster:s,mimeType:n,preload:a,items:r})=>r&&r.length>0?a?r.map(i=>({...i,preload:i.preload??a})):r:e?[{src:e,poster:s,mimeType:n,preload:a}]:[],ls=(e,s)=>e.map((n,a)=>({src:n.src,poster:n.poster,mimeType:n.mimeType,preload:n.preload,filename:s&&e.length===1?s:s?`${s} (${a+1})`:void 0})),Xn=({src:e,poster:s,mimeType:n,filename:a,preload:r,onClick:i,onDismiss:l})=>{const{viewerOpen:o,viewerIndex:d,handleActivate:u,closeViewer:f}=je(i);return t.jsxs("div",{className:"relative w-fit",children:[t.jsx("button",{type:"button",onClick:()=>u(0),"aria-label":"Play video",className:"relative block size-[280px] cursor-pointer overflow-hidden rounded-md outline-none focus-visible:ring-2 focus-visible:ring-black/40",children:t.jsx(os,{item:{src:e,poster:s,mimeType:n},index:0})}),l?t.jsx("div",{className:"absolute right-2 top-2 z-10",children:t.jsx(be,{onClick:l})}):null,t.jsx(is,{open:o,items:ls([{src:e,poster:s,mimeType:n,preload:r}],a),initialIndex:d,onClose:f})]})},cs=({state:e,src:s,poster:n,mimeType:a,filename:r,items:i,text:l,groupPosition:o,preload:d,onClick:u})=>{const f=qn({src:s,poster:n,mimeType:a,preload:d,items:i}),x=ve(e),{viewerOpen:h,viewerIndex:c,handleActivate:p,closeViewer:b}=je(u);if(f.length===0)return null;const v=f.map((g,N)=>Yn(g,N,f.length));return t.jsxs(pe,{variant:x,text:l,groupPosition:o,"data-testid":"video-attachment",children:[t.jsx("div",{className:"relative",children:t.jsx(ns,{tiles:v,onTileActivate:p,className:"overflow-hidden rounded-md"})}),t.jsx(is,{open:h,items:ls(f,r),initialIndex:c,onClose:b})]})},Wn=e=>t.jsx(Xn,{...e}),Kn=e=>t.jsx(cs,{...e,state:"sent"}),Zn=e=>t.jsx(cs,{...e,state:"received"}),Jn={Composer:Wn,Sent:Kn,Received:Zn},xe={Image:Fn,Video:Jn,Audio:bn,Pdf:Gn,File:In},Qn={isUnlocking:()=>!1},ea={LockedAttachment:Qn},ds=m.createContext({}),ta=ds.Provider;function us(e){return m.useContext(ds)[e]??ea[e]}const sa=m.lazy(()=>Promise.resolve().then(()=>require("./Card-415OfRhw.cjs"))),na=m.lazy(()=>Promise.resolve().then(()=>require("./Card-xlNNaZJO.cjs"))),aa=()=>t.jsx("div",{className:"w-[280px] min-h-[200px] animate-pulse rounded-md bg-black/[0.06] shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_1px_2px_rgba(0,0,0,0.04),0_8px_32px_rgba(0,0,0,0.1)]","aria-hidden":!0}),he=e=>t.jsx(m.Suspense,{fallback:t.jsx(aa,{}),children:e.contentType==="text"?t.jsx(sa,{...e}):t.jsx(na,{...e})}),ra=({size:e=15})=>t.jsx("svg",{width:e,height:e,viewBox:"0 0 15 15",fill:"none","aria-hidden":"true",children:t.jsx("path",{d:"M12.003 9a.985.985 0 0 1-.652.934l-3.223 1.191-1.188 3.226a.995.995 0 0 1-1.867 0l-1.195-3.226L.65 9.937a.995.995 0 0 1 0-1.867l3.227-1.195 1.187-3.226a.995.995 0 0 1 1.868 0l1.195 3.226 3.226 1.187a.99.99 0 0 1 .649.938m3-5.83a.52.52 0 0 1-.344.492l-1.702.63-.627 1.703a.525.525 0 0 1-.986 0l-.63-1.704-1.704-.627a.525.525 0 0 1 0-.986l1.703-.63.627-1.704a.526.526 0 0 1 .986 0l.631 1.703 1.704.627a.52.52 0 0 1 .342.495",fill:"currentColor",fillOpacity:.55})}),ia=e=>{var s;return((s=e.metadata)==null?void 0:s.custom_type)==="MESSAGE_TIP"},oa=e=>{var s;return((s=e.metadata)==null?void 0:s.custom_type)==="MESSAGE_PAID"},ye=e=>{var s;return((s=e.metadata)==null?void 0:s.custom_type)==="MESSAGE_CHATBOT"},rt=e=>{var s;return((s=e.metadata)==null?void 0:s.custom_type)==="MESSAGE_ATTACHMENT"},la=e=>{var s;return rt(e)&&((s=e.metadata)==null?void 0:s.attachment_content_type)==="text"},ca=e=>{var s;return rt(e)&&((s=e.metadata)==null?void 0:s.attachment_content_type)!=="text"},ms=e=>ia(e)||oa(e),da=e=>{var s;return ms(e)&&!((s=e.text)!=null&&s.trim())},Fe=({message:e,standalone:s=!1,isMyMessage:n=!1,hasAttachment:a=!1})=>{var x;const r=ms(e),i=ye(e);if(!r&&!i)return null;if(r){const h=(x=e.metadata)==null?void 0:x.amount_text;if(!h)return null;const c=s?"message-tip-standalone":"message-tag message-tag--tip",p=s?`${h} tip`:`Delivered with ${h} tip`;return t.jsxs("div",{className:c,children:[t.jsx(_.GiftIcon,{size:s?14:12}),t.jsx("span",{children:p})]})}const l=n&&a,o=l?"Sent with AI":"Sent by AI Assistant",d=["message-chatbot-indicator",n?"message-chatbot-indicator--sender":"message-chatbot-indicator--receiver",l?"message-chatbot-indicator--attachment":"message-chatbot-indicator--text"].join(" "),u=t.jsx("span",{className:"message-chatbot-indicator__label",children:o}),f=t.jsx("span",{className:"message-chatbot-indicator__icon",children:t.jsx(ra,{size:l?12:15})});return t.jsx("div",{className:d,"data-testid":"message-chatbot-indicator",children:n&&!l?t.jsxs(t.Fragment,{children:[u,f]}):t.jsxs(t.Fragment,{children:[f,u]})})},xs=({selected:e,onVoteUp:s,onVoteDown:n})=>t.jsxs("div",{className:"message-vote-buttons",children:[t.jsx("button",{type:"button",className:k("message-vote-button focus-ring",{"message-vote-button--selected":e==="up"}),onClick:s,"aria-label":"Good response","aria-pressed":e==="up","data-tooltip":"Good response",children:t.jsx(_.ThumbsUpIcon,{size:16,weight:e==="up"?"fill":"regular"})}),t.jsx("button",{type:"button",className:k("message-vote-button focus-ring",{"message-vote-button--selected":e==="down"}),onClick:n,"aria-label":"Bad response","aria-pressed":e==="down","data-tooltip":"Bad response",children:t.jsx(_.ThumbsDownIcon,{size:16,weight:e==="down"?"fill":"regular"})})]}),ze=()=>{const{message:e}=w.useMessageContext("SentMessageDeliveryStatus"),{messages:s}=w.useChannelStateContext("SentMessageDeliveryStatus"),n=(()=>{if(s)for(let a=s.length-1;a>=0;a-=1){const r=s[a];if(!(r.type==="system"||r.type==="ephemeral"||r.type==="deleted"))return r.id}})();return e.id!==n?null:t.jsxs(t.Fragment,{children:[t.jsx(_.ChecksIcon,{weight:"bold","aria-hidden":"true"}),t.jsx("span",{"data-testid":"sent-message-delivery-status",children:"Delivered"})]})},ua=()=>null,ma=()=>t.jsx(w.MessageStatus,{MessageSentStatus:ze,MessageDeliveredStatus:ze,MessageReadStatus:ze,MessageSendingStatus:ua}),xa=/^([a-z][a-z0-9+.-]*):/i,ha=new Set(["http","https","mailto","tel","sms"]);function it(e){if(typeof e!="string")return;const s=e.trim();if(s==="")return;const n=xa.exec(s);if(n){const a=n[1].toLowerCase();return ha.has(a)?s:void 0}return s.startsWith("//")||s.startsWith("/")?s:`https://${s}`}const fa={dark:"bg-white text-[#121110] hover:bg-white/90",light:"bg-[#121110] text-white hover:bg-[#2a2928]"},ga=({variant:e,cta:s})=>{const n=k("mt-2 inline-flex h-10 w-full items-center justify-center rounded-full px-4 text-sm font-medium leading-none transition-colors",fa[e]),a=it(s.href);return a?t.jsx("a",{href:a,target:"_blank",rel:"noopener noreferrer",onClick:r=>{var i;r.stopPropagation(),(i=s.onClick)==null||i.call(s)},className:`${n} no-underline`,children:s.label}):t.jsx("button",{type:"button",onClick:r=>{var i;r.stopPropagation(),(i=s.onClick)==null||i.call(s)},className:n,children:s.label})},pa={dark:"text-white",light:"text-black/90"},ba="text-white/30",va={dark:"text-white/55",light:"text-black/55"},ot=({variant:e,title:s,placeholderTitle:n,description:a,url:r,appIcon:i,cta:l,trailingAction:o})=>{const d=e==="dark",u=s??(d?n:void 0)??"",f=u.trim()!=="",x=a!=null&&a.trim()!=="",h=typeof r=="string"?r.trim():"",c=h!=="",p=l!=null;if(!f&&!x&&!c&&!p)return null;const v=k("truncate text-base font-medium leading-6",d&&!s?ba:pa[e]),g=k("truncate text-xs leading-4",va[e]);return t.jsxs("div",{className:"px-4 py-3",children:[t.jsxs("div",{className:"flex items-end gap-3",children:[t.jsxs("div",{className:"flex min-w-0 flex-1 flex-col gap-2",children:[t.jsxs("div",{className:"flex min-w-0 flex-col gap-1",children:[f&&t.jsxs("div",{className:"flex min-w-0 items-center gap-2",children:[i?t.jsx("span",{className:"shrink-0",children:i}):null,t.jsx("p",{className:k("min-w-0",v),children:u})]}),x&&t.jsx("p",{className:g,children:a})]}),!p&&c&&t.jsx("p",{className:g,children:h})]}),o&&t.jsx("div",{className:"shrink-0",children:o})]}),l&&t.jsx(ga,{variant:e,cta:l})]})},ja=k("relative block w-[280px] select-none overflow-hidden rounded-md","border border-black/[0.08]","shadow-[0_1px_2px_rgba(0,0,0,0.04),0_8px_32px_rgba(0,0,0,0.1)]"),Ce=({variant:e,children:s,href:n,onClick:a,ariaLabel:r,rootRef:i,topRight:l,bgClassName:o,"data-testid":d})=>{const u=n!=null||a!=null,f=k(ja,o??(e==="dark"?"bg-[#1e2330]":"bg-white"),u?"cursor-pointer no-underline focus-ring":null),x=l?t.jsx("div",{className:"pointer-events-auto absolute right-3 top-3 z-10",children:l}):null;return n?t.jsxs("a",{ref:i,href:n,target:"_blank",rel:"noopener noreferrer",onClick:a,"data-testid":d,className:f,children:[s,x]}):a?t.jsxs("button",{ref:i,type:"button",onClick:a,"aria-label":r,"data-testid":d,className:k(f,"text-left"),children:[s,x]}):t.jsxs("div",{ref:i,"data-testid":d,className:f,children:[s,x]})},wa={dark:"bg-white/10",light:"bg-black/5"},_a={dark:"size-16 text-white/25",light:"size-16 text-black/25"},Te=(e,s)=>!!s&&!!e&&se(e)==="audio",lt=(e,s)=>{if(!s||!e)return!1;const n=se(e);return n==="video"||n==="audio"},ct="bg-[#F2F3F4]",ke=({variant:e,thumbnailUrl:s,sourceUrl:n,title:a,mimeType:r="image/*",topLeft:i,topRight:l})=>{const o=se(r),d=!!n&&o==="video";return Te(r,n)?t.jsx("div",{className:"p-3",children:t.jsx("audio",{src:n,controls:!0,preload:"metadata",className:"block w-full",children:t.jsx("track",{kind:"captions"})})}):t.jsxs("div",{className:k("relative h-[180px] w-full overflow-hidden",d&&"bg-black"),children:[d?t.jsx("video",{src:n,poster:s,controls:!0,playsInline:!0,preload:"metadata",className:"absolute inset-0 h-full w-full object-contain",children:t.jsx("track",{kind:"captions"})}):s?t.jsx("img",{src:s,alt:a??"",draggable:!1,className:"absolute inset-0 h-full w-full object-cover"}):t.jsx("div",{className:k("flex h-full w-full items-center justify-center",wa[e]),children:oe(r,{className:_a[e],weight:"regular"})}),i?t.jsx("div",{className:"pointer-events-auto absolute left-3 top-3 z-10",children:i}):null,l?t.jsx("div",{className:"pointer-events-auto absolute right-3 top-3 z-10",children:l}):null]})},Na=({title:e,placeholderTitle:s,description:n,url:a,mimeType:r,thumbnailUrl:i,sourceUrl:l,layout:o="featured",appIcon:d,cta:u,onDismiss:f,onEditClick:x})=>{const h=o==="classic",c=Te(r,l),p=f?t.jsx("button",{type:"button",onClick:f,"aria-label":"Dismiss attachment",className:"flex size-6 items-center justify-center rounded-full bg-[#121110] text-white",children:t.jsx(_.XIcon,{className:"size-3",weight:"bold"})}):void 0,b=x?t.jsx("button",{type:"button",onClick:x,"aria-label":"Edit attachment",className:"flex size-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15",children:t.jsx(_.PencilSimpleIcon,{className:"size-5",weight:"regular"})}):void 0;return c?t.jsx(Ce,{variant:"dark",bgClassName:ct,children:t.jsxs("div",{className:"flex items-center gap-2 pr-3",children:[t.jsx("div",{className:"min-w-0 flex-1",children:t.jsx(ke,{variant:"dark",sourceUrl:l,title:e,mimeType:r})}),p&&t.jsx("div",{className:"shrink-0",children:p})]})}):t.jsxs(Ce,{variant:"dark",topRight:h?p:void 0,children:[!h&&t.jsx(ke,{variant:"dark",thumbnailUrl:i,sourceUrl:l,title:e,mimeType:r,topRight:p}),t.jsx(ot,{variant:"dark",title:e,placeholderTitle:s,description:n,url:a,appIcon:d,cta:u,trailingAction:b})]})},ya=({title:e,description:s,url:n,mimeType:a,thumbnailUrl:r,sourceUrl:i,layout:l="featured",appIcon:o,cta:d,onClick:u})=>{const f=lt(a,i),x=it(n),h=d==null&&x!=null&&!f?x:void 0,c=d==null&&!f?u:void 0,p=Te(a,i)?ct:void 0,b=d&&u?{...d,onClick:()=>{var v;u(),(v=d.onClick)==null||v.call(d)}}:d;return t.jsxs(Ce,{variant:"light",href:h,onClick:c,ariaLabel:e??"Open attachment preview",bgClassName:p,"data-testid":"link-attachment",children:[l==="featured"&&t.jsx(ke,{variant:"light",thumbnailUrl:r,sourceUrl:i,title:e,mimeType:a}),t.jsx(ot,{variant:"light",title:e,description:s,url:n,appIcon:o,cta:b})]})},Ca=({title:e,placeholderTitle:s,description:n,url:a,mimeType:r,thumbnailUrl:i,sourceUrl:l,layout:o="featured",appIcon:d,cta:u,onClick:f})=>{const x=lt(r,l),h=it(a),c=u==null&&h!=null&&!x?h:void 0,p=u==null&&!x&&c!=null?f:void 0;return t.jsxs(Ce,{variant:"dark",href:c,onClick:p,bgClassName:Te(r,l)?ct:void 0,children:[o==="featured"&&t.jsx(ke,{variant:"dark",thumbnailUrl:i,sourceUrl:l,title:e,mimeType:r}),t.jsx(ot,{variant:"dark",title:e,placeholderTitle:s,description:n,url:a,appIcon:d,cta:u})]})},Ge={Composer:Na,Sent:Ca,Received:ya};function z(e){const s=e==null?void 0:e.trim();return s||void 0}function At(e){return e.trim().replace(/^https?:\/\//i,"").replace(/\/+$/,"").toLowerCase()}function ka(e,s){if(!(e!=null&&e.trim())||!(s!=null&&s.trim()))return!1;const n=At(e),a=At(s);if(n===a)return!0;if(!n.includes(a))return!1;const r=n.split(a).join("");return!/[^\p{P}\p{Z}\p{C}]/u.test(r)}function Rt(e){const s=z(e.og_scrape_url)??z(e.title_link),n=z(e.image_url)??z(e.thumb_url),a=z(e.asset_url),r=z(e.mime_type);return{title:z(e.title),description:z(e.text),url:s,thumbnailUrl:n,sourceUrl:a,layout:n||lt(r,a)?"featured":"classic",mimeType:r}}function Sa(e){var s;return hs(e)?null:e.type==="image"?e.image_url||e.asset_url?"image":null:e.type==="video"&&e.asset_url?"video":e.type==="audio"&&e.asset_url?"audio":e.type==="file"&&e.asset_url?e.mime_type==="application/pdf"?"pdf":(s=e.mime_type)!=null&&s.startsWith("audio/")?"audio":"file":null}function hs(e){const s=z(e.og_scrape_url);return e.type==="link"||!!s&&!e.asset_url}function fs(e){if(!(e!=null&&e.length))return[];const s=[],n=(r,i)=>{const l=s[s.length-1];if((l==null?void 0:l.type)==="media"&&l.kind===r){l.attachments.push(i);return}s.push({type:"media",kind:r,attachments:[i]})},a=r=>{const i=s[s.length-1];if((i==null?void 0:i.type)==="link"){i.attachments.push(r);return}s.push({type:"link",attachments:[r]})};for(const r of e){if(hs(r)){a(r);continue}const i=Sa(r);i&&n(i,r)}return s}function Ia(e){return e.filter(s=>s.type==="media").length}function Ea(e,s,n){return s<=1?n:e===0?"first":e===s-1?"end":"middle"}function Lt(e){return z(e.image_url)??z(e.asset_url)??""}function Ma(e){switch(e){case"image":return xe.Image;case"video":return xe.Video;case"audio":return xe.Audio;case"pdf":return xe.Pdf;default:return xe.File}}function Ta(e,s){if(s.length>1)switch(e){case"image":return{items:s.map(a=>({src:Lt(a),alt:z(a.title)}))};case"video":return{items:s.map(a=>({src:z(a.asset_url)??"",poster:z(a.thumb_url),mimeType:z(a.mime_type)}))};case"audio":return{items:s.map(a=>({src:z(a.asset_url)??"",mimeType:z(a.mime_type)??"audio/mpeg",filename:z(a.title)}))};case"pdf":return{items:s.map(a=>({src:z(a.asset_url)??"",filename:z(a.title),fileSize:a.file_size}))};case"file":return{items:s.map(a=>({src:z(a.asset_url)??"",filename:z(a.title),fileSize:a.file_size,mimeType:z(a.mime_type)??"application/octet-stream"}))}}const n=s[0];if(!n)return{};switch(e){case"image":return{src:Lt(n),alt:z(n.title)};case"video":return{src:z(n.asset_url)??"",poster:z(n.thumb_url),mimeType:z(n.mime_type)};case"audio":return{src:z(n.asset_url)??"",mimeType:z(n.mime_type)??"audio/mpeg",filename:z(n.title)};case"pdf":return{src:z(n.asset_url)??"",filename:z(n.title),fileSize:n.file_size};case"file":return{src:z(n.asset_url)??"",filename:z(n.title),fileSize:n.file_size,mimeType:z(n.mime_type)??"application/octet-stream"}}}function Aa({groupPosition:e,isMyMessage:s,segment:n}){const a=Ma(n.kind),r={...Ta(n.kind,n.attachments),groupPosition:e};return s?t.jsx(a.Sent,{...r}):t.jsx(a.Received,{...r})}const Ra=({groupPosition:e,isMyMessage:s,message:n,renderText:a})=>{var p;const r=fs(n.attachments);if(r.length===0)return null;const i=Ia(r),l=(p=n.text)==null?void 0:p.trim(),o=r.find(b=>b.type==="link"),d=(o==null?void 0:o.type)==="link"?Rt(o.attachments[0]??{}).url:void 0,u=l&&ka(l,d)?void 0:l;let f=0;const x=[],h=(b,v)=>{const g=s?Ge.Sent:Ge.Received;x.push(t.jsx(g,{...Rt(b)},v))},c=(b,v)=>{const g=Ea(f,i,e);f+=1,x.push(t.jsx(Aa,{groupPosition:g,isMyMessage:s,segment:b},v))};return r.forEach((b,v)=>{if(b.type==="link"){b.attachments.forEach((g,N)=>{h(g,`link-${v}-${N}`)});return}c(b,`media-${v}`)}),t.jsxs("div",{className:"str-chat__message-bubble-wrapper",children:[t.jsxs("div",{className:"str-chat__message-bubble","data-attachment-bubble":"true",style:{background:"transparent",borderRadius:0,overflow:"visible",padding:0},children:[x,!u&&t.jsx(w.MessageErrorIcon,{})]}),u?t.jsxs("div",{className:"str-chat__message-bubble",children:[t.jsx(w.MessageText,{message:n,renderText:a}),t.jsx(w.MessageErrorIcon,{})]}):null]})},La=e=>{var pt,bt,vt,jt,wt,_t,Nt,yt,Ct,kt;const{additionalMessageInputProps:s,chatbotVotingEnabled:n,editing:a,endOfGroup:r,firstOfGroup:i,groupedByUser:l,handleAction:o,handleOpenThread:d,handleRetry:u,highlighted:f,isMessageAIGenerated:x,isMyMessage:h,message:c,renderText:p,threadList:b,viewerLanguage:v}=e,{client:g}=w.useChatContext("CustomMessage"),{channel:N}=w.useChannelStateContext("CustomMessage"),{isUnlocking:j,onUnlockClick:S,onFetchSource:F,onDownloadClick:E}=us("LockedAttachment"),[L,$]=m.useState(!1),P=w.useMessageReminder(c.id),{selected:D,voteUp:I,voteDown:M}=Ut(c),{Attachment:C=w.Attachment,EditMessageModal:T=w.EditMessageModal,MessageActions:A,MessageBlocked:O=w.MessageBlocked,MessageBouncePrompt:B=w.MessageBouncePrompt,MessageDeleted:V=w.MessageDeleted,MessageIsThreadReplyInChannelButtonIndicator:K=w.MessageIsThreadReplyInChannelButtonIndicator,MessageRepliesCountButton:Z=w.MessageRepliesCountButton,ReminderNotification:X=w.ReminderNotification,StreamedMessageText:y=w.StreamedMessageText,PinIndicator:R}=w.useComponentContext("CustomMessage"),G=w.messageHasAttachments(c),Y=w.messageHasReactions(c),H=m.useMemo(()=>x==null?void 0:x(c),[x,c]),U=m.useMemo(()=>{const ie=c.attachments??[],de=c.shared_location?[c.shared_location,...ie]:ie;if(!ye(c))return de;const St=de.filter(It=>!("type"in It)||!Je(It));return St.length===de.length?de:St},[c]),q=m.useMemo(()=>fs(U),[U]),W=m.useMemo(()=>{const ie=Xe({message:c,viewerLanguage:v});return ie===c.text?c:{...c,text:ie}},[c,v]),ae=q.length>0,we=q.reduce((ie,de)=>ie+de.attachments.length,0)===((U==null?void 0:U.length)??0),_e=Wt({endOfGroup:r,firstOfGroup:i,groupedByUser:l});if(w.isDateSeparatorMessage(c))return null;if(c.deleted_at||c.type==="deleted")return t.jsx(V,{message:c});if(w.isMessageBlocked(c))return t.jsx(O,{});const ee=!b&&!!c.reply_count,re=!b&&c.show_in_channel&&c.parent_id,ne=c.status==="failed"&&((pt=c.error)==null?void 0:pt.status)!==403,mt=w.isMessageBounced(c);let le;ne?le=()=>u(c):mt&&(le=()=>$(!0));const J=h(),ys=k("str-chat__message str-chat__message-simple",`str-chat__message--${c.type}`,`str-chat__message--${c.status}`,J?"str-chat__message--me str-chat__message-simple--me":"str-chat__message--other",c.text?"str-chat__message--has-text":"has-no-text",{"str-chat__message--has-attachment":G,"str-chat__message--highlighted":f,"str-chat__message--pinned pinned-message":c.pinned,"str-chat__message--with-reactions":Y,"str-chat__message-send-can-be-retried":(c==null?void 0:c.status)==="failed"&&((bt=c==null?void 0:c.error)==null?void 0:bt.status)!==403,"str-chat__message-with-thread-link":ee||re,"str-chat__virtual-message__wrapper--end":r,"str-chat__virtual-message__wrapper--first":i,"str-chat__virtual-message__wrapper--group":l}),Ae=c.poll_id&&g.polls.fromState(c.poll_id),xt=da(c),ce=ye(c),Cs=rt(c),Re=!!(U!=null&&U.length&&!c.quoted_message),ht=ce&&J&&Re,ks=ae&&we&&!c.quoted_message&&!Ae&&!H&&!ce,ft={contentType:"text",amountText:(vt=c.metadata)==null?void 0:vt.amount_text,paymentStatus:(jt=c.metadata)==null?void 0:jt.payment_status,renderedText:c.text&&t.jsx(w.MessageText,{message:W,renderText:p})},gt={contentType:"media",title:(wt=c.metadata)==null?void 0:wt.attachment_title,mimeType:(_t=c.metadata)==null?void 0:_t.attachment_mime_type,thumbnailUrl:(Nt=c.metadata)==null?void 0:Nt.attachment_thumbnail,amountText:(yt=c.metadata)==null?void 0:yt.amount_text,detail:(Ct=c.metadata)==null?void 0:Ct.attachment_detail,paymentStatus:(kt=c.metadata)==null?void 0:kt.payment_status,onFetchSource:F?()=>F(c,N):void 0};return t.jsxs(t.Fragment,{children:[a&&t.jsx(T,{additionalMessageInputProps:s}),L&&t.jsx(w.MessageBounceModal,{MessageBouncePrompt:B,onClose:()=>$(!1),open:L}),t.jsxs("div",{className:ys,"data-message-id":c.id,"data-dd-privacy":"mask",children:[R&&t.jsx(R,{}),!!P&&t.jsx(X,{reminder:P}),c.user&&t.jsx(Q,{className:"str-chat__avatar str-chat__message-sender-avatar",id:c.user.id,image:c.user.image,name:c.user.name||c.user.id,size:24,shape:"circle",dmAgentEnabled:ce}),t.jsx("div",{className:k("str-chat__message-inner",{"str-chat__simple-message--error-failed":ne||mt}),"data-testid":"message-inner",onClick:le,onKeyDown:le,role:le?"button":void 0,tabIndex:le?0:void 0,style:{marginInlineEnd:0,marginInlineStart:0},children:xt?t.jsx(Fe,{message:c,standalone:!0}):la(c)?t.jsx("div",{className:"str-chat__message-bubble-wrapper",children:t.jsxs("div",{className:"flex items-center gap-2",children:[J&&A&&t.jsx(A,{}),J?t.jsx(he,{...ft,isMine:!0}):t.jsx(he,{...ft,isMine:!1,isUnlocking:j(c.id),onUnlockClick:()=>S==null?void 0:S(c,N)}),!J&&A&&t.jsx(A,{})]})}):ca(c)?t.jsxs("div",{className:"str-chat__message-bubble-wrapper",children:[t.jsxs("div",{className:"flex items-center gap-2",children:[J&&A&&t.jsx(A,{}),J?t.jsx(he,{...gt,isMine:!0,onPreviewClick:()=>S?S(c,N):void 0}):t.jsx(he,{...gt,isMine:!1,isUnlocking:j(c.id),onUnlockClick:()=>S?S(c,N):void 0,onDownloadClick:()=>E?E(c,N):void 0}),!J&&A&&t.jsx(A,{})]}),c.text&&t.jsx("div",{className:"str-chat__message-bubble",children:t.jsx(w.MessageText,{message:W,renderText:p})})]}):ks?t.jsx(Ra,{groupPosition:_e,isMyMessage:J,message:{...W,attachments:U,i18n:void 0},renderText:p}):t.jsx("div",{className:"str-chat__message-bubble-wrapper",children:t.jsxs("div",{className:"str-chat__message-bubble",children:[ce&&!ht&&t.jsx(Fe,{message:c,hasAttachment:Re,isMyMessage:J}),Ae&&t.jsx(w.Poll,{poll:Ae}),U!=null&&U.length&&!c.quoted_message?t.jsx(C,{actionHandler:o,attachments:U}):null,H?t.jsx(y,{message:W,renderText:p}):t.jsx(w.MessageText,{message:W,renderText:p}),t.jsx(w.MessageErrorIcon,{})]})})}),!Cs&&!xt&&t.jsxs("div",{className:"str-chat__message-footer",children:[(!ce||ht)&&t.jsx(Fe,{message:c,hasAttachment:Re,isMyMessage:J}),n&&ce&&t.jsx(xs,{selected:D,onVoteUp:I,onVoteDown:M})]}),t.jsx(ma,{}),ee&&t.jsx(Z,{onClick:d,reply_count:c.reply_count}),re&&t.jsx(K,{})]},c.id)]})},Da=m.memo(La,(e,s)=>e.chatbotVotingEnabled!==s.chatbotVotingEnabled||e.viewerLanguage!==s.viewerLanguage?!1:w.areMessageUIPropsEqual(e,s)),Fa=e=>{const s=w.useMessageContext("CustomMessage");return t.jsx(Da,{...s,...e})},za=()=>{var n;const{handleDelete:e,message:s}=w.useMessageContext("CustomMessageActions");return((n=s.metadata)==null?void 0:n.payment_status)==="paid"?null:t.jsx(He.DefaultDropdownActionButton,{onClick:e,"aria-label":"Delete",title:"Delete",className:"bg-marble rounded-full p-2 hover:bg-sand transition-all",children:t.jsx(_.TrashSimpleIcon,{size:16,weight:"light","aria-hidden":!0})})},Pa=()=>{const{handleFlag:e}=w.useMessageContext("CustomMessageActions");return t.jsx(He.DefaultDropdownActionButton,{onClick:e,"aria-label":"Report",title:"Report",className:"bg-marble rounded-full p-2 hover:bg-sand transition-all",children:t.jsx(_.FlagIcon,{size:16,weight:"light","aria-hidden":!0})})},Oa=()=>{var s;const{message:e}=w.useMessageContext("CustomMessageActions");return((s=e.metadata)==null?void 0:s.custom_type)!=="MESSAGE_ATTACHMENT"?null:t.jsx(He.MessageActions,{messageActionSet:[{Component:za,placement:"quick",type:"delete"},{Component:Pa,placement:"quick",type:"flag"}]})},$a=({link:e,onDismiss:s})=>{const{og_scrape_url:n,title:a,image_url:r}=e,i=l=>{l.preventDefault(),s(n)};return t.jsxs("a",{href:n,target:"_blank",rel:"noopener noreferrer",className:"relative block w-full rounded-[24px] bg-[#1e2330] p-2 no-underline transition-opacity hover:opacity-90",children:[r&&t.jsx("img",{src:r,alt:a||"",className:"h-[180px] w-full rounded-[20px] object-cover"}),t.jsx("button",{type:"button",onClick:i,className:"absolute right-4 top-4 flex size-6 items-center justify-center rounded-full border border-white/40 bg-white/70 backdrop-blur-2xl focus-ring","aria-label":"Close link preview",children:t.jsx(_.XIcon,{className:"size-4 text-black/90"})}),t.jsxs("div",{className:"p-2",children:[a&&t.jsx("div",{className:"truncate text-[14px] font-medium leading-5 text-white",children:a}),t.jsx("div",{className:"truncate text-[12px] leading-4 text-white/55",children:n})]})]})},Ba=e=>({linkPreviews:Array.from(e.previews.values()).filter(s=>$e.LinkPreviewsManager.previewIsLoaded(s)||$e.LinkPreviewsManager.previewIsLoading(s))}),Ua=()=>{const{linkPreviewsManager:e}=w.useMessageComposer(),{linkPreviews:s}=w.useStateStore(e.state,Ba),n=r=>{e.dismissPreview(r)};return s.length>0?t.jsx("div",{className:"messaging-link-preview-list flex min-h-0 flex-col items-stretch w-full gap-2 mb-4 overflow-y-auto overscroll-contain",children:s.map(r=>t.jsx("div",{className:"w-full shrink-0",children:t.jsx($a,{link:r,onDismiss:n})},r.og_scrape_url))}):null},dt=m.createContext(!1),Va=()=>m.useContext(dt),Ga=({sendMessage:e,disabled:s,...n})=>t.jsx("button",{...n,type:"button","aria-label":"Send",disabled:s,onClick:e,children:t.jsx(_.ArrowUpIcon,{weight:"bold",className:"size-4"})}),Ha=()=>{const e=m.useContext(dt),{handleSubmit:s}=w.useMessageInputContext(),n=w.useMessageComposerHasSendableData(),a=e||!n,{SendButton:r=Ga,AttachmentPreviewList:i=w.AttachmentPreviewList}=w.useComponentContext("CustomMessageInput");return t.jsxs("div",{className:"central-container flex min-h-0 flex-col gap-2 min-w-0 w-full self-stretch p-2 bg-white rounded-[1.5rem] shadow-[0_4px_16px_0_rgba(0,0,0,0.08),0_1px_2px_0_rgba(0,0,0,0.04),0_0_0_1px_rgba(0,0,0,0.04)]","data-dd-privacy":"mask",children:[t.jsx(w.QuotedMessagePreview,{}),t.jsx(Ua,{}),t.jsx(i,{}),t.jsxs("div",{className:"flex shrink-0",children:[t.jsx("div",{className:"w-full ml-2 mr-4 self-center leading-[0]",children:t.jsx(w.TextareaComposer,{"aria-disabled":e||void 0,className:"w-full resize-none outline-none leading-5 placeholder:text-black/30 text-sm",autoFocus:!e,enterKeyHint:"send",maxRows:4,readOnly:e,tabIndex:e?-1:void 0})}),t.jsx(r,{sendMessage:s,"aria-label":"Send",className:"str-chat__send-button mt-auto flex justify-center items-center flex-shrink-0 rounded-full size-8 bg-[#121110] disabled:bg-[#F1F0EE] disabled:text-black/20 text-white focus-ring","data-testid":"send-button",disabled:a,type:"button"})]})]})},Ya=({renderActions:e,renderFooter:s,disabled:n=!1,disabledReason:a,composerInput:r})=>{var o;const{channel:i}=w.useChannelStateContext(),l=((o=i==null?void 0:i.data)==null?void 0:o.frozen)===!0;return n?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:"messaging-composer-locked-panel flex w-full flex-col items-center justify-center gap-3 px-6 py-4",children:a?t.jsx("p",{className:"max-w-[345px] text-center text-xs font-normal leading-[1.3] tracking-[0.12px] text-black/40",children:a}):null}),s==null?void 0:s()]}):t.jsxs("div",{className:"flex min-h-0 flex-col gap-4 p-4",children:[t.jsxs("div",{inert:l?"":void 0,"aria-disabled":l||void 0,className:"message-input flex min-h-0 items-end gap-4 aria-disabled:opacity-40",children:[e&&t.jsx("div",{className:"flex h-12 shrink-0 items-center justify-center",children:e()}),t.jsx(dt.Provider,{value:l,children:t.jsx(w.MessageInput,{Input:r??Ha})})]}),s==null?void 0:s()]})},qa=["SYSTEM_DM_AGENT_PAUSED","SYSTEM_DM_AGENT_RESUMED"],Xa={SYSTEM_DM_AGENT_PAUSED:"DM Agent has left the conversation",SYSTEM_DM_AGENT_RESUMED:"DM Agent has rejoined the conversation"},Wa=["SYSTEM_AGE_SAFETY_BLOCKED"],Ka={SYSTEM_AGE_SAFETY_BLOCKED:"This user isn’t able to reply because they don’t meet our age safety guidelines."},Pe="age safety guidelines.",Za="https://linktr.ee/s/about/contact",Dt=e=>qa.includes(e),Ja=e=>Wa.includes(e),Qa=e=>{var a;const s=(a=e.metadata)==null?void 0:a.custom_type;if(Dt(s))return{kind:"dm-agent",type:s};if(Ja(s))return{kind:"age-safety",type:s};const n=e.dm_agent_system_type;if(Dt(n))return{kind:"dm-agent",type:n}},er=e=>{const s=e.indexOf(Pe);if(s===-1)return e;const n=s+Pe.length;return t.jsxs(t.Fragment,{children:[e.slice(0,s),t.jsx("a",{href:Za,target:"_blank",rel:"noopener noreferrer",className:"mes-age-safety-system-message__emphasis font-medium text-inherit underline",children:Pe}),e.slice(n)]})},tr=e=>{var a,r;const s=e.message.hide_date===!0,n=Qa(e.message);if((n==null?void 0:n.kind)==="dm-agent"){const i=((a=e.message.text)==null?void 0:a.trim())||Xa[n.type];return t.jsxs("div",{className:"str-chat__message--system","data-testid":"message-system",children:[t.jsxs("div",{className:"mes-dm-agent-system-message mx-auto mb-2 inline-flex w-fit max-w-[min(100%,480px)] items-center justify-center gap-[10px] rounded-[12px] border border-[rgba(0,0,0,0.08)] p-3 text-[rgba(0,0,0,0.55)]","data-testid":"dm-agent-system-message","data-dm-agent-system-type":n.type,children:[t.jsx(_.SparkleIcon,{size:16,weight:"regular","aria-hidden":!0,className:"mes-dm-agent-system-message__sparkle shrink-0"}),t.jsx("p",{className:"mes-dm-agent-system-message__text m-0 text-center text-[14px] font-normal leading-5 tracking-[0.21px]",children:i})]}),!s&&t.jsx(w.MessageTimestamp,{message:e.message})]})}if((n==null?void 0:n.kind)==="age-safety"){const i=((r=e.message.text)==null?void 0:r.trim())||Ka[n.type];return t.jsxs("div",{className:"str-chat__message--system","data-testid":"message-system",children:[t.jsxs("div",{className:"mes-age-safety-system-message box-border mx-auto mb-2 flex w-full max-w-[329px] items-start justify-center gap-3 rounded-[12px] border border-[var(--border-secondary,rgba(0,0,0,0.08))] bg-[var(--bg-warning-subtle,#fef3c6)] px-2 py-4 pl-5 text-[color:var(--text-warning-on-warning,#894b00)]","data-testid":"age-safety-system-message","data-age-safety-system-type":n.type,children:[t.jsx(_.ProhibitIcon,{size:24,weight:"duotone","aria-hidden":!0,className:"mes-age-safety-system-message__icon shrink-0 text-[color:var(--text-warning-on-warning,#894b00)]","data-testid":"age-safety-system-message-icon"}),t.jsx("div",{className:"mes-age-safety-system-message__content min-w-0 flex-[1_0_0]",children:t.jsx("p",{className:"m-0 text-balance text-left text-[12px] font-normal leading-4 tracking-[0.21px] text-[color:var(--text-warning-on-warning,#894b00)]",children:er(i)})})]}),!s&&t.jsx(w.MessageTimestamp,{message:e.message})]})}return t.jsxs("div",{className:"str-chat__message--system","data-testid":"message-system",children:[t.jsxs("div",{className:"str-chat__message--system__text",children:[t.jsx("div",{className:"str-chat__message--system__line"}),t.jsx("p",{children:e.message.text}),t.jsx("div",{className:"str-chat__message--system__line"})]}),!s&&t.jsx(w.MessageTimestamp,{message:e.message})]})},gs=m.createContext(!1),Oe=({cx:e,index:s})=>t.jsx("circle",{cx:e,cy:"6.15",r:"3.9",fill:"#A0A0A0",children:t.jsx("animateTransform",{attributeName:"transform",type:"translate",values:"0 0; 0 -2.25; 0 0;",dur:"900ms",begin:`${120*s}ms`,repeatCount:"indefinite"})}),sr=new Set([w.AIStates.Thinking,w.AIStates.Generating,w.AIStates.ExternalSources]),nr=({threadList:e})=>{var p,b;const{channel:s,channelConfig:n,thread:a}=w.useChannelStateContext(),{client:r}=w.useChatContext(),{typing:i={}}=w.useTypingContext(),{aiState:l}=w.useAIState(s),o=m.useContext(gs);if(!e&&o&&sr.has(l)){const v=ar(s,(p=r.user)==null?void 0:p.id);return t.jsx(Ft,{avatarId:(v==null?void 0:v.id)??"ai-agent",avatarName:(v==null?void 0:v.name)??(v==null?void 0:v.id)??"Agent",avatarImage:v==null?void 0:v.image,testId:"typing-indicator-ai"})}if((n==null?void 0:n.typing_events)===!1)return null;const u=e?[]:Object.values(i).filter(({parent_id:v,user:g})=>{var N;return(g==null?void 0:g.id)!==((N=r.user)==null?void 0:N.id)&&!v}),f=e?Object.values(i).filter(({parent_id:v,user:g})=>{var N;return(g==null?void 0:g.id)!==((N=r.user)==null?void 0:N.id)&&v===(a==null?void 0:a.id)}):[],x=e?f:u;if(!x.length)return null;const h=(b=x[0])==null?void 0:b.user,c=h!=null&&h.id&&s.state.members[h.id]?s.state.members[h.id].user:void 0;return t.jsx(Ft,{avatarId:(h==null?void 0:h.id)??(c==null?void 0:c.id)??"typing-user",avatarName:(h==null?void 0:h.name)??(c==null?void 0:c.name)??(h==null?void 0:h.id)??"Typing user",avatarImage:(h==null?void 0:h.image)??(c==null?void 0:c.image),testId:"typing-indicator"})},Ft=({avatarId:e,avatarName:s,avatarImage:n,testId:a})=>t.jsx("div",{className:"str-chat__li str-chat__li--single str-chat__typing-indicator !static","data-testid":a,style:{marginBottom:"var(--messaging-channel-input-spacer-height, 80px)"},children:t.jsxs("div",{className:"str-chat__message str-chat__message-simple str-chat__message--regular str-chat__message--received str-chat__message--other str-chat__message--has-text",children:[t.jsx(Q,{className:"str-chat__avatar str-chat__message-sender-avatar",id:e,name:s,image:n??void 0,size:24,shape:"circle"}),t.jsx("div",{className:"str-chat__message-inner mx-0",children:t.jsx("div",{className:"str-chat__message-bubble-wrapper",children:t.jsx("div",{className:"str-chat__message-bubble",children:t.jsx("div",{className:"str-chat__message-text min-h-11 flex items-center",children:t.jsx("div",{className:"str-chat__message-text-inner str-chat__message-simple-text-inner",children:t.jsxs("svg",{"aria-hidden":"true",className:"block overflow-visible",viewBox:"0 0 32 12.3",width:"32",height:"13",overflow:"visible",children:[t.jsx(Oe,{cx:"4",index:0}),t.jsx(Oe,{cx:"16",index:1}),t.jsx(Oe,{cx:"28",index:2})]})})})})})})]})});function ar(e,s){var a;const n=((a=e==null?void 0:e.state)==null?void 0:a.members)??{};for(const r of Object.values(n)){const i=r==null?void 0:r.user;if(i&&i.id!==s)return i}}const ps=()=>null,rr=({className:e,message:s})=>t.jsxs("div",{className:k("flex items-center justify-center h-full",e),children:[t.jsxs("svg",{viewBox:"0 0 100 100",className:"size-8 fill-pebble",stroke:"none",children:[t.jsx("circle",{cx:"6",cy:"50",r:"6",children:t.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 15 ; 0 -15; 0 15",repeatCount:"indefinite",begin:"0.1"})}),t.jsx("circle",{cx:"30",cy:"50",r:"6",children:t.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 10 ; 0 -10; 0 10",repeatCount:"indefinite",begin:"0.2"})}),t.jsx("circle",{cx:"54",cy:"50",r:"6",children:t.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.3"})})]}),s&&t.jsx("span",{className:"text-stone",children:s})]}),Se=m.memo(()=>t.jsx("div",{className:"messaging-loading-state flex items-center justify-center h-full",children:t.jsxs("div",{className:"flex items-center",children:[t.jsx(rr,{className:"w-6 h-6"}),t.jsx("span",{className:"text-sm text-stone",children:"Loading messages"})]})}));Se.displayName="LoadingState";const ue="size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-center transition-colors duration-150 focus-ring",Ne="Replies instantly with AI assistant",ir=({onBack:e,showBackButton:s,showStarButton:n=!1,dmAgentEnabled:a=!1,onLeaveConversation:r,onBlockParticipant:i,showDeleteConversation:l=!0,showBlockParticipant:o=!0,showReportParticipant:d=!0,onDeleteConversationClick:u,onBlockParticipantClick:f,onReportParticipantClick:x,customChannelActions:h,renderChannelActions:c,showChannelInfo:p=!0,onParticipantNameClick:b,renderHeaderTitleBadges:v})=>{var M,C,T,A,O,B;const{channel:g}=w.useChannelStateContext(),{client:N}=w.useChatContext(),j=m.useMemo(()=>{var V;return ge((V=g.state)==null?void 0:V.members,N==null?void 0:N.userID,g.type)},[(M=g.state)==null?void 0:M.members,N==null?void 0:N.userID,g.type]),S=Ie(j==null?void 0:j.user),F=(C=j==null?void 0:j.user)==null?void 0:C.image,E=qe(g),L=v==null?void 0:v({channel:g,participant:j}),$="flex max-w-full flex-col items-center gap-1 rounded-[12px] px-1 py-0.5 text-center text-xs font-medium text-black/90",P="flex min-w-0 max-w-full items-center gap-4 rounded-[12px] px-1 py-0.5 text-left text-black/90",D=t.jsxs(t.Fragment,{children:[t.jsx("span",{className:"min-w-0 truncate",children:S}),L&&t.jsx("span",{className:"shrink-0",children:L})]}),I=async()=>{try{E?await g.unpin():await g.pin()}catch(V){console.error("[CustomChannelHeader] Failed to update pinned status:",V)}};return t.jsxs("div",{className:"@container",children:[t.jsxs("div",{className:"grid grid-cols-[1fr_auto_1fr] w-full items-center @lg:hidden px-6 py-3",children:[t.jsx("div",{className:"flex items-center gap-2",children:s&&t.jsx("button",{className:k(ue,"messaging-channel-view-back-button-mobile bg-[#F1F0EE]"),onClick:e||(()=>{}),type:"button","aria-label":"Back to conversations",children:t.jsx(_.ArrowLeftIcon,{className:"size-5 text-black/90"})})}),t.jsx("div",{className:"flex flex-col gap-1 items-center","data-dd-privacy":"mask",children:b?t.jsxs("button",{type:"button",onClick:b,"aria-label":`View details for ${S}`,className:k($,"appearance-none border-0 bg-transparent transition-opacity hover:opacity-70 focus-ring focus-visible:outline-none"),children:[t.jsx(Q,{id:((T=j==null?void 0:j.user)==null?void 0:T.id)||g.id||"unknown",name:S,image:F,starred:n&&E,dmAgentEnabled:a,size:48}),t.jsxs("span",{className:"flex max-w-full items-center gap-0.5",children:[D,t.jsx(_.CaretRightIcon,{className:"size-3 shrink-0",weight:"bold"})]}),a&&t.jsxs("div",{className:"flex items-center gap-1 text-[10px] leading-3 text-black/55",children:[t.jsx(_.SparkleIcon,{className:"size-3 shrink-0 text-black/55"}),t.jsx("span",{children:Ne})]})]}):t.jsxs("div",{className:$,children:[t.jsx(Q,{id:((A=j==null?void 0:j.user)==null?void 0:A.id)||g.id||"unknown",name:S,image:F,starred:n&&E,dmAgentEnabled:a,size:48}),t.jsxs("p",{className:"flex max-w-full items-center justify-center gap-0.5",children:[D,t.jsx(_.CaretRightIcon,{className:"invisible size-3 shrink-0",weight:"bold"})]}),a&&t.jsxs("div",{className:"flex items-center gap-1 text-[10px] leading-3 text-black/55",children:[t.jsx(_.SparkleIcon,{className:"size-3 shrink-0 text-black/55"}),t.jsx("span",{children:Ne})]})]})}),t.jsxs("div",{className:"flex justify-end items-center gap-2",children:[n&&t.jsx("button",{className:ue,onClick:I,type:"button","aria-label":E?"Unstar conversation":"Star conversation",children:t.jsx(_.StarIcon,{className:k("size-5",{"text-yellow-600":E,"text-black/90":!E}),weight:E?"duotone":"regular"})}),p&&(c!==void 0?c:t.jsx(Be,{channel:g,participant:j,showDeleteConversation:l,showBlockParticipant:o,showReportParticipant:d,onLeaveConversation:r,onBlockParticipant:i,onDeleteConversationClick:u,onBlockParticipantClick:f,onReportParticipantClick:x,customChannelActions:h,triggerClassName:k(ue,"bg-[#F1F0EE]")}))]})]}),t.jsxs("div",{className:"px-6 py-3 hidden @lg:flex items-center justify-between gap-3 min-h-12 border-b border-b-black/[0.08]",children:[t.jsxs("div",{className:"flex items-center gap-4 min-w-0","data-dd-privacy":"mask",children:[s&&e&&t.jsx("button",{className:k(ue,"messaging-channel-view-back-button-desktop"),type:"button",onClick:e,"aria-label":"Back to conversations",children:t.jsx(_.ArrowLeftIcon,{className:"size-5 text-black/90"})}),b?t.jsxs("button",{type:"button",onClick:b,"aria-label":`View details for ${S}`,className:k(P,"appearance-none border-0 bg-transparent transition-opacity hover:opacity-70 focus-ring focus-visible:outline-none"),children:[t.jsx(Q,{id:((O=j==null?void 0:j.user)==null?void 0:O.id)||g.id||"unknown",name:S,image:F,starred:n&&E,dmAgentEnabled:a,size:48}),t.jsxs("div",{className:"min-w-0",children:[t.jsxs("h1",{className:"flex min-w-0 items-center gap-1 font-medium text-black/90",children:[D,t.jsx(_.CaretRightIcon,{className:"size-4 shrink-0",weight:"bold"})]}),a&&t.jsxs("div",{className:"mt-0.5 flex items-center gap-1 text-[10px] leading-3 text-black/55",children:[t.jsx(_.SparkleIcon,{className:"size-3 shrink-0 text-black/55"}),t.jsx("span",{className:"truncate",children:Ne})]})]})]}):t.jsxs("div",{className:P,children:[t.jsx(Q,{id:((B=j==null?void 0:j.user)==null?void 0:B.id)||g.id||"unknown",name:S,image:F,starred:n&&E,dmAgentEnabled:a,size:48}),t.jsxs("div",{className:"min-w-0",children:[t.jsxs("h1",{className:"flex min-w-0 items-center gap-1 font-medium text-black/90",children:[D,t.jsx(_.CaretRightIcon,{className:"invisible size-4 shrink-0",weight:"bold"})]}),a&&t.jsxs("div",{className:"mt-0.5 flex items-center gap-1 text-[10px] leading-3 text-black/55",children:[t.jsx(_.SparkleIcon,{className:"size-3 shrink-0 text-black/55"}),t.jsx("span",{className:"truncate",children:Ne})]})]})]})]}),t.jsxs("div",{className:"flex items-center gap-2",children:[n&&t.jsx("button",{className:ue,onClick:I,type:"button","aria-label":E?"Unstar conversation":"Star conversation",children:t.jsx(_.StarIcon,{className:k("size-6",{"text-yellow-600":E,"text-black/90":!E}),weight:E?"duotone":"regular"})}),p&&(c!==void 0?c:t.jsx(Be,{channel:g,participant:j,showDeleteConversation:l,showBlockParticipant:o,showReportParticipant:d,onLeaveConversation:r,onBlockParticipant:i,onDeleteConversationClick:u,onBlockParticipantClick:f,onReportParticipantClick:x,customChannelActions:h,triggerClassName:ue}))]})]})]})},or=({onBack:e,showBackButton:s,renderMessageInputActions:n,renderMessageInputFooter:a,renderConversationFooter:r,onLeaveConversation:i,onBlockParticipant:l,showDeleteConversation:o=!0,onDeleteConversationClick:d,onBlockParticipantClick:u,onReportParticipantClick:f,showBlockParticipant:x=!0,showReportParticipant:h=!0,composerDisabled:c=!1,composerDisabledReason:p,showStarButton:b=!1,chatbotVotingEnabled:v=!1,renderChannelBanner:g,renderHeaderTitleBadges:N,customChannelActions:j,renderChannelActions:S,renderMessage:F,dmAgentEnabled:E=!1,viewerLanguage:L,showChannelInfo:$=!0,onParticipantNameClick:P,composerInput:D})=>{var y,R,G,Y;const{channel:I}=w.useChannelStateContext(),{client:M}=w.useChatContext(),C=m.useMemo(()=>{var H;return ge((H=I.state)==null?void 0:H.members,M==null?void 0:M.userID,I.type)},[(y=I.state)==null?void 0:y.members,M==null?void 0:M.userID,I.type]),T=m.useMemo(()=>{var q;const H=M==null?void 0:M.userID;return H?Object.values(((q=I.state)==null?void 0:q.members)||{}).find(W=>{var ae;return((ae=W.user)==null?void 0:ae.id)===H}):void 0},[M==null?void 0:M.userID,(R=I.state)==null?void 0:R.members]),A=((G=T==null?void 0:T.user)==null?void 0:G.is_account)??(T==null?void 0:T.is_account),O=((Y=C==null?void 0:C.user)==null?void 0:Y.is_account)??(C==null?void 0:C.is_account),B=E&&A===!1&&O===!0,V=I.state.messages.some(H=>H.type!=="deleted"),K=g?t.jsx(m.Fragment,{children:g()},"lt-channel-banner"):null,Z=P?t.jsx($s,{className:"-mx-[var(--str-chat\\_\\_spacing-2)] px-[var(--str-chat\\_\\_spacing-2)] md:-mx-[min(var(--str-chat\\_\\_spacing-10),4%)] md:px-[min(var(--str-chat\\_\\_spacing-10),4%)]",onBack:e,showBackButton:s,showChannelInfo:$,showStarButton:b,dmAgentEnabled:B,onLeaveConversation:i,onBlockParticipant:l,showDeleteConversation:o,showBlockParticipant:x,showReportParticipant:h,onDeleteConversationClick:d,onBlockParticipantClick:u,onReportParticipantClick:f,customChannelActions:j,renderChannelActions:S,onParticipantNameClick:P}):null,X=m.useCallback(H=>{const{message:U}=w.useMessageContext("ChannelView"),q=t.jsx(Fa,{...H,chatbotVotingEnabled:v,viewerLanguage:L});return!F||!U?q:F(q,U)},[v,F,L]);return t.jsx(t.Fragment,{children:t.jsx(w.WithComponents,{overrides:{Message:X,MessageActions:Oa,UnreadMessagesNotification:()=>null,UnreadMessagesSeparator:()=>null},children:t.jsxs(w.Window,{children:[!P&&t.jsxs(t.Fragment,{children:[t.jsx("div",{children:t.jsx(ir,{onBack:e,showBackButton:s,showChannelInfo:$,showStarButton:b,dmAgentEnabled:B,onLeaveConversation:i,onBlockParticipant:l,showDeleteConversation:o,showBlockParticipant:x,showReportParticipant:h,onDeleteConversationClick:d,onBlockParticipantClick:u,onReportParticipantClick:f,customChannelActions:j,renderChannelActions:S,renderHeaderTitleBadges:N})},"lt-channel-header"),K]}),t.jsxs("div",{className:"flex-1 overflow-hidden relative",children:[P&&!V&&t.jsx("div",{className:"str-chat__list",children:t.jsxs("div",{className:"str-chat__message-list-scroll",children:[Z,K]})}),t.jsx(w.MessageList,{head:P&&V?t.jsxs("div",{className:"sticky top-0 z-10",children:[Z,K]}):void 0,hideDeletedMessages:!0,hideNewMessageSeparator:!1})]},"lt-channel-message-list"),r?t.jsx(m.Fragment,{children:r(I)},"lt-channel-conversation-footer"):null,t.jsx(Ya,{...n&&{renderActions:()=>n==null?void 0:n(I)},renderFooter:()=>a==null?void 0:a(I),disabled:c,disabledReason:p,composerInput:D},"lt-channel-message-input")]})})})},ut=m.memo(({channel:e,onBack:s,showBackButton:n=!1,renderMessageInputActions:a,renderMessageInputFooter:r,renderConversationFooter:i,onLeaveConversation:l,onBlockParticipant:o,className:d,CustomChannelEmptyState:u=ps,showDeleteConversation:f=!0,onDeleteConversationClick:x,onBlockParticipantClick:h,onReportParticipantClick:c,showBlockParticipant:p=!0,showReportParticipant:b=!0,composerDisabled:v=!1,composerDisabledReason:g,dmAgentEnabled:N,messageMetadata:j,onMessageSent:S,showStarButton:F=!1,chatbotVotingEnabled:E=!1,renderChannelBanner:L,renderHeaderTitleBadges:$,customChannelActions:P,renderChannelActions:D,renderMessage:I,onMessageLinkClick:M,sendButton:C,attachmentPreviewList:T,viewerLanguage:A,showChannelInfo:O=!0,onParticipantNameClick:B,composerInput:V})=>{const K=m.useCallback(async(X,y,R)=>{var W;const G=((W=e.data)==null?void 0:W.chatbot_paused)===!0,Y=N&&!G,H={...y,...Y&&{silent:!0},...j&&{metadata:{...y.metadata??{},...j}}},U={...R,...Y&&{skip_push:!0}},q=await e.sendMessage(H,U);return S==null||S(q),q},[e,N,j,S]),Z=m.useRef(null);return m.useEffect(()=>{if(!M)return;const X=Z.current;if(!X)return;const y=R=>{const G=R.target,Y=G==null?void 0:G.closest("a[href]"),H=Y==null?void 0:Y.getAttribute("href");if(!H)return;const U=Y==null?void 0:Y.closest("[data-message-id]"),q=U==null?void 0:U.getAttribute("data-message-id"),W=q?e.state.messages.find(ae=>ae.id===q):void 0;M(H,W)};return X.addEventListener("click",y),()=>X.removeEventListener("click",y)},[M,e]),t.jsx("div",{ref:Z,className:k("messaging-channel-view h-full flex flex-col",d),children:t.jsx(gs.Provider,{value:N??!1,children:t.jsx(w.Channel,{channel:e,MessageSystem:tr,EmptyStateIndicator:u,LoadingIndicator:Se,DateSeparator:Bs,TypingIndicator:nr,doSendMessageRequest:K,...C?{SendButton:C}:{},...T?{AttachmentPreviewList:T}:{},children:t.jsx(or,{onBack:s,showBackButton:n,renderMessageInputActions:a,renderMessageInputFooter:r,renderConversationFooter:i,onLeaveConversation:l,onBlockParticipant:o,CustomChannelEmptyState:u,showDeleteConversation:f,onDeleteConversationClick:x,onBlockParticipantClick:h,onReportParticipantClick:c,showBlockParticipant:p,showReportParticipant:b,composerDisabled:v,composerDisabledReason:g,showStarButton:F,dmAgentEnabled:N,chatbotVotingEnabled:E,renderChannelBanner:L,renderHeaderTitleBadges:$,customChannelActions:P,renderChannelActions:D,renderMessage:I,viewerLanguage:A,showChannelInfo:O,onParticipantNameClick:B,composerInput:V})})})})});ut.displayName="ChannelView";const fe=m.memo(({message:e,onBack:s})=>t.jsx("div",{className:"messaging-error-state flex items-center justify-center h-full p-8",children:t.jsxs("div",{className:"text-center max-w-sm",children:[t.jsx("div",{className:"w-24 h-24 bg-danger-alt/20 rounded-full flex items-center justify-center mx-auto mb-6",children:t.jsx("span",{className:"text-4xl",children:"⚠️"})}),t.jsx("h2",{className:"font-semibold text-charcoal mb-2",children:"Oops!"}),t.jsx("p",{className:"text-stone text-sm mb-6",children:e}),s&&t.jsx("button",{type:"button",onClick:s,className:"inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white bg-[#7f22fe] hover:bg-primary-alt rounded-lg transition-colors focus-ring",children:"Go Back"})]})}));fe.displayName="ErrorState";const lr=({capabilities:e={},renderMessageInputActions:s,renderConversationFooter:n,onChannelSelect:a,onExitConversation:r,initialParticipantFilter:i,initialParticipantData:l,CustomChannelEmptyState:o,onBlockParticipantClick:d,onReportParticipantClick:u,dmAgentEnabled:f,onMessageSent:x,chatbotVotingEnabled:h=!1,viewerLanguage:c,renderHeaderTitleBadges:p,renderChannelBanner:b,customChannelActions:v,renderChannelActions:g,onParticipantNameClick:N,renderMessage:j,onMessageLinkClick:S,showChannelInfo:F,composerInput:E})=>{const{client:L,isConnected:$,isLoading:P,error:D,refreshConnection:I,service:M,debug:C}=Ot(),[T,A]=m.useState(null),[O,B]=m.useState(null),[V,K]=m.useState(!1),{showDeleteConversation:Z=!0}=e,X=m.useRef(l);X.current=l;const y=m.useRef(a);y.current=a;const R=m.useRef(null),G=m.useRef(null);m.useEffect(()=>{G.current=T},[T]),m.useEffect(()=>{if(!L||!$)return;const U=L.userID;if(!U)return;const q=`${U}::${i}`;if(R.current===q)return;R.current=q;const W=()=>{R.current===q&&(R.current=null)};(async()=>{var we,_e;try{C&&console.log("[MessagingShell] Loading initial conversation with:",i);const ee=await L.queryChannels({type:"messaging",members:{$eq:[U,i]}},{},{limit:1});if(ee.length>0){A(ee[0]),B(null),(we=y.current)==null||we.call(y,ee[0]),C&&console.log("[MessagingShell] Initial conversation loaded:",ee[0].id);return}const re=X.current;if(!re||!M){W(),B("No conversation found with this account"),C&&console.log("[MessagingShell] No conversation found for:",i);return}try{const ne=await M.startChannelWithParticipant({id:re.id,name:re.name,phone:re.phone});A(ne),B(null),(_e=y.current)==null||_e.call(y,ne),C&&console.log("[MessagingShell] Channel created and loaded:",ne.id)}catch(ne){console.error("[MessagingShell] Failed to create conversation:",ne),W(),B("Failed to create conversation")}}catch(ee){console.error("[MessagingShell] Failed to load initial conversation:",ee),W(),G.current||B("Failed to load conversation")}})()},[i,L,$,M,C]);const Y=m.useRef(r);Y.current=r;const H=m.useCallback(()=>{var U;A(null),K(!0),(U=Y.current)==null||U.call(Y)},[]);return P?t.jsx(Se,{}):D?t.jsx(fe,{message:D,onBack:I}):!$||!L?t.jsx(fe,{message:"Not connected to messaging service",onBack:I}):O?t.jsx(fe,{message:O}):V&&!T?t.jsx(fe,{message:"Conversation ended"}):T?t.jsx("div",{className:"messaging-shell h-full bg-background-primary overflow-hidden",children:t.jsx("div",{className:"flex h-full min-h-0 flex-col",children:t.jsx(ut,{channel:T,renderMessageInputActions:s,renderConversationFooter:n,renderChannelBanner:b,onLeaveConversation:H,onBlockParticipant:H,CustomChannelEmptyState:o,showDeleteConversation:Z,onBlockParticipantClick:d,onReportParticipantClick:u,dmAgentEnabled:f,onMessageSent:x,chatbotVotingEnabled:h,viewerLanguage:c,renderHeaderTitleBadges:p,customChannelActions:v,renderChannelActions:g,onParticipantNameClick:N,renderMessage:j,onMessageLinkClick:S,showChannelInfo:F,composerInput:E},T.id)})}):t.jsx(Se,{})};function cr(e){const s=e.state.pending_messages;if(s!=null&&s.length)for(const n of s)e.state.addMessageSorted(n.message)}const bs=m.createContext({selectedChannel:void 0,onChannelSelect:()=>{},debug:!1,renderMessagePreview:void 0,channelPreview:void 0,viewerLanguage:void 0}),dr=bs.Provider,ur=()=>m.useContext(bs),mr=(e,s)=>{const n=new Date(Date.UTC(e.getUTCFullYear(),e.getUTCMonth(),e.getUTCDate())),r=new Date(Date.UTC(s.getUTCFullYear(),s.getUTCMonth(),s.getUTCDate())).getTime()-n.getTime();return Math.floor(r/(1e3*60*60*24))},vs=e=>{const s=new Date;if(Math.floor((s.getTime()-e.getTime())/1e3)<60)return"Just now";const a=mr(e,s);return a===0?e.toLocaleTimeString([],{hour:"numeric",minute:"2-digit",hour12:!0}):a===1?"Yesterday":a<7?`${a}d`:a<28?`${Math.floor(a/7)}w`:e.toLocaleDateString("en-US",{month:"numeric",day:"numeric",year:"2-digit"})},js=m.memo(e=>{var $,P,D;const{channel:s,unread:n}=e,{selectedChannel:a,onChannelSelect:r,debug:i,channelPreview:l,renderMessagePreview:o,viewerLanguage:d}=ur(),{client:u}=w.useChatContext(),f=(a==null?void 0:a.id)===(s==null?void 0:s.id),x=qe(s);if(l){const I=l;return t.jsx(I,{...e,active:f,selectedChannel:a,onChannelSelect:r,viewerLanguage:d})}const h=()=>{s&&r(s)},c=I=>{const M=I.key==="Enter"||I.key===" ",C=I.repeat;!M||C||(I.preventDefault(),h())},p=ge(($=s==null?void 0:s.state)==null?void 0:$.members,u==null?void 0:u.userID,s==null?void 0:s.type),b=Ie(p==null?void 0:p.user),v=(P=p==null?void 0:p.user)==null?void 0:P.image,g=(()=>{var M;const I=(M=s==null?void 0:s.state)==null?void 0:M.messages;if(I!=null&&I.length){for(let C=I.length-1;C>=0;C--)if(I[C].type!=="system")return I[C]}})(),j=(()=>{var A;const I=Xe({message:g,viewerLanguage:d}),{custom_type:M,attachment_content_type:C}=(g==null?void 0:g.metadata)||{};if(M==="MESSAGE_TIP")return I||"Sent a tip";if(M==="MESSAGE_PAID")return I||"Sent a message";if(M==="MESSAGE_ATTACHMENT"){if(C==="text")return"🔒 Sent a locked message";if(C==="media")return"🔒 Sent a locked attachment"}if(I)return I;const T=(A=g==null?void 0:g.attachments)==null?void 0:A[0];return T?T.og_scrape_url?T.og_scrape_url:T.type==="image"?"📷 Sent an image":T.type==="video"?"🎥 Sent a video":T.type==="audio"?"🎵 Sent audio":T.type==="file"?"📎 Sent a file":"📎 Sent an attachment":"No messages yet"})(),S=g!=null&&g.created_at?vs(new Date(g.created_at)):"",F=g?ye(g):!1,E=o?o(g,j):`${F?"✨ ":""}${j}`,L=n??0;return i&&console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER",{channelId:s==null?void 0:s.id,isSelected:f,participantName:b,unreadCount:L,hasTimestamp:!!S}),t.jsx("div",{role:"button",tabIndex:0,onClick:h,onKeyDown:c,className:k("group w-full px-4 py-3 transition-colors text-left max-w-full overflow-hidden focus-ring rounded-[12px] [&+&]:mt-2",{"bg-black/[0.04]":f,"hover:bg-black/[0.02]":!f}),"data-dd-privacy":"mask",children:t.jsxs("div",{className:"flex items-start gap-4",children:[t.jsx(Q,{id:((D=p==null?void 0:p.user)==null?void 0:D.id)||s.id||"unknown",name:b,image:v,size:48,starred:x}),t.jsxs("div",{className:"flex-1 min-w-0 flex flex-col gap-1",children:[t.jsxs("div",{className:"flex items-center justify-between gap-2",children:[t.jsxs("h3",{className:k("text-sm font-medium truncate text-[#191918]"),children:[x&&t.jsx("span",{className:"sr-only",children:"Starred conversation. "}),b]}),S&&t.jsx("span",{className:"text-xs text-[#717070] flex-shrink-0",children:S})]}),t.jsxs("div",{className:"flex items-center justify-between gap-2 min-w-0",children:[t.jsx("p",{className:"text-sm text-[#717070] flex-1 line-clamp-1",children:E}),L>0&&t.jsx("span",{className:"bg-[#7f22fe] text-white text-[10px] rounded-full h-4 flex items-center justify-center p-1 min-w-4 text-center flex-shrink-0",children:L>99?"99+":L})]})]})]})})});js.displayName="CustomChannelPreview";const xr={last_message_at:-1},ws=m.memo(({onChannelSelect:e,selectedChannel:s,filters:n,allowNewMessagesFromUnfilteredChannels:a=!1,channelRenderFilterFn:r,sort:i=xr,className:l,customEmptyStateIndicator:o,channelListPaginator:d=w.InfiniteScroll,channelPreview:u,renderMessagePreview:f,viewerLanguage:x,lockChannelOrder:h,onMessageNewHandler:c,onMessageNew:p,onChannelVisible:b,onAddedToChannel:v,onChannelUpdated:g})=>{const N=m.useRef(0);N.current++;const{debug:j=!1}=Ye(),S=m.useCallback(E=>{for(const L of E)cr(L);return r?r(E):E},[r]);j&&console.log("📺 [ChannelList] 🔄 RENDER START",{renderCount:N.current,selectedChannelId:s==null?void 0:s.id,filters:n});const F=m.useMemo(()=>({selectedChannel:s,onChannelSelect:e,debug:j,channelPreview:u,renderMessagePreview:f,viewerLanguage:x}),[s,e,j,u,f,x]);return t.jsx("div",{className:k("messaging-channel-list h-full flex flex-col min-w-0 overflow-hidden",l),children:t.jsx("div",{className:"flex-1 overflow-hidden min-w-0",children:t.jsx(dr,{value:F,children:t.jsx(w.ChannelList,{filters:n,sort:i,options:{limit:30},allowNewMessagesFromUnfilteredChannels:a,channelRenderFilterFn:S,lockChannelOrder:h,onMessageNewHandler:c,onMessageNew:p,onChannelVisible:b,onAddedToChannel:v,onChannelUpdated:g,Paginator:d,Preview:js,EmptyStateIndicator:o},`${JSON.stringify(n)}:${JSON.stringify(i)}`)})})})});ws.displayName="ChannelList";const zt=`url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='23' fill='none'%3E%3Cpath fill='black' d='M0 0H15C15 10.1934 15.859 15.2345 19.168 21.4893C19.527 22.168 19.039 22.9917 18.274 22.9178C5.176 21.6506 0.32 6.0737 0 0Z'/%3E%3C/svg%3E") no-repeat center / 100% 100%`,hr={sent:"var(--str-chat__own-message-bubble-background-color, #1e2330)",received:"var(--str-chat__message-bubble-background-color, #f1f0ee)"},fr=({variant:e})=>t.jsx("span",{"aria-hidden":"true",className:"pointer-events-none absolute bottom-0 z-[-1] h-[1.4375rem] w-5",style:{insetInlineEnd:e==="sent"?"calc(-1 * 0.25rem)":void 0,insetInlineStart:e==="received"?"calc(-1 * 0.25rem)":void 0,transform:e==="received"?"scaleX(-1)":void 0,transformOrigin:"center",backgroundColor:hr[e],WebkitMask:zt,mask:zt}}),gr={sent:{backgroundColor:"var(--str-chat__own-message-bubble-background-color, #1e2330)",color:"var(--str-chat__own-message-bubble-color, #fff)"},received:{backgroundColor:"var(--str-chat__message-bubble-background-color, #f1f0ee)",color:"var(--str-chat__message-bubble-color, #000000)"}},_s=({variant:e,text:s,tail:n=!0,header:a,className:r})=>t.jsxs("div",{"data-dd-privacy":"mask",className:k("relative px-4 py-3","text-[0.875rem] leading-[1.3125rem] tracking-[0.14px]",r),style:{...gr[e],borderRadius:"var(--str-chat__message-bubble-border-radius, 1.5rem)",isolation:"isolate"},children:[a!=null&&t.jsx("div",{className:"mb-1 font-medium","data-testid":"message-bubble-header",children:a}),t.jsx("p",{className:"m-0 whitespace-pre-wrap break-words",children:s}),n&&t.jsx(fr,{variant:e})]}),pr=({text:e,tail:s,header:n,className:a})=>t.jsx(_s,{variant:"received",text:e,tail:s,header:n,className:a}),br=({text:e,tail:s,className:n})=>t.jsx(_s,{variant:"sent",text:e,tail:s,className:n}),vr={Sent:br,Received:pr},Ns=({question:e,onClick:s,loading:n=!1,className:a})=>t.jsx("button",{type:"button",onClick:s,disabled:n,style:{backgroundColor:"#E6E5E3"},className:k("w-full text-center p-4 rounded-xl text-charcoal font-medium transition-colors focus-ring",{"hover:brightness-95 active:brightness-90":!n,"opacity-50 cursor-not-allowed":n},a),children:e}),jr=({faqs:e,onFaqClick:s,loadingFaqId:n,headerText:a,className:r,avatarImage:i,avatarName:l})=>{const o=e.filter(d=>d.enabled).sort((d,u)=>(d.order??0)-(u.order??0));return o.length===0?null:t.jsx("div",{className:r,children:t.jsxs("div",{className:"flex gap-3 items-end",children:[(i||l)&&t.jsx("div",{className:"flex-none",children:t.jsx(Q,{id:l||"account",name:l||"Account",image:i,size:24,shape:"circle"})}),t.jsxs("div",{className:"flex-1 flex flex-col gap-3 rounded-lg p-4",style:{backgroundColor:"#F1F0EE"},children:[a&&t.jsx("p",{className:"text-md text-charcoal mb-4",children:a}),o.map(d=>t.jsx(Ns,{question:d.question,onClick:()=>s(d.id),loading:n===d.id},d.id))]})]})})};exports.ActionButton=me;exports.AttachmentThumbnail=We;exports.Avatar=Q;exports.ChannelEmptyState=ps;exports.ChannelList=ws;exports.ChannelView=ut;exports.CustomMessageProvider=ta;exports.FaqList=jr;exports.FaqListItem=Ns;exports.LinkAttachment=Ge;exports.LockedAttachment=he;exports.MediaMessage=on;exports.MessageAttachment=xe;exports.MessageBubble=vr;exports.MessageVoteButtons=xs;exports.MessagingProvider=Is;exports.MessagingShell=lr;exports.bubbleGroupPositionFromStream=Wt;exports.buildCompactMetaLabel=Jt;exports.formatFileSize=Kt;exports.formatRelativeTime=vs;exports.getFileExtensionLabel=Zt;exports.getMessageDisplayText=Xe;exports.getSourceType=se;exports.isLinkAttachment=Je;exports.isUuidLike=$t;exports.normalizeLanguageCode=Vt;exports.renderTypeIcon=oe;exports.resolveConversationParticipant=ge;exports.resolveLinkAttachment=Ee;exports.resolveMediaFromMessage=Me;exports.resolveParticipantDisplayName=Ie;exports.useComposerLocked=Va;exports.useCustomMessage=us;exports.useMessageVote=Ut;exports.useMessaging=Ot;
+//# sourceMappingURL=index-BMr8tbg4.cjs.map