Banner

<div className="flex w-560 max-w-full flex-col gap-12">
      <Banner tone="info" title="New models are available" actions={<Button size="sm">Review</Button>} onDismiss={() => undefined}>
        models.dev added 4 models since the last sync.
      </Banner>
      <Banner tone="warning">This key expires in 5 days.</Banner>
      <Banner tone="danger" title="This organization is scheduled for deletion" actions={<Button size="sm">Restore organization</Button>}>
        Its keys stopped working; on 20 Oct 2026 it is deleted for good.
      </Banner>
      <Banner tone="success">Single sign-on is on for northwind.example.</Banner>
      <Banner>Content logging is off for this project.</Banner>
    </div>