@seed-design/react 2.5.0 → 2.5.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/react",
-  "version": "2.5.0",
+  "version": "2.5.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",
@@ -50,15 +50,15 @@
     "@seed-design/react-collapsible": "^1.0.1",
     "@seed-design/react-dialog": "^2.0.3",
     "@seed-design/react-date-picker": "^1.2.0",
-    "@seed-design/react-drawer": "^2.0.6",
+    "@seed-design/react-drawer": "^2.0.7",
     "@seed-design/react-field": "^2.0.1",
     "@seed-design/react-field-button": "^2.0.1",
     "@seed-design/react-fieldset": "^1.0.1",
     "@seed-design/react-file-upload": "^1.0.1",
     "@seed-design/react-image": "^1.1.0",
-    "@seed-design/react-menu": "^2.0.2",
+    "@seed-design/react-menu": "^2.0.3",
     "@seed-design/react-middle-truncate": "^1.0.1",
-    "@seed-design/react-navigation-menu": "^2.0.1",
+    "@seed-design/react-navigation-menu": "^2.0.2",
     "@seed-design/react-popover": "^2.0.1",
     "@seed-design/react-portal": "^2.0.1",
     "@seed-design/react-primitive": "^2.0.1",
@@ -68,7 +68,7 @@
     "@seed-design/react-radio-group": "^2.0.1",
     "@seed-design/react-scale-feedback": "^1.0.0",
     "@seed-design/react-segmented-control": "^2.0.2",
-    "@seed-design/react-select": "^1.0.1",
+    "@seed-design/react-select": "^1.0.2",
     "@seed-design/react-side-navigation": "^1.0.1",
     "@seed-design/react-slider": "^2.0.1",
     "@seed-design/react-snackbar": "^2.0.1",

package/src/components/AGENTS.md

@@ -1,21 +1,17 @@
 # packages/react/src/components
 
-## 디렉토리 개요
+`@seed-design/react` 컴포넌트 구현 디렉터리다. 컴포넌트마다 `PascalCase` 폴더에 `{ComponentName}.tsx`와 `index.ts`를 둔다.
 
-`packages/react`의 실제 컴포넌트 구현이 모여 있는 핵심 디렉토리다. 상위 `packages/react/AGENTS.md`의 공통 규칙 위에서, 컴포넌트별 public surface와 내부 구현 경계를 더 구체적으로 다룬다.
+## 규칙
 
-## 파일 작성 컨벤션
+### Public surface
 
-- 컴포넌트별 디렉토리는 `PascalCase`를 사용한다. 단일 컴포넌트는 `{ComponentName}.tsx`와 `index.ts`를 기본으로 둔다.
-- compound component에서 public namespace 단축 이름이 필요할 때만 `{ComponentName}.namespace.ts`를 추가한다.
-- 실제 구현은 `{ComponentName}.tsx` 또는 역할별 구현 파일에 두고, 공개 re-export는 `index.ts`와 필요한 namespace 파일에서 관리한다.
+- 구현은 `{ComponentName}.tsx`나 역할별 구현 파일에 두고, 공개 re-export는 `index.ts`와 namespace 파일에서만 한다. `{ComponentName}.namespace.ts`는 compound 컴포넌트에 namespace 단축 이름이 필요할 때만 추가한다.
+- export는 사용자에게 의미가 분명한 slot만 노출한다. animation·layout helper slot은 namespace에서도 숨기고, direct composition이나 styling escape hatch 같은 사용자 시나리오가 있을 때만 공개한다.
+- compound 컴포넌트를 설계·변경함 → React API만 닫지 말고 `docs/registry/react/ui/` snippet이 어떤 convenience layer를 줄지 함께 정한다.
 
-## 코드 작성 컨벤션
+### Headless 재사용
 
-- public export는 사용자에게 의미가 분명한 slot만 기본 노출한다.
-- namespace export도 같은 기준을 따른다. 짧은 이름이 필요하더라도 animation/layout helper slot은 기본적으로 숨긴다.
-- helper slot을 공개하려면 direct composition이나 styling escape hatch 같은 명확한 사용자 시나리오가 있어야 한다.
-- compound component를 설계할 때는 React API만 닫지 말고 `docs/registry/react/ui` snippet surface가 어떤 convenience layer를 제공할지도 함께 생각한다.
-- headless context가 제공하는 `stateProps`/slot props는 styled layer에서 다시 계산하지 않는다. `createWithStateProps([useHeadlessContext])`처럼 기존 context를 직접 재사용하고, 동일한 `data-*` props를 위한 중복 helper export는 만들지 않는다.
-- headless primitive wrapper의 props는 hook props를 재사용한다. `ComponentItemProps extends UseComponentItemProps`처럼 한 source를 확장하고, 같은 prop을 컴포넌트 props에 다시 선언하지 않는다.
-- headless hook prop이 discriminated union이면 styled wrapper도 union contract를 보존한다. mode별로 hook props를 재조합해야 할 때는 branch를 나누어 특정 mode에서 무효한 prop이 섞이지 않게 한다.
+- headless context의 `stateProps`·slot props → styled layer에서 다시 계산하지 않는다. `createWithStateProps([useHeadlessContext])`(`../../utils/createWithStateProps`)로 기존 context를 재사용하고, 같은 `data-*` props용 helper를 따로 export하지 않는다. 예: `NavigationMenu/NavigationMenu.tsx`.
+- headless primitive wrapper의 props → `ComponentItemProps extends UseComponentItemProps`처럼 훅 props를 확장한다. 같은 prop을 다시 선언하지 않는다.
+- headless 훅 prop이 discriminated union → styled wrapper도 union contract를 유지한다. mode별로 훅 props를 다시 조합해야 하면 branch를 나눠 특정 mode에서 무효한 prop이 섞이지 않게 한다.

package/src/components/Skeleton/Skeleton.test.tsx

@@ -59,7 +59,7 @@ describe("Skeleton", () => {
     );
     const element = getByTestId("skeleton");
 
-    expect(ref.current).toBe(element);
+    expect<HTMLElement | null>(ref.current).toBe(element);
     expect(element).toHaveClass("custom");
     expect(element.style.height).toBe("32px");
     expect(element.style.getPropertyValue("--seed-box-width-base")).toBe(vars.$dimension.x8);