@hjmds/design-contracts 1.18.0 → 1.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (244) hide show
  1. package/dist/action-session.d.ts +16 -0
  2. package/dist/action-session.d.ts.map +1 -1
  3. package/dist/action-session.js +18 -0
  4. package/dist/action-session.js.map +1 -1
  5. package/dist/behaviors.d.ts +7 -6
  6. package/dist/behaviors.d.ts.map +1 -1
  7. package/dist/behaviors.js +4 -3
  8. package/dist/behaviors.js.map +1 -1
  9. package/dist/bottom-navigation.d.ts +4 -0
  10. package/dist/bottom-navigation.d.ts.map +1 -1
  11. package/dist/bottom-navigation.js +11 -0
  12. package/dist/bottom-navigation.js.map +1 -1
  13. package/dist/carousel.d.ts +3 -0
  14. package/dist/carousel.d.ts.map +1 -1
  15. package/dist/carousel.js.map +1 -1
  16. package/dist/catalog.d.ts +42 -0
  17. package/dist/catalog.d.ts.map +1 -1
  18. package/dist/component-recipes.d.ts +42 -0
  19. package/dist/component-recipes.d.ts.map +1 -1
  20. package/dist/component-recipes.js +14 -1
  21. package/dist/component-recipes.js.map +1 -1
  22. package/dist/field-group.d.ts +14 -0
  23. package/dist/field-group.d.ts.map +1 -1
  24. package/dist/field-group.js +9 -0
  25. package/dist/field-group.js.map +1 -1
  26. package/dist/form.d.ts.map +1 -1
  27. package/dist/form.js +10 -3
  28. package/dist/form.js.map +1 -1
  29. package/dist/screen-patterns.d.ts +4 -0
  30. package/dist/screen-patterns.d.ts.map +1 -1
  31. package/dist/screen-patterns.js +12 -3
  32. package/dist/screen-patterns.js.map +1 -1
  33. package/dist/toast.d.ts +10 -1
  34. package/dist/toast.d.ts.map +1 -1
  35. package/dist/toast.js +43 -2
  36. package/dist/toast.js.map +1 -1
  37. package/dist/version.d.ts +1 -1
  38. package/dist/version.js +1 -1
  39. package/dist/version.js.map +1 -1
  40. package/docs/action-session.md +2 -0
  41. package/docs/asset.md +7 -0
  42. package/docs/bottom-navigation.md +11 -0
  43. package/docs/brand-boundary.md +3 -3
  44. package/docs/collection-rail.md +4 -0
  45. package/docs/compound-controls.md +8 -3
  46. package/docs/consumer-policy.md +39 -120
  47. package/docs/generated/component-maturity.md +1 -1
  48. package/docs/generated/renderer-evidence.json +3 -3
  49. package/docs/generated/renderer-evidence.md +1 -1
  50. package/docs/generated/showcase-manifest.json +1 -1
  51. package/docs/gravity-letters.md +2 -0
  52. package/docs/grid-reveal.md +2 -0
  53. package/docs/layout.md +2 -2
  54. package/docs/load-more.md +5 -0
  55. package/docs/migration-native-legacy-removal.md +30 -17
  56. package/docs/optional-adapters.md +4 -0
  57. package/docs/screen-patterns.md +23 -1
  58. package/docs/toast.md +41 -2
  59. package/docs/usage/README.md +248 -245
  60. package/docs/usage/SELECTION.md +43 -0
  61. package/docs/usage/STANDARD.md +22 -10
  62. package/docs/usage/components/accordion.md +5 -3
  63. package/docs/usage/components/agreement.md +6 -9
  64. package/docs/usage/components/alert-dialog.md +12 -6
  65. package/docs/usage/components/asset.md +10 -4
  66. package/docs/usage/components/auth-provider-button.md +2 -2
  67. package/docs/usage/components/avatar.md +8 -6
  68. package/docs/usage/components/badge.md +4 -4
  69. package/docs/usage/components/bottom-cta.md +4 -4
  70. package/docs/usage/components/bottom-info.md +2 -2
  71. package/docs/usage/components/bottom-navigation.md +16 -5
  72. package/docs/usage/components/button.md +2 -2
  73. package/docs/usage/components/card.md +1 -1
  74. package/docs/usage/components/carousel.md +12 -4
  75. package/docs/usage/components/chat-message.md +6 -2
  76. package/docs/usage/components/chat-screen.md +5 -5
  77. package/docs/usage/components/checkbox-group.md +1 -1
  78. package/docs/usage/components/checkbox.md +2 -2
  79. package/docs/usage/components/chip.md +2 -2
  80. package/docs/usage/components/code-block.md +3 -4
  81. package/docs/usage/components/collapsible.md +6 -4
  82. package/docs/usage/components/combobox.md +2 -2
  83. package/docs/usage/components/command-palette.md +1 -1
  84. package/docs/usage/components/comment-thread-screen.md +7 -4
  85. package/docs/usage/components/container.md +1 -1
  86. package/docs/usage/components/content-transition.md +2 -2
  87. package/docs/usage/components/context-menu.md +2 -2
  88. package/docs/usage/components/counter-badge.md +3 -3
  89. package/docs/usage/components/data-table.md +1 -1
  90. package/docs/usage/components/date-picker.md +4 -4
  91. package/docs/usage/components/description-list.md +3 -3
  92. package/docs/usage/components/design-system-provider.md +2 -2
  93. package/docs/usage/components/dialog.md +14 -3
  94. package/docs/usage/components/divider.md +2 -2
  95. package/docs/usage/components/editor-screen.md +5 -3
  96. package/docs/usage/components/effect-surface.md +1 -1
  97. package/docs/usage/components/empty-state.md +6 -6
  98. package/docs/usage/components/field.md +5 -3
  99. package/docs/usage/components/file-picker.md +6 -3
  100. package/docs/usage/components/form.md +1 -1
  101. package/docs/usage/components/heading.md +3 -3
  102. package/docs/usage/components/icon-button.md +3 -3
  103. package/docs/usage/components/icon.md +1 -1
  104. package/docs/usage/components/image.md +5 -4
  105. package/docs/usage/components/keyboard-dock.md +1 -1
  106. package/docs/usage/components/layout.md +1 -1
  107. package/docs/usage/components/link.md +2 -2
  108. package/docs/usage/components/list-detail-screen.md +6 -6
  109. package/docs/usage/components/list-row.md +13 -4
  110. package/docs/usage/components/list.md +5 -4
  111. package/docs/usage/components/masonry.md +2 -1
  112. package/docs/usage/components/media-selection-screen.md +11 -5
  113. package/docs/usage/components/mentions.md +2 -2
  114. package/docs/usage/components/menu.md +3 -2
  115. package/docs/usage/components/menubar.md +2 -2
  116. package/docs/usage/components/message-composer.md +3 -3
  117. package/docs/usage/components/moderation-screen.md +3 -2
  118. package/docs/usage/components/notice.md +2 -2
  119. package/docs/usage/components/notification-inbox-screen.md +1 -1
  120. package/docs/usage/components/notification-item.md +2 -2
  121. package/docs/usage/components/number-field.md +3 -3
  122. package/docs/usage/components/otp-field.md +1 -1
  123. package/docs/usage/components/overview-screen.md +1 -1
  124. package/docs/usage/components/permission-screen.md +1 -1
  125. package/docs/usage/components/photo-source-sheet.md +1 -1
  126. package/docs/usage/components/popover.md +2 -2
  127. package/docs/usage/components/profile-screen.md +1 -1
  128. package/docs/usage/components/progress.md +2 -2
  129. package/docs/usage/components/qr-code.md +2 -2
  130. package/docs/usage/components/radio-group.md +1 -2
  131. package/docs/usage/components/radio.md +1 -2
  132. package/docs/usage/components/result.md +1 -1
  133. package/docs/usage/components/saved-items-screen.md +4 -2
  134. package/docs/usage/components/screen-layout.md +4 -3
  135. package/docs/usage/components/search-field.md +1 -1
  136. package/docs/usage/components/search-screen.md +4 -4
  137. package/docs/usage/components/section.md +3 -3
  138. package/docs/usage/components/segmented-control.md +4 -4
  139. package/docs/usage/components/select.md +2 -3
  140. package/docs/usage/components/settings-screen.md +11 -49
  141. package/docs/usage/components/sheet.md +10 -5
  142. package/docs/usage/components/sidebar.md +1 -1
  143. package/docs/usage/components/skeleton.md +1 -1
  144. package/docs/usage/components/skip-nav.md +1 -1
  145. package/docs/usage/components/slider.md +2 -2
  146. package/docs/usage/components/spinner.md +2 -2
  147. package/docs/usage/components/splitter.md +1 -1
  148. package/docs/usage/components/statistic.md +5 -4
  149. package/docs/usage/components/steps.md +2 -2
  150. package/docs/usage/components/surface.md +2 -3
  151. package/docs/usage/components/switch.md +1 -1
  152. package/docs/usage/components/tabs.md +4 -4
  153. package/docs/usage/components/tag.md +2 -2
  154. package/docs/usage/components/tags-input.md +4 -4
  155. package/docs/usage/components/text-area.md +2 -3
  156. package/docs/usage/components/text.md +85 -4
  157. package/docs/usage/components/timeline.md +2 -2
  158. package/docs/usage/components/toast.md +17 -7
  159. package/docs/usage/components/toggle-group.md +3 -3
  160. package/docs/usage/components/tooltip.md +1 -1
  161. package/docs/usage/components/top-bar.md +5 -4
  162. package/docs/usage/components/top.md +3 -3
  163. package/docs/usage/components/transfer-list.md +5 -4
  164. package/docs/usage/components/upload-item.md +3 -3
  165. package/docs/usage/components/virtual-list.md +1 -0
  166. package/docs/usage/compositions/action-feedback.md +42 -6
  167. package/docs/usage/compositions/action-recovery-optimistic.md +6 -1
  168. package/docs/usage/compositions/action-recovery-save.md +19 -23
  169. package/docs/usage/compositions/action-recovery-undo.md +6 -1
  170. package/docs/usage/compositions/activity-status.md +11 -5
  171. package/docs/usage/compositions/collection-detail.md +2 -0
  172. package/docs/usage/compositions/command-records.md +15 -5
  173. package/docs/usage/compositions/common-message.md +4 -2
  174. package/docs/usage/compositions/common-notification.md +5 -3
  175. package/docs/usage/compositions/compound-controls.md +13 -5
  176. package/docs/usage/compositions/content-transition-comparison.md +2 -2
  177. package/docs/usage/compositions/date-entry.md +10 -5
  178. package/docs/usage/compositions/date-time-selection.md +3 -3
  179. package/docs/usage/compositions/design-profile-comparison.md +7 -5
  180. package/docs/usage/compositions/disclosure.md +1 -1
  181. package/docs/usage/compositions/document-resource.md +10 -3
  182. package/docs/usage/compositions/expo-interactions.md +3 -2
  183. package/docs/usage/compositions/family-drawer.md +9 -4
  184. package/docs/usage/compositions/field-group.md +7 -1
  185. package/docs/usage/compositions/floating-action-button.md +18 -18
  186. package/docs/usage/compositions/illustrated-outcome.md +3 -2
  187. package/docs/usage/compositions/input-sheet.md +6 -2
  188. package/docs/usage/compositions/interaction-adapters.md +1 -1
  189. package/docs/usage/compositions/interaction-flow-apply.md +6 -3
  190. package/docs/usage/compositions/interaction-flow-draft.md +5 -2
  191. package/docs/usage/compositions/interaction-flow-search.md +5 -2
  192. package/docs/usage/compositions/live-list.md +7 -5
  193. package/docs/usage/compositions/navigation-bar-collection.md +8 -7
  194. package/docs/usage/compositions/optional-adapters.md +1 -1
  195. package/docs/usage/compositions/origin-dialog.md +5 -5
  196. package/docs/usage/compositions/paper-surface.md +1 -1
  197. package/docs/usage/compositions/photo-source.md +1 -1
  198. package/docs/usage/compositions/purpose-input-comment.md +5 -3
  199. package/docs/usage/compositions/purpose-input-message.md +5 -3
  200. package/docs/usage/compositions/reference-first.md +63 -42
  201. package/docs/usage/compositions/reference-review.md +60 -50
  202. package/docs/usage/compositions/reference-settings.md +60 -50
  203. package/docs/usage/compositions/selection-scope.md +48 -35
  204. package/docs/usage/compositions/stea-order-progress.md +1 -0
  205. package/docs/usage/compositions/stea-otp-verify.md +5 -3
  206. package/docs/usage/compositions/stea-pixel-empty.md +3 -3
  207. package/docs/usage/compositions/time-selection.md +6 -5
  208. package/docs/usage/compositions/upload-recovery.md +10 -1
  209. package/docs/usage/compositions/video-dialog.md +10 -3
  210. package/docs/usage/compositions/web-additions.md +5 -5
  211. package/docs/usage/compositions/web-navigation.md +1 -1
  212. package/docs/usage/screens/common-chat.md +21 -8
  213. package/docs/usage/screens/common-comments.md +13 -1
  214. package/docs/usage/screens/common-inbox.md +19 -6
  215. package/docs/usage/screens/common-login.md +19 -7
  216. package/docs/usage/screens/common-profile.md +22 -9
  217. package/docs/usage/screens/common-saved.md +16 -2
  218. package/docs/usage/screens/common-search.md +24 -4
  219. package/docs/usage/screens/common-settings.md +22 -50
  220. package/docs/usage/screens/common-shell.md +14 -2
  221. package/docs/usage/screens/dashboard.md +52 -109
  222. package/docs/usage/screens/discovery-gallery.md +57 -148
  223. package/docs/usage/screens/flow-collection.md +38 -9
  224. package/docs/usage/screens/flow-editor.md +25 -7
  225. package/docs/usage/screens/flow-media.md +23 -7
  226. package/docs/usage/screens/flow-moderation.md +15 -2
  227. package/docs/usage/screens/flow-onboarding.md +3 -3
  228. package/docs/usage/screens/flow-permission.md +17 -3
  229. package/docs/usage/screens/landing.md +37 -20
  230. package/docs/usage/screens/mockup-studio.md +22 -7
  231. package/docs/usage/screens/notification-settings.md +18 -4
  232. package/docs/usage/screens/product-bento.md +18 -9
  233. package/docs/usage/screens/reference-comparison.md +29 -10
  234. package/docs/usage/tokens/color.md +6 -3
  235. package/docs/usage/tokens/elevation-opacity.md +4 -2
  236. package/docs/usage/tokens/font-roles.md +2 -2
  237. package/docs/usage/tokens/layers.md +3 -3
  238. package/docs/usage/tokens/motion.md +2 -2
  239. package/docs/usage/tokens/radius.md +4 -2
  240. package/docs/usage/tokens/spacing.md +3 -3
  241. package/docs/usage/tokens/theme-studio.md +2 -2
  242. package/docs/usage/tokens/typography-studio.md +14 -8
  243. package/docs/usage/tokens/typography.md +15 -5
  244. package/package.json +1 -1
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "schemaVersion": 1,
3
- "designSystemVersion": "1.18.0",
3
+ "designSystemVersion": "1.19.0",
4
4
  "source": "packages/design-contracts/docs/generated/showcase-manifest.json",
