AlertManager
BlocksManage alerts with a DataTable and AlertBuilder.
Use accessible buttons with primary, secondary, ghost, and danger variants, three sizes, icons, loading, and aria-busy states.
bun add @reopt-ai/opt-uiimport { Button } from "@reopt-ai/opt-ui";Change the width and theme, then interact with the components.
Save a draft, then try a failed request and retry.
Manage alerts with a DataTable and AlertBuilder.
Compare up to five cohorts across four tabs with comparison charts, retention heatmaps, and tables.
Arrange custom dashboard widgets with WidgetGrid, ReportBuilder, ReportWidget, and FilterBar.
Present an item or product with tags, author information, content, and reviews.
Configure user-path analysis and explore grid or Sankey flows, top paths, drop-off, patterns, entry and exit points, and dwell time.
Summarize a project with metrics, navigation cards, charts, tables, code snippets, and dashboard management.
Manage project settings, retention policies, cleanup previews, and storage usage with forms, tables, and code snippets.
Manage segments with a DataTable and SegmentBuilder.
Build a dropdown selection with Root, Label, Trigger, Popover, and Item components.
Build autocomplete search with an input, popover, items, groups, group labels, and an empty state.
Use a standalone text input with labels, errors, hints, and icons.
Toggle a setting with three sizes and explicit accessible associations for labels and descriptions.
Enter multiline text with the same label, error, and hint API as Input.
Use labeled checkboxes with descriptions, groups, and an indeterminate state synchronized to the DOM property.