کارت یافته (InsightCard)

یک یافتهٔ تحلیلی یا هوش مصنوعی همراه با شواهدش، برای صفحه‌های نتیجه و گزارش

معرفی

InsightCard یک یافته را با عنوان یک‌خطی، توضیح و شواهدی که یافته بر آن تکیه دارد نشان می‌دهد. توضیح با Prose نمایش داده می‌شود و اگر رشته باشد مارک‌داون خوانده می‌شود (خروجی مدل زبانی). tone لبهٔ بالای کارت را رنگ می‌کند. چند کارت را داخل یک ReportSection یا یک شبکه بگذارید.

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

  • برای یک عدد شاخص — از MetricCard استفاده کنید
  • برای پیام وضعیت یا هشدار سیستم — از Callout استفاده کنید

یافته‌های کلیدی

گفت‌وگو دربارهٔ تخفیف فصلی این هفته دو برابر شد.

اوج بحث در روز سه‌شنبه

بعد از اعلام ارسال رایگان، حجم پست‌ها در سه ساعت سه برابر شد. بیشتر واکنش‌ها مثبت بود.

شواهد:گزارش روزانه

رضایت از بسته‌بندی تازه

72 درصد نظرهای مربوط به بسته‌بندی مثبت بود؛ عکس‌های کاربران بیشترین بازنشر را گرفت.

شواهد:

استفاده

import { InsightCard } from '@partodata/ui/insight-card'
<ReportSection title="یافته‌های کلیدی" summary="گفت‌وگو دربارهٔ قیمت بنزین در این هفته دو برابر شد.">
  <div className="grid gap-4 md:grid-cols-2">
    <InsightCard
      title="اوج بحث در روز سه‌شنبه"
      tone="warning"
      evidence={[
        { label: '12 پست', onClick: () => openPosts('tuesday') },
        { label: 'گزارش روزانه', href: '/reports/daily' },
      ]}
    >
      {ai.tuesdayNarrative}
    </InsightCard>
  </div>
</ReportSection>

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

بکنید

برای هر یافتهٔ هوش مصنوعی شواهد بدهید تا کاربر بتواند آن را بسنجد.

نکنید

tone را برای تزئین به کار نبرید؛ فقط وقتی یافته واقعاً مثبت، هشداردهنده یا بحرانی است.

Props

InsightCard

Prop

Type

InsightEvidence

Prop

Type

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

  • هر شاهد یا یک لینک واقعی (a) است یا یک دکمه، پس با صفحه‌کلید در دسترس است
  • لحن فقط با رنگ لبه نشان داده نمی‌شود؛ عنوان یافته باید خودش معنا را برساند

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

  • ReportComposer — ReportSection با summary برای نتیجه‌گیری هر بخش
  • Prose — تایپوگرافی متن یافته