GGamma

Design catalogue

Source atlas

Components16 results

ComponentsFeedback

Activity stream

An animated event feed with insertion and dismiss controls.

What to study

  • Add an event in the preview to see a new row enter from above.
  • The owner supplies events and removes dismissed IDs; the component does not invent activity.
  • New rows are announced politely; reduced motion removes entrance movement.

Topics

References

Material

Status
New
Source File
src/components/ActivityStream.tsx
Design System
gamma
Props
  • Name
    items
    Type
    ActivityItem[]
    Default
    —
    Description
    Newest-first events with stable IDs.
  • Name
    maxVisible
    Type
    number
    Default
    4
    Description
    Maximum rendered events.
  • Name
    onDismiss
    Type
    (id: string) => void
    Default
    —
    Description
    Shows dismiss buttons and reports selected IDs.
  • Name
    title
    Type
    string
    Default
    Recent activity
    Description
    Visible feed heading and region name.