@simplysm/sd-claude 14.0.86 → 14.0.88

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (68) hide show
  1. package/claude/references/sd-simplysm14/README.md +17 -18
  2. package/claude/references/sd-simplysm14/apis/angular/README.md +61 -0
  3. package/claude/references/sd-simplysm14/apis/angular/controls.md +119 -0
  4. package/claude/references/sd-simplysm14/apis/angular/crud.md +50 -0
  5. package/claude/references/sd-simplysm14/apis/angular/directives.md +44 -0
  6. package/claude/references/sd-simplysm14/apis/angular/features.md +55 -0
  7. package/claude/references/sd-simplysm14/apis/angular/infra.md +74 -0
  8. package/claude/references/sd-simplysm14/apis/angular/layout.md +55 -0
  9. package/claude/references/sd-simplysm14/apis/angular/overlay.md +115 -0
  10. package/claude/references/sd-simplysm14/apis/angular/routing-appstructure.md +64 -0
  11. package/claude/references/sd-simplysm14/apis/angular/selection-managers.md +43 -0
  12. package/claude/references/sd-simplysm14/apis/angular/shared-data.md +70 -0
  13. package/claude/references/sd-simplysm14/apis/angular/sheet.md +78 -0
  14. package/claude/references/sd-simplysm14/apis/capacitor-plugin-auto-update/README.md +80 -0
  15. package/claude/references/sd-simplysm14/apis/capacitor-plugin-file-system/README.md +66 -0
  16. package/claude/references/sd-simplysm14/apis/capacitor-plugin-intent/README.md +71 -0
  17. package/claude/references/sd-simplysm14/apis/capacitor-plugin-usb-storage/README.md +67 -0
  18. package/claude/references/sd-simplysm14/apis/core-browser/README.md +83 -0
  19. package/claude/references/sd-simplysm14/apis/core-browser/indexed-db.md +79 -0
  20. package/claude/references/sd-simplysm14/apis/core-common/README.md +138 -0
  21. package/claude/references/sd-simplysm14/apis/core-common/array-ext.md +72 -0
  22. package/claude/references/sd-simplysm14/apis/core-common/datetime.md +95 -0
  23. package/claude/references/sd-simplysm14/apis/core-common/json-transfer.md +47 -0
  24. package/claude/references/sd-simplysm14/apis/core-common/obj.md +53 -0
  25. package/claude/references/sd-simplysm14/apis/core-node/README.md +14 -0
  26. package/claude/references/sd-simplysm14/apis/core-node/consola.md +51 -0
  27. package/claude/references/sd-simplysm14/apis/core-node/cpx.md +39 -0
  28. package/claude/references/sd-simplysm14/apis/core-node/fs-watcher.md +38 -0
  29. package/claude/references/sd-simplysm14/apis/core-node/fsx.md +86 -0
  30. package/claude/references/sd-simplysm14/apis/core-node/pathx.md +42 -0
  31. package/claude/references/sd-simplysm14/apis/core-node/worker.md +54 -0
  32. package/claude/references/sd-simplysm14/apis/excel/README.md +43 -0
  33. package/claude/references/sd-simplysm14/apis/excel/cell.md +54 -0
  34. package/claude/references/sd-simplysm14/apis/excel/conditional-format.md +51 -0
  35. package/claude/references/sd-simplysm14/apis/excel/style.md +67 -0
  36. package/claude/references/sd-simplysm14/apis/excel/utils.md +35 -0
  37. package/claude/references/sd-simplysm14/apis/excel/workbook-worksheet.md +97 -0
  38. package/claude/references/sd-simplysm14/apis/excel/wrapper.md +83 -0
  39. package/claude/references/sd-simplysm14/apis/lint/README.md +43 -0
  40. package/claude/references/sd-simplysm14/apis/lint/rules.md +90 -0
  41. package/claude/references/sd-simplysm14/apis/orm-common/README.md +67 -0
  42. package/claude/references/sd-simplysm14/apis/orm-common/db-context.md +80 -0
  43. package/claude/references/sd-simplysm14/apis/orm-common/expr.md +113 -0
  44. package/claude/references/sd-simplysm14/apis/orm-common/query-builder.md +29 -0
  45. package/claude/references/sd-simplysm14/apis/orm-common/queryable.md +111 -0
  46. package/claude/references/sd-simplysm14/apis/orm-common/schema.md +162 -0
  47. package/claude/references/sd-simplysm14/apis/orm-common/types.md +52 -0
  48. package/claude/references/sd-simplysm14/apis/orm-node/README.md +53 -0
  49. package/claude/references/sd-simplysm14/apis/orm-node/db-conn.md +94 -0
  50. package/claude/references/sd-simplysm14/apis/sd-cli/README.md +29 -0
  51. package/claude/references/sd-simplysm14/apis/sd-cli/SdTsCompiler.md +70 -0
  52. package/claude/references/sd-simplysm14/apis/sd-cli/sd-config-types.md +173 -0
  53. package/claude/references/sd-simplysm14/apis/service-client/README.md +152 -0
  54. package/claude/references/sd-simplysm14/apis/service-client/orm.md +45 -0
  55. package/claude/references/sd-simplysm14/apis/service-client/transport.md +36 -0
  56. package/claude/references/sd-simplysm14/apis/service-common/README.md +70 -0
  57. package/claude/references/sd-simplysm14/apis/service-common/app-structure.md +48 -0
  58. package/claude/references/sd-simplysm14/apis/service-common/protocol.md +72 -0
  59. package/claude/references/sd-simplysm14/apis/service-server/README.md +102 -0
  60. package/claude/references/sd-simplysm14/apis/service-server/service-authoring.md +74 -0
  61. package/claude/references/sd-simplysm14/apis/service-server/transport-internals.md +51 -0
  62. package/claude/references/sd-simplysm14/apis/service-server/v1-legacy.md +50 -0
  63. package/claude/references/sd-simplysm14/apis/storage/README.md +114 -0
  64. package/claude/rules/sd-design-rules.md +11 -0
  65. package/claude/skills/sd-docs/SKILL.md +17 -29
  66. package/claude/skills/sd-docs/references/{subagent-prompt.md → doc-rules.md} +25 -40
  67. package/claude/skills/sd-spec/SKILL.md +2 -2
  68. package/package.json +1 -1
@@ -44,21 +44,20 @@ ORM 호출, 파일 변환, 비즈니스 로직 등은 위 두 경우에 해당
44
44
 
45
45
  ## 패키지 인덱스
46
46
 
