reshaped 3.9.0-canary.0 → 3.9.0-canary.2

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 (318) hide show
  1. package/dist/bundle.css +1 -1
  2. package/dist/bundle.js +10 -10
  3. package/dist/cli/theming/index.js +4 -4
  4. package/dist/cli/theming/reshaped.config.js +1 -1
  5. package/dist/components/Accordion/Accordion.types.d.ts +1 -1
  6. package/dist/components/Accordion/AccordionControlled.js +2 -2
  7. package/dist/components/Accordion/AccordionTrigger.js +2 -2
  8. package/dist/components/Accordion/index.d.ts +1 -1
  9. package/dist/components/Accordion/index.js +1 -1
  10. package/dist/components/ActionBar/ActionBar.js +1 -1
  11. package/dist/components/ActionBar/ActionBar.types.d.ts +1 -1
  12. package/dist/components/Actionable/Actionable.js +1 -1
  13. package/dist/components/Alert/Alert.js +1 -1
  14. package/dist/components/Alert/Alert.types.d.ts +1 -1
  15. package/dist/components/Autocomplete/Autocomplete.js +4 -4
  16. package/dist/components/Autocomplete/Autocomplete.types.d.ts +2 -2
  17. package/dist/components/Avatar/Avatar.js +2 -2
  18. package/dist/components/Badge/Badge.js +4 -4
  19. package/dist/components/Badge/Badge.types.d.ts +1 -1
  20. package/dist/components/Breadcrumbs/Breadcrumbs.js +3 -3
  21. package/dist/components/Breadcrumbs/Breadcrumbs.types.d.ts +1 -1
  22. package/dist/components/Breadcrumbs/BreadcrumbsItem.js +1 -1
  23. package/dist/components/Button/Button.js +2 -2
  24. package/dist/components/Button/Button.module.css +1 -1
  25. package/dist/components/Button/Button.types.d.ts +3 -3
  26. package/dist/components/Calendar/Calendar.types.d.ts +7 -1
  27. package/dist/components/Calendar/CalendarControlled.js +4 -4
  28. package/dist/components/Calendar/CalendarControls.js +2 -2
  29. package/dist/components/Calendar/CalendarDate.js +5 -5
  30. package/dist/components/Calendar/CalendarMonth.js +3 -3
  31. package/dist/components/Calendar/CalendarYear.js +1 -1
  32. package/dist/components/Calendar/useCalendarKeyboardNavigation.js +1 -1
  33. package/dist/components/Card/Card.js +2 -2
  34. package/dist/components/Card/Card.module.css +1 -1
  35. package/dist/components/Card/Card.types.d.ts +1 -1
  36. package/dist/components/Carousel/Carousel.js +4 -4
  37. package/dist/components/Carousel/Carousel.types.d.ts +1 -1
  38. package/dist/components/Carousel/CarouselControl.d.ts +1 -1
  39. package/dist/components/Carousel/CarouselControl.js +3 -3
  40. package/dist/components/Checkbox/Checkbox.js +3 -3
  41. package/dist/components/CheckboxGroup/CheckboxGroup.types.d.ts +1 -1
  42. package/dist/components/Container/Container.js +1 -1
  43. package/dist/components/Container/Container.types.d.ts +1 -1
  44. package/dist/components/ContextMenu/ContextMenu.js +1 -1
  45. package/dist/components/Dismissible/Dismissible.js +1 -1
  46. package/dist/components/Divider/Divider.d.ts +1 -1
  47. package/dist/components/Divider/Divider.js +1 -1
  48. package/dist/components/DropdownMenu/DropdownMenu.js +6 -6
  49. package/dist/components/DropdownMenu/DropdownMenu.types.d.ts +3 -3
  50. package/dist/components/FileUpload/FileUpload.js +2 -2
  51. package/dist/components/FileUpload/FileUpload.types.d.ts +1 -1
  52. package/dist/components/Flyout/Flyout.constants.d.ts +1 -3
  53. package/dist/components/Flyout/Flyout.constants.js +1 -3
  54. package/dist/components/Flyout/Flyout.js +1 -1
  55. package/dist/components/Flyout/FlyoutContent.js +4 -4
  56. package/dist/components/Flyout/FlyoutControlled.js +11 -13
  57. package/dist/components/Flyout/index.d.ts +1 -1
  58. package/dist/components/Flyout/index.js +1 -1
  59. package/dist/components/Flyout/useFlyout.d.ts +1 -1
  60. package/dist/components/Flyout/useFlyout.js +1 -1
  61. package/dist/components/Flyout/utilities/cooldown.js +1 -2
  62. package/dist/components/Flyout/utilities/flyout.d.ts +1 -1
  63. package/dist/components/Flyout/utilities/flyout.js +1 -1
  64. package/dist/components/FormControl/FormControlCaption.js +1 -1
  65. package/dist/components/FormControl/FormControlLabel.js +1 -1
  66. package/dist/components/FormControl/index.d.ts +2 -2
  67. package/dist/components/FormControl/index.js +2 -2
  68. package/dist/components/Grid/Grid.js +1 -1
  69. package/dist/components/Grid/Grid.types.d.ts +2 -2
  70. package/dist/components/Icon/Icon.js +1 -1
  71. package/dist/components/Icon/Icon.module.css +1 -1
  72. package/dist/components/Image/Image.js +1 -1
  73. package/dist/components/Image/Image.types.d.ts +1 -1
  74. package/dist/components/Link/Link.js +1 -1
  75. package/dist/components/MenuItem/MenuItem.js +1 -1
  76. package/dist/components/MenuItem/MenuItem.types.d.ts +2 -2
  77. package/dist/components/Modal/Modal.js +7 -7
  78. package/dist/components/Modal/Modal.types.d.ts +1 -1
  79. package/dist/components/NumberField/NumberFieldControlled.js +7 -7
  80. package/dist/components/Overlay/Overlay.js +8 -8
  81. package/dist/components/PinField/PinFieldControlled.js +4 -4
  82. package/dist/components/Popover/Popover.js +3 -3
  83. package/dist/components/Popover/Popover.types.d.ts +1 -1
  84. package/dist/components/Progress/Progress.module.css +1 -1
  85. package/dist/components/Radio/Radio.js +3 -3
  86. package/dist/components/RadioGroup/RadioGroup.types.d.ts +1 -1
  87. package/dist/components/Reshaped/Reshaped.css +1 -1
  88. package/dist/components/Reshaped/Reshaped.js +4 -4
  89. package/dist/components/Reshaped/Reshaped.types.d.ts +1 -1
  90. package/dist/components/Resizable/Resizable.js +2 -2
  91. package/dist/components/Resizable/Resizable.types.d.ts +1 -1
  92. package/dist/components/Resizable/ResizableHandle.js +1 -1
  93. package/dist/components/ScrollArea/ScrollArea.js +4 -4
  94. package/dist/components/Select/Select.types.d.ts +3 -3
  95. package/dist/components/Select/SelectCustomControlled.js +6 -3
  96. package/dist/components/Select/SelectEndContent.js +1 -1
  97. package/dist/components/Select/SelectGroup.js +1 -1
  98. package/dist/components/Select/SelectNative.js +2 -2
  99. package/dist/components/Select/SelectRoot.js +1 -1
  100. package/dist/components/Select/SelectTrigger.js +1 -1
  101. package/dist/components/Select/index.d.ts +1 -1
  102. package/dist/components/Select/index.js +1 -1
  103. package/dist/components/Skeleton/Skeleton.js +1 -1
  104. package/dist/components/Slider/SliderControlled.js +7 -7
  105. package/dist/components/Slider/SliderThumb.js +3 -3
  106. package/dist/components/Stepper/Stepper.js +4 -4
  107. package/dist/components/Switch/Switch.js +1 -1
  108. package/dist/components/Table/Table.js +2 -2
  109. package/dist/components/Tabs/Tabs.types.d.ts +1 -1
  110. package/dist/components/Tabs/TabsItem.js +2 -2
  111. package/dist/components/Tabs/TabsList.js +8 -8
  112. package/dist/components/Tabs/TabsPanel.js +2 -2
  113. package/dist/components/Text/Text.js +1 -1
  114. package/dist/components/Text/Text.module.css +1 -1
  115. package/dist/components/TextArea/TextArea.js +1 -1
  116. package/dist/components/TextArea/TextArea.types.d.ts +1 -1
  117. package/dist/components/TextField/TextField.js +2 -2
  118. package/dist/components/TextField/TextField.types.d.ts +2 -2
  119. package/dist/components/Theme/GlobalColorMode.js +1 -1
  120. package/dist/components/Theme/Theme.js +2 -2
  121. package/dist/components/Theme/Theme.module.css +1 -1
  122. package/dist/components/Timeline/Timeline.js +1 -1
  123. package/dist/components/Toast/Toast.js +2 -2
  124. package/dist/components/Toast/Toast.types.d.ts +1 -1
  125. package/dist/components/Toast/ToastContainer.js +3 -3
  126. package/dist/components/Toast/ToastProvider.js +1 -1
  127. package/dist/components/Toast/ToastRegion.js +2 -2
  128. package/dist/components/ToggleButtonGroup/ToggleButtonGroup.types.d.ts +1 -1
  129. package/dist/components/ToggleButtonGroup/ToggleButtonGroupControlled.js +1 -1
  130. package/dist/components/Tooltip/Tooltip.js +5 -3
  131. package/dist/components/View/View.js +2 -2
  132. package/dist/components/View/View.types.d.ts +1 -1
  133. package/dist/components/_private/Expandable/Expandable.js +2 -2
  134. package/dist/components/_private/Portal/Portal.js +1 -1
  135. package/dist/config/tailwind.js +2 -2
  136. package/dist/hooks/_private/useDrag.js +4 -4
  137. package/dist/hooks/_private/useFadeSide.js +1 -1
  138. package/dist/hooks/useOnClickOutside.js +2 -4
  139. package/dist/hooks/useResponsiveClientValue.js +1 -1
  140. package/dist/styles/mixin.js +1 -1
  141. package/dist/tests/ThemesPlayground.js +16 -16
  142. package/dist/themes/_generator/definitions/slate.js +1 -1
  143. package/dist/themes/_generator/tokens/color/utilities/generateColors.d.ts +1 -1
  144. package/dist/themes/_generator/tokens/color/utilities/generateMetaColors.d.ts +1 -1
  145. package/dist/themes/_generator/tokens/color/utilities/generateMetaColors.js +1 -1
  146. package/dist/themes/_generator/tokens/css.js +2 -2
  147. package/dist/themes/_generator/tokens/font/font.types.d.ts +2 -2
  148. package/dist/themes/_generator/tokens/transforms.js +1 -1
  149. package/dist/themes/_generator/tokens/types.d.ts +3 -3
  150. package/dist/themes/_generator/transform.d.ts +1 -1
  151. package/dist/themes/_generator/transform.js +3 -3
  152. package/dist/themes/figma/theme.css +1 -1
  153. package/dist/themes/fragments/twitter/theme.css +1 -1
  154. package/dist/themes/index.d.ts +1 -1
  155. package/dist/themes/reshaped/theme.css +1 -1
  156. package/dist/themes/slate/theme.css +1 -1
  157. package/dist/types/config.d.ts +1 -1
  158. package/dist/utilities/a11y/TrapFocus.js +4 -4
  159. package/dist/utilities/scroll/lock.js +1 -1
  160. package/dist/utilities/scroll/lockStandard.js +1 -1
  161. package/dist/utilities/storybook/Example.js +1 -1
  162. package/package.json +42 -35
  163. package/dist/components/Accordion/tests/Accordion.stories.d.ts +0 -44
  164. package/dist/components/Accordion/tests/Accordion.stories.js +0 -204
  165. package/dist/components/ActionBar/tests/ActionBar.stories.d.ts +0 -40
  166. package/dist/components/ActionBar/tests/ActionBar.stories.js +0 -223
  167. package/dist/components/Actionable/tests/Actionable.stories.d.ts +0 -41
  168. package/dist/components/Actionable/tests/Actionable.stories.js +0 -220
  169. package/dist/components/Alert/tests/Alert.stories.d.ts +0 -24
  170. package/dist/components/Alert/tests/Alert.stories.js +0 -78
  171. package/dist/components/Autocomplete/tests/Autocomplete.stories.d.ts +0 -32
  172. package/dist/components/Autocomplete/tests/Autocomplete.stories.js +0 -246
  173. package/dist/components/Avatar/tests/Avatar.stories.d.ts +0 -31
  174. package/dist/components/Avatar/tests/Avatar.stories.js +0 -176
  175. package/dist/components/Badge/tests/Badge.stories.d.ts +0 -55
  176. package/dist/components/Badge/tests/Badge.stories.js +0 -328
  177. package/dist/components/Breadcrumbs/tests/Breadcrumbs.stories.d.ts +0 -40
  178. package/dist/components/Breadcrumbs/tests/Breadcrumbs.stories.js +0 -187
  179. package/dist/components/Button/tests/Button.stories.d.ts +0 -79
  180. package/dist/components/Button/tests/Button.stories.js +0 -789
  181. package/dist/components/Calendar/tests/Calendar.stories.d.ts +0 -29
  182. package/dist/components/Calendar/tests/Calendar.stories.js +0 -255
  183. package/dist/components/Card/tests/Card.stories.d.ts +0 -52
  184. package/dist/components/Card/tests/Card.stories.js +0 -125
  185. package/dist/components/Carousel/tests/Carousel.stories.d.ts +0 -34
  186. package/dist/components/Carousel/tests/Carousel.stories.js +0 -224
  187. package/dist/components/Checkbox/tests/Checkbox.stories.d.ts +0 -30
  188. package/dist/components/Checkbox/tests/Checkbox.stories.js +0 -171
  189. package/dist/components/CheckboxGroup/tests/CheckboxGroup.stories.d.ts +0 -19
  190. package/dist/components/CheckboxGroup/tests/CheckboxGroup.stories.js +0 -83
  191. package/dist/components/Container/tests/Container.stories.d.ts +0 -24
  192. package/dist/components/Container/tests/Container.stories.js +0 -75
  193. package/dist/components/ContextMenu/tests/ContextMenu.stories.d.ts +0 -26
  194. package/dist/components/ContextMenu/tests/ContextMenu.stories.js +0 -70
  195. package/dist/components/Dismissible/tests/Dismissible.stories.d.ts +0 -25
  196. package/dist/components/Dismissible/tests/Dismissible.stories.js +0 -97
  197. package/dist/components/Divider/tests/Divider.stories.d.ts +0 -20
  198. package/dist/components/Divider/tests/Divider.stories.js +0 -120
  199. package/dist/components/DropdownMenu/tests/DropdownMenu.stories.d.ts +0 -53
  200. package/dist/components/DropdownMenu/tests/DropdownMenu.stories.js +0 -278
  201. package/dist/components/FileUpload/tests/FileUpload.stories.d.ts +0 -31
  202. package/dist/components/FileUpload/tests/FileUpload.stories.js +0 -140
  203. package/dist/components/Flyout/tests/Flyout.stories.d.ts +0 -103
  204. package/dist/components/Flyout/tests/Flyout.stories.js +0 -738
  205. package/dist/components/FormControl/tests/FormControl.stories.d.ts +0 -31
  206. package/dist/components/FormControl/tests/FormControl.stories.js +0 -143
  207. package/dist/components/Grid/tests/Grid.stories.d.ts +0 -38
  208. package/dist/components/Grid/tests/Grid.stories.js +0 -245
  209. package/dist/components/Hidden/tests/Hidden.stories.d.ts +0 -16
  210. package/dist/components/Hidden/tests/Hidden.stories.js +0 -48
  211. package/dist/components/HiddenVisually/tests/HiddenVisually.stories.d.ts +0 -16
  212. package/dist/components/HiddenVisually/tests/HiddenVisually.stories.js +0 -28
  213. package/dist/components/Hotkey/tests/Hotkey.stories.d.ts +0 -13
  214. package/dist/components/Hotkey/tests/Hotkey.stories.js +0 -53
  215. package/dist/components/Icon/tests/Icon.stories.d.ts +0 -25
  216. package/dist/components/Icon/tests/Icon.stories.js +0 -113
  217. package/dist/components/Image/tests/Image.stories.d.ts +0 -41
  218. package/dist/components/Image/tests/Image.stories.js +0 -196
  219. package/dist/components/Link/tests/Link.stories.d.ts +0 -42
  220. package/dist/components/Link/tests/Link.stories.js +0 -155
  221. package/dist/components/Loader/tests/Loader.stories.d.ts +0 -21
  222. package/dist/components/Loader/tests/Loader.stories.js +0 -68
  223. package/dist/components/MenuItem/tests/MenuItem.stories.d.ts +0 -59
  224. package/dist/components/MenuItem/tests/MenuItem.stories.js +0 -236
  225. package/dist/components/Modal/tests/Modal.stories.d.ts +0 -64
  226. package/dist/components/Modal/tests/Modal.stories.js +0 -410
  227. package/dist/components/NumberField/tests/NumberField.stories.d.ts +0 -28
  228. package/dist/components/NumberField/tests/NumberField.stories.js +0 -258
  229. package/dist/components/Overlay/tests/Overlay.stories.d.ts +0 -28
  230. package/dist/components/Overlay/tests/Overlay.stories.js +0 -202
  231. package/dist/components/Pagination/tests/Pagination.stories.d.ts +0 -24
  232. package/dist/components/Pagination/tests/Pagination.stories.js +0 -105
  233. package/dist/components/PinField/tests/PinField.stories.d.ts +0 -34
  234. package/dist/components/PinField/tests/PinField.stories.js +0 -209
  235. package/dist/components/Popover/tests/Popover.stories.d.ts +0 -69
  236. package/dist/components/Popover/tests/Popover.stories.js +0 -340
  237. package/dist/components/Progress/tests/Progress.stories.d.ts +0 -30
  238. package/dist/components/Progress/tests/Progress.stories.js +0 -102
  239. package/dist/components/ProgressIndicator/tests/ProgressIndicator.stories.d.ts +0 -19
  240. package/dist/components/ProgressIndicator/tests/ProgressIndicator.stories.js +0 -92
  241. package/dist/components/Radio/tests/Radio.stories.d.ts +0 -35
  242. package/dist/components/Radio/tests/Radio.stories.js +0 -162
  243. package/dist/components/RadioGroup/tests/RadioGroup.stories.d.ts +0 -19
  244. package/dist/components/RadioGroup/tests/RadioGroup.stories.js +0 -77
  245. package/dist/components/Reshaped/tests/Reshaped.stories.d.ts +0 -34
  246. package/dist/components/Reshaped/tests/Reshaped.stories.js +0 -108
  247. package/dist/components/Resizable/tests/Resizable.stories.d.ts +0 -38
  248. package/dist/components/Resizable/tests/Resizable.stories.js +0 -185
  249. package/dist/components/Scrim/tests/Scrim.stories.d.ts +0 -20
  250. package/dist/components/Scrim/tests/Scrim.stories.js +0 -67
  251. package/dist/components/ScrollArea/tests/ScrollArea.stories.d.ts +0 -37
  252. package/dist/components/ScrollArea/tests/ScrollArea.stories.js +0 -244
  253. package/dist/components/Select/tests/Select.stories.d.ts +0 -53
  254. package/dist/components/Select/tests/Select.stories.js +0 -616
  255. package/dist/components/Skeleton/tests/Skeleton.stories.d.ts +0 -20
  256. package/dist/components/Skeleton/tests/Skeleton.stories.js +0 -63
  257. package/dist/components/Slider/tests/Slider.stories.d.ts +0 -47
  258. package/dist/components/Slider/tests/Slider.stories.js +0 -279
  259. package/dist/components/Stepper/tests/Stepper.stories.d.ts +0 -31
  260. package/dist/components/Stepper/tests/Stepper.stories.js +0 -135
  261. package/dist/components/Switch/tests/Switch.stories.d.ts +0 -22
  262. package/dist/components/Switch/tests/Switch.stories.js +0 -137
  263. package/dist/components/Switch/tests/Switch.test.stories.d.ts +0 -13
  264. package/dist/components/Switch/tests/Switch.test.stories.js +0 -11
  265. package/dist/components/Table/tests/Table.stories.d.ts +0 -42
  266. package/dist/components/Table/tests/Table.stories.js +0 -348
  267. package/dist/components/Tabs/tests/Tabs.stories.d.ts +0 -62
  268. package/dist/components/Tabs/tests/Tabs.stories.js +0 -539
  269. package/dist/components/Text/tests/Text.stories.d.ts +0 -48
  270. package/dist/components/Text/tests/Text.stories.js +0 -201
  271. package/dist/components/TextArea/tests/TextArea.stories.d.ts +0 -53
  272. package/dist/components/TextArea/tests/TextArea.stories.js +0 -204
  273. package/dist/components/TextField/tests/TextField.stories.d.ts +0 -54
  274. package/dist/components/TextField/tests/TextField.stories.js +0 -252
  275. package/dist/components/Theme/tests/Theme.stories.d.ts +0 -25
  276. package/dist/components/Theme/tests/Theme.stories.js +0 -171
  277. package/dist/components/Timeline/tests/Timeline.stories.d.ts +0 -22
  278. package/dist/components/Timeline/tests/Timeline.stories.js +0 -86
  279. package/dist/components/Toast/tests/Toast.stories.d.ts +0 -41
  280. package/dist/components/Toast/tests/Toast.stories.js +0 -432
  281. package/dist/components/ToggleButton/tests/ToggleButton.stories.d.ts +0 -27
  282. package/dist/components/ToggleButton/tests/ToggleButton.stories.js +0 -97
  283. package/dist/components/ToggleButtonGroup/tests/ToggleButtonGroup.stories.d.ts +0 -27
  284. package/dist/components/ToggleButtonGroup/tests/ToggleButtonGroup.stories.js +0 -169
  285. package/dist/components/Tooltip/tests/Tooltip.stories.d.ts +0 -28
  286. package/dist/components/Tooltip/tests/Tooltip.stories.js +0 -182
  287. package/dist/components/View/tests/View.stories.d.ts +0 -141
  288. package/dist/components/View/tests/View.stories.js +0 -1329
  289. package/dist/components/_private/Portal/tests/Portal.stories.d.ts +0 -6
  290. package/dist/components/_private/Portal/tests/Portal.stories.js +0 -17
  291. package/dist/hooks/tests/useDrag.stories.d.ts +0 -31
  292. package/dist/hooks/tests/useDrag.stories.js +0 -147
  293. package/dist/hooks/tests/useElementId.stories.d.ts +0 -11
  294. package/dist/hooks/tests/useElementId.stories.js +0 -23
  295. package/dist/hooks/tests/useHandlerRef.stories.d.ts +0 -14
  296. package/dist/hooks/tests/useHandlerRef.stories.js +0 -44
  297. package/dist/hooks/tests/useHotkeys.stories.d.ts +0 -43
  298. package/dist/hooks/tests/useHotkeys.stories.js +0 -158
  299. package/dist/hooks/tests/useKeyboardArrowNavigation.stories.d.ts +0 -15
  300. package/dist/hooks/tests/useKeyboardArrowNavigation.stories.js +0 -128
  301. package/dist/hooks/tests/useKeyboardMode.stories.d.ts +0 -11
  302. package/dist/hooks/tests/useKeyboardMode.stories.js +0 -42
  303. package/dist/hooks/tests/useOnClickOutside.stories.d.ts +0 -23
  304. package/dist/hooks/tests/useOnClickOutside.stories.js +0 -111
  305. package/dist/hooks/tests/useRTL.stories.d.ts +0 -11
  306. package/dist/hooks/tests/useRTL.stories.js +0 -23
  307. package/dist/hooks/tests/useResponsiveClientValue.stories.d.ts +0 -18
  308. package/dist/hooks/tests/useResponsiveClientValue.stories.js +0 -30
  309. package/dist/hooks/tests/useScrollLock.stories.d.ts +0 -14
  310. package/dist/hooks/tests/useScrollLock.stories.js +0 -97
  311. package/dist/hooks/tests/useToggle.stories.d.ts +0 -13
  312. package/dist/hooks/tests/useToggle.stories.js +0 -59
  313. package/dist/tests/ShadowDOM.stories.d.ts +0 -6
  314. package/dist/tests/ShadowDOM.stories.js +0 -110
  315. package/dist/tests/themes.stories.d.ts +0 -16
  316. package/dist/tests/themes.stories.js +0 -327
  317. package/dist/utilities/a11y/tests/TrapFocus.stories.d.ts +0 -14
  318. package/dist/utilities/a11y/tests/TrapFocus.stories.js +0 -615
