@simplysm/sd-claude 14.0.71 → 14.0.73

package/claude/references/sd-simplysm14/README.md

@@ -17,6 +17,7 @@ ORM 호출, 파일 변환, 비즈니스 로직 등은 위 두 사유에 해당
 
 - **기본 검증 (평소 사용)**: `pnpm check --fix` — typecheck + lint 일괄, 자동 수정 포함.
 - **보조**: `pnpm typecheck`, `pnpm lint` — `pnpm check` 에서 문제 났을 때 각각 따로 보기 위함. 단독 사용은 회피.
+- **`-t` 타겟 표기**: `sd.config.ts` 의 `packages` 키(`@simplysm/` 접두사 **제외** 한 짧은 이름. 예: `excel`, `core-node`, `sd-cli`) 임을 본문에 명시. 풀네임 사용을 막기 위해 예시도 짧은 이름으로 통일.
 
 ## 개발 매뉴얼
 
@@ -47,8 +48,8 @@ ORM 호출, 파일 변환, 비즈니스 로직 등은 위 두 사유에 해당
 - **lint** — ESLint flat config 작성 시 `@simplysm/lint/eslint-recommended` 프리셋 또는 `@simplysm/lint/eslint-plugin` 개별 규칙 import. 자세히: [apis/lint/README.md](./apis/lint/README.md)
 - **orm-common** — Dialect 독립 ORM 코어. `DbContext` 서브클래싱 + Table/View/Procedure 빌더 + `expr` AST + `Queryable` 체이닝으로 SQL 을 만들고 dialect QueryBuilder 로 렌더. 자세히: [apis/orm-common/README.md](./apis/orm-common/README.md)
 - **orm-node** — Node 환경에서 `DbContext` 를 MSSQL/MySQL/PostgreSQL 실 연결에 붙이는 어댑터(`createOrm`), raw SQL/bulk insert (`createDbConn`). 자세히: [apis/orm-node/README.md](./apis/orm-node/README.md)
-- **sd-claude** — `.claude/` 자산 배포 및 `sd-claude` CLI 만 제공. 라이브러리 코드 API 없음(npm 배포 전용). 자세히: [apis/sd-claude/README.md](./apis/sd-claude/README.md)
-- **sd-cli** — `sd.config.ts` 작성 타입, Vitest 의 Angular AOT plugin(`sdAngularPlugin`), TS 패키지 증분 컴파일 엔진(`SdTsCompiler`). 자세히: [apis/sd-cli/README.md](./apis/sd-cli/README.md)
+- **sd-claude** — simplysm 표준 Claude 자산(스킬·룰·훅) 동기화 및 Claude 계정 저장/전환 CLI(`sd-claude auth save`/`switch`). 라이브러리 코드 API 없음. 자세히: [apis/sd-claude/README.md](./apis/sd-claude/README.md)
+- **sd-cli** — simplysm 빌드/배포 오케스트레이션 CLI. 서브커맨드(`check`/`watch`/`dev`/`device`/`build`/`publish`/`replace-deps`/`init`), `sd.config.ts` 작성 타입, Vitest 의 Angular AOT plugin(`sdAngularPlugin`), TS 패키지 증분 컴파일 엔진(`SdTsCompiler`). 자세히: [apis/sd-cli/README.md](./apis/sd-cli/README.md)
 - **service-client** — `@simplysm/service-server` 와 WebSocket 으로 통신하는 클라이언트. RPC·이벤트 구독·파일 업/다운로드·원격 ORM 실행을 단일 `ServiceClient` 에서 제공(Node/브라우저 공용). 자세히: [apis/service-client/README.md](./apis/service-client/README.md)
 - **service-common** — 서버/클라이언트가 공유하는 서비스 프로토콜·메시지·서비스 인터페이스·앱 구조·이벤트 정의. 자세히: [apis/service-common/README.md](./apis/service-common/README.md)
 - **service-server** — Fastify + WebSocket 위에 서비스(`defineService`)·JWT 인증(`auth`)·빌트인 ORM/AutoUpdate/AppStructure·V1 레거시 호환을 부트스트랩(`createServiceServer().listen()`). 자세히: [apis/service-server/README.md](./apis/service-server/README.md)

package/claude/references/sd-simplysm14/apis/angular/README.md

@@ -4,29 +4,29 @@ Angular 21 기반 클라이언트 UI 라이브러리. 폼/리스트/시트/모
 
 ## 사용 트리거 인덱스
 
