reopt designreopt design
DocsExploreToolsPricingBuilder
Explore/
opt-ui161opt-charts21opt-datagrid5opt-editor5opt-chat6opt-shell14brandapp-ui8Examples12
reopt designreopt design

A design system for the AI era

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

© 2026 reopt-ai. All rights reserved.

Explore/opt-shell/Fullscreen Review
Reviewopt-shell example

Fullscreen Review

ShellFullscreenToolSurface로 승인/검수 단계를 recipe 화면 밖의 독립 surface로 분리합니다.

Dedicated review surface that keeps approval work outside recipe screens.

fullscreenreviewapproval
bun add @reopt-ai/opt-shell @reopt-ai/opt-editor @reopt-ai/opt-ui
ShellProviderShellFullscreenToolSurface
1024px
Fullscreen review

Review Surface

A dedicated approval view keeps proof, comments, and final decisions separate from the drafting workspace.

PASS proof alignedEditor adapter

Narrative proof view

Customer Expansion Memo

This draft packages the proof, narrative, and rollout context for the Apollo Ledger expansion committee.

Priority: keep the narrative aligned with the fresh PASS proof and the latest ROI evidence.

What changed since the last review

The candidate app frame now uses the compact records workspace with a card-chrome grid, reducing scan time for renewal operators while keeping the existing data model intact.

Reviewers only need one pass: confirm the PASS proof hash, validate the ROI summary, and approve the rollout note for the commercial committee.

Approval checklist

Evidence packet uses the latest proof hash.

Commercial ROI summary matches the finance review.

Reviewer comments are narrowed to one narrative note.

Surface rationale

The fullscreen tool surface is intentionally outside the recipe screens so approval conversations are not constrained by list or detail layouts.

That separation is the key reason this example needs to exist beyond Builder Preview.

Decision window closes at 11:30 KST.

Related Examples

스크롤 가능한 콘텐츠 영역
3개 항목 선택됨
Layoutopt-shell

Bottom Bar

ShellBottomBar로 선택 액션과 승인 액션을 화면 하단에 sticky하게 붙여 작업 맥락을 유지합니다.

stickybulk-actionsfooter
ShellProviderShellBottomBar
Open

Completeness Score

audit finding 수를 조절하면서 점수 변화를 확인하세요.

3/5
72/ 1007/10 passed
layout0%
recipe-contract67%
adapter-ownership100%
state-ux100%
design-document100%
scaffold-bundle100%
accessibility100%
Scoringopt-shell

Completeness Score

computeCompletenessScore로 audit finding을 7개 카테고리로 분류하고 0-100 가중 평균 점수를 산출합니다.

completenessscoreauditscoring
computeCompletenessScore
Open

Coverage Report

8개 라우트 파일 대비 하네스 rollout target 매칭 결과

75%6/8 covered
Recipe Breakdown
dashboard: 1list: 1detail: 1editor: 1fullscreen: 1
Uncovered Paths
  • app/settings/page.tsx
  • app/analytics/page.tsx
Scoringopt-shell

Coverage Report

computeShellCoverage로 라우트 파일 대비 하네스 채택률을 정적 분석하고 recipe별 breakdown과 미커버 경로를 표시합니다.

coverageroutesrolloutscoring
computeShellCoverage
Open
PreviousEditor AdapterNextCompleteness Score