@simplysm/sd-claude 14.0.42 → 14.0.44

package/claude/references/sd-simplysm14/angular/docs/directives.md

@@ -6,7 +6,7 @@
 
 ```typescript
 @Directive({
-  selector: `[click.capture], [scroll.passive], [sdResize], [sdSaveCommand], ...`,
+  selector: `[click.capture], [scroll.passive], ...`,
 })
 class SdEvents {
   // 클릭: click.capture, click.once, click.capture.once
@@ -19,11 +19,11 @@ class SdEvents {
   // 터치: touchstart.passive, touchstart.capture.passive, touchmove.passive, touchmove.capture.passive, touchend.passive
   // 드래그: dragover.capture, dragenter.capture, dragleave.capture, drop.capture
   // 애니메이션: transitionend.once, animationend.once
-  // 커스텀: sdResize (SdResizeEvent)
-  // 커맨드: sdRefreshCommand, sdSaveCommand, sdInsertCommand (KeyboardEvent)
 }
 ```
 
+> **NOTE:** `sdResize`, `sdSaveCommand`, `sdRefreshCommand`, `sdInsertCommand`는 `SdEvents`에서 분리되어 각각 `SdResizeDirective`, `SdIntersectionDirective`, `SdCommandDirective`로 독립 디렉티브로 제공된다.
+
 ## `SdRipple`
 
 호스트 요소에 리플 효과를 추가하는 디렉티브.
