reopt designreopt design
DocsExploreToolsPricingBuilder
로그인
Explore/
opt-ui165opt-charts33opt-datagrid6opt-editor5opt-calendar4opt-filemanager4opt-chat6opt-shell14brandapp-ui8Examples12Builder Blocks
Overview165Core59Shells75Blocks31
reopt designreopt design

AI 시대를 위한 디자인 시스템

  • 문서
  • 가격
  • 릴리즈 노트
  • GitHub
  • 서비스 약관
  • 개인정보처리방침

주식회사 리옵트사업자등록번호 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

Explore/셸/QueryResultsTable

QueryResultsTable

셸

쿼리 결과 테이블. SQL 결과와 스크린 리더에 안내되는 로딩, 에러, 빈 상태를 지원합니다.

data
관련 문서
npx @reopt-ai/opt-cli surface add query-results-table
100%
#user_ideventtimestampproperties
1usr_001page_view2026-02-05 10:23:01{"path":"/home"}
2usr_002click2026-02-05 10:23:05{"button":"signup"}
3usr_001purchase2026-02-05 10:24:12{"amount":49}
4usr_003page_view2026-02-05 10:25:00{"path":"/pricing"}
4 row(s)

쿼리를 실행하고 있습니다...

warehouse connection timed out

조건에 맞는 결과가 없습니다

컴포넌트 의존 관계

깊이
▲ USED BY (1)sql-workspaceQueryResultsTable

테스트 커버리지

2026년 7월 9일4/4 통과
4성공
0실패
4전체
  • 테이블을 렌더링한다
  • 에러 상태를 렌더링한다
  • 로딩 상태를 렌더링한다
  • 빈 상태를 렌더링한다

관련 컴포넌트

DomainTable

도메인 테이블. Composite 기반 그리드로 키보드 탐색 지원.

데이터

DataTable

제네릭 데이터 테이블. 동적 컬럼, 결측값 안전 정렬, 키보드 컬럼 리사이즈, 보정된 인라인 진행률과 Composite 탐색을 지원합니다.

데이터

WidgetGrid

위젯 그리드. react-grid-layout 래퍼로 드래그/리사이즈 가능한 대시보드 위젯을 배치합니다.

데이터

TreeTable

계층형 트리 테이블. 재귀 행 렌더링 + 펼침/접기 셰브론.

데이터

InlineEditTable

인라인 편집 테이블. 더블클릭으로 셀 편집, Enter 확정, Escape 취소.

데이터

KanbanBoard

칸반 보드. HTML5 DnD로 카드를 컬럼 간 드래그&드롭.

데이터워크플로우
이전PropertyExplorer다음AlertBuilder

기본 사용

도메인 관리

DomainStatusSSLRedirectAdded
example.comActiveValid—2024-01-15
www.example.comActiveValidexample.com2024-01-15
api.example.comActiveValid—2024-02-01
staging.example.comPendingPending—2024-03-01
old.example.comErrorExpired—2023-06-01

기본 사용

사용자 목록

이름이메일역할상태완료율
김철수kim@example.comAdmin활성0.82
이영희lee@example.comEditor활성1.2
박민수park@example.comViewer비활성—
최지은choi@example.comEditor활성-0.15
정우성jung@example.comViewer활성0.46

헤더를 눌러 정렬하고, 컬럼 경계에 포커스한 뒤 ←/→(Shift는 40px)로 너비를 바꿀 수 있습니다. 완료율은 범위를 벗어나거나 NaN이어도 0–100% 사이로 안전하게 표시됩니다.

빈 상태

빈 테이블

등록된 사용자가 없습니다
Widget A
Widget B
Widget C
NameSizeType
src
—
folder
index.ts
2.1 KB
file
utils
—
folder
package.json
1.2 KB
file
NameEmail
Alicealice@example.com
Bobbob@example.com

To Do

2

Setup CI

Alice

Write tests

Bob

In Progress

1

Build UI

Charlie

Done

0