안내는 일을 막지 않습니다. 언제든 건너뛰고, 숨긴 뒤에도 사이드바 바닥(런처)과 도움말 메뉴에서 다시 엽니다. 기능을 차례로 설명하는 투어보다 빈 화면에서 첫 동작을 바로 하게 하는 것을 먼저 씁니다. 진행 상태(마친 것 · 숨긴 것 · 본 코치마크)는 앱이 저장합니다.

import

import { OnboardingChecklist, OnboardingLauncher, FirstSteps } from "@uyoolabs/ui/ui"; import { Coachmark } from "@uyoolabs/ui/overlay";

쓰는 경우

체크리스트는 새 워크스페이스 · 새 멤버의 처음 할 일 3~6개에, 항목마다 바로 하는 버튼과 함께 씁니다. 코치마크는 화면 밖에서 시작한 일(초대 메일 → 첫 진입)이 가리키는 한 곳, 새로 생긴 기능 한 곳에 씁니다. 빈 화면은 Empty first-use 와 FirstSteps 로 엽니다.

쓰지 않는 경우

첫 진입에 가림막 투어를 저절로 띄우지 않습니다(가림막은 사람이 [둘러보기]를 누른 투어에만). 코치마크를 네 단계 넘게 잇지 않습니다. 화살표로 대상을 가리키지 않습니다. 마친 항목에 취소선 · 축하 효과를 두지 않습니다. 오류 · 경고 색으로 '아직 안 함'을 재촉하지 않습니다. 닫으면 진행이 사라지게 하지 않습니다.

저장 · 첫 방문

저절로 뜨는 코치마크는 그 화면의 첫 방문에 한 번만, 비모달로만 띄웁니다. 마침 · 건너뛰기 · Esc 모두 '봤음'으로 저장하고, 다시 보기는 도움말 메뉴에 둡니다.

접근성

체크리스트는 제목이 이름인 section 안의 APG Disclosure 이고, 완료 · 건너뜀은 이름 뒤 숨은 글자로 읽힙니다. 진행 글이 바뀌면 role=status 로 한 번 알립니다. 코치마크는 비모달 dialog 로 대상에 aria-describedby 로 본문을 잇고, 대상이 없는(권한 · 화면 크기) 단계는 건너뜁니다.