reopt designreopt design
DocsExploreToolsPricingBuilder
Login
Explore/
opt-ui165opt-charts33opt-datagrid6opt-editor5opt-calendar4opt-filemanager4opt-chat6opt-shell14brandapp-ui8Examples12Builder Blocks
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • GitHub
  • Terms of Service
  • Privacy Policy

reopt Inc.Business registration no. 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

Explore/opt-shell/DataGrid Adapter
Adapteropt-shell example

DataGrid Adapter

Bridge opt-datagrid into harness chrome without replacing the engine.

datagridadapterworkspace
bun add @reopt-ai/opt-shell @reopt-ai/opt-datagrid @reopt-ai/opt-ui
ShellProviderListWorkspaceShellDataGridAdapter
1024px

Portfolio records

A production-style records workspace that connects filters, portfolio rows, and dossier navigation.

Portfolio table

The grid stays editable while filters, status, and footer remain part of the app workflow.

Revenue portfolio

Showing 5 records with renewal timing and health status.

Apollo Ledger
Jiwoo Han
At risk
14 days
Northstar Renewal
Mina Park
Healthy
37 days
Atlas Claims
Daniel Kim
Expansion
63 days
Meridian Onboarding
Sena Yoon
At risk
21 days
Delta Risk
Chris Lee
Healthy
52 days
5 records · No filterRecommended next step: open an at-risk dossier.
Quick-open dossiers
3 shown
Apollo Ledger
At risk
Jiwoo Han · 14 days
Dossier snapshot
Northstar Renewal
Healthy
Mina Park · 37 days
Dossier snapshot
Atlas Claims
Expansion
Daniel Kim · 63 days
Dossier snapshot
5 of 5 records visibleDataGrid engine with an app-owned workflow frame.

Related Examples

opt-shell

Dashboard Workspace

opt-shell - Workspace

Examples
ShellProviderDashboardWorkspace+1
opt-shell

Editor Adapter

opt-shell - Adapter

Examples
ShellProviderEditorWorkspace+1
opt-shell

List Workspace

opt-shell - Workspace

Examples
ShellProviderListWorkspace+1
PreviousFlyout AsideNextEditor Adapter