@simplysm/angular 14.0.51 → 14.0.53

package/docs/styling/classes.md

@@ -1,149 +0,0 @@
-# CSS Classes
-
-전역 유틸리티 CSS 클래스. `@layer base, theme-variant, utilities` 순서로 구성되며, 유틸리티 클래스는 `@layer utilities`에 정의된다.
-
-## Layout
-
-### Flex
-
-| Class | Description |
-|-------|-------------|
-| `.flex-row` | `display: flex; flex-direction: row` (기본 gap 없음) |
-| `.flex-column` | `display: flex; flex-direction: column` (기본 gap 없음) |
-| `.flex-row-inline` | `display: inline-flex; flex-direction: row` |
-| `.flex-column-inline` | `display: inline-flex; flex-direction: column` |
-| `.flex-fill` | `flex: 1 1 auto; overflow: auto` |
-| `.flex-auto` | `flex: 1 0 auto` |
-| `.flex-min` | `flex: 0 0 0` |
-
-### Grid
-
-| Class | Description |
-|-------|-------------|
-| `.grid` | `display: grid; grid-template-columns: repeat(12, 1fr)` |
-| `.grid-{1..12}` | `grid-column-end: span {n}` |
-| `.grid-sm-{1..12}` | `@media (max-width: 1280px)` 반응형 |
-| `.grid-xs-{1..12}` | `@media (max-width: 1024px)` 반응형 |
-| `.grid-xxs-{1..12}` | `@media (max-width: 800px)` 반응형 |
-
-### Alignment
-
-| Class | Description |
-|-------|-------------|
-| `.main-align-start` | `justify-content: start` |
-| `.main-align-end` | `justify-content: end` |
-| `.main-align-center` | `justify-content: center` |
-| `.cross-align-start` | `align-items: start` |
-| `.cross-align-end` | `align-items: end` |
-| `.cross-align-center` | `align-items: center` |
-
-## Spacing
-
-gap 키: `xxs`, `xs`, `sm`, `default`, `lg`, `xl`, `xxl`, `0`, `auto`
-
-| Pattern | Description |
-|---------|-------------|
-| `.p-{key}` | 전체 padding |
-| `.pv-{key}` | 수직 padding (top + bottom) |
-| `.ph-{key}` | 수평 padding (left + right) |
-| `.pt-{key}`, `.pr-{key}`, `.pb-{key}`, `.pl-{key}` | 방향별 padding |
-| `.m-{key}` | 전체 margin |
-| `.mv-{key}` | 수직 margin |
-| `.mh-{key}` | 수평 margin |
-| `.mt-{key}`, `.mr-{key}`, `.mb-{key}`, `.ml-{key}` | 방향별 margin |
-| `.gap-{key}` | flex/grid gap |
-| `.sw-{key}` | width |
-| `.sh-{key}` | height |
-| `.p-{key}-{key}` | padding: vertical horizontal |
-| `.m-{key}-{key}` | margin: vertical horizontal |
-| `.t-{key}`, `.r-{key}`, `.b-{key}`, `.l-{key}` | position offset (top, right, bottom, left) |
-
-## Card
-
-| Class | Description |
-|-------|-------------|
-| `.card` | 카드 컨테이너 (배경, 그림자, 진입 애니메이션) |
-
-## Form
-
-| Class | Description |
-|-------|-------------|
-| `.form-box` | 수직 폼 레이아웃 (`flex-direction: column`, gap `default`) |
-| `.form-box-inline` | 인라인 폼 레이아웃 (`inline-flex`, `flex-wrap: wrap`, gap `sm`) |
-| `.form-table` | 테이블 형태 폼 레이아웃 (`display: table`) |
-| `.form-table-header` | form-table 내 섹션 헤더 (`<th class="form-table-header">`) |
-| `.form-control` | 기본 폼 컨트롤 스타일 (padding, font, line-height) |
-
-## Table
-
-| Class | Description |
-|-------|-------------|
-| `.table` | 기본 테이블 스타일 (border, spacing) |
-| `.table-inset` | 외곽 border 제거 |
-| `.table-inline` | `width: auto` |
-| `.table-bd-v` | 수직 border만 제거 |
-| `.table-bd-h` | 수평 border만 제거 |
-
-## Display
-
-| Class | Description |
-|-------|-------------|
-| `.block` | `display: block` |
-| `.inline-block` | `display: inline-block` |
-| `.inline` | `display: inline` |
-| `.fill` | `height: 100%; width: 100%; overflow: auto` |
-| `.nowrap` | `white-space: nowrap` |
-| `.overflow-auto` | `overflow: auto` |
-| `.position-relative` | `position: relative` |
-| `.sticky-top` | `position: sticky; top: 0; z-index: 1` |
-
-## Text
-
-| Pattern | Description |
-|---------|-------------|
-| `.ft-size-{key}` | 폰트 크기 (key: h1, h2, h3, h4, h5, h6, lg, default, sm) |
-| `.tx-left`, `.tx-right`, `.tx-center` | text-align |
-| `.tx-line-through` | 취소선 |
-| `.tx-underline` | 밑줄 |
-| `.tx-trans-{key}` | 텍스트 투명도 색상 (key: dark, default, light, lighter, lightest, rev-default, rev-dark, rev-darker) |
-| `.tx-theme-{theme}-{shade}` | 테마별 텍스트 색상 |
-
-## Background
-
-| Pattern | Description |
-|---------|-------------|
-| `.bg-theme-{theme}-{shade}` | 테마별 배경색 |
-| `.bg-trans-{key}` | 투명도 배경색 |
-| `.bg-default` | 기본 배경색 (`--background-color`) |
-| `.bg-control` | 컨트롤 배경색 (`--control-color`) |
-
-## Border
-
-| Pattern | Description |
-|---------|-------------|
-| `.bd` | `border: 1px solid` |
-| `.bd-none` | `border: none` |
-| `.bd-transparent` | `border-color: transparent` |
-| `.bd-theme-{theme}-{shade}` | 테마별 border 색상 |
-| `.bd-trans-{key}` | 투명도 border 색상 |
-| `.bd-color-{key}` | border-color 변수 (key: lighter, light, default, dark, darker) |
-| `.bd{d}` | 방향별 border (d: t, r, b, l) |
-| `.bd{d}-theme-{theme}-{shade}` | 방향별 테마 border 색상 |
-| `.bd{d}-trans-{key}` | 방향별 투명도 border 색상 |
-| `.bd{d}-color-{key}` | 방향별 border-color 변수 |
-| `.bd{d}-none` | 방향별 border 제거 |
-| `.bd{d}-transparent` | 방향별 border 투명 |
-| `.bd-width-{key}` | border 두께 |
-| `.bd{d}-width-{key}` | 방향별 border 두께 |
-| `.bd-radius-{key}` | border-radius (key: xs, sm, default, lg, xl, xxl) |
-| `.bd{d}-radius-{key}` | 방향별 border-radius (d: t, b, l, r) |
-
-## Special
-
-| Class | Description |
-|-------|-------------|
-| `.help` | 도움말 스타일 (dotted underline, help cursor) |
-| `.control-header` | 컨트롤 헤더 (작은 폰트, 회색) |
-| `.page-header` | 페이지 헤더 (작은 폰트, 회색, 하단 여백) |
-| `.sh-topbar` | `height: var(--topbar-height)` |
-| `.sw-sidebar` | `width: var(--sidebar-width)` |