-- **앱 부트스트랩** — `provideSdAngular`, `SdAngularConfigProvider`, `setupBgTheme`, `SdSystemLogProvider`. 앱 부트스트랩/루트 컴포넌트에서 1회.
-- **테마 (`SdThemeProvider`, `SdThemeSelector`)** — dark/fontSize 토글. `provideSdAngular`가 localStorage 자동 연동.
-- **라우팅/페이지 컨텍스트** — 자세히: [routing.md](./routing.md). `SdRouterLink`, `injectViewTypeSignal`, `setupCanDeactivate` 등.
-- **앱 구조/메뉴/권한** — 자세히: [app-structure.md](./app-structure.md). `SdAppStructureProvider`, `injectPermsSignal`, `SdMenu`.
-- **모달** — 자세히: [modal.md](./modal.md). `SdModalProvider`, `SdModal`, `SdPromptModal`/`SdConfirmModal`, `SdAddressSearchModal`.
-- **토스트** — 자세히: [toast.md](./toast.md). `SdToastProvider`(info/success/warning/danger/notify/try).
-- **버튼류** — 자세히: [buttons.md](./buttons.md). `SdButton`, `SdAnchor`, `SdAdditionalButton`, `SdModalSelectButton`.
-- **입력/폼 컨트롤** — 자세히: [forms.md](./forms.md). `SdForm`, `SdTextfield`/`SdTextarea`/`SdNumpad`/`SdRange`/`SdDateRangePicker`, `SdCheckbox`/`SdSwitch`/`SdCheckboxGroup(Item)`.
-- **드롭다운/셀렉트** — 자세히: [select-dropdown.md](./select-dropdown.md). `SdDropdown(Popup)`, `SdSelect(Item|Button)`.
-- **레이아웃 (사이드바/탑바)** — 자세히: [layout.md](./layout.md). `SdSidebar*`, `SdTopbar*`.
-- **시트(테이블)** — 자세히: [sheet.md](./sheet.md). `SdSheet`, `SdSheetColumn`, `SdSheetColumnCellTemplate`, `SdSheetConfig*`.
-- **CRUD 화면 골격** — 자세히: [crud.md](./crud.md). `SdBaseContainer`, `SdCrudList`, `SdCrudDetail`.
-- **서버 공유 데이터 (`SharedData*` + 선택 컨트롤)** — 자세히: [shared-data.md](./shared-data.md). `SdSharedDataProvider`, `SdSharedDataSelect(Button|List)`, `matchesSearchText`.
-- **선택/확장/정렬 매니저 훅** — 자세히: [selection-managers.md](./selection-managers.md). `useSelectionManager`, `useExpandingManager`, `useSortingManager`.
-- **칸반 보드** — 자세히: [kanban.md](./kanban.md). `SdKanbanBoard`, `SdKanban`, `SdKanbanLane`.
-- **시각 컴포넌트 (라벨/노트/프로그레스/달력/바코드/차트)** — 자세히: [visual.md](./visual.md).
-- **인프라 프로바이더 (서비스 클라이언트/파일 다이얼로그/스토리지/시스템 설정/인쇄)** — 자세히: [infrastructure.md](./infrastructure.md).
-- **`SdBusyContainer` / `SdBusyProvider`** — busy 오버레이. `provideSdAngular`가 라우터 navigation 동안 globalBusyCount 자동 증감.
-- **`SdPermissionTable`** — `SdPermission<TModule>[]` 트리를 `Record<string, boolean>` 모델로 편집하는 권한표.
-- **`SdStatePreset` / `SdStatePresetDef`** — 화면 상태(`state`)를 키별 프리셋으로 저장/복원. `SdSystemConfigProvider` 활용.
-- **`SdTiptapEditor`** — Tiptap 기반 리치 에디터. `value`, `extensions`, `validatorFn`.
-- **유틸 디렉티브/파이프 등** — 인라인 항목 참조.
-- **유틸 타입/함수** — 인라인 항목 참조.
+- **앱 부트스트랩** — 루트 컴포넌트에서 `provideSdAngular`로 zoneless·테마·에러 핸들러·`.capture/.passive/.once` 이벤트 변형·라우터 navigation busy 자동 등록. `SdAngularConfigProvider`(clientName), `setupBgTheme`(body 배경 토글), `SdSystemLogProvider`(severity별 로그 후크). 본문 인라인.
+- **테마** — `SdThemeProvider`(dark/fontSize 신호 + localStorage 자동 영속화), `SdThemeSelector`(토글 UI). 본문 인라인.
+- **라우팅/페이지 컨텍스트** — 페이지 코드(`a.b.c`)·뷰 타입(`page|modal|control`)·새창 navigation·`SdRouterLink`·canDeactivate 헬퍼. 자세히: [routing.md](./routing.md).
+- **앱 구조/메뉴/권한** — 서버 `AppStructureService` 트리를 받아 메뉴/권한 신호로 노출. `SdAppStructureProvider`·`injectPermsSignal`·`SdMenu`/`SdFlatMenu`/`SdPermission`. 자세히: [app-structure.md](./app-structure.md).
+- **모달** — 프로그래밍 `SdModalProvider.showAsync` 또는 선언형 `<sd-modal>`. 내장 `SdPromptModal`/`SdConfirmModal`/`SdAddressSearchModal`. 자세히: [modal.md](./modal.md).
+- **토스트** — `SdToastProvider`로 info/success/warning/danger 전역 알림 + 커스텀 컴포넌트 `notify` + 에러 자동 처리 `try`. 자세히: [toast.md](./toast.md).
+- **버튼류** — 일반 `SdButton`, 링크형 `SdAnchor`, 본문+부가 `SdAdditionalButton`, 모달 검색 선택 `SdModalSelectButton`. 자세히: [buttons.md](./buttons.md).
+- **입력/폼 컨트롤** — `<sd-form>` 안에 텍스트/숫자/날짜/체크박스 류 컨트롤. `SdTextfield`, `SdTextarea`, `SdNumpad`, `SdRange`, `SdDateRangePicker`, `SdCheckbox`/`SdSwitch`/`SdCheckboxGroup(Item)`. 자세히: [forms.md](./forms.md).
+- **드롭다운/셀렉트** — 트리거+팝업 `SdDropdown(Popup)`, 옵션 선택 `SdSelect(Item|Button)`. 자세히: [select-dropdown.md](./select-dropdown.md).
+- **레이아웃 (사이드바/탑바)** — 풀 화면 `<sd-sidebar-container>` 와 상단바 컨테이너. `SdSidebar*`, `SdTopbar*`. 자세히: [layout.md](./layout.md).
+- **시트(테이블)** — 가상 스크롤 데이터 그리드. 컬럼 정의·정렬·페이징·선택·확장 트리·설정 모달 내장. `SdSheet`, `SdSheetColumn`, `SdSheetColumnCellTemplate`, `SdSheetConfigModal`. 자세히: [sheet.md](./sheet.md).
+- **CRUD 화면 골격** — 페이지/모달 공통 컨테이너 + 리스트/디테일 골격. `SdBaseContainer`, `SdCrudList`, `SdCrudDetail`. 자세히: [crud.md](./crud.md).
+- **서버 공유 데이터 (코드성 마스터)** — 부서·거래처 등 키 기반 등록·구독·자동 부분 갱신. `SdSharedDataProvider`, `SdSharedDataSelect(Button|List)`, `matchesSearchText`. 자세히: [shared-data.md](./shared-data.md).
+- **선택/확장/정렬 매니저 훅** — `<sd-sheet>`/`<sd-select>` 내부 로직을 외부 컴포넌트에서 재사용. `useSelectionManager`, `useExpandingManager`, `useSortingManager`. 자세히: [selection-managers.md](./selection-managers.md).
+- **칸반 보드** — 드래그·드롭 카드 보드. `SdKanbanBoard`, `SdKanban`, `SdKanbanLane`. 자세히: [kanban.md](./kanban.md).
+- **시각 컴포넌트** — 라벨 `SdLabel`, 알림 박스 `SdNote`, 진행률 `SdProgress`, 월별 달력 `SdCalendar`, 바코드 `SdBarcode`, ECharts 래퍼 `SdEcharts`. 자세히: [visual.md](./visual.md).
+- **인프라 프로바이더** — 서비스 클라이언트 팩토리 `SdServiceClientFactoryProvider`, 파일 다이얼로그 `SdFileDialogProvider`, localStorage 래퍼 `SdLocalStorageProvider`, 시스템 설정 `SdSystemConfigProvider` + `injectSdSystemConfigResource`, 인쇄/PDF `SdPrintProvider`, 글로벌 에러 핸들러/이벤트 플러그인. 자세히: [infrastructure.md](./infrastructure.md).
+- **`SdBusyContainer` / `SdBusyProvider`** — busy 오버레이 컴포넌트와 전역 busy 카운트. 본문 인라인.
+- **`SdPermissionTable`** — 권한 트리 편집 표. `SdPermission<TModule>[]` 입력 → `Record<string, boolean>` 모델. 본문 인라인.
+- **`SdStatePreset` / `SdStatePresetDef`** — 화면 상태 프리셋 저장/복원. 본문 인라인.
+- **`SdTiptapEditor`** — 리치 텍스트 에디터. 본문 인라인.
+- **유틸 디렉티브/파이프** — 이벤트(`SdResize`/`SdIntersection`/`SdEvents`)·단축키(`SdCommandDirective`)·표시 효과(`SdRipple`/`SdShowEffect`)·검증(`SdInvalid`)·템플릿(`SdTypedTemplate`/`SdItemOfTemplate`)·포맷(`FormatPipe`)·spacer(`SdGap`)·접힘(`SdCollapse`/`SdCollapseIcon`)·탭(`SdTab`/`SdTabItem`)·리스트(`SdList`/`SdListItem`)·페이저(`SdPagination`)·signal 헬퍼(`mark`/`setSafeStyle`/`setupModelHook`). 본문 인라인.
+- **유틸 타입** — `DirectiveInputSignals`/`UndefToOptional`/`WithOptional`/`SelectModalOutputResult`. 본문 인라인.
 
 ## 앱 부트스트랩
 