5
5
  "surfaces": {
6
6
  "web": {
7
7
  "packageName": "@hjmds/react",
8
- "packageVersion": "1.18.0",
8
+ "packageVersion": "1.19.0",
9
9
  "activeComponents": 103,
10
10
  "claimedComponents": 103,
11
11
  "completeScenarioComponents": 103,
@@ -5642,7 +5642,7 @@
5642
5642
  },
5643
5643
  "native": {
5644
5644
  "packageName": "@hjmds/react-native",
5645
- "packageVersion": "1.18.0",
5645
+ "packageVersion": "1.19.0",
5646
5646
  "activeComponents": 83,
5647
5647
  "claimedComponents": 83,
5648
5648
  "completeScenarioComponents": 83,
@@ -1,6 +1,6 @@
1
1
  # Renderer evidence coverage
2
2
 
3
- > Generated for HJM 1.18.0. Do not edit directly; run `pnpm evidence:sync`.
3
+ > Generated for HJM 1.19.0. Do not edit directly; run `pnpm evidence:sync`.
4
4
 
5
5
  This projection joins the canonical surface maturity manifest with first-party renderer claims. Missing scenarios are explicit beta promotion debt; stable surfaces are blocked by CI until none remain.
6
6
 
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "schemaVersion": 2,
3
- "designSystemVersion": "1.18.0",
3
+ "designSystemVersion": "1.19.0",
4
4
  "packageName": "@hjmds/design-contracts",
5
5
  "components": [
6
6
  {
@@ -24,3 +24,5 @@ Both Storybooks: `컴포넌트 / Display / Gravity Letters`, with Default, Dark
24
24
  and LargeText. Web glyph typography can be inherited from a surrounding heading
25
25
  Text. Renderer behavior tests cover explicit replay and motion bypass; Native
26
26
  mock tests do not prove actual device rendering.
27
+
28
+ 장식 animation 생성이 중간에 실패하면 이미 만든 animation을 정리하고 정적인 글자를 유지한다. 장식 실패로 본문을 제거하지 않는다.
@@ -9,3 +9,5 @@
9
9
  Web은 WAAPI, Native는 Core Animated를 사용한다. Native 화면이 mounted인 채 가려지면 제품이 active=false를 전달해야 한다. 부모를 이미지 크기에 맞게 배치하며, 둥근 이미지 모서리가 필요하면 동일한 클리핑 프레임으로 둘을 감싼다.
10
10
 
11
11
  양쪽 Storybook 컴포넌트/시각 효과/Grid Reveal에서 Default/Dark/LargeText, 다시 보기와 이미지 실패/재시도를 제공한다. 예제 풍경은 코드로 만든 자체 이미지다. [Native 후속 검증](../../../docs/evidence/component-flows-2026-10-01/README.md)에서 기존 iPhone 17 / iOS 27 시뮬레이터의 큰 글씨 오류·재시도 화면을 실제 조작하고 확인했다. Image 계약에 따라 오류 전후 같은 이미지 설명을 유지하며, 시각적 오류 문구는 중복 접근성 이름으로 읽지 않는다. 물리 기기의 GPU 비용과 프레임별 효과 타이밍 검증은 별도다.
12
+
13
+ 장식 animation 생성이 중간에 실패하면 이미 만든 animation과 마스크를 정리하여 본문을 즉시 드러낸다.
package/docs/layout.md CHANGED
@@ -69,8 +69,8 @@ Web의 `footer` slot은 `Layout`이 `<footer>` contentinfo를 정확히 한 번
69
69
  `BottomNavigation`은 자체 루트를 이름 있는 `<nav>`로 렌더링하고 contentinfo를
70
70
  만들지 않으므로 `footer={<BottomNavigation ... />}` 합성 결과도 `<footer>` 하나와
71
71
  `<nav>` 하나다. Native `Layout`은 같은 source order만 유지하며 skip link를
72
- 렌더링하거나 요구하지 않는다. `skipLinkLabel` Native prop은 이전 호출부 호환을
73
- 위해 deprecated 상태로만 남아 있다.
72
+ 렌더링하거나 요구하지 않는다. Native `LayoutProps`에는 `skipLinkLabel`이 없다.
73
+ Web의 skip-link 입력을 Native에 공통 props로 넘기지 않는다.
74
74
 
75
75
  **현재 검증.** 공통 descriptor를 직접 소비하는 first-party Web/RN renderer가 실제
76
76
  landmark, source order, overlay adapter를 검증한다. Web Chromium test는 skip-link가 첫
package/docs/load-more.md CHANGED
@@ -28,6 +28,11 @@ ready(requestKey) ─ request ─→ loading(requestKey)
28
28
  - loading copy는 status로, 오류는 alert로 한 번만 발표합니다. retry/manual target은 44-unit
29
29
  이상이고 focus indicator를 유지합니다.
30
30
 
31
+ 2026-10-13 수명 검수: 성공으로 완료된 Native viewport 요청만 같은 cursor의 자동 재요청을
32
+ 막는다. 진행 중 다른 요청에 막힌 cursor와 실패한 요청은 재시도할 수 있다. Web/Native 모두
33
+ unmount 또는 mode 변경으로 교체된 footer의 늦은 outcome/error 콜백을 전달하지 않는다.
34
+ 제품 query 자체의 취소·데이터 저장은 여전히 제품 adapter가 소유한다.
35
+
31
36
  Web `IntersectionObserver`와 RN `onEndReached`는 감지 방식만 다르며 같은 controller와 state를
32
37
  사용합니다. 페이지 번호가 필요한 탐색은 `Pagination`, 사용자 의도 없이 계속 이어지는 긴
33
38
  목록은 `LoadMore`로 분리합니다.
@@ -1,6 +1,8 @@
1
- # 1.11 호환 API 제거와 소비 이관
1
+ # Native 호환 API 제거와 소비 이관
2
2
 
3
- 검토일: 2026-10-06 · 1.11 minor 소스 변경 · npm 게시와 소비 설치는 별도 확인
3
+ 검토일: 2026-10-13 · 잔여 시각 style 제거는 breaking 소스 변경 · npm 게시와 소비 설치는 별도 확인
4
+
5
+ ## 1.11 제거 이력
4
6
 
5
7
  사용자가 전체 소비 앱을 함께 버전업하므로 구형 호환 API도 제거하라고 요청했다.
6
8
  별칭과 deprecated 스타일 통로를 유지하는 대신 기존 canonical API로 이관한다.
@@ -46,34 +48,39 @@ renderer에 주입하는 이미지 스타일, 제품 소유 슬롯과 private re
46
48
  LoadMore의 내부 Button 조합은 비공개 RecipeButton을 써서 recipe의 크기·색·그림자를 보존한다.
47
49
  해당 구현을 패키지 entry에서 export하지 않는다.
48
50
 
49
- ## 1.13 deprecated 시각 style (제거는 다음 major)
51
+ ## 2026-10-13 잔여 시각 style 제거
52
+
53
+ 1.13에서는 2026-10-06에 발견한 잔여 raw `StyleProp` 통로의 동작을 유지하고 개발 모드에서
54
+ 한 번 경고했다. 이는 당시 minor 호환성 조치였다. 2026-10-13 레거시 제거 요구에 따라 아래
55
+ 공개 속성과 시각 style 병합을 소스에서 제거했다. 최초 major 후보를 준비한 뒤 사용자가
56
+ 이번 버전도 minor로 올리도록 명시하여 **1.19.0**으로 결정했다. 호환성이 깨지는 제거이므로
57
+ 아래 소비 호출을 함께 이관한다. 버전 준비·npm 게시·소비 설치는 각각 별도로 확인한다.
50
58
 
51
- 2026-10-06 사용 지침 작성 중 위 표 밖의 Native 컴포넌트가 아직 raw `StyleProp` 시각 통로를
52
- 받는 것을 확인했다. 1.11처럼 minor에서 지우거나 Button처럼 throw하면 1.x 소비 앱이 깨지므로
53
- 이번 minor는 동작을 유지한 채 `@deprecated` JSDoc과 개발 모드 1회 `console.warn`
54
- (`internal/deprecated-style.ts`, 컴포넌트·prop마다 한 번, production 무음)만 단다. 없던 곳에는
55
- `layoutStyle`을 추가했다. 실제 삭제는 [consumer-policy §3.1](consumer-policy.md#31-react-native-legacy-style-compatibility-boundary)의
56
- 네 조건을 채운 다음 major에서 한다.
59
+ 정식 배치는 [consumer-policy §3.1](consumer-policy.md#31-배치와-시각-값)을 따른다.
60
+ 제거 속성은 타입 오류다. JavaScript 호출도 더 이상 외형을 바꾸지 못하며, host로 나머지 props를
61
+ 전달하는 컴포넌트는 제거 속성을 명시적으로 거부한다. 그 외 컴포넌트의 미지정 속성 무시는
62
+ 호환 지원을 뜻하지 않는다. 일반 Link 아이콘·Dialog 오류 진단은 `internal/diagnostics.ts`로
63
+ 분리해 보존했다.
57
64
 
58
- | 컴포넌트 | deprecated prop | 대체 |
65
+ | 컴포넌트 | 제거한 prop | 대체 |
59
66
  | --- | --- | --- |
60
67
  | IconButton, Link, BottomCTA, Agreement, Asset, AssetGroup, AuthProviderButton, BottomInfo, Carousel, Collapsible, Container, Section, Icon, Steps, Top, UploadItem | `style` | 배치는 `layoutStyle`, 외형은 각 recipe·semantic prop |
61
68
  | Heading | `style`(TextStyle) | `layoutStyle`, 크기·굵기는 `level` |
62
69
  | Badge, Tag | `style`, `labelStyle` | `layoutStyle`, `tone`/`size`/`variant` |
63
- | ListRow | `titleStyle`, `descriptionStyle` | `density`·`selected`, listRowRecipe typography |
70
+ | ListRow | `titleStyle`, `descriptionStyle` | `density`·`selected`·`tone="danger"`, listRowRecipe typography |
64
71
  | Avatar | `style`, `imageStyle` | `layoutStyle`, `size`/`renderFallback` |
65
72
  | Divider, CounterBadge, List, Timeline | `style` | `layoutStyle`, 각 컴포넌트 축 |
66
73
  | Accordion | `style`, `itemStyle`, `triggerStyle`, `titleStyle`, `indicatorStyle`, `panelStyle` | `layoutStyle`, `density`/`renderIndicator` |
67
74
  | DescriptionList, StatisticGroup | `style`, `itemStyle` | `layoutStyle`, descriptor·`density` |
68
75
  | Statistic | `style`, `labelStyle`, `valueStyle`, `affixStyle`, `trendStyle`, `hintStyle` | `layoutStyle`, `density`/`presentation` |
69
76
  | Notice, Result, Spinner, Skeleton, Toast | `style` | `layoutStyle`, `tone`/`status`/`size`/`shape`·`width`·`height` |
70
- | EmptyState | `style`, `illustrationStyle`, `titleStyle`, `descriptionStyle`, `actionStyle` | `layoutStyle`, `density`/`align` |
77
+ | EmptyState | `style`, `illustrationStyle`, `titleStyle`, `descriptionStyle`, `actionStyle` | `layoutStyle`, `density`/`align`. illustration은 최소 크기와 실제 콘텐츠 크기를 함께 존중 |
71
78
  | Progress | `style`, `labelStyle`, `valueStyle`, `trackStyle`, `indicatorStyle` | `layoutStyle`, `tone`/`size`/`shape` |
72
79
  | ToastRegion | `style`, `toastStyle` | `layoutStyle`, `placement`/`safeAreaInsets` |
73
- | AlertDialog, Sheet | `contentStyle`의 배치 밖 key | 배치 key만 사용. 다음 major에서 Dialog처럼 `HjmCompositionStyleProp`으로 좁힘(배치 key만 넘기면 경고 없음) |
80
+ | AlertDialog, Sheet | `contentStyle`의 배치 밖 key | `HjmCompositionStyleProp` 배치 key만 사용. AlertDialog 크기는 `size="small" | "medium" | "large"` |
74
81
  | Tabs | `style`, `tabListStyle` / TabPanel `style` | `layoutStyle`, `size`/`layout`/`overflow`/`appearance` |
75
82
  | BottomNavigation | `style`, `surfaceStyle`, `listStyle`, `primaryActionStyle` | `layoutStyle`, `configuration` |
76
- | TopBar | `style`, `leadingStyle`, `titleStyle`, `trailingStyle` / TopBar action `style`, `labelStyle` | `layoutStyle`, `centered`/`labelVisibility` |
83
+ | TopBar | `style`, `leadingStyle`, `titleStyle`, `trailingStyle` | `layoutStyle`, `centered`/`labelVisibility` |
77
84
  | Menu | `style` | `layoutStyle`, `density` |
78
85
  | Checkbox, Radio, CheckboxGroup, RadioGroup | `style`, `controlStyle`, `indicatorStyle`, `leadingStyle`, `contentStyle`, `labelStyle`, `descriptionStyle` | `layoutStyle`(행 또는 그룹), selection control recipe |
79
86
  | Switch, SegmentedControl, Form, Select, Combobox, TagsInput, ToggleGroup, DatePicker, FilePicker, TransferList | `style` | `layoutStyle`, 각 컴포넌트 `size`·descriptor |
@@ -85,9 +92,10 @@ LoadMore의 내부 Button 조합은 비공개 RecipeButton을 써서 recipe의
85
92
 
86
93
  제외(정식 host·renderer 스타일): KeyboardAvoiding·KeyboardDock(플랫폼 host), Image·ImageAdapter `style`(renderer 주입),
87
94
  EffectSurface·ThinkingOrb·SharedTransition(optional motion host frame), Text·Stack·AspectRatio·Grid·Layout(내부 조합 전반이
88
- 쓰는 layout primitive라 경고하면 HJM 자신이 경고를 낸다. 내부 renderer 분리 후 별도 train에서 다룬다).
95
+ 쓰는 layout primitive). TopBar `renderAction`에 주입하는 action appearance의 `style`·`labelStyle`,
96
+ Section 슬롯과 Chip leading/indicator/trailing의 정식 배치 속성도 보존한다.
89
97
 
90
- 이관: 경고 문구의 prop을 찾아 margin·width·flex·alignSelf만 남긴 값은 `layoutStyle`로 옮기고, 색·글꼴·padding·
98
+ 이관: 위 표의 호출과 래퍼 전파를 찾아 margin·width·flex·alignSelf만 남긴 값은 `layoutStyle`로 옮기고, 색·글꼴·padding·
91
99
  높이·radius는 semantic prop으로 옮긴다. 표현할 축이 없으면 `.hjm-*`·style 우회 대신 계약 공백으로 올린다.
92
100
 
93
101
  ## 관리 소비 저장소
@@ -95,7 +103,12 @@ EffectSurface·ThinkingOrb·SharedTransition(optional motion host frame), Text·
95
103
  번뚝·다에리·비행중·모펀의 직접 호출과 제품 래퍼를 함께 이관한다. 스핀트·유틸버스·포트폴리오
96
104
  사이트·App Release Hub도 새 공개 타입으로 검사한다. 웹과 앱이 있는 제품은 양쪽을 확인한다.
97
105
  소스 검사, 새 패키지 설치/lock 갱신, 기기 검증, npm 게시·운영 배포는 별개의 단계다.
98
- 로컬 후보 선언을 연결한 검사만으로 게시된 1.11 소비 설치를 주장하지 않는다.
106
+ 로컬 후보 선언을 연결한 검사만으로 게시된 패키지의 소비 설치를 주장하지 않는다.
107
+
108
+ 설치된 1.18.0에도 있는 `layoutStyle` 이관은 먼저 적용할 수 있다. 새 `ListRow.tone`과
109
+ `AlertDialog.size`는 후보 패키지에만 있으므로 기존 1.18.0 선언을 캐스트로 우회하지 않는다.
110
+ Utilverse 계정 탈퇴 행과 BurnTok 대화상자 크기 어댑터는 새 패키지 설치·타입검사와 함께
111
+ 이관해야 한다. 이 두 호출이 남아 있는 동안 해당 흐름의 로컬 소스 모드를 완료로 보고하지 않는다.
99
112
 
100
113
  ## Storybook
101
114
 
@@ -172,3 +172,7 @@ existing Avatar. They are optional factories, not new canonical components or
172
172
  root exports. See the [fallback contract](avatar-fallback.md) for installation,
173
173
  source recovery and identity/accessibility rules. This addition does not imply
174
174
  that the earlier device evidence covers Blobatar.
175
+
176
+ ### 사진 앨범 탐색과 로딩 (2026-10-12)
177
+
178
+ `CarouselMotion`의 선택적 `navigation="counter"`는 이전·현재/전체·다음 한 줄 컨트롤을 Web/Native에 제공한다. 기존 기본 버튼 탐색·유한한 keyed selection·숨겨진 항목의 초점 차단·동작 줄이기 계약은 유지한다. 번뚝의 사진 넘김을 기존 모션 어댑터에 연결하기 위한 표현이며 새 어댑터/peer를 만들지 않는다. `ImageViewer`의 loading 상태는 액자 중앙 Spinner와 접근성 전용 loadingLabel을 사용한다. 제품의 private query·Expo onDisplay·cachePolicy=none은 host 책임이다.
@@ -180,6 +180,10 @@ import { SearchScreen } from "@hjmds/react/screen-flows";
180
180
  Native는 import만 해당 renderer의 `screen-flows`로 바꾸고 플랫폼별 자식/host를 제공한다.
181
181
  React Query 등을 쓰는 제품은 이 화면의 callback을 기존 제품 query 상태와 연결하며 별도 캐시를 만들지 않는다.
182
182
  필터 변경은 debounce query 변경과 독립적이므로 제품 query key에 필터도 포함한다.
183
+
184
+ `debounceMs` 기본값은 `searchScreenRecipe.debounceMs`(300ms)이며 양 renderer가
185
+ `resolveSearchDebounceMs`로 해석한다. 0과 유한한 사용자 지연은 유지하고 음수는 기존처럼 0으로
186
+ 맞춘다. `NaN`·±`Infinity`는 호스트 타이머마다 다르게 해석될 수 있어 예약 전에 `RangeError`로 거부한다.
183
187
  예제 미디어는 로컬 샘플 사진과 모의 업로드이며 기기 갤러리·네트워크 업로드를 실행하지 않는다.
184
188
  예제 권한은 상태 분기만 보여 주며 실제 OS 권한을 바꾸지 않는다.
185
189
 
@@ -303,7 +307,7 @@ SearchScreen accepts a queryField slot for an existing accessible SearchField wi
303
307
  | 레일 첫 칩(`filterSheet.trigger`)은 HJM이 그리고 이름에 적용 개수를 넣는다(Web `aria-haspopup="dialog"`) | 적용 칩·모두 해제 뒤 포커스가 돌아갈 고정 대상이 필요하다 | 제품이 trigger를 그림(포커스 복귀 대상을 HJM이 모름) |
304
308
  | Web: 적용 칩·최근 검색 행을 지우면 같은 자리 다음 항목, 없으면 trigger(최근 검색은 입력)로 포커스. 목록이 실제로 줄어든 뒤에 옮긴다(`resolveFocusAfterRemoval`). Native는 옮기지 않는다 | 지운 버튼이 사라져 포커스가 `<body>`로 떨어지는 것을 막는다. Native는 프로그램 포커스 이동이 화면을 다시 읽게 해 낭독 커서를 그대로 둔다 | 항상 입력으로 이동(칩 줄 탐색이 끊김) |
305
309
  | 개수 낭독은 HJM: 입력 중 "제안 N개", 결과 개수, `searching`이면 `searchingLabel`. Web은 숨긴 `role="status"`, Native는 `announceForAccessibilityWithOptions(queue)`. 문구가 바뀔 때만 | 제품마다 live region을 다시 만들면 중복·누락 낭독이 생긴다 | 제품 소유 |
306
- | `resultSummary.count === null`이면 결과 머리 개수 자리에 Skeleton, `children` 대신 로딩 행 4개(`searchScreenRecipe.loadingRows`). Web은 ListRow `loading`(행 높이 유지) | 결과가 도착할 때 목록이 뛰지 않는다 | spinner로 본문 교체(`state="loading"`, 입력·필터·이전 결과가 사라짐) |
310
+ | `resultSummary.count === null`이면 결과 머리 개수 자리에 Skeleton, `children` 대신 로딩 행 4개(`searchScreenRecipe.loadingRows`). 양 renderer는 ListRow `loading`으로 같은 두 줄 행 geometry를 사용하며 첫 행에만 loadingLabel을 제공 | 결과가 도착할 때 목록이 뛰지 않는다 | spinner로 본문 교체(`state="loading"`, 입력·필터·이전 결과가 사라짐) |
307
311
  | 정렬은 결과 머리 끝 Menu(single). 바꾸면 본문을 맨 위로 | Menu 지침이 정렬을 용도로 명시. 시트 안 정렬은 정렬 하나에 시트 왕복이 필요 | 필터 시트 안 정렬 |
308
312
  | `queryLabelVisibility="hidden"`: 보이는 label을 빼고 `queryLabel`을 접근성 이름(Web `aria-label`, Native `accessibilityLabel`)과 placeholder로 쓴다 | 참고 서비스 공통 모양. 1배 약 22, 2배 약 40만큼 고정 영역을 아낀다(2026-10-06 실측). placeholder가 검색 대상을 알린다(Apple HIG) | placeholder 없이 숨김(보이는 이름이 없는 입력) |
309
313
  | `searching`+`searchingLabel`: Web `loading`, Native `busy`+`busyLabel`을 한 이름으로. 둘 다 주거나 둘 다 생략(타입) | 2026-10-06 utilverse 적용 조사: 진행 표시 하나 때문에 제품이 입력을 `queryField`로 통째로 바꿨다 | 플랫폼별 이름 그대로 노출 |
@@ -387,3 +391,21 @@ CommentThreadScreen의 optional threadHeader는 첫 댓글 앞의 스크롤 콘
387
391
  모두 같은 본문에 배치하고 상태 교체 시 함께 숨긴다. fixed header는 짧은 탐색 영역, composer는
388
392
  고정 작성 영역이다. Spint의 2026-10-08 이중 스크롤 문제 때문에 추가했으며 상세 사용법은
389
393
  [댓글 화면](usage/components/comment-thread-screen.md#배치)을 따른다.
394
+
395
+
396
+ ### 화면별 독립 복구와 첫 행동 (미게시, 1.18.0 이후)
397
+
398
+ 2026-10-13 계층 점검에서 빈 채팅의 첫 입력이 사라지고 상세 조회 실패를 제품이 다시 조립해야 하는
399
+ 누락을 확인했다. 기존 화면 API를 다음과 같이 보강한다.
400
+
401
+ - `ChatScreen`은 ready뿐 아니라 empty에서도 composer를 유지한다. loading/error/restricted에서는
402
+ 입력을 숨긴다. 전송 실패는 ready/empty를 유지하고 notice로 알린다.
403
+ - `ListDetailScreen.detail`에 선택 `state`, `stateAction`, `notice`를 받는다. 상세만 본문 교체 또는
404
+ 비차단 실패를 표현하고 숨겨진 목록의 입력·스크롤은 유지한다. 기존 title/content는 호환된다.
405
+ - `OnboardingScreen`은 complete.pending 또는 skip.pending 동안 다음·이전·완료·건너뛰기를
406
+ 함께 잠근다. 제품의 입력값과 라우터 이탈 처리는 제품 소유다.
407
+ - `CommentThreadScreen`은 루트마다 전체 items를 재탐색하지 않고 한 번 만든 부모별 인덱스로
408
+ 답글을 읽는다. 루트·답글의 서버 순서와 펼침·동작 계약은 유지한다. 가상화 구현은 아니다.
409
+
410
+ 검증: 각 renderer의 `screen-recovery` 테스트. Web은 Chromium 동작 검사, Native는 host 렌더 검사이며
411
+ 실기기 성능·운영 서버·npm 게시·소비 앱 반영을 뜻하지 않는다.
package/docs/toast.md CHANGED
@@ -45,7 +45,7 @@ const result = store.publish({
45
45
  `accessibilityLabel`에 완전한 이름을 제공합니다.
46
46
  - 기본 알림과 리퀴드 알림은 모두 표시 후 3초에 자동 닫힘을 시작합니다. 리퀴드는 진입 연출 동안 타이머를 멈춥니다.
47
47
  2026-10-02 사용자 요청으로 기존 5초 기본값·최솟값을 3초로 변경했습니다.
48
- - action이 있는 Toast는 기본 persistent입니다. 제품이 명시한 `durationMs`도 3000ms보다
48
+ - action 또는 press가 있는 Toast는 기본 persistent입니다. 제품이 명시한 `durationMs`도 3000ms보다
49
49
  짧아질 수 없으며, `null`은 명시적 persistent입니다.
50
50
 
51
51
  `publish` 결과에는 stable id와 `visible | queued` 위치가 포함됩니다. 호출자는 반환된 함수
@@ -93,11 +93,50 @@ queued(waiting, 3000) ─ show ─→ visible(running, 3000)
93
93
  `action` reason으로 닫으며, `dismissOnAction: false`면 알림은 남지만 같은 action은 다시
94
94
  실행되지 않습니다. stable id update는 새 revision이므로 새 action을 한 번 실행할 수 있습니다.
95
95
 
96
- `timeout | action | close-action | escape | swipe | programmatic | queue-overflow | interrupted`
96
+ `timeout | action | press | close-action | escape | swipe | programmatic | queue-overflow | interrupted`
97
97
  reason 중 하나만 최종 `onDismiss`로 전달됩니다. visible Toast는 exit 완료 시 callback을
98
98
  정산하고 queued overflow와 provider teardown은 visual exit 없이 즉시 정산합니다. 중복 action,
99
99
  close, exit complete와 두 번째 provider dispose는 아무 상태도 바꾸지 않습니다.
100
100
 
101
+ ## 카드 전체 활성화 — 2026-10-13 (미게시)
102
+
103
+ 댓글·답장 알림에서 카드 본문을 눌러 관련 화면으로 이동하도록 `press`를 추가했다.
104
+ 기존 `action`은 보이는 실행 버튼, `press`는 카드의 본문·미디어·여백을 누르는 동작이다.
105
+ 별도 알림 컴포넌트를 만들지 않고 동일 Toast descriptor/session/store에 연결한다.
106
+
107
+ ```ts
108
+ store.publish({
109
+ id: "reply:42",
110
+ title: t("reply.receivedTitle"),
111
+ description: t("reply.receivedBody"),
112
+ closeLabel: t("common.closeNotification"),
113
+ press: { accessibilityLabel: t("reply.open"), onPress: openReply },
114
+ });
115
+ ```
116
+
117
+ 참조 분석: MIT [expo-dynamic-notifications `use-dismiss-gesture.ts` @ 5de059a](https://github.com/rit3zh/expo-dynamic-notifications/blob/5de059a5cbefbe28c14efbe785166665a7c70bc5/src/hooks/use-dismiss-gesture.ts)는
118
+ `Gesture.Exclusive(pan, tap)`으로 입력을 나누고 성공한 탭에서 콜백 후 dismiss를 예약한다.
119
+ HJM은 그 동작 순서를 독립 구현한다. Native 표준/리퀴드와 Web이 같은 순수 session을 사용하며,
120
+ 이미 존재하는 큐·타이머를 교체하거나 optional gesture 의존성을 표준 Toast에 추가하지 않는다.
121
+
122
+ - `press.accessibilityLabel`과 `press.onPress`는 필수. 라우팅과 문구는 제품 소유다.
123
+ - 카드·실행·닫기는 형제 조작이다. Web의 실제 button은 Tab·Enter·Space와 포커스 표시를 제공한다.
124
+ Native는 독립 Pressable과 읽을 수 있는 이름/설명을 제공하고, 리퀴드의 상위 swipe responder가 탭을 취소한다.
125
+ - `invokePress`는 visible revision당 한 번 실행하고 콜백 뒤 `press` 사유로 닫는다.
126
+ action/press의 재진입과 이미 닫히는 카드의 입력은 무시한다. 콜백이 같은 id를 새 revision으로 갱신하면
127
+ 새 내용을 닫지 않으며, provider가 제거되면 기존 `interrupted` 정산을 보존한다.
128
+ - 동기 콜백이 throw해도 닫힘을 시작하고 오류를 호출자에게 전달한다. 비동기 라우팅/요청 완료는 기다리지 않는다.
129
+ - press가 있으면 기본 persistent, 명시적 duration은 기존 3초 하한을 적용한다. press가 없으면 기존 동작 그대로다.
130
+ - 검증 파일: `test/toast-press.test.ts`(contracts), `packages/react/test/toast-press.browser.test.tsx`,
131
+ `packages/react-native/test/toast-press.test.tsx`, `packages/react-native/test/toast-liquid.test.tsx`.
132
+ Native host 테스트는 실제 기기 hit-test·스크린리더 검증이나 소비 앱 적용 증거가 아니다.
133
+
134
+ 검증: 계약 41개, Web Chromium 11개, Native host 20개의 관련 테스트 통과.
135
+ 세 패키지와 두 Showcase 타입 검사, 세 패키지 빌드 및 Web light/dark 기본 글자 화면을 확인했다.
136
+ 전체 회귀·실기기·npm 게시·소비 앱 적용은 미실행. `usage:sync`는 기존 다른 작업의
137
+ `components/carousel.md`·`components/chat-message.md` 절 형식 2건으로 실패했으며 해당 변경은 보존했다.
138
+ 공개 API 이름 대응표는 변경 없이 검사 통과했다.
139
+
101
140
  ## Renderer acceptance
102
141
 
103
142
  ### Compact Web layout — 2026-09-15