package/docs/styling/mixins.md

@@ -1,100 +0,0 @@
-# Mixins / Functions
-
-공개 SCSS mixin과 function. `scss/commons/_mixins.scss`에 정의된다.
-
-## Mixins
-
-### `writeVars($value, $prevKey)`
-
-SCSS 맵을 CSS 커스텀 프로퍼티로 변환하여 출력한다. 중첩 맵은 키를 `-`로 연결한다.
-
-```scss
-@include mixins.writeVars(variables.$vars, "");
-// 출력: --theme-gray-lightest: ...; --theme-gray-lighter: ...; ...
-```
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `$value` | `map \| value` | 변환할 SCSS 맵 또는 값 |
-| `$prevKey` | `string` | 키 접두사 (루트 호출 시 `""`) |
-
-### `elevation($value)`
-
-Material Design 스타일 box-shadow를 적용한다.
-
-```scss
-@include mixins.elevation(4);  // 양수: 외부 그림자
-@include mixins.elevation(-2); // 음수: 내부(inset) 그림자
-@include mixins.elevation(0);  // 그림자 제거
-```
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `$value` | `number` | 그림자 강도. 양수: 외부, 음수: 내부, 0/none: 제거 |
-
-### `form-control-base()`
-
-��본 폼 컨트롤 스타일. padding, font, line-height, color를 설정한다. 매개변수 없음.
-
-```scss
-@include mixins.form-control-base();
-// display: block; padding: var(--gap-sm) var(--gap-default);
-// font-size, font-family, font-variant-numeric, line-height, color
-```
-
-### `help()`
-
-도움말 스타일 (점선 밑줄 + help 커서). 매개변수 없음.
-
-```scss
-@include mixins.help();
-// text-decoration-line: underline; text-decoration-style: dotted; cursor: help;
-```
-
-### `border-direction-variants($dir, $d)`
-
-특정 방향의 border 유틸리티 클래스를 일괄 생성한다. 내부적으로 `_styles.scss`에서 4방향에 대해 호출된다.
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `$dir` | `string` | CSS 방향 (`top`, `right`, `bottom`, `left`) |
-| `$d` | `string` | 약어 (`t`, `r`, `b`, `l`) |
-
-### `flex-direction($direction, $defaultGap?)`
-
-flex-direction과 gap을 설정한다. Chrome 84 이하(flex gap 미지원)를 위한 margin 폴백을 포함한다.
-
-```scss
-@include mixins.flex-direction(row, var(--gap-sm));
-// flex-direction: row; gap: var(--gap-sm);
-// + @supports not (appearance: auto) { gap: 0; > * + * { margin-left: ... } }
-```
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `$direction` | `row \| column` | flex 방향 |
-| `$defaultGap` | `value \| null` | 기본 gap 값 (선택) |
-
-## Functions
-
-### `to-rgb($oklch-color)`
-
-OKLCH 색상을 RGB 색상 공간으로 변환한다. `_variables.scss`에 정의된다.
-
-```scss
-$blue: to-rgb(oklch(0.707 0.165 254.624));
-```
-
-### `color-map($base, $offset?)`
-
-기본 색상에서 7단계(lightest~darkest) shade 맵을 생성한다. `_variables.scss`에 정의된다.
-
-```scss
-$primary: color-map(map.get($colors, blue));
-// (lightest: ..., lighter: ..., light: ..., default: ..., dark: ..., darker: ..., darkest: ...)
-```
-
-| Param | Type | Description |
-|-------|------|-------------|
-| `$base` | `color` | 기본 색상 |
-| `$offset` | `percentage` | lightness 오프셋 (기본 `0%`) |