@@ -133,6 +133,77 @@ interface SdItemOfTemplateContext<TItem> {
 </ng-template>
 ```
 
+## `SdCommandDirective`
+
+키보드 단축키를 output 이벤트로 제공하는 디렉티브. `document` keydown을 감지하며, `shouldProcessCommandEvent()`로 최상위 모달만 이벤트 처리.
+
+```typescript
+@Directive({ selector: "[sdRefreshCommand],[sdSaveCommand],[sdInsertCommand]" })
+class SdCommandDirective {
+  sdRefreshCommand = output<KeyboardEvent>(); // Ctrl+Alt+L
+  sdSaveCommand = output<KeyboardEvent>();    // Ctrl+S
+  sdInsertCommand = output<KeyboardEvent>();  // Ctrl+Insert
+}
+```
+
+사용법: `<div (sdSaveCommand)="onSave($event)" (sdRefreshCommand)="onRefresh($event)">`
+
+## `SdResizeDirective`
+
+ResizeObserver 기반 resize output 이벤트 디렉티브. `requestAnimationFrame`으로 디바운스.
+
+```typescript
+@Directive({ selector: "[sdResize]" })
+class SdResizeDirective {
+  sdResize = output<SdResizeEvent>();
+}
+```
+
+사용법: `<div (sdResize)="onResize($event)">`
+
+## `SdResizeEvent`
+
+```typescript
+interface SdResizeEvent {
+  heightChanged: boolean;
+  widthChanged: boolean;
+  target: HTMLElement;
+  contentRect: DOMRectReadOnly;
+}
+```
+
+| Field | Type | Description |
+|-------|------|-------------|
+| `heightChanged` | `boolean` | 높이 변경 여부 |
+| `widthChanged` | `boolean` | 너비 변경 여부 |
+| `target` | `HTMLElement` | 대상 요소 |
+| `contentRect` | `DOMRectReadOnly` | 컨텐츠 영역 크기 |
+
+## `SdIntersectionDirective`
+
+IntersectionObserver 기반 intersection output 이벤트 디렉티브.
+
+```typescript
+@Directive({ selector: "[sdIntersection]" })
+class SdIntersectionDirective {
+  sdIntersection = output<SdIntersectionEvent>();
+}
+```
+
+사용법: `<div (sdIntersection)="onIntersect($event)">`
+
+## `SdIntersectionEvent`
+
+```typescript
+interface SdIntersectionEvent {
+  entry: IntersectionObserverEntry;
+}
+```
+
+| Field | Type | Description |
+|-------|------|-------------|
+| `entry` | `IntersectionObserverEntry` | 마지막 IntersectionObserver 엔트리 |
+
 ## `SdRouterLink`
 
 라우터 네비게이션 디렉티브. 일반 클릭은 라우터 네비게이션, Ctrl/Shift+클릭은 새 창, 팝업 윈도우에서는 팝업 형태로 열린다.

package/claude/references/sd-simplysm14/angular/docs/features.md

@@ -71,13 +71,19 @@ interface Address {
 
 ```typescript
 @Component({ selector: "sd-permission-table" })
-class SdPermissionTable {
-  permissions = input.required<SdPermission[]>();
-  permRecord = model<Record<string, boolean>>({});
+class SdPermissionTable<TModule = unknown> {
+  value = model<Record<string, boolean>>({});
+  items = input<SdPermission<TModule>[]>([]);
   disabled = input(false, { transform: booleanAttribute });
 }
 ```
 
+| Input | Type | Default | Description |
+|-------|------|---------|-------------|
+| `value` | `Record<string, boolean>` | `{}` | 권한 레코드 (two-way). 키는 `codeChain.join(".") + ".use"` 또는 `".edit"` 형태 |
+| `items` | `SdPermission<TModule>[]` | `[]` | 권한 트리 |
+| `disabled` | `boolean` | `false` | 비활성화 |
+
 ## Data View Abstractions
 
 ### `SdDataSheetBase`
@@ -250,6 +256,15 @@ abstract class SdDataSelectButtonBase<TItem extends object, TKey, TMode extends
 }
 ```
 
+| Input/Model | Type | Default | Description |
+|-------------|------|---------|-------------|
+| `value` | `SelectModeValue<TKey>[TMode]` | - | 선택된 값 (two-way) |
+| `disabled` | `boolean` | `false` | 비활성화 |
+| `required` | `boolean` | `false` | 필수 |
+| `inset` | `boolean` | `false` | 삽입 스타일 |
+| `size` | `"sm" \| "lg" \| undefined` | `undefined` | 크기 |
+| `selectMode` | `TMode` | `"single"` | 선택 모드 |
+
 ### `SdDataSelectButton`
 
 선택 버튼 presentation 컴포넌트.
@@ -267,15 +282,25 @@ class SdDataSelectButton { }
 
 ```typescript
 @Component({ selector: "sd-shared-data-select" })
-class SdSharedDataSelect<TItem extends SharedDataBase<string | number>, TMode extends keyof SelectModeValue<...>> {
+class SdSharedDataSelect<TItem extends SharedDataBase<string | number>, TMode extends keyof SelectModeValue<...>, TModal extends SdSelectModal<any>> {
+  value = model<SelectModeValue<TItem["__valueKey"] | undefined>[TMode]>();
   items = input.required<TItem[]>();
-  value = model<SelectModeValue<...>[TMode]>();
-  selectMode = input<TMode>("single" as TMode);
   disabled = input(false, { transform: booleanAttribute });
   required = input(false, { transform: booleanAttribute });
+  useUndefined = input(false, { transform: booleanAttribute });
   inset = input(false, { transform: booleanAttribute });
+  inline = input(false, { transform: booleanAttribute });
   size = input<"sm" | "lg">();
-  // 기타 옵션...
+  selectMode = input("single" as TMode);
+  filterFn = input<(item: TItem, index: number, ...params: any[]) => boolean>();
+  filterFnParams = input<any[]>();
+  modal = input<SdSelectModalInfo<TModal>>();
+  editModal = input<SdModalInfo<SdModalContentDef<boolean>>>();
+  selectClass = input<string>();
+  multiSelectionDisplayDirection = input<"vertical">();
+  getIsHiddenFn = input<(item: TItem, index: number) => boolean>();
+  getSearchTextFn = input<(item: TItem, index: number) => string>();
+  displayOrderKeyProp = input<string>();
 }
 ```
 
@@ -285,7 +310,10 @@ class SdSharedDataSelect<TItem extends SharedDataBase<string | number>, TMode ex
 
 ```typescript
 @Component({ selector: "sd-shared-data-select-button" })
-class SdSharedDataSelectButton<TItem extends SharedDataBase<...>, TMode extends keyof SelectModeValue<...>> { }
+class SdSharedDataSelectButton<TItem extends SharedDataBase<...>, TMode extends keyof SelectModeValue<...>, TModal extends SdSelectModal<any>> {
+  items = input<TItem[]>([]);
+  modal = input.required<SdSelectModalInfo<TModal>>();
+}
 ```
 
 ### `SdSharedDataSelectList`
@@ -294,15 +322,37 @@ class SdSharedDataSelectButton<TItem extends SharedDataBase<...>, TMode extends
 
 ```typescript
 @Component({ selector: "sd-shared-data-select-list" })
-class SdSharedDataSelectList<TItem extends SharedDataBase<...>> {
+class SdSharedDataSelectList<TItem extends SharedDataBase<string | number>, TModal extends SdSelectModal<any>> {
+  selectedItem = model<TItem>();
+  canChangeFn = input<(item: TItem | undefined) => boolean | Promise<boolean>>(() => true);
   items = input.required<TItem[]>();
-  value = model<(string | number)[]>();
-  disabled = input(false, { transform: booleanAttribute });
-  pageLength = input(30);
-  // 기타 옵션...
+  selectedIcon = input<string>();
+  useUndefined = input(false, { transform: booleanAttribute });
+  filterFn = input<(item: TItem, index: number) => boolean>();
+  modal = input<SdSelectModalInfo<TModal>>();
+  header = input<string>();
+  pageItemCount = input<number>();
 }
 ```
 
+| Input | Type | Default | Description |
+|-------|------|---------|-------------|
+| `selectedItem` | `TItem \| undefined` | - | 선택된 항목 (two-way) |
+| `canChangeFn` | `(item) => boolean \| Promise<boolean>` | `() => true` | 선택 변경 가능 여부 함수 |
+| `items` | `TItem[]` | required | 공유 데이터 항목 |
+| `selectedIcon` | `string \| undefined` | `undefined` | 선택됨 아이콘 |
+| `useUndefined` | `boolean` | `false` | undefined 항목 포함 |
+| `filterFn` | `((item, index) => boolean) \| undefined` | `undefined` | 필터 함수 |
+| `modal` | `SdSelectModalInfo<TModal> \| undefined` | `undefined` | 모달 선택 정보 |
+| `header` | `string \| undefined` | `undefined` | 헤더 텍스트 |
+| `pageItemCount` | `number \| undefined` | `undefined` | 페이지당 항목 수 |
+
+Content children:
+- `#headerTpl`: 헤더 커스텀 템플릿
+- `#filterTpl`: 필터 커스텀 템플릿
+- `SdItemOfTemplate`: 항목 커스텀 템플릿
+- `#undefinedTpl`: undefined 항목 커스텀 템플릿
+
 ### `matchesSearchText`
 
 공백 구분 AND 조건 텍스트 검색 매칭 함수.
@@ -323,7 +373,7 @@ function getOrmDataEditToastErrorMessage(err: unknown): string
 
 | 감지 조건 | 반환 메시지 |
 |-----------|-------------|
-| FK 제약 위반 (`a parent row: a foreign key constraint` 또는 `conflicted with the REFERENCE`) | `"경위! 연결된 작업에 의한 처리 거부. 후속작업 확인 요망"` |
+| FK 제약 위반 (`a parent row: a foreign key constraint` 또는 `conflicted with the REFERENCE`) | `"경고! 연결된 작업에 의한 처리 거부. 후속작업 확인 요망"` |
 | 그 외 | `err.message` (또는 `String(err)`) |
 
 `SdDataSheetBase`, `SdDataDetailBase` 내부에서 사용되며, 소비 코드에서 직접 사용할 수도 있다.

package/claude/references/sd-simplysm14/angular/docs/plugins.md

@@ -1,96 +1,8 @@
 # Plugins
 
-모든 플러그인은 `provideSdAngular()`에서 자동 등록된다. Angular의 `EventManagerPlugin`을 확장하여 커스텀 이벤트를 지원한다.
+Angular의 `EventManagerPlugin`을 확장하여 커스텀 이벤트 옵션을 지원한다. `provideSdAngular()`에서 `SdOptionEventPlugin`만 자동 등록된다.
 
-## Command Plugins
-
-커맨드 플러그인은 `document` 레벨에서 keydown을 감지하며, `findTopOpenModalEl()`로 최상위 모달만 이벤트를 수신한다.
-
-### `SdSaveCommandEventPlugin`
-
-Ctrl+S 키 조합 이벤트. 이벤트명: `sdSaveCommand`
-
-```typescript
-class SdSaveCommandEventPlugin extends EventManagerPlugin {
-  supports(eventName: string): boolean; // eventName === "sdSaveCommand"
-}
-```
-
-사용법: `<div (sdSaveCommand)="onSave($event)">`
-
-### `SdRefreshCommandEventPlugin`
-
-Ctrl+Alt+L 키 조합 이벤트. 이벤트명: `sdRefreshCommand`
-
-```typescript
-class SdRefreshCommandEventPlugin extends EventManagerPlugin {
-  supports(eventName: string): boolean; // eventName === "sdRefreshCommand"
-}
-```
-
-### `SdInsertCommandEventPlugin`
-
-Ctrl+Insert 키 조합 이벤트. 이벤트명: `sdInsertCommand`
-
-```typescript
-class SdInsertCommandEventPlugin extends EventManagerPlugin {
-  supports(eventName: string): boolean; // eventName === "sdInsertCommand"
-}
-```
-
-## Observer Plugins
-
-### `SdResizeEventPlugin`
-
-ResizeObserver 기반 이벤트. 이벤트명: `sdResize`. `requestAnimationFrame`으로 디바운스.
-
-```typescript
-class SdResizeEventPlugin extends EventManagerPlugin {
-  supports(eventName: string): boolean; // eventName === "sdResize"
-}
-```
-
-사용법: `<div (sdResize)="onResize($event)">`
-
-### `SdResizeEvent`
-
-```typescript
-interface SdResizeEvent {
-  heightChanged: boolean;
-  widthChanged: boolean;
-  target: Element;
-  contentRect: DOMRectReadOnly;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `heightChanged` | `boolean` | 높이 변경 여부 |
-| `widthChanged` | `boolean` | 너비 변경 여부 |
-| `target` | `Element` | 대상 요소 |
-| `contentRect` | `DOMRectReadOnly` | 컨텐츠 영역 크기 |
-
-### `SdIntersectionEventPlugin`
-
-IntersectionObserver 기반 이벤트. 이벤트명: `sdIntersection`
-
-```typescript
-class SdIntersectionEventPlugin extends EventManagerPlugin {
-  supports(eventName: string): boolean; // eventName === "sdIntersection"
-}
-```
-
-### `SdIntersectionEvent`
-
-```typescript
-interface SdIntersectionEvent {
-  entry: IntersectionObserverEntry;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `entry` | `IntersectionObserverEntry` | 마지막 IntersectionObserver 엔트리 |
+> **NOTE:** 이전 버전의 커맨드 플러그인(`sdSaveCommand`, `sdRefreshCommand`, `sdInsertCommand`)과 옵저버 플러그인(`sdResize`, `sdIntersection`)은 디렉티브로 대체되었다. 자세한 내용은 [directives.md](./directives.md)의 `SdCommandDirective`, `SdResizeDirective`, `SdIntersectionDirective` 항목을 참고한다.
 
 ## Option Plugin
 

package/claude/references/sd-simplysm14/angular/docs/providers.md

@@ -256,7 +256,7 @@ class SdNavigateWindowProvider {
 class SdActivatedModalProvider<T extends SdModalContentDef<any> = SdModalContentDef<any>> {
   modalComponent = signal<any>(undefined);
   contentComponent = signal<T | undefined>(undefined);
-  canDeactiveFn: () => boolean;
+  canDeactivateFn: () => boolean;
 }
 ```
 
@@ -264,7 +264,7 @@ class SdActivatedModalProvider<T extends SdModalContentDef<any> = SdModalContent
 |-------|------|-------------|
 | `modalComponent` | `WritableSignal<any>` | SdModal 인스턴스 |
 | `contentComponent` | `WritableSignal<T \| undefined>` | 컨텐츠 컴포넌트 인스턴스 |
-| `canDeactiveFn` | `() => boolean` | 모달 닫기 가능 여부 판별 함수 (기본: `() => true`) |
+| `canDeactivateFn` | `() => boolean` | 모달 닫기 가능 여부 판별 함수 (기본: `() => true`) |
 
 ## `SdToastProvider`
 

package/claude/references/sd-simplysm14/angular/docs/type-utilities.md

@@ -143,9 +143,8 @@ select mode별 value 타입 매핑. `SdSelect`에서 export됨.
 
 ```typescript
 type SelectModeValue<T> = {
-  single: T | undefined;
   multi: T[];
-  "multi-with-header": T[];
+  single: T;
 }
 ```
 

package/claude/references/sd-simplysm14/angular/docs/ui-data.md

@@ -45,53 +45,59 @@ class SdListItem {
 ```typescript
 @Component({ selector: "sd-sheet" })
 class SdSheet<T> {
-  items = input.required<T[]>();
-  currentPage = model(0);
+  key = input<string>();
+  items = input<T[]>([]);
+  trackByFn = input<(item: T, index: number) => unknown>();
+  selectMode = input<"single" | "multi">();
+  getItemSelectableFn = input<(item: T) => boolean | string>();
+  getChildrenFn = input<(item: T, index: number) => T[] | undefined>();
+  useAutoSort = input(false, { transform: booleanAttribute });
+  visiblePageCount = input(10);
   totalPageCount = input(0);
   itemsPerPage = input(0);
-  visiblePageCount = input(10);
-  useAutoSort = input(false, { transform: booleanAttribute });
   inset = input(false, { transform: booleanAttribute });
   hideConfigBar = input(false, { transform: booleanAttribute });
-  sorts = model<SortingDef[]>([]);
-  selectedItems = model<T[]>([]);
-  selectMode = input<"single" | "multi">();
-  expandedItems = model<T[]>([]);
-  getChildrenFn = input<(item: T, index: number) => T[] | undefined>();
-  getItemSelectableFn = input<(item: T) => boolean | string>();
-  configKey = input<string>();
-  trackByFn = input<(index: number, item: T) => any>();
 
   itemKeydown = output<SdSheetItemKeydownEventParam<T>>();
   cellKeydown = output<SdSheetCellKeydownEventParam<T>>();
+
+  selectedItems = model<T[]>([]);
+  expandedItems = model<T[]>([]);
+  sorts = model<SortingDef[]>([]);
+  currentPage = model(0);
 }
 ```
 
 | Input | Type | Default | Description |
 |-------|------|---------|-------------|
-| `items` | `T[]` | required | 표시할 항목 |
-| `currentPage` | `number` | `0` | 현재 페이지 (two-way) |
-| `totalPageCount` | `number` | `0` | 총 페이지 수 |
+| `key` | `string \| undefined` | `undefined` | 설정 저장 키 |
+| `items` | `T[]` | `[]` | 표시할 항목 |
+| `trackByFn` | `((item, index) => unknown) \| undefined` | `undefined` | 트랙킹 함수 |
+| `selectMode` | `"single" \| "multi" \| undefined` | `undefined` | 선택 모드 |
+| `getItemSelectableFn` | `((item) => boolean \| string) \| undefined` | `undefined` | 선택 가능 여부 함수. string은 비활성 사유 |
+| `getChildrenFn` | `((item, index) => T[] \| undefined) \| undefined` | `undefined` | 트리 구조 자식 반환 함수 |
 | `useAutoSort` | `boolean` | `false` | 클라이언트 측 자동 정렬 |
+| `visiblePageCount` | `number` | `10` | 한 번에 표시할 페이지 수 |
+| `totalPageCount` | `number` | `0` | 총 페이지 수 |
+| `itemsPerPage` | `number` | `0` | 페이지당 항목 수 |
 | `inset` | `boolean` | `false` | 삽입 스타일 |
 | `hideConfigBar` | `boolean` | `false` | 설정 바 숨김 |
+| `currentPage` | `number` | `0` | 현재 페이지 (two-way) |
 | `sorts` | `SortingDef[]` | `[]` | 정렬 설정 (two-way) |
 | `selectedItems` | `T[]` | `[]` | 선택된 항목 (two-way) |
-| `selectMode` | `"single" \| "multi" \| undefined` | - | 선택 모드 |
 | `expandedItems` | `T[]` | `[]` | 확장된 항목 (two-way) |
-| `getChildrenFn` | `((item, index) => T[] \| undefined) \| undefined` | - | 트리 구조 자식 반환 함수 |
-| `getItemSelectableFn` | `((item) => boolean \| string) \| undefined` | - | 선택 가능 여부 함수. string은 비활성 사유 |
-| `configKey` | `string \| undefined` | - | 설정 저장 키 |
 
 ### `SdSheetColumn`
 
-시트 컬럼 정의 디렉티브.
+시트 컬럼 정의 디렉티브. 컬럼의 헤더, 너비, 고정, 정렬 등을 설정한다. 셀 내용은 `SdSheetColumnCellTemplate`으로 정의한다.
 
 ```typescript
 @Directive({ selector: "sd-sheet-column" })
-class SdSheetColumn {
+class SdSheetColumn<T = unknown> {
   key = input.required<string>();
-  header = input<string | string[]>();
+  header = input<string | string[]>("");
+  headerStyle = input<string>();
+  tooltip = input<string>();
   width = input<string>();
   fixed = input(false, { transform: booleanAttribute });
   hidden = input(false, { transform: booleanAttribute });
@@ -99,13 +105,19 @@ class SdSheetColumn {
   disableSorting = input(false, { transform: booleanAttribute });
   disableResizing = input(false, { transform: booleanAttribute });
   ordering = input(0);
+
+  cellTplRef = contentChild.required(SdSheetColumnCellTemplate, { read: TemplateRef });
+  headerTplRef = contentChild<TemplateRef<void>>("headerTpl");
+  summaryTplRef = contentChild<TemplateRef<void>>("summaryTpl");
 }
 ```
 
 | Input | Type | Default | Description |
 |-------|------|---------|-------------|
 | `key` | `string` | required | 컬럼 식별 키 |
-| `header` | `string \| string[]` | - | 헤더 텍스트 (배열이면 멀티 행 헤더) |
+| `header` | `string \| string[]` | `""` | 헤더 텍스트 (배열이면 멀티 행 헤더) |
+| `headerStyle` | `string \| undefined` | - | 헤더 셀 인라인 스타일 |
+| `tooltip` | `string \| undefined` | - | 헤더 툴팁 텍스트 |
 | `width` | `string \| undefined` | - | 컬럼 너비 (예: `"100px"`) |
 | `fixed` | `boolean` | `false` | 고정 컬럼 |
 | `hidden` | `boolean` | `false` | 숨김 |
@@ -114,6 +126,58 @@ class SdSheetColumn {
 | `disableResizing` | `boolean` | `false` | 리사이즈 비활성화 |
 | `ordering` | `number` | `0` | 순서 (낮을수록 앞) |
 
+Content children:
+- `SdSheetColumnCellTemplate` (required): 셀 렌더링 템플릿
+- `#headerTpl`: 커스텀 헤더 템플릿
+- `#summaryTpl`: 요약 행 템플릿
+
+### `SdSheetColumnCellTemplate`
+
+시트 컬럼 셀 내용을 정의하는 디렉티브. `ng-template[cell]` 셀렉터를 사용하며, `SdSheetCellContext` 타입 가드를 제공한다.
+
+```typescript
+@Directive({ selector: "ng-template[cell]" })
+class SdSheetColumnCellTemplate<T> {
+  cell = input.required<T[]>();
+
+  static ngTemplateContextGuard<TContextItem>(
+    _dir: SdSheetColumnCellTemplate<TContextItem>,
+    _ctx: unknown,
+  ): _ctx is SdSheetCellContext<TContextItem>;
+}
+```
+
+사용법:
+```html
+<sd-sheet-column key="name" header="이름">
+  <ng-template [cell]="items()" let-item>
+    {{ item.name }}
+  </ng-template>
+</sd-sheet-column>
+```
+
+### `SdSheetCellContext`
+
+시트 셀 템플릿 컨텍스트.
+
+```typescript
+interface SdSheetCellContext<T = unknown> {
+  $implicit: T;
+  item: T;
+  index: number;
+  depth: number;
+  edit: boolean;
+}
+```
+
+| Field | Type | Description |
+|-------|------|-------------|
+| `$implicit` | `T` | 현재 항목 (let-item으로 접근) |
+| `item` | `T` | 현재 항목 (명시적 접근) |
+| `index` | `number` | 행 인덱스 |
+| `depth` | `number` | 트리 깊이 |
+| `edit` | `boolean` | 편집 모드 여부 (SdDataSheetColumn의 edit input에 의해 설정) |
+
 ### `SdSheetConfigModal`
 
 시트 설정 모달. 컬럼 표시/숨김, 고정, 너비 등을 설정한다.
@@ -134,6 +198,8 @@ class SdSheetConfigModal implements SdModalContentDef<SdSheetConfig> {
 interface SdSheetColumnDef {
   key: string;
   header: string | string[];
+  headerStyle: string | undefined;
+  tooltip: string | undefined;
   width: string | undefined;
   fixed: boolean;
   hidden: boolean;
@@ -144,6 +210,20 @@ interface SdSheetColumnDef {
 }
 ```
 
+| Field | Type | Description |
+|-------|------|-------------|
+| `key` | `string` | 컬럼 식별 키 |
+| `header` | `string \| string[]` | 헤더 텍스트 |
+| `headerStyle` | `string \| undefined` | 헤더 셀 인라인 스타일 |
+| `tooltip` | `string \| undefined` | 헤더 툴팁 텍스트 |
+| `width` | `string \| undefined` | 컬럼 너비 |
+| `fixed` | `boolean` | 고정 컬럼 여부 |
+| `hidden` | `boolean` | 숨김 여부 |
+| `collapse` | `boolean` | 접힘 여부 |
+| `disableSorting` | `boolean` | 정렬 비활성화 여부 |
+| `disableResizing` | `boolean` | 리사이즈 비활성화 여부 |
+| `ordering` | `number` | 순서 |
+
 ### `SdSheetConfig`
 
 ```typescript