reopt design
DocsExploreTemplatesCanvasToolsPricing
Login
opt-uiopt-chartsopt-datagridopt-editoropt-calendaropt-filemanageropt-chatopt-shellbrandapp-ui
Overview205Core74Shells99Blocks32
DeploymentTimeline
reopt designreopt design

A design system for the AI era

  • Docs
  • Pricing
  • Releases
  • About
  • Contact
  • Terms of Service
  • Privacy Policy

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

© 2026 reopt Inc. All rights reserved.

DeploymentTimeline

Shell

Follow deployment stages on a timeline with Composite keyboard navigation.

workflow
Related docs
bun add @reopt-ai/opt-ui
Install and import
bash
bun add @reopt-ai/opt-ui
tsx
import { DeploymentTimeline } from "@reopt-ai/opt-ui";

Live preview

Change the width and theme, then interact with the components.

100%

기본 사용

배포 진행 상황

완료된 배포

Production 배포

DeploymentTimeline

PropTypeDefaultDescription
stepsRequiredDeploymentStep[]—배포 단계 배열. { id, name, status, duration?, detail? }
titlestring"배포 타임라인"타임라인 제목

컴포넌트 의존 관계

깊이
▲ USED BY (2)project-dashboarddeployment-centerDeploymentTimeline
View test results

테스트 커버리지

2026년 7월 9일6/6 통과
6성공
0실패
6전체
  • list role을 렌더링한다
  • 모든 스텝을 렌더링한다
  • 상태 뱃지를 표시한다
  • duration을 표시한다
  • detail을 표시한다
  • 커스텀 타이틀을 표시한다

Blocks that use this component

opt-ui

DeploymentCenter

Blocks

Manage deployments with branch and status selectors, quick actions, timelines, domains, and environment variables.

opt-ui

ProjectDashboard

Blocks

Build a project overview with DashboardGrid, DeploymentTimeline, and EnvPanel.

Related components

opt-ui

TaskList

Shells

Manage tasks with priorities, statuses, assignees, tags, and subtasks.

opt-ui

ActivityFeed

Shells

Read activity and logs in a timeline with relative timestamps.

opt-ui

WorkflowCanvas

Shells

Arrange workflow steps on grid cells with SVG connections and keyboard movement.

opt-ui

FeatureFlagPanel

Shells

Manage feature toggles, environment badges, and rollout percentages.

opt-ui

AuditLog

Shells

Read audit events in a timeline with avatars, action text, and metadata badges.

opt-ui

AuditTimeline

Shells

Review change history with action colors and expandable diffs.

PreviousCommandPaletteTriggerNextProjectSwitcher