@iyulab/data-components 0.14.0 → 0.17.0

package/CHANGELOG.md

@@ -1,5 +1,53 @@
 # Changelog
 
+## [0.17.0] - 2026-08-17
+
+### Added
+
+- **`u-simple-sheet` gained a `--dc-sheet-height` custom property**, defaulting to `400px` — the
+  value the host was previously hardcoded to. Every other size axis on this component (row height,
+  cell padding, font size) was already a consumer-adjustable custom property; the host's own height
+  was the one dimension left as a literal, so a consumer embedding the sheet in a constrained layout
+  (a form, a panel with a fixed footer) had no supported way to make it shorter or taller — only an
+  external `height` override that fought the component's own `:host` rule on specificity. Unset,
+  rendering is byte-identical to before. Like the other five tokens on this component, it does not
+  derive from a role-layer token and is set with an element selector (`u-simple-sheet { … }`) rather
+  than `:root`.
+
+  This token sets an upper bound, not a natural height: `rows` governs the grid's minimum row
+  *capacity*, not how many rows are visible, so lowering `--dc-sheet-height` does not shrink the
+  number of rows rendered — it constrains the box and leaves the existing `overflow-y: auto` to
+  reach the rest.
+
+## [0.16.0] - 2026-08-16
+
+### Added
+
+- **`u-rich-table` gained a `--dc-font-size` custom property**, defaulting to
+  `var(--u-density, 13px)` — the same LOB density switch `@iyulab/components`,
+  `@iyulab/flex-table`, and `u-simple-sheet` already read. Setting `--u-density` on an
+  ancestor now scales the table's header and body cell text (and the cell edit input, which
+  intentionally shares the same token so entering edit mode never changes the font size)
+  along with the rest of the UI. This component's other text (toolbar, pagination, filter
+  row, badges, sort indicator, validation messages) keeps its own fixed sizes — it forms a
+  four-step visual hierarchy (13/12/11/10px) that a single density switch would flatten, so
+  only the primary content axis (header/body/edit) follows it. Unset, rendering is
+  byte-identical to before. An explicit `u-rich-table { --dc-font-size: … }` override still
+  wins over the switch.
+
+## [0.15.0] - 2026-08-16
+
+### Added
+
+- **`u-simple-sheet`'s body font size now reads `var(--u-density, 13px)`.** `@iyulab/components`
+  (`u-button`/`u-form`/`u-button-group`) and `@iyulab/flex-table` (`--ft-font-size`) already read
+  this switch; setting `--u-density` on an ancestor now scales the sheet's body text along with
+  them, instead of leaving it as the one stack that doesn't follow. Unset, rendering is
+  byte-identical to before (same 13px default). The element-selector override
+  (`u-simple-sheet { --dc-font-size: … }`) still wins over the switch, matching every other
+  token on this component. `--dc-header-font-size` is unaffected — the header and body font
+  sizes remain independent, as before.
+
 ## [0.14.0] - 2026-08-07
 
 ### Added

package/README.md

