@simplysm/sd-claude 14.0.82 → 14.0.84

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 (90) hide show
  1. package/claude/references/sd-requirement-source-handling.md +20 -20
  2. package/claude/references/sd-simplysm14/README.md +13 -13
  3. package/claude/references/sd-simplysm14/manuals/client-component.md +92 -92
  4. package/claude/references/sd-simplysm14/manuals/client-crud.md +11 -11
  5. package/claude/references/sd-simplysm14/manuals/client-demo.md +28 -28
  6. package/claude/references/sd-simplysm14/manuals/client-rules.md +1 -1
  7. package/claude/references/sd-simplysm14/manuals/client-setup.md +21 -21
  8. package/claude/references/sd-simplysm14/manuals/client-tab.md +3 -3
  9. package/claude/references/sd-simplysm14/manuals/logging.md +15 -15
  10. package/claude/references/sd-simplysm14/manuals/orm-union.md +6 -6
  11. package/claude/references/sd-simplysm14/manuals/orm.md +19 -19
  12. package/claude/references/sd-simplysm14/manuals/test.md +33 -33
  13. package/claude/rules/sd-design-rules.md +18 -18
  14. package/claude/sd-system-prompt.md +369 -0
  15. package/claude/skills/sd-commit/SKILL.md +10 -10
  16. package/claude/skills/sd-config/SKILL.md +2 -2
  17. package/claude/skills/sd-demo/SKILL.md +45 -45
  18. package/claude/skills/sd-dev/SKILL.md +15 -15
  19. package/claude/skills/sd-docs/SKILL.md +7 -7
  20. package/claude/skills/sd-docs/references/subagent-prompt.md +33 -33
  21. package/claude/skills/sd-impl/SKILL.md +60 -60
  22. package/claude/skills/sd-review/SKILL.md +9 -9
  23. package/claude/skills/sd-skill/SKILL.md +74 -74
  24. package/claude/skills/sd-skill/evals/fixtures/existing-skill/.claude/skills/todo-format/SKILL.md +1 -1
  25. package/claude/skills/sd-spec/SKILL.md +354 -319
  26. package/claude/skills/sd-spec/references/example-spec.md +104 -104
  27. package/claude/skills/sd-unpack/SKILL.md +34 -34
  28. package/claude/skills/sd-unpack/scripts/handlers/__pycache__/office_com.cpython-314.pyc +0 -0
  29. package/claude/skills/sd-unpack/scripts/handlers/office_com.py +234 -159
  30. package/claude/skills/sd-use/SKILL.md +4 -4
  31. package/package.json +1 -1
  32. package/claude/references/sd-simplysm14/apis/angular/README.md +0 -37
  33. package/claude/references/sd-simplysm14/apis/angular/app-structure.md +0 -92
  34. package/claude/references/sd-simplysm14/apis/angular/buttons.md +0 -88
  35. package/claude/references/sd-simplysm14/apis/angular/crud.md +0 -100
  36. package/claude/references/sd-simplysm14/apis/angular/forms.md +0 -200
  37. package/claude/references/sd-simplysm14/apis/angular/infrastructure.md +0 -231
  38. package/claude/references/sd-simplysm14/apis/angular/kanban.md +0 -80
  39. package/claude/references/sd-simplysm14/apis/angular/layout.md +0 -92
  40. package/claude/references/sd-simplysm14/apis/angular/modal.md +0 -115
  41. package/claude/references/sd-simplysm14/apis/angular/routing.md +0 -107
  42. package/claude/references/sd-simplysm14/apis/angular/select-dropdown.md +0 -35
  43. package/claude/references/sd-simplysm14/apis/angular/selection-managers.md +0 -82
  44. package/claude/references/sd-simplysm14/apis/angular/shared-data.md +0 -134
  45. package/claude/references/sd-simplysm14/apis/angular/sheet.md +0 -127
  46. package/claude/references/sd-simplysm14/apis/angular/toast.md +0 -97
  47. package/claude/references/sd-simplysm14/apis/angular/visual.md +0 -167
  48. package/claude/references/sd-simplysm14/apis/capacitor-plugin-auto-update/README.md +0 -79
  49. package/claude/references/sd-simplysm14/apis/capacitor-plugin-file-system/README.md +0 -83
  50. package/claude/references/sd-simplysm14/apis/capacitor-plugin-intent/README.md +0 -91
  51. package/claude/references/sd-simplysm14/apis/capacitor-plugin-usb-storage/README.md +0 -49
  52. package/claude/references/sd-simplysm14/apis/core-browser/README.md +0 -143
  53. package/claude/references/sd-simplysm14/apis/core-common/README.md +0 -58
  54. package/claude/references/sd-simplysm14/apis/core-common/extensions.md +0 -88
  55. package/claude/references/sd-simplysm14/apis/core-common/features.md +0 -51
  56. package/claude/references/sd-simplysm14/apis/core-common/types.md +0 -88
  57. package/claude/references/sd-simplysm14/apis/core-common/utils.md +0 -189
  58. package/claude/references/sd-simplysm14/apis/core-node/README.md +0 -12
  59. package/claude/references/sd-simplysm14/apis/core-node/consola.md +0 -59
  60. package/claude/references/sd-simplysm14/apis/core-node/cpx.md +0 -44
  61. package/claude/references/sd-simplysm14/apis/core-node/fs-watcher.md +0 -42
  62. package/claude/references/sd-simplysm14/apis/core-node/fsx.md +0 -53
  63. package/claude/references/sd-simplysm14/apis/core-node/pathx.md +0 -24
  64. package/claude/references/sd-simplysm14/apis/core-node/worker.md +0 -65
  65. package/claude/references/sd-simplysm14/apis/excel/README.md +0 -193
  66. package/claude/references/sd-simplysm14/apis/lint/README.md +0 -94
  67. package/claude/references/sd-simplysm14/apis/orm-common/README.md +0 -58
  68. package/claude/references/sd-simplysm14/apis/orm-common/db-context.md +0 -77
  69. package/claude/references/sd-simplysm14/apis/orm-common/executable.md +0 -20
  70. package/claude/references/sd-simplysm14/apis/orm-common/expr.md +0 -92
  71. package/claude/references/sd-simplysm14/apis/orm-common/queryable.md +0 -98
  72. package/claude/references/sd-simplysm14/apis/orm-common/schema-builders.md +0 -128
  73. package/claude/references/sd-simplysm14/apis/orm-node/README.md +0 -69
  74. package/claude/references/sd-simplysm14/apis/sd-claude/README.md +0 -32
  75. package/claude/references/sd-simplysm14/apis/sd-cli/README.md +0 -80
  76. package/claude/references/sd-simplysm14/apis/sd-cli/sd-config.md +0 -155
  77. package/claude/references/sd-simplysm14/apis/service-client/README.md +0 -131
  78. package/claude/references/sd-simplysm14/apis/service-common/README.md +0 -29
  79. package/claude/references/sd-simplysm14/apis/service-common/app-structure.md +0 -63
  80. package/claude/references/sd-simplysm14/apis/service-common/messages.md +0 -56
  81. package/claude/references/sd-simplysm14/apis/service-common/protocol.md +0 -64
  82. package/claude/references/sd-simplysm14/apis/service-common/service-types.md +0 -43
  83. package/claude/references/sd-simplysm14/apis/service-server/README.md +0 -13
  84. package/claude/references/sd-simplysm14/apis/service-server/auth.md +0 -39
  85. package/claude/references/sd-simplysm14/apis/service-server/builtin-services.md +0 -71
  86. package/claude/references/sd-simplysm14/apis/service-server/define-service.md +0 -55
  87. package/claude/references/sd-simplysm14/apis/service-server/internals.md +0 -82
  88. package/claude/references/sd-simplysm14/apis/service-server/server.md +0 -57
  89. package/claude/references/sd-simplysm14/apis/storage/README.md +0 -71
  90. package/claude/rules/sd-base-rules.md +0 -306