@@ -1,29 +0,0 @@
1
- import { StoryObj } from "@storybook/react-vite";
2
- import { type Mock } from "storybook/test";
3
- declare const _default: {
4
- title: string;
5
- component: import("react").FC<import("./..").CalendarProps>;
6
- parameters: {
7
- iframe: {
8
- url: string;
9
- };
10
- };
11
- };
12
- export default _default;
13
- export declare const defaultMonth: StoryObj;
14
- export declare const uncontrolled: StoryObj<{
15
- handleChange: Mock;
16
- }>;
17
- export declare const controlled: StoryObj<{
18
- handleChange: Mock;
19
- }>;
20
- export declare const selectedDates: StoryObj;
21
- export declare const minMax: StoryObj;
22
- export declare const firstWeekDay: StoryObj;
23
- export declare const translation: {
24
- name: string;
25
- render: () => import("react").JSX.Element;
26
- };
27
- export declare const ariaLabels: StoryObj;
28
- export declare const monthSelection: StoryObj;
29
- export declare const keyboardNavigation: StoryObj;
@@ -1,255 +0,0 @@
1
- import { fn, expect, userEvent, within, waitFor } from "storybook/test";
2
- import { Example } from "../../../utilities/storybook/index.js";
3
- import Calendar from "../index.js";
4
- export default {
5
- title: "Components/Calendar",
6
- component: Calendar,
7
- parameters: {
8
- iframe: {
9
- url: "https://reshaped.so/docs/components/calendar",
10
- },
11
- },
12
- };
13
- export const defaultMonth = {
14
- name: "defaultMonth",
15
- render: () => (<Example>
16
- <Example.Item title="defaultMonth: 2020 January">
17
- <Calendar defaultMonth={new Date(2020, 0)} range/>
18
- </Example.Item>
19
- </Example>),
20
- play: ({ canvas }) => {
21
- const grid = canvas.getByRole("grid");
22
- const gridCells = canvas.getAllByRole("gridcell");
23
- const dates = canvas.getAllByRole("checkbox");
24
- const [prevButton, monthButton, nextButton] = canvas.getAllByRole("button");
25
- expect(grid).toBeInTheDocument();
26
- expect(gridCells).toHaveLength(31);
27
- expect(dates).toHaveLength(31);
28
- const focusableDates = dates.filter((el) => {
29
- return el.getAttribute("tabIndex") === "0";
30
- });
31
- // Defaults keyboard focus to the first day of the month
32
- expect(focusableDates).toHaveLength(1);
33
- expect(focusableDates[0]).toBe(dates[0]);
34
- // Default Labels
35
- expect(dates[0]).toHaveAccessibleName("Wednesday, January 1");
36
- expect(prevButton).toHaveAccessibleName("Previous month");
37
- expect(monthButton).toHaveAccessibleName("January 2020 Select a month");
38
- expect(nextButton).toHaveAccessibleName("Next month");
39
- },
40
- };
41
- export const uncontrolled = {
42
- name: "defaultValue, range",
43
- args: {
44
- handleChange: fn(),
45
- },
46
- render: (args) => (<Example>
47
- <Example.Item title="defaultValue">
48
- <Calendar defaultMonth={new Date(2020, 0)} defaultValue={new Date(2020, 0, 10)} onChange={args.handleChange}/>
49
- </Example.Item>
50
- <Example.Item title="defaultValue, range">
51
- <Calendar range defaultMonth={new Date(2020, 0)} defaultValue={{ start: new Date(2020, 0, 10), end: new Date(2020, 0, 15) }} onChange={args.handleChange}/>
52
- </Example.Item>
53
- </Example>),
54
- play: async ({ canvas, args }) => {
55
- const [singleCalendar, rangeCalendar] = canvas.getAllByRole("grid");
56
- const singleCalendarDates = within(singleCalendar).getAllByRole("checkbox");
57
- const rangeCalendarDates = within(rangeCalendar).getAllByRole("checkbox");
58
- await userEvent.click(singleCalendarDates[7]);
59
- expect(singleCalendarDates[7]).toBeChecked();
60
- expect(args.handleChange).toHaveBeenCalledTimes(1);
61
- expect(args.handleChange).toHaveBeenLastCalledWith({ value: new Date(2020, 0, 8) });
62
- await userEvent.click(rangeCalendarDates[7]);
63
- expect(rangeCalendarDates[7]).toBeChecked();
64
- expect(args.handleChange).toHaveBeenCalledTimes(2);
65
- expect(args.handleChange).toHaveBeenLastCalledWith({
66
- value: { start: new Date(2020, 0, 8), end: null },
67
- });
68
- // While selecting end value, clicking on a date < start value should change the start value
69
- await userEvent.click(rangeCalendarDates[6]);
70
- expect(rangeCalendarDates[6]).toBeChecked();
71
- expect(rangeCalendarDates[7]).not.toBeChecked();
72
- expect(args.handleChange).toHaveBeenCalledTimes(3);
73
- expect(args.handleChange).toHaveBeenLastCalledWith({
74
- value: { start: new Date(2020, 0, 7), end: null },
75
- });
76
- await userEvent.click(rangeCalendarDates[10]);
77
- expect(args.handleChange).toHaveBeenCalledTimes(4);
78
- expect(args.handleChange).toHaveBeenLastCalledWith({
79
- value: { start: new Date(2020, 0, 7), end: new Date(2020, 0, 11) },
80
- });
81
- for (let i = 6; i < 10; i++) {
82
- expect(rangeCalendarDates[i]).toBeChecked();
83
- }
84
- },
85
- };
86
- export const controlled = {
87
- name: "value, range",
88
- args: {
89
- handleChange: fn(),
90
- },
91
- render: (args) => (<Example>
92
- <Example.Item title="value">
93
- <Calendar defaultMonth={new Date(2020, 0)} value={new Date(2020, 0, 10)} onChange={args.handleChange}/>
94
- </Example.Item>
95
- <Example.Item title="defaultValue, range">
96
- <Calendar range defaultMonth={new Date(2020, 0)} value={{ start: new Date(2020, 0, 10), end: new Date(2020, 0, 15) }} onChange={args.handleChange}/>
97
- </Example.Item>
98
- </Example>),
99
- play: async ({ canvas, args }) => {
100
- const [singleCalendar, rangeCalendar] = canvas.getAllByRole("grid");
101
- const singleCalendarDates = within(singleCalendar).getAllByRole("checkbox");
102
- const rangeCalendarDates = within(rangeCalendar).getAllByRole("checkbox");
103
- await userEvent.click(singleCalendarDates[7]);
104
- expect(singleCalendarDates[7]).not.toBeChecked();
105
- expect(singleCalendarDates[9]).toBeChecked();
106
- expect(args.handleChange).toHaveBeenCalledTimes(1);
107
- expect(args.handleChange).toHaveBeenLastCalledWith({ value: new Date(2020, 0, 8) });
108
- await userEvent.click(rangeCalendarDates[7]);
109
- expect(rangeCalendarDates[7]).not.toBeChecked();
110
- expect(rangeCalendarDates[9]).toBeChecked();
111
- expect(args.handleChange).toHaveBeenCalledTimes(2);
112
- expect(args.handleChange).toHaveBeenLastCalledWith({
113
- value: { start: new Date(2020, 0, 8), end: null },
114
- });
115
- // While selecting end value, clicking on a date < start value should change the start value
116
- await userEvent.click(rangeCalendarDates[6]);
117
- expect(rangeCalendarDates[6]).not.toBeChecked();
118
- expect(rangeCalendarDates[9]).toBeChecked();
119
- expect(args.handleChange).toHaveBeenCalledTimes(3);
120
- expect(args.handleChange).toHaveBeenLastCalledWith({
121
- value: { start: new Date(2020, 0, 7), end: null },
122
- });
123
- // In controlled mode, clicking on a date > startValue still changes startValue since we're not updating the state
124
- await userEvent.click(rangeCalendarDates[10]);
125
- expect(args.handleChange).toHaveBeenCalledTimes(4);
126
- expect(args.handleChange).toHaveBeenLastCalledWith({
127
- value: { start: new Date(2020, 0, 11), end: null },
128
- });
129
- expect(rangeCalendarDates[6]).not.toBeChecked();
130
- expect(rangeCalendarDates[9]).toBeChecked();
131
- },
132
- };
133
- export const selectedDates = {
134
- name: "selectedDates",
135
- render: () => (<Example>
136
- <Example.Item title="selectedDates: [4,8]">
137
- <Calendar defaultMonth={new Date(2020, 0)} value={null} selectedDates={[new Date(2020, 0, 4), new Date(2020, 0, 8)]}/>
138
- </Example.Item>
139
- </Example>),
140
- play: ({ canvas }) => {
141
- const dates = canvas.getAllByRole("checkbox");
142
- expect(dates[3]).toBeChecked();
143
- expect(dates[7]).toBeChecked();
144
- },
145
- };
146
- export const minMax = {
147
- name: "min, max",
148
- render: () => (<Example>
149
- <Example.Item title="min: 4, max: 20">
150
- <Calendar defaultMonth={new Date(2020, 0)} min={new Date(2020, 0, 4)} max={new Date(2020, 0, 20)}/>
151
- </Example.Item>
152
- </Example>),
153
- play: ({ canvas }) => {
154
- const dates = canvas.getAllByRole("checkbox");
155
- expect(dates).toHaveLength(17);
156
- },
157
- };
158
- export const firstWeekDay = {
159
- name: "firstWeekDay",
160
- render: () => (<Example>
161
- <Example.Item title="firstWeekDay: 3 (Wed)">
162
- <Calendar defaultMonth={new Date(2020, 0)} firstWeekDay={3}/>
163
- </Example.Item>
164
- </Example>),
165
- };
166
- export const translation = {
167
- name: "render functions",
168
- render: () => (<Example>
169
- <Example.Item title="translated to NL">
170
- <Calendar defaultMonth={new Date(2020, 0)} renderMonthLabel={({ date }) => date.toLocaleDateString("nl", { month: "short" })} renderSelectedMonthLabel={({ date }) => date.toLocaleDateString("nl", { month: "long", year: "numeric" })} renderWeekDay={({ date }) => date.toLocaleDateString("nl", { weekday: "short" })}/>
171
- </Example.Item>
172
- </Example>),
173
- };
174
- export const ariaLabels = {
175
- name: "aria labels",
176
- render: () => (<Example>
177
- <Example.Item title="aria labels">
178
- <Calendar defaultMonth={new Date(2020, 0)} nextYearAriaLabel="Test next year" nextMonthAriaLabel="Test next month" renderDateAriaLabel={() => "Test date"} renderMonthAriaLabel={() => "Test month"} previousYearAriaLabel="Test previous year" previousMonthAriaLabel="Test previous month" monthSelectionAriaLabel="Test month selection"/>
179
- </Example.Item>
180
- </Example>),
181
- play: async ({ canvas }) => {
182
- const buttonEls = canvas.getAllByRole("button");
183
- const dateEls = canvas.getAllByRole("checkbox");
184
- expect(buttonEls[0]).toHaveAttribute("aria-label", "Test previous month");
185
- expect(buttonEls[1]).toHaveTextContent("Test month selection");
186
- expect(buttonEls[2]).toHaveAttribute("aria-label", "Test next month");
187
- expect(dateEls[0]).toHaveAttribute("aria-label", "Test date");
188
- await userEvent.click(buttonEls[1], { delay: null });
189
- const yearButtonEls = canvas.getAllByRole("button");
190
- expect(yearButtonEls[0]).toHaveAttribute("aria-label", "Test previous year");
191
- expect(yearButtonEls[1]).toHaveAttribute("aria-label", "Test next year");
192
- expect(yearButtonEls[2]).toHaveAttribute("aria-label", "Test month");
193
- },
194
- };
195
- export const monthSelection = {
196
- name: "test: month selection",
197
- render: () => (<Example>
198
- <Example.Item title="month selection">
199
- <Calendar defaultMonth={new Date(2020, 1)}/>
200
- </Example.Item>
201
- </Example>),
202
- play: async ({ canvas }) => {
203
- let buttons = canvas.getAllByRole("button");
204
- let monthButton = buttons[1];
205
- expect(monthButton).toHaveAccessibleName("February 2020 Select a month");
206
- await userEvent.click(monthButton);
207
- let months = canvas.getAllByRole("button").filter((el) => el.hasAttribute("data-rs-date"));
208
- expect(months).toHaveLength(12);
209
- await userEvent.click(months[0]);
210
- buttons = canvas.getAllByRole("button");
211
- months = buttons.filter((el) => el.hasAttribute("data-rs-date"));
212
- monthButton = buttons[1];
213
- expect(months).toHaveLength(0);
214
- expect(monthButton).toHaveAccessibleName("January 2020 Select a month");
215
- },
216
- };
217
- export const keyboardNavigation = {
218
- name: "test: keyboard navigation",
219
- render: () => (<Example>
220
- <Example.Item title="keyboard navigation">
221
- <Calendar defaultMonth={new Date(2020, 0)}/>
222
- </Example.Item>
223
- </Example>),
224
- play: async ({ canvas }) => {
225
- const buttons = canvas.getAllByRole("button");
226
- buttons[2].focus();
227
- await userEvent.keyboard("{Tab/}");
228
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2020-01-01");
229
- await userEvent.keyboard("{ArrowRight/}");
230
- waitFor(() => {
231
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2020-01-02");
232
- });
233
- await userEvent.keyboard("{Shift>}{Tab/}{/Shift}");
234
- await userEvent.keyboard("{Tab/}");
235
- waitFor(() => {
236
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2020-01-02");
237
- });
238
- await userEvent.keyboard("{ArrowLeft/}");
239
- waitFor(() => {
240
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2020-01-01");
241
- });
242
- await userEvent.keyboard("{ArrowDown/}");
243
- waitFor(() => {
244
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2020-01-08");
245
- });
246
- await userEvent.keyboard("{ArrowUp/}");
247
- waitFor(() => {
248
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2020-01-01");
249
- });
250
- await userEvent.keyboard("{ArrowUp/}");
251
- waitFor(() => {
252
- expect(document.activeElement).toHaveAttribute("data-rs-date", "2019-12-25");
253
- });
254
- },
255
- };
@@ -1,52 +0,0 @@
1
- import React from "react";
2
- import { StoryObj } from "@storybook/react-vite";
3
- import { fn } from "storybook/test";
4
- declare const _default: {
5
- title: string;
6
- component: React.ForwardRefExoticComponent<{
7
- padding?: import("../../../types/global").Responsive<number>;
8
- bleed?: import("../../../types/global").Responsive<number>;
9
- selected?: boolean;
10
- elevated?: boolean;
11
- children?: React.ReactNode;
12
- onClick?: import("../../Actionable").ActionableProps["onClick"];
13
- href?: string;
14
- as?: keyof React.JSX.IntrinsicElements | undefined;
15
- className?: import("../../../types/global").ClassName;
16
- attributes?: (import("../../../types/global").Attributes<keyof React.JSX.IntrinsicElements> & ((import("../../../types/global").Attributes<"button"> & Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "children" | "ref" | "style" | "form" | "slot" | "title" | "disabled" | "key" | "value" | "hidden" | "color" | "content" | "className" | "aria-orientation" | "role" | "translate" | "suppressHydrationWarning" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dir" | "name" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "draggable" | "enterKeyHint" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "exportparts" | "part" | "onToggle" | "type" | "id" | "lang" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onScrollEnd" | "onScrollEndCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture"> & {
17
- ref?: import("../../Actionable/Actionable.types").AttributesRef;
18
- }) | undefined)) | undefined;
19
- } & Pick<import("../../View").ViewProps, "height"> & React.RefAttributes<HTMLElement>>;
20
- parameters: {
21
- iframe: {
22
- url: string;
23
- };
24
- };
25
- };
26
- export default _default;
27
- export declare const padding: {
28
- name: string;
29
- render: () => React.JSX.Element;
30
- };
31
- export declare const selected: {
32
- name: string;
33
- render: () => React.JSX.Element;
34
- };
35
- export declare const elevated: {
36
- name: string;
37
- render: () => React.JSX.Element;
38
- };
39
- export declare const bleed: {
40
- name: string;
41
- render: () => React.JSX.Element;
42
- };
43
- export declare const height: {
44
- name: string;
45
- render: () => React.JSX.Element;
46
- };
47
- export declare const onClick: StoryObj<{
48
- handleClick: ReturnType<typeof fn>;
49
- }>;
50
- export declare const href: StoryObj;
51
- export declare const as: StoryObj;
52
- export declare const className: StoryObj;
@@ -1,125 +0,0 @@
1
- import React from "react";
2
- import { Example, Placeholder } from "../../../utilities/storybook/index.js";
3
- import Card from "../index.js";
4
- import { expect, fn, userEvent } from "storybook/test";
5
- export default {
6
- title: "Components/Card",
7
- component: Card,
8
- parameters: {
9
- iframe: {
10
- url: "https://reshaped.so/docs/components/card",
11
- },
12
- },
13
- };
14
- export const padding = {
15
- name: "padding",
16
- render: () => (<Example>
17
- <Example.Item title="padding: default">
18
- <Card>
19
- <Placeholder />
20
- </Card>
21
- </Example.Item>
22
-
23
- <Example.Item title="padding: 2">
24
- <Card padding={2}>
25
- <Placeholder />
26
- </Card>
27
- </Example.Item>
28
-
29
- <Example.Item title="padding: 0">
30
- <Card padding={0}>
31
- <Placeholder />
32
- </Card>
33
- </Example.Item>
34
-
35
- <Example.Item title={["responsive padding", "[s] 4", "[m+] 8"]}>
36
- <Card padding={{ s: 4, m: 8 }}>
37
- <Placeholder />
38
- </Card>
39
- </Example.Item>
40
- </Example>),
41
- };
42
- export const selected = {
43
- name: "selected",
44
- render: () => (<Example>
45
- <Example.Item title="selected">
46
- <Card selected>
47
- <Placeholder />
48
- </Card>
49
- </Example.Item>
50
- </Example>),
51
- };
52
- export const elevated = {
53
- name: "elevated",
54
- render: () => (<Example>
55
- <Example.Item title="elevated">
56
- <Card elevated>
57
- <Placeholder />
58
- </Card>
59
- </Example.Item>
60
- </Example>),
61
- };
62
- export const bleed = {
63
- name: "bleed",
64
- render: () => (<Example>
65
- <Example.Item title="bleed: 4">
66
- <Card bleed={4}>
67
- <Placeholder />
68
- </Card>
69
- </Example.Item>
70
- <Example.Item title={["responsive bleed", "[s] 4", "[m+] 0"]}>
71
- <Card bleed={{ s: 4, m: 0 }}>
72
- <Placeholder />
73
- </Card>
74
- </Example.Item>
75
- </Example>),
76
- };
77
- export const height = {
78
- name: "height",
79
- render: () => (<Example>
80
- <Example.Item title="height: 200px">
81
- <Card height="200px"/>
82
- </Example.Item>
83
- </Example>),
84
- };
85
- export const onClick = {
86
- name: "onClick",
87
- args: {
88
- handleClick: fn(),
89
- },
90
- render: (args) => <Card onClick={args.handleClick}>Trigger</Card>,
91
- play: async ({ canvas, args }) => {
92
- const { handleClick } = args;
93
- const el = canvas.getAllByRole("button")[0];
94
- await userEvent.click(el);
95
- expect(handleClick).toHaveBeenCalledTimes(1);
96
- expect(handleClick).toHaveBeenCalledWith(expect.objectContaining({ target: el }));
97
- },
98
- };
99
- export const href = {
100
- name: "href",
101
- render: () => <Card href="https://reshaped.so">Trigger</Card>,
102
- play: async ({ canvas }) => {
103
- const el = canvas.getByRole("link");
104
- expect(el).toHaveAttribute("href", "https://reshaped.so");
105
- },
106
- };
107
- export const as = {
108
- name: "as",
109
- render: () => <Card as="span" attributes={{ "data-testid": "root" }}/>,
110
- play: ({ canvas }) => {
111
- const root = canvas.getByTestId("root");
112
- expect(root.tagName).toBe("SPAN");
113
- },
114
- };
115
- export const className = {
116
- name: "className, attributes",
117
- render: () => (<div data-testid="root">
118
- <Card className="test-classname" attributes={{ id: "test-id" }}/>
119
- </div>),
120
- play: async ({ canvas }) => {
121
- const root = canvas.getByTestId("root").firstChild;
122
- expect(root).toHaveClass("test-classname");
123
- expect(root).toHaveAttribute("id", "test-id");
124
- },
125
- };
@@ -1,34 +0,0 @@
1
- import React from "react";
2
- import { StoryObj } from "@storybook/react-vite";
3
- import { fn } from "storybook/test";
4
- declare const _default: {
5
- title: string;
6
- component: React.FC<import("./..").CarouselProps>;
7
- parameters: {
8
- a11y: {
9
- disable: boolean;
10
- };
11
- iframe: {
12
- url: string;
13
- };
14
- };
15
- };
16
- export default _default;
17
- export declare const base: StoryObj;
18
- export declare const visibleItems: {
19
- name: string;
20
- render: () => React.JSX.Element;
21
- };
22
- export declare const gap: {
23
- name: string;
24
- render: () => React.JSX.Element;
25
- };
26
- export declare const bleed: {
27
- name: string;
28
- render: () => React.JSX.Element;
29
- };
30
- export declare const navigationDisplay: StoryObj;
31
- export declare const instanceRef: StoryObj<{
32
- handleChange: ReturnType<typeof fn>;
33
- }>;
34
- export declare const className: StoryObj;