@@ -218,9 +218,21 @@ u-rich-table { --dc-icon-color: #B0B0B0; }
 | `--dc-row-height` | `24px` | 셀 `height` 와 `line-height` **둘 다** |
 | `--dc-cell-padding-block` | `0px` | 셀·편집 입력의 세로 여백 (행 높이에 **가산**) |
 | `--dc-cell-padding-inline` | `6px` | 〃 가로 여백 |
-| `--dc-font-size` | `13px` | 본문 셀 · 편집 입력 · 드롭다운 항목 |
-| `--dc-header-font-size` | `12px` | 열 머리 |
+| `--dc-font-size` | `13px`(`var(--u-density, 13px)`) | 본문 셀 · 편집 입력 · 드롭다운 항목 |
+| `--dc-header-font-size` | `12px` | 열 머리 — `--u-density` 와 무관(본문과 독립) |
 | `--dc-header-font-weight` | `600` | 〃 |
+| `--dc-sheet-height` | `400px` | `:host` 전체 높이 (0.17.0~) |
+
+⚠**`--dc-sheet-height` 는 "자연 높이로 준다"가 아니라 "상한을 정한다"입니다.** `rows` 는
+표시 개수가 아니라 데이터 격자의 **최소 용량**이라, 이 값을 낮춰도 `rows` 만큼의 빈 행이
+줄지는 않습니다 — 그 안에서 내장 `overflow-y: auto` 로 스크롤해 접근하십시오. 콘텐츠
+분량에 맞춰 자동으로 줄어드는 옵트인은 별도 스코프입니다.
+
+⚠**`--dc-font-size` 만 예외입니다 — `@iyulab/components`/`@iyulab/flex-table` 의 밀도
+스위치(`--u-density`)를 폴백 원본으로 갖습니다**(0.15.0~). 조상에 `--u-density` 를 걸면
+본문 글자가 컨트롤·표와 함께 움직입니다. 이 요소에 `--dc-font-size` 를 직접 선언하면
+그 값이 여전히 이깁니다 — 다른 다섯 토큰과 같은 규칙입니다. 머리행은 이 스위치의
+영향을 받지 않습니다.
 
 ```css
 /* ⚠요소 선택자로 겨눕니다 — :root 는 닿지 않습니다(아래 참조) */
@@ -230,16 +242,44 @@ u-simple-sheet {
 ```
 
 ⚠**`:root` 로는 닿지 않습니다.** 커스텀 프로퍼티 상속값은 섀도 루트의 `:host` 선언에
-집니다. 색 축과 달리 이 여섯은 `:host` 에 리터럴 기본값을 갖고 있으므로(역할 층에 치수
-축이 없어 파생할 곳이 없습니다) **요소 선택자**(`u-simple-sheet { … }`)로 선언하십시오.
+집니다. 색 축과 달리 이 여섯은(`--dc-font-size` 도 포함 — 역할 토큰이 아니라 `--u-density`
+스위치를 참조할 뿐, 역할 층에서 파생하는 것은 아닙니다) `:host` 에 기본값을 갖고 있으므로
+**요소 선택자**(`u-simple-sheet { … }`)로 선언하십시오.
 
 ⚠**선언값과 «읽히는» 행 높이는 1.5px 다릅니다.** `border-collapse` 로 접힌 테두리가
 사용값에 더해집니다 — 기본 `24px` 선언이 `25.5px` 로 읽힙니다. 32px 로 맞추려면
 `30.5px` 를 선언하십시오. (같은 이유로 **빈 행은 데이터 행보다 1.5px 낮습니다** —
 `0.11.0` 이전부터 그랬고, 교정하면 기본 렌더가 바뀌므로 이 릴리스에서는 두었습니다.)
 
-⚠**`0.11.0` 도 조절점만 엽니다** — 선언하지 않으면 종전과 같은 값으로 그려집니다.
-이 여섯은 `u-simple-sheet` 전용입니다(`u-data-view`·`u-rich-table` 은 읽지 않습니다).
+⚠**조절점만 엽니다** — 선언하지 않으면 종전과 같은 값으로 그려집니다.
+`--dc-row-height`·`--dc-cell-padding-block`·`--dc-cell-padding-inline`·
+`--dc-header-font-size`·`--dc-header-font-weight`·`--dc-sheet-height` 여섯은
+`u-simple-sheet` 전용입니다(`u-data-view`·`u-rich-table` 은 읽지 않습니다).
+`--dc-font-size` 만 예외입니다 — 바로 아래 `u-rich-table` 절 참조.
+
+### 그리드 밀도 조절 (`u-rich-table` · 0.16.0~)
+
+시트 밀도 축(위)과 같은 이유로, `u-rich-table` 도 `--dc-font-size` 를 갖습니다 —
+`--u-density` 를 폴백 원본으로 삼는 것도 `u-simple-sheet` 와 동일합니다.
+
+| 토큰 | 기본값 | 무엇을 정하나 |
+|---|---|---|
+| `--dc-font-size` | `13px`(`var(--u-density, 13px)`) | 열 머리 · 본문 셀 · 편집 입력 |
+
+⚠**이 컴포넌트는 시각 위계가 넉 단(13/12/11/10px)이고, 이 하나만 밀도를 따릅니다.**
+툴바·페이지네이션·필터 행·배지·정렬 표시자·검증 오류 메시지는 의도적으로 남습니다 —
+전부를 한 스위치에 묶으면 그 위계가 무너집니다. 편집 입력은 본문 셀과 **같은 토큰**을
+공유합니다 — 따로 두면 편집 진입 순간 글자가 튑니다.
+
+```css
+/* 조상에 걸면 헤더·본문·편집 입력이 함께 움직입니다 */
+.app-shell { --u-density: 15px; }
+
+/* 이 그리드만 다르게 */
+u-rich-table { --dc-font-size: 15px; }
+```
+
+⚠**미설정 시 렌더는 종전(`13px`)과 바이트 단위로 동일합니다.**
 
 ### 알려진 제약
 

package/dist/_virtual/{_@oxc-project_runtime@0.143.0 → _@oxc-project_runtime@0.144.0}/helpers/esm/decorate.js

@@ -1,4 +1,4 @@
-//#region \0@oxc-project+runtime@0.143.0/helpers/esm/decorate.js
+//#region \0@oxc-project+runtime@0.144.0/helpers/esm/decorate.js
 function __decorate(decorators, target, key, desc) {
 	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
 	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

package/dist/_virtual/{_@oxc-project_runtime@0.143.0 → _@oxc-project_runtime@0.144.0}/helpers/esm/decorateMetadata.js

@@ -1,4 +1,4 @@
-//#region \0@oxc-project+runtime@0.143.0/helpers/esm/decorateMetadata.js
+//#region \0@oxc-project+runtime@0.144.0/helpers/esm/decorateMetadata.js
 function __decorateMetadata(k, v) {
 	if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 }

package/dist/components/data-view/UDataView.js

@@ -1,6 +1,6 @@
 import { styles } from "./UDataView.styles.js";
-import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorateMetadata.js";
-import __decorate from "../../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorate.js";
+import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorateMetadata.js";
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorate.js";
 import { html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import "@iyulab/components/dist/components/icon/UIcon.js";

package/dist/components/simple-sheet/USimpleSheet.js

@@ -1,5 +1,5 @@
-import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorateMetadata.js";
-import __decorate from "../../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorate.js";
+import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorateMetadata.js";
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorate.js";
 import { messages } from "../../utilities/messages.js";
 import { styles } from "./USimpleSheet.styles.js";
 import { html } from "lit";

package/dist/components/simple-sheet/USimpleSheet.styles.js

@@ -29,17 +29,38 @@ var baseStyles = css`
        ⚠**색 축과 달리 역할 토큰에서 파생하지 않는다** — 역할 층에 치수 축이 없다.
        그래서 폴백이 아니라 :host 리터럴 기본값이고, 소비자는 **요소 선택자**로 덮는다
        (:host 선언은 상속값을 이기므로 :root 로는 닿지 않는다).
-       ⚠**이 컴포넌트가 «읽는» 단만 선언한다** — 색 축과 같은 규칙이다. */
+       ⚠**이 컴포넌트가 «읽는» 단만 선언한다** — 색 축과 같은 규칙이다.
+       ★**단 하나의 예외 — --dc-font-size 는 --u-density 를 폴백 원본으로 갖는다.**
+       components(UButton/UForm/UButtonGroup)와 flex-table(--ft-font-size)이
+       이미 같은 형태로 이 스위치를 읽는다 — 컨트롤과 표가 «한 벌»로 움직이려면 이
+       스택도 같은 원천을 봐야 한다. **--dc-header-font-size 는 여기 포함되지 않는다** —
+       본문과 머리행이 서로 독립이라는 이 컴포넌트의 기존 계약(아래 회귀 테스트가
+       고정)을 이 변경이 깨지 않는다. --u-density 미설정 시 렌더는 종전과 바이트
+       단위로 동일하다(기본값이 같은 13px). */
     --dc-row-height:          24px;   /* 셀 height · line-height (묶임) */
     --dc-cell-padding-block:   0px;   /* 셀 · 편집 입력의 세로 여백 (가산) */
     --dc-cell-padding-inline:  6px;   /* 〃 가로 여백 */
-    --dc-font-size:           13px;   /* 본문 셀 · 편집 입력 · 드롭다운 항목 */
-    --dc-header-font-size:    12px;   /* 열 머리 */
+    --dc-font-size:           var(--u-density, 13px);   /* 본문 셀 · 편집 입력 · 드롭다운 항목 */
+    --dc-header-font-size:    12px;   /* 열 머리 — --u-density 와 무관(독립 계약 유지) */
     --dc-header-font-weight:   600;   /* 〃 */
 
+    /* ── 소비자 조절점 — 호스트 높이 ──
+       ★위 다섯과 같은 이유로 열렸지만 축이 다르다 — 저것들은 "셀 하나"의 치수이고
+       이것은 "시트 전체(:host)"의 치수다. 종전에는 여기만 리터럴이라, 셀 치수는 전부
+       조절되는데 그 합인 호스트 크기만 조절 불가능한 비대칭이 있었다.
+       ⚠**역할 토큰에서 파생하지 않는다** — --dc-font-size 와 달리 대응하는 --u- 층
+       스위치가 없다(호스트 크기는 밀도 개념이 아니다). 그래서 var() 폴백이 아니라
+       이 리터럴 기본값 자체가 정본이다.
+       ⚠**rows 를 낮춰도 이 값은 안 줄어든다 — 그리고 그것이 의도다.** rows 는 표시
+       개수가 아니라 데이터 격자의 최소 용량이라, 자연 높이로 접으면 빈 행 개수만큼
+       상자가 늘어나는 별개 결함이 생긴다. 이 토큰이 여는 것은 "소비자가 상한을
+       명시하고 그 안에서 overflow-y:auto 로 스크롤"이지 "내용에 맞춰 줄어든다"가
+       아니다 — 후자가 필요하면 별도 옵트인으로 낸다. */
+    --dc-sheet-height:       400px;
+
     display: block;
     width: 100%;
-    height: 400px;
+    height: var(--dc-sheet-height);
   }
 
   .sheet-container {

package/dist/components/u-rich-table/URichTable.js

@@ -1,5 +1,5 @@
-import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorateMetadata.js";
-import __decorate from "../../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorate.js";
+import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorateMetadata.js";
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.144.0/helpers/esm/decorate.js";
 import { messages } from "../../utilities/messages.js";
 import { richTableStyles } from "./styles.js";
 import { parseTSV, toTSV } from "./utils/clipboard.js";

package/dist/components/u-rich-table/styles.js

@@ -16,6 +16,20 @@ var richTableStyles = css`
     --dc-muted-color: var(--u-txt-color-weak, #757575);   /* 보조 텍스트 · 라벨 */
     --dc-icon-color:  var(--u-txt-color-weak, #757575);   /* 정렬 표시 · 확장 · 행 메뉴 */
     --dc-empty-color: var(--u-txt-color-weak, #757575);   /* 빈 상태 안내문 */
+    /* ── 소비자 조절점 — 본문 타이포 ──
+       ★USimpleSheet와 같은 이름 --dc-font-size 를 그대로 쓴다 — 이 패키지의 표 컴포넌트가
+       공유하는 관용(위 색 축과 같은 이유: --dc-muted-color 도 세 컴포넌트가 공유한다).
+       components/flex-table/USimpleSheet 이 이미 읽는 --u-density 밀도 스위치를 폴백
+       원본으로 가져, 컨트롤·표·시트·이 그리드가 한 벌로 움직인다.
+       ⚠**모든 font-size 선언이 아니라 이 하나만 연다.** 이 컴포넌트는 시각 위계가
+       13(본문)·12(툴바/보조)·11(필터/페이지네이션)·10(장식적 표시자)px 넉 단으로
+       이미 갈려 있다 — 전부를 하나의 스위치로 묶으면 위계가 무너진다. 여기서 여는 것은
+       **헤더·본문 셀**(:host 상속 경로) + **편집 입력**뿐이다. 편집 입력은 반드시 이
+       토큰을 같이 읽어야 한다 — 따로 두면 편집 진입 순간 글자 크기가 튄다(USimpleSheet
+       가 "본문 셀 · 편집 입력 · 드롭다운 항목"을 한 토큰으로 묶은 것과 같은 이유).
+       나머지 열한 곳(툴바·페이지네이션·필터행·배지·정렬 표시자·검증 오류)은 의도적으로
+       남겨 둔다 — 장식·보조 텍스트라 D-17 이 아이콘/배지 크기를 뺀 것과 같은 경계다. */
+    --dc-font-size: var(--u-density, 13px);
     /* ── 세로 레이아웃 ──
        🔴**높이 제약은 데이터 그리드의 기본 사용 형태다** — 「조회 조건 + 결과 목록」이 한 화면에
        들어가야 하고, 결과가 몇 건이든 조건 영역과 페이지 이동은 항상 같은 자리에 있어야 한다.
@@ -27,7 +41,7 @@ var richTableStyles = css`
     display: flex;
     flex-direction: column;
     font-family: system-ui, -apple-system, sans-serif;
-    font-size: 13px;
+    font-size: var(--dc-font-size);
     color: var(--u-txt-color, #212121);
     border: 1px solid var(--u-border-color, #E0E0E0);
     border-radius: 8px;
@@ -176,7 +190,8 @@ var richTableStyles = css`
     padding: 4px 6px;
     border: 1px solid var(--u-primary-color, #1976D2);
     border-radius: 3px;
-    font-size: 13px;
+    /* --dc-font-size 를 본문 셀과 공유한다 — 따로 두면 편집 진입 순간 글자가 튄다. */
+    font-size: var(--dc-font-size);
     outline: none;
   }
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@iyulab/data-components",
   "description": "iyulab data visualization components",
-  "version": "0.14.0",
+  "version": "0.17.0",
   "keywords": [
     "iyulab",
     "web-components",