@ankhorage/zora 2.8.7 → 2.9.1

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 (394) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +1 -1
  3. package/dist/components/app-bar/AppBar.d.ts.map +1 -1
  4. package/dist/components/app-bar/AppBar.js +3 -3
  5. package/dist/components/app-bar/AppBar.js.map +1 -1
  6. package/dist/components/avatar/Avatar.d.ts.map +1 -1
  7. package/dist/components/avatar/Avatar.js +1 -1
  8. package/dist/components/avatar/Avatar.js.map +1 -1
  9. package/dist/components/avatar-group/AvatarGroup.d.ts.map +1 -1
  10. package/dist/components/avatar-group/AvatarGroup.js +1 -1
  11. package/dist/components/avatar-group/AvatarGroup.js.map +1 -1
  12. package/dist/components/badge/Badge.d.ts.map +1 -1
  13. package/dist/components/badge/Badge.js +1 -1
  14. package/dist/components/badge/Badge.js.map +1 -1
  15. package/dist/components/breadcrumbs/Breadcrumbs.d.ts.map +1 -1
  16. package/dist/components/breadcrumbs/Breadcrumbs.js +2 -2
  17. package/dist/components/breadcrumbs/Breadcrumbs.js.map +1 -1
  18. package/dist/components/button/Button.d.ts.map +1 -1
  19. package/dist/components/button/Button.js +2 -2
  20. package/dist/components/button/Button.js.map +1 -1
  21. package/dist/components/button-group/ButtonGroup.d.ts.map +1 -1
  22. package/dist/components/button-group/ButtonGroup.js +1 -1
  23. package/dist/components/button-group/ButtonGroup.js.map +1 -1
  24. package/dist/components/card/Card.d.ts.map +1 -1
  25. package/dist/components/card/Card.js +3 -2
  26. package/dist/components/card/Card.js.map +1 -1
  27. package/dist/components/checkbox/Checkbox.d.ts.map +1 -1
  28. package/dist/components/checkbox/Checkbox.js +2 -2
  29. package/dist/components/checkbox/Checkbox.js.map +1 -1
  30. package/dist/components/checkbox/CheckboxGroup.d.ts.map +1 -1
  31. package/dist/components/checkbox/CheckboxGroup.js +7 -4
  32. package/dist/components/checkbox/CheckboxGroup.js.map +1 -1
  33. package/dist/components/chip/Chip.d.ts.map +1 -1
  34. package/dist/components/chip/Chip.js +2 -2
  35. package/dist/components/chip/Chip.js.map +1 -1
  36. package/dist/components/chip-group/ChipGroup.d.ts.map +1 -1
  37. package/dist/components/chip-group/ChipGroup.js +5 -2
  38. package/dist/components/chip-group/ChipGroup.js.map +1 -1
  39. package/dist/components/data-table/DataTable.d.ts.map +1 -1
  40. package/dist/components/data-table/DataTable.js +20 -14
  41. package/dist/components/data-table/DataTable.js.map +1 -1
  42. package/dist/components/date-picker/DatePicker.d.ts.map +1 -1
  43. package/dist/components/date-picker/DatePicker.js +23 -6
  44. package/dist/components/date-picker/DatePicker.js.map +1 -1
  45. package/dist/components/drawer/Drawer.d.ts.map +1 -1
  46. package/dist/components/drawer/Drawer.js +2 -2
  47. package/dist/components/drawer/Drawer.js.map +1 -1
  48. package/dist/components/form/Form.d.ts.map +1 -1
  49. package/dist/components/form/Form.js +5 -3
  50. package/dist/components/form/Form.js.map +1 -1
  51. package/dist/components/form/FormActions.d.ts.map +1 -1
  52. package/dist/components/form/FormActions.js +2 -2
  53. package/dist/components/form/FormActions.js.map +1 -1
  54. package/dist/components/form/FormError.d.ts.map +1 -1
  55. package/dist/components/form/FormError.js +1 -1
  56. package/dist/components/form/FormError.js.map +1 -1
  57. package/dist/components/form/FormField.d.ts.map +1 -1
  58. package/dist/components/form/FormField.js +3 -3
  59. package/dist/components/form/FormField.js.map +1 -1
  60. package/dist/components/gradient/Gradient.d.ts.map +1 -1
  61. package/dist/components/gradient/Gradient.js +1 -1
  62. package/dist/components/gradient/Gradient.js.map +1 -1
  63. package/dist/components/heading/Heading.d.ts.map +1 -1
  64. package/dist/components/heading/Heading.js +2 -2
  65. package/dist/components/heading/Heading.js.map +1 -1
  66. package/dist/components/icon/Icon.d.ts.map +1 -1
  67. package/dist/components/icon/Icon.js +1 -1
  68. package/dist/components/icon/Icon.js.map +1 -1
  69. package/dist/components/icon-button/IconButton.d.ts.map +1 -1
  70. package/dist/components/icon-button/IconButton.js +2 -2
  71. package/dist/components/icon-button/IconButton.js.map +1 -1
  72. package/dist/components/image/Image.d.ts.map +1 -1
  73. package/dist/components/image/Image.js +1 -1
  74. package/dist/components/image/Image.js.map +1 -1
  75. package/dist/components/input/Input.d.ts.map +1 -1
  76. package/dist/components/input/Input.js +2 -2
  77. package/dist/components/input/Input.js.map +1 -1
  78. package/dist/components/media-card/MediaCard.d.ts.map +1 -1
  79. package/dist/components/media-card/MediaCard.js +2 -2
  80. package/dist/components/media-card/MediaCard.js.map +1 -1
  81. package/dist/components/metric-card/MetricCard.d.ts.map +1 -1
  82. package/dist/components/metric-card/MetricCard.js +2 -2
  83. package/dist/components/metric-card/MetricCard.js.map +1 -1
  84. package/dist/components/modal/Modal.d.ts.map +1 -1
  85. package/dist/components/modal/Modal.js +2 -2
  86. package/dist/components/modal/Modal.js.map +1 -1
  87. package/dist/components/navigation-item/NavigationItem.d.ts.map +1 -1
  88. package/dist/components/navigation-item/NavigationItem.js +2 -2
  89. package/dist/components/navigation-item/NavigationItem.js.map +1 -1
  90. package/dist/components/navigation-list/NavigationList.d.ts.map +1 -1
  91. package/dist/components/navigation-list/NavigationList.js +3 -3
  92. package/dist/components/navigation-list/NavigationList.js.map +1 -1
  93. package/dist/components/pagination/Pagination.d.ts.map +1 -1
  94. package/dist/components/pagination/Pagination.js +8 -7
  95. package/dist/components/pagination/Pagination.js.map +1 -1
  96. package/dist/components/progress/Progress.d.ts.map +1 -1
  97. package/dist/components/progress/Progress.js +1 -1
  98. package/dist/components/progress/Progress.js.map +1 -1
  99. package/dist/components/radio/Radio.js +2 -2
  100. package/dist/components/radio/Radio.js.map +1 -1
  101. package/dist/components/radio/RadioGroup.d.ts.map +1 -1
  102. package/dist/components/radio/RadioGroup.js +7 -4
  103. package/dist/components/radio/RadioGroup.js.map +1 -1
  104. package/dist/components/rating/Rating.d.ts.map +1 -1
  105. package/dist/components/rating/Rating.js +1 -1
  106. package/dist/components/rating/Rating.js.map +1 -1
  107. package/dist/components/search-bar/SearchBar.d.ts.map +1 -1
  108. package/dist/components/search-bar/SearchBar.js +5 -2
  109. package/dist/components/search-bar/SearchBar.js.map +1 -1
  110. package/dist/components/select/Select.d.ts.map +1 -1
  111. package/dist/components/select/Select.js +12 -4
  112. package/dist/components/select/Select.js.map +1 -1
  113. package/dist/components/tabs/Tabs.d.ts.map +1 -1
  114. package/dist/components/tabs/Tabs.js +17 -4
  115. package/dist/components/tabs/Tabs.js.map +1 -1
  116. package/dist/components/text/Text.d.ts.map +1 -1
  117. package/dist/components/text/Text.js +1 -1
  118. package/dist/components/text/Text.js.map +1 -1
  119. package/dist/components/textarea/Textarea.d.ts.map +1 -1
  120. package/dist/components/textarea/Textarea.js +2 -2
  121. package/dist/components/textarea/Textarea.js.map +1 -1
  122. package/dist/components/time-picker/TimePicker.d.ts.map +1 -1
  123. package/dist/components/time-picker/TimePicker.js +16 -4
  124. package/dist/components/time-picker/TimePicker.js.map +1 -1
  125. package/dist/components/toolbar/Toolbar.d.ts.map +1 -1
  126. package/dist/components/toolbar/Toolbar.js +1 -1
  127. package/dist/components/toolbar/Toolbar.js.map +1 -1
  128. package/dist/foundation/Box.d.ts.map +1 -1
  129. package/dist/foundation/Box.js +1 -1
  130. package/dist/foundation/Box.js.map +1 -1
  131. package/dist/foundation/Center.d.ts.map +1 -1
  132. package/dist/foundation/Center.js +1 -1
  133. package/dist/foundation/Center.js.map +1 -1
  134. package/dist/foundation/Container.d.ts.map +1 -1
  135. package/dist/foundation/Container.js +1 -1
  136. package/dist/foundation/Container.js.map +1 -1
  137. package/dist/foundation/Divider.d.ts.map +1 -1
  138. package/dist/foundation/Divider.js +1 -1
  139. package/dist/foundation/Divider.js.map +1 -1
  140. package/dist/foundation/Grid.d.ts.map +1 -1
  141. package/dist/foundation/Grid.js +1 -1
  142. package/dist/foundation/Grid.js.map +1 -1
  143. package/dist/foundation/Inline.d.ts.map +1 -1
  144. package/dist/foundation/Inline.js +1 -1
  145. package/dist/foundation/Inline.js.map +1 -1
  146. package/dist/foundation/Show.d.ts.map +1 -1
  147. package/dist/foundation/Show.js +1 -1
  148. package/dist/foundation/Show.js.map +1 -1
  149. package/dist/foundation/Spacer.d.ts.map +1 -1
  150. package/dist/foundation/Spacer.js +1 -1
  151. package/dist/foundation/Spacer.js.map +1 -1
  152. package/dist/foundation/Stack.d.ts.map +1 -1
  153. package/dist/foundation/Stack.js +1 -1
  154. package/dist/foundation/Stack.js.map +1 -1
  155. package/dist/foundation/Surface.d.ts.map +1 -1
  156. package/dist/foundation/Surface.js +1 -1
  157. package/dist/foundation/Surface.js.map +1 -1
  158. package/dist/layout/app-shell/AppShell.d.ts.map +1 -1
  159. package/dist/layout/app-shell/AppShell.js +1 -1
  160. package/dist/layout/app-shell/AppShell.js.map +1 -1
  161. package/dist/layout/screen/Screen.d.ts.map +1 -1
  162. package/dist/layout/screen/Screen.js +1 -1
  163. package/dist/layout/screen/Screen.js.map +1 -1
  164. package/dist/layout/screen-section/ScreenSection.d.ts.map +1 -1
  165. package/dist/layout/screen-section/ScreenSection.js +1 -1
  166. package/dist/layout/screen-section/ScreenSection.js.map +1 -1
  167. package/dist/layout/settings-layout/SettingsLayout.d.ts.map +1 -1
  168. package/dist/layout/settings-layout/SettingsLayout.js +1 -1
  169. package/dist/layout/settings-layout/SettingsLayout.js.map +1 -1
  170. package/dist/layout/sidebar-layout/SidebarLayout.d.ts.map +1 -1
  171. package/dist/layout/sidebar-layout/SidebarLayout.js +1 -1
  172. package/dist/layout/sidebar-layout/SidebarLayout.js.map +1 -1
  173. package/dist/layout/topbar-layout/TopbarLayout.d.ts.map +1 -1
  174. package/dist/layout/topbar-layout/TopbarLayout.js +1 -1
  175. package/dist/layout/topbar-layout/TopbarLayout.js.map +1 -1
  176. package/dist/patterns/auth/ForgotPasswordForm.d.ts.map +1 -1
  177. package/dist/patterns/auth/ForgotPasswordForm.js +3 -3
  178. package/dist/patterns/auth/ForgotPasswordForm.js.map +1 -1
  179. package/dist/patterns/auth/OAuthProviderButton.d.ts.map +1 -1
  180. package/dist/patterns/auth/OAuthProviderButton.js +2 -2
  181. package/dist/patterns/auth/OAuthProviderButton.js.map +1 -1
  182. package/dist/patterns/auth/OAuthProviderList.d.ts.map +1 -1
  183. package/dist/patterns/auth/OAuthProviderList.js +2 -2
  184. package/dist/patterns/auth/OAuthProviderList.js.map +1 -1
  185. package/dist/patterns/auth/OtpForm.d.ts.map +1 -1
  186. package/dist/patterns/auth/OtpForm.js +3 -3
  187. package/dist/patterns/auth/OtpForm.js.map +1 -1
  188. package/dist/patterns/auth/SignInForm.d.ts.map +1 -1
  189. package/dist/patterns/auth/SignInForm.js +4 -4
  190. package/dist/patterns/auth/SignInForm.js.map +1 -1
  191. package/dist/patterns/auth/SignUpForm.d.ts.map +1 -1
  192. package/dist/patterns/auth/SignUpForm.js +3 -3
  193. package/dist/patterns/auth/SignUpForm.js.map +1 -1
  194. package/dist/patterns/chat-list-item/ChatListItem.d.ts.map +1 -1
  195. package/dist/patterns/chat-list-item/ChatListItem.js +2 -2
  196. package/dist/patterns/chat-list-item/ChatListItem.js.map +1 -1
  197. package/dist/patterns/collection-editor/CollectionEditor.d.ts.map +1 -1
  198. package/dist/patterns/collection-editor/CollectionEditor.js +5 -5
  199. package/dist/patterns/collection-editor/CollectionEditor.js.map +1 -1
  200. package/dist/patterns/confirm-dialog/ConfirmDialog.d.ts.map +1 -1
  201. package/dist/patterns/confirm-dialog/ConfirmDialog.js +4 -4
  202. package/dist/patterns/confirm-dialog/ConfirmDialog.js.map +1 -1
  203. package/dist/patterns/disclosure-section/DisclosureSection.d.ts.map +1 -1
  204. package/dist/patterns/disclosure-section/DisclosureSection.js +4 -3
  205. package/dist/patterns/disclosure-section/DisclosureSection.js.map +1 -1
  206. package/dist/patterns/empty-state/EmptyState.d.ts.map +1 -1
  207. package/dist/patterns/empty-state/EmptyState.js +4 -4
  208. package/dist/patterns/empty-state/EmptyState.js.map +1 -1
  209. package/dist/patterns/filter-bar/FilterBar.d.ts.map +1 -1
  210. package/dist/patterns/filter-bar/FilterBar.js +1 -1
  211. package/dist/patterns/filter-bar/FilterBar.js.map +1 -1
  212. package/dist/patterns/hero/Hero.d.ts.map +1 -1
  213. package/dist/patterns/hero/Hero.js +10 -6
  214. package/dist/patterns/hero/Hero.js.map +1 -1
  215. package/dist/patterns/image-preview/ImagePreview.d.ts.map +1 -1
  216. package/dist/patterns/image-preview/ImagePreview.js +1 -1
  217. package/dist/patterns/image-preview/ImagePreview.js.map +1 -1
  218. package/dist/patterns/image-upload-field/ImageUploadField.d.ts.map +1 -1
  219. package/dist/patterns/image-upload-field/ImageUploadField.js +19 -13
  220. package/dist/patterns/image-upload-field/ImageUploadField.js.map +1 -1
  221. package/dist/patterns/inspector-field/InspectorField.d.ts.map +1 -1
  222. package/dist/patterns/inspector-field/InspectorField.js +1 -1
  223. package/dist/patterns/inspector-field/InspectorField.js.map +1 -1
  224. package/dist/patterns/message-bubble/MessageBubble.d.ts.map +1 -1
  225. package/dist/patterns/message-bubble/MessageBubble.js +2 -2
  226. package/dist/patterns/message-bubble/MessageBubble.js.map +1 -1
  227. package/dist/patterns/notice/Notice.d.ts.map +1 -1
  228. package/dist/patterns/notice/Notice.js +1 -1
  229. package/dist/patterns/notice/Notice.js.map +1 -1
  230. package/dist/patterns/post-card/PostCard.d.ts.map +1 -1
  231. package/dist/patterns/post-card/PostCard.js +2 -2
  232. package/dist/patterns/post-card/PostCard.js.map +1 -1
  233. package/dist/patterns/product-card/ProductCard.d.ts.map +1 -1
  234. package/dist/patterns/product-card/ProductCard.js +4 -4
  235. package/dist/patterns/product-card/ProductCard.js.map +1 -1
  236. package/dist/patterns/product-card/types.d.ts +2 -1
  237. package/dist/patterns/product-card/types.d.ts.map +1 -1
  238. package/dist/patterns/product-card/types.js.map +1 -1
  239. package/dist/patterns/responsive-panel/ResponsivePanel.d.ts.map +1 -1
  240. package/dist/patterns/responsive-panel/ResponsivePanel.js +13 -4
  241. package/dist/patterns/responsive-panel/ResponsivePanel.js.map +1 -1
  242. package/dist/patterns/scanner/BarcodeScannerView.d.ts.map +1 -1
  243. package/dist/patterns/scanner/BarcodeScannerView.js +3 -3
  244. package/dist/patterns/scanner/BarcodeScannerView.js.map +1 -1
  245. package/dist/patterns/scanner/CameraPermissionView.d.ts.map +1 -1
  246. package/dist/patterns/scanner/CameraPermissionView.js +4 -4
  247. package/dist/patterns/scanner/CameraPermissionView.js.map +1 -1
  248. package/dist/patterns/scanner/ScanOverlay.d.ts.map +1 -1
  249. package/dist/patterns/scanner/ScanOverlay.js +1 -1
  250. package/dist/patterns/scanner/ScanOverlay.js.map +1 -1
  251. package/dist/patterns/section-header/SectionHeader.d.ts.map +1 -1
  252. package/dist/patterns/section-header/SectionHeader.js +1 -1
  253. package/dist/patterns/section-header/SectionHeader.js.map +1 -1
  254. package/dist/patterns/selection/SelectableItem.d.ts +1 -1
  255. package/dist/patterns/selection/SelectableItem.d.ts.map +1 -1
  256. package/dist/patterns/selection/SelectableItem.js +15 -5
  257. package/dist/patterns/selection/SelectableItem.js.map +1 -1
  258. package/dist/patterns/selection/SelectionProvider.d.ts +1 -1
  259. package/dist/patterns/selection/SelectionProvider.d.ts.map +1 -1
  260. package/dist/patterns/selection/SelectionProvider.js +4 -2
  261. package/dist/patterns/selection/SelectionProvider.js.map +1 -1
  262. package/dist/patterns/selection/types.d.ts +3 -0
  263. package/dist/patterns/selection/types.d.ts.map +1 -1
  264. package/dist/patterns/selection/types.js.map +1 -1
  265. package/dist/patterns/settings-row/SettingsRow.d.ts.map +1 -1
  266. package/dist/patterns/settings-row/SettingsRow.js +3 -3
  267. package/dist/patterns/settings-row/SettingsRow.js.map +1 -1
  268. package/dist/patterns/switch-field/SwitchField.d.ts.map +1 -1
  269. package/dist/patterns/switch-field/SwitchField.js +2 -2
  270. package/dist/patterns/switch-field/SwitchField.js.map +1 -1
  271. package/dist/patterns/tile-grid/TileGrid.d.ts.map +1 -1
  272. package/dist/patterns/tile-grid/TileGrid.js +1 -1
  273. package/dist/patterns/tile-grid/TileGrid.js.map +1 -1
  274. package/dist/patterns/timeline/Timeline.d.ts.map +1 -1
  275. package/dist/patterns/timeline/Timeline.js +1 -1
  276. package/dist/patterns/timeline/Timeline.js.map +1 -1
  277. package/dist/patterns/tree-view/TreeItem.d.ts.map +1 -1
  278. package/dist/patterns/tree-view/TreeItem.js +3 -3
  279. package/dist/patterns/tree-view/TreeItem.js.map +1 -1
  280. package/dist/patterns/tree-view/TreeView.d.ts.map +1 -1
  281. package/dist/patterns/tree-view/TreeView.js +4 -2
  282. package/dist/patterns/tree-view/TreeView.js.map +1 -1
  283. package/dist/patterns/zora-drawer-content/ZoraDrawerContent.d.ts.map +1 -1
  284. package/dist/patterns/zora-drawer-content/ZoraDrawerContent.js +2 -2
  285. package/dist/patterns/zora-drawer-content/ZoraDrawerContent.js.map +1 -1
  286. package/dist/patterns/zora-tab-bar/ZoraTabBar.d.ts.map +1 -1
  287. package/dist/patterns/zora-tab-bar/ZoraTabBar.js +5 -3
  288. package/dist/patterns/zora-tab-bar/ZoraTabBar.js.map +1 -1
  289. package/dist/registry.d.ts.map +1 -1
  290. package/dist/registry.js +2 -1
  291. package/dist/registry.js.map +1 -1
  292. package/dist/theme/ZoraBaseProps.d.ts +6 -0
  293. package/dist/theme/ZoraBaseProps.d.ts.map +1 -1
  294. package/dist/theme/ZoraBaseProps.js.map +1 -1
  295. package/package.json +4 -4
  296. package/src/components/app-bar/AppBar.tsx +3 -0
  297. package/src/components/avatar/Avatar.tsx +1 -0
  298. package/src/components/avatar-group/AvatarGroup.tsx +1 -0
  299. package/src/components/badge/Badge.tsx +1 -0
  300. package/src/components/breadcrumbs/Breadcrumbs.tsx +2 -0
  301. package/src/components/button/Button.tsx +8 -1
  302. package/src/components/button-group/ButtonGroup.tsx +1 -0
  303. package/src/components/card/Card.tsx +3 -1
  304. package/src/components/checkbox/Checkbox.tsx +7 -2
  305. package/src/components/checkbox/CheckboxGroup.tsx +8 -0
  306. package/src/components/chip/Chip.tsx +8 -1
  307. package/src/components/chip-group/ChipGroup.tsx +5 -0
  308. package/src/components/data-table/DataTable.tsx +25 -8
  309. package/src/components/date-picker/DatePicker.tsx +26 -3
  310. package/src/components/drawer/Drawer.tsx +2 -1
  311. package/src/components/form/Form.tsx +5 -0
  312. package/src/components/form/FormActions.tsx +8 -1
  313. package/src/components/form/FormError.tsx +7 -1
  314. package/src/components/form/FormField.tsx +3 -0
  315. package/src/components/gradient/Gradient.tsx +1 -0
  316. package/src/components/heading/Heading.tsx +3 -2
  317. package/src/components/icon/Icon.tsx +6 -1
  318. package/src/components/icon-button/IconButton.tsx +2 -0
  319. package/src/components/image/Image.tsx +6 -1
  320. package/src/components/input/Input.tsx +3 -0
  321. package/src/components/media-card/MediaCard.tsx +2 -0
  322. package/src/components/metric-card/MetricCard.tsx +2 -0
  323. package/src/components/modal/Modal.tsx +2 -1
  324. package/src/components/navigation-item/NavigationItem.tsx +2 -0
  325. package/src/components/navigation-list/NavigationList.tsx +3 -0
  326. package/src/components/pagination/Pagination.tsx +8 -1
  327. package/src/components/progress/Progress.tsx +1 -0
  328. package/src/components/radio/Radio.tsx +2 -2
  329. package/src/components/radio/RadioGroup.tsx +8 -0
  330. package/src/components/rating/Rating.tsx +1 -0
  331. package/src/components/search-bar/SearchBar.tsx +7 -1
  332. package/src/components/select/Select.tsx +30 -21
  333. package/src/components/tabs/Tabs.tsx +17 -3
  334. package/src/components/text/Text.tsx +1 -0
  335. package/src/components/textarea/Textarea.tsx +2 -0
  336. package/src/components/time-picker/TimePicker.tsx +19 -2
  337. package/src/components/toolbar/Toolbar.tsx +1 -0
  338. package/src/foundation/Box.tsx +6 -1
  339. package/src/foundation/Center.tsx +6 -1
  340. package/src/foundation/Container.tsx +6 -1
  341. package/src/foundation/Divider.tsx +6 -1
  342. package/src/foundation/Grid.tsx +6 -1
  343. package/src/foundation/Inline.tsx +6 -1
  344. package/src/foundation/Show.tsx +6 -1
  345. package/src/foundation/Spacer.tsx +6 -1
  346. package/src/foundation/Stack.tsx +6 -1
  347. package/src/foundation/Surface.tsx +6 -1
  348. package/src/interactionPolicy.test.ts +226 -0
  349. package/src/layout/app-shell/AppShell.tsx +1 -0
  350. package/src/layout/screen/Screen.tsx +1 -0
  351. package/src/layout/screen-section/ScreenSection.tsx +1 -0
  352. package/src/layout/settings-layout/SettingsLayout.tsx +1 -0
  353. package/src/layout/sidebar-layout/SidebarLayout.tsx +1 -0
  354. package/src/layout/topbar-layout/TopbarLayout.tsx +1 -0
  355. package/src/patterns/auth/ForgotPasswordForm.tsx +3 -0
  356. package/src/patterns/auth/OAuthProviderButton.tsx +2 -0
  357. package/src/patterns/auth/OAuthProviderList.tsx +2 -0
  358. package/src/patterns/auth/OtpForm.tsx +3 -0
  359. package/src/patterns/auth/SignInForm.tsx +4 -0
  360. package/src/patterns/auth/SignUpForm.tsx +3 -0
  361. package/src/patterns/chat-list-item/ChatListItem.tsx +2 -0
  362. package/src/patterns/collection-editor/CollectionEditor.tsx +12 -1
  363. package/src/patterns/confirm-dialog/ConfirmDialog.tsx +15 -2
  364. package/src/patterns/disclosure-section/DisclosureSection.tsx +4 -1
  365. package/src/patterns/empty-state/EmptyState.tsx +4 -0
  366. package/src/patterns/filter-bar/FilterBar.tsx +1 -0
  367. package/src/patterns/hero/Hero.tsx +14 -4
  368. package/src/patterns/image-preview/ImagePreview.tsx +1 -0
  369. package/src/patterns/image-upload-field/ImageUploadField.tsx +30 -9
  370. package/src/patterns/inspector-field/InspectorField.tsx +1 -0
  371. package/src/patterns/message-bubble/MessageBubble.tsx +2 -0
  372. package/src/patterns/notice/Notice.tsx +1 -0
  373. package/src/patterns/post-card/PostCard.tsx +2 -0
  374. package/src/patterns/product-card/ProductCard.tsx +19 -3
  375. package/src/patterns/product-card/types.ts +3 -1
  376. package/src/patterns/responsive-panel/ResponsivePanel.tsx +15 -2
  377. package/src/patterns/scanner/BarcodeScannerView.tsx +3 -0
  378. package/src/patterns/scanner/CameraPermissionView.tsx +4 -0
  379. package/src/patterns/scanner/ScanOverlay.tsx +1 -0
  380. package/src/patterns/section-header/SectionHeader.tsx +1 -0
  381. package/src/patterns/selection/SelectableItem.tsx +16 -4
  382. package/src/patterns/selection/SelectionProvider.tsx +3 -1
  383. package/src/patterns/selection/types.ts +3 -0
  384. package/src/patterns/settings-row/SettingsRow.tsx +4 -2
  385. package/src/patterns/switch-field/SwitchField.tsx +9 -1
  386. package/src/patterns/tile-grid/TileGrid.tsx +1 -0
  387. package/src/patterns/timeline/Timeline.tsx +1 -0
  388. package/src/patterns/tree-view/TreeItem.tsx +3 -0
  389. package/src/patterns/tree-view/TreeView.tsx +3 -0
  390. package/src/patterns/zora-drawer-content/ZoraDrawerContent.tsx +2 -0
  391. package/src/patterns/zora-tab-bar/ZoraTabBar.tsx +11 -2
  392. package/src/registry.test.ts +53 -102
  393. package/src/registry.ts +28 -2
  394. package/src/theme/ZoraBaseProps.ts +8 -0
