@qijenchen/design-system 0.1.0-beta.4 → 0.1.0-beta.6

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 (386) hide show
  1. package/dist/components/Accordion/accordion.d.ts +37 -0
  2. package/dist/components/Accordion/accordion.d.ts.map +1 -0
  3. package/dist/components/Accordion/accordion.js +78 -0
  4. package/dist/components/Accordion/accordion.js.map +1 -0
  5. package/dist/components/Alert/alert.d.ts +47 -0
  6. package/dist/components/Alert/alert.d.ts.map +1 -0
  7. package/dist/components/Alert/alert.js +132 -0
  8. package/dist/components/Alert/alert.js.map +1 -0
  9. package/dist/components/AppShell/_demo-helpers.d.ts +49 -0
  10. package/dist/components/AppShell/_demo-helpers.d.ts.map +1 -0
  11. package/dist/components/AppShell/app-shell.d.ts +76 -0
  12. package/dist/components/AppShell/app-shell.d.ts.map +1 -0
  13. package/dist/components/AppShell/app-shell.js +214 -0
  14. package/dist/components/AppShell/app-shell.js.map +1 -0
  15. package/dist/components/AspectRatio/aspect-ratio.d.ts +40 -0
  16. package/dist/components/AspectRatio/aspect-ratio.d.ts.map +1 -0
  17. package/dist/components/AspectRatio/aspect-ratio.js +23 -0
  18. package/dist/components/AspectRatio/aspect-ratio.js.map +1 -0
  19. package/dist/components/Avatar/avatar.d.ts +85 -0
  20. package/dist/components/Avatar/avatar.d.ts.map +1 -0
  21. package/dist/components/Avatar/avatar.js +195 -0
  22. package/dist/components/Avatar/avatar.js.map +1 -0
  23. package/dist/components/Badge/badge.d.ts +43 -0
  24. package/dist/components/Badge/badge.d.ts.map +1 -0
  25. package/dist/components/Badge/badge.js +69 -0
  26. package/dist/components/Badge/badge.js.map +1 -0
  27. package/dist/components/Breadcrumb/breadcrumb.d.ts +163 -0
  28. package/dist/components/Breadcrumb/breadcrumb.d.ts.map +1 -0
  29. package/dist/components/Breadcrumb/breadcrumb.js +305 -0
  30. package/dist/components/Breadcrumb/breadcrumb.js.map +1 -0
  31. package/dist/components/BulkActionBar/bulk-action-bar.d.ts +46 -0
  32. package/dist/components/BulkActionBar/bulk-action-bar.d.ts.map +1 -0
  33. package/dist/components/BulkActionBar/bulk-action-bar.js +78 -0
  34. package/dist/components/BulkActionBar/bulk-action-bar.js.map +1 -0
  35. package/dist/components/Button/button-group.d.ts +49 -0
  36. package/dist/components/Button/button-group.d.ts.map +1 -0
  37. package/dist/components/Button/button-group.js +46 -0
  38. package/dist/components/Button/button-group.js.map +1 -0
  39. package/dist/components/Button/button.d.ts +203 -0
  40. package/dist/components/Button/button.d.ts.map +1 -0
  41. package/dist/components/Button/button.js +309 -0
  42. package/dist/components/Button/button.js.map +1 -0
  43. package/dist/components/Calendar/calendar.d.ts +81 -0
  44. package/dist/components/Calendar/calendar.d.ts.map +1 -0
  45. package/dist/components/Calendar/calendar.js +282 -0
  46. package/dist/components/Calendar/calendar.js.map +1 -0
  47. package/dist/components/Carousel/carousel.d.ts +61 -0
  48. package/dist/components/Carousel/carousel.d.ts.map +1 -0
  49. package/dist/components/Carousel/carousel.js +276 -0
  50. package/dist/components/Carousel/carousel.js.map +1 -0
  51. package/dist/components/Chart/chart.d.ts +94 -0
  52. package/dist/components/Chart/chart.d.ts.map +1 -0
  53. package/dist/components/Chart/chart.js +233 -0
  54. package/dist/components/Chart/chart.js.map +1 -0
  55. package/dist/components/Checkbox/checkbox-group.d.ts +58 -0
  56. package/dist/components/Checkbox/checkbox-group.d.ts.map +1 -0
  57. package/dist/components/Checkbox/checkbox-group.js +28 -0
  58. package/dist/components/Checkbox/checkbox-group.js.map +1 -0
  59. package/dist/components/Checkbox/checkbox.d.ts +73 -0
  60. package/dist/components/Checkbox/checkbox.d.ts.map +1 -0
  61. package/dist/components/Checkbox/checkbox.js +125 -0
  62. package/dist/components/Checkbox/checkbox.js.map +1 -0
  63. package/dist/components/Chip/chip.d.ts +54 -0
  64. package/dist/components/Chip/chip.d.ts.map +1 -0
  65. package/dist/components/Chip/chip.js +224 -0
  66. package/dist/components/Chip/chip.js.map +1 -0
  67. package/dist/components/CircularProgress/circular-progress.d.ts +40 -0
  68. package/dist/components/CircularProgress/circular-progress.d.ts.map +1 -0
  69. package/dist/components/CircularProgress/circular-progress.js +118 -0
  70. package/dist/components/CircularProgress/circular-progress.js.map +1 -0
  71. package/dist/components/Coachmark/coachmark.d.ts +100 -0
  72. package/dist/components/Coachmark/coachmark.d.ts.map +1 -0
  73. package/dist/components/Coachmark/coachmark.js +107 -0
  74. package/dist/components/Coachmark/coachmark.js.map +1 -0
  75. package/dist/components/Combobox/combobox.d.ts +150 -0
  76. package/dist/components/Combobox/combobox.d.ts.map +1 -0
  77. package/dist/components/Combobox/combobox.js +595 -0
  78. package/dist/components/Combobox/combobox.js.map +1 -0
  79. package/dist/components/Command/command.d.ts +106 -0
  80. package/dist/components/Command/command.d.ts.map +1 -0
  81. package/dist/components/Command/command.js +123 -0
  82. package/dist/components/Command/command.js.map +1 -0
  83. package/dist/components/DataTable/active-editor-controller.d.ts +66 -0
  84. package/dist/components/DataTable/active-editor-controller.d.ts.map +1 -0
  85. package/dist/components/DataTable/cell-registry.d.ts +37 -0
  86. package/dist/components/DataTable/cell-registry.d.ts.map +1 -0
  87. package/dist/components/DataTable/cell-registry.js +377 -0
  88. package/dist/components/DataTable/cell-registry.js.map +1 -0
  89. package/dist/components/DataTable/column-types.d.ts +145 -0
  90. package/dist/components/DataTable/column-types.d.ts.map +1 -0
  91. package/dist/components/DataTable/column-types.js +17 -0
  92. package/dist/components/DataTable/column-types.js.map +1 -0
  93. package/dist/components/DataTable/data-table-column-visibility-panel.d.ts +49 -0
  94. package/dist/components/DataTable/data-table-column-visibility-panel.d.ts.map +1 -0
  95. package/dist/components/DataTable/data-table-filter-panel.d.ts +30 -0
  96. package/dist/components/DataTable/data-table-filter-panel.d.ts.map +1 -0
  97. package/dist/components/DataTable/data-table-interaction-layer.d.ts +78 -0
  98. package/dist/components/DataTable/data-table-interaction-layer.d.ts.map +1 -0
  99. package/dist/components/DataTable/data-table-interaction-layer.js +220 -0
  100. package/dist/components/DataTable/data-table-interaction-layer.js.map +1 -0
  101. package/dist/components/DataTable/data-table-sort-manager.d.ts +19 -0
  102. package/dist/components/DataTable/data-table-sort-manager.d.ts.map +1 -0
  103. package/dist/components/DataTable/data-table.d.ts +181 -0
  104. package/dist/components/DataTable/data-table.d.ts.map +1 -0
  105. package/dist/components/DataTable/data-table.js +1851 -0
  106. package/dist/components/DataTable/data-table.js.map +1 -0
  107. package/dist/components/DataTable/filter-operators.d.ts +116 -0
  108. package/dist/components/DataTable/filter-operators.d.ts.map +1 -0
  109. package/dist/components/DataTable/filter-tree.d.ts +66 -0
  110. package/dist/components/DataTable/filter-tree.d.ts.map +1 -0
  111. package/dist/components/DataTable/lib/column-meta.d.ts +49 -0
  112. package/dist/components/DataTable/lib/column-meta.d.ts.map +1 -0
  113. package/dist/components/DateGrid/date-grid.d.ts +61 -0
  114. package/dist/components/DateGrid/date-grid.d.ts.map +1 -0
  115. package/dist/components/DateGrid/date-grid.js +168 -0
  116. package/dist/components/DateGrid/date-grid.js.map +1 -0
  117. package/dist/components/DatePicker/date-picker.d.ts +119 -0
  118. package/dist/components/DatePicker/date-picker.d.ts.map +1 -0
  119. package/dist/components/DatePicker/date-picker.js +743 -0
  120. package/dist/components/DatePicker/date-picker.js.map +1 -0
  121. package/dist/components/DescriptionList/description-list.d.ts +60 -0
  122. package/dist/components/DescriptionList/description-list.d.ts.map +1 -0
  123. package/dist/components/DescriptionList/description-list.js +77 -0
  124. package/dist/components/DescriptionList/description-list.js.map +1 -0
  125. package/dist/components/Dialog/dialog.d.ts +54 -0
  126. package/dist/components/Dialog/dialog.d.ts.map +1 -0
  127. package/dist/components/Dialog/dialog.js +151 -0
  128. package/dist/components/Dialog/dialog.js.map +1 -0
  129. package/dist/components/DropdownMenu/dropdown-menu.d.ts +111 -0
  130. package/dist/components/DropdownMenu/dropdown-menu.d.ts.map +1 -0
  131. package/dist/components/DropdownMenu/dropdown-menu.js +288 -0
  132. package/dist/components/DropdownMenu/dropdown-menu.js.map +1 -0
  133. package/dist/components/Empty/empty.d.ts +40 -0
  134. package/dist/components/Empty/empty.d.ts.map +1 -0
  135. package/dist/components/Empty/empty.js +66 -0
  136. package/dist/components/Empty/empty.js.map +1 -0
  137. package/dist/components/Field/field-context.d.ts +77 -0
  138. package/dist/components/Field/field-context.d.ts.map +1 -0
  139. package/dist/components/Field/field-context.js +37 -0
  140. package/dist/components/Field/field-context.js.map +1 -0
  141. package/dist/components/Field/field-types.d.ts +5 -0
  142. package/dist/components/Field/field-types.d.ts.map +1 -0
  143. package/dist/components/Field/field-types.js +13 -0
  144. package/dist/components/Field/field-types.js.map +1 -0
  145. package/dist/components/Field/field-wrapper.d.ts +17 -0
  146. package/dist/components/Field/field-wrapper.d.ts.map +1 -0
  147. package/dist/components/Field/field-wrapper.js +252 -0
  148. package/dist/components/Field/field-wrapper.js.map +1 -0
  149. package/dist/components/Field/field.d.ts +127 -0
  150. package/dist/components/Field/field.d.ts.map +1 -0
  151. package/dist/components/Field/field.js +295 -0
  152. package/dist/components/Field/field.js.map +1 -0
  153. package/dist/components/FieldControlGroup/field-control-group.d.ts +74 -0
  154. package/dist/components/FieldControlGroup/field-control-group.d.ts.map +1 -0
  155. package/dist/components/FieldControlGroup/field-control-group.js +62 -0
  156. package/dist/components/FieldControlGroup/field-control-group.js.map +1 -0
  157. package/dist/components/FileItem/file-item.d.ts +44 -0
  158. package/dist/components/FileItem/file-item.d.ts.map +1 -0
  159. package/dist/components/FileItem/file-item.js +202 -0
  160. package/dist/components/FileItem/file-item.js.map +1 -0
  161. package/dist/components/FileUpload/file-upload.d.ts +97 -0
  162. package/dist/components/FileUpload/file-upload.d.ts.map +1 -0
  163. package/dist/components/FileUpload/file-upload.js +231 -0
  164. package/dist/components/FileUpload/file-upload.js.map +1 -0
  165. package/dist/components/FileViewer/file-viewer-types.d.ts +73 -0
  166. package/dist/components/FileViewer/file-viewer-types.d.ts.map +1 -0
  167. package/dist/components/FileViewer/file-viewer.d.ts +82 -0
  168. package/dist/components/FileViewer/file-viewer.d.ts.map +1 -0
  169. package/dist/components/FileViewer/file-viewer.js +752 -0
  170. package/dist/components/FileViewer/file-viewer.js.map +1 -0
  171. package/dist/components/FileViewer/image-renderer.d.ts +9 -0
  172. package/dist/components/FileViewer/image-renderer.d.ts.map +1 -0
  173. package/dist/components/FileViewer/image-renderer.js +165 -0
  174. package/dist/components/FileViewer/image-renderer.js.map +1 -0
  175. package/dist/components/HoverCard/hover-card.d.ts +30 -0
  176. package/dist/components/HoverCard/hover-card.d.ts.map +1 -0
  177. package/dist/components/HoverCard/hover-card.js +61 -0
  178. package/dist/components/HoverCard/hover-card.js.map +1 -0
  179. package/dist/components/Input/input.d.ts +72 -0
  180. package/dist/components/Input/input.d.ts.map +1 -0
  181. package/dist/components/Input/input.js +148 -0
  182. package/dist/components/Input/input.js.map +1 -0
  183. package/dist/components/LinkInput/link-input.d.ts +46 -0
  184. package/dist/components/LinkInput/link-input.d.ts.map +1 -0
  185. package/dist/components/LinkInput/link-input.js +215 -0
  186. package/dist/components/LinkInput/link-input.js.map +1 -0
  187. package/dist/components/Menu/menu-item.d.ts +83 -0
  188. package/dist/components/Menu/menu-item.d.ts.map +1 -0
  189. package/dist/components/Menu/menu-item.js +209 -0
  190. package/dist/components/Menu/menu-item.js.map +1 -0
  191. package/dist/components/NameCard/name-card.d.ts +85 -0
  192. package/dist/components/NameCard/name-card.d.ts.map +1 -0
  193. package/dist/components/NameCard/name-card.js +153 -0
  194. package/dist/components/NameCard/name-card.js.map +1 -0
  195. package/dist/components/Notice/notice.d.ts +69 -0
  196. package/dist/components/Notice/notice.d.ts.map +1 -0
  197. package/dist/components/Notice/notice.js +121 -0
  198. package/dist/components/Notice/notice.js.map +1 -0
  199. package/dist/components/NumberInput/number-input.d.ts +57 -0
  200. package/dist/components/NumberInput/number-input.d.ts.map +1 -0
  201. package/dist/components/NumberInput/number-input.js +131 -0
  202. package/dist/components/NumberInput/number-input.js.map +1 -0
  203. package/dist/components/OverflowIndicator/overflow-indicator.d.ts +23 -0
  204. package/dist/components/OverflowIndicator/overflow-indicator.d.ts.map +1 -0
  205. package/dist/components/OverflowIndicator/overflow-indicator.js +111 -0
  206. package/dist/components/OverflowIndicator/overflow-indicator.js.map +1 -0
  207. package/dist/components/PeoplePicker/avatar-stack-overflow.d.ts +57 -0
  208. package/dist/components/PeoplePicker/avatar-stack-overflow.d.ts.map +1 -0
  209. package/dist/components/PeoplePicker/avatar-stack-overflow.js +35 -0
  210. package/dist/components/PeoplePicker/avatar-stack-overflow.js.map +1 -0
  211. package/dist/components/PeoplePicker/people-picker-helpers.d.ts +7 -0
  212. package/dist/components/PeoplePicker/people-picker-helpers.d.ts.map +1 -0
  213. package/dist/components/PeoplePicker/people-picker-helpers.js +25 -0
  214. package/dist/components/PeoplePicker/people-picker-helpers.js.map +1 -0
  215. package/dist/components/PeoplePicker/people-picker.d.ts +77 -0
  216. package/dist/components/PeoplePicker/people-picker.d.ts.map +1 -0
  217. package/dist/components/PeoplePicker/people-picker.js +263 -0
  218. package/dist/components/PeoplePicker/people-picker.js.map +1 -0
  219. package/dist/components/PeoplePicker/person-display.d.ts +66 -0
  220. package/dist/components/PeoplePicker/person-display.d.ts.map +1 -0
  221. package/dist/components/PeoplePicker/person-display.js +203 -0
  222. package/dist/components/PeoplePicker/person-display.js.map +1 -0
  223. package/dist/components/Popover/popover.d.ts +50 -0
  224. package/dist/components/Popover/popover.d.ts.map +1 -0
  225. package/dist/components/Popover/popover.js +112 -0
  226. package/dist/components/Popover/popover.js.map +1 -0
  227. package/dist/components/ProgressBar/progress-bar.d.ts +37 -0
  228. package/dist/components/ProgressBar/progress-bar.d.ts.map +1 -0
  229. package/dist/components/ProgressBar/progress-bar.js +86 -0
  230. package/dist/components/ProgressBar/progress-bar.js.map +1 -0
  231. package/dist/components/RadioGroup/radio-group.d.ts +78 -0
  232. package/dist/components/RadioGroup/radio-group.d.ts.map +1 -0
  233. package/dist/components/RadioGroup/radio-group.js +153 -0
  234. package/dist/components/RadioGroup/radio-group.js.map +1 -0
  235. package/dist/components/Rating/rating.d.ts +46 -0
  236. package/dist/components/Rating/rating.d.ts.map +1 -0
  237. package/dist/components/Rating/rating.js +179 -0
  238. package/dist/components/Rating/rating.js.map +1 -0
  239. package/dist/components/ScrollArea/scroll-area.d.ts +45 -0
  240. package/dist/components/ScrollArea/scroll-area.d.ts.map +1 -0
  241. package/dist/components/ScrollArea/scroll-area.js +65 -0
  242. package/dist/components/ScrollArea/scroll-area.js.map +1 -0
  243. package/dist/components/SegmentedControl/segmented-control.d.ts +102 -0
  244. package/dist/components/SegmentedControl/segmented-control.d.ts.map +1 -0
  245. package/dist/components/SegmentedControl/segmented-control.js +171 -0
  246. package/dist/components/SegmentedControl/segmented-control.js.map +1 -0
  247. package/dist/components/Select/select.d.ts +102 -0
  248. package/dist/components/Select/select.d.ts.map +1 -0
  249. package/dist/components/Select/select.js +435 -0
  250. package/dist/components/Select/select.js.map +1 -0
  251. package/dist/components/SelectMenu/select-menu.d.ts +103 -0
  252. package/dist/components/SelectMenu/select-menu.d.ts.map +1 -0
  253. package/dist/components/SelectMenu/select-menu.js +239 -0
  254. package/dist/components/SelectMenu/select-menu.js.map +1 -0
  255. package/dist/components/SelectionControl/selection-item.d.ts +69 -0
  256. package/dist/components/SelectionControl/selection-item.d.ts.map +1 -0
  257. package/dist/components/SelectionControl/selection-item.js +142 -0
  258. package/dist/components/SelectionControl/selection-item.js.map +1 -0
  259. package/dist/components/Separator/separator.d.ts +17 -0
  260. package/dist/components/Separator/separator.d.ts.map +1 -0
  261. package/dist/components/Separator/separator.js +39 -0
  262. package/dist/components/Separator/separator.js.map +1 -0
  263. package/dist/components/Sheet/sheet.d.ts +56 -0
  264. package/dist/components/Sheet/sheet.d.ts.map +1 -0
  265. package/dist/components/Sheet/sheet.js +145 -0
  266. package/dist/components/Sheet/sheet.js.map +1 -0
  267. package/dist/components/Sidebar/sidebar.d.ts +195 -0
  268. package/dist/components/Sidebar/sidebar.d.ts.map +1 -0
  269. package/dist/components/Sidebar/sidebar.js +826 -0
  270. package/dist/components/Sidebar/sidebar.js.map +1 -0
  271. package/dist/components/Skeleton/skeleton.d.ts +16 -0
  272. package/dist/components/Skeleton/skeleton.d.ts.map +1 -0
  273. package/dist/components/Skeleton/skeleton.js +30 -0
  274. package/dist/components/Skeleton/skeleton.js.map +1 -0
  275. package/dist/components/Slider/slider.d.ts +48 -0
  276. package/dist/components/Slider/slider.d.ts.map +1 -0
  277. package/dist/components/Slider/slider.js +108 -0
  278. package/dist/components/Slider/slider.js.map +1 -0
  279. package/dist/components/Steps/steps.d.ts +71 -0
  280. package/dist/components/Steps/steps.d.ts.map +1 -0
  281. package/dist/components/Steps/steps.js +583 -0
  282. package/dist/components/Steps/steps.js.map +1 -0
  283. package/dist/components/Switch/switch.d.ts +112 -0
  284. package/dist/components/Switch/switch.d.ts.map +1 -0
  285. package/dist/components/Switch/switch.js +179 -0
  286. package/dist/components/Switch/switch.js.map +1 -0
  287. package/dist/components/Tabs/tabs.d.ts +104 -0
  288. package/dist/components/Tabs/tabs.d.ts.map +1 -0
  289. package/dist/components/Tabs/tabs.js +316 -0
  290. package/dist/components/Tabs/tabs.js.map +1 -0
  291. package/dist/components/Tag/tag.d.ts +86 -0
  292. package/dist/components/Tag/tag.d.ts.map +1 -0
  293. package/dist/components/Tag/tag.js +172 -0
  294. package/dist/components/Tag/tag.js.map +1 -0
  295. package/dist/components/Textarea/textarea.d.ts +74 -0
  296. package/dist/components/Textarea/textarea.d.ts.map +1 -0
  297. package/dist/components/Textarea/textarea.js +224 -0
  298. package/dist/components/Textarea/textarea.js.map +1 -0
  299. package/dist/components/TimePicker/time-columns.d.ts +46 -0
  300. package/dist/components/TimePicker/time-columns.d.ts.map +1 -0
  301. package/dist/components/TimePicker/time-columns.js +173 -0
  302. package/dist/components/TimePicker/time-columns.js.map +1 -0
  303. package/dist/components/TimePicker/time-picker.d.ts +94 -0
  304. package/dist/components/TimePicker/time-picker.d.ts.map +1 -0
  305. package/dist/components/TimePicker/time-picker.js +253 -0
  306. package/dist/components/TimePicker/time-picker.js.map +1 -0
  307. package/dist/components/Toast/toast.d.ts +61 -0
  308. package/dist/components/Toast/toast.d.ts.map +1 -0
  309. package/dist/components/Toast/toast.js +76 -0
  310. package/dist/components/Toast/toast.js.map +1 -0
  311. package/dist/components/Tooltip/tooltip.d.ts +20 -0
  312. package/dist/components/Tooltip/tooltip.d.ts.map +1 -0
  313. package/dist/components/Tooltip/tooltip.js +53 -0
  314. package/dist/components/Tooltip/tooltip.js.map +1 -0
  315. package/dist/components/TreeView/tree-view.d.ts +166 -0
  316. package/dist/components/TreeView/tree-view.d.ts.map +1 -0
  317. package/dist/components/TreeView/tree-view.js +617 -0
  318. package/dist/components/TreeView/tree-view.js.map +1 -0
  319. package/dist/hooks/use-controllable.d.ts +16 -0
  320. package/dist/hooks/use-controllable.d.ts.map +1 -0
  321. package/dist/hooks/use-controllable.js +26 -0
  322. package/dist/hooks/use-controllable.js.map +1 -0
  323. package/dist/hooks/use-is-narrow-viewport.d.ts +2 -0
  324. package/dist/hooks/use-is-narrow-viewport.d.ts.map +1 -0
  325. package/dist/hooks/use-is-narrow-viewport.js +19 -0
  326. package/dist/hooks/use-is-narrow-viewport.js.map +1 -0
  327. package/dist/hooks/use-is-touch-device.d.ts +8 -0
  328. package/dist/hooks/use-is-touch-device.d.ts.map +1 -0
  329. package/dist/hooks/use-is-touch-device.js +16 -0
  330. package/dist/hooks/use-is-touch-device.js.map +1 -0
  331. package/dist/hooks/use-overflow-items.d.ts +124 -0
  332. package/dist/hooks/use-overflow-items.d.ts.map +1 -0
  333. package/dist/hooks/use-overflow-items.js +97 -0
  334. package/dist/hooks/use-overflow-items.js.map +1 -0
  335. package/dist/index.d.ts +74 -0
  336. package/dist/index.d.ts.map +1 -0
  337. package/dist/index.js +371 -0
  338. package/dist/index.js.map +1 -0
  339. package/dist/lib/drag-visual.d.ts +158 -0
  340. package/dist/lib/drag-visual.d.ts.map +1 -0
  341. package/dist/lib/drag-visual.js +96 -0
  342. package/dist/lib/drag-visual.js.map +1 -0
  343. package/dist/lib/i18n/i18n-context.d.ts +105 -0
  344. package/dist/lib/i18n/i18n-context.d.ts.map +1 -0
  345. package/dist/lib/multi-select-ordering.d.ts +54 -0
  346. package/dist/lib/multi-select-ordering.d.ts.map +1 -0
  347. package/dist/lib/multi-select-ordering.js +13 -0
  348. package/dist/lib/multi-select-ordering.js.map +1 -0
  349. package/dist/lib/utils.d.ts +12 -0
  350. package/dist/lib/utils.d.ts.map +1 -0
  351. package/dist/lib/utils.js +79 -0
  352. package/dist/lib/utils.js.map +1 -0
  353. package/dist/patterns/element-anatomy/item-anatomy.d.ts +370 -0
  354. package/dist/patterns/element-anatomy/item-anatomy.d.ts.map +1 -0
  355. package/dist/patterns/element-anatomy/item-anatomy.js +272 -0
  356. package/dist/patterns/element-anatomy/item-anatomy.js.map +1 -0
  357. package/dist/patterns/header-canonical/chrome-header.d.ts +80 -0
  358. package/dist/patterns/header-canonical/chrome-header.d.ts.map +1 -0
  359. package/dist/patterns/header-canonical/chrome-header.js +75 -0
  360. package/dist/patterns/header-canonical/chrome-header.js.map +1 -0
  361. package/dist/patterns/horizontal-overflow/horizontal-overflow.d.ts +101 -0
  362. package/dist/patterns/horizontal-overflow/horizontal-overflow.d.ts.map +1 -0
  363. package/dist/patterns/horizontal-overflow/horizontal-overflow.js +105 -0
  364. package/dist/patterns/horizontal-overflow/horizontal-overflow.js.map +1 -0
  365. package/dist/patterns/overlay-surface/overlay-surface.d.ts +28 -0
  366. package/dist/patterns/overlay-surface/overlay-surface.d.ts.map +1 -0
  367. package/dist/patterns/overlay-surface/overlay-surface.js +85 -0
  368. package/dist/patterns/overlay-surface/overlay-surface.js.map +1 -0
  369. package/dist/patterns/resize-handle/resize-handle.d.ts +102 -0
  370. package/dist/patterns/resize-handle/resize-handle.d.ts.map +1 -0
  371. package/dist/patterns/resize-handle/resize-handle.js +74 -0
  372. package/dist/patterns/resize-handle/resize-handle.js.map +1 -0
  373. package/dist/stories-helpers/anatomy/anatomy-utils.d.ts +40 -0
  374. package/dist/stories-helpers/anatomy/anatomy-utils.d.ts.map +1 -0
  375. package/dist/style.css +457 -0
  376. package/dist/tokens/elevation/overlay-geometry.d.ts +12 -0
  377. package/dist/tokens/elevation/overlay-geometry.d.ts.map +1 -0
  378. package/dist/tokens/elevation/overlay-geometry.js +7 -0
  379. package/dist/tokens/elevation/overlay-geometry.js.map +1 -0
  380. package/dist/tokens/motion/motion.d.ts +15 -0
  381. package/dist/tokens/motion/motion.d.ts.map +1 -0
  382. package/dist/tokens/motion/motion.js +9 -0
  383. package/dist/tokens/motion/motion.js.map +1 -0
  384. package/dist/tokens/uiSize/icon-size.d.ts +53 -0
  385. package/dist/tokens/uiSize/icon-size.d.ts.map +1 -0
  386. package/package.json +3 -10
