@simplysm/angular 14.0.51 → 14.0.52

package/docs/ui-overlay/sd-toast.md

@@ -1,35 +0,0 @@
-# `SdToast`
-
-토스트 개별 항목 컴포넌트. `SdToastProvider`에 의해 프로그래밍 방식으로 생성된다.
-
-```typescript
-@Component({ selector: "sd-toast", ... })
-export class SdToast
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `open` | model | `boolean` | 열림 상태 (기본값: `false`) |
-| `useProgress` | input | `boolean` | 진행률 바 표시 (기본값: `false`) |
-| `theme` | input | `SdToastTheme` | 색상 테마 (기본값: `"info"`) |
-| `progress` | model | `number` | 진행률 (0~100, 기본값: `0`) |
-| `message` | model | `string \| undefined` | 메시지 텍스트 |
-
-직접 사용하는 대신 [`SdToastProvider`](../providers/sd-toast-provider.md)를 사용한다.
-
-## Related Types
-
-### `SdToastContainer`
-
-```typescript
-@Component({ selector: "sd-toast-container", ... })
-export class SdToastContainer
-```
-
-토스트 컨테이너. `SdToastProvider`에 의해 자동 생성된다.
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `overlap` | input | `boolean` | 중복 표시 방지 (기본값: `false`) |

package/docs/ui-visual/sd-barcode.md

@@ -1,36 +0,0 @@
-# `SdBarcode`
-
-바코드 생성 컴포넌트. bwip-js 라이브러리를 사용하여 SVG 바코드를 렌더링한다.
-
-```typescript
-@Component({ selector: "sd-barcode", ... })
-export class SdBarcode
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `type` | input (required) | `BarcodeType` | 바코드 종류 |
-| `value` | input | `string \| undefined` | 바코드에 인코딩할 텍스트 |
-
-## Related Types
-
-### `BarcodeType`
-
-bwip-js가 지원하는 바코드 형식 문자열 union type. 주요 값:
-
-- `"code128"` — Code 128
-- `"code39"` — Code 39
-- `"ean13"` — EAN-13
-- `"qrcode"` — QR Code
-- `"datamatrix"` — Data Matrix
-
-(전체 목록은 bwip-js 문서 참조)
-
-## Usage
-
-```html
-<sd-barcode [type]="'code128'" [value]="item.barcode" />
-<sd-barcode [type]="'qrcode'" [value]="item.qrUrl" />
-```

package/docs/ui-visual/sd-calendar.md

@@ -1,34 +0,0 @@
-# `SdCalendar`
-
-월별 달력 컴포넌트. `items`를 날짜 기준으로 분류하여 각 날짜 셀에 표시한다.
-
-```typescript
-@Component({ selector: "sd-calendar", ... })
-export class SdCalendar<T>
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `items` | input (required) | `T[]` | 표시할 항목 배열 |
-| `getItemDateFn` | input (required) | `(item: T, index: number) => DateOnly` | 각 항목의 날짜를 반환하는 함수 |
-| `yearMonth` | input | `DateOnly` | 표시할 연월 (기본값: 현재 월의 1일) |
-| `weekStartDay` | input | `number` | 주 시작 요일 (0=일, 1=월, 기본값: `0`) |
-| `minDaysInFirstWeek` | input | `number` | 첫 주 최소 날짜 수 (기본값: `1`) |
-
-콘텐츠 템플릿: `ng-template[itemOf]`로 날짜별 항목을 렌더링한다 (`SdItemOfTemplateContext<T>` 타입).
-
-## Usage
-
-```html
-<sd-calendar
-  [items]="schedules()"
-  [getItemDateFn]="getScheduleDate"
-  [(yearMonth)]="currentMonth"
->
-  <ng-template itemOf let-item>
-    <div class="tx-sm">{{ item.title }}</div>
-  </ng-template>
-</sd-calendar>
-```

package/docs/ui-visual/sd-echarts.md

@@ -1,32 +0,0 @@
-# `SdEcharts`
-
-Apache ECharts 차트 래퍼 컴포넌트. 호스트 요소의 크기 변경을 감지하여 자동으로 차트를 리사이즈한다.
-
-```typescript
-@Component({ selector: "sd-echarts", ... })
-export class SdEcharts
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `option` | input (required) | `echarts.EChartsOption` | ECharts 옵션 객체 |
-| `notMerge` | input | `boolean` | `setOption` 호출 시 전체 교체 여부 (기본값: `false`) |
-| `loading` | input | `boolean` | 로딩 오버레이 표시 (기본값: `false`) |
-
-SVG 렌더러를 사용하며 (`renderer: "svg"`), `afterNextRender`에서 초기화된다.
-
-## Usage
-
-```html
-<sd-echarts [option]="chartOption()" style="height: 300px" />
-```
-
-```typescript
-chartOption = computed<echarts.EChartsOption>(() => ({
-  xAxis: { type: "category", data: this.labels() },
-  yAxis: { type: "value" },
-  series: [{ type: "bar", data: this.values() }],
-}));
-```

