Design System × slur.js
화면 조립본
Tailwind·shadcn·헤드리스 라이브러리 없이 슬러 토큰·컴포넌트·slur.js만으로 만든 화면 여덟 장. 새 화면은 여기서 복사해 시작한다. 화면끼리는 실제 흐름대로 연결돼 있다(로그인 ↔ 가입·재설정, 목록 → 상세).
대시보드앱 셸 · 통계 카드 · 차트 토큰 · 4상태 표 · 행 메뉴 · 페이지네이션 · 모달 · 토스트
로그인인증 셸 · 인라인 오류 · 비밀번호 보기 · 로딩 버튼 · 실패 alert · 소셜 로그인
고객 목록상태 탭 → 4상태 · 검색·필터 · 선택 바 · 정렬 · 행 메뉴 → 삭제 확인 → 토스트
설정구역 내비 · 프로필/알림/보안 카드 · 스위치 · 변경 추적 저장 바 · 위험 구역 삭제 게이트
회원가입인증 셸 · 비밀번호 강도·규칙 체크리스트 · 약관 전체 동의(indeterminate) · 중복 이메일 alert · 인증 메일 안내 + 재전송 잠금
비밀번호 재설정네 단계 한 파일(요청 → 메일 확인 → 새 비밀번호 → 완료) · 단계별 제목 포커스 · 재전송 잠금 · 서버 거절 alert
고객 상세 / 편집정체 헤더 + 더보기 메뉴 · 탭(개요/청구서/활동) · 보기↔편집 전환 · 변경 추적 저장 바 · 변경 버리기 확인 · 4상태 표 · 타임라인
시작하기(온보딩)빈 워크스페이스 히어로(empty_state) · 진행 체크리스트(progress) · 첫 고객·초대 dialog → 단계 완료 · 4상태 활동 empty→success
컴포넌트 전체 데모는 레포의 system/demo.html. 이 파일들은 서버 없이 더블클릭으로 열어도 동작한다(상대경로).