47
- - **angular** — Angular 21 standalone/signal/zoneless 기반 업무 클라이언트 UI 라이브러리. `provideSdAngular` 부트스트랩, 폼/시트/CRUD/모달/토스트/사이드바·탑바·드롭다운/공유데이터·칸반 화면 컴포넌트와 인프라 프로바이더 제공. 자세히: [apis/angular/README.md](./apis/angular/README.md)
48
- - **capacitor-plugin-auto-update** — Android Capacitor 앱에서 APK 자동 업데이트와 APK 설치 권한·버전 조회. 자세히: [apis/capacitor-plugin-auto-update/README.md](./apis/capacitor-plugin-auto-update/README.md)
49
- - **capacitor-plugin-file-system** — Capacitor 모바일/웹 파일 시스템 접근(권한·경로·디렉토리·파일 IO). 자세히: [apis/capacitor-plugin-file-system/README.md](./apis/capacitor-plugin-file-system/README.md)
50
- - **capacitor-plugin-intent** — Android 인텐트 브로드캐스트 송수신 `startActivityForResult` 연동(산업용 스캐너·PDA·외부 결제 ). 자세히: [apis/capacitor-plugin-intent/README.md](./apis/capacitor-plugin-intent/README.md)
51
- - **capacitor-plugin-usb-storage** — Android/Browser 에서 USB Mass Storage 장치 목록·권한·디렉토리/파일 읽기. 자세히: [apis/capacitor-plugin-usb-storage/README.md](./apis/capacitor-plugin-usb-storage/README.md)
52
- - **core-browser** — 브라우저 전용. `Element`/`HTMLElement` 프로토타입 확장, DOM 탐색·포커스·레이아웃 보정, 클립보드/측정, 파일 다이얼로그·다운로드, 진행률 fetch, IndexedDB 키/값 저장소와 가상 파일시스템. 자세히: [apis/core-browser/README.md](./apis/core-browser/README.md)
53
- - **core-common** — 공통 유틸리티(타입·에러·큐·이벤트·변환·확장 메서드·환경변수). simplysm 모든 패키지의 공용 기반. 자세히: [apis/core-common/README.md](./apis/core-common/README.md)
54
- - **core-node** — Node 전용 IO/경로/프로세스/감시/consola/worker_threads 래퍼(`fsx`, `pathx`, `cpx`, `FsWatcher`, `setupConsola`, `Worker`/`createWorker`). 자세히: [apis/core-node/README.md](./apis/core-node/README.md)
55
- - **excel** — xlsx 워크북을 열어 셀·시트·스타일·조건부서식·이미지를 읽고 쓰거나, Zod 스키마 기반 레코드 입출력. 자세히: [apis/excel/README.md](./apis/excel/README.md)
56
- - **lint** — ESLint flat config 작성 시 `@simplysm/lint/eslint-recommended` 프리셋 또는 `@simplysm/lint/eslint-plugin` 개별 규칙 import. 자세히: [apis/lint/README.md](./apis/lint/README.md)
57
- - **orm-common** — Dialect 독립 ORM 코어. `DbContext` 서브클래싱 + Table/View/Procedure 빌더 + `expr` AST + `Queryable` 체이닝으로 SQL 만들고 dialect QueryBuilder렌더. 자세히: [apis/orm-common/README.md](./apis/orm-common/README.md)
58
- - **orm-node** — Node 환경에서 `DbContext` 를 MSSQL/MySQL/PostgreSQL 연결에 붙이는 어댑터(`createOrm`), raw SQL/bulk insert (`createDbConn`). 자세히: [apis/orm-node/README.md](./apis/orm-node/README.md)
59
- - **sd-claude** — simplysm 표준 Claude 자산(스킬·룰·훅) 동기화 Claude 계정 저장/전환 CLI(`sd-claude auth save`/`switch`). 라이브러리 코드 API 없음. 자세히: [apis/sd-claude/README.md](./apis/sd-claude/README.md)
60
- - **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)
61
- - **service-client** — `@simplysm/service-server` WebSocket 으로 통신하는 클라이언트. RPC·이벤트 구독·파일 업/다운로드·원격 ORM 실행을 단일 `ServiceClient` 에서 제공(Node/브라우저 공용). 자세히: [apis/service-client/README.md](./apis/service-client/README.md)
62
- - **service-common** — 서버/클라이언트가 공유하는 서비스 프로토콜·메시지·서비스 인터페이스·앱 구조·이벤트 정의. 자세히: [apis/service-common/README.md](./apis/service-common/README.md)
63
- - **service-server** — Fastify + WebSocket 위에 서비스(`defineService`)·JWT 인증(`auth`)·빌트인 ORM/AutoUpdate/AppStructure·V1 레거시 호환을 부트스트랩(`createServiceServer().listen()`). 자세히: [apis/service-server/README.md](./apis/service-server/README.md)
64
- - **storage** — FTP/FTPS/SFTP 원격 스토리지에 동일 인터페이스(`StorageClient`)로 파일 읽기/쓰기/관리. 자세히: [apis/storage/README.md](./apis/storage/README.md)
47
+ - **angular** — Angular 업무 화면 UI 키트(폼/시트/모달·토스트·Busy 오버레이/CRUD 골격/공유데이터/권한·메뉴/테마·에디터·시각화·칸반) 컴포넌트·디렉티브·프로바이더를 때. 자세히: [apis/angular/README.md](./apis/angular/README.md)
48
+ - **capacitor-plugin-auto-update** — Android(Capacitor) 앱의 APK 자동 업데이트(서버/외부저장소 기반 버전 감지·다운로드·설치)와 그 하부 APK 설치 권한 관리·설치 인텐트 실행을 다룰 때. 자세히: [apis/capacitor-plugin-auto-update/README.md](./apis/capacitor-plugin-auto-update/README.md)
49
+ - **capacitor-plugin-file-system** — Capacitor 기반 네이티브 파일 시스템(Android 외부/앱 저장소, Browser IndexedDB 에뮬레이션) 접근 — 파일 읽기/쓰기, 디렉토리 조회/생성, 삭제, 권한, 저장소 경로 조회가 필요할 때. 자세히: [apis/capacitor-plugin-file-system/README.md](./apis/capacitor-plugin-file-system/README.md)
50
+ - **capacitor-plugin-intent** — Android 인텐트 송수신(브로드캐스트 구독/전송, 실행 인텐트 조회, newIntent 리스너, startActivityForResult 외부 Activity 실행) Capacitor 플러그인. 바코드 스캐너·PDA 등 산업용 디바이스 연동 시 사용, 웹은 미지원 스텁. 자세히: [apis/capacitor-plugin-intent/README.md](./apis/capacitor-plugin-intent/README.md)
51
+ - **capacitor-plugin-usb-storage** — Capacitor USB Mass Storage 플러그인 — 정적 클래스 UsbStorage 로 USB 장치 목록 조회·권한 요청/확인·디렉토리 나열·파일(Bytes) 읽기. Android(libaums)/web(IndexedDB 에뮬레이션). 자세히: [apis/capacitor-plugin-usb-storage/README.md](./apis/capacitor-plugin-usb-storage/README.md)
52
+ - **core-browser** — 브라우저 전용 유틸 — Element/HTMLElement 프로토타입 확장(탐색·가시성·상대좌표·스크롤), 클립보드 copy/paste 핸들러, getBounds 경계측정, Blob 다운로드·파일선택·진행률 fetch, IndexedDB KV 저장소·가상 파일시스템. 자세히: [apis/core-browser/README.md](./apis/core-browser/README.md)
53
+ - **core-common** — 브라우저·Node 공용 유틸: 에러 계층(SdError류), 불변 날짜/시간(DateTime/DateOnly/Time), 큐·이벤트·로거, Array/Set/Map 프로토타입 확장, obj·str·num·bytes·path·json·xml·transfer·wait 네임스페이스, ZIP·코드 템플릿 태그·타입 유틸리티가 필요할 때. 자세히: [apis/core-common/README.md](./apis/core-common/README.md)
54
+ - **core-node** — Node.js 전용 유틸 — 파일시스템 IO(fsx)·자식 프로세스 실행과 인코딩 디코딩(cpx)·경로 POSIX 정규화/판정(pathx)·파일 감시(FsWatcher)·consola 로깅 설정·worker_threads 타입 안전 래퍼(Worker) 필요할 때. 자세히: [apis/core-node/README.md](./apis/core-node/README.md)
55
+ - **excel** — OOXML(.xlsx) 워크북을 lazy-load 읽고 때 — 시트·셀 값/수식/병합·스타일·조건부 서식·이미지 삽입, Zod 스키마 기반 레코드 매핑(ExcelWrapper), 주소/날짜/숫자형식 변환 유틸(ExcelUtils). 자세히: [apis/excel/README.md](./apis/excel/README.md)
56
+ - **lint** — ESLint flat config 프리셋(eslint-recommended)과 커스텀 규칙 9종 플러그인(eslint-plugin)으로 simplysm 워크스페이스의 JS/TS/HTML lint 규칙을 강제할 때. 자세히: [apis/lint/README.md](./apis/lint/README.md)
57
+ - **orm-common** — Dialect 독립 ORM 코어 Table/View/Procedure 빌더로 스키마를 정의하고 DbContext 등록해 연결·트랜잭션·DDL·마이그레이션을 수행하며, Queryable 체이닝과 expr 표현식 빌더로 타입 안전 SELECT/CUD 쿼리를 QueryDef AST 조립할 때. 자세히: [apis/orm-common/README.md](./apis/orm-common/README.md)
58
+ - **orm-node** — Node 환경에서 DbContext 를 MSSQL/MySQL/PostgreSQL 연결해 구동하는 ORM 실행 계층. createOrm 으로 트랜잭션 단위 쿼리를 돌리거나, createDbConn/DbConn 저수준 계층으로 원시 SQL·bulk insert·수동 트랜잭션을 직접 다룰 때. 자세히: [apis/orm-node/README.md](./apis/orm-node/README.md)
59
+ - **sd-cli** — sd.config.ts 설정 타입(SdConfig/SdConfigFn/패키지·배포·Capacitor·Electron·PWA), 패키지 .ts 증분 컴파일 엔진(SdTsCompiler), Vitest용 Angular AOT Vite 플러그인(sdAngularPlugin)을 다룰 때. 자세히: [apis/sd-cli/README.md](./apis/sd-cli/README.md)
60
+ - **service-client** — WebSocket 기반 simplysm 서비스 서버 클라이언트 — 서비스 메서드 RPC 호출(getService/ServiceProxy), 인증, 서버 푸시 이벤트 구독, 파일 업/다운로드, 진행률 추적, ORM 원격 트랜잭션 실행이 필요할 때. 자세히: [apis/service-client/README.md](./apis/service-client/README.md)
61
+ - **service-common** — 서버·클라 공유 서비스 통신 계약 바이너리 프로토콜(인코딩/청킹/재조립), 서비스 인터페이스 타입(ORM·자동업데이트·업로드), 타입 안전 이벤트 정의(defineEvent), 앱 메뉴/권한 구조 모델. 자세히: [apis/service-common/README.md](./apis/service-common/README.md)
62
+ - **service-server** — Fastify 기반 서비스 서버(WebSocket/HTTP RPC·JWT 인증·정적파일/업로드·서버→클라이언트 이벤트 푸시·ORM/자동업데이트 빌트인 서비스·V1 레거시 호환)를 부팅·서비스 정의·인증 처리할 때. 자세히: [apis/service-server/README.md](./apis/service-server/README.md)
63
+ - **storage** — FTP/FTPS/SFTP 원격 스토리지에 접속해 파일·디렉토리를 업로드·다운로드·조회·삭제할 때(StorageFactory.connect 권장 진입점). 자세히: [apis/storage/README.md](./apis/storage/README.md)
@@ -0,0 +1,61 @@
1
+ # @simplysm/angular
2
+
3
+ Angular 기반 업무 화면 UI 컴포넌트·디렉티브·프로바이더 묶음. `provideSdAngular()` 로 부트스트랩하고, 폼 컨트롤·시트·모달/토스트/Busy 오버레이·CRUD 화면 골격·권한/공유데이터 인프라를 standalone 컴포넌트로 제공. zoneless(Signal 기반) 전제이며 모든 입력은 Angular `input()`/`model()` 시그널.
4
+
5
+ ## 사용 트리거 인덱스
6
+
7
+ - **provideSdAngular / 설정·로깅·서비스 인프라** — 앱 부트스트랩, 클라이언트명 주입, 시스템 로그/로컬스토리지/시스템설정 저장, 서비스 클라이언트 연결, 전역 에러 처리. 자세히: [infra.md](./infra.md)
8
+ - **모달 / 토스트 / Busy / 인쇄(오버레이)** — 프로그래밍 방식 모달·확인/프롬프트 모달, 토스트 알림, 로딩 표시, 인쇄·PDF 생성. 자세히: [overlay.md](./overlay.md)
9
+ - **폼 컨트롤·버튼·선택 컨트롤** — textfield/textarea/numpad/range/checkbox/switch/select/dropdown/form/collapse/tab/list/gap/pagination/button. 자세히: [controls.md](./controls.md)
10
+ - **레이아웃(사이드바·탑바)** — 사이드바/탑바 컨테이너·메뉴·사용자 메뉴로 화면 셸 구성. 자세히: [layout.md](./layout.md)
11
+ - **시트(sd-sheet)** — 트리/페이징/정렬/고정열/셀편집/선택 그리드. 자세히: [sheet.md](./sheet.md)
12
+ - **CRUD 화면 골격** — 목록(sd-crud-list)·상세(sd-crud-detail)·기반 컨테이너(sd-base-container) 화면 템플릿. 자세히: [crud.md](./crud.md)
13
+ - **공유 데이터(shared-data)** — 서버 공유 마스터데이터 등록·구독, 선택 컨트롤(select/select-button/select-list). 자세히: [shared-data.md](./shared-data.md)
14
+ - **라우팅 / 앱 구조(메뉴·권한)** — 페이지 코드·뷰 타입·제목 시그널, 라우터링크, 앱 구조→메뉴/권한 변환, 권한 테이블. 자세히: [routing-appstructure.md](./routing-appstructure.md)
15
+ - **선택/정렬/확장 매니저** — sd-sheet/공유선택 컨트롤이 공유하는 selection/sorting/expanding 로직 컴포저블. 자세히: [selection-managers.md](./selection-managers.md)
16
+ - **부가 기능(테마·주소·에디터·시각화)** — 다크모드/폰트크기, 주소검색 모달, TipTap 리치에디터, 라벨/노트/진행률/달력/바코드/ECharts, 칸반, 상태 프리셋. 자세히: [features.md](./features.md)
17
+ - **호스트 디렉티브·동작 셋업** — resize/intersection/이벤트옵션/명령키 디렉티브, ripple/show-effect/invalid 셋업, 타입드 템플릿. 자세히: [directives.md](./directives.md)
18
+
19
+ ## 유틸 타입·헬퍼 (인라인)
20
+
21
+ 군에 속하지 않는 소형 유틸. 모두 `@simplysm/angular` 루트에서 직접 import.
22
+
23
+ ### mark
24
+
25
+ `mark(sig: WritableSignal<any>): void` — 시그널 값을 in-place mutation 한 뒤 소비자에게 변경을 알림.
26
+
27
+ - `sig` — 대상 WritableSignal. 값이 배열이면 `[...v]`, 객체면 `{...v}` 로 얕은 복사해 새 참조로 set → OnPush/computed 재평가 트리거. push·속성변경 후 한 줄로 갱신 신호를 줄 때.
28
+
29
+ ```typescript
30
+ items().push(x); // 참조 동일 → 안 알려짐
31
+ mark(items); // 얕은 복사로 새 참조 → 변경 전파
32
+ ```
33
+
34
+ ### setSafeStyle
35
+
36
+ `setSafeStyle(renderer: Renderer2, el: HTMLElement, style: Partial<CSSStyleDeclaration>): void` — Renderer2 로 여러 인라인 스타일을 한 번에 적용.
37
+
38
+ - `renderer` — Angular `Renderer2` 인스턴스. 키별로 `renderer.setStyle` 호출.
39
+ - `el` — 대상 엘리먼트.
40
+ - `style` — CSS 속성 부분 객체. 동작 셋업 함수(setupInvalid 등)가 내부적으로 사용.
41
+
42
+ ### FormatPipe (`| format`)
43
+
44
+ `transform(value: string | DateTime | DateOnly | undefined, format: string): string` — 값을 포맷 문자열로 변환하는 standalone 파이프(name `format`).
45
+
46
+ - `value` — 대상. `null`/`undefined` 면 `""`. `DateTime`/`DateOnly` 면 `value.toFormatString(format)`. 문자열이면 `X` 자리표시자 마스킹 적용(길이 일치 시).
47
+ - `format` — 포맷 문자열. 문자열 입력 시 `|` 로 분리한 후보 중 `X` 개수가 값 길이와 같은 패턴을 골라 `X` 를 한 글자씩 치환(예: `"XXX-XXXX"`).
48
+
49
+ ### DirectiveInputSignals / UndefToOptional / WithOptional (타입)
50
+
51
+ 컴포넌트의 `input()` 시그널 집합에서 값 타입을 추출하는 유틸 타입. 모달/토스트/인쇄 콘텐츠 컴포넌트의 `inputs` 타입 추론에 쓰임.
52
+
53
+ - `DirectiveInputSignals<T>` — `T` 의 `InputSignal` 프로퍼티만 골라 `{ key: 값타입 }` 로 변환. `InputSignal<V>` → `V`, undefined 포함 필드는 optional.
54
+ - `UndefToOptional<T>` — `T` 의 필드 중 `undefined` 를 포함하는 키를 optional(`?`)로 바꾸고 값에서 `undefined` 제외.
55
+ - `WithOptional<T, K>` — `T` 의 키 `K` 들만 optional 로 변환.
56
+
57
+ ### SelectModalOutputResult (타입)
58
+
59
+ `interface SelectModalOutputResult<TKey = any> { selectedKeys: TKey[] }` — 선택 모달이 close 로 반환하는 결과 형태.
60
+
61
+ - `selectedKeys` — 선택된 키 배열. 단일 선택이어도 배열. `SdSelectModal` 구현 모달이 확정 시 emit.
@@ -0,0 +1,119 @@
1
+ # @simplysm/angular — 폼 컨트롤·버튼·선택 컨트롤
2
+
3
+ 폼·입력·선택·버튼·드롭다운·리스트류 standalone 컴포넌트. 공통 패턴: 값은 `model()` 양방향, `disabled`/`inset`/`size`(`"sm"|"lg"`)/`inline`/`required` 다수 공유. 공통 theme literal = `"primary"|"secondary"|"info"|"success"|"warning"|"danger"|"gray"|"blue-gray"`. `required` 컨트롤은 내부 `setupInvalid` 로 네이티브 폼 검증과 연동되어 `<sd-form>` 안에서 동작.
4
+
5
+ ## SdButton / SdAnchor / SdAdditionalButton
6
+
7
+ - `<sd-button>` — 버튼. `type: "button"|"submit"`(폼 제출 트리거 여부), `theme`(공통 8색 + `"link"`/`"link-{색}"`/`"link-rev"` 텍스트버튼), `inline`(인라인폭), `inset`(테두리 없는 삽입형), `size`, `disabled`, `buttonStyle`/`buttonClass`(내부 `<button>` 에 적용). 클릭 ripple 내장.
8
+ - `<sd-anchor>` — 텍스트 링크형 클릭 요소. `disabled`, `theme`(공통 8색, 기본 `"primary"`). disabled 면 tabindex 제거.
9
+ - `<sd-additional-button>` — 콘텐츠 + 우측 버튼(`sd-anchor`/`sd-button` 투영) 결합 박스. `size`, `inset`.
10
+
11
+ ## SdModalSelectButton
12
+
13
+ `<sd-modal-select-button>` — 모달로 선택하는 값 입력 버튼(검색 아이콘 → 선택모달, 지우개 → 초기화).
14
+
15
+ - `modal = input.required<SdSelectModalInfo<SdSelectModal<K>>>()` — 띄울 선택 모달 정보(`selectMode`/`selectedKeys` 제외 inputs).
16
+ - `value = model<...>()` — 선택 결과 키(single=단일, multi=배열).
17
+ - `selectMode: "single"|"multi"` — 선택 모드. 기본 `"single"`.
18
+ - `disabled`/`required`(필수검증)/`inset`/`size` — 공통.
19
+ - `modalOptions` — `SdModalOptions` 전달.
20
+ - `searchIcon` — 검색 버튼 아이콘(기본 tablerSearch).
21
+
22
+ 타입: `SdSelectModal<TKey>`(선택모달 인터페이스, `selectMode`/`selectedKeys` input 추가), `SdSelectModalInfo<T>`(`SdModalInfo` 에서 `selectMode`/`selectedKeys` 제외).
23
+
24
+ ## SdTextfield
25
+
26
+ `<sd-textfield>` — 타입별 단일값 입력. 제네릭 `K extends keyof SdTextfieldTypes` 로 값 타입이 결정됨.
27
+
28
+ - `type = input.required<K>()` — 입력 타입(아래 `SdTextfieldTypes` 키). 값 타입·검증·표시 포맷을 결정.
29
+ - `value = model<SdTextfieldTypes[K]>()` — 값(타입별 number/string/DateOnly/DateTime/Time).
30
+ - `placeholder`/`title`/`inputStyle`/`inputClass` — 표시 부가.
31
+ - `disabled`/`readonly` — 비활성/읽기전용(둘 다 input 숨기고 텍스트만).
32
+ - `required`/`min`/`max`/`minlength`/`maxlength`/`pattern`/`validatorFn`/`format` — 검증 옵션. `validatorFn(value) => string | undefined` 는 커스텀 메시지, `format` 은 `type: "format"` 마스킹.
33
+ - `step`/`autocomplete` — 네이티브 속성.
34
+ - `useNumberComma` — number 타입 천단위 콤마. 기본 true.
35
+ - `minDigits` — number 표시 시 최소 소수 자릿수.
36
+ - `inline`/`inset`/`size`/`theme` — 공통 레이아웃.
37
+
38
+ `SdTextfieldTypes`(타입 키 → 값 타입): `number`→number, `text`/`password`/`color`/`email`/`format`→string, `date`/`month`/`year`→DateOnly, `datetime`/`datetime-sec`→DateTime, `time`/`time-sec`→Time. `sdTextfieldTypes` 는 이 키들의 배열.
39
+
40
+ ```html
41
+ <sd-textfield [type]="'number'" [(value)]="qty" [min]="0" [required]="true" />
42
+ <sd-textfield [type]="'date'" [(value)]="orderDate" />
43
+ ```
44
+
45
+ ## SdTextarea
46
+
47
+ `<sd-textarea>` — 여러 줄 문자열 입력. `value = model<string>()`, `minRows`(최소 줄수, 내용 따라 자동 확장), `placeholder`/`title`/`disabled`/`readonly`/`required`/`inline`/`inset`/`size`/`theme`/`validatorFn`/`inputStyle`/`inputClass`.
48
+
49
+ ## SdNumpad
50
+
51
+ `<sd-numpad>` — 터치 숫자패드. `value = model<number>()`, `placeholder`, `required`, `inputDisabled`(상단 입력칸 비활성), `useEnterButton`(ENT 버튼 표시), `useMinusButton`(부호 토글), `enterButtonClick = output()`(ENT 클릭).
52
+
53
+ ## SdRange
54
+
55
+ `<sd-range>` — from~to 범위 입력(textfield 2개). 제네릭 `K extends keyof SdTextfieldTypes`. `type = input.required<K>()`, `from`/`to = model<SdTextfieldTypes[K]>()`(to 의 min 은 from 자동), `inputStyle`, `required`, `disabled`.
56
+
57
+ ## SdDateRangePicker
58
+
59
+ `<sd-date-range-picker>` — 일/월/범위 기간 선택. `periodType = model<"일"|"월"|"범위">()`(기본 `"범위"`), `from`/`to = model<DateOnly>()`, `required`. 월 선택 시 from/to 를 해당 월 1일~말일로 동기화, 일 선택 시 to=from.
60
+
61
+ ## SdCheckbox / SdSwitch / SdCheckboxGroup(Item)
62
+
63
+ - `<sd-checkbox>` — 체크박스/라디오. `value = model(false)`, `canChangeFn`(변경 허용 함수, `(boolean) => boolean|Promise<boolean>`), `radio`(라디오 외형·체크만 가능), `icon`(체크 아이콘), `disabled`/`size`/`inline`/`inset`/`theme`(공통 8색 + `"white"`), `contentStyle`. Space 키 토글.
64
+ - `<sd-switch>` — 토글 스위치. `value = model(false)`, `canChangeFn`, `disabled`/`inline`/`inset`/`size`/`theme`. on 시 success 색.
65
+ - `<sd-checkbox-group>` — 다중선택 그룹. `value = model<T[]>([])`(선택값 배열), `disabled`.
66
+ - `<sd-checkbox-group-item>` — 그룹 항목. `value = input.required<T>()`(항목 값), `inline`. 부모 group 의 배열에 포함되면 체크.
67
+
68
+ ## SdSelect / SdSelectItem / SdSelectButton
69
+
70
+ - `<sd-select>` — 드롭다운 선택. 제네릭 `<M, T>`.
71
+ - `selectMode: M("single"|"multi")` — 선택 모드. 기본 `"single"`.
72
+ - `value = model<SelectModeValue<any>[M]>()` — single=단일값, multi=배열.
73
+ - `placeholder`/`disabled`/`inline`/`inset`/`size`/`required` — 공통.
74
+ - `hideSelectAll` — multi 의 전체선택/해제 바 숨김.
75
+ - `multiSelectionDisplayDirection: "vertical"` — multi 선택 표시 줄바꿈.
76
+ - `items`/`trackByFn`/`getChildrenFn` — 데이터 바인딩 방식(템플릿 `[itemOf]` 와 병행). `getChildrenFn` 지정 시 트리.
77
+ - `contentClass`/`contentStyle`, `dropdownOpen = model(false)`.
78
+ - `SelectModeValue<T>` = `{ multi: T[]; single: T }`.
79
+ - `<sd-select-item>` — 선택 항목. `value = input<T>()`, `disabled`, `hidden`. multi 면 체크박스 표시. 콘텐츠 HTML 이 선택 표시에 사용됨.
80
+ - `<sd-select-button>` — select 내부 우측 액션 버튼(ripple).
81
+
82
+ ```html
83
+ <sd-select [(value)]="deptId" [required]="true">
84
+ <sd-select-item [value]="undefined">미지정</sd-select-item>
85
+ @for (d of depts) { <sd-select-item [value]="d.id">{{ d.name }}</sd-select-item> }
86
+ </sd-select>
87
+ ```
88
+
89
+ ## SdDropdown / SdDropdownPopup
90
+
91
+ - `<sd-dropdown>` — 트리거 + 팝업 래퍼. `open = model(false)`, `disabled`. 팝업은 body 로 이동·위치 자동 계산(상/하·좌/우), 모바일은 하단 시트 + 백드롭. ArrowDown/Up/Space/ESC 키 처리.
92
+ - `<sd-dropdown-popup>` — 팝업 콘텐츠. content 투영, 높이 300px 초과 시 스크롤 캡.
93
+
94
+ ## SdForm
95
+
96
+ `<sd-form>` — 네이티브 검증 연동 폼 래퍼. `formSubmit = output<SubmitEvent>()`(검증 통과 시), `formInvalid = output()`(실패 시 `reportValidity` 후). `requestSubmit()` 메서드로 외부 제출. 내부 컨트롤의 `setupInvalid` 검증과 함께 동작.
97
+
98
+ ## SdCollapse / SdCollapseIcon
99
+
100
+ - `<sd-collapse>` — 높이 애니메이션 접기. `open = input(false)`. 콘텐츠 높이 측정해 margin-top 으로 접음.
101
+ - `<sd-collapse-icon>` — 회전 화살표 아이콘. `icon`(기본 chevronDown), `open = input(false)`, `openRotate = input(90)`(열림 시 회전각).
102
+
103
+ ## SdTab / SdTabItem
104
+
105
+ - `<sd-tab>` — 탭 바. `value = model<any>()` — 선택된 탭 값.
106
+ - `<sd-tab-item>` — 탭 항목. `value = input<any>()`. 부모 value 와 같으면 선택 표시, 클릭 시 부모 value set.
107
+
108
+ ## SdList / SdListItem
109
+
110
+ - `<sd-list>` — 리스트 컨테이너. `inset = input(false)`(배경 투명).
111
+ - `<sd-list-item>` — 리스트 항목. `layout: "accordion"|"flat"`(기본 accordion; flat 은 그룹헤더+상시펼침), `open = model(false)`(아코디언 펼침), `selected`, `selectedIcon`(선택 표시 아이콘), `readonly`, `contentStyle`/`contentClass`. 자식 `<sd-list>` 투영 시 하위 트리. `#toolTpl` 로 우측 도구 영역.
112
+
113
+ ## SdGap
114
+
115
+ `<sd-gap>` — 빈 간격. `height`/`width: "xxs"|"xs"|"sm"|"default"|"lg"|"xl"|"xxl"`(CSS 변수 기반), `heightPx`/`widthPx`/`widthEm`(수치). 0 이면 `display:none`, width 계열이면 inline-block, height 면 block.
116
+
117
+ ## SdPagination
118
+
119
+ `<sd-pagination>` — 페이지 네비. `currentPage = model(0)`(0-base 현재 페이지), `totalPageCount = input(0)`(전체 페이지 수), `visiblePageCount = input(10)`(한 그룹에 보일 페이지 버튼 수). 처음/이전그룹/페이지번호/다음그룹/마지막 버튼.
@@ -0,0 +1,50 @@
1
+ # @simplysm/angular — CRUD 화면 골격
2
+
3
+ 목록·상세 화면의 표준 레이아웃(타이틀바·커맨드 영역·콘텐츠·하단 커맨드)과 busy·권한제한·뷰타입(page/modal/control)별 분기·모달 선택 모드를 제공하는 컨테이너. 콘텐츠는 `<ng-template #...>` 슬롯으로 주입. `viewType` 은 `injectViewTypeSignal()`(routing 군) 결과를 넣는 것이 일반적.
4
+
5
+ ## SdBaseContainer
6
+
7
+ `<sd-base-container>` — 모든 CRUD 컨테이너의 기반. busy·권한제한·뷰타입 분기·공유데이터 로드 대기 처리.
8
+
9
+ - `viewType = input.required<SdViewType>()` — `"page"|"modal"|"control"`. page 면 탑바+제목 표시, 그 외엔 콘텐츠만.
10
+ - `initialized = input(false)` — 초기화 완료 여부. false 면 busy 표시.
11
+ - `restricted = input(false)` — 권한 제한. true 면 콘텐츠 대신 "사용권한 없음" 안내.
12
+ - `ready = model(false)` — 준비 완료 신호(공유데이터 대기 후 set).
13
+ - `busyCount = model(0)` — busy 카운트(0 초과 시 busy).
14
+ - 슬롯: `#topbarTpl`(탑바 액션), `#commandTpl`(상단 커맨드 바), `#contentTpl`(본문), `#bottomCommandTpl`(하단 커맨드). `viewTitle` 은 라우팅 군의 제목 신호 자동 사용.
15
+
16
+ ## SdCrudDetail
17
+
18
+ `<sd-crud-detail>` — 단일 레코드 상세/편집 화면. 저장 버튼·CTRL+S·폼 검증 연동.
19
+
20
+ - `viewType = input.required<SdViewType>()` — 뷰 타입. page=탑바 저장버튼, control=상단 저장버튼, modal=하단 확인버튼.
21
+ - `initialized`/`restricted`/`busyCount`/`ready` — `SdBaseContainer` 와 동일 의미.
22
+ - `readonly = input(false)` — 읽기전용(폼·저장버튼 숨김).
23
+ - `submit = output()` — 저장(폼 검증 통과) 시 emit. CTRL+S/저장버튼 → 폼 제출 → 이 이벤트.
24
+ - 슬롯: `#commandTpl`/`#contentTpl`/`#bottomCommandTpl`. contentTpl 은 readonly 가 아니면 `<sd-form>` 으로 감싸짐.
25
+
26
+ ## SdCrudList
27
+
28
+ `<sd-crud-list>` — 목록 화면(필터 폼 + 시트 + 등록/삭제/복구/선택). 제네릭 `<TItem, TKey>`.
29
+
30
+ - `viewType = input.required<SdViewType>()` / `initialized`/`restricted`/`busyCount`/`ready`/`readonly` — 기반 동일.
31
+ - `key = input.required<string>()` — 시트 설정 키(`{key}-sheet`).
32
+ - `selectMode: "single"|"multi"` — 모달 선택 모드. modal 뷰에서 single 은 행 선택 즉시 확정 close, multi 는 확인 버튼.
33
+ - `items = input<TItem[]>([])` — 목록 데이터.
34
+ - `selectedKeys = model<NonNullable<TKey>[]>([])` — 선택 키.
35
+ - `trackByFn = input.required<(item) => TKey>()` — 행 키 추출.
36
+ - `currDeletedItems = input<TItem[]>([])` — 삭제 표시(취소선) 항목 집합.
37
+ - `currentPage = model(0)`/`totalPageCount`/`itemsPerPage`/`visiblePageCount`/`sorts = model<SortingDef[]>()` — 페이징·정렬(시트로 전달).
38
+ - outputs: `filterSubmit`(조회 버튼), `submit`(저장/CTRL+S), `create`(등록 버튼), `delete = output<TItem[]>()`(선택/행 삭제), `restore = output<TItem[]>()`(선택/행 복구).
39
+ - 슬롯: `#filterTpl`(필터 폼 필드), `#commandTpl`/`#toolTpl`/`#bottomCommandTpl`. `<sd-sheet-column>` 자식은 시트 컬럼으로 합쳐짐(삭제 컬럼은 자동 주입).
40
+
41
+ ```html
42
+ <sd-crud-list [viewType]="viewType()" key="user" [items]="users()"
43
+ [(selectedKeys)]="sel" [trackByFn]="trackById"
44
+ (create)="onCreate()" (delete)="onDelete($event)" (submit)="onSave()">
45
+ <ng-template #filterTpl><sd-textfield [type]="'text'" [(value)]="filter.name" /></ng-template>
46
+ <sd-sheet-column key="name" header="이름">
47
+ <ng-template [cell]="users()" let-item="item">{{ item.name }}</ng-template>
48
+ </sd-sheet-column>
49
+ </sd-crud-list>
50
+ ```
@@ -0,0 +1,44 @@
1
+ # @simplysm/angular — 호스트 디렉티브·동작 셋업
2
+
3
+ 엘리먼트에 부착하는 동작 디렉티브와, 컴포넌트 생성자에서 호출해 호스트 엘리먼트에 동작을 주입하는 `setup*` 함수, 타입 안전 템플릿 디렉티브. 다른 컴포넌트들이 ripple/검증/리사이즈 감지 등에 내부적으로 사용하며 단독으로도 쓸 수 있음.
4
+
5
+ ## 이벤트 옵저버 디렉티브
6
+
7
+ - `[sdResize]` (`SdResizeDirective`) — `ResizeObserver` 로 크기 변화 감지. `sdResize = output<SdResizeEvent>()`. `SdResizeEvent = { heightChanged; widthChanged; target: HTMLElement; contentRect: DOMRectReadOnly }`. requestAnimationFrame 디바운스.
8
+ - `[sdIntersection]` (`SdIntersectionDirective`) — `IntersectionObserver` 로 가시성 감지. `sdIntersection = output<SdIntersectionEvent>()`. `SdIntersectionEvent = { entry: IntersectionObserverEntry }`.
9
+
10
+ ## SdEvents
11
+
12
+ `SdEvents` 디렉티브 — capture/passive/once 옵션 이벤트를 output 으로 노출(Angular 기본 바인딩이 지원 않는 리스너 옵션용). 셀렉터에 해당하는 속성을 호스트에 쓰면 동작. 예: `(click.capture)`, `(scroll.passive)`, `(wheel.capture.passive)`, `(touchstart.passive)`, `(transitionend.once)` 등. 각 output 은 대응 DOM 이벤트 타입(MouseEvent/WheelEvent/TouchEvent 등) emit.
13
+
14
+ `SdOptionEventPlugin` — `provideSdAngular` 가 등록하는 `EventManagerPlugin`. `.capture`/`.passive`/`.once` 접미사 이벤트 바인딩을 실제 리스너 옵션으로 변환. 직접 사용 불필요.
15
+
16
+ ## SdCommandDirective
17
+
18
+ `[sdRefreshCommand],[sdSaveCommand],[sdInsertCommand]` — 전역 단축키를 명령 이벤트로 변환(최상위 모달 컨텍스트에서만 발동).
19
+
20
+ - `sdRefreshCommand = output<KeyboardEvent>()` — Ctrl+Alt+L.
21
+ - `sdSaveCommand = output<KeyboardEvent>()` — Ctrl+S.
22
+ - `sdInsertCommand = output<KeyboardEvent>()` — Ctrl+Insert.
23
+
24
+ CRUD 컨테이너가 `sdSaveCommand` 를 저장에 연결.
25
+
26
+ ## ripple / show-effect / invalid 디렉티브·셋업
27
+
28
+ 부착형 디렉티브와 동치 셋업 함수 쌍.
29
+
30
+ - `[sdRipple]` (`SdRipple`) — 클릭 ripple 효과. `sdRipple = input.required(booleanAttribute)`(활성 여부). `setupRipple(enableFn?: () => boolean)` 는 컴포넌트 생성자에서 호스트에 ripple 주입(버튼/체크박스가 사용).
31
+ - `[sdShowEffect]` (`SdShowEffect`) — 스크롤 진입 시 페이드/슬라이드 인. `sdShowEffect = input.required(booleanAttribute)`(활성), `sdShowEffectType: "l2r"|"t2b"`(슬라이드 방향, 기본 `"t2b"`). `setupRevealOnShow(optFn?)` 가 동치 셋업.
32
+ - `[sdInvalid]` (`SdInvalid`) — 임의 엘리먼트에 폼 검증 메시지 부착. `sdInvalid = input.required<string>()`(메시지, 빈 문자열이면 유효). `setupInvalid(getInvalidMessage: () => string)` 가 동치 셋업(숨김 input + `setCustomValidity` 로 네이티브 검증 연동, `<sd-form>` 제출 시 표시). 모든 `required` 컨트롤이 내부 사용.
33
+
34
+ ## setupModelHook
35
+
36
+ `setupModelHook<T, S extends WritableSignal<T>>(model: S, canFn: Signal<(item: T) => boolean | Promise<boolean>>): void` — `model` 의 set/update 를 가로채 `canFn` 통과 시에만 값 적용. 체크박스/스위치/공유선택리스트의 `canChangeFn` 구현.
37
+
38
+ - `model` — 가로챌 WritableSignal.
39
+ - `canFn` — 변경 허용 판정 시그널. `false` 반환 시 무시, `true` 면 즉시 set, Promise 면 resolve 가 `false` 아닐 때 set(에러는 ErrorHandler 위임).
40
+
41
+ ## 타입 안전 템플릿 디렉티브
42
+
43
+ - `ng-template[typed]` (`SdTypedTemplate<T>`) — `typed = input.required<T>()` 로 템플릿 컨텍스트 타입을 명시(재귀 메뉴 등 `let-x` 타입 추론용). 값은 타입 토큰일 뿐.
44
+ - `ng-template[itemOf]` (`SdItemOfTemplate<TItem>`) — `itemOf = input.required<TItem[]>()` 로 항목 반복 템플릿의 컨텍스트 타입 제공. select/calendar/공유선택이 항목 슬롯에 사용. 컨텍스트 `SdItemOfTemplateContext<TItem> = { $implicit; item; index; depth }`.
@@ -0,0 +1,55 @@
1
+ # @simplysm/angular — 부가 기능(테마·주소·에디터·시각화·칸반·프리셋)
2
+
3
+ 화면에 부분적으로 끼워 쓰는 독립 기능 컴포넌트·프로바이더. 테마(다크/폰트), 주소검색 모달, TipTap 리치에디터, 시각화(라벨/노트/진행률/달력/바코드/차트), 칸반 보드, 상태 프리셋.
4
+
5
+ ## SdThemeProvider / SdThemeSelector
6
+
7
+ - `SdThemeProvider` — 루트 테마 프로바이더. `dark: WritableSignal<boolean>`(다크모드, body 클래스 토글), `fontSize: WritableSignal<number>`(루트 폰트크기 px), `fontSizePresets: readonly number[]`(`[12,14,16,20,24,28]`), `increaseFontSize()`/`decreaseFontSize()`(프리셋 단계 이동). `provideSdAngular` 가 localStorage 영속화 연결.
8
+ - `<sd-theme-selector>` — 드롭다운 UI. 폰트크기 ±버튼·다크모드 스위치로 프로바이더 조작. input 없음.
9
+
10
+ ## SdAddressSearchModal
11
+
12
+ `<sd-address-search-modal>` — 다음(카카오) 우편번호 검색 모달. `SdModalContentDef<Address>` 구현(`SdModalProvider.showAsync` 의 type 으로 사용). 스크립트 동적 로드 후 임베드, 선택 시 결과 emit.
13
+
14
+ - `close = output<Address>()` — 선택 결과. `Address = { postNumber?; address?; buildingName? }`(결측 보존).
15
+ - input 없음. 스크립트 로드 실패 시 에러 메시지 표시.
16
+
17
+ ## SdTiptapEditor
18
+
19
+ `<sd-tiptap-editor>` — TipTap 기반 리치텍스트 에디터(HTML 값, 툴바: 제목·굵게·기울임·밑줄·취소선·색상·리스트 등).
20
+
21
+ - `value = model<string>()` — HTML 콘텐츠. 빈 내용이면 `undefined`(결측 보존).
22
+ - `disabled`/`readonly` — 비활성/읽기전용(편집 불가, 툴바 숨김).
23
+ - `required` — 필수 검증(폼 연동).
24
+ - `placeholder` — 빈 상태 안내(미지정 확장 시 적용).
25
+ - `validatorFn?: (value) => string | undefined` — 커스텀 검증 메시지.
26
+ - `extensions?: AnyExtension[]` — TipTap 확장 직접 지정(미지정 시 기본 확장 + placeholder).
27
+ - `editor: WritableSignal<Editor | undefined>` — 내부 TipTap 인스턴스(@internal, 고급/테스트용).
28
+
29
+ ## 시각화 컴포넌트
30
+
31
+ - `<sd-label>` — 인라인 라벨/배지. `theme`(공통 8색), `color?`(임의 배경색), `clickable`(호버 효과·커서).
32
+ - `<sd-note>` — 강조 박스. `theme`(공통 8색), `size`(`"sm"|"lg"`), `inset`.
33
+ - `<sd-progress>` — 진행률 막대. `value = input.required<number>()`(0~1, 퍼센트 표시·막대폭), `theme = input.required<...>()`(공통 8색), `size`, `inset`.
34
+ - `<sd-calendar>` — 월 달력에 항목 배치. 제네릭 `<T>`. `items = input.required<T[]>()`, `getItemDateFn = input.required<(item, index) => DateOnly>()`(항목 날짜), `yearMonth = input(...)`(표시 월, 기본 이번달 1일), `weekStartDay = input(0)`(주 시작 요일), `minDaysInFirstWeek = input(1)`. 셀 항목은 `<ng-template [itemOf]>`.
35
+ - `<sd-barcode>` — 바코드/QR SVG 렌더(bwip-js). `type = input.required<BarcodeType>()`(바코드 종류, `"qrcode"`/`"code128"`/`"ean13"` 등 다수 리터럴 유니온), `value = input<string>()`(인코딩 텍스트, 빈값이면 미표시).
36
+ - `<sd-echarts>` — ECharts 차트. `option = input.required<EChartsOption>()`(차트 옵션), `notMerge = input(false)`(setOption 병합 여부), `loading = input(false)`(로딩 스피너). 리사이즈 자동 반영.
37
+
38
+ ## SdKanbanBoard / SdKanbanLane / SdKanban
39
+
40
+ 드래그 가능한 칸반 보드. 보드 > 레인 > 카드 계층.
41
+
42
+ - `<sd-kanban-board>` — 보드 컨테이너. 제네릭 `<L, T>`. `selectedValues = model<T[]>([])`(선택된 카드 값), `drop = output<SdKanbanBoardDropInfo<L, T>>()`(드롭 시 `{ sourceKanbanValue?; targetLaneValue?; targetKanbanValue? }`).
43
+ - `<sd-kanban-lane>` — 레인(열). 제네릭 `<L, T>`. `value = input<L>()`(레인 값), `busy`(로딩), `useCollapse`(접기 버튼), `collapse = model(false)`. `#titleTpl`/`#toolTpl` 슬롯. 선택 가능 카드 있으면 전체선택 체크박스.
44
+ - `<sd-kanban>` — 카드. 제네릭 `<L, T>`. `value = input<T>()`(카드 값), `selectable`(Shift클릭 선택), `draggable`(드래그 이동), `contentClass`.
45
+
46
+ 타입: `SdKanbanBoardDropInfo<L,T>`, `SdKanbanDragRef<L,T>`(`value()`/`heightOnDrag()`), `SdKanbanDropTarget<L,T>`(`targetLaneValue()`/`targetKanbanValue?()`).
47
+
48
+ ## SdStatePreset
49
+
50
+ `<sd-state-preset>` — 화면 상태(필터 등)를 명명 프리셋으로 저장·복원(시스템설정 영속화). 제네릭 `<TState>`.
51
+
52
+ - `key = input.required<string>()` — 프리셋 저장 키(태그명과 결합).
53
+ - `state = model.required<TState>()` — 현재 상태(저장/적용 대상). 프리셋 클릭 시 이 값으로 복원.
54
+ - `size = input<"sm"|"lg">()` — 크기.
55
+ - ⭐버튼=현재 상태 새 프리셋 저장, 각 프리셋=클릭 적용/저장/삭제. `SdStatePresetDef<TState> = { name: string; state: TState }`.
@@ -0,0 +1,74 @@
1
+ # @simplysm/angular — 설정·로깅·서비스 인프라
2
+
3
+ 앱 부트스트랩과 함께 읽히는 인프라 묶음. `provideSdAngular()` 로 전역 프로바이더를 등록하고, 클라이언트명·테마영속화·시스템로그·로컬스토리지·시스템설정·서비스 클라이언트 연결·전역 에러 처리를 담당.
4
+
5
+ ## provideSdAngular
6
+
7
+ `provideSdAngular(opt: { clientName: string }): EnvironmentProviders` — 앱 부트스트랩 시 `providers` 에 넣는 핵심 프로바이더 묶음.
8
+
9
+ - `opt.clientName` — 클라이언트 식별명. `SdAngularConfigProvider.clientName` 에 주입되어 로컬스토리지 키 prefix·서비스 클라이언트 생성에 사용. 앱마다 고유해야 함.
10
+
11
+ 등록 내용(본문 기준): 이미지 경고 비활성화, ng-icon 기본 설정, 다크모드/폰트크기 localStorage 영속화 effect, `window` 의 `error`/`unhandledrejection` → ErrorHandler 위임, `SdOptionEventPlugin`(이벤트 옵션 플러그인), `SdGlobalErrorHandlerPlugin`(ErrorHandler), zoneless 변경감지, Service Worker 업데이트 폴링(지수 백오프, 발견 시 confirm 후 reload), 라우터 내비게이션 중 `SdBusyProvider.globalBusyCount` 증감.
12
+
13
+ ```typescript
14
+ bootstrapApplication(AppComponent, {
15
+ providers: [provideRouter(routes), provideSdAngular({ clientName: "my-app" })],
16
+ });
17
+ ```
18
+
19
+ ## setupBgTheme
20
+
21
+ `setupBgTheme(options?: { theme?: ..., lightness?: "lightest" | "lighter" }): void` — 컴포넌트 활성 동안 `document.body` 의 `--background-color` 를 테마 색으로 지정(effect, cleanup 시 복원). 컴포넌트 생성자/필드에서 호출.
22
+
23
+ - `options.theme` — `"primary"|"secondary"|"info"|"success"|"warning"|"danger"|"gray"|"blue-gray"`. 배경 테마 색. 미지정 시 변수 비움(`""`).
24
+ - `options.lightness` — `"lightest"|"lighter"`. 밝기 단계. 기본 `"lightest"`.
25
+
26
+ ## SdAngularConfigProvider
27
+
28
+ `class SdAngularConfigProvider { clientName!: string }` — `provideSdAngular` 가 설정하는 클라이언트명 보관 루트 프로바이더. 다른 프로바이더가 inject 해 prefix 로 사용.
29
+
30
+ - `clientName` — 클라이언트 식별명. 직접 set 하지 말고 `provideSdAngular({clientName})` 로 주입됨.
31
+
32
+ ## SdSystemLogProvider
33
+
34
+ `class SdSystemLogProvider` — 시스템 로그 기록 루트 프로바이더. 콘솔 로깅 + 선택적 외부 전송.
35
+
36
+ - `writeFn?: (severity, ...data) => Promise<void> | void` — 외부 로그 싱크. 지정 시 `writeAsync` 가 콘솔 출력 후 이 함수도 호출. 미지정이면 콘솔만.
37
+ - `writeAsync(severity: "error"|"warn"|"log", ...data): Promise<void>` — 로그 기록. `severity` 로 로거 메서드 선택 후 `writeFn` 있으면 await(실패 시 내부 로깅만, throw 안 함).
38
+
39
+ ## SdLocalStorageProvider
40
+
41
+ `class SdLocalStorageProvider<T>` — `clientName.{key}` prefix 로 localStorage 에 JSON 저장하는 타입드 래퍼.
42
+
43
+ - `set<K>(key, value)` — `JSON.stringify` 후 저장. `key` 는 `T` 의 키.
44
+ - `get<K>(key): T[K] | undefined` — 파싱 반환. 없거나 파싱 실패 시 `undefined`(결측 보존).
45
+ - `remove(key)` — 항목 제거.
46
+
47
+ ## SdSystemConfigProvider
48
+
49
+ `class SdSystemConfigProvider<T>` — 시스템 설정 저장소. 외부 `fn` 이 있으면 서버, 없으면 localStorage 폴백.
50
+
51
+ - `fn?: { set(key, data): ...; get(key): PromiseLike<unknown> }` — 외부 저장 핸들러. 지정 시 서버 영속, 미지정 시 `SdLocalStorageProvider` 사용.
52
+ - `setAsync<K>(key, data: T[K] | undefined)` — 저장. `fn` 있으면 위임, 없고 `data==null` 이면 remove, 아니면 localStorage set.
53
+ - `getAsync(key)` — 조회. `fn` 있으면 위임, 없으면 localStorage get.
54
+
55
+ ## injectSdSystemConfigResource
56
+
57
+ `injectSdSystemConfigResource<T>(options: { key: Signal<string | undefined> })` — 호스트 엘리먼트 태그명 + `key` 로 시스템 설정을 읽고 쓰는 Angular `resource` 래퍼. 시트/상태프리셋이 컬럼·프리셋 영속화에 사용.
58
+
59
+ - `options.key` — 설정 키 시그널. `undefined` 면 로드 안 함(결측). 실제 키는 `{태그명}.{key}`.
60
+ - 반환: `{ value, isLoading, status, hasValue(), reload(), set(value), update(fn) }` — `set` 은 즉시 resource 갱신 + 마이크로태스크로 `setAsync` 영속화(실패 시 ErrorHandler 위임).
61
+
62
+ ## SdServiceClientFactoryProvider
63
+
64
+ `class SdServiceClientFactoryProvider` — 키별 `ServiceClient` 연결 풀. 요청/응답 진행률을 토스트 progress 로 표시.
65
+
66
+ - `connectAsync(key, options?: Partial<ServiceConnectionOptions>)` — `key` 로 클라이언트 연결. 호스트/포트/ssl 은 `location` 기본값 + `options` 머지. 이미 연결/이미 끊긴 키면 throw.
67
+ - `closeAsync(key)` — 연결 종료 후 풀에서 제거(미연결 키면 throw).
68
+ - `get(key): ServiceClient` — 연결된 클라이언트 반환. 미연결/끊긴 키면 throw.
69
+
70
+ ## SdGlobalErrorHandlerPlugin
71
+
72
+ `class SdGlobalErrorHandlerPlugin implements ErrorHandler` — `provideSdAngular` 가 `ErrorHandler` 로 등록하는 전역 에러 핸들러.
73
+
74
+ - `handleError(event)` — `PromiseRejectionEvent`/`ErrorEvent`/`Error`/기타를 분기해 메시지 구성 → 시스템 로그 기록 + 앱 파괴 후 전체화면 에러 오버레이 표시(클릭 시 reload). 최초 1회만 오버레이 노출. 직접 호출보다 Angular 가 자동 호출.
@@ -0,0 +1,55 @@
1
+ # @simplysm/angular — 레이아웃(사이드바·탑바)
2
+
3
+ 앱 화면 셸을 구성하는 사이드바/탑바 컨테이너·메뉴·사용자 메뉴. 사이드바는 모바일에서 백드롭+슬라이드, 탑바는 사이드바 토글 버튼을 자동 제공. 메뉴 입력은 `SdMenu[]`(라우팅·앱구조 군 참조)이며 `sdRouterLink`/선택표시가 내장됨.
4
+
5
+ ## SdSidebarContainer
6
+
7
+ `<sd-sidebar-container>` — 사이드바 + 본문 레이아웃 컨테이너. 본문에 좌측 패딩(`--sidebar-width`)을 주고, 모바일에서는 백드롭 표시. 라우터 내비게이션 시작 시 자동으로 사이드바를 닫음(`toggle` 신호 보유). input 없음.
8
+
9
+ ## SdSidebar
10
+
11
+ `<sd-sidebar>` — 실제 사이드바 패널. 부모 `SdSidebarContainer.toggle` 을 따라 슬라이드 표시/숨김. 콘텐츠는 투영. input 없음.
12
+
13
+ ## SdSidebarMenu
14
+
15
+ `<sd-sidebar-menu>` — 사이드바 메뉴 트리.
16
+
17
+ - `menus = input<SdMenu[]>([])` — 메뉴 트리. `SdAppStructureProvider.usableMenus()` 결과를 주로 넣음.
18
+ - `layout: "accordion"|"flat"` — 루트 메뉴 레이아웃. 미지정 시 메뉴 3개 이하면 flat, 초과면 accordion 자동.
19
+ - `getMenuIsSelectedFn?: (menu) => boolean` — 선택 판정 커스텀(미지정 시 현재 페이지코드와 codeChain 비교).
20
+
21
+ 각 메뉴 항목은 `sdRouterLink` 로 `/home/{codeChain}` 이동, `url` 있으면 새 탭, 자식 있으면 하위 트리.
22
+
23
+ ## SdSidebarUser
24
+
25
+ `<sd-sidebar-user>` — 사이드바 상단 사용자 영역 + 접이식 메뉴.
26
+
27
+ - `userMenu = input<SdSidebarUserMenu>()` — `{ title: string; menus: { title; onClick }[] }`. title 클릭 시 메뉴 펼침, 각 항목 클릭 시 `onClick` 실행.
28
+ - 콘텐츠 투영부에 사용자 정보 표시.
29
+
30
+ ## SdTopbarContainer
31
+
32
+ `<sd-topbar-container>` — 탑바 + 본문 세로 레이아웃 컨테이너. input 없음. `<sd-topbar>` 와 본문을 자식으로 둠.
33
+
34
+ ## SdTopbar
35
+
36
+ `<sd-topbar>` — 상단 바. 사이드바 컨테이너가 있으면 좌측에 메뉴 토글 버튼 자동 표시.
37
+
38
+ - `sidebarContainer = input<SdSidebarContainer>()` — 토글 대상 사이드바. 미지정 시 inject 된 부모 `SdSidebarContainer` 사용. 둘 중 하나라도 있으면 토글 버튼 노출.
39
+ - 콘텐츠(제목·액션)는 투영.
40
+
41
+ ## SdTopbarMenu
42
+
43
+ `<sd-topbar-menu>` — 탑바 가로 메뉴(각 루트 메뉴가 드롭다운).
44
+
45
+ - `menus = input<SdMenu[]>([])` — 메뉴 트리.
46
+ - `getMenuIsSelectedFn?: (menu) => boolean` — 선택 판정 커스텀.
47
+
48
+ 리프 메뉴 클릭 시 드롭다운 닫힘, `url` 있으면 새 탭.
49
+
50
+ ## SdTopbarUser
51
+
52
+ `<sd-topbar-user>` — 탑바 우측 사용자 드롭다운 메뉴.
53
+
54
+ - `menus = input.required<SdTopbarUserMenu[]>()` — `{ title: string; onClick: () => void }[]`. 항목 클릭 시 `onClick` 실행 후 드롭다운 닫힘.
55
+ - 트리거 라벨(사용자명 등)은 콘텐츠 투영.