package/docs/ui-visual/sd-label.md

@@ -1,24 +0,0 @@
-# `SdLabel`
-
-인라인 라벨 컴포넌트. 테마 색상 또는 커스텀 배경색을 적용한다.
-
-```typescript
-@Component({ selector: "sd-label", ... })
-export class SdLabel
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `theme` | input | `"primary" \| "secondary" \| "info" \| "success" \| "warning" \| "danger" \| "gray" \| "blue-gray" \| undefined` | 색상 테마 (미지정 시 `gray-darker`) |
-| `color` | input | `string \| undefined` | 커스텀 배경색 (CSS 색상값) |
-| `clickable` | input | `boolean` | 클릭 가능 여부 (기본값: `false`) |
-
-## Usage
-
-```html
-<sd-label [theme]="'success'">완료</sd-label>
-<sd-label [theme]="'danger'">오류</sd-label>
-<sd-label [color]="'#ff6600'">커스텀</sd-label>
-```

package/docs/ui-visual/sd-note.md

@@ -1,23 +0,0 @@
-# `SdNote`
-
-알림 메시지 블록 컴포넌트. 배경 색상으로 중요도를 표현한다.
-
-```typescript
-@Component({ selector: "sd-note", ... })
-export class SdNote
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `theme` | input | `"primary" \| "secondary" \| "info" \| "success" \| "warning" \| "danger" \| "gray" \| "blue-gray" \| undefined` | 색상 테마 |
-| `size` | input | `"sm" \| "lg" \| undefined` | 크기 |
-| `inset` | input | `boolean` | 인셋 스타일 (기본값: `false`) |
-
-## Usage
-
-```html
-<sd-note [theme]="'warning'">저장하지 않은 변경사항이 있습니다.</sd-note>
-<sd-note [theme]="'info'">Ctrl+S로 저장할 수 있습니다.</sd-note>
-```

package/docs/ui-visual/sd-progress.md

@@ -1,23 +0,0 @@
-# `SdProgress`
-
-진행률 바 컴포넌트. `value`(0~1 범위)에 따라 바 너비를 계산하고 퍼센트를 표시한다.
-
-```typescript
-@Component({ selector: "sd-progress", ... })
-export class SdProgress
-```
-
-## Members
-
-| Member | Kind | Type | Description |
-|--------|------|------|-------------|
-| `value` | input (required) | `number` | 진행률 (0~1 범위) |
-| `theme` | input (required) | `"primary" \| "secondary" \| "info" \| "success" \| "warning" \| "danger" \| "gray" \| "blue-gray"` | 색상 테마 |
-| `inset` | input | `boolean` | 인셋 스타일 (기본값: `false`) |
-| `size` | input | `"sm" \| "lg" \| undefined` | 크기 |
-
-## Usage
-
-```html
-<sd-progress [value]="progress() / 100" [theme]="'primary'" />
-```

package/docs/utils/inject-routing-signals.md