@@ -36,60 +36,63 @@ bootstrapApplication(AppComponent, {
 });
 ```
 
-- `provideSdAngular({ clientName })`: zoneless CD, NgIcons config, 글로벌 에러 핸들러(`SdGlobalErrorHandlerPlugin`), `SdOptionEventPlugin`(이벤트 `.capture`/`.passive`/`.once`), 테마 dark/fontSize ↔ localStorage 동기화, SwUpdate 폴링, Router navigation 중 `SdBusyProvider.globalBusyCount` 자동 ±1.
+- `provideSdAngular({ clientName })`: zoneless CD, NgIcons config, 글로벌 에러 핸들러(`SdGlobalErrorHandlerPlugin`), `SdOptionEventPlugin`(이벤트 `.capture`/`.passive`/`.once`), 테마 dark/fontSize ↔ localStorage 동기화, SwUpdate 폴링(실패 시 백오프 5분→1시간), Router navigation 중 `SdBusyProvider.globalBusyCount` 자동 ±1.
 - `SdAngularConfigProvider.clientName`: localStorage 키 prefix·service client name 으로 사용. `provideSdAngular` 옵션에서 설정됨.
-- `SdSystemLogProvider.writeFn?`: severity별 로그 후크 등록(서버 전송 등). 자동으로 console에도 출력.
-- `setupBgTheme({ theme?, lightness? })`: 컴포넌트 constructor 내에서 호출. body `--background-color` CSS 변수 토글, 파괴 시 자동 복원.
+- `SdSystemLogProvider.writeFn?: (severity: "error"|"warn"|"log", ...data) => Promise<void> | void`: severity별 로그 후크 등록(서버 전송 등). 호출 시 console에도 항상 출력.
+- `setupBgTheme({ theme?, lightness? })`: 컴포넌트 constructor 내에서 호출. body `--background-color` CSS 변수 토글, destroy 시 자동 복원. `theme: "primary"|"secondary"|"info"|"success"|"warning"|"danger"|"gray"|"blue-gray"`, `lightness: "lightest"|"lighter"` (default `"lightest"`).
 
 ## 테마
 
-- `SdThemeProvider`: `dark = signal<boolean>`, `fontSize = signal<number>` (presets `[12,14,16,20,24,28]`), `increaseFontSize()`/`decreaseFontSize()`. dark면 body에 `sd-theme-dark` 클래스, fontSize는 html `font-size` 적용. `provideSdAngular`가 localStorage 영속화.
-- `SdThemeSelector`: 토글 UI 컴포넌트.
+- `SdThemeProvider`: `dark = signal<boolean>`, `fontSize = signal<number>` (presets `[12,14,16,20,24,28]`), `increaseFontSize()`/`decreaseFontSize()`. dark=true 시 body에 `sd-theme-dark` 클래스, fontSize는 html `font-size` 적용. `provideSdAngular`가 localStorage 영속화.
+- `SdThemeSelector`: dropdown 형 토글 UI (글자 크기 ± 버튼 + dark 스위치). 별도 입력 없음.
 
 ## SdBusyContainer / SdBusyProvider
 
-`<sd-busy-container [busy] [message] [type] [progressPercent]>`. type: `"spinner" | "bar" | "cube"`. `busy=true` 동안 keydown 차단.
-`SdBusyProvider.globalBusyCount = signal(0)`. > 0이면 body 전면 오버레이.
+`<sd-busy-container [busy] [message] [type] [progressPercent]>`. type: `"spinner" | "bar" | "cube"` (default = `SdBusyProvider.type()` = `"bar"`). `busy=true` 동안 keydown 차단.
+
+`SdBusyProvider`:
+- `globalBusyCount = signal(0)`. > 0이면 body 전면 오버레이.
+- `type = signal<SdBusyType>("bar")`: 전역 busy 컨테이너의 기본 type. 변경 시 즉시 반영.
 
 ## SdPermissionTable
 
-`<sd-permission-table [items] [(value)] [disabled]>`. `items: SdPermission<TModule>[]` (`SdAppStructureUtils.getPermissions` 결과), `value: Record<string, boolean>` (코드.use|edit 형식).
+`<sd-permission-table [items] [(value)] [disabled]>`. `items: SdPermission<TModule>[]` (`SdAppStructureUtils.getPermissions` 결과), `value: Record<string, boolean>` (`<fullCode>.use|edit` 형식). 트리 접기/펼치기 + 그룹 일괄 토글.
 
 ## SdStatePreset
 
-`<sd-state-preset [key] [(state)] [size]>`. `state` 를 `SdSystemConfigProvider` 키 `key` 아래 프리셋 배열로 저장/로드. 별 아이콘 클릭 → 이름 입력 모달 → 저장.
+`<sd-state-preset [key] [(state)] [size]>`. `key` 신호 아래 `SdStatePresetDef[]` = `{ name, state }[]` 를 `SdSystemConfigProvider` 에 저장. 별 아이콘 클릭 → 이름 프롬프트 → 추가. 각 프리셋 클릭 시 `state.set(obj.clone(preset.state))`.
 
 ## SdTiptapEditor
 
-`<sd-tiptap-editor [(value)] [disabled] [readonly] [required] [placeholder] [validatorFn] [extensions]>`. value=HTML string. `extensions?: AnyExtension[]` 으로 Tiptap 확장 주입.
+`<sd-tiptap-editor [(value)] [disabled] [readonly] [required] [placeholder] [validatorFn] [extensions]>`. value=HTML string. 기본 extensions: StarterKit + TextStyle + Color + Highlight + TextAlign + Image + Underline. `extensions?: AnyExtension[]` 으로 Tiptap 확장 주입(기본 위에 추가).
 
 ## 유틸 디렉티브/파이프
 
 이벤트·표시 보조용. constructor injection 또는 셀렉터 attach.
 
 - `SdOptionEventPlugin`: `(click.capture)`, `(scroll.passive)`, `(touchmove.capture.passive)`, `(transitionend.once)` 등 `.capture/.passive/.once` 변형 이벤트 바인딩 활성화. `provideSdAngular`로 자동 등록.
-- `SdResizeDirective` (`[sdResize]`): RO 기반 size 변화 emit (`{ heightChanged, widthChanged, target, contentRect }`).
-- `SdIntersectionDirective` (`[sdIntersection]`): IO entry emit.
-- `SdEvents`: 다양한 native event의 `.capture`/`.passive`/`.once` output 디렉티브 (예: `(scroll.passive)`, `(touchstart.passive)`).
-- `SdCommandDirective`: `[sdRefreshCommand]`/`[sdSaveCommand]`/`[sdInsertCommand]` — Ctrl+Alt+L/Ctrl+S/Insert 단축키 emit. 최상위 열린 모달 또는 모달이 없을 때만 처리.
+- `SdResizeDirective` (`[sdResize]`): ResizeObserver 기반 size 변화 emit (`SdResizeEvent { heightChanged, widthChanged, target, contentRect }`). requestAnimationFrame 디바운스.
+- `SdIntersectionDirective` (`[sdIntersection]`): IntersectionObserver entry emit (`SdIntersectionEvent { entry }`).
+- `SdEvents`: 다양한 native event의 `.capture`/`.passive`/`.once` output 디렉티브 (예: `(scroll.passive)`, `(touchstart.passive)`, `(focus.capture)`, `(transitionend.once)`).
+- `SdCommandDirective` (`[sdRefreshCommand]`/`[sdSaveCommand]`/`[sdInsertCommand]`): Ctrl+Alt+L/Ctrl+S/Insert 단축키 emit. 최상위 열린 모달 내부 또는 모달 없는 페이지일 때만 처리.
 - `SdRipple` (`[sdRipple]="bool"`) / `setupRipple(enableFn?)`: pointerdown 시 원형 ripple.
 - `SdShowEffect` (`[sdShowEffect]="bool"` + `[sdShowEffectType]="'l2r'|'t2b'"`) / `setupRevealOnShow`: viewport intersection 시 fade-in.
-- `SdInvalid` (`[sdInvalid]="msg"`) / `setupInvalid(getMsg)`: hidden input의 customValidity 로 form 검증 + 표시 인디케이터.
-- `SdTypedTemplate` (`<ng-template [typed]>`): template context 타입 추론용 (typeToken).
-- `SdItemOfTemplate` (`<ng-template [itemOf]>`, ctx `{ $implicit, item, index, depth }`) — 컬렉션 컴포넌트 항목 템플릿.
-- `FormatPipe` (`{{ v | format:fmt }}`): `DateTime`/`DateOnly`는 `toFormatString(fmt)`, string은 `X` 자리표시(예: `'XXX-XXXX-XXXX'`).
-- `SdGap`: spacer. `height|width|widthEm` 또는 `heightPx|widthPx`. 단위 키: `xxs|xs|sm|default|lg|xl|xxl`.
-- `SdCollapse [open]` / `SdCollapseIcon`: 접힘.
+- `SdInvalid` (`[sdInvalid]="msg"`) / `setupInvalid(getMsg)`: hidden input의 customValidity 로 form 검증 + 좌상단 빨간 점 인디케이터.
+- `SdTypedTemplate` (`<ng-template [typed]="typeToken">`): template context 타입 추론용.
+- `SdItemOfTemplate` (`<ng-template [itemOf]="items">`, ctx `SdItemOfTemplateContext { $implicit, item, index, depth }`) — 컬렉션 컴포넌트(`SdSelect`/`SdCalendar` 등) 항목 템플릿.
+- `FormatPipe` (`{{ v | format:fmt }}`): `DateTime`/`DateOnly`는 `toFormatString(fmt)`, string은 `X` 자리표시(예: `'XXX-XXXX-XXXX'`, `|` 로 다중 길이).
+- `SdGap`: spacer. `height|width` 단위 키(`xxs|xs|sm|default|lg|xl|xxl`), `heightPx|widthPx|widthEm` 픽셀/em. 값 0이면 `display:none`.
+- `SdCollapse [open]` / `SdCollapseIcon [open] [openRotate=90] [icon]`: 접힘 패널/아이콘.
 - `SdTab [(value)]`/`SdTabItem [value]`: 탭.
-- `SdList`/`SdListItem`: 리스트. `SdListItem` `layout: "accordion"|"flat"`, `selectedIcon`, `contentStyle/Class`.
-- `SdPagination [(currentPage)] [totalPageCount] [visiblePageCount=10]`.
+- `SdList [inset]`/`SdListItem [layout="accordion"|"flat"] [open] [selected] [selectedIcon] [readonly] [contentStyle/Class]` + `<ng-template #toolTpl>` (옵션 도구 영역).
+- `SdPagination [(currentPage)] [totalPageCount] [visiblePageCount=10]`. 그룹 단위 페이지 이동.
 - `mark(signal)`: array/object signal의 in-place mutation 후 shallow copy로 trigger.
 - `setSafeStyle(renderer, el, partial)`: renderer.setStyle 일괄.