@@ -0,0 +1,583 @@
1
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
+ import * as React from "react";
3
+ import { ChevronDown, Check, X } from "lucide-react";
4
+ import { cva } from "class-variance-authority";
5
+ import { cn } from "../../lib/utils.js";
6
+ const INDICATOR_SIZE = {
7
+ sm: 8,
8
+ md: 24,
9
+ lg: 32
10
+ };
11
+ const INDICATOR_ICON_SIZE = {
12
+ sm: 0,
13
+ md: 16,
14
+ lg: 20
15
+ };
16
+ const SM_HIT_AREA = 24;
17
+ const INDICATOR_BOX_WIDTH = {
18
+ sm: SM_HIT_AREA,
19
+ md: INDICATOR_SIZE.md,
20
+ lg: INDICATOR_SIZE.lg
21
+ };
22
+ const RING_GAP_PX = 2;
23
+ const RING_WIDTH_PX = 2;
24
+ function getOuterRingShadow(ringColor) {
25
+ return `0 0 0 ${RING_GAP_PX}px var(--surface), 0 0 0 ${RING_GAP_PX + RING_WIDTH_PX}px ${ringColor}`;
26
+ }
27
+ function resolveRingColor(state, linear) {
28
+ if (state === "error") return "var(--error-hover)";
29
+ if (state === "current" && !linear) return "var(--border-hover)";
30
+ return "var(--primary-hover)";
31
+ }
32
+ const StepsContext = React.createContext(null);
33
+ function useStepsContext() {
34
+ const ctx = React.useContext(StepsContext);
35
+ if (!ctx) throw new Error("Steps compound components must be rendered inside <Steps>");
36
+ return ctx;
37
+ }
38
+ const StepItemContext = React.createContext(null);
39
+ function useStepItemContext() {
40
+ const ctx = React.useContext(StepItemContext);
41
+ if (!ctx) throw new Error("StepLabel / StepDescription / StepContent must be inside <StepItem>");
42
+ return ctx;
43
+ }
44
+ const StepIndexContext = React.createContext(0);
45
+ function computeState(itemValue, value, completedValues, errorValues, reachableValues, linear, override) {
46
+ if (override) return override;
47
+ if (errorValues.has(itemValue)) return "error";
48
+ if (completedValues.has(itemValue)) return "completed";
49
+ if (itemValue === value) return "current";
50
+ if (linear && reachableValues.has(itemValue)) return "reachable";
51
+ return "upcoming";
52
+ }
53
+ function isClickable(state, linear, disabled) {
54
+ if (disabled) return false;
55
+ if (!linear) return true;
56
+ return state !== "upcoming";
57
+ }
58
+ function normalizeExpanded(defaultExpanded, allValues) {
59
+ if (defaultExpanded === "all") return new Set(allValues);
60
+ if (!defaultExpanded || defaultExpanded === "none") return /* @__PURE__ */ new Set();
61
+ return new Set(defaultExpanded);
62
+ }
63
+ function computeReachableValues(childValues, completedValues) {
64
+ const completed = new Set(completedValues);
65
+ const reachable = new Set(completed);
66
+ for (const v of childValues) {
67
+ if (!completed.has(v)) {
68
+ reachable.add(v);
69
+ break;
70
+ }
71
+ }
72
+ return reachable;
73
+ }
74
+ const stepsRootVariants = cva("list-none p-0 m-0", {
75
+ variants: {
76
+ orientation: {
77
+ vertical: "flex flex-col",
78
+ horizontal: "flex flex-row items-start gap-3"
79
+ }
80
+ },
81
+ defaultVariants: { orientation: "vertical" }
82
+ });
83
+ const Steps = React.forwardRef(
84
+ ({
85
+ value: valueProp,
86
+ defaultValue,
87
+ onValueChange,
88
+ completedValues = [],
89
+ errorValues = [],
90
+ linear = true,
91
+ size = "md",
92
+ orientation = "vertical",
93
+ expansion = "follow-active",
94
+ defaultExpanded,
95
+ className,
96
+ children,
97
+ ...props
98
+ }, ref) => {
99
+ const [internalValue, setInternalValue] = React.useState(defaultValue);
100
+ const isControlled = valueProp !== void 0;
101
+ const value = isControlled ? valueProp : internalValue;
102
+ const setValue = React.useCallback(
103
+ (next) => {
104
+ if (!isControlled) setInternalValue(next);
105
+ onValueChange == null ? void 0 : onValueChange(next);
106
+ },
107
+ [isControlled, onValueChange]
108
+ );
109
+ const childValues = React.useMemo(() => {
110
+ const vals = [];
111
+ React.Children.forEach(children, (child) => {
112
+ if (React.isValidElement(child) && typeof child.props === "object" && child.props && "value" in child.props) {
113
+ vals.push(String(child.props.value));
114
+ }
115
+ });
116
+ return vals;
117
+ }, [children]);
118
+ const reachableValues = React.useMemo(
119
+ () => computeReachableValues(childValues, completedValues),
120
+ [childValues, completedValues]
121
+ );
122
+ const [expandedSet, setExpandedSet] = React.useState(
123
+ () => normalizeExpanded(defaultExpanded, childValues)
124
+ );
125
+ const toggleExpanded = React.useCallback((itemValue) => {
126
+ setExpandedSet((prev) => {
127
+ const next = new Set(prev);
128
+ if (next.has(itemValue)) next.delete(itemValue);
129
+ else next.add(itemValue);
130
+ return next;
131
+ });
132
+ }, []);
133
+ const ctxValue = React.useMemo(
134
+ () => ({
135
+ value,
136
+ completedValues: new Set(completedValues),
137
+ errorValues: new Set(errorValues),
138
+ reachableValues,
139
+ linear,
140
+ size,
141
+ orientation,
142
+ expansion,
143
+ expandedSet,
144
+ setValue,
145
+ toggleExpanded
146
+ }),
147
+ [value, completedValues, errorValues, reachableValues, linear, size, orientation, expansion, expandedSet, setValue, toggleExpanded]
148
+ );
149
+ const count = React.Children.count(children);
150
+ const itemsWithIndex = [];
151
+ React.Children.forEach(children, (child, index) => {
152
+ if (!React.isValidElement(child)) {
153
+ itemsWithIndex.push(child);
154
+ return;
155
+ }
156
+ const isLast = index === count - 1;
157
+ const cloned = React.cloneElement(
158
+ child,
159
+ { __isLast: isLast }
160
+ );
161
+ itemsWithIndex.push(
162
+ /* @__PURE__ */ jsx(StepIndexContext.Provider, { value: index + 1, children: cloned }, `item-${index}`)
163
+ );
164
+ });
165
+ return /* @__PURE__ */ jsx(StepsContext.Provider, { value: ctxValue, children: /* @__PURE__ */ jsx(
166
+ "ol",
167
+ {
168
+ ref,
169
+ "data-orientation": orientation,
170
+ "data-size": size,
171
+ className: cn(stepsRootVariants({ orientation }), className),
172
+ ...props,
173
+ children: itemsWithIndex
174
+ }
175
+ ) });
176
+ }
177
+ );
178
+ Steps.displayName = "Steps";
179
+ const stepItemVariants = cva("group/step-item outline-none", {
180
+ variants: {
181
+ orientation: {
182
+ // pb-6 on li provides spacing for next item; connector is absolute within li
183
+ vertical: "relative flex flex-col",
184
+ // Ant Design pattern:flex-1 等寬(最後一步用 last: 覆蓋成自然寬度)。
185
+ // Connector 在 item 內部(不是 items 之間的獨立元素)。
186
+ horizontal: "flex-1 min-w-0 last:flex-none last:shrink-0"
187
+ },
188
+ size: {
189
+ sm: "text-body",
190
+ md: "text-body",
191
+ lg: "text-body-lg"
192
+ }
193
+ },
194
+ defaultVariants: { orientation: "vertical", size: "md" }
195
+ });
196
+ const StepItem = React.forwardRef(
197
+ ({ value, state: stateOverride, disabled = false, children, className, __isLast = false, ...props }, ref) => {
198
+ const steps = useStepsContext();
199
+ const state = computeState(
200
+ value,
201
+ steps.value,
202
+ steps.completedValues,
203
+ steps.errorValues,
204
+ steps.reachableValues,
205
+ steps.linear,
206
+ stateOverride
207
+ );
208
+ const focused = value === steps.value;
209
+ const clickable = isClickable(state, steps.linear, disabled);
210
+ const expanded = steps.expansion === "follow-active" ? focused : steps.expandedSet.has(value);
211
+ const activate = React.useCallback(() => {
212
+ if (!clickable) return;
213
+ steps.setValue(value);
214
+ if (steps.expansion === "multiple") {
215
+ steps.toggleExpanded(value);
216
+ }
217
+ }, [clickable, steps, value]);
218
+ const itemCtx = React.useMemo(() => ({
219
+ value,
220
+ state,
221
+ focused,
222
+ disabled,
223
+ clickable,
224
+ expanded,
225
+ isLast: __isLast,
226
+ activate
227
+ }), [value, state, focused, disabled, clickable, expanded, __isLast, activate]);
228
+ const isVertical = steps.orientation === "vertical";
229
+ return /* @__PURE__ */ jsx(StepItemContext.Provider, { value: itemCtx, children: /* @__PURE__ */ jsx(
230
+ "li",
231
+ {
232
+ ref,
233
+ "data-state": state,
234
+ "data-focused": focused || void 0,
235
+ "data-disabled": disabled || void 0,
236
+ "data-clickable": clickable || void 0,
237
+ "aria-current": focused ? "step" : void 0,
238
+ "aria-disabled": disabled || void 0,
239
+ className: cn(
240
+ stepItemVariants({ orientation: steps.orientation, size: steps.size }),
241
+ isVertical && !__isLast && "pb-6",
242
+ !clickable && "cursor-not-allowed",
243
+ className
244
+ ),
245
+ ...props,
246
+ children: /* @__PURE__ */ jsx(StepItemLayout, { children })
247
+ }
248
+ ) });
249
+ }
250
+ );
251
+ StepItem.displayName = "StepItem";
252
+ function StepItemLayout({ children }) {
253
+ const steps = useStepsContext();
254
+ const item = useStepItemContext();
255
+ let labelNode = null;
256
+ let descNode = null;
257
+ let contentNode = null;
258
+ React.Children.forEach(children, (child) => {
259
+ if (!React.isValidElement(child)) return;
260
+ if (child.type === StepLabel) labelNode = child;
261
+ else if (child.type === StepDescription) descNode = child;
262
+ else if (child.type === StepContent) contentNode = child;
263
+ });
264
+ if (steps.orientation === "horizontal") {
265
+ return /* @__PURE__ */ jsx(HorizontalLayout, { label: labelNode, description: descNode });
266
+ }
267
+ return /* @__PURE__ */ jsx(VerticalLayout, { label: labelNode, description: descNode, content: contentNode, isLast: item.isLast });
268
+ }
269
+ function StepItemHeader({ children, className, style }) {
270
+ const item = useStepItemContext();
271
+ const onKeyDown = (e) => {
272
+ if (!item.clickable) return;
273
+ if (e.key === "Enter" || e.key === " ") {
274
+ e.preventDefault();
275
+ item.activate();
276
+ }
277
+ };
278
+ return /* @__PURE__ */ jsx(
279
+ "div",
280
+ {
281
+ role: item.clickable ? "button" : void 0,
282
+ tabIndex: item.clickable ? 0 : void 0,
283
+ onClick: item.clickable ? item.activate : void 0,
284
+ onKeyDown: item.clickable ? onKeyDown : void 0,
285
+ "aria-disabled": item.disabled || void 0,
286
+ className: cn(
287
+ "outline-none",
288
+ item.clickable ? "cursor-pointer rounded-md focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring" : "cursor-not-allowed",
289
+ className
290
+ ),
291
+ style,
292
+ children
293
+ }
294
+ );
295
+ }
296
+ function VerticalLayout({
297
+ label,
298
+ description,
299
+ content,
300
+ isLast
301
+ }) {
302
+ const steps = useStepsContext();
303
+ const item = useStepItemContext();
304
+ const showContent = !!content && item.expanded;
305
+ const indicatorBox = INDICATOR_BOX_WIDTH[steps.size];
306
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
307
+ /* @__PURE__ */ jsxs(StepItemHeader, { className: "flex items-start gap-3", children: [
308
+ /* @__PURE__ */ jsx("div", { className: "shrink-0", style: { width: indicatorBox }, children: /* @__PURE__ */ jsx("div", { className: "h-[1lh] flex items-center justify-center", children: /* @__PURE__ */ jsx(StepIndicator, {}) }) }),
309
+ /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex items-start", children: [
310
+ /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex flex-col", children: [
311
+ label,
312
+ description
313
+ ] }),
314
+ steps.expansion === "multiple" && !!content && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "h-[1lh] flex items-center shrink-0 ml-2", children: /* @__PURE__ */ jsx(
315
+ ChevronDown,
316
+ {
317
+ size: 16,
318
+ className: cn(
319
+ "text-fg-muted transition-transform duration-150",
320
+ item.expanded && "rotate-180"
321
+ )
322
+ }
323
+ ) })
324
+ ] })
325
+ ] }),
326
+ showContent && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 mt-3", children: [
327
+ /* @__PURE__ */ jsx("div", { className: "shrink-0", style: { width: indicatorBox } }),
328
+ /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children: content })
329
+ ] }),
330
+ !isLast && /* @__PURE__ */ jsx(VerticalConnectorLine, {})
331
+ ] });
332
+ }
333
+ function VerticalConnectorLine() {
334
+ const steps = useStepsContext();
335
+ const item = useStepItemContext();
336
+ const isBlue = item.state === "completed";
337
+ const radius = INDICATOR_SIZE[steps.size] / 2;
338
+ const gap = 8;
339
+ return /* @__PURE__ */ jsx(
340
+ "div",
341
+ {
342
+ "aria-hidden": true,
343
+ className: cn(
344
+ "absolute w-px",
345
+ isBlue ? "bg-primary" : "bg-border"
346
+ ),
347
+ style: {
348
+ left: INDICATOR_BOX_WIDTH[steps.size] / 2,
349
+ top: `calc(0.5lh + ${radius}px + ${gap}px)`,
350
+ bottom: `calc(${radius}px - 0.5lh + ${gap}px)`
351
+ }
352
+ }
353
+ );
354
+ }
355
+ function HorizontalLayout({
356
+ label,
357
+ description
358
+ }) {
359
+ const item = useStepItemContext();
360
+ const steps = useStepsContext();
361
+ const isBlue = item.state === "completed";
362
+ const indicatorBox = INDICATOR_BOX_WIDTH[steps.size];
363
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
364
+ /* @__PURE__ */ jsxs(StepItemHeader, { className: "flex items-start gap-3", children: [
365
+ /* @__PURE__ */ jsx("div", { className: "h-[1lh] flex items-center shrink-0", children: /* @__PURE__ */ jsx(StepIndicator, {}) }),
366
+ /* @__PURE__ */ jsx("div", { className: "shrink-0 min-w-0", children: label }),
367
+ !item.isLast && /* @__PURE__ */ jsx("div", { className: "h-[1lh] flex-1 flex items-center min-w-4", "aria-hidden": true, children: /* @__PURE__ */ jsx("div", { className: cn("h-px w-full", isBlue ? "bg-primary" : "bg-border") }) })
368
+ ] }),
369
+ description && /* @__PURE__ */ jsx("div", { className: "min-w-0", style: { paddingLeft: indicatorBox + 12 }, children: description })
370
+ ] });
371
+ }
372
+ function StepIndicator() {
373
+ const steps = useStepsContext();
374
+ const item = useStepItemContext();
375
+ const { size, linear } = steps;
376
+ const { state, focused, disabled } = item;
377
+ if (size === "sm") return /* @__PURE__ */ jsx(SmIndicator, { state, focused, disabled, linear });
378
+ return /* @__PURE__ */ jsx(MdLgIndicator, { size, state, focused, disabled, linear });
379
+ }
380
+ function SmIndicator({
381
+ state,
382
+ focused,
383
+ disabled,
384
+ linear
385
+ }) {
386
+ const isHollow = state === "current" && linear || state === "reachable";
387
+ let dotStyle;
388
+ if (isHollow) {
389
+ dotStyle = {
390
+ width: INDICATOR_SIZE.sm,
391
+ height: INDICATOR_SIZE.sm,
392
+ background: "transparent",
393
+ border: "2px solid var(--primary-hover)",
394
+ boxShadow: focused ? getOuterRingShadow(resolveRingColor(state, linear)) : void 0
395
+ };
396
+ } else {
397
+ const dotBg = state === "completed" ? "var(--primary)" : state === "error" ? "var(--error)" : state === "current" && !linear ? "var(--fg-disabled)" : "var(--fg-disabled)";
398
+ dotStyle = {
399
+ width: INDICATOR_SIZE.sm,
400
+ height: INDICATOR_SIZE.sm,
401
+ background: dotBg,
402
+ boxShadow: focused ? getOuterRingShadow(resolveRingColor(state, linear)) : void 0
403
+ };
404
+ }
405
+ return /* @__PURE__ */ jsx(
406
+ "span",
407
+ {
408
+ "aria-hidden": true,
409
+ className: "relative inline-flex items-center justify-center shrink-0",
410
+ style: { width: SM_HIT_AREA, height: SM_HIT_AREA },
411
+ children: /* @__PURE__ */ jsx(
412
+ "span",
413
+ {
414
+ className: cn("block rounded-full", disabled && "opacity-disabled"),
415
+ style: dotStyle
416
+ }
417
+ )
418
+ }
419
+ );
420
+ }
421
+ function MdLgIndicator({
422
+ size,
423
+ state,
424
+ focused,
425
+ disabled,
426
+ linear
427
+ }) {
428
+ const diameter = INDICATOR_SIZE[size];
429
+ const iconPx = INDICATOR_ICON_SIZE[size];
430
+ let fillBg;
431
+ let contentColor;
432
+ switch (state) {
433
+ case "error":
434
+ fillBg = "var(--error)";
435
+ contentColor = "var(--on-emphasis)";
436
+ break;
437
+ case "completed":
438
+ fillBg = "var(--primary)";
439
+ contentColor = "var(--on-emphasis)";
440
+ break;
441
+ case "current":
442
+ if (linear) {
443
+ fillBg = "var(--primary)";
444
+ contentColor = "var(--on-emphasis)";
445
+ } else {
446
+ fillBg = "var(--secondary)";
447
+ contentColor = "var(--foreground)";
448
+ }
449
+ break;
450
+ case "reachable":
451
+ fillBg = "var(--primary)";
452
+ contentColor = "var(--on-emphasis)";
453
+ break;
454
+ default:
455
+ if (linear) {
456
+ fillBg = "var(--muted)";
457
+ contentColor = "var(--fg-disabled)";
458
+ } else {
459
+ fillBg = "var(--secondary)";
460
+ contentColor = "var(--foreground)";
461
+ }
462
+ break;
463
+ }
464
+ return /* @__PURE__ */ jsx(
465
+ "span",
466
+ {
467
+ "aria-hidden": true,
468
+ className: cn(
469
+ "relative inline-flex items-center justify-center shrink-0 rounded-full",
470
+ "font-medium leading-none transition-colors",
471
+ disabled && "opacity-disabled"
472
+ ),
473
+ style: {
474
+ width: diameter,
475
+ height: diameter,
476
+ background: fillBg,
477
+ color: contentColor,
478
+ fontSize: size === "lg" ? "var(--font-body-size)" : "var(--font-caption-size)",
479
+ boxShadow: focused ? getOuterRingShadow(resolveRingColor(state, linear)) : void 0
480
+ },
481
+ children: /* @__PURE__ */ jsx(IndicatorContent, { state, iconPx })
482
+ }
483
+ );
484
+ }
485
+ function IndicatorContent({ state, iconPx }) {
486
+ if (state === "completed") return /* @__PURE__ */ jsx(Check, { size: iconPx, strokeWidth: 2.5 });
487
+ if (state === "error") return /* @__PURE__ */ jsx(X, { size: iconPx, strokeWidth: 2.5 });
488
+ return /* @__PURE__ */ jsx(StepNumber, {});
489
+ }
490
+ function StepNumber() {
491
+ const index = React.useContext(StepIndexContext);
492
+ return /* @__PURE__ */ jsx("span", { children: index });
493
+ }
494
+ const StepLabel = React.forwardRef(
495
+ ({ className, children, ...props }, ref) => {
496
+ const { size } = useStepsContext();
497
+ const { state, focused, disabled } = useStepItemContext();
498
+ return /* @__PURE__ */ jsx(
499
+ "span",
500
+ {
501
+ ref,
502
+ className: cn(
503
+ "font-medium break-words",
504
+ size === "lg" ? "text-body-lg" : "text-body",
505
+ disabled ? "text-fg-disabled" : state === "error" ? "text-error-text" : focused ? "text-foreground" : "text-fg-secondary",
506
+ className
507
+ ),
508
+ ...props,
509
+ children
510
+ }
511
+ );
512
+ }
513
+ );
514
+ StepLabel.displayName = "StepLabel";
515
+ const StepDescription = React.forwardRef(
516
+ ({ className, children, style, ...props }, ref) => {
517
+ const { size } = useStepsContext();
518
+ const { disabled } = useStepItemContext();
519
+ return /* @__PURE__ */ jsx(
520
+ "span",
521
+ {
522
+ ref,
523
+ className: cn(
524
+ // Steps 跟 MenuItem 同 scanning-family:sm/md = scanning(body+caption),lg = scanning-lg(body-lg+body-compact)
525
+ size === "lg" ? "mt-[var(--item-gap-label-desc-scanning-lg)]" : "mt-[var(--item-gap-label-desc-scanning)]",
526
+ "leading-compact break-words",
527
+ disabled ? "text-fg-disabled" : "text-fg-secondary",
528
+ className
529
+ ),
530
+ style: {
531
+ fontSize: size === "lg" ? "var(--font-body-size)" : "var(--font-caption-size)",
532
+ ...style
533
+ },
534
+ ...props,
535
+ children
536
+ }
537
+ );
538
+ }
539
+ );
540
+ StepDescription.displayName = "StepDescription";
541
+ const StepContent = React.forwardRef(
542
+ ({ className, children, ...props }, ref) => {
543
+ const { orientation } = useStepsContext();
544
+ if (orientation === "horizontal") return null;
545
+ return /* @__PURE__ */ jsx(
546
+ "div",
547
+ {
548
+ ref,
549
+ className: cn("text-body text-foreground min-w-0", className),
550
+ ...props,
551
+ children
552
+ }
553
+ );
554
+ }
555
+ );
556
+ StepContent.displayName = "StepContent";
557
+ const stepsMeta = {
558
+ component: "Steps",
559
+ family: 2,
560
+ variants: {},
561
+ sizes: {
562
+ sm: { px: 8, when: "Sidebar / 緊湊 onboarding;indicator 8px dot" },
563
+ md: { px: 24, when: "預設 — wizard / checkout / 註冊主流程;indicator 24px circle" },
564
+ lg: { px: 32, when: "Marketing 流程展示 / 重要 onboarding;indicator 32px circle" }
565
+ },
566
+ states: ["default", "hover", "active", "focus-visible", "disabled"],
567
+ tokens: {
568
+ bg: ["bg-primary"],
569
+ fg: ["--fg-disabled", "--foreground", "--on-emphasis", "text-error-text", "text-fg-disabled", "text-fg-muted", "text-fg-secondary", "text-foreground"],
570
+ ring: []
571
+ }
572
+ };
573
+ export {
574
+ StepContent,
575
+ StepDescription,
576
+ StepItem,
577
+ StepLabel,
578
+ Steps,
579
+ stepItemVariants,
580
+ stepsMeta,
581
+ stepsRootVariants
582
+ };
583
+ //# sourceMappingURL=steps.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"steps.js","sources":["../../../src/components/Steps/steps.tsx"],"sourcesContent":["// @benchmark-unverified-blanket: file-level retraction per M22 (d) — claims herein not individually URL-cited; treat as unverified visual/usage rumor unless retrofit per-claim. Hook escape preserved.\n// code-quality-allow: file-size — foundational composite(Steps + StepItem + orientation/state/connector 邏輯緊密耦合,拆檔會讓 props drilling 複雜化超過可讀 gain)\nimport * as React from 'react'\nimport { Check, ChevronDown, X } from 'lucide-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ── Types ─────────────────────────────────────────────────────────────────\n\nexport type StepsSize = 'sm' | 'md' | 'lg'\n// code-quality-allow: dead-export — public API surface — consumer-exposed for future use\nexport type StepsOrientation = 'vertical' | 'horizontal'\nexport type StepsExpansion = 'follow-active' | 'multiple'\nexport type StepContentState = 'upcoming' | 'reachable' | 'current' | 'completed' | 'error'\n\n// ── Constants ─────────────────────────────────────────────────────────────\n\nconst INDICATOR_SIZE: Record<StepsSize, number> = {\n sm: 8,\n md: 24,\n lg: 32,\n}\n\nconst INDICATOR_ICON_SIZE: Record<StepsSize, number> = {\n sm: 0,\n md: 16,\n lg: 20,\n}\n\nconst SM_HIT_AREA = 24\n\nconst INDICATOR_BOX_WIDTH: Record<StepsSize, number> = {\n sm: SM_HIT_AREA,\n md: INDICATOR_SIZE.md,\n lg: INDICATOR_SIZE.lg,\n}\n\n// ── Outer ring (box-shadow, zero layout impact) ───────────────────────────\n\nconst RING_GAP_PX = 2\nconst RING_WIDTH_PX = 2\n\nfunction getOuterRingShadow(ringColor: string): string {\n return `0 0 0 ${RING_GAP_PX}px var(--surface), 0 0 0 ${RING_GAP_PX + RING_WIDTH_PX}px ${ringColor}`\n}\n\nfunction resolveRingColor(state: StepContentState, linear: boolean): string {\n if (state === 'error') return 'var(--error-hover)'\n if (state === 'current' && !linear) return 'var(--border-hover)'\n return 'var(--primary-hover)'\n}\n\n// ── Contexts ──────────────────────────────────────────────────────────────\n\ninterface StepsContextValue {\n value: string | undefined\n completedValues: Set<string>\n errorValues: Set<string>\n reachableValues: Set<string>\n linear: boolean\n size: StepsSize\n orientation: StepsOrientation\n expansion: StepsExpansion\n expandedSet: Set<string>\n setValue: (value: string) => void\n toggleExpanded: (value: string) => void\n}\n\nconst StepsContext = React.createContext<StepsContextValue | null>(null)\n\nfunction useStepsContext(): StepsContextValue {\n const ctx = React.useContext(StepsContext)\n if (!ctx) throw new Error('Steps compound components must be rendered inside <Steps>')\n return ctx\n}\n\ninterface StepItemContextValue {\n value: string\n state: StepContentState\n focused: boolean\n disabled: boolean\n clickable: boolean\n expanded: boolean\n isLast: boolean\n activate: () => void\n}\n\nconst StepItemContext = React.createContext<StepItemContextValue | null>(null)\n\nfunction useStepItemContext(): StepItemContextValue {\n const ctx = React.useContext(StepItemContext)\n if (!ctx) throw new Error('StepLabel / StepDescription / StepContent must be inside <StepItem>')\n return ctx\n}\n\nconst StepIndexContext = React.createContext<number>(0)\n\n// ── Pure helpers ──────────────────────────────────────────────────────────\n\nfunction computeState(\n itemValue: string,\n value: string | undefined,\n completedValues: Set<string>,\n errorValues: Set<string>,\n reachableValues: Set<string>,\n linear: boolean,\n override: StepContentState | undefined,\n): StepContentState {\n if (override) return override\n if (errorValues.has(itemValue)) return 'error'\n if (completedValues.has(itemValue)) return 'completed'\n if (itemValue === value) return 'current'\n if (linear && reachableValues.has(itemValue)) return 'reachable'\n return 'upcoming'\n}\n\nfunction isClickable(\n state: StepContentState,\n linear: boolean,\n disabled: boolean,\n): boolean {\n if (disabled) return false\n if (!linear) return true\n return state !== 'upcoming'\n}\n\nfunction normalizeExpanded(\n defaultExpanded: 'all' | 'none' | string[] | undefined,\n allValues: string[],\n): Set<string> {\n if (defaultExpanded === 'all') return new Set(allValues)\n if (!defaultExpanded || defaultExpanded === 'none') return new Set()\n return new Set(defaultExpanded)\n}\n\nfunction computeReachableValues(\n childValues: string[],\n completedValues: string[],\n): Set<string> {\n const completed = new Set(completedValues)\n const reachable = new Set(completed)\n for (const v of childValues) {\n if (!completed.has(v)) {\n reachable.add(v)\n break\n }\n }\n return reachable\n}\n\n// ── Steps root ────────────────────────────────────────────────────────────\n\nconst stepsRootVariants = cva('list-none p-0 m-0', {\n variants: {\n orientation: {\n vertical: 'flex flex-col',\n horizontal: 'flex flex-row items-start gap-3',\n },\n },\n defaultVariants: { orientation: 'vertical' },\n})\n\nexport interface StepsProps\n extends Omit<React.HTMLAttributes<HTMLOListElement>, 'onChange' | 'defaultValue'>,\n VariantProps<typeof stepsRootVariants> {\n value?: string\n defaultValue?: string\n onValueChange?: (value: string) => void\n completedValues?: string[]\n errorValues?: string[]\n linear?: boolean\n size?: StepsSize\n orientation?: StepsOrientation\n expansion?: StepsExpansion\n defaultExpanded?: 'all' | 'none' | string[]\n}\n\n// code-quality-allow: long-function — foundational composite main body — 拆 sub-fn 會複雜化 local state / ref / context binding\nconst Steps = React.forwardRef<HTMLOListElement, StepsProps>(\n (\n {\n value: valueProp,\n defaultValue,\n onValueChange,\n completedValues = [],\n errorValues = [],\n linear = true,\n size = 'md',\n orientation = 'vertical',\n expansion = 'follow-active',\n defaultExpanded,\n className,\n children,\n ...props\n },\n ref,\n ) => {\n const [internalValue, setInternalValue] = React.useState<string | undefined>(defaultValue)\n const isControlled = valueProp !== undefined\n const value = isControlled ? valueProp : internalValue\n\n const setValue = React.useCallback(\n (next: string) => {\n if (!isControlled) setInternalValue(next)\n onValueChange?.(next)\n },\n [isControlled, onValueChange],\n )\n\n const childValues = React.useMemo(() => {\n const vals: string[] = []\n React.Children.forEach(children, child => {\n if (\n React.isValidElement(child) &&\n typeof child.props === 'object' &&\n child.props &&\n 'value' in child.props\n ) {\n vals.push(String((child.props as { value: string }).value))\n }\n })\n return vals\n }, [children])\n\n const reachableValues = React.useMemo(\n () => computeReachableValues(childValues, completedValues),\n [childValues, completedValues],\n )\n\n const [expandedSet, setExpandedSet] = React.useState<Set<string>>(() =>\n normalizeExpanded(defaultExpanded, childValues),\n )\n\n const toggleExpanded = React.useCallback((itemValue: string) => {\n setExpandedSet(prev => {\n const next = new Set(prev)\n if (next.has(itemValue)) next.delete(itemValue)\n else next.add(itemValue)\n return next\n })\n }, [])\n\n const ctxValue = React.useMemo<StepsContextValue>(\n () => ({\n value,\n completedValues: new Set(completedValues),\n errorValues: new Set(errorValues),\n reachableValues,\n linear,\n size,\n orientation,\n expansion,\n expandedSet,\n setValue,\n toggleExpanded,\n }),\n [value, completedValues, errorValues, reachableValues, linear, size, orientation, expansion, expandedSet, setValue, toggleExpanded],\n )\n\n // Interleave horizontal connectors between items\n const count = React.Children.count(children)\n const itemsWithIndex: React.ReactNode[] = []\n\n React.Children.forEach(children, (child, index) => {\n if (!React.isValidElement(child)) {\n itemsWithIndex.push(child)\n return\n }\n const isLast = index === count - 1\n const cloned = React.cloneElement(\n child as React.ReactElement<StepItemInjectedProps>,\n { __isLast: isLast },\n )\n itemsWithIndex.push(\n <StepIndexContext.Provider key={`item-${index}`} value={index + 1}>\n {cloned}\n </StepIndexContext.Provider>,\n )\n // Horizontal connectors are now INSIDE each StepItem (Ant Design pattern),\n // not between items. No interleaving needed.\n })\n\n return (\n <StepsContext.Provider value={ctxValue}>\n <ol\n ref={ref}\n data-orientation={orientation}\n data-size={size}\n className={cn(stepsRootVariants({ orientation }), className)}\n {...props}\n >\n {itemsWithIndex}\n </ol>\n </StepsContext.Provider>\n )\n },\n)\nSteps.displayName = 'Steps'\n\n// ── StepItem ──────────────────────────────────────────────────────────────\n\ninterface StepItemInjectedProps {\n __isLast?: boolean\n}\n\nexport interface StepItemProps\n extends Omit<React.HTMLAttributes<HTMLLIElement>, 'value'>,\n StepItemInjectedProps {\n value: string\n state?: 'error'\n disabled?: boolean\n}\n\nconst stepItemVariants = cva('group/step-item outline-none', {\n variants: {\n orientation: {\n // pb-6 on li provides spacing for next item; connector is absolute within li\n vertical: 'relative flex flex-col',\n // Ant Design pattern:flex-1 等寬(最後一步用 last: 覆蓋成自然寬度)。\n // Connector 在 item 內部(不是 items 之間的獨立元素)。\n horizontal: 'flex-1 min-w-0 last:flex-none last:shrink-0',\n },\n size: {\n sm: 'text-body',\n md: 'text-body',\n lg: 'text-body-lg',\n },\n },\n defaultVariants: { orientation: 'vertical', size: 'md' },\n})\n\n// code-quality-allow: long-function — foundational composite main body — 拆 sub-fn 會複雜化 local state / ref / context binding\nconst StepItem = React.forwardRef<HTMLLIElement, StepItemProps>(\n ({ value, state: stateOverride, disabled = false, children, className, __isLast = false, ...props }, ref) => {\n const steps = useStepsContext()\n const state = computeState(\n value,\n steps.value,\n steps.completedValues,\n steps.errorValues,\n steps.reachableValues,\n steps.linear,\n stateOverride,\n )\n const focused = value === steps.value\n const clickable = isClickable(state, steps.linear, disabled)\n const expanded =\n steps.expansion === 'follow-active' ? focused : steps.expandedSet.has(value)\n\n const activate = React.useCallback(() => {\n if (!clickable) return\n // 永遠更新 focus(value),multiple 模式額外 toggle 展開\n steps.setValue(value)\n if (steps.expansion === 'multiple') {\n steps.toggleExpanded(value)\n }\n }, [clickable, steps, value])\n\n const itemCtx = React.useMemo<StepItemContextValue>(() => ({\n value,\n state,\n focused,\n disabled,\n clickable,\n expanded,\n isLast: __isLast,\n activate,\n }), [value, state, focused, disabled, clickable, expanded, __isLast, activate])\n\n const isVertical = steps.orientation === 'vertical'\n\n return (\n <StepItemContext.Provider value={itemCtx}>\n <li\n ref={ref}\n data-state={state}\n data-focused={focused || undefined}\n data-disabled={disabled || undefined}\n data-clickable={clickable || undefined}\n aria-current={focused ? 'step' : undefined}\n aria-disabled={disabled || undefined}\n className={cn(\n stepItemVariants({ orientation: steps.orientation, size: steps.size }),\n isVertical && !__isLast && 'pb-6',\n !clickable && 'cursor-not-allowed',\n className,\n )}\n {...props}\n >\n <StepItemLayout>{children}</StepItemLayout>\n </li>\n </StepItemContext.Provider>\n )\n },\n)\nStepItem.displayName = 'StepItem'\n\n// ── StepItem internal layout ─────────────────────────────────────────────\n\nfunction StepItemLayout({ children }: { children: React.ReactNode }) {\n const steps = useStepsContext()\n const item = useStepItemContext()\n\n let labelNode: React.ReactNode = null\n let descNode: React.ReactNode = null\n let contentNode: React.ReactNode = null\n React.Children.forEach(children, child => {\n if (!React.isValidElement(child)) return\n if (child.type === StepLabel) labelNode = child\n else if (child.type === StepDescription) descNode = child\n else if (child.type === StepContent) contentNode = child\n })\n\n if (steps.orientation === 'horizontal') {\n return <HorizontalLayout label={labelNode} description={descNode} />\n }\n return (\n <VerticalLayout label={labelNode} description={descNode} content={contentNode} isLast={item.isLast} />\n )\n}\n\n// ── Clickable header ─────────────────────────────────────────────────────\n\nfunction StepItemHeader({ children, className, style }: { children: React.ReactNode; className?: string; style?: React.CSSProperties }) {\n const item = useStepItemContext()\n const onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n if (!item.clickable) return\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n item.activate()\n }\n }\n return (\n <div\n role={item.clickable ? 'button' : undefined}\n tabIndex={item.clickable ? 0 : undefined}\n onClick={item.clickable ? item.activate : undefined}\n onKeyDown={item.clickable ? onKeyDown : undefined}\n aria-disabled={item.disabled || undefined}\n className={cn(\n 'outline-none',\n item.clickable\n ? 'cursor-pointer rounded-md focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'\n : 'cursor-not-allowed',\n className,\n )}\n style={style}\n >\n {children}\n </div>\n )\n}\n\n// ── Vertical layout ──────────────────────────────────────────────────────\n\nfunction VerticalLayout({\n label,\n description,\n content,\n isLast,\n}: {\n label: React.ReactNode\n description: React.ReactNode\n content: React.ReactNode\n isLast: boolean\n}) {\n const steps = useStepsContext()\n const item = useStepItemContext()\n const showContent = !!content && item.expanded\n const indicatorBox = INDICATOR_BOX_WIDTH[steps.size]\n\n return (\n <>\n <StepItemHeader className=\"flex items-start gap-3\">\n <div className=\"shrink-0\" style={{ width: indicatorBox }}>\n <div className=\"h-[1lh] flex items-center justify-center\">\n <StepIndicator />\n </div>\n </div>\n <div className=\"flex-1 min-w-0 flex items-start\">\n <div className=\"flex-1 min-w-0 flex flex-col\">\n {label}\n {description}\n </div>\n {steps.expansion === 'multiple' && !!content && (\n <span aria-hidden className=\"h-[1lh] flex items-center shrink-0 ml-2\">\n <ChevronDown\n size={16}\n className={cn(\n 'text-fg-muted transition-transform duration-150',\n item.expanded && 'rotate-180',\n )}\n />\n </span>\n )}\n </div>\n </StepItemHeader>\n {showContent && (\n <div className=\"flex items-start gap-3 mt-3\">\n <div className=\"shrink-0\" style={{ width: indicatorBox }} />\n <div className=\"flex-1 min-w-0\">{content}</div>\n </div>\n )}\n {!isLast && <VerticalConnectorLine />}\n </>\n )\n}\n\n// ── Vertical connector ───────────────────────────────────────────────────\n\nfunction VerticalConnectorLine() {\n const steps = useStepsContext()\n const item = useStepItemContext()\n const isBlue = item.state === 'completed'\n const radius = INDICATOR_SIZE[steps.size] / 2\n const gap = 8\n\n return (\n <div\n aria-hidden\n className={cn(\n 'absolute w-px',\n isBlue ? 'bg-primary' : 'bg-border',\n )}\n style={{\n left: INDICATOR_BOX_WIDTH[steps.size] / 2,\n top: `calc(0.5lh + ${radius}px + ${gap}px)`,\n bottom: `calc(${radius}px - 0.5lh + ${gap}px)`,\n }}\n />\n )\n}\n\n// ── Horizontal layout (Ant Design pattern) ──────────────────────────────\n//\n// Connector 在 **item 內部**(不是 items 之間的獨立元素):\n// Step (flex-1): [indicator][gap][label][gap][──connector──]\n// Last step: [indicator][gap][label] (無 connector)\n//\n// Root: flex-row gap-3 → gap 只在 step items 之間\n// Step items: flex-1 等寬(最後一步 flex-none 自然寬度)\n//\n// 等距保證:\n// label→connector gap = item 內 flex gap-3 = 12px\n// connector→next circle = root gap-3 = 12px\n// 兩邊都是 12px ✓\n//\n// Description 在 step item 內(connector 下方),wrap 到 item 寬度 = 最長到連結線尾段 ✓\n\nfunction HorizontalLayout({\n label,\n description,\n}: {\n label: React.ReactNode\n description: React.ReactNode\n}) {\n const item = useStepItemContext()\n const steps = useStepsContext()\n const isBlue = item.state === 'completed'\n const indicatorBox = INDICATOR_BOX_WIDTH[steps.size]\n\n return (\n <>\n {/* Row 1: indicator + label + connector(在同一個 flex row) */}\n <StepItemHeader className=\"flex items-start gap-3\">\n <div className=\"h-[1lh] flex items-center shrink-0\">\n <StepIndicator />\n </div>\n <div className=\"shrink-0 min-w-0\">{label}</div>\n {/* Connector 在 item 內部,flex-1 填滿剩餘寬度 */}\n {!item.isLast && (\n <div className=\"h-[1lh] flex-1 flex items-center min-w-4\" aria-hidden>\n <div className={cn('h-px w-full', isBlue ? 'bg-primary' : 'bg-border')} />\n </div>\n )}\n </StepItemHeader>\n {/* Row 2: description — 在 item 寬度內 wrap(含 connector 佔的空間) */}\n {description && (\n <div className=\"min-w-0\" style={{ paddingLeft: indicatorBox + 12 }}>\n {description}\n </div>\n )}\n </>\n )\n}\n\n// ── StepIndicator ────────────────────────────────────────────────────────\n\nfunction StepIndicator() {\n const steps = useStepsContext()\n const item = useStepItemContext()\n const { size, linear } = steps\n const { state, focused, disabled } = item\n\n if (size === 'sm') return <SmIndicator state={state} focused={focused} disabled={disabled} linear={linear} />\n return <MdLgIndicator size={size} state={state} focused={focused} disabled={disabled} linear={linear} />\n}\n\n// ── sm indicator: 8px dot in 24px hit area ───────────────────────────────\n\nfunction SmIndicator({\n state,\n focused,\n disabled,\n linear,\n}: {\n state: StepContentState\n focused: boolean\n disabled: boolean\n linear: boolean\n}) {\n // sm current (linear) and reachable: hollow ring\n const isHollow = (state === 'current' && linear) || state === 'reachable'\n\n let dotStyle: React.CSSProperties\n if (isHollow) {\n dotStyle = {\n width: INDICATOR_SIZE.sm,\n height: INDICATOR_SIZE.sm,\n background: 'transparent',\n border: '2px solid var(--primary-hover)',\n boxShadow: focused ? getOuterRingShadow(resolveRingColor(state, linear)) : undefined,\n }\n } else {\n const dotBg =\n state === 'completed' ? 'var(--primary)'\n : state === 'error' ? 'var(--error)'\n : state === 'current' && !linear ? 'var(--fg-disabled)'\n : 'var(--fg-disabled)' // upcoming + non-linear fallback\n\n dotStyle = {\n width: INDICATOR_SIZE.sm,\n height: INDICATOR_SIZE.sm,\n background: dotBg,\n boxShadow: focused ? getOuterRingShadow(resolveRingColor(state, linear)) : undefined,\n }\n }\n\n return (\n <span\n aria-hidden\n className=\"relative inline-flex items-center justify-center shrink-0\"\n style={{ width: SM_HIT_AREA, height: SM_HIT_AREA }}\n >\n <span\n className={cn('block rounded-full', disabled && 'opacity-disabled')}\n style={dotStyle}\n />\n </span>\n )\n}\n\n// ── md/lg indicator: filled circle with number/icon ──────────────────────\n\nfunction MdLgIndicator({\n size,\n state,\n focused,\n disabled,\n linear,\n}: {\n size: StepsSize\n state: StepContentState\n focused: boolean\n disabled: boolean\n linear: boolean\n}) {\n const diameter = INDICATOR_SIZE[size]\n const iconPx = INDICATOR_ICON_SIZE[size]\n\n let fillBg: string\n let contentColor: string\n\n switch (state) {\n case 'error':\n fillBg = 'var(--error)'\n contentColor = 'var(--on-emphasis)'\n break\n case 'completed':\n fillBg = 'var(--primary)'\n contentColor = 'var(--on-emphasis)'\n break\n case 'current':\n if (linear) {\n fillBg = 'var(--primary)'\n contentColor = 'var(--on-emphasis)'\n } else {\n fillBg = 'var(--secondary)'\n contentColor = 'var(--foreground)'\n }\n break\n case 'reachable':\n fillBg = 'var(--primary)'\n contentColor = 'var(--on-emphasis)'\n break\n default: // upcoming\n if (linear) {\n fillBg = 'var(--muted)'\n contentColor = 'var(--fg-disabled)'\n } else {\n fillBg = 'var(--secondary)'\n contentColor = 'var(--foreground)'\n }\n break\n }\n\n return (\n <span\n aria-hidden\n className={cn(\n 'relative inline-flex items-center justify-center shrink-0 rounded-full',\n 'font-medium leading-none transition-colors',\n disabled && 'opacity-disabled',\n )}\n style={{\n width: diameter,\n height: diameter,\n background: fillBg,\n color: contentColor,\n fontSize: size === 'lg' ? 'var(--font-body-size)' : 'var(--font-caption-size)',\n boxShadow: focused ? getOuterRingShadow(resolveRingColor(state, linear)) : undefined,\n }}\n >\n <IndicatorContent state={state} iconPx={iconPx} />\n </span>\n )\n}\n\nfunction IndicatorContent({ state, iconPx }: { state: StepContentState; iconPx: number }) {\n if (state === 'completed') return <Check size={iconPx} strokeWidth={2.5} />\n if (state === 'error') return <X size={iconPx} strokeWidth={2.5} />\n return <StepNumber />\n}\n\nfunction StepNumber() {\n const index = React.useContext(StepIndexContext)\n return <span>{index}</span>\n}\n\n// ── StepLabel ────────────────────────────────────────────────────────────\n\nexport interface StepLabelProps extends React.HTMLAttributes<HTMLSpanElement> {}\n\n// code-quality-allow: long-function — foundational composite main body — 拆 sub-fn 會複雜化 local state / ref / context binding\nconst StepLabel = React.forwardRef<HTMLSpanElement, StepLabelProps>(\n ({ className, children, ...props }, ref) => {\n const { size } = useStepsContext()\n const { state, focused, disabled } = useStepItemContext()\n\n return (\n <span\n ref={ref}\n className={cn(\n 'font-medium break-words',\n size === 'lg' ? 'text-body-lg' : 'text-body',\n disabled\n ? 'text-fg-disabled'\n : state === 'error'\n ? 'text-error-text'\n : focused\n ? 'text-foreground'\n : 'text-fg-secondary',\n className,\n )}\n {...props}\n >\n {children}\n </span>\n )\n },\n)\nStepLabel.displayName = 'StepLabel'\n\n// ── StepDescription ──────────────────────────────────────────────────────\n\nexport interface StepDescriptionProps extends React.HTMLAttributes<HTMLSpanElement> {}\n\nconst StepDescription = React.forwardRef<HTMLSpanElement, StepDescriptionProps>(\n ({ className, children, style, ...props }, ref) => {\n const { size } = useStepsContext()\n const { disabled } = useStepItemContext()\n\n return (\n <span\n ref={ref}\n className={cn(\n // Steps 跟 MenuItem 同 scanning-family:sm/md = scanning(body+caption),lg = scanning-lg(body-lg+body-compact)\n size === 'lg'\n ? 'mt-[var(--item-gap-label-desc-scanning-lg)]'\n : 'mt-[var(--item-gap-label-desc-scanning)]',\n 'leading-compact break-words',\n disabled ? 'text-fg-disabled' : 'text-fg-secondary',\n className,\n )}\n style={{\n fontSize: size === 'lg' ? 'var(--font-body-size)' : 'var(--font-caption-size)',\n ...style,\n }}\n {...props}\n >\n {children}\n </span>\n )\n },\n)\nStepDescription.displayName = 'StepDescription'\n\n// ── StepContent ──────────────────────────────────────────────────────────\n\nexport interface StepContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst StepContent = React.forwardRef<HTMLDivElement, StepContentProps>(\n ({ className, children, ...props }, ref) => {\n const { orientation } = useStepsContext()\n if (orientation === 'horizontal') return null\n return (\n <div\n ref={ref}\n className={cn('text-body text-foreground min-w-0', className)}\n {...props}\n >\n {children}\n </div>\n )\n },\n)\nStepContent.displayName = 'StepContent'\n\n// ── Exports ──────────────────────────────────────────────────────────────\n\n// Story auto-compile metadata — Phase 1 mechanical migration(2026-04-24)\n// Phase 2 fill needed: purpose descriptions + when rationale + world-class refs\nexport const stepsMeta = {\n component: 'Steps',\n family: 2,\n variants: {},\n sizes: {\n sm: { px: 8, when: 'Sidebar / 緊湊 onboarding;indicator 8px dot' },\n md: { px: 24, when: '預設 — wizard / checkout / 註冊主流程;indicator 24px circle' },\n lg: { px: 32, when: 'Marketing 流程展示 / 重要 onboarding;indicator 32px circle' },\n },\n states: ['default', 'hover', 'active', 'focus-visible', 'disabled'],\n tokens: {\n bg: ['bg-primary'],\n fg: ['--fg-disabled', '--foreground', '--on-emphasis', 'text-error-text', 'text-fg-disabled', 'text-fg-muted', 'text-fg-secondary', 'text-foreground'],\n ring: [],\n },\n} as const\n\nexport { Steps, StepItem, StepLabel, StepDescription, StepContent, stepsRootVariants, stepItemVariants }\n"],"names":[],"mappings":"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"}