@blockle/blocks 0.20.0-alpha1.0 → 1.0.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 (354) hide show
  1. package/README.md +2 -2
  2. package/dist/index.cjs +21 -71
  3. package/dist/index.d.ts +3 -36
  4. package/dist/index.js +3 -73
  5. package/dist/reset.cjs +1 -2
  6. package/dist/reset.d.ts +0 -0
  7. package/dist/reset.js +1 -2
  8. package/package.json +22 -78
  9. package/LICENSE +0 -21
  10. package/dist/components/accessibility/VisuallyHidden/VisuallyHidden.cjs +0 -20
  11. package/dist/components/accessibility/VisuallyHidden/VisuallyHidden.d.ts +0 -5
  12. package/dist/components/accessibility/VisuallyHidden/VisuallyHidden.js +0 -20
  13. package/dist/components/accessibility/VisuallyHidden/VisuallyHidden.spec.d.ts +0 -1
  14. package/dist/components/accessibility/VisuallyHidden/VisuallyHidden.stories.d.ts +0 -6
  15. package/dist/components/accessibility/VisuallyHidden/index.d.ts +0 -1
  16. package/dist/components/accessibility/VisuallyHidden/visually-hidden.css.cjs +0 -16
  17. package/dist/components/accessibility/VisuallyHidden/visually-hidden.css.d.ts +0 -1
  18. package/dist/components/accessibility/VisuallyHidden/visually-hidden.css.js +0 -16
  19. package/dist/components/display/Divider/Divider.cjs +0 -26
  20. package/dist/components/display/Divider/Divider.d.ts +0 -7
  21. package/dist/components/display/Divider/Divider.js +0 -26
  22. package/dist/components/display/Divider/Divider.spec.d.ts +0 -1
  23. package/dist/components/display/Divider/Divider.stories.d.ts +0 -6
  24. package/dist/components/display/Divider/divider.css.cjs +0 -16
  25. package/dist/components/display/Divider/divider.css.d.ts +0 -1
  26. package/dist/components/display/Divider/divider.css.js +0 -16
  27. package/dist/components/display/Divider/index.d.ts +0 -1
  28. package/dist/components/feedback/Progress/Progress.cjs +0 -54
  29. package/dist/components/feedback/Progress/Progress.d.ts +0 -16
  30. package/dist/components/feedback/Progress/Progress.js +0 -54
  31. package/dist/components/feedback/Progress/Progress.stories.d.ts +0 -5
  32. package/dist/components/feedback/Progress/index.d.ts +0 -1
  33. package/dist/components/feedback/Spinner/Spinner.cjs +0 -26
  34. package/dist/components/feedback/Spinner/Spinner.d.ts +0 -9
  35. package/dist/components/feedback/Spinner/Spinner.js +0 -26
  36. package/dist/components/feedback/Spinner/Spinner.stories.d.ts +0 -5
  37. package/dist/components/feedback/Spinner/index.d.ts +0 -1
  38. package/dist/components/form/Button/Button.cjs +0 -59
  39. package/dist/components/form/Button/Button.css.cjs +0 -16
  40. package/dist/components/form/Button/Button.css.d.ts +0 -1
  41. package/dist/components/form/Button/Button.css.js +0 -16
  42. package/dist/components/form/Button/Button.d.ts +0 -21
  43. package/dist/components/form/Button/Button.js +0 -59
  44. package/dist/components/form/Button/Button.spec.d.ts +0 -1
  45. package/dist/components/form/Button/Button.stories.d.ts +0 -7
  46. package/dist/components/form/Button/index.d.ts +0 -1
  47. package/dist/components/form/Checkbox/Checkbox.cjs +0 -79
  48. package/dist/components/form/Checkbox/Checkbox.d.ts +0 -9
  49. package/dist/components/form/Checkbox/Checkbox.js +0 -79
  50. package/dist/components/form/Checkbox/Checkbox.spec.d.ts +0 -1
  51. package/dist/components/form/Checkbox/Checkbox.stories.d.ts +0 -5
  52. package/dist/components/form/Checkbox/checkbox.css.cjs +0 -32
  53. package/dist/components/form/Checkbox/checkbox.css.d.ts +0 -3
  54. package/dist/components/form/Checkbox/checkbox.css.js +0 -32
  55. package/dist/components/form/Checkbox/index.d.ts +0 -1
  56. package/dist/components/form/Input/Input.cjs +0 -51
  57. package/dist/components/form/Input/Input.d.ts +0 -11
  58. package/dist/components/form/Input/Input.js +0 -51
  59. package/dist/components/form/Input/Input.spec.d.ts +0 -1
  60. package/dist/components/form/Input/Input.stories.d.ts +0 -5
  61. package/dist/components/form/Input/index.d.ts +0 -1
  62. package/dist/components/form/Input/input.css.cjs +0 -21
  63. package/dist/components/form/Input/input.css.d.ts +0 -1
  64. package/dist/components/form/Input/input.css.js +0 -21
  65. package/dist/components/form/Label/Label.cjs +0 -30
  66. package/dist/components/form/Label/Label.d.ts +0 -18
  67. package/dist/components/form/Label/Label.js +0 -30
  68. package/dist/components/form/Label/Label.spec.d.ts +0 -1
  69. package/dist/components/form/Label/Label.stories.d.ts +0 -6
  70. package/dist/components/form/Label/index.d.ts +0 -1
  71. package/dist/components/form/Radio/Radio.cjs +0 -48
  72. package/dist/components/form/Radio/Radio.d.ts +0 -8
  73. package/dist/components/form/Radio/Radio.js +0 -48
  74. package/dist/components/form/Radio/Radio.spec.d.ts +0 -1
  75. package/dist/components/form/Radio/Radio.stories.d.ts +0 -6
  76. package/dist/components/form/Radio/RadioGroup.d.ts +0 -8
  77. package/dist/components/form/Radio/index.d.ts +0 -2
  78. package/dist/components/form/Radio/radio.css.cjs +0 -32
  79. package/dist/components/form/Radio/radio.css.d.ts +0 -3
  80. package/dist/components/form/Radio/radio.css.js +0 -32
  81. package/dist/components/form/Select/Select.cjs +0 -65
  82. package/dist/components/form/Select/Select.d.ts +0 -10
  83. package/dist/components/form/Select/Select.js +0 -65
  84. package/dist/components/form/Select/Select.stories.d.ts +0 -5
  85. package/dist/components/form/Select/index.d.ts +0 -1
  86. package/dist/components/form/Select/select.css.cjs +0 -38
  87. package/dist/components/form/Select/select.css.d.ts +0 -3
  88. package/dist/components/form/Select/select.css.js +0 -38
  89. package/dist/components/form/Slider/Slider.cjs +0 -141
  90. package/dist/components/form/Slider/Slider.d.ts +0 -20
  91. package/dist/components/form/Slider/Slider.js +0 -141
  92. package/dist/components/form/Slider/Slider.spec.d.ts +0 -1
  93. package/dist/components/form/Slider/Slider.stories.d.ts +0 -6
  94. package/dist/components/form/Slider/index.d.ts +0 -1
  95. package/dist/components/form/Slider/slider.css.cjs +0 -75
  96. package/dist/components/form/Slider/slider.css.d.ts +0 -5
  97. package/dist/components/form/Slider/slider.css.js +0 -75
  98. package/dist/components/form/Slider/usePointerProgress.cjs +0 -47
  99. package/dist/components/form/Slider/usePointerProgress.d.ts +0 -11
  100. package/dist/components/form/Slider/usePointerProgress.js +0 -47
  101. package/dist/components/form/Switch/Switch.cjs +0 -73
  102. package/dist/components/form/Switch/Switch.d.ts +0 -6
  103. package/dist/components/form/Switch/Switch.js +0 -73
  104. package/dist/components/form/Switch/Switch.stories.d.ts +0 -5
  105. package/dist/components/form/Switch/index.d.ts +0 -1
  106. package/dist/components/form/Switch/switch.css.cjs +0 -27
  107. package/dist/components/form/Switch/switch.css.d.ts +0 -2
  108. package/dist/components/form/Switch/switch.css.js +0 -27
  109. package/dist/components/layout/Box/Box.cjs +0 -28
  110. package/dist/components/layout/Box/Box.d.ts +0 -11
  111. package/dist/components/layout/Box/Box.js +0 -28
  112. package/dist/components/layout/Box/Box.spec.d.ts +0 -1
  113. package/dist/components/layout/Box/Box.stories.d.ts +0 -6
  114. package/dist/components/layout/Box/index.d.ts +0 -1
  115. package/dist/components/layout/Inline/Inline.cjs +0 -30
  116. package/dist/components/layout/Inline/Inline.d.ts +0 -13
  117. package/dist/components/layout/Inline/Inline.js +0 -30
  118. package/dist/components/layout/Inline/Inline.stories.d.ts +0 -6
  119. package/dist/components/layout/Inline/index.d.ts +0 -1
  120. package/dist/components/layout/Stack/Stack.cjs +0 -30
  121. package/dist/components/layout/Stack/Stack.d.ts +0 -17
  122. package/dist/components/layout/Stack/Stack.js +0 -30
  123. package/dist/components/layout/Stack/Stack.stories.d.ts +0 -6
  124. package/dist/components/layout/Stack/index.d.ts +0 -1
  125. package/dist/components/navigation/Link/Link.cjs +0 -32
  126. package/dist/components/navigation/Link/Link.d.ts +0 -11
  127. package/dist/components/navigation/Link/Link.js +0 -32
  128. package/dist/components/navigation/Link/Link.stories.d.ts +0 -6
  129. package/dist/components/navigation/Link/index.d.ts +0 -1
  130. package/dist/components/other/BlocksProvider/BlocksProvider.cjs +0 -38
  131. package/dist/components/other/BlocksProvider/BlocksProvider.d.ts +0 -8
  132. package/dist/components/other/BlocksProvider/BlocksProvider.js +0 -38
  133. package/dist/components/other/BlocksProvider/context.cjs +0 -6
  134. package/dist/components/other/BlocksProvider/context.d.ts +0 -4
  135. package/dist/components/other/BlocksProvider/context.js +0 -6
  136. package/dist/components/other/BlocksProvider/index.d.ts +0 -2
  137. package/dist/components/other/Portal/Portal.cjs +0 -8
  138. package/dist/components/other/Portal/Portal.d.ts +0 -5
  139. package/dist/components/other/Portal/Portal.js +0 -8
  140. package/dist/components/other/Portal/index.d.ts +0 -1
  141. package/dist/components/overlay/Dialog/Dialog.cjs +0 -79
  142. package/dist/components/overlay/Dialog/Dialog.d.ts +0 -10
  143. package/dist/components/overlay/Dialog/Dialog.js +0 -79
  144. package/dist/components/overlay/Dialog/Dialog.stories.d.ts +0 -7
  145. package/dist/components/overlay/Dialog/dialog.css.cjs +0 -22
  146. package/dist/components/overlay/Dialog/dialog.css.d.ts +0 -1
  147. package/dist/components/overlay/Dialog/dialog.css.js +0 -22
  148. package/dist/components/overlay/Dialog/dialogHelper.cjs +0 -22
  149. package/dist/components/overlay/Dialog/dialogHelper.d.ts +0 -6
  150. package/dist/components/overlay/Dialog/dialogHelper.js +0 -22
  151. package/dist/components/overlay/Dialog/index.d.ts +0 -1
  152. package/dist/components/overlay/Popover/Popover.cjs +0 -113
  153. package/dist/components/overlay/Popover/Popover.d.ts +0 -12
  154. package/dist/components/overlay/Popover/Popover.js +0 -113
  155. package/dist/components/overlay/Popover/Popover.stories.d.ts +0 -5
  156. package/dist/components/overlay/Popover/popover-utils.cjs +0 -62
  157. package/dist/components/overlay/Popover/popover-utils.d.ts +0 -2
  158. package/dist/components/overlay/Popover/popover-utils.js +0 -62
  159. package/dist/components/overlay/Tooltip/Tooltip.cjs +0 -73
  160. package/dist/components/overlay/Tooltip/Tooltip.d.ts +0 -11
  161. package/dist/components/overlay/Tooltip/Tooltip.js +0 -73
  162. package/dist/components/overlay/Tooltip/Tooltip.stories.d.ts +0 -5
  163. package/dist/components/overlay/Tooltip/index.d.ts +0 -1
  164. package/dist/components/typography/Heading/Heading.cjs +0 -24
  165. package/dist/components/typography/Heading/Heading.d.ts +0 -8
  166. package/dist/components/typography/Heading/Heading.js +0 -24
  167. package/dist/components/typography/Heading/heading.css.cjs +0 -16
  168. package/dist/components/typography/Heading/heading.css.d.ts +0 -1
  169. package/dist/components/typography/Heading/heading.css.js +0 -16
  170. package/dist/components/typography/Heading/heading.stories.d.ts +0 -12
  171. package/dist/components/typography/Heading/index.d.ts +0 -1
  172. package/dist/components/typography/Text/Text.cjs +0 -21
  173. package/dist/components/typography/Text/Text.d.ts +0 -12
  174. package/dist/components/typography/Text/Text.js +0 -21
  175. package/dist/components/typography/Text/Text.stories.d.ts +0 -5
  176. package/dist/components/typography/Text/index.d.ts +0 -1
  177. package/dist/components/typography/Text/text.css.cjs +0 -16
  178. package/dist/components/typography/Text/text.css.d.ts +0 -1
  179. package/dist/components/typography/Text/text.css.js +0 -16
  180. package/dist/entries/themes/momotaro.d.ts +0 -1
  181. package/dist/hooks/useClickOutside/useClickOutside.cjs +0 -24
  182. package/dist/hooks/useClickOutside/useClickOutside.d.ts +0 -6
  183. package/dist/hooks/useClickOutside/useClickOutside.js +0 -24
  184. package/dist/hooks/useControlledValue/useControlledValue.cjs +0 -33
  185. package/dist/hooks/useControlledValue/useControlledValue.d.ts +0 -8
  186. package/dist/hooks/useControlledValue/useControlledValue.js +0 -33
  187. package/dist/hooks/useFocusLock/index.d.ts +0 -1
  188. package/dist/hooks/useFocusLock/useFocusLock.d.ts +0 -6
  189. package/dist/hooks/useIsomorphicLayoutEffect/index.d.ts +0 -1
  190. package/dist/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.cjs +0 -6
  191. package/dist/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.d.ts +0 -5
  192. package/dist/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.js +0 -6
  193. package/dist/hooks/useKeyboard/index.d.ts +0 -1
  194. package/dist/hooks/useKeyboard/useKeyboard.cjs +0 -21
  195. package/dist/hooks/useKeyboard/useKeyboard.d.ts +0 -6
  196. package/dist/hooks/useKeyboard/useKeyboard.js +0 -21
  197. package/dist/hooks/useLayer/index.d.ts +0 -1
  198. package/dist/hooks/useLayer/useLayer.cjs +0 -27
  199. package/dist/hooks/useLayer/useLayer.d.ts +0 -1
  200. package/dist/hooks/useLayer/useLayer.js +0 -27
  201. package/dist/hooks/usePreventBodyScroll/index.d.ts +0 -1
  202. package/dist/hooks/usePreventBodyScroll/usePreventBodyScroll.cjs +0 -30
  203. package/dist/hooks/usePreventBodyScroll/usePreventBodyScroll.d.ts +0 -1
  204. package/dist/hooks/usePreventBodyScroll/usePreventBodyScroll.js +0 -30
  205. package/dist/hooks/useRestoreFocus/index.d.ts +0 -1
  206. package/dist/hooks/useRestoreFocus/useRestoreFocus.cjs +0 -19
  207. package/dist/hooks/useRestoreFocus/useRestoreFocus.d.ts +0 -4
  208. package/dist/hooks/useRestoreFocus/useRestoreFocus.js +0 -19
  209. package/dist/hooks/useRootAriaHidden/index.d.ts +0 -1
  210. package/dist/hooks/useRootAriaHidden/useRootAriaHidden.cjs +0 -12
  211. package/dist/hooks/useRootAriaHidden/useRootAriaHidden.d.ts +0 -7
  212. package/dist/hooks/useRootAriaHidden/useRootAriaHidden.js +0 -12
  213. package/dist/hooks/useVisibilityState/index.d.ts +0 -1
  214. package/dist/hooks/useVisibilityState/useVisibilityState.cjs +0 -17
  215. package/dist/hooks/useVisibilityState/useVisibilityState.d.ts +0 -3
  216. package/dist/hooks/useVisibilityState/useVisibilityState.js +0 -17
  217. package/dist/lib/asChildRenderer/createAsChildTemplate.cjs +0 -73
  218. package/dist/lib/asChildRenderer/createAsChildTemplate.d.ts +0 -34
  219. package/dist/lib/asChildRenderer/createAsChildTemplate.js +0 -73
  220. package/dist/lib/asChildRenderer/createAsChildTemplate.spec.d.ts +0 -1
  221. package/dist/lib/css/atoms/atomTypes.d.ts +0 -37
  222. package/dist/lib/css/atoms/atomicProperties.cjs +0 -90
  223. package/dist/lib/css/atoms/atomicProperties.d.ts +0 -286
  224. package/dist/lib/css/atoms/atomicProperties.js +0 -90
  225. package/dist/lib/css/atoms/atoms.d.ts +0 -1
  226. package/dist/lib/css/atoms/breakpoints.cjs +0 -15
  227. package/dist/lib/css/atoms/breakpoints.d.ts +0 -9
  228. package/dist/lib/css/atoms/breakpoints.js +0 -15
  229. package/dist/lib/css/atoms/index.d.ts +0 -2
  230. package/dist/lib/css/atoms/sprinkles.css.cjs +0 -52
  231. package/dist/lib/css/atoms/sprinkles.css.d.ts +0 -233
  232. package/dist/lib/css/atoms/sprinkles.css.js +0 -52
  233. package/dist/lib/css/flexbox/flexbox.cjs +0 -17
  234. package/dist/lib/css/flexbox/flexbox.d.ts +0 -15
  235. package/dist/lib/css/flexbox/flexbox.js +0 -17
  236. package/dist/lib/css/layers/layers.css.cjs +0 -8
  237. package/dist/lib/css/layers/layers.css.d.ts +0 -1
  238. package/dist/lib/css/layers/layers.css.js +0 -8
  239. package/dist/lib/css/reset/reset.css.cjs +0 -38
  240. package/dist/lib/css/reset/reset.css.d.ts +0 -1
  241. package/dist/lib/css/reset/reset.css.js +0 -37
  242. package/dist/lib/css/style/style.cjs +0 -29
  243. package/dist/lib/css/style/style.d.ts +0 -12
  244. package/dist/lib/css/style/style.js +0 -29
  245. package/dist/lib/css/utils/cssUtils.cjs +0 -6
  246. package/dist/lib/css/utils/cssUtils.d.ts +0 -1
  247. package/dist/lib/css/utils/cssUtils.js +0 -6
  248. package/dist/lib/react/mergeProps.cjs +0 -43
  249. package/dist/lib/react/mergeProps.d.ts +0 -4
  250. package/dist/lib/react/mergeProps.js +0 -43
  251. package/dist/lib/react/refs.cjs +0 -17
  252. package/dist/lib/react/refs.d.ts +0 -3
  253. package/dist/lib/react/refs.js +0 -17
  254. package/dist/lib/theme/componentThemes.d.ts +0 -134
  255. package/dist/lib/theme/makeComponentTheme.cjs +0 -6
  256. package/dist/lib/theme/makeComponentTheme.d.ts +0 -49
  257. package/dist/lib/theme/makeComponentTheme.js +0 -6
  258. package/dist/lib/theme/makeTheme.cjs +0 -13
  259. package/dist/lib/theme/makeTheme.d.ts +0 -14
  260. package/dist/lib/theme/makeTheme.js +0 -13
  261. package/dist/lib/theme/makeVanillaTheme.cjs +0 -20
  262. package/dist/lib/theme/makeVanillaTheme.d.ts +0 -16
  263. package/dist/lib/theme/makeVanillaTheme.js +0 -20
  264. package/dist/lib/theme/store/theme.cjs +0 -93
  265. package/dist/lib/theme/store/theme.d.ts +0 -13
  266. package/dist/lib/theme/store/theme.js +0 -93
  267. package/dist/lib/theme/tokens.cjs +0 -82
  268. package/dist/lib/theme/tokens.d.ts +0 -2
  269. package/dist/lib/theme/tokens.js +0 -82
  270. package/dist/lib/theme/tokensType.d.ts +0 -33
  271. package/dist/lib/theme/vars.css.cjs +0 -10
  272. package/dist/lib/theme/vars.css.d.ts +0 -75
  273. package/dist/lib/theme/vars.css.js +0 -10
  274. package/dist/lib/utils/atom-props.cjs +0 -16
  275. package/dist/lib/utils/atom-props.d.ts +0 -4
  276. package/dist/lib/utils/atom-props.js +0 -16
  277. package/dist/lib/utils/classnames.cjs +0 -7
  278. package/dist/lib/utils/classnames.d.ts +0 -3
  279. package/dist/lib/utils/classnames.js +0 -7
  280. package/dist/lib/utils/dom-focus.d.ts +0 -2
  281. package/dist/lib/utils/dom.cjs +0 -13
  282. package/dist/lib/utils/dom.d.ts +0 -4
  283. package/dist/lib/utils/dom.js +0 -13
  284. package/dist/lib/utils/helpers.d.ts +0 -9
  285. package/dist/lib/utils/math.cjs +0 -13
  286. package/dist/lib/utils/math.d.ts +0 -2
  287. package/dist/lib/utils/math.js +0 -13
  288. package/dist/lib/utils/utils.d.ts +0 -3
  289. package/dist/themes/momotaro/components/button.css.cjs +0 -110
  290. package/dist/themes/momotaro/components/button.css.d.ts +0 -1
  291. package/dist/themes/momotaro/components/button.css.js +0 -110
  292. package/dist/themes/momotaro/components/checkbox.css.cjs +0 -64
  293. package/dist/themes/momotaro/components/checkbox.css.d.ts +0 -1
  294. package/dist/themes/momotaro/components/checkbox.css.js +0 -64
  295. package/dist/themes/momotaro/components/dialog.css.cjs +0 -82
  296. package/dist/themes/momotaro/components/dialog.css.d.ts +0 -1
  297. package/dist/themes/momotaro/components/dialog.css.js +0 -82
  298. package/dist/themes/momotaro/components/divider.css.cjs +0 -16
  299. package/dist/themes/momotaro/components/divider.css.d.ts +0 -1
  300. package/dist/themes/momotaro/components/divider.css.js +0 -16
  301. package/dist/themes/momotaro/components/helpers.css.cjs +0 -47
  302. package/dist/themes/momotaro/components/helpers.css.d.ts +0 -8
  303. package/dist/themes/momotaro/components/helpers.css.js +0 -47
  304. package/dist/themes/momotaro/components/index.cjs +0 -35
  305. package/dist/themes/momotaro/components/index.d.ts +0 -2
  306. package/dist/themes/momotaro/components/index.js +0 -35
  307. package/dist/themes/momotaro/components/input.css.cjs +0 -48
  308. package/dist/themes/momotaro/components/input.css.d.ts +0 -1
  309. package/dist/themes/momotaro/components/input.css.js +0 -48
  310. package/dist/themes/momotaro/components/label.css.cjs +0 -34
  311. package/dist/themes/momotaro/components/label.css.d.ts +0 -1
  312. package/dist/themes/momotaro/components/label.css.js +0 -34
  313. package/dist/themes/momotaro/components/link.css.cjs +0 -57
  314. package/dist/themes/momotaro/components/link.css.d.ts +0 -1
  315. package/dist/themes/momotaro/components/link.css.js +0 -57
  316. package/dist/themes/momotaro/components/popover.css.cjs +0 -33
  317. package/dist/themes/momotaro/components/popover.css.d.ts +0 -1
  318. package/dist/themes/momotaro/components/popover.css.js +0 -33
  319. package/dist/themes/momotaro/components/progress.css.cjs +0 -59
  320. package/dist/themes/momotaro/components/progress.css.d.ts +0 -1
  321. package/dist/themes/momotaro/components/progress.css.js +0 -59
  322. package/dist/themes/momotaro/components/radio.css.cjs +0 -65
  323. package/dist/themes/momotaro/components/radio.css.d.ts +0 -1
  324. package/dist/themes/momotaro/components/radio.css.js +0 -65
  325. package/dist/themes/momotaro/components/select.css.cjs +0 -48
  326. package/dist/themes/momotaro/components/select.css.d.ts +0 -1
  327. package/dist/themes/momotaro/components/select.css.js +0 -48
  328. package/dist/themes/momotaro/components/slider.css.cjs +0 -93
  329. package/dist/themes/momotaro/components/slider.css.d.ts +0 -1
  330. package/dist/themes/momotaro/components/slider.css.js +0 -93
  331. package/dist/themes/momotaro/components/spinner.css.cjs +0 -44
  332. package/dist/themes/momotaro/components/spinner.css.d.ts +0 -1
  333. package/dist/themes/momotaro/components/spinner.css.js +0 -44
  334. package/dist/themes/momotaro/components/switch.css.cjs +0 -62
  335. package/dist/themes/momotaro/components/switch.css.d.ts +0 -1
  336. package/dist/themes/momotaro/components/switch.css.js +0 -62
  337. package/dist/themes/momotaro/components/tooltip.css.cjs +0 -31
  338. package/dist/themes/momotaro/components/tooltip.css.d.ts +0 -1
  339. package/dist/themes/momotaro/components/tooltip.css.js +0 -31
  340. package/dist/themes/momotaro/components/transitions.cjs +0 -4
  341. package/dist/themes/momotaro/components/transitions.d.ts +0 -1
  342. package/dist/themes/momotaro/components/transitions.js +0 -4
  343. package/dist/themes/momotaro/index.d.ts +0 -1
  344. package/dist/themes/momotaro/momotaro.css.cjs +0 -14
  345. package/dist/themes/momotaro/momotaro.css.d.ts +0 -1
  346. package/dist/themes/momotaro/momotaro.css.js +0 -14
  347. package/dist/themes/momotaro/tokens.css.cjs +0 -86
  348. package/dist/themes/momotaro/tokens.css.d.ts +0 -2
  349. package/dist/themes/momotaro/tokens.css.js +0 -86
  350. package/dist/themes/momotaro.cjs +0 -4
  351. package/dist/themes/momotaro.js +0 -4
  352. package/themes/momotaro/index.d.ts +0 -1
  353. package/themes/momotaro/package.json +0 -5
  354. /package/dist/{entries/reset.d.ts → index.spec.d.ts} +0 -0