-- `setupModelHook(model, canFn)`: WritableSignal의 set/update를 `canFn(value) -> boolean | Promise<boolean>`로 가로채기. constructor 내에서 호출.
+- `setupModelHook(model, canFnSignal)`: WritableSignal의 set/update를 `canFn(value) -> boolean | Promise<boolean>`로 가로채기. `canFn` 자체가 `Signal<...>` 형식 (`input<(v)=>...>()` 그대로 전달). constructor 내에서 호출.
 
 ## 유틸 타입/기타
 
-- `DirectiveInputSignals<T>`: 컴포넌트의 InputSignal 프로퍼티만 추출(`{ name: T }`). undefined 필드는 optional.
+- `DirectiveInputSignals<T>`: 컴포넌트의 InputSignal 프로퍼티만 추출(`{ name: T }`). undefined 포함 필드는 optional.
 - `UndefToOptional<T>`: undefined 포함 필드를 optional 로 변환.
 - `WithOptional<T, K>`: 특정 키만 optional 로.
 - `SelectModalOutputResult<TKey> = { selectedKeys: TKey[] }`: 모달 선택 결과.

package/claude/references/sd-simplysm14/apis/angular/buttons.md

@@ -10,7 +10,7 @@
 
 ## `<sd-anchor>`
 