package/docs/styling/themes.md

@@ -1,35 +0,0 @@
-# Themes
-
-## `.sd-theme-dark`
-
-다크 모드 테마 클래스. `<body>`에 `SdThemeProvider`가 자동으로 토글한다.
-
-`@layer theme-variant`에 정의되며, `:root`의 CSS 커스텀 프로퍼티를 오버라이드한다.
-
-### 오버라이드 변수
-
-| Category | Description |
-|----------|-------------|
-| `--theme-{group}-{shade}` | 모든 테마 색상이 반전된다. lightest가 어두운 톤, darkest가 밝은 톤으로 변환 |
-| `--trans-*` | 투명도 값이 흰색 기반(`rgba(255,255,255,...)`)으로 변경 |
-| `--text-trans-*` | 텍스트 색상이 흰색 기반으로 변경 (`dark: white`, `default: rgba(255,255,255,0.87)` 등) |
-| `--border-color-*` | border 색상이 다크 테마 기준으로 변경 |
-| `--background-color` | `#000` |
-| `--background-rev-color` | `#fff` |
-| `--control-color` | `#000` |
-| `--busy-overlay-bg` | `rgba(0, 0, 0, 0.6)` |
-| `--sheet-bg` | 다크 테마 시트 배경 |
-
-### 이미지 반전
-
-```css
-.sd-theme-dark img:not(.no-invert) {
-  filter: invert(1) hue-rotate(180deg);
-}
-```
-
-다크 모드에서 모든 `<img>`가 자동 반전된다. 반전을 원하지 않는 이미지에 `class="no-invert"`를 추가한다.
-
-### 활성화
-
-`SdThemeProvider.dark` signal이 `true`일 때 `<body>`에 `.sd-theme-dark` 클래스가 추가된다. `provideSdAngular`가 localStorage와 자동 동기화한다.