@@ -4,7 +4,7 @@ import { Form } from '../../components/form';
4
4
  import { Stack } from '../../foundation';
5
5
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
6
6
  import { defaultIdentifiers, normalizeIdentifierKind, resolveIdentifierLabel, resolveIdentifierRules, resolveIdentifierType, } from './utils';
7
- function ForgotPasswordFormInner({ themeId: _themeId, mode: _mode, identifiers = defaultIdentifiers, identifierLabel, signInLabel = 'Sign in', loading = false, disabled = false, error, submitLabel = 'Send code', onSubmit, onSignIn, testID, }) {
7
+ function ForgotPasswordFormInner({ themeId: _themeId, mode: _mode, interactionPolicy, identifiers = defaultIdentifiers, identifierLabel, signInLabel = 'Sign in', loading = false, disabled = false, error, submitLabel = 'Send code', onSubmit, onSignIn, testID, }) {
8
8
  const [values, setValues] = React.useState({
9
9
  identifier: '',
10
10
  });
@@ -24,10 +24,10 @@ function ForgotPasswordFormInner({ themeId: _themeId, mode: _mode, identifiers =
24
24
  return (<Form actions={onSignIn ? (<Stack direction="row" gap="s" wrap="wrap">
25
25
  <Button disabled={disabled || loading} variant="ghost" onPress={() => {
26
26
  void onSignIn();
27
- }} size="s" color="neutral">
27
+ }} size="s" color="neutral" interactionPolicy={interactionPolicy}>
28
28
  {signInLabel}
29
29
  </Button>
30
- </Stack>) : undefined} disabled={disabled} error={error} fields={fields} loading={loading} onChange={setValues} onSubmit={handleSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
30
+ </Stack>) : undefined} disabled={disabled} error={error} fields={fields} interactionPolicy={interactionPolicy} loading={loading} onChange={setValues} onSubmit={handleSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
31
31
  }
32
32
  /***
33
33
  * Password reset form pattern with validation and submit actions.
@@ -1 +1 @@
1
- {"version":3,"file":"ForgotPasswordForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/ForgotPasswordForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAyC,MAAM,uBAAuB,CAAC;AACpF,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEpE,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,sBAAsB,EACtB,sBAAsB,EACtB,qBAAqB,GACtB,MAAM,SAAS,CAAC;AAIjB,SAAS,uBAAuB,CAAC,EAC/B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,WAAW,GAAG,kBAAkB,EAChC,eAAe,EACf,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,WAAW,GAAG,WAAW,EACzB,QAAQ,EACR,QAAQ,EACR,MAAM,GACkB;IACxB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAsC;QAC9E,UAAU,EAAE,EAAE;KACf,CAAC,CAAC;IACH,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAC1B,GAAG,EAAE,CAAC;QACJ;YACE,IAAI,EAAE,YAAY;YAClB,KAAK,EAAE,eAAe,IAAI,sBAAsB,CAAC,WAAW,CAAC;YAC7D,IAAI,EAAE,qBAAqB,CAAC,WAAW,CAAC;YACxC,cAAc,EAAE,MAAM;YACtB,KAAK,EAAE,sBAAsB,CAAC,WAAW,CAAC;SAC3C;KACF,EACD,CAAC,eAAe,EAAE,WAAW,CAAC,CAC/B,CAAC;IAEF,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,CAAC,UAA+C,EAAE,EAAE,CAClD,QAAQ,CAAC;QACP,UAAU,EAAE,UAAU,CAAC,UAAU,CAAC,IAAI,EAAE;QACxC,cAAc,EAAE,uBAAuB,CAAC,UAAU,CAAC,UAAU,EAAE,WAAW,CAAC;KAC5E,CAAC,EACJ,CAAC,WAAW,EAAE,QAAQ,CAAC,CACxB,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CAAC,CACN,QAAQ,CAAC,CAAC,CAAC,CACT,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CACxC;YAAA,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAC9B,OAAO,CAAC,OAAO,CACf,OAAO,CAAC,CAAC,GAAG,EAAE;gBACZ,KAAK,QAAQ,EAAE,CAAC;YAClB,CAAC,CAAC,CACF,IAAI,CAAC,GAAG,CACR,KAAK,CAAC,SAAS,CAEf;cAAA,CAAC,WAAW,CACd;YAAA,EAAE,MAAM,CACV;UAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,SACN,CAAC,CACD,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,QAAQ,CAAC,CAAC,YAAY,CAAC,CACvB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,kBAAkB,CAAC,uBAAuB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ForgotPasswordFormProps } from './types';\nimport {\n defaultIdentifiers,\n normalizeIdentifierKind,\n resolveIdentifierLabel,\n resolveIdentifierRules,\n resolveIdentifierType,\n} from './utils';\n\ntype ForgotPasswordFieldName = 'identifier';\n\nfunction ForgotPasswordFormInner({\n themeId: _themeId,\n mode: _mode,\n identifiers = defaultIdentifiers,\n identifierLabel,\n signInLabel = 'Sign in',\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Send code',\n onSubmit,\n onSignIn,\n testID,\n}: ForgotPasswordFormProps) {\n const [values, setValues] = React.useState<FormValues<ForgotPasswordFieldName>>({\n identifier: '',\n });\n const fields = React.useMemo<readonly FormFieldConfig<ForgotPasswordFieldName>[]>(\n () => [\n {\n name: 'identifier',\n label: identifierLabel ?? resolveIdentifierLabel(identifiers),\n type: resolveIdentifierType(identifiers),\n autoCapitalize: 'none',\n rules: resolveIdentifierRules(identifiers),\n },\n ],\n [identifierLabel, identifiers],\n );\n\n const handleSubmit = React.useCallback(\n (formValues: FormValues<ForgotPasswordFieldName>) =>\n onSubmit({\n identifier: formValues.identifier.trim(),\n identifierKind: normalizeIdentifierKind(formValues.identifier, identifiers),\n }),\n [identifiers, onSubmit],\n );\n\n return (\n <Form\n actions={\n onSignIn ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onSignIn();\n }}\n size=\"s\"\n color=\"neutral\"\n >\n {signInLabel}\n </Button>\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n loading={loading}\n onChange={setValues}\n onSubmit={handleSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * Password reset form pattern with validation and submit actions.\n *\n \n */\nexport const ForgotPasswordForm = withZoraThemeScope(ForgotPasswordFormInner);\n"]}
1
+ {"version":3,"file":"ForgotPasswordForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/ForgotPasswordForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ForgotPasswordFormProps } from './types';\nimport {\n defaultIdentifiers,\n normalizeIdentifierKind,\n resolveIdentifierLabel,\n resolveIdentifierRules,\n resolveIdentifierType,\n} from './utils';\n\ntype ForgotPasswordFieldName = 'identifier';\n\nfunction ForgotPasswordFormInner({\n themeId: _themeId,\n mode: _mode,\n interactionPolicy,\n identifiers = defaultIdentifiers,\n identifierLabel,\n signInLabel = 'Sign in',\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Send code',\n onSubmit,\n onSignIn,\n testID,\n}: ForgotPasswordFormProps) {\n const [values, setValues] = React.useState<FormValues<ForgotPasswordFieldName>>({\n identifier: '',\n });\n const fields = React.useMemo<readonly FormFieldConfig<ForgotPasswordFieldName>[]>(\n () => [\n {\n name: 'identifier',\n label: identifierLabel ?? resolveIdentifierLabel(identifiers),\n type: resolveIdentifierType(identifiers),\n autoCapitalize: 'none',\n rules: resolveIdentifierRules(identifiers),\n },\n ],\n [identifierLabel, identifiers],\n );\n\n const handleSubmit = React.useCallback(\n (formValues: FormValues<ForgotPasswordFieldName>) =>\n onSubmit({\n identifier: formValues.identifier.trim(),\n identifierKind: normalizeIdentifierKind(formValues.identifier, identifiers),\n }),\n [identifiers, onSubmit],\n );\n\n return (\n <Form\n actions={\n onSignIn ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onSignIn();\n }}\n size=\"s\"\n color=\"neutral\"\n interactionPolicy={interactionPolicy}\n >\n {signInLabel}\n </Button>\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n interactionPolicy={interactionPolicy}\n loading={loading}\n onChange={setValues}\n onSubmit={handleSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * Password reset form pattern with validation and submit actions.\n *\n \n */\nexport const ForgotPasswordForm = withZoraThemeScope(ForgotPasswordFormInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"OAuthProviderButton.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAuCxD;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,gEAA+C,CAAC"}
1
+ {"version":3,"file":"OAuthProviderButton.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAyCxD;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,gEAA+C,CAAC"}
@@ -2,10 +2,10 @@ import React from 'react';
2
2
  import { Button } from '../../components/button';
3
3
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
4
4
  import { resolveOAuthProviderIcon, resolveOAuthProviderLabel } from './oauthProviders';
5
- function OAuthProviderButtonInner({ themeId: _themeId, mode: _mode, providerId, label, icon, disabled = false, loading = false, fullWidth = true, size = 'l', variant = 'outline', color = 'neutral', onPress, testID, }) {
5
+ function OAuthProviderButtonInner({ themeId: _themeId, mode: _mode, interactionPolicy, providerId, label, icon, disabled = false, loading = false, fullWidth = true, size = 'l', variant = 'outline', color = 'neutral', onPress, testID, }) {
6
6
  const resolvedIcon = icon ?? resolveOAuthProviderIcon(providerId);
7
7
  const resolvedLabel = label ?? `Continue with ${resolveOAuthProviderLabel(providerId)}`;
8
- return (<Button color={color} disabled={disabled || loading || onPress === undefined} fullWidth={fullWidth} leadingIcon={resolvedIcon} loading={loading} onPress={() => {
8
+ return (<Button color={color} disabled={disabled || loading || onPress === undefined} fullWidth={fullWidth} interactionPolicy={interactionPolicy} leadingIcon={resolvedIcon} loading={loading} onPress={() => {
9
9
  void onPress?.(providerId);
10
10
  }} size={size} testID={testID} variant={variant}>
11
11
  {resolvedLabel}
@@ -1 +1 @@
1
- {"version":3,"file":"OAuthProviderButton.js","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,wBAAwB,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAGvF,SAAS,wBAAwB,CAAC,EAChC,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,UAAU,EACV,KAAK,EACL,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,SAAS,GAAG,IAAI,EAChB,IAAI,GAAG,GAAG,EACV,OAAO,GAAG,SAAS,EACnB,KAAK,GAAG,SAAS,EACjB,OAAO,EACP,MAAM,GACmB;IACzB,MAAM,YAAY,GAAG,IAAI,IAAI,wBAAwB,CAAC,UAAU,CAAC,CAAC;IAClE,MAAM,aAAa,GAAG,KAAK,IAAI,iBAAiB,yBAAyB,CAAC,UAAU,CAAC,EAAE,CAAC;IAExF,OAAO,CACL,CAAC,MAAM,CACL,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,IAAI,OAAO,IAAI,OAAO,KAAK,SAAS,CAAC,CACvD,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,WAAW,CAAC,CAAC,YAAY,CAAC,CAC1B,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,OAAO,CAAC,CAAC,GAAG,EAAE;YACZ,KAAK,OAAO,EAAE,CAAC,UAAU,CAAC,CAAC;QAC7B,CAAC,CAAC,CACF,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CAEjB;MAAA,CAAC,aAAa,CAChB;IAAA,EAAE,MAAM,CAAC,CACV,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,wBAAwB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { resolveOAuthProviderIcon, resolveOAuthProviderLabel } from './oauthProviders';\nimport type { OAuthProviderButtonProps } from './types';\n\nfunction OAuthProviderButtonInner({\n themeId: _themeId,\n mode: _mode,\n providerId,\n label,\n icon,\n disabled = false,\n loading = false,\n fullWidth = true,\n size = 'l',\n variant = 'outline',\n color = 'neutral',\n onPress,\n testID,\n}: OAuthProviderButtonProps) {\n const resolvedIcon = icon ?? resolveOAuthProviderIcon(providerId);\n const resolvedLabel = label ?? `Continue with ${resolveOAuthProviderLabel(providerId)}`;\n\n return (\n <Button\n color={color}\n disabled={disabled || loading || onPress === undefined}\n fullWidth={fullWidth}\n leadingIcon={resolvedIcon}\n loading={loading}\n onPress={() => {\n void onPress?.(providerId);\n }}\n size={size}\n testID={testID}\n variant={variant}\n >\n {resolvedLabel}\n </Button>\n );\n}\n\n/***\n * Renders a provider-branded OAuth action button without owning auth behavior.\n *\n * The component only renders UI and forwards the provider id through `onPress`.\n * Adapters, redirects, and callback handling belong to app/runtime layers.\n */\nexport const OAuthProviderButton = withZoraThemeScope(OAuthProviderButtonInner);\n"]}
1
+ {"version":3,"file":"OAuthProviderButton.js","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,wBAAwB,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAGvF,SAAS,wBAAwB,CAAC,EAChC,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,iBAAiB,EACjB,UAAU,EACV,KAAK,EACL,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,SAAS,GAAG,IAAI,EAChB,IAAI,GAAG,GAAG,EACV,OAAO,GAAG,SAAS,EACnB,KAAK,GAAG,SAAS,EACjB,OAAO,EACP,MAAM,GACmB;IACzB,MAAM,YAAY,GAAG,IAAI,IAAI,wBAAwB,CAAC,UAAU,CAAC,CAAC;IAClE,MAAM,aAAa,GAAG,KAAK,IAAI,iBAAiB,yBAAyB,CAAC,UAAU,CAAC,EAAE,CAAC;IAExF,OAAO,CACL,CAAC,MAAM,CACL,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,IAAI,OAAO,IAAI,OAAO,KAAK,SAAS,CAAC,CACvD,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,WAAW,CAAC,CAAC,YAAY,CAAC,CAC1B,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,OAAO,CAAC,CAAC,GAAG,EAAE;YACZ,KAAK,OAAO,EAAE,CAAC,UAAU,CAAC,CAAC;QAC7B,CAAC,CAAC,CACF,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CAEjB;MAAA,CAAC,aAAa,CAChB;IAAA,EAAE,MAAM,CAAC,CACV,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,kBAAkB,CAAC,wBAAwB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { resolveOAuthProviderIcon, resolveOAuthProviderLabel } from './oauthProviders';\nimport type { OAuthProviderButtonProps } from './types';\n\nfunction OAuthProviderButtonInner({\n themeId: _themeId,\n mode: _mode,\n interactionPolicy,\n providerId,\n label,\n icon,\n disabled = false,\n loading = false,\n fullWidth = true,\n size = 'l',\n variant = 'outline',\n color = 'neutral',\n onPress,\n testID,\n}: OAuthProviderButtonProps) {\n const resolvedIcon = icon ?? resolveOAuthProviderIcon(providerId);\n const resolvedLabel = label ?? `Continue with ${resolveOAuthProviderLabel(providerId)}`;\n\n return (\n <Button\n color={color}\n disabled={disabled || loading || onPress === undefined}\n fullWidth={fullWidth}\n interactionPolicy={interactionPolicy}\n leadingIcon={resolvedIcon}\n loading={loading}\n onPress={() => {\n void onPress?.(providerId);\n }}\n size={size}\n testID={testID}\n variant={variant}\n >\n {resolvedLabel}\n </Button>\n );\n}\n\n/***\n * Renders a provider-branded OAuth action button without owning auth behavior.\n *\n * The component only renders UI and forwards the provider id through `onPress`.\n * Adapters, redirects, and callback handling belong to app/runtime layers.\n */\nexport const OAuthProviderButton = withZoraThemeScope(OAuthProviderButtonInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"OAuthProviderList.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AA6CtD;;GAEG;AACH,eAAO,MAAM,iBAAiB,8DAA6C,CAAC"}
1
+ {"version":3,"file":"OAuthProviderList.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AA+CtD;;GAEG;AACH,eAAO,MAAM,iBAAiB,8DAA6C,CAAC"}
@@ -2,11 +2,11 @@ import React from 'react';
2
2
  import { Stack } from '../../foundation';
3
3
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
4
4
  import { OAuthProviderButton } from './OAuthProviderButton';
5
- function OAuthProviderListInner({ themeId: _themeId, mode: _mode, providers, disabled = false, loading = false, fullWidth, layout = 'stack', size, variant, color, onProviderPress, testID, }) {
5
+ function OAuthProviderListInner({ themeId: _themeId, mode: _mode, interactionPolicy, providers, disabled = false, loading = false, fullWidth, layout = 'stack', size, variant, color, onProviderPress, testID, }) {
6
6
  const direction = layout === 'inline' ? 'row' : 'column';
7
7
  const resolvedFullWidth = fullWidth ?? layout === 'stack';
8
8
  return (<Stack direction={direction} gap="s" testID={testID} wrap={layout === 'inline' ? 'wrap' : undefined}>
9
- {providers.map((provider) => (<OAuthProviderButton color={color} disabled={disabled || provider.disabled} fullWidth={resolvedFullWidth} icon={provider.icon} key={provider.id} label={provider.label} loading={loading || provider.loading} onPress={onProviderPress} providerId={provider.id} size={size} variant={variant}/>))}
9
+ {providers.map((provider) => (<OAuthProviderButton color={color} disabled={disabled || provider.disabled} fullWidth={resolvedFullWidth} icon={provider.icon} key={provider.id} label={provider.label} loading={loading || provider.loading} onPress={onProviderPress} providerId={provider.id} size={size} variant={variant} interactionPolicy={interactionPolicy}/>))}
10
10
  </Stack>);
11
11
  }
12
12
  /***
@@ -1 +1 @@
1
- {"version":3,"file":"OAuthProviderList.js","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAG5D,SAAS,sBAAsB,CAAC,EAC9B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,SAAS,EACT,MAAM,GAAG,OAAO,EAChB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,eAAe,EACf,MAAM,GACiB;IACvB,MAAM,SAAS,GAAG,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC;IACzD,MAAM,iBAAiB,GAAG,SAAS,IAAI,MAAM,KAAK,OAAO,CAAC;IAE1D,OAAO,CACL,CAAC,KAAK,CACJ,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,GAAG,CAAC,GAAG,CACP,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,CAAC,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAE/C;MAAA,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAC3B,CAAC,mBAAmB,CAClB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,CAAC,CACxC,SAAS,CAAC,CAAC,iBAAiB,CAAC,CAC7B,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CACpB,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CACjB,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CACtB,OAAO,CAAC,CAAC,OAAO,IAAI,QAAQ,CAAC,OAAO,CAAC,CACrC,OAAO,CAAC,CAAC,eAAe,CAAC,CACzB,UAAU,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CACxB,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,OAAO,CAAC,CAAC,OAAO,CAAC,EACjB,CACH,CAAC,CACJ;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,kBAAkB,CAAC,sBAAsB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { OAuthProviderButton } from './OAuthProviderButton';\nimport type { OAuthProviderListProps } from './types';\n\nfunction OAuthProviderListInner({\n themeId: _themeId,\n mode: _mode,\n providers,\n disabled = false,\n loading = false,\n fullWidth,\n layout = 'stack',\n size,\n variant,\n color,\n onProviderPress,\n testID,\n}: OAuthProviderListProps) {\n const direction = layout === 'inline' ? 'row' : 'column';\n const resolvedFullWidth = fullWidth ?? layout === 'stack';\n\n return (\n <Stack\n direction={direction}\n gap=\"s\"\n testID={testID}\n wrap={layout === 'inline' ? 'wrap' : undefined}\n >\n {providers.map((provider) => (\n <OAuthProviderButton\n color={color}\n disabled={disabled || provider.disabled}\n fullWidth={resolvedFullWidth}\n icon={provider.icon}\n key={provider.id}\n label={provider.label}\n loading={loading || provider.loading}\n onPress={onProviderPress}\n providerId={provider.id}\n size={size}\n variant={variant}\n />\n ))}\n </Stack>\n );\n}\n\n/***\n * Renders a group of OAuth provider buttons for sign-in and auth settings flows.\n */\nexport const OAuthProviderList = withZoraThemeScope(OAuthProviderListInner);\n"]}
1
+ {"version":3,"file":"OAuthProviderList.js","sourceRoot":"","sources":["../../../src/patterns/auth/OAuthProviderList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAG5D,SAAS,sBAAsB,CAAC,EAC9B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,iBAAiB,EACjB,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,SAAS,EACT,MAAM,GAAG,OAAO,EAChB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,eAAe,EACf,MAAM,GACiB;IACvB,MAAM,SAAS,GAAG,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC;IACzD,MAAM,iBAAiB,GAAG,SAAS,IAAI,MAAM,KAAK,OAAO,CAAC;IAE1D,OAAO,CACL,CAAC,KAAK,CACJ,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,GAAG,CAAC,GAAG,CACP,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,CAAC,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAE/C;MAAA,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAC3B,CAAC,mBAAmB,CAClB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,CAAC,CACxC,SAAS,CAAC,CAAC,iBAAiB,CAAC,CAC7B,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CACpB,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CACjB,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CACtB,OAAO,CAAC,CAAC,OAAO,IAAI,QAAQ,CAAC,OAAO,CAAC,CACrC,OAAO,CAAC,CAAC,eAAe,CAAC,CACzB,UAAU,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CACxB,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,EACrC,CACH,CAAC,CACJ;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,kBAAkB,CAAC,sBAAsB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { OAuthProviderButton } from './OAuthProviderButton';\nimport type { OAuthProviderListProps } from './types';\n\nfunction OAuthProviderListInner({\n themeId: _themeId,\n mode: _mode,\n interactionPolicy,\n providers,\n disabled = false,\n loading = false,\n fullWidth,\n layout = 'stack',\n size,\n variant,\n color,\n onProviderPress,\n testID,\n}: OAuthProviderListProps) {\n const direction = layout === 'inline' ? 'row' : 'column';\n const resolvedFullWidth = fullWidth ?? layout === 'stack';\n\n return (\n <Stack\n direction={direction}\n gap=\"s\"\n testID={testID}\n wrap={layout === 'inline' ? 'wrap' : undefined}\n >\n {providers.map((provider) => (\n <OAuthProviderButton\n color={color}\n disabled={disabled || provider.disabled}\n fullWidth={resolvedFullWidth}\n icon={provider.icon}\n key={provider.id}\n label={provider.label}\n loading={loading || provider.loading}\n onPress={onProviderPress}\n providerId={provider.id}\n size={size}\n variant={variant}\n interactionPolicy={interactionPolicy}\n />\n ))}\n </Stack>\n );\n}\n\n/***\n * Renders a group of OAuth provider buttons for sign-in and auth settings flows.\n */\nexport const OAuthProviderList = withZoraThemeScope(OAuthProviderListInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"OtpForm.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/OtpForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AA8E5C;;;;GAIG;AACH,eAAO,MAAM,OAAO,oDAAmC,CAAC"}
1
+ {"version":3,"file":"OtpForm.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/OtpForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAiF5C;;;;GAIG;AACH,eAAO,MAAM,OAAO,oDAAmC,CAAC"}
@@ -3,7 +3,7 @@ import { Button } from '../../components/button';
3
3
  import { Form } from '../../components/form';
4
4
  import { Stack } from '../../foundation';
5
5
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
6
- function OtpFormInner({ themeId: _themeId, mode: _mode, length = 6, otpLabel = 'Code', resendLabel = 'Resend code', resendDisabled = false, resendLoading = false, loading = false, disabled = false, error, submitLabel = 'Verify code', onSubmit, onResend, testID, }) {
6
+ function OtpFormInner({ themeId: _themeId, mode: _mode, interactionPolicy, length = 6, otpLabel = 'Code', resendLabel = 'Resend code', resendDisabled = false, resendLoading = false, loading = false, disabled = false, error, submitLabel = 'Verify code', onSubmit, onResend, testID, }) {
7
7
  const resolvedLength = Math.max(1, length);
8
8
  const [values, setValues] = React.useState({
9
9
  otp: '',
@@ -23,10 +23,10 @@ function OtpFormInner({ themeId: _themeId, mode: _mode, length = 6, otpLabel = '
23
23
  return (<Form actions={onResend ? (<Stack direction="row" gap="s" wrap="wrap">
24
24
  <Button disabled={disabled || loading || resendDisabled} variant="ghost" loading={resendLoading} onPress={() => {
25
25
  void onResend();
26
- }} size="s" color="neutral">
26
+ }} size="s" color="neutral" interactionPolicy={interactionPolicy}>
27
27
  {resendLabel}
28
28
  </Button>
29
- </Stack>) : undefined} disabled={disabled} error={error} fields={fields} loading={loading} onChange={setValues} onSubmit={handleSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
29
+ </Stack>) : undefined} disabled={disabled} error={error} fields={fields} interactionPolicy={interactionPolicy} loading={loading} onChange={setValues} onSubmit={handleSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
30
30
  }
31
31
  /***
32
32
  * One-time passcode form pattern with digit input and submit actions.
@@ -1 +1 @@
1
- {"version":3,"file":"OtpForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/OtpForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAyC,MAAM,uBAAuB,CAAC;AACpF,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAKpE,SAAS,YAAY,CAAC,EACpB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,MAAM,GAAG,CAAC,EACV,QAAQ,GAAG,MAAM,EACjB,WAAW,GAAG,aAAa,EAC3B,cAAc,GAAG,KAAK,EACtB,aAAa,GAAG,KAAK,EACrB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,WAAW,GAAG,aAAa,EAC3B,QAAQ,EACR,QAAQ,EACR,MAAM,GACO;IACb,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA2B;QACnE,GAAG,EAAE,EAAE;KACR,CAAC,CAAC;IACH,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAC1B,GAAG,EAAE,CAAC;QACJ;YACE,IAAI,EAAE,KAAK;YACX,KAAK,EAAE,QAAQ;YACf,IAAI,EAAE,KAAK;YACX,SAAS,EAAE,cAAc;YACzB,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;SAC5E;KACF,EACD,CAAC,QAAQ,EAAE,cAAc,CAAC,CAC3B,CAAC;IAEF,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,CAAC,UAAoC,EAAE,EAAE,CACvC,QAAQ,CAAC;QACP,GAAG,EAAE,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE;KAC3B,CAAC,EACJ,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CAAC,CACN,QAAQ,CAAC,CAAC,CAAC,CACT,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CACxC;YAAA,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,QAAQ,IAAI,OAAO,IAAI,cAAc,CAAC,CAChD,OAAO,CAAC,OAAO,CACf,OAAO,CAAC,CAAC,aAAa,CAAC,CACvB,OAAO,CAAC,CAAC,GAAG,EAAE;gBACZ,KAAK,QAAQ,EAAE,CAAC;YAClB,CAAC,CAAC,CACF,IAAI,CAAC,GAAG,CACR,KAAK,CAAC,SAAS,CAEf;cAAA,CAAC,WAAW,CACd;YAAA,EAAE,MAAM,CACV;UAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,SACN,CAAC,CACD,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,QAAQ,CAAC,CAAC,YAAY,CAAC,CACvB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,kBAAkB,CAAC,YAAY,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { OtpFormProps } from './types';\n\ntype OtpFieldName = 'otp';\n\nfunction OtpFormInner({\n themeId: _themeId,\n mode: _mode,\n length = 6,\n otpLabel = 'Code',\n resendLabel = 'Resend code',\n resendDisabled = false,\n resendLoading = false,\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Verify code',\n onSubmit,\n onResend,\n testID,\n}: OtpFormProps) {\n const resolvedLength = Math.max(1, length);\n const [values, setValues] = React.useState<FormValues<OtpFieldName>>({\n otp: '',\n });\n const fields = React.useMemo<readonly FormFieldConfig<OtpFieldName>[]>(\n () => [\n {\n name: 'otp',\n label: otpLabel,\n type: 'otp',\n maxLength: resolvedLength,\n rules: [{ kind: 'required' }, { kind: 'minLength', value: resolvedLength }],\n },\n ],\n [otpLabel, resolvedLength],\n );\n\n const handleSubmit = React.useCallback(\n (formValues: FormValues<OtpFieldName>) =>\n onSubmit({\n otp: formValues.otp.trim(),\n }),\n [onSubmit],\n );\n\n return (\n <Form\n actions={\n onResend ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n <Button\n disabled={disabled || loading || resendDisabled}\n variant=\"ghost\"\n loading={resendLoading}\n onPress={() => {\n void onResend();\n }}\n size=\"s\"\n color=\"neutral\"\n >\n {resendLabel}\n </Button>\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n loading={loading}\n onChange={setValues}\n onSubmit={handleSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * One-time passcode form pattern with digit input and submit actions.\n *\n \n */\nexport const OtpForm = withZoraThemeScope(OtpFormInner);\n"]}
1
+ {"version":3,"file":"OtpForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/OtpForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { OtpFormProps } from './types';\n\ntype OtpFieldName = 'otp';\n\nfunction OtpFormInner({\n themeId: _themeId,\n mode: _mode,\n interactionPolicy,\n length = 6,\n otpLabel = 'Code',\n resendLabel = 'Resend code',\n resendDisabled = false,\n resendLoading = false,\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Verify code',\n onSubmit,\n onResend,\n testID,\n}: OtpFormProps) {\n const resolvedLength = Math.max(1, length);\n const [values, setValues] = React.useState<FormValues<OtpFieldName>>({\n otp: '',\n });\n const fields = React.useMemo<readonly FormFieldConfig<OtpFieldName>[]>(\n () => [\n {\n name: 'otp',\n label: otpLabel,\n type: 'otp',\n maxLength: resolvedLength,\n rules: [{ kind: 'required' }, { kind: 'minLength', value: resolvedLength }],\n },\n ],\n [otpLabel, resolvedLength],\n );\n\n const handleSubmit = React.useCallback(\n (formValues: FormValues<OtpFieldName>) =>\n onSubmit({\n otp: formValues.otp.trim(),\n }),\n [onSubmit],\n );\n\n return (\n <Form\n actions={\n onResend ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n <Button\n disabled={disabled || loading || resendDisabled}\n variant=\"ghost\"\n loading={resendLoading}\n onPress={() => {\n void onResend();\n }}\n size=\"s\"\n color=\"neutral\"\n interactionPolicy={interactionPolicy}\n >\n {resendLabel}\n </Button>\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n interactionPolicy={interactionPolicy}\n loading={loading}\n onChange={setValues}\n onSubmit={handleSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * One-time passcode form pattern with digit input and submit actions.\n *\n \n */\nexport const OtpForm = withZoraThemeScope(OtpFormInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"SignInForm.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/SignInForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA6G/C;;;;GAIG;AACH,eAAO,MAAM,UAAU,uDAAsC,CAAC"}
1
+ {"version":3,"file":"SignInForm.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/SignInForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAiH/C;;;;GAIG;AACH,eAAO,MAAM,UAAU,uDAAsC,CAAC"}
@@ -4,7 +4,7 @@ import { Form } from '../../components/form';
4
4
  import { Stack } from '../../foundation';
5
5
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
6
6
  import { defaultIdentifiers, normalizeIdentifierKind, resolveIdentifierLabel, resolveIdentifierRules, resolveIdentifierType, } from './utils';
7
- function SignInFormInner({ themeId: _themeId, mode: _mode, identifiers = defaultIdentifiers, identifierLabel, secretLabel = 'Password', forgotPasswordLabel = 'Forgot password', signUpLabel = 'Sign up', loading = false, disabled = false, error, submitLabel = 'Sign in', onSubmit, onForgotPassword, onSignUp, testID, }) {
7
+ function SignInFormInner({ themeId: _themeId, interactionPolicy, mode: _mode, identifiers = defaultIdentifiers, identifierLabel, secretLabel = 'Password', forgotPasswordLabel = 'Forgot password', signUpLabel = 'Sign up', loading = false, disabled = false, error, submitLabel = 'Sign in', onSubmit, onForgotPassword, onSignUp, testID, }) {
8
8
  const [values, setValues] = React.useState({
9
9
  identifier: '',
10
10
  secret: '',
@@ -33,15 +33,15 @@ function SignInFormInner({ themeId: _themeId, mode: _mode, identifiers = default
33
33
  return (<Form actions={hasActions ? (<Stack direction="row" gap="s" wrap="wrap">
34
34
  {onForgotPassword ? (<Button disabled={disabled || loading} variant="ghost" onPress={() => {
35
35
  void onForgotPassword();
36
- }} size="s" color="neutral">
36
+ }} size="s" color="neutral" interactionPolicy={interactionPolicy}>
37
37
  {forgotPasswordLabel}
38
38
  </Button>) : null}
39
39
  {onSignUp ? (<Button disabled={disabled || loading} variant="ghost" onPress={() => {
40
40
  void onSignUp();
41
- }} size="s" color="neutral">
41
+ }} size="s" color="neutral" interactionPolicy={interactionPolicy}>
42
42
  {signUpLabel}
43
43
  </Button>) : null}
44
- </Stack>) : undefined} disabled={disabled} error={error} fields={fields} loading={loading} onChange={setValues} onSubmit={handleSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
44
+ </Stack>) : undefined} disabled={disabled} error={error} fields={fields} interactionPolicy={interactionPolicy} loading={loading} onChange={setValues} onSubmit={handleSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
45
45
  }
46
46
  /***
47
47
  * Sign-in form pattern with identifier and password fields.
@@ -1 +1 @@
1
- {"version":3,"file":"SignInForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/SignInForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SignInFormProps } from './types';\nimport {\n defaultIdentifiers,\n normalizeIdentifierKind,\n resolveIdentifierLabel,\n resolveIdentifierRules,\n resolveIdentifierType,\n} from './utils';\n\ntype SignInFieldName = 'identifier' | 'secret';\n\nfunction SignInFormInner({\n themeId: _themeId,\n mode: _mode,\n identifiers = defaultIdentifiers,\n identifierLabel,\n secretLabel = 'Password',\n forgotPasswordLabel = 'Forgot password',\n signUpLabel = 'Sign up',\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Sign in',\n onSubmit,\n onForgotPassword,\n onSignUp,\n testID,\n}: SignInFormProps) {\n const [values, setValues] = React.useState<FormValues<SignInFieldName>>({\n identifier: '',\n secret: '',\n });\n const hasActions = Boolean(onForgotPassword ?? onSignUp);\n const fields = React.useMemo<readonly FormFieldConfig<SignInFieldName>[]>(\n () => [\n {\n name: 'identifier',\n label: identifierLabel ?? resolveIdentifierLabel(identifiers),\n type: resolveIdentifierType(identifiers),\n autoCapitalize: 'none',\n rules: resolveIdentifierRules(identifiers),\n },\n {\n name: 'secret',\n label: secretLabel,\n type: 'password',\n rules: [{ kind: 'required' }],\n },\n ],\n [identifierLabel, identifiers, secretLabel],\n );\n\n const handleSubmit = React.useCallback(\n (formValues: FormValues<SignInFieldName>) =>\n onSubmit({\n identifier: formValues.identifier.trim(),\n identifierKind: normalizeIdentifierKind(formValues.identifier, identifiers),\n secret: formValues.secret,\n }),\n [identifiers, onSubmit],\n );\n\n return (\n <Form\n actions={\n hasActions ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n {onForgotPassword ? (\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onForgotPassword();\n }}\n size=\"s\"\n color=\"neutral\"\n >\n {forgotPasswordLabel}\n </Button>\n ) : null}\n {onSignUp ? (\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onSignUp();\n }}\n size=\"s\"\n color=\"neutral\"\n >\n {signUpLabel}\n </Button>\n ) : null}\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n loading={loading}\n onChange={setValues}\n onSubmit={handleSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * Sign-in form pattern with identifier and password fields.\n *\n \n */\nexport const SignInForm = withZoraThemeScope(SignInFormInner);\n"]}
1
+ {"version":3,"file":"SignInForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/SignInForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SignInFormProps } from './types';\nimport {\n defaultIdentifiers,\n normalizeIdentifierKind,\n resolveIdentifierLabel,\n resolveIdentifierRules,\n resolveIdentifierType,\n} from './utils';\n\ntype SignInFieldName = 'identifier' | 'secret';\n\nfunction SignInFormInner({\n themeId: _themeId,\n interactionPolicy,\n mode: _mode,\n identifiers = defaultIdentifiers,\n identifierLabel,\n secretLabel = 'Password',\n forgotPasswordLabel = 'Forgot password',\n signUpLabel = 'Sign up',\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Sign in',\n onSubmit,\n onForgotPassword,\n onSignUp,\n testID,\n}: SignInFormProps) {\n const [values, setValues] = React.useState<FormValues<SignInFieldName>>({\n identifier: '',\n secret: '',\n });\n const hasActions = Boolean(onForgotPassword ?? onSignUp);\n const fields = React.useMemo<readonly FormFieldConfig<SignInFieldName>[]>(\n () => [\n {\n name: 'identifier',\n label: identifierLabel ?? resolveIdentifierLabel(identifiers),\n type: resolveIdentifierType(identifiers),\n autoCapitalize: 'none',\n rules: resolveIdentifierRules(identifiers),\n },\n {\n name: 'secret',\n label: secretLabel,\n type: 'password',\n rules: [{ kind: 'required' }],\n },\n ],\n [identifierLabel, identifiers, secretLabel],\n );\n\n const handleSubmit = React.useCallback(\n (formValues: FormValues<SignInFieldName>) =>\n onSubmit({\n identifier: formValues.identifier.trim(),\n identifierKind: normalizeIdentifierKind(formValues.identifier, identifiers),\n secret: formValues.secret,\n }),\n [identifiers, onSubmit],\n );\n\n return (\n <Form\n actions={\n hasActions ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n {onForgotPassword ? (\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onForgotPassword();\n }}\n size=\"s\"\n color=\"neutral\"\n interactionPolicy={interactionPolicy}\n >\n {forgotPasswordLabel}\n </Button>\n ) : null}\n {onSignUp ? (\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onSignUp();\n }}\n size=\"s\"\n color=\"neutral\"\n interactionPolicy={interactionPolicy}\n >\n {signUpLabel}\n </Button>\n ) : null}\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n interactionPolicy={interactionPolicy}\n loading={loading}\n onChange={setValues}\n onSubmit={handleSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * Sign-in form pattern with identifier and password fields.\n *\n \n */\nexport const SignInForm = withZoraThemeScope(SignInFormInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"SignUpForm.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/SignUpForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA0E/C;;;;GAIG;AACH,eAAO,MAAM,UAAU,uDAAsC,CAAC"}
1
+ {"version":3,"file":"SignUpForm.d.ts","sourceRoot":"","sources":["../../../src/patterns/auth/SignUpForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA6E/C;;;;GAIG;AACH,eAAO,MAAM,UAAU,uDAAsC,CAAC"}
@@ -25,15 +25,15 @@ function createValues(fields) {
25
25
  }, {});
26
26
  return values;
27
27
  }
28
- function SignUpFormInner({ themeId: _themeId, mode: _mode, fields = defaultSignUpFields, signInLabel = 'Sign in', loading = false, disabled = false, error, submitLabel = 'Sign up', onSubmit, onSignIn, testID, }) {
28
+ function SignUpFormInner({ themeId: _themeId, interactionPolicy, mode: _mode, fields = defaultSignUpFields, signInLabel = 'Sign in', loading = false, disabled = false, error, submitLabel = 'Sign up', onSubmit, onSignIn, testID, }) {
29
29
  const [values, setValues] = React.useState(() => createValues(fields));
30
30
  return (<Form actions={onSignIn ? (<Stack direction="row" gap="s" wrap="wrap">
31
31
  <Button disabled={disabled || loading} variant="ghost" onPress={() => {
32
32
  void onSignIn();
33
- }} size="s" color="neutral">
33
+ }} size="s" color="neutral" interactionPolicy={interactionPolicy}>
34
34
  {signInLabel}
35
35
  </Button>
36
- </Stack>) : undefined} disabled={disabled} error={error} fields={fields} loading={loading} onChange={setValues} onSubmit={onSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
36
+ </Stack>) : undefined} disabled={disabled} error={error} fields={fields} interactionPolicy={interactionPolicy} loading={loading} onChange={setValues} onSubmit={onSubmit} submitLabel={submitLabel} testID={testID} values={values}/>);
37
37
  }
38
38
  /***
39
39
  * Sign-up form pattern with structured fields and validation.
@@ -1 +1 @@
1
- {"version":3,"file":"SignUpForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/SignUpForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAyC,MAAM,uBAAuB,CAAC;AACpF,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,MAAM,mBAAmB,GAAG;IAC1B;QACE,IAAI,EAAE,OAAO;QACb,KAAK,EAAE,OAAO;QACd,IAAI,EAAE,OAAO;QACb,cAAc,EAAE,MAAM;QACtB,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;KACjD;IACD;QACE,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,UAAU;QACjB,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;KAC/D;CAC4C,CAAC;AAEhD,SAAS,YAAY,CAAC,MAAkC;IACtD,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAyB,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE;QACzE,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC;QAC5B,OAAO,UAAU,CAAC;IACpB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,eAAe,CAAC,EACvB,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,MAAM,GAAG,mBAAmB,EAC5B,WAAW,GAAG,SAAS,EACvB,OAAO,GAAG,KAAK,EACf,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,WAAW,GAAG,SAAS,EACvB,QAAQ,EACR,QAAQ,EACR,MAAM,GACU;IAChB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAa,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnF,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CAAC,CACN,QAAQ,CAAC,CAAC,CAAC,CACT,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CACxC;YAAA,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAC9B,OAAO,CAAC,OAAO,CACf,OAAO,CAAC,CAAC,GAAG,EAAE;gBACZ,KAAK,QAAQ,EAAE,CAAC;YAClB,CAAC,CAAC,CACF,IAAI,CAAC,GAAG,CACR,KAAK,CAAC,SAAS,CAEf;cAAA,CAAC,WAAW,CACd;YAAA,EAAE,MAAM,CACV;UAAA,EAAE,KAAK,CAAC,CACT,CAAC,CAAC,CAAC,SACN,CAAC,CACD,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,MAAM,CAAC,CAAC,MAAM,CAAC,EACf,CACH,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,kBAAkB,CAAC,eAAe,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SignUpFormProps } from './types';\n\nconst defaultSignUpFields = [\n {\n name: 'email',\n label: 'Email',\n type: 'email',\n autoCapitalize: 'none',\n rules: [{ kind: 'required' }, { kind: 'email' }],\n },\n {\n name: 'password',\n label: 'Password',\n type: 'password',\n rules: [{ kind: 'required' }, { kind: 'minLength', value: 8 }],\n },\n] as const satisfies readonly FormFieldConfig[];\n\nfunction createValues(fields: readonly FormFieldConfig[]): FormValues {\n const values = fields.reduce<Record<string, string>>((nextValues, field) => {\n nextValues[field.name] = '';\n return nextValues;\n }, {});\n\n return values;\n}\n\nfunction SignUpFormInner({\n themeId: _themeId,\n mode: _mode,\n fields = defaultSignUpFields,\n signInLabel = 'Sign in',\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Sign up',\n onSubmit,\n onSignIn,\n testID,\n}: SignUpFormProps) {\n const [values, setValues] = React.useState<FormValues>(() => createValues(fields));\n\n return (\n <Form\n actions={\n onSignIn ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onSignIn();\n }}\n size=\"s\"\n color=\"neutral\"\n >\n {signInLabel}\n </Button>\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n loading={loading}\n onChange={setValues}\n onSubmit={onSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * Sign-up form pattern with structured fields and validation.\n *\n \n */\nexport const SignUpForm = withZoraThemeScope(SignUpFormInner);\n"]}
1
+ {"version":3,"file":"SignUpForm.js","sourceRoot":"","sources":["../../../src/patterns/auth/SignUpForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Form, type FormFieldConfig, type FormValues } from '../../components/form';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { SignUpFormProps } from './types';\n\nconst defaultSignUpFields = [\n {\n name: 'email',\n label: 'Email',\n type: 'email',\n autoCapitalize: 'none',\n rules: [{ kind: 'required' }, { kind: 'email' }],\n },\n {\n name: 'password',\n label: 'Password',\n type: 'password',\n rules: [{ kind: 'required' }, { kind: 'minLength', value: 8 }],\n },\n] as const satisfies readonly FormFieldConfig[];\n\nfunction createValues(fields: readonly FormFieldConfig[]): FormValues {\n const values = fields.reduce<Record<string, string>>((nextValues, field) => {\n nextValues[field.name] = '';\n return nextValues;\n }, {});\n\n return values;\n}\n\nfunction SignUpFormInner({\n themeId: _themeId,\n interactionPolicy,\n mode: _mode,\n fields = defaultSignUpFields,\n signInLabel = 'Sign in',\n loading = false,\n disabled = false,\n error,\n submitLabel = 'Sign up',\n onSubmit,\n onSignIn,\n testID,\n}: SignUpFormProps) {\n const [values, setValues] = React.useState<FormValues>(() => createValues(fields));\n\n return (\n <Form\n actions={\n onSignIn ? (\n <Stack direction=\"row\" gap=\"s\" wrap=\"wrap\">\n <Button\n disabled={disabled || loading}\n variant=\"ghost\"\n onPress={() => {\n void onSignIn();\n }}\n size=\"s\"\n color=\"neutral\"\n interactionPolicy={interactionPolicy}\n >\n {signInLabel}\n </Button>\n </Stack>\n ) : undefined\n }\n disabled={disabled}\n error={error}\n fields={fields}\n interactionPolicy={interactionPolicy}\n loading={loading}\n onChange={setValues}\n onSubmit={onSubmit}\n submitLabel={submitLabel}\n testID={testID}\n values={values}\n />\n );\n}\n\n/***\n * Sign-up form pattern with structured fields and validation.\n *\n \n */\nexport const SignUpForm = withZoraThemeScope(SignUpFormInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ChatListItem.d.ts","sourceRoot":"","sources":["../../../src/patterns/chat-list-item/ChatListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAkB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAkNjE;;;;GAIG;AACH,eAAO,MAAM,YAAY,yDAAwC,CAAC"}
1
+ {"version":3,"file":"ChatListItem.d.ts","sourceRoot":"","sources":["../../../src/patterns/chat-list-item/ChatListItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAkB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAoNjE;;;;GAIG;AACH,eAAO,MAAM,YAAY,yDAAwC,CAAC"}
@@ -38,7 +38,7 @@ function renderUnreadCount(unreadCount) {
38
38
  {unreadCount}
39
39
  </Badge>);
40
40
  }
41
- function ChatListItemInner({ themeId: _themeId, mode: _mode, testID, title, preview, meta, timestamp, avatar, leading, trailing, unread = false, unreadCount, selected = false, disabled = false, compact = false, accessibilityLabel, onPress, }) {
41
+ function ChatListItemInner({ themeId: _themeId, mode: _mode, interactionPolicy, testID, title, preview, meta, timestamp, avatar, leading, trailing, unread = false, unreadCount, selected = false, disabled = false, compact = false, accessibilityLabel, onPress, }) {
42
42
  const { theme } = useZoraTheme();
43
43
  const padding = resolvePadding(compact);
44
44
  const avatarName = resolveAvatarName({ avatar, title });
@@ -99,7 +99,7 @@ function ChatListItemInner({ themeId: _themeId, mode: _mode, testID, title, prev
99
99
  if (!isInteractive) {
100
100
  return <Box testID={testID}>{content({ pressed: false, hovered: false })}</Box>;
101
101
  }
102
- return (<ButtonBase accessibilityLabel={accessibilityLabel} accessibilityRole="button" accessibilityState={{ disabled, selected }} disabled={disabled} onPress={onPress} radius="m" testID={testID}>
102
+ return (<ButtonBase accessibilityLabel={accessibilityLabel} accessibilityRole="button" accessibilityState={{ disabled, selected }} disabled={disabled} interactionPolicy={interactionPolicy} onPress={onPress} radius="m" testID={testID}>
103
103
  {(state) => content({
104
104
  pressed: state.pressed,
105
105
  hovered: state.hovered,
@@ -1 +1 @@
1
- {"version":3,"file":"ChatListItem.js","sourceRoot":"","sources":["../../../src/patterns/chat-list-item/ChatListItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Avatar } from '../../components/avatar';\nimport { Badge } from '../../components/badge';\nimport { Text } from '../../components/text';\nimport { Box, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ChatListAvatar, ChatListItemProps } from './types';\n\nfunction resolveAvatarName({\n avatar,\n title,\n}: {\n avatar: ChatListAvatar | undefined;\n title: React.ReactNode;\n}): string | undefined {\n if (avatar?.name) {\n return avatar.name;\n }\n\n return typeof title === 'string' ? title : undefined;\n}\n\nfunction resolvePadding(compact: boolean) {\n return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveContainerStyles({\n theme,\n selected,\n pressed,\n hovered,\n disabled,\n}: {\n theme: ReturnType<typeof useZoraTheme>['theme'];\n selected: boolean;\n pressed: boolean;\n hovered: boolean;\n disabled: boolean;\n}) {\n const borderColor = selected ? theme.semantics.border.focus : 'transparent';\n\n return {\n bg: pressed\n ? theme.semantics.neutral.surfaceActive\n : hovered\n ? theme.semantics.neutral.surfaceHover\n : selected\n ? theme.semantics.neutral.surface\n : 'transparent',\n borderColor,\n borderWidth: selected ? 1 : 0,\n opacity: disabled ? 0.72 : 1,\n };\n}\n\nfunction renderUnreadCount(unreadCount: React.ReactNode) {\n if (unreadCount == null) {\n return null;\n }\n\n return (\n <Badge size=\"s\" color=\"primary\">\n {unreadCount}\n </Badge>\n );\n}\n\nfunction ChatListItemInner({\n themeId: _themeId,\n mode: _mode,\n testID,\n title,\n preview,\n meta,\n timestamp,\n avatar,\n leading,\n trailing,\n unread = false,\n unreadCount,\n selected = false,\n disabled = false,\n compact = false,\n accessibilityLabel,\n onPress,\n}: ChatListItemProps) {\n const { theme } = useZoraTheme();\n const padding = resolvePadding(compact);\n const avatarName = resolveAvatarName({ avatar, title });\n const isInteractive = Boolean(onPress);\n const hasTimestamp = timestamp != null;\n const hasPreview = preview != null;\n const hasMeta = meta != null;\n const hasTrailing = trailing != null;\n const hasUnreadCount = unreadCount != null;\n const hasSecondaryRow = hasPreview || hasMeta || hasUnreadCount || hasTrailing;\n\n const content = ({ pressed, hovered }: { pressed: boolean; hovered: boolean }) => {\n const styles = resolveContainerStyles({\n theme,\n selected,\n pressed,\n hovered,\n disabled,\n });\n\n return (\n <Box\n bg={styles.bg}\n borderColor={styles.borderColor}\n borderWidth={styles.borderWidth}\n px={padding.px}\n py={padding.py}\n radius=\"m\"\n style={{ opacity: styles.opacity }}\n >\n <Inline align=\"center\" gap=\"m\" wrap=\"nowrap\">\n {leading ?? (\n <Avatar\n initials={avatar?.initials}\n label={avatar?.label ?? avatarName}\n name={avatarName}\n shape={avatar?.shape}\n size={avatar?.size ?? (compact ? 's' : 'm')}\n source={avatar?.source}\n color={avatar?.color}\n />\n )}\n\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Inline align=\"center\" gap=\"s\" justify=\"space-between\" wrap=\"nowrap\">\n <Box flex={1}>\n <Text\n numberOfLines={1}\n emphasis={disabled ? 'muted' : 'default'}\n variant=\"bodySmall\"\n weight={unread || selected ? 'semiBold' : 'medium'}\n >\n {title}\n </Text>\n </Box>\n {hasTimestamp ? (\n <Text\n numberOfLines={1}\n color={unread ? 'primary' : undefined}\n emphasis={unread ? 'default' : 'subtle'}\n variant=\"caption\"\n weight={unread ? 'semiBold' : 'regular'}\n >\n {timestamp}\n </Text>\n ) : null}\n </Inline>\n\n {hasSecondaryRow ? (\n <Inline align=\"center\" gap=\"s\" justify=\"space-between\" wrap=\"nowrap\">\n <Box flex={1}>\n <Stack gap=\"xxs\">\n {hasPreview ? (\n <Text\n numberOfLines={1}\n emphasis={unread ? 'default' : 'muted'}\n variant=\"bodySmall\"\n weight={unread ? 'medium' : 'regular'}\n >\n {preview}\n </Text>\n ) : null}\n {hasMeta ? (\n <Text numberOfLines={1} emphasis=\"subtle\" variant=\"caption\">\n {meta}\n </Text>\n ) : null}\n </Stack>\n </Box>\n\n {hasUnreadCount || hasTrailing ? (\n <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n {renderUnreadCount(unreadCount)}\n {trailing}\n </Inline>\n ) : null}\n </Inline>\n ) : null}\n </Stack>\n </Box>\n </Inline>\n </Box>\n );\n };\n\n if (!isInteractive) {\n return <Box testID={testID}>{content({ pressed: false, hovered: false })}</Box>;\n }\n\n return (\n <ButtonBase\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"button\"\n accessibilityState={{ disabled, selected }}\n disabled={disabled}\n onPress={onPress}\n radius=\"m\"\n testID={testID}\n >\n {(state) =>\n content({\n pressed: state.pressed,\n hovered: state.hovered,\n })\n }\n </ButtonBase>\n );\n}\n\n/***\n * Chat-style list row with avatar, title, preview text, and unread indicators.\n *\n \n */\nexport const ChatListItem = withZoraThemeScope(ChatListItemInner);\n"]}
1
+ {"version":3,"file":"ChatListItem.js","sourceRoot":"","sources":["../../../src/patterns/chat-list-item/ChatListItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ButtonBase } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Avatar } from '../../components/avatar';\nimport { Badge } from '../../components/badge';\nimport { Text } from '../../components/text';\nimport { Box, Inline, Stack } from '../../foundation';\nimport { useZoraTheme } from '../../theme/useZoraTheme';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ChatListAvatar, ChatListItemProps } from './types';\n\nfunction resolveAvatarName({\n avatar,\n title,\n}: {\n avatar: ChatListAvatar | undefined;\n title: React.ReactNode;\n}): string | undefined {\n if (avatar?.name) {\n return avatar.name;\n }\n\n return typeof title === 'string' ? title : undefined;\n}\n\nfunction resolvePadding(compact: boolean) {\n return compact ? { px: 'm' as const, py: 's' as const } : { px: 'm' as const, py: 'm' as const };\n}\n\nfunction resolveContainerStyles({\n theme,\n selected,\n pressed,\n hovered,\n disabled,\n}: {\n theme: ReturnType<typeof useZoraTheme>['theme'];\n selected: boolean;\n pressed: boolean;\n hovered: boolean;\n disabled: boolean;\n}) {\n const borderColor = selected ? theme.semantics.border.focus : 'transparent';\n\n return {\n bg: pressed\n ? theme.semantics.neutral.surfaceActive\n : hovered\n ? theme.semantics.neutral.surfaceHover\n : selected\n ? theme.semantics.neutral.surface\n : 'transparent',\n borderColor,\n borderWidth: selected ? 1 : 0,\n opacity: disabled ? 0.72 : 1,\n };\n}\n\nfunction renderUnreadCount(unreadCount: React.ReactNode) {\n if (unreadCount == null) {\n return null;\n }\n\n return (\n <Badge size=\"s\" color=\"primary\">\n {unreadCount}\n </Badge>\n );\n}\n\nfunction ChatListItemInner({\n themeId: _themeId,\n mode: _mode,\n interactionPolicy,\n testID,\n title,\n preview,\n meta,\n timestamp,\n avatar,\n leading,\n trailing,\n unread = false,\n unreadCount,\n selected = false,\n disabled = false,\n compact = false,\n accessibilityLabel,\n onPress,\n}: ChatListItemProps) {\n const { theme } = useZoraTheme();\n const padding = resolvePadding(compact);\n const avatarName = resolveAvatarName({ avatar, title });\n const isInteractive = Boolean(onPress);\n const hasTimestamp = timestamp != null;\n const hasPreview = preview != null;\n const hasMeta = meta != null;\n const hasTrailing = trailing != null;\n const hasUnreadCount = unreadCount != null;\n const hasSecondaryRow = hasPreview || hasMeta || hasUnreadCount || hasTrailing;\n\n const content = ({ pressed, hovered }: { pressed: boolean; hovered: boolean }) => {\n const styles = resolveContainerStyles({\n theme,\n selected,\n pressed,\n hovered,\n disabled,\n });\n\n return (\n <Box\n bg={styles.bg}\n borderColor={styles.borderColor}\n borderWidth={styles.borderWidth}\n px={padding.px}\n py={padding.py}\n radius=\"m\"\n style={{ opacity: styles.opacity }}\n >\n <Inline align=\"center\" gap=\"m\" wrap=\"nowrap\">\n {leading ?? (\n <Avatar\n initials={avatar?.initials}\n label={avatar?.label ?? avatarName}\n name={avatarName}\n shape={avatar?.shape}\n size={avatar?.size ?? (compact ? 's' : 'm')}\n source={avatar?.source}\n color={avatar?.color}\n />\n )}\n\n <Box flex={1}>\n <Stack gap=\"xxs\">\n <Inline align=\"center\" gap=\"s\" justify=\"space-between\" wrap=\"nowrap\">\n <Box flex={1}>\n <Text\n numberOfLines={1}\n emphasis={disabled ? 'muted' : 'default'}\n variant=\"bodySmall\"\n weight={unread || selected ? 'semiBold' : 'medium'}\n >\n {title}\n </Text>\n </Box>\n {hasTimestamp ? (\n <Text\n numberOfLines={1}\n color={unread ? 'primary' : undefined}\n emphasis={unread ? 'default' : 'subtle'}\n variant=\"caption\"\n weight={unread ? 'semiBold' : 'regular'}\n >\n {timestamp}\n </Text>\n ) : null}\n </Inline>\n\n {hasSecondaryRow ? (\n <Inline align=\"center\" gap=\"s\" justify=\"space-between\" wrap=\"nowrap\">\n <Box flex={1}>\n <Stack gap=\"xxs\">\n {hasPreview ? (\n <Text\n numberOfLines={1}\n emphasis={unread ? 'default' : 'muted'}\n variant=\"bodySmall\"\n weight={unread ? 'medium' : 'regular'}\n >\n {preview}\n </Text>\n ) : null}\n {hasMeta ? (\n <Text numberOfLines={1} emphasis=\"subtle\" variant=\"caption\">\n {meta}\n </Text>\n ) : null}\n </Stack>\n </Box>\n\n {hasUnreadCount || hasTrailing ? (\n <Inline align=\"center\" gap=\"s\" wrap=\"nowrap\">\n {renderUnreadCount(unreadCount)}\n {trailing}\n </Inline>\n ) : null}\n </Inline>\n ) : null}\n </Stack>\n </Box>\n </Inline>\n </Box>\n );\n };\n\n if (!isInteractive) {\n return <Box testID={testID}>{content({ pressed: false, hovered: false })}</Box>;\n }\n\n return (\n <ButtonBase\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"button\"\n accessibilityState={{ disabled, selected }}\n disabled={disabled}\n interactionPolicy={interactionPolicy}\n onPress={onPress}\n radius=\"m\"\n testID={testID}\n >\n {(state) =>\n content({\n pressed: state.pressed,\n hovered: state.hovered,\n })\n }\n </ButtonBase>\n );\n}\n\n/***\n * Chat-style list row with avatar, title, preview text, and unread indicators.\n *\n \n */\nexport const ChatListItem = withZoraThemeScope(ChatListItemInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"CollectionEditor.d.ts","sourceRoot":"","sources":["../../../src/patterns/collection-editor/CollectionEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAiGrD;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GApGE,KAAK,mEAoGqC,CAAC"}
1
+ {"version":3,"file":"CollectionEditor.d.ts","sourceRoot":"","sources":["../../../src/patterns/collection-editor/CollectionEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AA4GrD;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GA/GE,KAAK,mEA+GqC,CAAC"}
@@ -5,9 +5,9 @@ import { Text } from '../../components/text';
5
5
  import { Box, Stack } from '../../foundation';
6
6
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
7
7
  import { Panel } from '../panel';
8
- function CollectionEditorInner({ themeId: _themeId, mode: _mode, title, description, items, renderItem, onAdd, onRemove, onMove, addLabel = 'Add Item', emptyLabel = 'No items yet.', disabled, testID, }) {
8
+ function CollectionEditorInner({ themeId: _themeId, mode: _mode, title, description, items, renderItem, onAdd, onRemove, onMove, addLabel = 'Add Item', emptyLabel = 'No items yet.', disabled, testID, interactionPolicy, }) {
9
9
  const isEmpty = items.length === 0;
10
- return (<Panel compact description={description} testID={testID} title={title} actions={onAdd ? (<Button variant="soft" size="s" disabled={disabled} onPress={onAdd}>
10
+ return (<Panel compact description={description} interactionPolicy={interactionPolicy} testID={testID} title={title} actions={onAdd ? (<Button variant="soft" size="s" disabled={disabled} interactionPolicy={interactionPolicy} onPress={onAdd}>
11
11
  {addLabel}
12
12
  </Button>) : null}>
13
13
  <Stack gap="s">
@@ -30,10 +30,10 @@ function CollectionEditorInner({ themeId: _themeId, mode: _mode, title, descript
30
30
  </Box>
31
31
  <Stack direction="row" gap="xs">
32
32
  {onMove ? (<>
33
- <IconButton icon={{ name: 'arrow-up-outline' }} label="Move Up" disabled={disabled ?? index === 0} onPress={() => onMove(index, index - 1)} size="s" variant="ghost"/>
34
- <IconButton icon={{ name: 'arrow-down-outline' }} label="Move Down" disabled={disabled ?? index === items.length - 1} onPress={() => onMove(index, index + 1)} size="s" variant="ghost"/>
33
+ <IconButton icon={{ name: 'arrow-up-outline' }} label="Move Up" disabled={disabled ?? index === 0} interactionPolicy={interactionPolicy} onPress={() => onMove(index, index - 1)} size="s" variant="ghost"/>
34
+ <IconButton icon={{ name: 'arrow-down-outline' }} label="Move Down" disabled={disabled ?? index === items.length - 1} interactionPolicy={interactionPolicy} onPress={() => onMove(index, index + 1)} size="s" variant="ghost"/>
35
35
  </>) : null}
36
- {onRemove ? (<IconButton icon={{ name: 'trash-outline' }} label="Remove" color="danger" disabled={disabled} onPress={() => onRemove(index)} size="s" variant="ghost"/>) : null}
36
+ {onRemove ? (<IconButton icon={{ name: 'trash-outline' }} label="Remove" color="danger" disabled={disabled} interactionPolicy={interactionPolicy} onPress={() => onRemove(index)} size="s" variant="ghost"/>) : null}
37
37
  </Stack>
38
38
  </Stack>
39
39
  </Box>)))}
@@ -1 +1 @@
1
- {"version":3,"file":"CollectionEditor.js","sourceRoot":"","sources":["../../../src/patterns/collection-editor/CollectionEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { IconButton } from '../../components/icon-button';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Panel } from '../panel';\nimport type { CollectionEditorProps } from './types';\n\nfunction CollectionEditorInner<TItem>({\n themeId: _themeId,\n mode: _mode,\n title,\n description,\n items,\n renderItem,\n onAdd,\n onRemove,\n onMove,\n addLabel = 'Add Item',\n emptyLabel = 'No items yet.',\n disabled,\n testID,\n}: CollectionEditorProps<TItem>) {\n const isEmpty = items.length === 0;\n\n return (\n <Panel\n compact\n description={description}\n testID={testID}\n title={title}\n actions={\n onAdd ? (\n <Button variant=\"soft\" size=\"s\" disabled={disabled} onPress={onAdd}>\n {addLabel}\n </Button>\n ) : null\n }\n >\n <Stack gap=\"s\">\n {isEmpty ? (\n <Box py=\"m\">\n <Text align=\"center\" emphasis=\"muted\">\n {emptyLabel}\n </Text>\n </Box>\n ) : (\n items.map((item, index) => (\n <Box key={index} bg=\"subtle\" p=\"s\" radius=\"m\" borderColor=\"border\" borderWidth={1}>\n <Stack direction=\"row\" gap=\"m\" align=\"center\">\n <Box flex={1}>\n {renderItem({\n item,\n index,\n remove: () => onRemove?.(index),\n moveUp: () => onMove?.(index, index - 1),\n moveDown: () => onMove?.(index, index + 1),\n canMoveUp: index > 0,\n canMoveDown: index < items.length - 1,\n })}\n </Box>\n <Stack direction=\"row\" gap=\"xs\">\n {onMove ? (\n <>\n <IconButton\n icon={{ name: 'arrow-up-outline' }}\n label=\"Move Up\"\n disabled={disabled ?? index === 0}\n onPress={() => onMove(index, index - 1)}\n size=\"s\"\n variant=\"ghost\"\n />\n <IconButton\n icon={{ name: 'arrow-down-outline' }}\n label=\"Move Down\"\n disabled={disabled ?? index === items.length - 1}\n onPress={() => onMove(index, index + 1)}\n size=\"s\"\n variant=\"ghost\"\n />\n </>\n ) : null}\n {onRemove ? (\n <IconButton\n icon={{ name: 'trash-outline' }}\n label=\"Remove\"\n color=\"danger\"\n disabled={disabled}\n onPress={() => onRemove(index)}\n size=\"s\"\n variant=\"ghost\"\n />\n ) : null}\n </Stack>\n </Stack>\n </Box>\n ))\n )}\n </Stack>\n </Panel>\n );\n}\n\n/***\n * Editor pattern for adding, removing, and reordering a collection of items.\n *\n \n */\nexport const CollectionEditor = withZoraThemeScope(CollectionEditorInner);\n"]}
1
+ {"version":3,"file":"CollectionEditor.js","sourceRoot":"","sources":["../../../src/patterns/collection-editor/CollectionEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { IconButton } from '../../components/icon-button';\nimport { Text } from '../../components/text';\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { Panel } from '../panel';\nimport type { CollectionEditorProps } from './types';\n\nfunction CollectionEditorInner<TItem>({\n themeId: _themeId,\n mode: _mode,\n title,\n description,\n items,\n renderItem,\n onAdd,\n onRemove,\n onMove,\n addLabel = 'Add Item',\n emptyLabel = 'No items yet.',\n disabled,\n testID,\n interactionPolicy,\n}: CollectionEditorProps<TItem>) {\n const isEmpty = items.length === 0;\n\n return (\n <Panel\n compact\n description={description}\n interactionPolicy={interactionPolicy}\n testID={testID}\n title={title}\n actions={\n onAdd ? (\n <Button\n variant=\"soft\"\n size=\"s\"\n disabled={disabled}\n interactionPolicy={interactionPolicy}\n onPress={onAdd}\n >\n {addLabel}\n </Button>\n ) : null\n }\n >\n <Stack gap=\"s\">\n {isEmpty ? (\n <Box py=\"m\">\n <Text align=\"center\" emphasis=\"muted\">\n {emptyLabel}\n </Text>\n </Box>\n ) : (\n items.map((item, index) => (\n <Box key={index} bg=\"subtle\" p=\"s\" radius=\"m\" borderColor=\"border\" borderWidth={1}>\n <Stack direction=\"row\" gap=\"m\" align=\"center\">\n <Box flex={1}>\n {renderItem({\n item,\n index,\n remove: () => onRemove?.(index),\n moveUp: () => onMove?.(index, index - 1),\n moveDown: () => onMove?.(index, index + 1),\n canMoveUp: index > 0,\n canMoveDown: index < items.length - 1,\n })}\n </Box>\n <Stack direction=\"row\" gap=\"xs\">\n {onMove ? (\n <>\n <IconButton\n icon={{ name: 'arrow-up-outline' }}\n label=\"Move Up\"\n disabled={disabled ?? index === 0}\n interactionPolicy={interactionPolicy}\n onPress={() => onMove(index, index - 1)}\n size=\"s\"\n variant=\"ghost\"\n />\n <IconButton\n icon={{ name: 'arrow-down-outline' }}\n label=\"Move Down\"\n disabled={disabled ?? index === items.length - 1}\n interactionPolicy={interactionPolicy}\n onPress={() => onMove(index, index + 1)}\n size=\"s\"\n variant=\"ghost\"\n />\n </>\n ) : null}\n {onRemove ? (\n <IconButton\n icon={{ name: 'trash-outline' }}\n label=\"Remove\"\n color=\"danger\"\n disabled={disabled}\n interactionPolicy={interactionPolicy}\n onPress={() => onRemove(index)}\n size=\"s\"\n variant=\"ghost\"\n />\n ) : null}\n </Stack>\n </Stack>\n </Box>\n ))\n )}\n </Stack>\n </Panel>\n );\n}\n\n/***\n * Editor pattern for adding, removing, and reordering a collection of items.\n *\n \n */\nexport const CollectionEditor = withZoraThemeScope(CollectionEditorInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../../src/patterns/confirm-dialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AA4ClD;;;;GAIG;AACH,eAAO,MAAM,aAAa,0DAAyC,CAAC"}
1
+ {"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../../src/patterns/confirm-dialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAyDlD;;;;GAIG;AACH,eAAO,MAAM,aAAa,0DAAyC,CAAC"}
@@ -3,12 +3,12 @@ import { Button } from '../../components/button';
3
3
  import { Modal } from '../../components/modal';
4
4
  import { Stack } from '../../foundation';
5
5
  import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
6
- function ConfirmDialogInner({ themeId: _themeId, mode: _mode, visible, title, description, children, confirmLabel = 'Confirm', cancelLabel = 'Cancel', confirmColor = 'danger', confirmVariant = 'solid', busy = false, closeOnBackdrop = true, onConfirm, onCancel, testID, }) {
7
- return (<Modal closeOnBackdrop={closeOnBackdrop} description={description} footer={<Stack direction={{ base: 'column', md: 'row' }} gap="s" justify="flex-end">
8
- <Button variant="soft" onPress={onCancel} color="neutral">
6
+ function ConfirmDialogInner({ themeId: _themeId, mode: _mode, visible, title, description, children, confirmLabel = 'Confirm', cancelLabel = 'Cancel', confirmColor = 'danger', confirmVariant = 'solid', busy = false, closeOnBackdrop = true, onConfirm, onCancel, testID, interactionPolicy, }) {
7
+ return (<Modal closeOnBackdrop={closeOnBackdrop} description={description} interactionPolicy={interactionPolicy} footer={<Stack direction={{ base: 'column', md: 'row' }} gap="s" justify="flex-end">
8
+ <Button variant="soft" interactionPolicy={interactionPolicy} onPress={onCancel} color="neutral">
9
9
  {cancelLabel}
10
10
  </Button>
11
- <Button variant={confirmVariant} loading={busy} onPress={onConfirm} color={confirmColor}>
11
+ <Button variant={confirmVariant} loading={busy} interactionPolicy={interactionPolicy} onPress={onConfirm} color={confirmColor}>
12
12
  {confirmLabel}
13
13
  </Button>
14
14
  </Stack>} onDismiss={onCancel} testID={testID} title={title} visible={visible} width="narrow">
@@ -1 +1 @@
1
- {"version":3,"file":"ConfirmDialog.js","sourceRoot":"","sources":["../../../src/patterns/confirm-dialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,kBAAkB,CAAC,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,OAAO,EACP,KAAK,EACL,WAAW,EACX,QAAQ,EACR,YAAY,GAAG,SAAS,EACxB,WAAW,GAAG,QAAQ,EACtB,YAAY,GAAG,QAAQ,EACvB,cAAc,GAAG,OAAO,EACxB,IAAI,GAAG,KAAK,EACZ,eAAe,GAAG,IAAI,EACtB,SAAS,EACT,QAAQ,EACR,MAAM,GACa;IACnB,OAAO,CACL,CAAC,KAAK,CACJ,eAAe,CAAC,CAAC,eAAe,CAAC,CACjC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,MAAM,CAAC,CACL,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,UAAU,CACzE;UAAA,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC,KAAK,CAAC,SAAS,CACvD;YAAA,CAAC,WAAW,CACd;UAAA,EAAE,MAAM,CACR;UAAA,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CACtF;YAAA,CAAC,YAAY,CACf;UAAA,EAAE,MAAM,CACV;QAAA,EAAE,KAAK,CACT,CAAC,CACD,SAAS,CAAC,CAAC,QAAQ,CAAC,CACpB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,KAAK,CAAC,QAAQ,CAEd;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Modal } from '../../components/modal';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ConfirmDialogProps } from './types';\n\nfunction ConfirmDialogInner({\n themeId: _themeId,\n mode: _mode,\n visible,\n title,\n description,\n children,\n confirmLabel = 'Confirm',\n cancelLabel = 'Cancel',\n confirmColor = 'danger',\n confirmVariant = 'solid',\n busy = false,\n closeOnBackdrop = true,\n onConfirm,\n onCancel,\n testID,\n}: ConfirmDialogProps) {\n return (\n <Modal\n closeOnBackdrop={closeOnBackdrop}\n description={description}\n footer={\n <Stack direction={{ base: 'column', md: 'row' }} gap=\"s\" justify=\"flex-end\">\n <Button variant=\"soft\" onPress={onCancel} color=\"neutral\">\n {cancelLabel}\n </Button>\n <Button variant={confirmVariant} loading={busy} onPress={onConfirm} color={confirmColor}>\n {confirmLabel}\n </Button>\n </Stack>\n }\n onDismiss={onCancel}\n testID={testID}\n title={title}\n visible={visible}\n width=\"narrow\"\n >\n {children}\n </Modal>\n );\n}\n\n/***\n * Confirmation dialog pattern with cancel/confirm actions.\n *\n \n */\nexport const ConfirmDialog = withZoraThemeScope(ConfirmDialogInner);\n"]}
1
+ {"version":3,"file":"ConfirmDialog.js","sourceRoot":"","sources":["../../../src/patterns/confirm-dialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,SAAS,kBAAkB,CAAC,EAC1B,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAE,KAAK,EACX,OAAO,EACP,KAAK,EACL,WAAW,EACX,QAAQ,EACR,YAAY,GAAG,SAAS,EACxB,WAAW,GAAG,QAAQ,EACtB,YAAY,GAAG,QAAQ,EACvB,cAAc,GAAG,OAAO,EACxB,IAAI,GAAG,KAAK,EACZ,eAAe,GAAG,IAAI,EACtB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,iBAAiB,GACE;IACnB,OAAO,CACL,CAAC,KAAK,CACJ,eAAe,CAAC,CAAC,eAAe,CAAC,CACjC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,MAAM,CAAC,CACL,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,UAAU,CACzE;UAAA,CAAC,MAAM,CACL,OAAO,CAAC,MAAM,CACd,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAClB,KAAK,CAAC,SAAS,CAEf;YAAA,CAAC,WAAW,CACd;UAAA,EAAE,MAAM,CACR;UAAA,CAAC,MAAM,CACL,OAAO,CAAC,CAAC,cAAc,CAAC,CACxB,OAAO,CAAC,CAAC,IAAI,CAAC,CACd,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,OAAO,CAAC,CAAC,SAAS,CAAC,CACnB,KAAK,CAAC,CAAC,YAAY,CAAC,CAEpB;YAAA,CAAC,YAAY,CACf;UAAA,EAAE,MAAM,CACV;QAAA,EAAE,KAAK,CACT,CAAC,CACD,SAAS,CAAC,CAAC,QAAQ,CAAC,CACpB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,KAAK,CAAC,QAAQ,CAEd;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,KAAK,CAAC,CACT,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { Button } from '../../components/button';\nimport { Modal } from '../../components/modal';\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport type { ConfirmDialogProps } from './types';\n\nfunction ConfirmDialogInner({\n themeId: _themeId,\n mode: _mode,\n visible,\n title,\n description,\n children,\n confirmLabel = 'Confirm',\n cancelLabel = 'Cancel',\n confirmColor = 'danger',\n confirmVariant = 'solid',\n busy = false,\n closeOnBackdrop = true,\n onConfirm,\n onCancel,\n testID,\n interactionPolicy,\n}: ConfirmDialogProps) {\n return (\n <Modal\n closeOnBackdrop={closeOnBackdrop}\n description={description}\n interactionPolicy={interactionPolicy}\n footer={\n <Stack direction={{ base: 'column', md: 'row' }} gap=\"s\" justify=\"flex-end\">\n <Button\n variant=\"soft\"\n interactionPolicy={interactionPolicy}\n onPress={onCancel}\n color=\"neutral\"\n >\n {cancelLabel}\n </Button>\n <Button\n variant={confirmVariant}\n loading={busy}\n interactionPolicy={interactionPolicy}\n onPress={onConfirm}\n color={confirmColor}\n >\n {confirmLabel}\n </Button>\n </Stack>\n }\n onDismiss={onCancel}\n testID={testID}\n title={title}\n visible={visible}\n width=\"narrow\"\n >\n {children}\n </Modal>\n );\n}\n\n/***\n * Confirmation dialog pattern with cancel/confirm actions.\n *\n \n */\nexport const ConfirmDialog = withZoraThemeScope(ConfirmDialogInner);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"DisclosureSection.d.ts","sourceRoot":"","sources":["../../../src/patterns/disclosure-section/DisclosureSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAgHtD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,8DAA6C,CAAC"}
1
+ {"version":3,"file":"DisclosureSection.d.ts","sourceRoot":"","sources":["../../../src/patterns/disclosure-section/DisclosureSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAmHtD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,8DAA6C,CAAC"}
@@ -31,14 +31,15 @@ const getTriggerStyle = (disabled) => ({
31
31
  }
32
32
  : null),
33
33
  });
34
- function DisclosureSectionInner({ themeId: _themeId, mode: _mode, title, description, icon, defaultOpen = true, open: controlledOpen, onOpenChange, actions, children, disabled, testID, }) {
34
+ function DisclosureSectionInner({ themeId: _themeId, mode: _mode, title, description, icon, defaultOpen = true, open: controlledOpen, onOpenChange, actions, children, disabled, testID, interactionPolicy, }) {
35
35
  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);
36
36
  const isControlled = controlledOpen !== undefined;
37
37
  const isOpen = isControlled ? controlledOpen : internalOpen;
38
+ const passive = interactionPolicy === 'passive';
38
39
  const titleLabel = typeof title === 'string' || typeof title === 'number' ? `: ${title}` : '';
39
40
  const toggleLabel = `${isOpen ? 'Collapse' : 'Expand'} section${titleLabel}`;
40
41
  const toggleOpen = () => {
41
- if (disabled)
42
+ if (disabled || passive)
42
43
  return;
43
44
  if (isControlled) {
44
45
  onOpenChange?.(!controlledOpen);
@@ -68,7 +69,7 @@ function DisclosureSectionInner({ themeId: _themeId, mode: _mode, title, descrip
68
69
  {actions ? <Box style={trailingStyle}>{actions}</Box> : null}
69
70
 
70
71
  <Box style={trailingStyle}>
71
- <IconButton icon={{ name: isOpen ? 'chevron-up-outline' : 'chevron-down-outline' }} label={isOpen ? 'Collapse' : 'Expand'} variant="ghost" color="neutral" size="s" disabled={disabled} onPress={toggleOpen}/>
72
+ <IconButton icon={{ name: isOpen ? 'chevron-up-outline' : 'chevron-down-outline' }} label={isOpen ? 'Collapse' : 'Expand'} variant="ghost" color="neutral" size="s" disabled={disabled} interactionPolicy={interactionPolicy} onPress={toggleOpen}/>
72
73
  </Box>
73
74
  </Stack>
74
75