-링크형 클릭 요소. `disabled`, `theme`(`primary|secondary|...|blue-gray`, default `primary`). tabindex 자동.
+링크형 클릭 요소. `disabled`, `theme`(`primary|secondary|...|blue-gray`, default `primary`). 비활성 시 tabindex 제거.
 
 ```html
 <sd-anchor [theme]="'danger'" (click)="del()">삭제</sd-anchor>
@@ -18,7 +18,14 @@
 
 ## `<sd-additional-button>`
 
-본문 + 우측 부가 버튼 슬롯. `size`.
+본문 영역 + 우측 부가 버튼 슬롯(`<sd-anchor>`, `<sd-button>` projection). `size: "sm"|"lg"`, `inset`.
+
+```html
+<sd-additional-button>
+  본문 내용
+  <sd-button (click)="...">+</sd-button>
+</sd-additional-button>
+```
 
 ## `<sd-modal-select-button>`
 
@@ -32,6 +39,8 @@
   [modalOptions]="{ resizable: true }"
   [required]="true"
   [disabled]="false"
+  [size]="'sm'"
+  [inset]="false"
   [searchIcon]="customIcon">
   {{ displayLabel() }}
 </sd-modal-select-button>
@@ -39,4 +48,5 @@
 
 - `SdSelectModal<TKey>` = `SdModalContentDef<SelectModalOutputResult<TKey>>` + `selectMode: InputSignal<"single"|"multi"|undefined>` + `selectedKeys: InputSignal<TKey[]>`.
 - `SdSelectModalInfo<T>` = `SdModalInfo<T, "selectMode"|"selectedKeys">`.
-- erase 아이콘 클릭 시 `value` 초기화(`undefined` 또는 `[]`).
+- value 가 있고 required 가 아니면 좌측에 erase 아이콘 노출 → 클릭 시 초기화(single 은 `undefined`, multi 는 `[]`).
+- 검색 버튼 클릭 → `SdModalProvider.showAsync` 호출, 결과 `{ selectedKeys }` 를 `selectMode` 에 맞춰 `value` 에 반영.

package/claude/references/sd-simplysm14/apis/angular/forms.md

@@ -13,7 +13,7 @@
 
 - 내부에 hidden submit 버튼 자동 삽입(Enter 키 submit 지원).
 - `requestSubmit()` 메서드 노출.
-- invalid 시 reportValidity → `formInvalid` emit.
+- invalid 시 `reportValidity` → `formInvalid` emit, valid 시 `formSubmit` emit.
 
 ## `<sd-textfield<K>>`
 
@@ -25,23 +25,28 @@
 
 `SdTextfieldTypes`: `number→number`, `text|password|color|email|format→string`, `date|month|year→DateOnly`, `datetime|datetime-sec→DateTime`, `time|time-sec→Time`. `sdTextfieldTypes` 배열로 키 목록 enum.
 
-주요 input: `value` (model), `type` (required), `placeholder`, `title`, `inputStyle/Class`, `disabled/readonly/required` (booleanAttribute), `min/max/minlength/maxlength`, `pattern`, `validatorFn(value) => string | undefined` (커스텀 메시지), `format`, `step`, `autocomplete`, `minDigits`, `size`, `theme`.
+주요 input: `value` (model), `type` (required), `placeholder`, `title`, `inputStyle/Class`, `disabled/readonly/required` (booleanAttribute), `min/max/minlength/maxlength`, `pattern`, `validatorFn(value) => string | undefined` (커스텀 메시지), `format`, `step`, `autocomplete`, `useNumberComma` (default `true` — 숫자 표시 시 천단위 콤마), `minDigits` (display 시 최소 자릿수), `size`(`"sm"|"lg"`), `inline`, `inset`, `theme`.
+
+readonly/disabled 상태에서는 `<input>` 비표시(`_contents` div만 노출).
 
 ## `<sd-textarea>`
 
-`[(value)]: string`, `placeholder`, `title`, `minRows=1`, `size`, `validatorFn`, `theme`, `inputStyle/Class`.
+`[(value)]: string`, `placeholder`, `title`, `minRows=1` (행수는 값 줄바꿈 수와 minRows 중 큰 값), `disabled/readonly/required`, `inline`, `inset`, `size`, `validatorFn`, `theme`, `inputStyle/Class`.
 
 ## `<sd-numpad>`
 
-숫자 키패드. `[(value)]: number`, `placeholder`.
+숫자 키패드. `[(value)]: number`, `text = signal<string|undefined>` (내부 표시값), `placeholder`, `required`, `inputDisabled` (입력란만 비활성), `useEnterButton` (ENT 버튼 노출), `useMinusButton` (- 버튼 노출), `(enterButtonClick)` 출력.
 
 ## `<sd-range<K>>`
 
-`type: K` (TextfieldTypes 키), `[(from)]`, `[(to)]: SdTextfieldTypes[K]`, `inputStyle`.
+`type: K` (TextfieldTypes 키), `[(from)]`, `[(to)]: SdTextfieldTypes[K]`, `required`, `disabled`, `inputStyle`. `to.min`은 `from` 으로 강제.
 
 ## `<sd-date-range-picker>`
 
-`[(periodType)]: "일"|"월"|"범위" = "범위"`, `[(from)]: DateOnly`, `[(to)]: DateOnly`.
+`[(periodType)]: "일"|"월"|"범위" = "범위"`, `[(from)]: DateOnly`, `[(to)]: DateOnly`, `required`.
+- `"일"`: 단일 date 입력. `to`는 `from` 따라감.
+- `"월"`: month 입력. `from`은 1일, `to`는 말일 자동 설정.
+- `"범위"`: from~to date 양쪽 입력. from > to 시 to를 from으로 보정.
 
 ## `<sd-checkbox>` / `<sd-switch>`
 
@@ -50,14 +55,20 @@
 <sd-switch [(value)]="enabled" [size]="'sm'" />
 ```
 
-`value: boolean` (model), `canChangeFn(value) => boolean | Promise<boolean>` — false 면 변경 차단. `radio` (checkbox만), `disabled`, `size`, `inline`, `inset`, `theme`, `contentStyle` (checkbox).
+`value: boolean` (model), `canChangeFn(value) => boolean | Promise<boolean>` — false 면 변경 차단 (`setupModelHook` 사용). 공통: `disabled`, `size`, `inline`, `inset`, `theme`. checkbox 추가: `radio` (radio 모드 — 다시 클릭해도 false 안 됨), `icon` (체크 아이콘 변경, default `tablerCheck`), `contentStyle`, `theme` 에 `"white"` 옵션 추가(시트 헤더용).
 
 ## `<sd-checkbox-group<T>>` / `<sd-checkbox-group-item<T>>`
 
-`<sd-checkbox-group [(value)]="selected"> <sd-checkbox-group-item [value]="opt">{{opt}}</sd-checkbox-group-item> ... </sd-checkbox-group>`. value: `T[]` (다중).
+```html
+<sd-checkbox-group [(value)]="selected">
+  <sd-checkbox-group-item [value]="opt" *ngFor="let opt of options">{{ opt }}</sd-checkbox-group-item>
+</sd-checkbox-group>
+```
+
+`SdCheckboxGroup`: `value: T[]` (model, default `[]`), `disabled`. `SdCheckboxGroupItem`: `value: T` (required), `inline`.
 
 ## 검증
 
-- 컨트롤 내부에서 `setupInvalid(getMessage)` 사용 (cf. directives). 빈 문자열이면 valid.
+- 컨트롤 내부에서 `setupInvalid(getMessage)` 사용 — 빈 문자열이면 valid, 그 외 메시지는 invalid 사유. 좌상단 빨간 점 인디케이터.
 - `validatorFn` 은 컨트롤 입력값을 검사해 메시지 반환.
 - `SdForm` submit 시 자동으로 reportValidity 호출 + invalid 인디케이터 표시.