package/docs/styling/variables.md

@@ -1,147 +0,0 @@
-# CSS Custom Properties
-
-`:root`에 선언되는 CSS 커스텀 프로퍼티. SCSS `$vars` 맵에서 `mixins.writeVars()`로 생성된다.
-
-## Theme Colors
-
-OKLCH 기반 17+5 색상 팔레트. 각 테마 그룹에 7단계 shade가 존재한다.
-
-**테마 그룹**: gray, blue-gray, primary, secondary, info, success, warning, danger
-
-**Shade 단계**: lightest (+90%), lighter (+75%), light (+60%), default, dark (-10%), darker (-25%), darkest (-40%)
-
-| Property Pattern | Description |
-|------------------|-------------|
-| `--theme-{group}-lightest` | 가장 밝은 단계 |
-| `--theme-{group}-lighter` | 밝은 단계 |
-| `--theme-{group}-light` | 약간 밝은 단계 |
-| `--theme-{group}-default` | 기본 단계 |
-| `--theme-{group}-dark` | 약간 어두운 단계 |
-| `--theme-{group}-darker` | 어두운 단계 |
-| `--theme-{group}-darkest` | 가장 어두운 단계 |
-
-**기본 색상 매핑** (OKLCH):
-
-| Theme Group | Base Color |
-|-------------|------------|
-| gray | `oklch(0.707 0.022 261.325)` (gray) |
-| blue-gray | `oklch(0.704 0.04 256.788)` (slate) |
-| primary | `oklch(0.707 0.165 254.624)` (blue) |
-| secondary | `oklch(0.707 0.165 254.624)` (blue) |
-| info | `oklch(0.789 0.154 211.53)` (cyan) |
-| success | `oklch(0.841 0.238 128.85)` (lime) |
-| warning | `oklch(0.75 0.183 55.934)` (orange) |
-| danger | `oklch(0.704 0.191 22.216)` (red) |
-
-## Transparency
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--trans-darkest` | `rgba(0, 0, 0, 0.5)` | 가장 어두운 투명 |
-| `--trans-darker` | `rgba(0, 0, 0, 0.4)` | |
-| `--trans-dark` | `rgba(0, 0, 0, 0.3)` | |
-| `--trans-default` | `rgba(0, 0, 0, 0.2)` | |
-| `--trans-light` | `rgba(0, 0, 0, 0.1)` | |
-| `--trans-lighter` | `rgba(0, 0, 0, 0.05)` | |
-| `--trans-lightest` | `rgba(0, 0, 0, 0.03)` | |
-| `--trans-rev-default` | `rgba(255, 255, 255, 0.1)` | 역방향 투명 |
-| `--trans-rev-light` | `rgba(255, 255, 255, 0.2)` | |
-| `--trans-rev-lighter` | `rgba(255, 255, 255, 0.3)` | |
-| `--trans-rev-lightest` | `rgba(255, 255, 255, 0.4)` | |
-
-## Text Colors
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--text-trans-dark` | `black` | 강조 텍스트 |
-| `--text-trans-default` | `rgba(0, 0, 0, 0.87)` | 기본 텍스트 |
-| `--text-trans-light` | `rgba(0, 0, 0, 0.6)` | 보조 텍스트 |
-| `--text-trans-lighter` | `rgba(0, 0, 0, 0.38)` | 비활성 텍스트 |
-| `--text-trans-lightest` | `rgba(0, 0, 0, 0.2)` | 최소 텍스트 |
-| `--text-trans-rev-default` | `white` | 역방향 기본 텍스트 |
-| `--text-trans-rev-dark` | `rgba(255, 255, 255, 0.7)` | 역방향 강조 텍스트 |
-| `--text-trans-rev-darker` | `rgba(255, 255, 255, 0.5)` | 역방향 더 강조 |
-
-## Font Size
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--font-size-h1` | `2rem` | h1 |
-| `--font-size-h2` | `1.5rem` | h2 |
-| `--font-size-h3` | `1.3333rem` | h3 |
-| `--font-size-h4` | `1.1667rem` | h4 |
-| `--font-size-h5` | `1rem` | h5 |
-| `--font-size-h6` | `0.9167rem` | h6 |
-| `--font-size-lg` | `1.1667rem` | 큰 폰트 |
-| `--font-size-default` | `1rem` | 기본 폰트 |
-| `--font-size-sm` | `0.9167rem` | 작은 폰트 |
-
-## Gap (Spacing)
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--gap-xxs` | `0.0833rem` | 초소형 |
-| `--gap-xs` | `0.1667rem` | 소형 |
-| `--gap-sm` | `0.3333rem` | 중소형 |
-| `--gap-default` | `0.5rem` | 기본 |
-| `--gap-lg` | `0.6667rem` | 중대형 |
-| `--gap-xl` | `1rem` | 대형 |
-| `--gap-xxl` | `1.5rem` | 초대형 |
-| `--gap-0` | `0` | 없음 |
-| `--gap-auto` | `auto` | 자동 |
-
-## Border
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--border-color-lighter` | `var(--theme-gray-lightest)` | 가장 밝은 border |
-| `--border-color-light` | `var(--theme-gray-lighter)` | 밝은 border |
-| `--border-color-default` | `var(--theme-gray-light)` | 기본 border |
-| `--border-color-dark` | `var(--theme-gray-default)` | 어두운 border |
-| `--border-color-darker` | `var(--theme-gray-dark)` | 가장 어두운 border |
-| `--border-radius-xs` | `var(--gap-xxs)` | |
-| `--border-radius-sm` | `var(--gap-xs)` | |
-| `--border-radius-default` | `var(--gap-sm)` | |
-| `--border-radius-lg` | `var(--gap-default)` | |
-| `--border-radius-xl` | `var(--gap-lg)` | |
-| `--border-radius-xxl` | `var(--gap-xl)` | |
-
-## Layout & Z-Index
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--line-height` | `1.5em` | 기본 line-height |
-| `--font-family` | `sans-serif` | 기본 폰트 패밀리 |
-| `--font-family-monospace` | `monospace` | 코드 폰트 패밀리 |
-| `--background-color` | `white` | 페이지 배경색 |
-| `--background-rev-color` | `black` | 역방향 배경색 |
-| `--control-color` | `white` | 컨트롤 배경색 |
-| `--busy-overlay-bg` | `rgba(255, 255, 255, 0.6)` | busy 오버레이 배경 |
-| `--animation-duration` | `0.2s` | 애니메이션 지속 시간 |
-| `--elevation-size` | `0.0833rem` | elevation 단위 |
-| `--sidebar-width` | `15em` | 사이드바 너비 |
-| `--topbar-height` | `3em` | 탑바 높이 |
-| `--z-index-toast` | `9999` | 토스트 z-index |
-| `--z-index-busy` | `9998` | busy z-index |
-| `--z-index-dropdown` | `5000` | 드롭다운 z-index |
-| `--z-index-modal` | `4000` | 모달 z-index |
-| `--z-index-sidebar` | `3000` | 사이드바 z-index |
-
-## Sheet
-
-| Property | Default | Description |
-|----------|---------|-------------|
-| `--sheet-pv` | `var(--gap-xs)` | 시트 셀 수직 padding |
-| `--sheet-ph` | `var(--gap-sm)` | 시트 셀 수평 padding |
-| `--sheet-bg` | `var(--theme-gray-lightest)` | 시트 배경색 |
-
-## Breakpoints (SCSS 전용)
-
-CSS 커스텀 프로퍼티가 아닌 SCSS 변수. media query에서 사용된다.
-
-| Variable | Value | Description |
-|----------|-------|-------------|
-| `$breakpoint-mobile` | `520px` | 모바일 |
-| `$breakpoint-xxs` | `800px` | 초소형 |
-| `$breakpoint-xs` | `1024px` | 소형 |
-| `$breakpoint-sm` | `1280px` | 중소형 |

