test2
## Summary
위키 문법을 로우코드 페이지 빌더 방향으로 확장. 사이트 전역에 이미 로드된
Bootstrap 5.3 번들을 활용해 커스텀 JS 토글 없이 키보드/포커스 a11y 가
따라오는 인터랙티브 컴포넌트를 도입.
## 새 블록 디렉티브
### `:::tabs` — Bootstrap nav-tabs
개요
내용 1
사용법
내용 2
- 부모 토큰: `{align:start|center|end}`
- 자식: `:::tab 제목 {icon:bi-...|mdi-...}`
### `:::accordion` — Bootstrap accordion
FAQ 1
답변
FAQ 2
답변
- 부모 토큰: `{multiple}` (없으면 단일 열림)
- 자식 토큰: `{open}` (초기 펼침), `{icon:...}`
### `:::steps` — 커스텀 (BS 에 stepper 없음)
1. 설치
...
2. 설정
...
3. 배포
...
- 부모 토큰: `{layout:vertical|horizontal}`
- 자식 토큰: `{status:done|current|todo}` (자동 번호)
## 엄격 토큰 화이트리스트
- 허용 키만 (`align`/`icon`/`open`/`multiple`/`layout`/`status`)
- 값은 enum 만 허용 — 자유 CSS / px·rem 차단
- 알 수 없는 토큰은 무음 무시
## 카드/콜아웃 Bootstrap 통합 (이번에 같이)
- `:::card` → `.card.card-header.card-body` + `.wiki-card*` 위키 변수 우선
- `:::info/:::tip/:::success/:::warning/:::danger/:::note` → `.alert.alert-{variant}` + 기존 `.wiki-callout*` 색 변수 우선
(BS 의 alert 기본값은 `.wiki-callout.alert` 셀렉터로 오버라이드)
## 스크롤 싱크 / 섹션 좌표 호환
신규 컴포넌트가 **에디터 스크롤싱크**, **TOC/위키링크/URL 해시 점프**, **섹션 편집 링크** 와 깨지지 않도록 3가지 통합:
1. **`_expandAncestorsForScroll`** 일반화 — 비활성 `.tab-pane` 만나면 대응 nav-tab 을 `bootstrap.Tab.show()`, 접힌 `.collapse` (아코디언 / `#collapseTOC` 포함) 는 `bootstrap.Collapse.show()`. 위키링크/푸터노트/URL 해시 점프 시 자동으로 탭/아코디언이 펼쳐진 뒤 좌표 보정.
2. **`_buildScrollSyncGuides`** — 헤딩 anchor 가 숨겨진 조상(display:none) 안일 때 `getBoundingClientRect` 가 0 좌표를 반환해 가이드가 어그러지던 문제를, 가시 조상 컨테이너 좌표로 폴백해 해결. 비활성 탭 안 헤딩에서 편집해도 프리뷰가 적어도 그 탭 컨테이너 위치까지 따라감.
3. **`_observePreviewLayoutShifts`** — `shown/hidden.bs.tab/collapse` 이벤트로 사용자가 프리뷰 탭/아코디언을 토글할 때 가이드 캐시를 즉시 무효화. ResizeObserver 만으로는 패널 display 변경을 못 잡는 케이스 보강.
## 테마
- `applyThemeClass` / `applyStoredTheme` 이 `data-bs-theme` 도 미러링
- `auto` 모드는 `prefers-color-scheme` 변경 이벤트 추적
- BS 5.3 컴포넌트(.nav-tabs / .accordion / .alert)가 자동으로 다크 모드
## 부수
- `aiParser.ts`: `:::tabs/:::accordion/:::steps` 컨테이너 오프너 제거, `:::tab/:::item` 제목은 평문, `:::step` 제목은 자동 번호로 평탄화 (MCP/AI 컨텍스트)
- `autocomplete.ts`: `:::` 자동완성 메뉴에 tabs / accordion / steps 추가
## Test plan
- [ ] 문서에 `:::tabs/:::tab` 작성 → 미리보기에서 BS 탭 동작
- [ ] `:::accordion` `{multiple}` 유무 동작 확인
- [ ] `:::steps {layout:horizontal}` / `vertical` 양쪽 확인
- [ ] 다크 모드에서 BS 컴포넌트 색상 확인
- [ ] 비활성 탭 안 `## 제목` 으로 가는 위키링크 `[[#s-1.2]]` 점프 → 탭 자동 활성화 + 좌표 정확
- [ ] URL `/w/문서#s-1.2` 직접 접근 → 동일하게 자동 펼침
- [ ] 에디터 스크롤싱크 (oneway / twoway) — 비활성 탭 안 헤딩에서 회귀 없는지
- [ ] 콜아웃 / 카드 기존 문서 시각 회귀 없음
- [ ] MCP `read` 응답에서 탭/아코디언/스텝 평탄화 확인
https://claude.ai/code/session_01BPFaNeXZTD9QpvSLTBAJt9
---
_Generated by [Claude Code](https://claude.ai/code/session_01BPFaNeXZTD9QpvSLTBAJt9)_