@@ -1,231 +0,0 @@
1
- # @simplysm/angular — infrastructure
2
-
3
- 앱 인프라 프로바이더·DOM 이벤트/효과 디렉티브·유틸 함수·타입 헬퍼. 전부 standalone, root 제공자거나 함수.
4
-
5
- ## 설정·저장 프로바이더
6
-
7
- ### SdSystemLogProvider (root)
8
-
9
- ```ts
10
- writeFn?: (severity, ...data) => Promise<void>|void;
11
- writeAsync(severity: "error"|"warn"|"log", ...data): Promise<void>;
12
- ```
13
-
14
- - consola 태그(`angular:system-log`)로 로컬 로그. `writeFn` 세팅 시 서버 등으로 추가 전송. 전송 실패는 로컬 error 만 남기고 throw 안 함.
15
-
16
- ### SdLocalStorageProvider<T> (root)
17
-
18
- ```ts
19
- set<K>(key: K, value: T[K]); get<K>(key: K): T[K]|undefined; remove(key: K);
20
- ```
21
-
22
- - 키 prefix = `clientName` (`SdAngularConfigProvider`). JSON 직렬화. 파싱 실패 시 undefined.
23
-
24
- ### SdSystemConfigProvider<T> (root)
25
-
26
- ```ts
27
- fn?: { set<K>(key, data): Promise<void>|void; get(key): PromiseLike<any> };
28
- setAsync<K>(key, data): Promise<void>;
29
- getAsync(key): Promise<...>;
30
- ```
31
-
32
- - `fn` 미세팅이면 `SdLocalStorageProvider` 위임. `fn` 세팅 시 서버 영구 저장으로 전환. 모달 사이즈·시트 컬럼 설정·프리셋이 이걸 통함.
33
-
34
- ### injectSdSystemConfigResource<T>
35
-
36
- ```ts
37
- function injectSdSystemConfigResource<T>(options: { key: Signal<string|undefined> }): {
38
- value: Signal<T|undefined>; isLoading: Signal<boolean>;
39
- status; hasValue(); reload();
40
- set(value: T|undefined): void;
41
- update(fn: (prev: T|undefined) => T|undefined): void;
42
- };
43
- ```
44
-
45
- - 컴포넌트의 element tag + key signal 조합으로 `SdSystemConfigProvider` 값 resource 화. `set`/`update` 시 microtask 로 server 저장(에러는 `ErrorHandler.handleError`).
46
-
47
- ## 서비스 클라이언트
48
-
49
- ### SdServiceClientFactoryProvider (root)
50
-
51
- ```ts
52
- connectAsync(key: string, options?: Partial<ServiceConnectionOptions>): Promise<void>;
53
- closeAsync(key: string): Promise<void>;
54
- get(key: string): ServiceClient;
55
- ```
56
-
57
- - key 별 `ServiceClient` 풀. `connectAsync` 시 기본 host/port 는 현재 `location` 기준(https 면 443, http 면 80). request/response progress 시 자동으로 `SdToastProvider.info(..., true)` progress 토스트.
58
- - 중복 connect 또는 closed key 재사용은 throw. destroy 시 모든 클라이언트 close.
59
-
60
- ## 파일·에러·테마
61
-
62
- ### SdFileDialogProvider (root)
63
-
64
- ```ts
65
- showAsync(multiple?: false, accept?: string): Promise<File|undefined>;
66
- showAsync(multiple: true, accept?: string): Promise<File[]|undefined>;
67
- ```
68
-
69
- - `<input type="file">` 동적 생성 → click → 선택 후 결과. 취소 시 undefined.
70
- - `accept` — MIME/확장자(`"image/*"`·`".pdf,.docx"`).
71
-
72
- ### SdGlobalErrorHandlerPlugin (Angular `ErrorHandler` 교체용)
73
-
74
- - `provideSdAngular` 가 자동 등록. 직접 등록 안 해도 됨.
75
- - `PromiseRejectionEvent`/`ErrorEvent`/`Error`/임의 값 분류해 `SdSystemLogProvider.writeAsync('error', ...)` + 전체 화면 에러 오버레이 표시 + Angular `ApplicationRef.destroy()`. 오버레이 클릭 → 홈으로 reload.
76
-
77
- ### SdThemeProvider (root)
78
-
79
- ```ts
80
- dark: WritableSignal<boolean>;
81
- readonly fontSizePresets: readonly number[]; // [12,14,16,20,24,28]
82
- fontSize: WritableSignal<number>; // body html font-size px
83
- increaseFontSize(): void; decreaseFontSize(): void;
84
- ```
85
-
86
- - `dark` 효과 → `<body class="sd-theme-dark">`. `fontSize` → `<html style="font-size:Npx">`.
87
- - `increase`/`decrease` — presets 의 인접 값으로만 이동.
88
-
89
- ### SdThemeSelector — `<sd-theme-selector>`
90
-
91
- - inputs 없음. 팔레트(다크 토글) + 폰트 크기 ± 버튼 UI.
92
-
93
- ## 유틸 함수
94
-
95
- ### FormatPipe — `{{ value | format: pattern }}`
96
-
97
- - `value: string|DateTime|DateOnly|undefined`, `format: string` → 포맷팅된 string.
98
- - DateTime/DateOnly → `toFormatString(format)`.
99
- - 문자열 → `X` 자리에 1글자씩 매핑. `|` 로 여러 패턴 alt 가능(value 길이 일치하는 첫 패턴 선택). 매칭 실패 시 원본 반환.
100
- - 예: `"01012345678" | format: "XXX-XXXX-XXXX|XXX-XXX-XXXX"` → `"010-1234-5678"`.
101
-
102
- ### mark
103
-
104
- ```ts
105
- function mark(sig: WritableSignal<any>): void
106
- ```
107
-
108
- - in-place mutation 후 signal 소비자에게 변경 알림. 배열은 shallow copy, 객체는 spread. mutable 데이터로 setter 호출 누락 방지용.
109
-
110
- ### setSafeStyle
111
-
112
- ```ts
113
- function setSafeStyle(renderer: Renderer2, el: HTMLElement, style: Partial<CSSStyleDeclaration>): void
114
- ```
115
-
116
- - `Renderer2.setStyle` 을 객체 단위로 일괄 적용. SSR/zoneless 안전.
117
-
118
- ### setupBgTheme
119
-
120
- ```ts
121
- function setupBgTheme(options?: {
122
- theme?: "primary"|"secondary"|"info"|"success"|"warning"|"danger"|"gray"|"blue-gray";
123
- lightness?: "lightest"|"lighter";
124
- }): void
125
- ```
126
-
127
- - 컴포넌트 진입 동안 `document.body --background-color` 를 테마 변수로 설정. destroy 시 원복.
128
- - `lightness` 기본 `lightest`.
129
-
130
- ### setupModelHook
131
-
132
- ```ts
133
- function setupModelHook<T>(model: WritableSignal<T>, canFn: Signal<(item: T) => boolean|Promise<boolean>>): void
134
- ```
135
-
136
- - model 의 `set`/`update` 를 가로채 `canFn(value)` 결과가 true(또는 Promise<true>) 일 때만 적용. false 면 무시. Promise reject 는 `ErrorHandler`.
137
- - 체크박스/스위치 등의 `canChangeFn` 패턴 구현체.
138
-
139
- ## 타입 헬퍼
140
-
141
- ```ts
142
- type UndefToOptional<T> // undefined 가능 prop 을 optional 로
143
- type DirectiveInputSignals<T> // 컴포넌트의 InputSignal prop → 값 타입 객체
144
- type WithOptional<T, K extends keyof T> // 일부 키를 optional 로
145
- ```
146
-
147
- - `SdModalInfo.inputs` / `SdPrintInput.inputs` 등의 타입 빌딩에 사용.
148
-
149
- ## DOM 이벤트 디렉티브
150
-
151
- ### SdEvents — `<el (click.capture)="..." (scroll.passive)="..." ...>`
152
-
153
- - 이벤트 이름 끝에 `.capture`/`.passive`/`.once` 조합 가능한 다중 셀렉터 디렉티브. 표준 Angular 이벤트 바인딩으로는 옵션 못 주는 listener option 활성.
154
- - 지원 이벤트: click/mouse*/keydown/keyup/focus/blur/invalid/scroll/wheel/touch*/drag*/transitionend/animationend.
155
-
156
- ### SdOptionEventPlugin
157
-
158
- - `provideSdAngular` 가 `EVENT_MANAGER_PLUGINS` 에 등록. `SdEvents` 가 의존. 직접 호출 X.
159
-
160
- ### SdResizeDirective — `[sdResize]`
161
-
162
- ```ts
163
- sdResize = output<SdResizeEvent>();
164
- interface SdResizeEvent { heightChanged: boolean; widthChanged: boolean; target: HTMLElement; contentRect: DOMRectReadOnly; }
165
- ```
166
-
167
- - `ResizeObserver` + rAF 디바운스. 너비/높이 변경 플래그 포함.
168
-
169
- ### SdIntersectionDirective — `[sdIntersection]`
170
-
171
- ```ts
172
- sdIntersection = output<SdIntersectionEvent>();
173
- interface SdIntersectionEvent { entry: IntersectionObserverEntry; }
174
- ```
175
-
176
- - `IntersectionObserver` 래퍼. 무한 스크롤 트리거 등.
177
-
178
- ### SdCommandDirective — `[sdRefreshCommand]`/`[sdSaveCommand]`/`[sdInsertCommand]`
179
-
180
- - 전역 키 단축키 출력. `Ctrl+Alt+L` → refresh, `Ctrl+S` → save, `Insert` → insert. 최상위 열린 모달 또는 호스트가 활성 영역일 때만 발화(다른 모달 위면 무시).
181
-
182
- ## 효과 디렉티브
183
-
184
- ### SdRipple — `[sdRipple]` + setupRipple
185
-
186
- ```ts
187
- enabled = input.required({ alias: "sdRipple", transform: booleanAttribute });
188
- ```
189
-
190
- - 클릭 시 머티리얼풍 잉크 효과. `setupRipple(enableFn?)` 은 컴포넌트 안에서 inject 후 직접 호출하는 형태.
191
-
192
- ### SdShowEffect — `[sdShowEffect]` + setupRevealOnShow
193
-
194
- ```ts
195
- enabled = input.required({ alias: "sdShowEffect", transform: booleanAttribute });
196
- sdShowEffectType = input<"l2r"|"t2b">("t2b");
197
- ```
198
-
199
- - 스크롤로 첫 표시 시 페이드인 + 슬라이드. `l2r`: 좌→우, `t2b`: 위→아래(기본).
200
-
201
- ### SdInvalid — `[sdInvalid]` + setupInvalid
202
-
203
- ```ts
204
- invalidMessage = input.required<string>({ alias: "sdInvalid" });
205
- ```
206
-
207
- - 호스트 요소를 invalid 상태로 표시(빨간 점 인디케이터 + form submit 막기). 빈 문자열이면 valid. 직접 form 검증 메시지 표시할 때.
208
-
209
- ## 템플릿 디렉티브
210
-
211
- ### SdTypedTemplate — `<ng-template typed>`
212
-
213
- ```ts
214
- class SdTypedTemplate<T> { typed = input.required<T>(); }
215
- ```
216
-
217
- - 템플릿 컨텍스트 타입 명시용. `typed` 에 token 값/객체 바인딩.
218
-
219
- ### SdItemOfTemplate — `<ng-template itemOf>`
220
-
221
- ```ts
222
- class SdItemOfTemplate<TItem> { itemOf = input.required<TItem[]>(); }
223
- interface SdItemOfTemplateContext<TItem> { $implicit: TItem; item: TItem; index: number; depth: number; }
224
- ```
225
-
226
- - 리스트 아이템 템플릿 컨텍스트 타입 추론. `let-item`, `let-index="index"`, `let-depth="depth"` 사용 가능. `SdCalendar` 등이 자식으로 요구.
227
-
228
- ## 주의
229
-
230
- - `provideSdAngular` 호출만으로 `SdGlobalErrorHandlerPlugin`/`SdOptionEventPlugin`/`SdEvents` 가 모두 활성. 별도 추가 불필요.
231
- - `SdLocalStorageProvider`/`SdSystemConfigProvider` 의 키는 `clientName.<key>` 형태. 같은 도메인의 다른 simplysm 앱과 충돌 방지.
@@ -1,80 +0,0 @@
1
- # @simplysm/angular — kanban
2
-
3
- 드래그·드롭 칸반 보드. lane 간 카드 이동·다중 선택.
4
-
5
- ## SdKanbanBoard — `<sd-kanban-board>`
6
-
7
- ```ts
8
- class SdKanbanBoard<L, T>
9
- selectedValues = model<T[]>([]); // 선택된 카드 value 목록
10
- drop = output<SdKanbanBoardDropInfo<L, T>>();
11
-
12
- interface SdKanbanBoardDropInfo<L, T> {
13
- sourceKanbanValue?: T;
14
- targetLaneValue?: L;
15
- targetKanbanValue?: T; // 특정 카드 위에 떨어뜨렸을 때
16
- }
17
- ```
18
-
19
- - 자식으로 `<sd-kanban-lane>` 들. 카드를 lane 또는 다른 카드 위로 드롭하면 `drop` 발화. 호출자는 데이터 reorder 책임.
20
- - `selectedValues` — `<sd-kanban selectable>` 의 클릭 시 선택 토글.
21
-
22
- ```html
23
- <sd-kanban-board (drop)="onDrop($event)">
24
- @for (lane of lanes; track lane.id) {
25
- <sd-kanban-lane [value]="lane">
26
- <div sd-kanban-lane-title>{{ lane.title }}</div>
27
- @for (card of lane.cards; track card.id) {
28
- <sd-kanban [value]="card" draggable>{{ card.title }}</sd-kanban>
29
- }
30
- </sd-kanban-lane>
31
- }
32
- </sd-kanban-board>
33
- ```
34
-
35
- ## SdKanbanLane — `<sd-kanban-lane>`
36
-
37
- ```ts
38
- class SdKanbanLane<L, T>
39
- value = input<L>(); // lane 식별 데이터
40
- busy = input(false); // lane 영역에 SdBusyContainer 효과
41
- useCollapse = input(false); // 접기 버튼 노출
42
- collapse = model(false); // 접힌 상태
43
- ```
44
-
45
- - `value` 는 `drop.targetLaneValue` 로 사용.
46
- - `useCollapse=true` + `collapse(true)` 면 컨텐츠 숨김(헤더만).
47
-
48
- ## SdKanban — `<sd-kanban>`
49
-
50
- ```ts
51
- class SdKanban<L, T> implements SdKanbanDragRef<L, T>, SdKanbanDropTarget<L, T>
52
- value = input<T>();
53
- selectable = input(false);
54
- draggable = input(false);
55
- contentClass = input<string>();
56
- ```
57
-
58
- - `draggable=true` 면 드래그 핸들 활성. `selectable=true` 면 클릭 시 `SdKanbanBoard.selectedValues` 토글.
59
- - `value` 는 `drop.sourceKanbanValue`/`targetKanbanValue` 로 사용.
60
- - `<ng-content>` 가 카드 본문.
61
-
62
- ## 타입
63
-
64
- ```ts
65
- interface SdKanbanDragRef<_L, T> {
66
- value(): T|undefined;
67
- heightOnDrag(): number;
68
- }
69
- interface SdKanbanDropTarget<L, T> {
70
- targetLaneValue(): L|undefined;
71
- targetKanbanValue?(): T|undefined;
72
- }
73
- ```
74
-
75
- - 보드 내부에서 드래그 소스/드롭 타겟 구분에 사용. 컴포넌트 클래스가 직접 구현. 외부에서 직접 구현할 일은 거의 없음.
76
-
77
- ## 주의
78
-
79
- - 드롭 후 데이터 반영은 호출자가 해야 함. `drop` 이벤트만으로 자동 재정렬되지 않음.
80
- - 같은 카드를 자기 자신에 드롭하면 `sourceKanbanValue === targetKanbanValue`. 호출자가 무시 처리.
@@ -1,92 +0,0 @@
1
- # @simplysm/angular — layout
2
-
3
- 앱 셸 레이아웃. 사이드바·탑바 컨테이너와 메뉴 위젯.
4
-
5
- ## SdSidebarContainer — `<sd-sidebar-container>`
6
-
7
- ```ts
8
- toggle: WritableSignal<boolean>; // 사이드바 표시 여부
9
- ```
10
-
11
- - 사이드바 + 메인 영역 컨테이너. `Router` 네비게이션 시작 시 `toggle` 자동 false(모바일에서 메뉴 자동 닫힘).
12
- - 자식: `<sd-sidebar>` + 본문 컨텐츠.
13
-
14
- ## SdSidebar — `<sd-sidebar>`
15
-
16
- ```ts
17
- toggle = computed(() => parent.toggle());
18
- ```
19
-
20
- - 사이드바 패널. 부모 `SdSidebarContainer.toggle` 에 연동되어 슬라이드 표시.
21
- - `<ng-content>` 가 사이드바 내부 컨텐츠(보통 `<sd-sidebar-user>` + `<sd-sidebar-menu>`).
22
-
23
- ## SdSidebarMenu — `<sd-sidebar-menu>`
24
-
25
- ```ts
26
- menus = input<SdMenu[]>([]);
27
- layout = input<"accordion"|"flat">();
28
- getMenuIsSelectedFn = input<(menu: SdMenu) => boolean>();
29
- ```
30
-
31
- - `menus` — 보통 `sdAppStructure.usableMenus()` 결과.
32
- - `layout` — `accordion`: 그룹 메뉴 펼침/접힘, `flat`: 상시 전개. 미지정 시 메뉴 ≤3 → `flat`, 초과 → `accordion`.
33
- - `getMenuIsSelectedFn` — 현재 선택 메뉴 판정 커스텀. 미지정 시 `fullPageCode === menu.codeChain.join(".")`.
34
-
35
- ## SdSidebarUser — `<sd-sidebar-user>`
36
-
37
- ```ts
38
- userMenu = input<SdSidebarUserMenu>();
39
-
40
- interface SdSidebarUserMenu {
41
- title: string;
42
- menus: { title: string; onClick: () => void }[];
43
- }
44
- ```
45
-
46
- - 사이드바 상단 사용자 정보 + 드롭다운 메뉴(로그아웃 등). `<ng-content>` 가 사용자 표시 영역(아바타·이름).
47
-
48
- ## SdTopbarContainer — `<sd-topbar-container>`
49
-
50
- - 탑바 + 본문 컨테이너. inputs 없음. 자식: `<sd-topbar>` + 본문.
51
-
52
- ## SdTopbar — `<sd-topbar>`
53
-
54
- ```ts
55
- sidebarContainer = input<SdSidebarContainer>();
56
- ```
57
-
58
- - 상단 바. 햄버거 버튼 클릭 시 사이드바 토글. `sidebarContainer` 명시 안 하면 ancestor inject 자동 탐색.
59
-
60
- ## SdTopbarMenu — `<sd-topbar-menu>`
61
-
62
- ```ts
63
- menus = input<SdMenu[]>([]);
64
- getMenuIsSelectedFn = input<(menu: SdMenu) => boolean>();
65
- ```
66
-
67
- - 탑바 가로 메뉴. 그룹 메뉴는 드롭다운 자동.
68
-
69
- ## SdTopbarUser — `<sd-topbar-user>`
70
-
71
- ```ts
72
- menus = input.required<SdTopbarUserMenu[]>();
73
-
74
- interface SdTopbarUserMenu { title: string; onClick: () => void }
75
- ```
76
-
77
- - 탑바 우측 사용자 드롭다운(아바타 → 메뉴). `<ng-content>` 가 트리거 표시 영역.
78
-
79
- ## 사용 예
80
-
81
- ```html
82
- <sd-sidebar-container>
83
- <sd-sidebar>
84
- <sd-sidebar-user [userMenu]="userMenu()">{{ user().name }}</sd-sidebar-user>
85
- <sd-sidebar-menu [menus]="appStructure.usableMenus()" />
86
- </sd-sidebar>
87
- <sd-topbar-container>
88
- <sd-topbar><h1>{{ viewTitle() }}</h1><sd-topbar-user [menus]="topbarMenus()" /></sd-topbar>
89
- <router-outlet />
90
- </sd-topbar-container>
91
- </sd-sidebar-container>
92
- ```
@@ -1,115 +0,0 @@
1
- # @simplysm/angular — modal
2
-
3
- `SdModalProvider.showAsync` 로 프로그래밍 호출, 또는 `<sd-modal>` 컴포넌트 직접 배치.
4
-
5
- ## SdModalProvider (root)
6
-
7
- ```ts
8
- modalCount: WritableSignal<number>;
9
- showAsync<T extends SdModalContentDef<any>>(modal: SdModalInfo<T>, options?: SdModalOptions): Promise<O|undefined>;
10
-
11
- interface SdModalContentDef<O> {
12
- initialized: Signal<boolean>;
13
- close: OutputEmitterRef<O|undefined>;
14
- actionTplRef?: TemplateRef<any>;
15
- readonly _optionalModalInputs?: string; // type-level marker, optional inputs 이름 union
16
- }
17
-
18
- interface SdModalInfo<T, X = ""> {
19
- title: string;
20
- type: Type<T>;
21
- inputs: ...; // T 의 InputSignal prop 들 (close/initialized 등 제외, _optionalModalInputs 마킹 prop 은 optional)
22
- }
23
-
24
- interface SdModalOptions {
25
- key?: string; hideHeader?: boolean; hideCloseButton?: boolean;
26
- headerStyle?: string;
27
- useCloseByBackdrop?: boolean; useCloseByEscapeKey?: boolean;
28
- float?: boolean; fill?: boolean;
29
- resizable?: boolean; movable?: boolean;
30
- position?: "bottom-right"|"top-right";
31
- minHeightPx?: number; minWidthPx?: number;
32
- heightPx?: number; widthPx?: number;
33
- noFirstControlFocusing?: boolean;
34
- }
35
- ```
36
-
37
- - `showAsync` — 컴포넌트 동적 생성·body 부착·열림 애니메이션·포커스 캡처. 컨텐츠 컴포넌트가 `close.emit(result)` 또는 배경/ESC/닫기버튼으로 `closeRequest` 발화하면 close 진행, Promise 가 result 로 resolve(취소는 undefined).
38
- - `modalCount` — 동시 열린 모달 수. 키보드 이벤트 핸들러 등에서 활용.
39
- - `SdModalContentDef.initialized` — 모달 컴포넌트가 자기 준비 끝났을 때 `true` 로 set. `SdPrintProvider` 등은 이걸 기다림(`SdModalProvider` 는 직접 사용 안 함).
40
- - `SdModalContentDef.actionTplRef` — 모달 헤더 우측 추가 액션 영역에 띄울 `TemplateRef`. set 하면 자동으로 `<sd-modal>` 의 `actionTplRef` 로 브릿지.
41
- - `_optionalModalInputs` — `SdModalInfo.inputs` 의 일부 prop 을 optional 로 만들 때 사용하는 type-level 마커(`= "fieldA" | "fieldB"`). 런타임 값 없음.
42
- - `SdModalOptions` 필드별:
43
- - `key` — 지정 시 `SdSystemConfigProvider` 키 `sd-modal.<key>` 로 width/height/left/top 자동 저장·복원.
44
- - `hideHeader`/`hideCloseButton` — 헤더 영역 전체/닫기 버튼만 숨김.
45
- - `headerStyle` — 헤더 인라인 style 문자열.
46
- - `useCloseByBackdrop`/`useCloseByEscapeKey` — 기본 true. false 면 배경 클릭/ESC 무시.
47
- - `float` — true 면 배경 어둡지 않고 그림자만(비차단 플로팅).
48
- - `fill` — true 면 전체 화면. 헤더 투명·테두리 없음.
49
- - `resizable` — true 면 8방향 리사이즈 핸들.
50
- - `movable` — true 면 헤더 드래그로 이동.
51
- - `position` — `bottom-right`/`top-right` 절대 배치. 미지정 = 상단 가운데.
52
- - `minWidthPx`/`minHeightPx`/`widthPx`/`heightPx` — 사이즈 제약·고정.
53
- - `noFirstControlFocusing` — true 면 첫 탭가능 요소가 아니라 dialog 박스 자체에 포커스.
54
-
55
- ```ts
56
- const result = await sdModal.showAsync({ title: "직원선택", type: EmpSelectModal, inputs: {} }, { resizable: true, key: "emp-select" });
57
- ```
58
-
59
- ## SdModal — `<sd-modal>`
60
-
61
- `SdModalProvider` 가 내부에서 사용. 직접 템플릿에 두려면:
62
-
63
- ```ts
64
- open = model(false); key = input<string|undefined>();
65
- title = input(""); hideHeader = input(false); hideCloseButton = input(false);
66
- headerStyle = input<string|undefined>();
67
- useCloseByBackdrop = input(true); useCloseByEscapeKey = input(true);
68
- float = input(false); fill = input(false);
69
- resizable = input(false); movable = input(false);
70
- position = input<"bottom-right"|"top-right"|undefined>();
71
- minHeightPx/minWidthPx/heightPx/widthPx = input<number|undefined>();
72
- actionTplRef = input<TemplateRef<any>|undefined>();
73
- closeRequest = output<void>();
74
- ```
75
-
76
- - 의미는 위 `SdModalOptions` 와 1:1. `closeRequest` 발화 시 부모가 `open.set(false)` 책임.
77
-
78
- ## SdActivatedModalProvider (inject inside modal content)
79
-
80
- ```ts
81
- modalComponent: WritableSignal<SdModal|undefined>;
82
- contentComponent: WritableSignal<T|undefined>;
83
- canDeactivateFn: () => boolean; // 닫기 차단 시 false 반환
84
- ```
85
-
86
- - 컨텐츠 컴포넌트 내부에서 `inject(SdActivatedModalProvider)` 로 자기 모달 참조 가져오기. `canDeactivateFn` 을 함수로 덮어쓰면 ESC/배경/닫기버튼이 false 시 닫힘 차단(저장 안된 변경 사항 보호 패턴).
87
- - `setupCanDeactivate(fn)` 헬퍼가 이걸 set 함 ([routing.md](./routing.md)).
88
-
89
- ## SdPromptModal / SdConfirmModal (사전 정의 컨텐츠)
90
-
91
- ```ts
92
- class SdPromptModal implements SdModalContentDef<string> { message = input.required<string>(); }
93
- class SdConfirmModal implements SdModalContentDef<boolean> { message = input.required<string>(); }
94
- ```
95
-
96
- - 확인 시 prompt 는 입력값, confirm 은 `true` emit. 취소는 둘 다 `undefined`.
97
-
98
- ```ts
99
- const input = await sdModal.showAsync({ title: "입력", type: SdPromptModal, inputs: { message: "이름?" } });
100
- const ok = await sdModal.showAsync({ title: "확인", type: SdConfirmModal, inputs: { message: "삭제할까요?" } });
101
- ```
102
-
103
- ## SelectModalOutputResult<TKey>
104
-
105
- ```ts
106
- interface SelectModalOutputResult<TKey = any> { selectedKeys: TKey[]; }
107
- ```
108
-
109
- - `SdModalSelectButton`/`SdSharedDataSelect*` 가 선택 모달을 호출할 때 모달이 emit 할 표준 출력 형태.
110
-
111
- ## 주의
112
-
113
- - 컨텐츠 컴포넌트가 `close.emit(value)` 를 호출해야 Promise 가 resolve. 닫기 버튼/ESC/배경 클릭은 `closeRequest` → `undefined` resolve.
114
- - 컨텐츠 안에 `<ng-template #actionTpl>...</ng-template>` 두고 컴포넌트 클래스에서 `actionTplRef = viewChild('actionTpl')` 한 뒤 set 하면 헤더 액션 영역 표시됨.
115
- - `resizable`/`movable`/`key` 조합 시 사용자 조정 사이즈·위치가 `sd-modal.<key>` 키로 `SdSystemConfigProvider` 에 저장됨.
@@ -1,107 +0,0 @@
1
- # @simplysm/angular — routing
2
-
3
- Angular Router 위에 페이지 코드(`a.b.c` 점 표기)·뷰 타입·새창 네비게이션 헬퍼.
4
-
5
- ## SdRouterLink — `[sdRouterLink]` (Directive)
6
-
7
- ```ts
8
- option = input<{
9
- link: string;
10
- params?: Record<string, string>;
11
- window?: { width?: number; height?: number }; // 새창 띄울 때 크기
12
- outletName?: string;
13
- queryParams?: Record<string, string>;
14
- } | undefined>(undefined, { alias: "sdRouterLink" });
15
- ```
16
-
17
- - click 처리. `Alt+click` 무시(브라우저 기본 다운로드 거동 보존). 새창 모드(`SdNavigateWindowProvider.isWindow=true` 또는 `Ctrl/Shift+click`)면 `window.open` 으로 새창 띄움. 일반 모드면 `Router.navigate`.
18
- - `link` — 라우터 경로. `window` 옵션 지정 시 width/height (기본 800x800) 으로 새창.
19
- - `outletName` — 보조 outlet 라우팅용. 미지정 시 primary.
20
- - `params`/`queryParams` — 라우터 매트릭스 파라미터/쿼리 파라미터.
21
-
22
- ```html
23
- <sd-anchor [sdRouterLink]="{ link: '/home/sales/invoice', params: { id: '1' } }">송장</sd-anchor>
24
- ```
25
-
26
- ## SdNavigateWindowProvider (root)
27
-
28
- ```ts
29
- get isWindow: boolean; // 현재 URL hash 의 ;window=true 여부
30
- open(navigate: string, params?: Record<string, string>, features?: string): void;
31
- ```
32
-
33
- - 현재 창이 simplysm 새창 모드인지 판단(`location.hash` 의 `;window=true`).
34
- - `open` — 새창이거나 `features` 가 주어지면 `window.open(... features)`. 일반 모드면 `_blank` 탭. 부모창 close 시 자식들도 일괄 종료.
35
-
36
- ## injectCurrentPageCodeSignal
37
-
38
- ```ts
39
- function injectCurrentPageCodeSignal(): Signal<string> | undefined
40
- ```
41
-
42
- - `ActivatedRoute.pathFromRoot.slice(2)` 의 url segments 를 `.` 으로 join. 라우터 컨텍스트 없으면 undefined.
43
- - 예: `/home/sales/invoice` → `"sales.invoice"`.
44
-
45
- ## injectFullPageCodeSignal
46
-
47
- ```ts
48
- function injectFullPageCodeSignal(): Signal<string>
49
- ```
50
-
51
- - `Router.events` 의 NavigationEnd → URL → segment 2개부터 `.` join. matrix/query 제거.
52
- - "전체 페이지 코드" 로 메뉴 선택 상태 판정에 사용.
53
-
54
- ## injectViewTitleSignal
55
-
56
- ```ts
57
- function injectViewTitleSignal(): Signal<string>
58
- ```
59
-
60
- - 모달 안이면 `SdActivatedModalProvider.modalComponent().title()`.
61
- - 그 외엔 `SdAppStructureProvider.getTitleByFullCode(currentPageCode ?? fullPageCode)`.
62
- - 페이지/모달 상단에 표시할 제목.
63
-
64
- ## injectViewTypeSignal
65
-
66
- ```ts
67
- function injectViewTypeSignal(): Signal<SdViewType>;
68
- type SdViewType = "page" | "modal" | "control";
69
- ```
70
-
71
- - `page`: 라우터 진입 페이지 컴포넌트, `modal`: 모달 컨텐츠, `control`: 그 외(다른 컴포넌트의 자식). 컴포넌트가 자기 컨텍스트별로 다르게 그릴 때.
72
-
73
- ## setupCanDeactivate
74
-
75
- ```ts
76
- function setupCanDeactivate(fn: () => boolean): void
77
- ```
78
-
79
- - 모달 안: `SdActivatedModalProvider.canDeactivateFn = fn` 으로 ESC/배경/닫기 차단.
80
- - 라우터 페이지: route config 에 `CanDeactivate` 가드 추가(컴포넌트 파괴 시 자동 제거).
81
- - 저장 안된 변경 사항 보호용.
82
-
83
- ```ts
84
- setupCanDeactivate(() => !isDirty() || confirm("변경 사항이 있습니다. 나가시겠습니까?"));
85
- ```
86
-
87
- ## getMenuRouterLinkOption
88
-
89
- ```ts
90
- function getMenuRouterLinkOption(menu: SdMenu): { link: string; queryParams: Record<string, string>|undefined } | undefined
91
- ```
92
-
93
- - leaf 메뉴(`children` 도 `url` 도 없음)만 결과 반환. 그룹/외부URL 메뉴는 undefined.
94
- - 반환 link 는 `/home/<codeChain join "/">`. 마지막 segment 에 `?key=val` 포함 시 분리해 queryParams 로.
95
-
96
- ## getIsMenuSelected
97
-
98
- ```ts
99
- function getIsMenuSelected(menu: SdMenu, fullPageCode: string|undefined, customFn?: (menu) => boolean): boolean
100
- ```
101
-
102
- - 커스텀 함수 있으면 그것 사용. 없으면 `fullPageCode === menu.codeChain.join(".")`.
103
-
104
- ## 주의
105
-
106
- - 페이지 코드는 `/home/` 다음의 segment 들 `.` join. 라우터를 이 컨벤션에 맞춰 설계해야 메뉴 선택 표시·뷰 타이틀 자동 동작.
107
- - `SdRouterLink` 의 `link` 는 라우터 절대경로 또는 상대경로. `link` 에 `?queryString` 직접 쓰지 말고 `queryParams` 객체로 분리.
@@ -1,35 +0,0 @@
1
- # @simplysm/angular — select-dropdown
2
-
3
- ## `<sd-dropdown>` / `<sd-dropdown-popup>`
4
-
5
- ```html
6
- <sd-dropdown [(open)]="open" [disabled]="false">
7
- trigger 컨텐츠
8
- <sd-dropdown-popup>팝업 컨텐츠</sd-dropdown-popup>
9
- </sd-dropdown>
10
- ```
11
-
12
- - `open` 시 popup을 body로 이동(트리거 위치 기준 배치). 모바일(`max-width:520px`)이면 backdrop+bottom sheet.
13
- - 트리거 클릭/Enter/ArrowDown 으로 open.
14
-
15
- ## `<sd-select<M extends "single"|"multi", T>>`
16
-
17
- ```html
18
- <sd-select [items]="items" [(value)]="value" [selectMode]="'single'" [trackByFn]="byId">
19
- <sd-select-item *ngFor="let it of items" [value]="it.id">{{ it.name }}</sd-select-item>
20
- </sd-select>
21
- ```
22
-
23
- `SelectModeValue<T> = { single: T; multi: T[] }`. value type = `SelectModeValue<T>[M]`.
24
-
25
- 주요 input: `selectMode`, `value` (model), `placeholder`, `disabled`, `inline`, `inset`, `size`, `required`, `hideSelectAll`, `multiSelectionDisplayDirection: "vertical"`, `items`, `trackByFn`, `getChildrenFn` (트리), `contentClass/Style`, `dropdownOpen` (model).
26
-
27
- `<ng-template #headerTpl>`, `<ng-template #beforeTpl>`, `<ng-template itemOf>` (`SdItemOfTemplate`) 으로 커스터마이즈.
28
-
29
- ## `<sd-select-item<T> [value]>`
30
-
31
- projected content 가 옵션 라벨.
32
-
33
- ## `<sd-select-button>`
34
-
35
- 검색 트리거 버튼만 노출하는 경량 select (내부 사용용).