package/docs/type-utilities/directive-input-signals.md

@@ -1,232 +0,0 @@
-# Type Utilities
-
-컴포넌트/디렉티브 입력 시그널 타입 추출 유틸리티 모음.
-
-## `DirectiveInputSignals`
-
-컴포넌트/디렉티브의 InputSignal 프로퍼티에서 값 타입을 추출하는 유틸리티 타입. InputSignal이 아닌 프로퍼티는 제외되며, undefined를 포함하는 필드는 optional로 변환된다.
-
-```typescript
-type DirectiveInputSignals<T> = UndefToOptional<{
-  [P in keyof T as T[P] extends InputSignal<any> ? P : never]: T[P] extends InputSignal<infer V> ? V : never;
-}>
-```
-
-### 예시
-
-```typescript
-class MyComponent {
-  name = input.required<string>();
-  age = input(0);
-}
-// DirectiveInputSignals<MyComponent> = { name: string; age: number }
-```
-
-## `UndefToOptional`
-
-undefined를 포함하는 프로퍼티를 optional로 변환하는 유틸리티 타입.
-
-```typescript
-type UndefToOptional<T> = {
-  [K in keyof T as undefined extends T[K] ? never : K]: T[K];
-} & {
-  [K in keyof T as undefined extends T[K] ? K : never]?: Exclude<T[K], undefined>;
-}
-```
-
-예시: `{ name: string; age: number | undefined }` → `{ name: string; age?: number }`
-
-## `WithOptional`
-
-특정 키를 optional로 변환하는 유틸리티 타입.
-
-```typescript
-type WithOptional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>
-```
-
-## `SdViewType`
-
-뷰 타입.
-
-```typescript
-type SdViewType = "page" | "modal" | "control"
-```
-
-## `SortingDef`
-
-정렬 정의.
-
-```typescript
-interface SortingDef {
-  key: string;
-  desc: boolean;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `key` | `string` | 정렬 키. **컬럼 `key`가 `"vendor.name"`, `"lot.goods.code"` 같은 체인 경로일 수 있다.** 정렬 처리 시 `item[key]` 단순 접근 대신 `obj.getChainValue(item, key)` (from `@simplysm/core-common`)를 사용해야 한다 |
-| `desc` | `boolean` | 내림차순 여부 |
-
-## `ExpandItemDef`
-
-트리 확장 항목 정의.
-
-```typescript
-interface ExpandItemDef<T> {
-  item: T;
-  parentDef: ExpandItemDef<T> | undefined;
-  hasChildren: boolean;
-  depth: number;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `item` | `T` | 항목 |
-| `parentDef` | `ExpandItemDef<T> \| undefined` | 부모 정의 |
-| `hasChildren` | `boolean` | 자식 존재 여부 |
-| `depth` | `number` | 깊이 |
-
-## `SdTextfieldTypes`
-
-텍스트필드 타입별 값 타입 매핑.
-
-```typescript
-type SdTextfieldTypes = {
-  "number": number;
-  "text": string;
-  "password": string;
-  "color": string;
-  "email": string;
-  "format": string;
-  "date": DateOnly;
-  "month": DateOnly;
-  "year": DateOnly;
-  "datetime": DateTime;
-  "datetime-sec": DateTime;
-  "time": Time;
-  "time-sec": Time;
-}
-```
-
-## `sdTextfieldTypes`
-
-텍스트필드 타입 문자열 배열.
-
-```typescript
-const sdTextfieldTypes: (keyof SdTextfieldTypes)[] = [
-  "number", "text", "password", "color", "email", "format",
-  "date", "month", "year", "datetime", "datetime-sec", "time", "time-sec",
-]
-```
-
-## `SelectModeValue`
-
-select mode별 value 타입 매핑.
-
-```typescript
-type SelectModeValue<T> = {
-  multi: T[];
-  single: T;
-}
-```
-
-## `SdSidebarUserMenu`
-
-사이드바 사용자 메뉴 항목.
-
-```typescript
-interface SdSidebarUserMenu {
-  title: string;
-  menus: {
-    title: string;
-    onClick: () => void;
-  }[];
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `title` | `string` | 사용자 메뉴 제목 |
-| `menus` | `{ title: string; onClick: () => void }[]` | 하위 메뉴 항목 배열 |
-
-## `SdTopbarUserMenu`
-
-탑바 사용자 메뉴 항목.
-
-```typescript
-interface SdTopbarUserMenu {
-  title: string;
-  onClick: () => void;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `title` | `string` | 메뉴 제목 |
-| `onClick` | `() => void` | 클릭 핸들러 |
-
-## `SdStatePresetDef`
-
-상태 프리셋 데이터.
-
-```typescript
-interface SdStatePresetDef {
-  name: string;
-  state: any;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `name` | `string` | 프리셋 이름 |
-| `state` | `any` | 저장된 상태 데이터 |
-
-## Kanban Types
-
-### `SdKanbanBoardDropInfo`
-
-칸반 보드 드롭 정보.
-
-```typescript
-interface SdKanbanBoardDropInfo<L, T> {
-  sourceKanbanValue?: T;
-  targetLaneValue?: L;
-  targetKanbanValue?: T;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `sourceKanbanValue` | `T \| undefined` | 드래그한 칸반 아이템의 값 |
-| `targetLaneValue` | `L \| undefined` | 드롭 대상 레인의 값 |
-| `targetKanbanValue` | `T \| undefined` | 드롭 대상 칸반 아이템의 값 |
-
-### `SdKanbanDragRef`
-
-```typescript
-interface SdKanbanDragRef<_L, T> {
-  value(): T | undefined;
-  heightOnDrag(): number;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `value()` | `T \| undefined` | 드래그 중인 칸반 아이템의 값 |
-| `heightOnDrag()` | `number` | 드래그 시작 시점의 요소 높이 |
-
-### `SdKanbanDropTarget`
-
-```typescript
-interface SdKanbanDropTarget<L, T> {
-  targetLaneValue(): L | undefined;
-  targetKanbanValue?(): T | undefined;
-}
-```
-
-| Field | Type | Description |
-|-------|------|-------------|
-| `targetLaneValue()` | `L \| undefined` | 드롭 대상 레인의 값 |
-| `targetKanbanValue?()` | `T \| undefined` | 드롭 대상 칸반 아이템의 값 (optional) |

package/docs/ui-data/sd-list.md

@@ -1,37 +0,0 @@
-# `SdList`
-
-리스트 컴포넌트.
-
-```typescript
-@Component({ selector: "sd-list" })
-class SdList {
-  inset = input(false, { transform: booleanAttribute });
-}
-```
-
-## Members
-
-| Member | Kind | Type | Default | Description |
-|--------|------|------|---------|-------------|
-| `inset` | input | `boolean` | `false` | 삽입 스타일 (테두리 없음) |
-
-## Related Types
-
-### `SdListItem`
-
-리스트 항목 컴포넌트. 접기/펼치기 자식 리스트를 지원한다.
-
-```typescript
-@Component({ selector: "sd-list-item" })
-class SdListItem {
-  open = model(false);
-  selected = input(false, { transform: booleanAttribute });
-  readonly = input(false, { transform: booleanAttribute });
-}
-```
-
-| Input | Type | Default | Description |
-|-------|------|---------|-------------|
-| `open` | `boolean` | `false` | 자식 리스트 펼침 (two-way) |
-| `selected` | `boolean` | `false` | 선택 상태 |
-| `readonly` | `boolean` | `false` | 읽기 전용 |