@@ -1,6 +0,0 @@
1
- "use client";
2
- "use strict";
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
- const react = require("react");
5
- const BlocksProviderContext = react.createContext(null);
6
- exports.BlocksProviderContext = BlocksProviderContext;
@@ -1,4 +0,0 @@
1
- export type BlocksProviderContextProps = {
2
- setAriaHidden: (value: boolean) => void;
3
- };
4
- export declare const BlocksProviderContext: import('react').Context<BlocksProviderContextProps | null>;
@@ -1,6 +0,0 @@
1
- "use client";
2
- import { createContext } from "react";
3
- const BlocksProviderContext = createContext(null);
4
- export {
5
- BlocksProviderContext
6
- };
@@ -1,2 +0,0 @@
1
- export { BlocksProvider } from './BlocksProvider';
2
- export type { BlocksProviderProps } from './BlocksProvider';
@@ -1,8 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const jsxRuntime = require("react/jsx-runtime");
4
- const reactDom = require("react-dom");
5
- const Portal = ({ children, container }) => {
6
- return reactDom.createPortal(/* @__PURE__ */ jsxRuntime.jsx("div", { children }), container || document.body);
7
- };
8
- exports.Portal = Portal;
@@ -1,5 +0,0 @@
1
- export type PortalProps = {
2
- children: React.ReactNode;
3
- container?: HTMLElement;
4
- };
5
- export declare const Portal: React.FC<PortalProps>;
@@ -1,8 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { createPortal } from "react-dom";
3
- const Portal = ({ children, container }) => {
4
- return createPortal(/* @__PURE__ */ jsx("div", { children }), container || document.body);
5
- };
6
- export {
7
- Portal
8
- };
@@ -1 +0,0 @@
1
- export { Portal, type PortalProps } from './Portal';
@@ -1,79 +0,0 @@
1
- "use client";
2
- "use strict";
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
- const jsxRuntime = require("react/jsx-runtime");
5
- const react = require("react");
6
- const useClickOutside = require("../../../hooks/useClickOutside/useClickOutside.cjs");
7
- const theme = require("../../../lib/theme/store/theme.cjs");
8
- const classnames = require("../../../lib/utils/classnames.cjs");
9
- const dom = require("../../../lib/utils/dom.cjs");
10
- const dialog_css = require("./dialog.css.cjs");
11
- const dialogHelper = require("./dialogHelper.cjs");
12
- const useRestoreFocus = require("../../../hooks/useRestoreFocus/useRestoreFocus.cjs");
13
- const usePreventBodyScroll = require("../../../hooks/usePreventBodyScroll/usePreventBodyScroll.cjs");
14
- const useKeyboard = require("../../../hooks/useKeyboard/useKeyboard.cjs");
15
- const useIsomorphicLayoutEffect = require("../../../hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.cjs");
16
- const Dialog = ({
17
- children,
18
- open,
19
- className,
20
- onRequestClose,
21
- size,
22
- ...restProps
23
- }) => {
24
- const dialogClassName = theme.getComponentStyles("dialog", {
25
- dialog: true,
26
- variants: { size }
27
- });
28
- const dialogRef = react.useRef(null);
29
- const [enabled, setEnabled] = react.useState(true);
30
- const [visible, setVisible] = react.useState(open);
31
- useRestoreFocus.useRestoreFocus(open);
32
- const isNested = dialogHelper.useNestedDialog(open);
33
- usePreventBodyScroll.usePreventBodyScroll(open && !isNested);
34
- const onEscape = react.useCallback(
35
- (event) => {
36
- event.preventDefault();
37
- onRequestClose();
38
- },
39
- [onRequestClose]
40
- );
41
- useKeyboard.useKeyboard("Escape", onEscape, { enabled: open && enabled });
42
- useClickOutside.useClickOutside(dialogRef, onRequestClose, { enabled: open && enabled });
43
- useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
44
- var _a, _b;
45
- if (open && visible) {
46
- (_a = dialogRef.current) == null ? void 0 : _a.showModal();
47
- } else if (open) {
48
- setVisible(true);
49
- } else {
50
- if (!dom.hasAnimationDuration(dialogRef.current)) {
51
- setVisible(false);
52
- }
53
- (_b = dialogRef.current) == null ? void 0 : _b.close();
54
- }
55
- }, [open, visible]);
56
- const onAnimationEnd = react.useCallback(() => {
57
- if (!open) {
58
- setVisible(false);
59
- }
60
- }, [open]);
61
- if (!visible) {
62
- return null;
63
- }
64
- const dataOpen = typeof window === "undefined" && open ? true : void 0;
65
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(dialogHelper.DialogContext.Provider, { value: { setEnabled }, children: /* @__PURE__ */ jsxRuntime.jsx(
66
- "dialog",
67
- {
68
- ref: dialogRef,
69
- "aria-modal": "true",
70
- open: dataOpen,
71
- className: classnames.classnames(dialog_css.dialog, dialogClassName, className),
72
- onAnimationEnd,
73
- onTransitionEnd: onAnimationEnd,
74
- ...restProps,
75
- children
76
- }
77
- ) }) });
78
- };
79
- exports.Dialog = Dialog;
@@ -1,10 +0,0 @@
1
- import { DialogTheme } from '../../../lib/theme/componentThemes';
2
- export type DialogProps = {
3
- children?: React.ReactNode;
4
- open: boolean;
5
- onRequestClose: () => void;
6
- className?: string;
7
- size?: DialogTheme['variants']['size'];
8
- 'aria-label'?: string;
9
- };
10
- export declare const Dialog: React.FC<DialogProps>;
@@ -1,79 +0,0 @@
1
- "use client";
2
- import { jsx, Fragment } from "react/jsx-runtime";
3
- import { useRef, useState, useCallback } from "react";
4
- import { useClickOutside } from "../../../hooks/useClickOutside/useClickOutside.js";
5
- import { getComponentStyles } from "../../../lib/theme/store/theme.js";
6
- import { classnames } from "../../../lib/utils/classnames.js";
7
- import { hasAnimationDuration } from "../../../lib/utils/dom.js";
8
- import { dialog } from "./dialog.css.js";
9
- import { useNestedDialog, DialogContext } from "./dialogHelper.js";
10
- import { useRestoreFocus } from "../../../hooks/useRestoreFocus/useRestoreFocus.js";
11
- import { usePreventBodyScroll } from "../../../hooks/usePreventBodyScroll/usePreventBodyScroll.js";
12
- import { useKeyboard } from "../../../hooks/useKeyboard/useKeyboard.js";
13
- import { useIsomorphicLayoutEffect } from "../../../hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.js";
14
- const Dialog = ({
15
- children,
16
- open,
17
- className,
18
- onRequestClose,
19
- size,
20
- ...restProps
21
- }) => {
22
- const dialogClassName = getComponentStyles("dialog", {
23
- dialog: true,
24
- variants: { size }
25
- });
26
- const dialogRef = useRef(null);
27
- const [enabled, setEnabled] = useState(true);
28
- const [visible, setVisible] = useState(open);
29
- useRestoreFocus(open);
30
- const isNested = useNestedDialog(open);
31
- usePreventBodyScroll(open && !isNested);
32
- const onEscape = useCallback(
33
- (event) => {
34
- event.preventDefault();
35
- onRequestClose();
36
- },
37
- [onRequestClose]
38
- );
39
- useKeyboard("Escape", onEscape, { enabled: open && enabled });
40
- useClickOutside(dialogRef, onRequestClose, { enabled: open && enabled });
41
- useIsomorphicLayoutEffect(() => {
42
- var _a, _b;
43
- if (open && visible) {
44
- (_a = dialogRef.current) == null ? void 0 : _a.showModal();
45
- } else if (open) {
46
- setVisible(true);
47
- } else {
48
- if (!hasAnimationDuration(dialogRef.current)) {
49
- setVisible(false);
50
- }
51
- (_b = dialogRef.current) == null ? void 0 : _b.close();
52
- }
53
- }, [open, visible]);
54
- const onAnimationEnd = useCallback(() => {
55
- if (!open) {
56
- setVisible(false);
57
- }
58
- }, [open]);
59
- if (!visible) {
60
- return null;
61
- }
62
- const dataOpen = typeof window === "undefined" && open ? true : void 0;
63
- return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(DialogContext.Provider, { value: { setEnabled }, children: /* @__PURE__ */ jsx(
64
- "dialog",
65
- {
66
- ref: dialogRef,
67
- "aria-modal": "true",
68
- open: dataOpen,
69
- className: classnames(dialog, dialogClassName, className),
70
- onAnimationEnd,
71
- onTransitionEnd: onAnimationEnd,
72
- ...restProps,
73
- children
74
- }
75
- ) }) });
76
- };
77
- export {
78
- Dialog
79
- };
@@ -1,7 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import { DialogProps } from './Dialog';
3
- declare const _default: Meta;
4
- export default _default;
5
- export declare const Default: StoryObj<DialogProps>;
6
- export declare const WithAriaMarkup: StoryObj<DialogProps>;
7
- export declare const Play: StoryObj<DialogProps>;
@@ -1,22 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const fileScope = require("@vanilla-extract/css/fileScope");
4
- const css = require("@vanilla-extract/css");
5
- const layers_css = require("../../../lib/css/layers/layers.css.cjs");
6
- fileScope.setFileScope("src/components/overlay/Dialog/dialog.css.ts", "@blockle/blocks");
7
- const dialog = css.style({
8
- "@layer": {
9
- [layers_css.blocksLayer]: {
10
- position: "fixed",
11
- inset: 0,
12
- border: "none",
13
- "::backdrop": {
14
- // Remove pointer event to prevent clicks on the backdrop
15
- // and make it easier to check if the click was outside the dialog
16
- pointerEvents: "none"
17
- }
18
- }
19
- }
20
- });
21
- fileScope.endFileScope();
22
- exports.dialog = dialog;
@@ -1 +0,0 @@
1
- export declare const dialog: string;
@@ -1,22 +0,0 @@
1
- import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
2
- import { style } from "@vanilla-extract/css";
3
- import { blocksLayer } from "../../../lib/css/layers/layers.css.js";
4
- setFileScope("src/components/overlay/Dialog/dialog.css.ts", "@blockle/blocks");
5
- const dialog = style({
6
- "@layer": {
7
- [blocksLayer]: {
8
- position: "fixed",
9
- inset: 0,
10
- border: "none",
11
- "::backdrop": {
12
- // Remove pointer event to prevent clicks on the backdrop
13
- // and make it easier to check if the click was outside the dialog
14
- pointerEvents: "none"
15
- }
16
- }
17
- }
18
- });
19
- endFileScope();
20
- export {
21
- dialog
22
- };
@@ -1,22 +0,0 @@
1
- "use client";
2
- "use strict";
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
- const react = require("react");
5
- const DialogContext = react.createContext(
6
- void 0
7
- );
8
- const useNestedDialog = (open) => {
9
- const parentDialog = react.useContext(DialogContext);
10
- react.useEffect(() => {
11
- if (!parentDialog || !open) {
12
- return;
13
- }
14
- parentDialog.setEnabled(false);
15
- return () => {
16
- parentDialog.setEnabled(true);
17
- };
18
- }, [parentDialog, open]);
19
- return !!parentDialog;
20
- };
21
- exports.DialogContext = DialogContext;
22
- exports.useNestedDialog = useNestedDialog;
@@ -1,6 +0,0 @@
1
- type DialogContextValue = {
2
- setEnabled: (active: boolean) => void;
3
- };
4
- export declare const DialogContext: import('react').Context<DialogContextValue | undefined>;
5
- export declare const useNestedDialog: (open: boolean) => boolean;
6
- export {};
@@ -1,22 +0,0 @@
1
- "use client";
2
- import { createContext, useContext, useEffect } from "react";
3
- const DialogContext = createContext(
4
- void 0
5
- );
6
- const useNestedDialog = (open) => {
7
- const parentDialog = useContext(DialogContext);
8
- useEffect(() => {
9
- if (!parentDialog || !open) {
10
- return;
11
- }
12
- parentDialog.setEnabled(false);
13
- return () => {
14
- parentDialog.setEnabled(true);
15
- };
16
- }, [parentDialog, open]);
17
- return !!parentDialog;
18
- };
19
- export {
20
- DialogContext,
21
- useNestedDialog
22
- };
@@ -1 +0,0 @@
1
- export { Dialog, type DialogProps } from './Dialog';
@@ -1,113 +0,0 @@
1
- "use client";
2
- "use strict";
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
- const jsxRuntime = require("react/jsx-runtime");
5
- const react = require("react");
6
- const useClickOutside = require("../../../hooks/useClickOutside/useClickOutside.cjs");
7
- const theme = require("../../../lib/theme/store/theme.cjs");
8
- const classnames = require("../../../lib/utils/classnames.cjs");
9
- const dom = require("../../../lib/utils/dom.cjs");
10
- const popoverUtils = require("./popover-utils.cjs");
11
- const useLayer = require("../../../hooks/useLayer/useLayer.cjs");
12
- const useVisibilityState = require("../../../hooks/useVisibilityState/useVisibilityState.cjs");
13
- const useIsomorphicLayoutEffect = require("../../../hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.cjs");
14
- const useKeyboard = require("../../../hooks/useKeyboard/useKeyboard.cjs");
15
- const Portal = require("../../other/Portal/Portal.cjs");
16
- const Box = require("../../layout/Box/Box.cjs");
17
- const Popover = ({
18
- align = "bottom",
19
- anchorElement,
20
- children,
21
- className,
22
- onRequestClose,
23
- open,
24
- repositionOnScroll,
25
- style,
26
- ...restProps
27
- }) => {
28
- const layer = useLayer.useLayer();
29
- const [visible, hide] = useVisibilityState.useVisibilityState(open);
30
- const [position, setPosition] = react.useState({ x: 0, y: 0 });
31
- const popoverRef = react.useRef(null);
32
- const containerClassName = theme.getComponentStyles(
33
- "popover",
34
- { base: true },
35
- false
36
- );
37
- react.useLayoutEffect(() => {
38
- if (!visible) {
39
- return;
40
- }
41
- const position2 = popoverUtils.getPopoverPosition(align, anchorElement, popoverRef);
42
- setPosition({ x: position2[0], y: position2[1] });
43
- }, [align, anchorElement, visible]);
44
- react.useEffect(() => {
45
- if (!open || !repositionOnScroll) {
46
- return;
47
- }
48
- function handleResize() {
49
- const position2 = popoverUtils.getPopoverPosition(align, anchorElement, popoverRef);
50
- setPosition({ x: position2[0], y: position2[1] });
51
- }
52
- window.addEventListener("resize", handleResize);
53
- window.addEventListener("scroll", handleResize);
54
- return () => {
55
- window.removeEventListener("resize", handleResize);
56
- window.removeEventListener("scroll", handleResize);
57
- };
58
- }, [align, anchorElement, open, repositionOnScroll]);
59
- useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
60
- var _a;
61
- if (!open) {
62
- (_a = popoverRef.current) == null ? void 0 : _a.removeAttribute("data-open");
63
- return;
64
- }
65
- let timer = requestAnimationFrame(() => {
66
- timer = requestAnimationFrame(() => {
67
- var _a2;
68
- (_a2 = popoverRef.current) == null ? void 0 : _a2.setAttribute("data-open", "");
69
- });
70
- });
71
- return () => {
72
- cancelAnimationFrame(timer);
73
- };
74
- }, [open, visible]);
75
- const onAnimationEnd = react.useCallback(() => {
76
- if (!open) {
77
- hide();
78
- }
79
- }, [hide, open]);
80
- react.useEffect(() => {
81
- if (open) {
82
- return;
83
- }
84
- if (!dom.hasAnimationDuration(popoverRef.current)) {
85
- hide();
86
- }
87
- }, [hide, open]);
88
- useKeyboard.useKeyboard("Escape", onRequestClose, { enabled: visible });
89
- useClickOutside.useClickOutside(popoverRef, onRequestClose, { enabled: visible });
90
- if (!visible) {
91
- return null;
92
- }
93
- const dataOpen = typeof window === "undefined" && open ? "" : void 0;
94
- return /* @__PURE__ */ jsxRuntime.jsx(Portal.Portal, { container: layer(), children: /* @__PURE__ */ jsxRuntime.jsx(
95
- Box.Box,
96
- {
97
- ref: popoverRef,
98
- "data-open": dataOpen,
99
- onAnimationEnd,
100
- onTransitionEnd: onAnimationEnd,
101
- className: classnames.classnames(containerClassName, className),
102
- position: "absolute",
103
- style: {
104
- ...style,
105
- left: position.x,
106
- top: position.y
107
- },
108
- ...restProps,
109
- children
110
- }
111
- ) });
112
- };
113
- exports.Popover = Popover;
@@ -1,12 +0,0 @@
1
- import { HTMLElementProps } from '../../../lib/utils/utils';
2
- export type PopoverProps = {
3
- align?: 'top' | 'bottom' | 'left' | 'right';
4
- anchorElement: React.RefObject<HTMLElement | null>;
5
- children: React.ReactNode;
6
- className?: string;
7
- onRequestClose: () => void;
8
- open: boolean;
9
- repositionOnScroll?: boolean;
10
- style?: React.CSSProperties;
11
- } & HTMLElementProps<HTMLDivElement>;
12
- export declare const Popover: React.FC<PopoverProps>;
@@ -1,113 +0,0 @@
1
- "use client";
2
- import { jsx } from "react/jsx-runtime";
3
- import { useState, useRef, useLayoutEffect, useEffect, useCallback } from "react";
4
- import { useClickOutside } from "../../../hooks/useClickOutside/useClickOutside.js";
5
- import { getComponentStyles } from "../../../lib/theme/store/theme.js";
6
- import { classnames } from "../../../lib/utils/classnames.js";
7
- import { hasAnimationDuration } from "../../../lib/utils/dom.js";
8
- import { getPopoverPosition } from "./popover-utils.js";
9
- import { useLayer } from "../../../hooks/useLayer/useLayer.js";
10
- import { useVisibilityState } from "../../../hooks/useVisibilityState/useVisibilityState.js";
11
- import { useIsomorphicLayoutEffect } from "../../../hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.js";
12
- import { useKeyboard } from "../../../hooks/useKeyboard/useKeyboard.js";
13
- import { Portal } from "../../other/Portal/Portal.js";
14
- import { Box } from "../../layout/Box/Box.js";
15
- const Popover = ({
16
- align = "bottom",
17
- anchorElement,
18
- children,
19
- className,
20
- onRequestClose,
21
- open,
22
- repositionOnScroll,
23
- style,
24
- ...restProps
25
- }) => {
26
- const layer = useLayer();
27
- const [visible, hide] = useVisibilityState(open);
28
- const [position, setPosition] = useState({ x: 0, y: 0 });
29
- const popoverRef = useRef(null);
30
- const containerClassName = getComponentStyles(
31
- "popover",
32
- { base: true },
33
- false
34
- );
35
- useLayoutEffect(() => {
36
- if (!visible) {
37
- return;
38
- }
39
- const position2 = getPopoverPosition(align, anchorElement, popoverRef);
40
- setPosition({ x: position2[0], y: position2[1] });
41
- }, [align, anchorElement, visible]);
42
- useEffect(() => {
43
- if (!open || !repositionOnScroll) {
44
- return;
45
- }
46
- function handleResize() {
47
- const position2 = getPopoverPosition(align, anchorElement, popoverRef);
48
- setPosition({ x: position2[0], y: position2[1] });
49
- }
50
- window.addEventListener("resize", handleResize);
51
- window.addEventListener("scroll", handleResize);
52
- return () => {
53
- window.removeEventListener("resize", handleResize);
54
- window.removeEventListener("scroll", handleResize);
55
- };
56
- }, [align, anchorElement, open, repositionOnScroll]);
57
- useIsomorphicLayoutEffect(() => {
58
- var _a;
59
- if (!open) {
60
- (_a = popoverRef.current) == null ? void 0 : _a.removeAttribute("data-open");
61
- return;
62
- }
63
- let timer = requestAnimationFrame(() => {
64
- timer = requestAnimationFrame(() => {
65
- var _a2;
66
- (_a2 = popoverRef.current) == null ? void 0 : _a2.setAttribute("data-open", "");
67
- });
68
- });
69
- return () => {
70
- cancelAnimationFrame(timer);
71
- };
72
- }, [open, visible]);
73
- const onAnimationEnd = useCallback(() => {
74
- if (!open) {
75
- hide();
76
- }
77
- }, [hide, open]);
78
- useEffect(() => {
79
- if (open) {
80
- return;
81
- }
82
- if (!hasAnimationDuration(popoverRef.current)) {
83
- hide();
84
- }
85
- }, [hide, open]);
86
- useKeyboard("Escape", onRequestClose, { enabled: visible });
87
- useClickOutside(popoverRef, onRequestClose, { enabled: visible });
88
- if (!visible) {
89
- return null;
90
- }
91
- const dataOpen = typeof window === "undefined" && open ? "" : void 0;
92
- return /* @__PURE__ */ jsx(Portal, { container: layer(), children: /* @__PURE__ */ jsx(
93
- Box,
94
- {
95
- ref: popoverRef,
96
- "data-open": dataOpen,
97
- onAnimationEnd,
98
- onTransitionEnd: onAnimationEnd,
99
- className: classnames(containerClassName, className),
100
- position: "absolute",
101
- style: {
102
- ...style,
103
- left: position.x,
104
- top: position.y
105
- },
106
- ...restProps,
107
- children
108
- }
109
- ) });
110
- };
111
- export {
112
- Popover
113
- };
@@ -1,5 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import { PopoverProps } from './Popover';
3
- declare const _default: Meta;
4
- export default _default;
5
- export declare const Default: StoryObj<PopoverProps>;
@@ -1,62 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- function getPopoverPosition(align, anchorRef, popoverRef) {
4
- if (!anchorRef.current || !popoverRef.current) {
5
- return [0, 0];
6
- }
7
- popoverRef.current.style.transform = "none";
8
- popoverRef.current.style.transitionDuration = "0s";
9
- const anchorRect = anchorRef.current.getBoundingClientRect();
10
- const popoverRect = popoverRef.current.getBoundingClientRect();
11
- let popoverStyles = getComputedStyle(popoverRef.current);
12
- const top = popoverStyles.getPropertyValue("top");
13
- const left = popoverStyles.getPropertyValue("left");
14
- popoverRef.current.style.left = "0";
15
- popoverRef.current.style.top = "0";
16
- popoverStyles = getComputedStyle(popoverRef.current);
17
- const marginTop = Number.parseFloat(
18
- popoverStyles.getPropertyValue("margin-top")
19
- );
20
- const marginRight = Number.parseFloat(
21
- popoverStyles.getPropertyValue("margin-right")
22
- );
23
- const marginBottom = Number.parseFloat(
24
- popoverStyles.getPropertyValue("margin-bottom")
25
- );
26
- const marginLeft = Number.parseFloat(
27
- popoverStyles.getPropertyValue("margin-left")
28
- );
29
- const marginY = marginTop + marginBottom;
30
- const marginX = marginRight + marginLeft;
31
- const docHeight = document.documentElement.clientHeight;
32
- const docWidth = document.documentElement.clientWidth;
33
- const docScrollTop = document.documentElement.scrollTop;
34
- const docScrollLeft = document.documentElement.scrollLeft;
35
- const anchorLeft = anchorRect.left + docScrollLeft;
36
- const anchorTop = anchorRect.top + docScrollTop;
37
- const topPosition = anchorRect.top - (popoverRect.height + marginTop);
38
- const rightPosition = anchorRect.left + anchorRect.width + popoverRect.width;
39
- const bottomPosition = anchorRect.top + anchorRect.height + popoverRect.height;
40
- const leftPosition = anchorRect.left - popoverRect.width;
41
- const offsetX = anchorLeft - marginLeft - (popoverRect.width - anchorRect.width) / 2;
42
- const offsetY = anchorTop - marginTop - (popoverRect.height - anchorRect.height) / 2;
43
- popoverRef.current.style.transform = "";
44
- popoverRef.current.style.transitionDuration = "";
45
- popoverRef.current.style.top = top;
46
- popoverRef.current.style.left = left;
47
- switch (align) {
48
- case "top": {
49
- return topPosition > 0 ? [offsetX, anchorTop - popoverRect.height - marginY] : [offsetX, anchorTop + anchorRect.height];
50
- }
51
- case "bottom": {
52
- return bottomPosition < docHeight || topPosition < 0 ? [offsetX, anchorTop + anchorRect.height] : [offsetX, anchorTop - popoverRect.height - marginY];
53
- }
54
- case "left": {
55
- return leftPosition > docWidth || leftPosition > 0 ? [anchorLeft - popoverRect.width - marginX, offsetY] : [anchorLeft + anchorRect.width, offsetY];
56
- }
57
- case "right": {
58
- return rightPosition < docWidth || leftPosition < 0 ? [anchorLeft + anchorRect.width, offsetY] : [anchorLeft - popoverRect.width - marginX, offsetY];
59
- }
60
- }
61
- }
62
- exports.getPopoverPosition = getPopoverPosition;
@@ -1,2 +0,0 @@
1
- export type PopoverPositions = [x: number, y: number];
2
- export declare function getPopoverPosition(align: 'top' | 'bottom' | 'left' | 'right', anchorRef: React.RefObject<HTMLElement | null>, popoverRef: React.RefObject<HTMLElement | null>): PopoverPositions;