پرتوپرتو

PostMedia (پست‌مدیا)

رندرر چندحالته‌ی رسانه برای پست‌ها — تک‌تصویری، گرید، کاروسل، ویدیو، صوت با حالت‌های loading / failed / unavailable / source-removed و بلر NSFW.

معرفی

<PostMedia> تنها رنده‌رر canonical برای محتوای رسانه‌ای پست‌هاست. روی body.type در PostBodyData دیسپچ می‌کند و همه‌ی حالت‌های دانلود/کیفیت/حساسیت را با یک API مدیریت می‌کند.

  • چه زمانی استفاده کنیم: هرجا که در داخل <PostCard> یا <PostDetailsDrawer> رسانه‌ی پست را رندر می‌کنید.
  • چه زمانی استفاده نکنیم: برای تصاویر تکی غیر پست — به جای آن از <SafeImage> یا <AspectRatio> استفاده کنید.

زمین بازی

زمین بازی
نمونه تصویر
تنظیمات
ظاهر
کد این نمونه به‌صورت خودکار قابل تولید نیست — برای کد آماده‌ی copy/paste به بخش «استفاده» در بالای صفحه مراجعه کنید.

استفاده

import { PostMedia } from '@parto-system-design/ui'
;<PostMedia body={post.body} context="comfortable" onRetry={(item) => refetch(item.url)} />

حالت‌ها

  • media-single — تک‌تصویر با backdrop بلر‌شده
  • media-grid (۲–۴ تصویر) — لِی‌اوت Instagram-style
  • media-carousel (۵+) — اسلایدر با dots + counter
  • video — تامبنیل + play overlay + duration chip
  • audio — waveform + play (مناسب رادیو/voice-note)
  • وضعیت loading — shimmer placeholder
  • وضعیت failed — placeholder با دکمه‌ی تلاش مجدد
  • وضعیت unavailable — placeholder «در سامانه ذخیره نشده»
  • source-removed — اعلان بایگانی + دکمه‌ی «نمایش بایگانی»
  • sensitivity (nsfw/graphic/spoiler) — بلر با reveal کلیکی

کامپوننت‌های مرتبط

  • اگر فقط متن نمایش می‌دهید → از <PostBody> خود <PostCard> استفاده کنید
  • اگر می‌خواهید چندین کارت در فید نمایش دهید → از <PostList> به‌جای رندر مستقیم <PostMedia>