@@ -1,161 +0,0 @@
-# 라우팅 Signal 함수들
-
-라우터 상태를 signal로 반환하는 inject 함수 모음. 생성자/필드 이니셜라이저에서 호출한다.
-
-## `injectCurrentPageCodeSignal`
-
-현재 활성 라우트의 경로 세그먼트를 `.`으로 연결한 코드 signal. `ActivatedRoute`가 없으면 undefined 반환.
-
-```typescript
-function injectCurrentPageCodeSignal(): Signal<string> | undefined
-```
-
-### 사용 패턴
-
-`injectViewTypeSignal()`과 `injectViewTitleSignal()` 내부에서 사용된다. 일반적으로 직접 사용할 필요 없이 `injectViewTitleSignal()`을 사용하면 된다.
-
-## `injectFullPageCodeSignal`
-
-전체 URL 기반 페이지 코드 signal. `NavigationEnd` 이벤트를 구독하여 URL에서 코드를 추출한다.
-
-```typescript
-function injectFullPageCodeSignal(): Signal<string>
-```
-
-### 사용 패턴
-
-`injectViewTypeSignal()`과 `injectViewTitleSignal()` 내부에서 사용된다. 일반적으로 직접 사용할 필요 없이 `injectViewTitleSignal()`을 사용하면 된다.
-
-## `injectViewTitleSignal`
-
-현재 뷰의 타이틀 signal. 모달이면 모달 타이틀, 페이지이면 `SdAppStructureProvider`에서 조회.
-
-```typescript
-function injectViewTitleSignal(): Signal<string>
-```
-
-### 사용 패턴
-
-```typescript
-protected readonly viewTitle = injectViewTitleSignal();
-```
-
-```html
-<sd-topbar>
-  <h4>{{ viewTitle() }}</h4>
-</sd-topbar>
-```
-
-**실사용 예:**
-- [crud-list.md §3 최소 뼈대](../recipes/crud-list.md#3-최소-뼈대-조회-전용-page) — topbar 제목
-- [crud-detail.md §3 최소 뼈대](../recipes/crud-detail.md#3-최소-뼈대-읽기-전용-상세-폼) — topbar 제목
-
-## `injectViewTypeSignal`
-
-현재 뷰의 타입 signal. 모달/페이지/컨트롤 중 하나를 반환한다.
-
-```typescript
-function injectViewTypeSignal(): Signal<SdViewType>
-```
-
-### 내부 판정 로직
-
-- `SdActivatedModalProvider`가 inject되면 `"modal"`
-- `ActivatedRoute.component`의 `reflectComponentType().selector`가 호스트 tagName과 일치하고 `fullPageCode() === currPageCode?.()`이면 `"page"`
-- 그 외 `"control"`
-
-### 호출 시점 제약
-
-Angular `inject()`는 injection context(생성자 실행 중 또는 필드 초기화 시점) 안에서만 유효하므로, `computed` 콜백이나 `effect` 안에서 호출하면 **`NG0203` 런타임 에러**가 발생한다.
-
-```typescript
-// OK — 필드 이니셜라이저
-protected readonly viewType = injectViewTypeSignal();
-
-// NG0203 — computed 내부
-protected readonly viewType = computed(() => injectViewTypeSignal()());
-```
-
-### 수동 오버라이드 패턴
-
-일반적으로 자동 판정으로 충분하다. 수동 오버라이드가 필요한 특수 상황(예: 특정 페이지 안에 자기 자신을 모달처럼 보이게 하고 싶은 경우)에는:
-
-```typescript
-override = input<SdViewType>();
-private readonly _autoViewType = injectViewTypeSignal();
-protected readonly viewType = computed(() => this.override() ?? this._autoViewType());
-```
-
-> 이 오버라이드는 추상화 복원을 부추기므로 **기본은 자동 판정으로 쓰기**를 권장한다. 상세: [page-modal-container.md §5 뷰 타입 결정](../recipes/page-modal-container.md#5-뷰-타입-결정)
-
-**실사용 예:**
-- [crud-list.md §3 최소 뼈대](../recipes/crud-list.md#3-최소-뼈대-조회-전용-page) — 뷰 타입 기반 topbar 조건부 렌더
-- [crud-list.md §8 확장 D: 선택 모달 전환](../recipes/crud-list.md#8-확장-d-선택-모달-전환) — modal 뷰 분기
-- [crud-detail.md §7 확장 C: modal 뷰](../recipes/crud-detail.md#7-확장-c-modal-뷰) — modal 뷰 분기
-- [crud-detail.md §8 확장 D: control 뷰](../recipes/crud-detail.md#8-확장-d-control-뷰) — control 뷰 분기
-- [page-modal-container.md §5 뷰 타입 결정](../recipes/page-modal-container.md#5-뷰-타입-결정) — 판정 규칙 + 수동 오버라이드
-
-## `injectPermsSignal`
-
-앱 구조(`SdAppStructureProvider`)에서 지정된 뷰 코드와 키 배열에 대한 권한을 조회하는 signal. 생성자/필드 이니셜라이저에서 호출한다.
-
-```typescript
-function injectPermsSignal<K extends string>(viewCodes: string[], keys: K[]): Signal<K[]>
-```
-
-| Parameter | Type | Description |
-|-----------|------|-------------|
-| `viewCodes` | `string[]` | 조회할 뷰 코드 배열 (예: `["sales.customer"]`) |
-| `keys` | `K[]` | 권한 키 배열 (예: `["use", "edit"]`) |
-| **반환** | `Signal<K[]>` | 현재 사용자가 보유한 권한 키 배열 |
-
-### 사용 패턴
-
-```typescript
-protected readonly perms = injectPermsSignal(["{도메인}.{viewCode}"], ["use", "edit"]);
-protected readonly canEdit = computed(() => this.perms().includes("edit"));
-```
-
-```html
-@if (!perms().includes("use")) {
-  <div class="fill tx-theme-gray-light p-xxl tx-center">
-    <br />
-    <ng-icon [svg]="tablerAlertTriangle" [size]="'5em'" />
-    <br />
-    <br />
-    '{{ viewTitle() }}'에 대한 사용권한이 없습니다. 시스템 관리자에게 문의하세요.
-  </div>
-}
-```
-
-**실사용 예:**
-- [crud-list.md §3 최소 뼈대](../recipes/crud-list.md#3-최소-뼈대-조회-전용-page) — 권한 기반 조건부 렌더
-- [crud-detail.md §3 최소 뼈대](../recipes/crud-detail.md#3-최소-뼈대-읽기-전용-상세-폼) — 권한 기반 조건부 렌더
-
-## `getMenuRouterLinkOption`
-
-메뉴에서 라우터 링크 옵션을 추출한다.
-
-```typescript
-function getMenuRouterLinkOption(
-  menu: SdMenu,
-): { link: string; queryParams: Record<string, string> | undefined } | undefined
-```
-
-## `getIsMenuSelected`
-
-메뉴가 현재 선택된 상태인지 확인한다.
-
-```typescript
-function getIsMenuSelected(
-  menu: SdMenu,
-  fullPageCode: string | undefined,
-  customFn?: (menu: SdMenu) => boolean,
-): boolean
-```
-
-| Parameter | Type | Description |
-|-----------|------|-------------|
-| `menu` | `SdMenu` | 메뉴 항목 |
-| `fullPageCode` | `string \| undefined` | 현재 페이지 코드 |
-| `customFn` | `((menu) => boolean) \| undefined` | 커스텀 비교 함수 |

package/docs/utils/inject-sd-system-config-resource.md

@@ -1,35 +0,0 @@
-# `injectSdSystemConfigResource`
-
-컴포넌트 태그명 기반 키로 시스템 설정을 읽고 쓰는 resource 래퍼. 생성자에서 호출한다.
-
-```typescript
-function injectSdSystemConfigResource<T>(options: {
-  key: Signal<string | undefined>;
-}): {
-  value: Signal<T | undefined>;
-  isLoading: Signal<boolean>;
-  status: Signal<ResourceStatus>;
-  hasValue: () => boolean;
-  reload: () => void;
-  set(value: T | undefined): void;
-  update(fn: (prev: T | undefined) => T | undefined): void;
-}
-```
-
-## Parameters
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `options.key` | `Signal<string \| undefined>` | 설정 키 signal. undefined이면 로딩 안 함 |
-
-## Returns
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `value` | `Signal<T \| undefined>` | 설정 값 signal |
-| `isLoading` | `Signal<boolean>` | 로딩 중 여부 |
-| `status` | `Signal<ResourceStatus>` | resource 상태 |
-| `hasValue()` | `() => boolean` | 값 존재 여부 |
-| `reload()` | `() => void` | 강제 재로딩 |
-| `set(value)` | `(T \| undefined) => void` | 값 설정 + 즉시 signal 업데이트 + 비동기 영속화 |
-| `update(fn)` | `((prev) => T \| undefined) => void` | 값 업데이트 + 즉시 signal 업데이트 + 비동기 영속화 |

package/docs/utils/mark.md

@@ -1,43 +0,0 @@
-# `mark`
-
-WritableSignal의 변경 알림을 수동으로 트리거한다. 배열/객체의 내부 변경(mutation) 후 consumer에게 변경을 알릴 때 사용. shallow copy로 새 참조를 생성하여 signal을 업데이트한다.
-
-```typescript
-function mark(sig: WritableSignal<any>): void
-```
-
-## Parameters
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `sig` | `WritableSignal<any>` | 대상 signal. 배열이면 `[...v]`, 객체이면 `{...v}`로 shallow copy하여 update |
-
-## 역할
-
-- **OnPush 템플릿 재렌더링**: shallow copy로 새 참조를 생성하여 Angular의 변경 감지를 트리거한다
-- **computed/effect 의존성 갱신**: signal 참조가 갱신되어 의존하는 computed·effect가 재실행된다
-
-## Usage
-
-```typescript
-// 배열 내부 mutation 후 mark → UI 갱신
-items()[0].name = "new";
-mark(items);  // items signal이 [...items()] 로 갱신됨
-
-// 객체 내부 mutation 후 mark → effect 재실행
-filter().searchText = "abc";
-mark(filter);  // filter signal이 {...filter()} 로 갱신됨
-```
-
-## 주의사항
-
-> **"저장 감지"가 아니다.** `obj.equal`이 deep equal로 snapshot과 현재 값을 비교하므로, `item.name = "new"` 같은 mutation은 `mark` 없이도 `diffs()` / `onSubmit()`의 snapshot 비교에서 감지된다.
-
-- Chrome 61 호환성(`Proxy` 폴리필 불가)으로 signal 자동 notify가 불가하여 명시적 `mark` 호출이 필요
-- `mark`는 **UI에 변경을 반영**하기 위한 것이지, 데이터 변경 자체를 감지하는 메커니즘이 아니다
-
-**실사용 예:**
-- [crud-list.md §5 확장 A: inline 편집/저장](../recipes/crud-list.md#5-확장-a-inline-편집저장) — items 배열 mutation 후 mark
-- [crud-list.md §6 확장 B: 선택 기능](../recipes/crud-list.md#6-확장-b-선택-기능--선택-삭제복구) — selectedItems 변경 후 mark
-- [crud-detail.md §5 확장 A: 편집/저장](../recipes/crud-detail.md#5-확장-a-편집저장) — data 객체 mutation 후 mark
-- [crud-detail.md §10 확장 F: 복합 상세](../recipes/crud-detail.md#10-확장-f-복합-상세-내부-sd-sheet) — 하위 컬렉션 mutation 후 mark

package/docs/utils/selection-managers.md

@@ -1,96 +0,0 @@
-# Selection Managers
-
-선택/정렬/트리 확장을 관리하는 composable 함수 모음. `inject()` 없이 Signal 입력만으로 동작한다.
-
-## `useSelectionManager`
-
-선택 관리 composable. single/multi 모드를 지원한다. `trackByFn`이 반환하는 key를 기준으로 `obj.equal`(deep equal) 비교를 수행하므로, 같은 key의 다른 reference item도 `isSelected` true로 복원된다.
-
-```typescript
-function useSelectionManager<T>(options: {
-  displayItems: Signal<T[]>;
-  selectedItems: WritableSignal<T[]>;
-  selectMode: Signal<"single" | "multi" | undefined>;
-  getItemSelectableFn: Signal<((item: T) => boolean | string) | undefined>;
-  trackByFn: Signal<(item: T, index: number) => unknown>;
-}): {
-  hasSelectable: Signal<boolean>;
-  isAllSelected: Signal<boolean>;
-  getSelectable(item: T): true | string | undefined;
-  getCanChangeFn(item: T): () => boolean;
-  select(item: T): void;
-  deselect(item: T): void;
-  toggle(item: T): void;
-  toggleAll(): void;
-  isSelected(item: T): boolean;
-}
-```
-
-### Returns
-
-| Return | Type | Description |
-|--------|------|-------------|
-| `hasSelectable` | `Signal<boolean>` | selectMode가 설정되어 있는지 여부 |
-| `isAllSelected` | `Signal<boolean>` | 모든 선택 가능 항목이 선택되었는지 |
-| `getSelectable(item)` | `true \| string \| undefined` | 선택 가능 여부. string은 불가 사유 |
-| `getCanChangeFn(item)` | `() => boolean` | 선택 변경 가능 여부 함수 |
-| `select(item)` | `void` | 항목 선택 (single이면 교체) |
-| `deselect(item)` | `void` | 항목 선택 해제 |
-| `toggle(item)` | `void` | 항목 토글 |
-| `toggleAll()` | `void` | 전체 선택/해제 토글 |
-| `isSelected(item)` | `boolean` | 선택 여부 |
-
-## `useSortingManager`
-
-정렬 관리 composable.
-
-```typescript
-function useSortingManager(options: {
-  sorts: WritableSignal<SortingDef[]>;
-}): {
-  defMap: Signal<Map<string, { indexText?: string; desc: boolean }>>;
-  toggle(key: string, multiple: boolean): void;
-  sort<T>(items: T[]): T[];
-}
-```
-
-### Returns
-
-| Return | Type | Description |
-|--------|------|-------------|
-| `defMap` | `Signal<Map<string, ...>>` | 키별 정렬 정의 (인덱스 텍스트, 방향) |
-| `toggle(key, multiple)` | `void` | 정렬 토글. `multiple=true`면 멀티 소트, `false`면 단일 소트. 3단계: asc → desc → 없음 |
-| `sort(items)` | `T[]` | 정렬 적용. 원본 배열은 변경하지 않음 |
-
-## `useExpandingManager`
-
-트리 확장/축소 관리 composable.
-
-```typescript
-function useExpandingManager<T>(binding: {
-  items: Signal<T[]>;
-  expandedItems: WritableSignal<T[]>;
-  getChildrenFn: Signal<((item: T, index: number) => T[] | undefined) | undefined>;
-  sort: (items: T[]) => T[];
-}): {
-  displayItems: Signal<T[]>;
-  hasExpandable: Signal<boolean>;
-  isAllExpanded: Signal<boolean>;
-  toggle(item: T): void;
-  toggleAll(): void;
-  isVisible(item: T): boolean;
-  def(item: T): ExpandItemDef<T>;
-}
-```
-
-### Returns
-
-| Return | Type | Description |
-|--------|------|-------------|
-| `displayItems` | `Signal<T[]>` | 트리를 평탄화한 전체 항목 (숨김 포함) |
-| `hasExpandable` | `Signal<boolean>` | 확장 가능한 항목 존재 여부 |
-| `isAllExpanded` | `Signal<boolean>` | 모든 확장 가능 항목이 펼쳐졌는지 |
-| `toggle(item)` | `void` | 항목 확장/축소 토글 |
-| `toggleAll()` | `void` | 전체 확장/축소 토글 |
-| `isVisible(item)` | `boolean` | 부모 체인이 모두 펼쳐져 항목이 보이는지 |
-| `def(item)` | `ExpandItemDef<T>` | 항목의 트리 정의 |

package/docs/utils/set-safe-style.md

@@ -1,19 +0,0 @@
-# `setSafeStyle`
-
-Renderer2를 사용하여 여러 CSS 스타일을 일괄 적용한다.
-
-```typescript
-function setSafeStyle(
-  renderer: Renderer2,
-  el: HTMLElement,
-  style: Partial<CSSStyleDeclaration>,
-): void
-```
-
-## Parameters
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `renderer` | `Renderer2` | Angular Renderer2 인스턴스 |
-| `el` | `HTMLElement` | 스타일 적용 대상 요소 |
-| `style` | `Partial<CSSStyleDeclaration>` | 적용할 CSS 스타일 객체 |

package/docs/utils/setup-functions.md

@@ -1,93 +0,0 @@
-# Setup Functions
-
-생성자에서 호출하는 설정 함수들. `inject()`, `effect()`, `DestroyRef.onDestroy()`를 사용하여 수명주기를 관리한다.
-
-## `setupBgTheme`
-
-body 배경 테마 색상을 설정한다. 파괴 시 자동 복원.
-
-```typescript
-function setupBgTheme(options?: {
-  theme?: "primary" | "secondary" | "info" | "success" | "warning" | "danger" | "gray" | "blue-gray";
-  lightness?: "lightest" | "lighter";
-}): void
-```
-
-## `setupRipple`
-
-호스트 요소에 리플 효과를 설정한다. pointer 이벤트 기반.
-
-```typescript
-function setupRipple(enableFn?: () => boolean): void
-```
-
-## `setupRevealOnShow`
-
-뷰포트 진입 시 reveal 애니메이션을 설정한다. IntersectionObserver 사용.
-
-```typescript
-function setupRevealOnShow(optFn?: () => {
-  type?: "l2r" | "t2b";
-  enabled?: boolean;
-}): void
-```
-
-## `setupInvalid`
-
-유효성 검증 표시기를 설정한다. 빨간 점 indicator + hidden input으로 구현.
-
-```typescript
-function setupInvalid(getInvalidMessage: () => string): void
-```
-
-빈 문자열이면 유효, 비어있지 않으면 무효.
-
-## `setupModelHook`
-
-model signal의 `set`/`update`를 가드 함수로 래핑한다. 가드 함수가 `false`를 반환하면 값 변경을 차단.
-
-```typescript
-function setupModelHook<T, S extends WritableSignal<T>>(
-  model: S,
-  canFn: Signal<(item: T) => boolean | Promise<boolean>>,
-): void
-```
-
-## `setupCanDeactivate`
-
-모달 또는 라우트에 canDeactivate 가드를 설정한다.
-
-```typescript
-function setupCanDeactivate(fn: () => boolean): void
-```
-
-- 모달 내부이면 `SdActivatedModalProvider.canDeactivateFn`에 설정
-- 라우트 내부이면 `routeConfig.canDeactivate`에 추가
-- control 뷰에서는 라우트도 모달도 아니므로 아무 동작 하지 않음
-
-### 사용 패턴
-
-#### 기본 패턴 (편집 이탈 방지)
-
-```typescript
-setupCanDeactivate(() => this._checkIgnoreChanges());
-```
-
-`_checkIgnoreChanges()`가 `false`를 반환하면 이탈이 차단된다 (confirm 대화상자로 사용자 확인).
-
-#### 뷰 타입별 분기 패턴
-
-modal 뷰를 추가 지원할 때, 모달에서는 취소 버튼으로 제어하므로 항상 이탈을 허용한다:
-
-```typescript
-setupCanDeactivate(() => this.viewType() === "modal" || this._checkIgnoreChanges());
-```
-
-- **모달 뷰**: `true` → 항상 이탈 허용 (모달 자체 취소 버튼으로 제어)
-- **페이지 뷰**: `_checkIgnoreChanges()` → confirm 결과로 제어
-- **control 뷰**: setupCanDeactivate 내부에서 아무 동작 하지 않음 (라우트도 모달도 아님)
-
-**실사용 예:**
-- [crud-list.md §5 확장 A: inline 편집/저장](../recipes/crud-list.md#5-확장-a-inline-편집저장) — 기본 패턴
-- [crud-detail.md §5 확장 A: 편집/저장](../recipes/crud-detail.md#5-확장-a-편집저장) — 기본 패턴
-- [crud-detail.md §7 확장 C: modal 뷰](../recipes/crud-detail.md#7-확장-c-modal-뷰) — 뷰 타입별 분기 패턴