نشان پلتفرم اجتماعی (SocialPlatformBadge)

معرفی

کامپوننت SocialPlatformBadge برای نمایش آیکون پلتفرم‌های شبکه اجتماعی با رنگ برند رسمی هر پلتفرم استفاده می‌شود. مناسب برای فیلترها، کارت‌ها و داشبوردهای social listening.

چه زمانی استفاده کنیم:

• برای نمایش پلتفرم اجتماعی یک اینفلوئنسر در جدول یا کارت
• در فیلترهای داشبورد برای انتخاب پلتفرم
• وقتی آیکون و رنگ برند پلتفرم برای شناسایی سریع لازم است

چه زمانی استفاده نکنیم:

• برای نمایش نام پلتفرم در متن — از متن ساده استفاده کنید
• برای لیست پلتفرم‌ها بدون context — از Badge ساده‌تر استفاده کنید

استفاده

import { SocialPlatformBadge } from '@parto-system-design/ui';

<SocialPlatformBadge platform="instagram" />
<SocialPlatformBadge platform="youtube" />
<SocialPlatformBadge platform="tiktok" />

زمین بازی

با تغییر تنظیمات زیر، نشان پلتفرم را به صورت زنده مشاهده کنید.

import { SocialPlatformBadge } from '@parto-system-design/ui'

<SocialPlatformBadge />

با برچسب

<SocialPlatformBadge platform="instagram" showLabel />

ظاهر Badge

<SocialPlatformBadge platform="instagram" variant="badge" showLabel />

اندازه‌ها

<SocialPlatformBadge platform="instagram" size="xs" />
<SocialPlatformBadge platform="instagram" size="sm" />
<SocialPlatformBadge platform="instagram" size="md" />
<SocialPlatformBadge platform="instagram" size="lg" />

Props

راهنمای استفاده

دسترسی‌پذیری

• آیکون هر پلتفرم دارای aria-label با نام پلتفرم است
• در حالت showLabel، نام پلتفرم به صورت متنی نمایش داده می‌شود
• رنگ‌های برند با پس‌زمینه کنتراست مناسب دارند

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

• Badge — اگر label عمومی (غیر پلتفرم) نیاز دارید، از Badge استفاده کنید
• SentimentBadge — اگر نیاز به نمایش احساسات (نه پلتفرم) دارید، از SentimentBadge استفاده کنید