package/claude/references/sd-simplysm14/apis/angular/kanban.md

@@ -5,6 +5,7 @@
 ```html
 <sd-kanban-board [(selectedValues)]="selected" (drop)="onDrop($event)">
   <sd-kanban-lane [value]="laneA" [busy]="loading">
+    <ng-template #titleTpl>레인 A</ng-template>
     <sd-kanban [value]="card" [draggable]="true" [selectable]="true">{{ card.title }}</sd-kanban>
   </sd-kanban-lane>
 </sd-kanban-board>
@@ -14,15 +15,17 @@
 
 - `selectedValues = model<T[]>([])`.
 - `drop = output<SdKanbanBoardDropInfo<L, T>>` (`{ sourceKanbanValue?, targetLaneValue?, targetKanbanValue? }`).
-- `dragKanban = signal<SdKanbanDragRef | undefined>` — 자식이 드래그 시작 시 설정.
+- `dragKanban = signal<SdKanbanDragRef | undefined>` — 자식이 드래그 시작 시 설정. document `dragend` 시 자동 해제.
 
 ## `<sd-kanban-lane<L, T>>`
 
-`value: L`, `busy`, `useCollapse`, `collapse` (model). drop target 구현.
+`value: L`, `busy`, `useCollapse`, `collapse` (model, default `false`). drop target 구현. `useCollapse=true` 면 토글 아이콘 노출. 자식 `kanbanControls.filter(selectable)` 가 있으면 전체선택 체크박스 노출.
+
+content templates: `<ng-template #titleTpl>` (헤더 영역), `<ng-template #toolTpl>` (전체선택 우측 도구 영역).
 
 ## `<sd-kanban<L, T>>`
 
-`value: T`, `draggable`, `selectable`, `contentClass`. drag ref + drop target 둘 다 구현(카드 위에 드롭 가능).
+`value: T`, `draggable`, `selectable`, `contentClass`. drag ref + drop target 둘 다 구현(카드 위에 드롭 가능). Shift+클릭 시 `selectable=true` 인 경우 `selectedValues` 토글.
 
 ## 타입
 

package/claude/references/sd-simplysm14/apis/angular/layout.md

@@ -5,37 +5,43 @@
 ```html
 <sd-sidebar-container>
   <sd-sidebar>
-    <sd-sidebar-user [userMenu]="userMenu">유저영역</sd-sidebar-user>
+    <sd-sidebar-user [userMenu]="userMenu">유저영역 컨텐츠</sd-sidebar-user>
     <sd-sidebar-menu [menus]="menus" [layout]="'accordion'" [getMenuIsSelectedFn]="isSel" />
   </sd-sidebar>
   <ng-content />
 </sd-sidebar-container>
 ```
 
-- `SdSidebarContainer`: `toggle = signal(false)`. Router NavigationStart 시 자동 false.
-- `SdSidebar`: 부모 container의 toggle 추종.
-- `SdSidebarMenu`: `menus: SdMenu[]`, `layout: "accordion"|"flat"`, `getMenuIsSelectedFn?`.
-- `SdSidebarUser`: `userMenu?: SdSidebarUserMenu`.
+- `SdSidebarContainer`: `toggle = signal(false)`. 데스크탑은 토글 시 본문 left padding 제거, 모바일(`max-width:520px`)에서는 사이드바가 슬라이드. Router `NavigationStart` 이벤트에 자동 false (페이지 이동 시 자동 닫힘).
+- `SdSidebar`: 부모 container의 toggle 추종. content projection.
+- `SdSidebarMenu`: `menus: SdMenu[]`, `layout: "accordion"|"flat"` (미지정 시 `menus.length <= 3` 이면 `"flat"`, 아니면 `"accordion"` 자동), `getMenuIsSelectedFn?: (menu) => boolean`. 자식 메뉴는 항상 `"accordion"`. `menu.url != null` 이면 클릭 시 새창 open.
+- `SdSidebarUser`: `userMenu?: SdSidebarUserMenu` + 상단 영역 content projection. userMenu.title 클릭 시 메뉴 항목 펼침/접기.
 
 ```typescript
-interface SdSidebarUserMenu { /* see source */ }
+interface SdSidebarUserMenu {
+  title: string;
+  menus: { title: string; onClick: () => void }[];
+}
 ```
 
 ## 탑바
 
 ```html
 <sd-topbar-container>
-  <sd-topbar [sidebarContainer]="sc">
+  <sd-topbar>
+    <h4>{{ title }}</h4>
     <sd-topbar-menu [menus]="menus" />
-    <sd-topbar-user [menus]="userMenus" />
+    <sd-topbar-user [menus]="userMenus">유저표시</sd-topbar-user>
   </sd-topbar>
+  <ng-content />
 </sd-topbar-container>
 ```
 
-- `SdTopbar`: `sidebarContainer?: SdSidebarContainer` 입력(미지정 시 inject 시도). 햄버거 버튼이 `sc.toggle` 토글.
-- `SdTopbarMenu`: `menus: SdMenu[]`, `getMenuIsSelectedFn?`.
-- `SdTopbarUser`: `menus: SdTopbarUserMenu[]` (required).
+- `SdTopbarContainer`: flex-column 100% 컨테이너.
+- `SdTopbar`: `sidebarContainer?: SdSidebarContainer` 입력(미지정 시 inject 시도). 사이드바 있으면 햄버거 버튼 노출 → 클릭 시 `sc.toggle` 토글.
+- `SdTopbarMenu`: `menus: SdMenu[]`, `getMenuIsSelectedFn?`. 각 최상위 menu는 dropdown 으로 노출. leaf 클릭 후 dropdown 자동 닫힘.
+- `SdTopbarUser`: `menus: SdTopbarUserMenu[]` (required, `{ title, onClick }[]`) + 트리거 영역 content projection. dropdown 으로 menus 표시, 클릭 후 자동 close.
 
 ## 메뉴 데이터
 
-`SdMenu` (`./app-structure.md` 참조)을 그대로 입력. 선택 상태는 `getIsMenuSelected(menu, fullPageCode, customFn?)` 또는 `getMenuIsSelectedFn` 으로.
+`SdMenu` (`./app-structure.md` 참조)을 그대로 입력. 선택 상태는 `getIsMenuSelected(menu, fullPageCode, customFn?)` 또는 `getMenuIsSelectedFn` 으로. leaf 메뉴는 `getMenuRouterLinkOption(menu)` 으로 `[sdRouterLink]` 옵션 자동 생성.

package/claude/references/sd-simplysm14/apis/angular/modal.md

