feat: integrate latest HMDesign design system updates

2026-10-11 11:09:03 +09:00
1 parent 99faec189e
commit 1c4e0bb9a1
@@ -1,5 +1,7 @@
 # Table

+> 2026-10-10 추가 수정 요청 기준: Hover·Selected·Selected+Hover는 #BDDFD4 20%. 공통 강조 토큰과 Checkbox 선택색은 유지. 과거 검증 기록은 당시 결과이며 현재 검증은 [추가 수정 보고서](../guidelines/publisher-additional-review-2026-10-10.md)를 따릅니다.
+
 현재 HM 구현의 기준 문서. 공통 원칙은 `docs/guidelines/프로젝트-지침.md`(§6, §7), Token 구조 원칙은 `테마-토큰-가이드.md`를 따른다. 이 문서는 Table 고유의 API·Token·상태·결정만 기록한다.

 ## 1. 상태
@@ -35,9 +37,9 @@

 | 상태 | 값 |
 |---|---|
-| Row Hover | body 행 배경 `--accent` 45%(`color-mix`, 면만 변경, header 제외) |
-| Selected (`data-state="selected"`) | 행 배경 `--accent` 45%. 소비자가 속성을 붙인다 |
-| Selected + Hover | `--accent` 45% 유지(농도 변화 없음) |
+| Row Hover | body 행 배경 `--accent` 20%(`color-mix`, 면만 변경, header 제외) |
+| Selected (`data-state="selected"`) | 행 배경 `--accent` 20%. 소비자가 속성을 붙인다 |
+| Selected + Hover | `--accent` 20% 유지(농도 변화 없음) |
 | Focus / Disabled / Loading | Table 자체에는 없음(셀 안 content가 각자 가진다) |

 ## 5. API
@@ -53,7 +55,7 @@ shadcn 구조 그대로. export: `Table`, `TableHeader`, `TableBody`, `TableFoot

 Component Mapping 위치: `packages/ui/src/theme/table.css` (`--hm-table-*`).

-`min-width`, `background`, `text`, `font-size|line-height|font-weight`, `cell-padding-y|x`, `divider-width|color`, `header-background|text|font-size|font-weight|border-top|border-bottom`, `row-hover-background`, `row-selected-background`, `footer-background|font-weight`, `caption-*`. Semantic과 Theme palette(`--hm-sem-palette-green-*`, `--hm-sem-stroke-input-default`, `--hm-sem-palette-white`)를 참조하고 다른 컴포넌트 Token을 쓰지 않는다. 신규 Primitive 없음(ui-viz의 `#EDF4F1`은 기존 Primitive의 `color-mix`로 표현). row hover / selected는 shadcn `--accent`의 `color-mix` 45%(Select·Menu·Pagination hover와 같은 Soft Surface 규칙, 공통 `--hm-sem-surface-highlight`를 Component Token이 참조).
+`min-width`, `background`, `text`, `font-size|line-height|font-weight`, `cell-padding-y|x`, `divider-width|color`, `header-background|text|font-size|font-weight|border-top|border-bottom`, `row-hover-background`, `row-selected-background`, `footer-background|font-weight`, `caption-*`. Semantic과 Theme palette(`--hm-sem-palette-green-*`, `--hm-sem-stroke-input-default`, `--hm-sem-palette-white`)를 참조하고 다른 컴포넌트 Token을 쓰지 않는다. 신규 Primitive 없음(ui-viz의 `#EDF4F1`은 기존 Primitive의 `color-mix`로 표현). row hover / selected는 shadcn `--accent`의 `color-mix` 20%(Select·Menu·Pagination hover와 같은 Soft Surface 규칙, 공통 `--hm-sem-surface-highlight`를 Component Token이 참조).

 ## 7. shadcn에서 유지한 항목

@@ -74,7 +76,7 @@ container(`overflow-x-auto`)와 table 구조, `caption-bottom`, Head/Cell의 che
 ## 10. 사용자 확정 결정

 - 2026-10-02: ui-viz는 참고 자료이며 최종 기준은 현재 HM 구현과 이 문서다(작업 지시). 개별 수치에 대한 별도 결정은 없다.
- 2026-10-06 (컬러 역할 정리): 행은 넓은 Soft Surface이므로 Hover·Selected·Selected+Hover 모두 `--accent` 45%를 쓴다(이전 `--hm-green-tint` 18% / 40%). Active State Semantic(Light 2)은 쓰지 않는다. 선택 구분은 면 색이 아니라 행 안의 Checkbox(Active Semantic)가 담당한다. `--accent` 값 자체는 바꾸지 않았다. Table row highlight surface는 Select Highlight / Selected와 동일한 Accent 45% 정책을 사용한다.
+- 2026-10-06 (컬러 역할 정리): 행은 넓은 Soft Surface이므로 Hover·Selected·Selected+Hover 모두 `--accent` 20%를 쓴다(이전 `--hm-green-tint` 18% / 40%). Active State Semantic(Light 2)은 쓰지 않는다. 선택 구분은 면 색이 아니라 행 안의 Checkbox(Active Semantic)가 담당한다. `--accent` 값 자체는 바꾸지 않았다. Table row highlight surface는 Select Highlight / Selected와 동일한 Accent 20% 정책을 사용한다.

 ## 11. 미확정 / 보류