@@ -45,8 +45,8 @@ interface SdModalContentDef<O> {
 
 ```typescript
 const am = inject(SdActivatedModalProvider, { optional: true });
-am?.modalComponent();    // SdModal 인스턴스 (title() 등)
-am?.contentComponent();  // 컨텐츠 인스턴스
+am?.modalComponent();    // signal<SdModal> (title() 등)
+am?.contentComponent();  // signal<T> 컨텐츠 인스턴스
 am.canDeactivateFn = () => isClean();   // 닫기 차단 (false 반환 시)
 ```
 

package/claude/references/sd-simplysm14/apis/angular/routing.md

@@ -5,11 +5,12 @@ Angular Router 위에 페이지 코드(`a.b.c` 형식)·뷰 타입·새창 네
 ## `SdRouterLink` 디렉티브
 
 ```html
-<a [sdRouterLink]="{ link: '/home/order/list', params: { id }, queryParams, outletName, window: { width, height } }">go</a>
+<a [sdRouterLink]="{ link: '/home/order/list', params: { id }, queryParams, outletName, window: { width: 800, height: 600 } }">go</a>
 ```
 
-- 일반 클릭 → `router.navigate`. Ctrl/Shift 클릭 또는 새창 모드(`isWindow`)일 때 → `SdNavigateWindowProvider.open` 으로 새 창. Alt+click 무시.
+- 일반 클릭 → `router.navigate`. Ctrl/Shift 클릭 또는 현재가 새창 컨텍스트(`SdNavigateWindowProvider.isWindow`)일 때 → `SdNavigateWindowProvider.open` 으로 새 창. Alt+click 무시.
 - `outletName` 지정 시 named outlet 으로 navigate.
+- `window: { width, height }` 옵션은 isWindow 컨텍스트에서 새 창 features 로만 사용 (Ctrl/Shift 새창에는 미적용).
 
 ## `SdNavigateWindowProvider`
 

package/claude/references/sd-simplysm14/apis/angular/selection-managers.md

@@ -15,12 +15,13 @@ const sm = useSelectionManager({
 sm.hasSelectable; sm.isAllSelected;
 sm.getSelectable(item);    // true | string(reason) | undefined
 sm.select(item); sm.deselect(item); sm.toggle(item); sm.toggleAll();
-sm.isSelected(item); sm.getCanChangeFn(item);
+sm.isSelected(item); sm.getCanChangeFn(item);   // () => boolean (체크박스 canChangeFn 으로 직결)
 ```
 
 - `single`이면 select 시 기존 키 대체. `multi` 면 추가.
 - 키 비교는 `obj.equal` (`@simplysm/core-common`).
 - `trackByFn` 반환이 `null`이면 선택 불가.
+- `hasSelectable`은 `selectMode != null` 여부 (선택 가능 모드인지). 선택 가능한 아이템 존재 여부는 `isAllSelected` 로직에서 자동 처리.
 
 ## `useExpandingManager<T>(binding)`
 

package/claude/references/sd-simplysm14/apis/angular/sheet.md

@@ -25,7 +25,7 @@
 
 ## `<sd-sheet<TItem>>` 입력/출력
 
-- inputs: `key`, `items`, `trackByFn`, `selectMode`, `autoSelect: "click"|"focus"`, `getItemSelectableFn`, `getChildrenFn` (트리), `useAutoSort`, `visiblePageCount=10`, `totalPageCount`, `itemsPerPage`, `focusMode: "row"|"cell" = "cell"`, `inset`, `contentStyle`, `getItemCellClassFn`, `getItemCellStyleFn`, `hideConfigBar`, `columnControlsInput` (외부 정의된 컬럼 추가).
+- inputs: `key`, `items`, `trackByFn`, `selectMode`, `autoSelect: "click"|"focus"`, `getItemSelectableFn`, `getChildrenFn` (트리), `useAutoSort`, `visiblePageCount=10`, `totalPageCount`, `itemsPerPage`, `focusMode: "row"|"cell" = "cell"`, `inset`, `contentStyle`, `getItemCellClassFn`, `getItemCellStyleFn`, `hideConfigBar`, `columnControlsInput: readonly SdSheetColumn[]` (외부 정의된 컬럼 추가, `<sd-sheet-column>` 자식 + 이 입력을 합쳐 처리).
 - outputs: `itemKeydown: SdSheetItemKeydownEventParam<T> { item, event }`, `cellKeydown: SdSheetCellKeydownEventParam<T> { item, key, event }`.
 - models: `selectedKeys: unknown[]`, `expandedItems: TItem[]`, `sorts: SortingDef[]`, `currentPage: number`.
 - `key` 지정 시 설정 모달(`SdSheetConfigModal`)로 너비/숨김/고정/순서를 `SdSystemConfigProvider`에 영속화.

package/claude/references/sd-simplysm14/apis/angular/visual.md

@@ -4,31 +4,46 @@
 
 ## `<sd-label>`
 
-배지 형 라벨. `theme`(테마 컬러), `color` (커스텀), `clickable`. content projection.
+배지 형 라벨. `theme`(테마 컬러), `color` (커스텀 background), `clickable`. content projection.
 
 ## `<sd-note>`
 
-알림 박스 형. `theme`, `size`, `inset`. content projection.
+알림 박스 형. `theme`, `size: "sm"|"lg"`, `inset`. content projection.
 
 ## `<sd-progress>`
 
 ```html
-<sd-progress [theme]="'primary'" [value]="60" [size]="'sm'" [inset]="false" />
+<sd-progress [theme]="'primary'" [value]="0.6" [size]="'sm'" [inset]="false" />
 ```
 
-`theme` (required), `value: number` (0-100, required), `size`, `inset`.
+`theme` (required), `value: number` (required, **0~1 비율**), `size`, `inset`. 표시 텍스트는 `value | percent: "1.0-2"`, 진행바 폭은 `value*100%` (0~100 클램프).
 
 ## `<sd-calendar<T>>`
 
-월별 달력 렌더. 
+월별 달력 렌더. 6행 × 7열 고정. `<ng-template itemOf>` 로 각 셀의 아이템 렌더.
 
-- 필수: `items: T[]`, `getItemDateFn: (item, idx) => DateOnly`.
+```html
+<sd-calendar [items]="events" [getItemDateFn]="byDate" [yearMonth]="curMonth">
+  <ng-template [itemOf]="events" let-item="item">
+    <div>{{ item.title }}</div>
+  </ng-template>
+</sd-calendar>
+```
+
+- 필수 input: `items: T[]`, `getItemDateFn: (item, idx) => DateOnly`.
 - `yearMonth = input(new DateOnly().setDay(1))` (해당 월).
 - `weekStartDay = 0`, `minDaysInFirstWeek = 1`.
+- 필수 content: `<ng-template [itemOf]="items">` (`SdItemOfTemplate`, ctx: `$implicit/item/index/depth`).
 
 ## `<sd-barcode>`
 
-`bwip-js` 래퍼. `type: BarcodeType` (required), `value: string`. `BarcodeType` 은 bwip-js 지원 심볼로지 union (`code128`, `qrcode`, `ean13`, ... — `sd-barcode.ts` 참조).
+`bwip-js` 래퍼. `type: BarcodeType` (required), `value: string`. `BarcodeType` 은 bwip-js 지원 심볼로지 union (`code128`, `qrcode`, `ean13`, ... — 전체 목록은 `sd-barcode.ts` 참조).
+
+```html
+<sd-barcode [type]="'qrcode'" [value]="data" />
+```
+
+내부적으로 `bwipjs.toSVG`로 생성 후 `bypassSecurityTrustHtml`. value 빈 문자열/렌더 실패 시 빈 출력.
 
 ## `<sd-echarts>`
 
@@ -38,4 +53,7 @@ ECharts 5/6 래퍼.
 <sd-echarts [option]="option" [notMerge]="false" [loading]="false" />
 ```
 
-`option: echarts.EChartsOption` (required).
+- `option: echarts.EChartsOption` (required) — 변경 시 `chart.setOption(option, { notMerge })`.
+- `notMerge` (default `false`).
+- `loading` (default `false`) — `showLoading`/`hideLoading` 토글.
+- `hostDirectives: SdResizeDirective` 로 호스트 리사이즈 감지 → `chart.resize()`. renderer `"svg"` 고정.

package/claude/references/sd-simplysm14/apis/capacitor-plugin-file-system/README.md

@@ -19,7 +19,7 @@ await FileSystem.requestPermissions(): Promise<void>   // Android 11+: 설정
 
 // 경로/URI
 await FileSystem.getStoragePath(type: StorageType): Promise<string>
-await FileSystem.getUri(filePath: string): Promise<string>   // FileProvider URI
+await FileSystem.getUri(filePath: string): Promise<string>   // 네이티브: FileProvider URI / Web: Blob URL (사용 후 `URL.revokeObjectURL` 필수)
 
 // 디렉토리
 await FileSystem.readdir(dirPath: string): Promise<FileInfo[]>

package/claude/references/sd-simplysm14/apis/core-browser/README.md

@@ -6,14 +6,45 @@
 
 ## 사용 트리거 인덱스
 
-- **DOM 탐색/가시성** (`Element` 확장: `findAll`/`findFirst`/`prependChild`/`getParents`/`isOffsetElement`/`isVisible`) — DOM 트리 탐색·삽입·가시성 판정 필요 시.
-- **포커스/탭 이동** (`Element` 확장: `findTabbableParent`/`findFirstTabbableChild`) — 키보드 포커스 흐름 제어 시.
-- **레이아웃/스크롤** (`HTMLElement` 확장: `repaint`/`getRelativeOffset`/`scrollIntoViewIfNeeded`) — 드롭다운/팝업 위치 계산, 고정 헤더 가림 스크롤 보정 시.
-- **클립보드/측정 헬퍼** (`copyElement`/`pasteToElement`/`getBounds`, `ElementBounds`) — copy/paste 이벤트 처리, 다수 요소 경계 일괄 측정 시.
-- **파일 다이얼로그/다운로드** (`openFileDialog`/`downloadBlob`) — 파일 선택 UI, Blob 다운로드 트리거 시.
-- **진행률 fetch** (`fetchUrlBytes`, `DownloadProgress`) — 큰 바이너리 다운로드 + 진행률 콜백 필요 시.
-- **IndexedDB 저장소** (`IndexedDbStore`, `StoreConfig`) — 브라우저 영속 키/값 저장소 (트랜잭션 보장).
-- **IndexedDB 가상 파일시스템** (`IndexedDbVirtualFs`, `VirtualFsEntry`) — `IndexedDbStore` 위에 경로(`/a/b/c`) 기반 파일/디렉토리 모델링.
+DOM 탐색/가시성 — `Element` 확장:
+
+- **`findAll`** — `el` 하위에서 선택자 일치 요소 전부 배열로 받을 때.
+- **`findFirst`** — `el` 하위에서 선택자 일치 첫 요소만 받을 때 (`querySelector` 의 `null` 대신 `undefined`).
+- **`prependChild`** — 자식 목록의 맨 앞으로 삽입할 때.
+- **`getParents`** — 가까운 부모부터 위로 거슬러 올라가는 조상 배열이 필요할 때.
+- **`isOffsetElement`** — 어떤 요소가 자식 absolute 의 기준이 되는지(`position: relative/absolute/fixed/sticky`) 판정할 때.
+- **`isVisible`** — 화면에 실제로 보이는지(클라이언트 영역 + `visibility` + `opacity`) 판정할 때.
+
+포커스/탭 이동 — `Element` 확장:
+
+- **`findTabbableParent`** — 현재 요소를 감싸는 가장 가까운 tabbable 부모를 찾을 때 (모달·툴팁의 포커스 트랩 호스트 추적).
+- **`findFirstTabbableChild`** — 컨테이너에 진입했을 때 처음 포커스할 자식을 찾을 때.
+
+레이아웃/스크롤 — `HTMLElement` 확장:
+
+- **`repaint`** — 스타일 변경 후 즉시 동기 reflow 가 필요할 때.
+- **`getRelativeOffset`** — 드롭다운/팝업을 부모 기준 absolute 좌표로 띄울 때 (스크롤·border·transform 보정 포함).
+- **`scrollIntoViewIfNeeded`** — 고정 헤더/컬럼에 가려진 셀을 위/왼쪽으로만 보정 스크롤할 때.
+
+클립보드/측정 헬퍼:
+
+- **`copyElement`** — `<el @copy>` 이벤트 핸들러로 내부 첫 input/textarea 값을 클립보드로 보낼 때.
+- **`pasteToElement`** — `<el @paste>` 이벤트 핸들러로 클립보드 값을 내부 첫 input/textarea 에 전체 교체할 때.
+- **`getBounds`** / **`ElementBounds`** — 다수 요소의 뷰포트 경계를 `IntersectionObserver` 로 한 번에 측정할 때 (입력 순서 유지·타임아웃 보장).
+
+파일 다이얼로그/다운로드:
+
+- **`openFileDialog`** — 사용자에게 파일 선택 UI 를 띄워 `File[]` 을 받을 때 (취소·빈 선택은 `undefined`).
+- **`downloadBlob`** — 메모리 상의 `Blob` 을 사용자 다운로드로 흘려보낼 때 (파일명 sanitize).
+
+진행률 fetch:
+
+- **`fetchUrlBytes`** / **`DownloadProgress`** — 큰 바이너리를 `Uint8Array` 로 받으며 진행률 콜백을 받을 때.
+
+IndexedDB:
+
+- **`IndexedDbStore`** / **`StoreConfig`** — 브라우저 영속 키/값 저장소가 필요할 때 (트랜잭션·재진입 안전 `open`).
+- **`IndexedDbVirtualFs`** / **`VirtualFsEntry`** — 위 저장소 위에 경로(`/a/b/c`) 기반 파일/디렉토리 트리를 올릴 때.
 
 ## DOM 탐색/가시성 — `Element` 확장