@onepercentio/one-ui 0.29.4 → 0.29.5

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 (286) hide show
  1. package/dist/components/Switch/Switch.d.ts +1 -1
  2. package/dist/components/Switch/Switch.js +1 -1
  3. package/dist-ts/components/Switch/Switch.d.ts +1 -1
  4. package/package.json +1 -1
  5. package/src/assets/img/svg/checkbox.svg +0 -3
  6. package/src/assets/styles/index.scss +0 -2
  7. package/src/assets/styles/mixins.scss +0 -12
  8. package/src/assets/styles/variables.scss +0 -49
  9. package/src/components/AdaptiveButton/AdaptiveButton.module.scss +0 -7
  10. package/src/components/AdaptiveButton/AdaptiveButton.tsx +0 -26
  11. package/src/components/AdaptiveButton/index.tsx +0 -2
  12. package/src/components/AdaptiveContainer/AdaptiveContainer.module.scss +0 -53
  13. package/src/components/AdaptiveContainer/AdaptiveContainer.tsx +0 -200
  14. package/src/components/AdaptiveContainer/index.tsx +0 -2
  15. package/src/components/AdaptiveDialog/AdaptiveDialog.module.scss +0 -147
  16. package/src/components/AdaptiveDialog/AdaptiveDialog.tsx +0 -97
  17. package/src/components/AdaptiveDialog/index.tsx +0 -2
  18. package/src/components/AdaptiveSidebar/AdaptiveSidebar.module.scss +0 -49
  19. package/src/components/AdaptiveSidebar/AdaptiveSidebar.sample.tsx +0 -10
  20. package/src/components/AdaptiveSidebar/AdaptiveSidebar.tsx +0 -123
  21. package/src/components/AdaptiveSidebar/index.tsx +0 -2
  22. package/src/components/AnchoredTooltip/AnchoredTooltip.module.scss +0 -64
  23. package/src/components/AnchoredTooltip/AnchoredTooltip.tsx +0 -250
  24. package/src/components/AnchoredTooltip/index.tsx +0 -2
  25. package/src/components/AnimatedEntrance/AnimatedEntrance.module.scss +0 -108
  26. package/src/components/AnimatedEntrance/AnimatedEntrance.tsx +0 -227
  27. package/src/components/AnimatedEntrance/index.tsx +0 -2
  28. package/src/components/AsyncWrapper/AsyncWrapper.tsx +0 -38
  29. package/src/components/AsyncWrapper/index.tsx +0 -2
  30. package/src/components/Avatar/Avatar.module.scss +0 -22
  31. package/src/components/Avatar/Avatar.tsx +0 -31
  32. package/src/components/Avatar/index.tsx +0 -2
  33. package/src/components/BucketFill/BucketFill.module.scss +0 -36
  34. package/src/components/BucketFill/BucketFill.tsx +0 -65
  35. package/src/components/BucketFill/index.tsx +0 -2
  36. package/src/components/Button/Button.module.scss +0 -45
  37. package/src/components/Button/Button.tsx +0 -40
  38. package/src/components/Button/index.tsx +0 -2
  39. package/src/components/Card/Card.module.scss +0 -12
  40. package/src/components/Card/Card.tsx +0 -9
  41. package/src/components/Card/index.tsx +0 -2
  42. package/src/components/Chart/Chart.e2e.ts +0 -4
  43. package/src/components/Chart/Chart.logic.tsx +0 -8
  44. package/src/components/Chart/Chart.module.scss +0 -58
  45. package/src/components/Chart/Chart.tsx +0 -2
  46. package/src/components/Chart/Chart.types.ts +0 -35
  47. package/src/components/Chart/Chart.view.tsx +0 -241
  48. package/src/components/Chart/index.tsx +0 -2
  49. package/src/components/CheckBox/CheckBox.module.scss +0 -36
  50. package/src/components/CheckBox/CheckBox.tsx +0 -63
  51. package/src/components/CheckBox/index.tsx +0 -2
  52. package/src/components/CodeInput/CodeInput.module.scss +0 -5
  53. package/src/components/CodeInput/CodeInput.tsx +0 -84
  54. package/src/components/CodeInput/index.tsx +0 -2
  55. package/src/components/Collapsable/Collapsable.module.scss +0 -42
  56. package/src/components/Collapsable/Collapsable.tsx +0 -253
  57. package/src/components/Collapsable/index.tsx +0 -2
  58. package/src/components/Countdown/Countdown.tsx +0 -130
  59. package/src/components/Countdown/index.tsx +0 -2
  60. package/src/components/CurrencyInput/CurrencyInput.hook.ts +0 -37
  61. package/src/components/CurrencyInput/CurrencyInput.tsx +0 -25
  62. package/src/components/CurrencyInput/index.tsx +0 -2
  63. package/src/components/Divider/Divider.module.scss +0 -7
  64. package/src/components/Divider/Divider.tsx +0 -13
  65. package/src/components/Divider/index.tsx +0 -2
  66. package/src/components/EmailInput/EmailInput.module.scss +0 -0
  67. package/src/components/EmailInput/EmailInput.tsx +0 -51
  68. package/src/components/EmailInput/index.tsx +0 -2
  69. package/src/components/FadeIn/FadeIn.module.scss +0 -9
  70. package/src/components/FadeIn/FadeIn.tsx +0 -77
  71. package/src/components/FadeIn/index.tsx +0 -2
  72. package/src/components/FileInput/FileInput.module.scss +0 -6
  73. package/src/components/FileInput/FileInput.tsx +0 -75
  74. package/src/components/FileInput/View/BigFactory/BigFactory.module.scss +0 -20
  75. package/src/components/FileInput/View/BigFactory/BigFactory.tsx +0 -48
  76. package/src/components/FileInput/View/BigFactory/index.tsx +0 -2
  77. package/src/components/FileInput/View/Compact/Compact.module.scss +0 -68
  78. package/src/components/FileInput/View/Compact/Compact.tsx +0 -151
  79. package/src/components/FileInput/View/Compact/index.tsx +0 -2
  80. package/src/components/FileInput/View/View.types.ts +0 -12
  81. package/src/components/FileInput/index.tsx +0 -2
  82. package/src/components/FlowController/FlowController.module.scss +0 -47
  83. package/src/components/FlowController/FlowController.tsx +0 -93
  84. package/src/components/FlowController/index.tsx +0 -2
  85. package/src/components/Form/Form.tsx +0 -243
  86. package/src/components/Form/index.ts +0 -2
  87. package/src/components/Form/v2/Form.hook.ts +0 -341
  88. package/src/components/Form/v2/Form.module.scss +0 -0
  89. package/src/components/Form/v2/Form.tsx +0 -78
  90. package/src/components/Form/v2/Form.types.ts +0 -118
  91. package/src/components/Form/v2/FormField/Extensions/DateField/DateField.module.scss +0 -0
  92. package/src/components/Form/v2/FormField/Extensions/DateField/DateField.tsx +0 -73
  93. package/src/components/Form/v2/FormField/Extensions/DateField/index.tsx +0 -2
  94. package/src/components/Form/v2/FormField/Extensions/PhoneField/PhoneField.module.scss +0 -0
  95. package/src/components/Form/v2/FormField/Extensions/PhoneField/PhoneField.tsx +0 -91
  96. package/src/components/Form/v2/FormField/Extensions/PhoneField/index.tsx +0 -2
  97. package/src/components/Form/v2/FormField/FormField.module.scss +0 -0
  98. package/src/components/Form/v2/FormField/FormField.tsx +0 -378
  99. package/src/components/Form/v2/FormField/FormField.types.ts +0 -129
  100. package/src/components/Form/v2/FormField/index.tsx +0 -2
  101. package/src/components/Form/v2/index.tsx +0 -2
  102. package/src/components/Freeze/Freeze.tsx +0 -9
  103. package/src/components/Freeze/index.tsx +0 -2
  104. package/src/components/HSForms/HSForms.tsx +0 -57
  105. package/src/components/HSForms/index.tsx +0 -2
  106. package/src/components/Header/Header.module.scss +0 -119
  107. package/src/components/Header/Header.tsx +0 -138
  108. package/src/components/Header/index.tsx +0 -2
  109. package/src/components/HeaderCloseBtn/HeaderCloseBtn.module.scss +0 -44
  110. package/src/components/HeaderCloseBtn/HeaderCloseBtn.tsx +0 -28
  111. package/src/components/HeaderCloseBtn/index.tsx +0 -2
  112. package/src/components/InfinityScroll/InfinityScroll.module.scss +0 -30
  113. package/src/components/InfinityScroll/InfinityScroll.tsx +0 -187
  114. package/src/components/InfinityScroll/index.tsx +0 -2
  115. package/src/components/Input/Input.module.scss +0 -71
  116. package/src/components/Input/Input.tsx +0 -134
  117. package/src/components/Input/index.tsx +0 -2
  118. package/src/components/InstantCounter/InstantCounter.tsx +0 -77
  119. package/src/components/InstantCounter/index.tsx +0 -2
  120. package/src/components/LavaLamp/LavaLamp.data.tsx +0 -114
  121. package/src/components/LavaLamp/LavaLamp.module.scss +0 -26
  122. package/src/components/LavaLamp/LavaLamp.tsx +0 -131
  123. package/src/components/LavaLamp/index.tsx +0 -2
  124. package/src/components/LavaLamp/v2/LavaLamp.module.scss +0 -23
  125. package/src/components/LavaLamp/v2/LavaLamp.tsx +0 -197
  126. package/src/components/LinkToId/LinkToId.module.scss +0 -4
  127. package/src/components/LinkToId/LinkToId.tsx +0 -51
  128. package/src/components/LinkToId/index.tsx +0 -2
  129. package/src/components/Loader/Loader.module.scss +0 -40
  130. package/src/components/Loader/Loader.tsx +0 -18
  131. package/src/components/Loader/index.tsx +0 -2
  132. package/src/components/LoaderDotsIndicator/LoaderDotsIndicator.tsx +0 -34
  133. package/src/components/LoaderDotsIndicator/index.tsx +0 -2
  134. package/src/components/LoopableVideo/LoopableVideo.tsx +0 -37
  135. package/src/components/LoopableVideo/index.tsx +0 -2
  136. package/src/components/MainGrid/MainGrid.module.scss +0 -28
  137. package/src/components/MainGrid/MainGrid.tsx +0 -68
  138. package/src/components/MainGrid/index.tsx +0 -2
  139. package/src/components/MutableHamburgerButton/MutableHamburgerButton.module.scss +0 -220
  140. package/src/components/MutableHamburgerButton/MutableHamburgerButton.tsx +0 -38
  141. package/src/components/MutableHamburgerButton/index.tsx +0 -2
  142. package/src/components/Notification/Notification.module.scss +0 -25
  143. package/src/components/Notification/Notification.tsx +0 -13
  144. package/src/components/Notification/index.tsx +0 -2
  145. package/src/components/OrderableList/OrderableList.module.scss +0 -98
  146. package/src/components/OrderableList/OrderableList.tsx +0 -564
  147. package/src/components/OrderableList/index.tsx +0 -2
  148. package/src/components/PaginationIndicator/PaginationIndicator.tsx +0 -365
  149. package/src/components/PaginationIndicator/index.tsx +0 -2
  150. package/src/components/Parallax/Parallax.module.scss +0 -28
  151. package/src/components/Parallax/Parallax.tsx +0 -225
  152. package/src/components/Parallax/index.tsx +0 -2
  153. package/src/components/Parallax/math/helpers.ts +0 -289
  154. package/src/components/PasswordInput/PasswordInput.module.scss +0 -17
  155. package/src/components/PasswordInput/PasswordInput.tsx +0 -154
  156. package/src/components/PasswordInput/index.tsx +0 -2
  157. package/src/components/PingPongText/PingPongText.module.scss +0 -4
  158. package/src/components/PingPongText/PingPongText.tsx +0 -83
  159. package/src/components/PingPongText/index.tsx +0 -2
  160. package/src/components/PixelatedScan/PixelatedScan.module.scss +0 -86
  161. package/src/components/PixelatedScan/PixelatedScan.tsx +0 -175
  162. package/src/components/PixelatedScan/index.tsx +0 -2
  163. package/src/components/Portal/Portal.module.scss +0 -3
  164. package/src/components/Portal/Portal.tsx +0 -68
  165. package/src/components/Portal/index.tsx +0 -2
  166. package/src/components/ProgressBar/ProgressBar.module.scss +0 -44
  167. package/src/components/ProgressBar/ProgressBar.tsx +0 -124
  168. package/src/components/ProgressBar/index.tsx +0 -2
  169. package/src/components/ProgressTexts/ProgressTexts.module.scss +0 -37
  170. package/src/components/ProgressTexts/ProgressTexts.tsx +0 -85
  171. package/src/components/ProgressTexts/index.tsx +0 -2
  172. package/src/components/Radio/Radio.module.scss +0 -36
  173. package/src/components/Radio/Radio.tsx +0 -53
  174. package/src/components/Radio/index.tsx +0 -2
  175. package/src/components/SectionContainer/SectionContainer.module.scss +0 -30
  176. package/src/components/SectionContainer/SectionContainer.tsx +0 -49
  177. package/src/components/SectionContainer/index.tsx +0 -2
  178. package/src/components/Select/Select.module.scss +0 -58
  179. package/src/components/Select/Select.tsx +0 -192
  180. package/src/components/Select/index.tsx +0 -2
  181. package/src/components/Skeleton/Skeleton.module.scss +0 -21
  182. package/src/components/Skeleton/Skeleton.tsx +0 -29
  183. package/src/components/Skeleton/index.tsx +0 -2
  184. package/src/components/Spacing/Spacing.module.scss +0 -13
  185. package/src/components/Spacing/Spacing.tsx +0 -24
  186. package/src/components/Spacing/index.tsx +0 -2
  187. package/src/components/StaticScroller/StaticScroller.module.scss +0 -14
  188. package/src/components/StaticScroller/StaticScroller.tsx +0 -83
  189. package/src/components/StaticScroller/index.tsx +0 -2
  190. package/src/components/Switch/Switch.module.scss +0 -43
  191. package/src/components/Switch/Switch.tsx +0 -41
  192. package/src/components/Switch/index.tsx +0 -2
  193. package/src/components/Table/Table.module.scss +0 -76
  194. package/src/components/Table/Table.tsx +0 -152
  195. package/src/components/Table/index.tsx +0 -2
  196. package/src/components/Tabs/Tabs.module.scss +0 -40
  197. package/src/components/Tabs/Tabs.tsx +0 -104
  198. package/src/components/Tabs/index.tsx +0 -2
  199. package/src/components/Text/Text.module.scss +0 -81
  200. package/src/components/Text/Text.tsx +0 -42
  201. package/src/components/Text/index.tsx +0 -2
  202. package/src/components/Transition/MasksFactory/DiagonalReveal.tsx +0 -47
  203. package/src/components/Transition/MasksFactory/DiagonalSquareToBalls.tsx +0 -78
  204. package/src/components/Transition/MasksFactory/PhysicsSquares.tsx +0 -106
  205. package/src/components/Transition/MasksFactory/SquareToBalls.tsx +0 -66
  206. package/src/components/Transition/MasksFactory/utils.ts +0 -35
  207. package/src/components/Transition/Transition.module.scss +0 -211
  208. package/src/components/Transition/Transition.tsx +0 -495
  209. package/src/components/Transition/index.tsx +0 -2
  210. package/src/components/UncontrolledTransition/UncontrolledTransition.ai.md +0 -9
  211. package/src/components/UncontrolledTransition/UncontrolledTransition.sample.tsx +0 -34
  212. package/src/components/UncontrolledTransition/UncontrolledTransition.tsx +0 -143
  213. package/src/components/UncontrolledTransition/index.tsx +0 -2
  214. package/src/components/WalletConnectionWrapper/WalletConnectionWrapper.tsx +0 -212
  215. package/src/components/WalletConnectionWrapper/index.tsx +0 -2
  216. package/src/components/utilitary/ScrollAndFocusLock/ScrollAndFocusLock.module.scss +0 -5
  217. package/src/components/utilitary/ScrollAndFocusLock/ScrollAndFocusLock.tsx +0 -52
  218. package/src/components/utilitary/ScrollAndFocusLock/index.tsx +0 -2
  219. package/src/context/AsyncProcess.tsx +0 -107
  220. package/src/context/ContextAsyncControl.tsx +0 -89
  221. package/src/context/CustomBrowserRouter.tsx +0 -55
  222. package/src/context/OneUIProvider.tsx +0 -308
  223. package/src/hooks/logs/useDependencyChangeDetection.ts +0 -25
  224. package/src/hooks/logs/useIsMounting.ts +0 -7
  225. package/src/hooks/persistence/useLocalStorage.ts +0 -45
  226. package/src/hooks/shims/ObjectWatchShim.ts +0 -56
  227. package/src/hooks/ui/useAdaptiveImage.tsx +0 -36
  228. package/src/hooks/ui/useAlternating.tsx +0 -22
  229. package/src/hooks/ui/useBreakpoint.tsx +0 -21
  230. package/src/hooks/ui/useCustomScrollbar.module.scss +0 -20
  231. package/src/hooks/ui/useCustomScrollbar.tsx +0 -22
  232. package/src/hooks/ui/useEffectIf.ts +0 -11
  233. package/src/hooks/ui/useMouseHover.tsx +0 -26
  234. package/src/hooks/ui/usePaginationControls.module.scss +0 -16
  235. package/src/hooks/ui/usePaginationControls.tsx +0 -176
  236. package/src/hooks/ui/useSnapToViewport.module.scss +0 -6
  237. package/src/hooks/ui/useSnapToViewport.ts +0 -28
  238. package/src/hooks/ui/useTilt.tsx +0 -219
  239. package/src/hooks/ui/useZoomable.module.scss +0 -34
  240. package/src/hooks/ui/useZoomable.tsx +0 -144
  241. package/src/hooks/useAsyncControl.ai.md +0 -25
  242. package/src/hooks/useAsyncControl.ts +0 -101
  243. package/src/hooks/useContainedRepositioning.ts +0 -110
  244. package/src/hooks/useCustomHistory.ts +0 -14
  245. package/src/hooks/useElementFit.ts +0 -82
  246. package/src/hooks/useFirestoreWatch.ts +0 -54
  247. package/src/hooks/useForm.ts +0 -49
  248. package/src/hooks/useFreeze.ts +0 -12
  249. package/src/hooks/useHero.module.scss +0 -41
  250. package/src/hooks/useHero.ts +0 -514
  251. package/src/hooks/useIntersection.ts +0 -32
  252. package/src/hooks/useMergeRefs.ts +0 -29
  253. package/src/hooks/useObserve.ts +0 -24
  254. package/src/hooks/usePagination.ts +0 -228
  255. package/src/hooks/usePooledOperation.ts +0 -54
  256. package/src/hooks/usePooling.ts +0 -46
  257. package/src/hooks/useRebound.ts +0 -23
  258. package/src/hooks/useShortIntl.ai.md +0 -5
  259. package/src/hooks/useShortIntl.ts +0 -97
  260. package/src/hooks/utility/useAsyncMemo.ts +0 -43
  261. package/src/hooks/utility/useDepChange.ts +0 -11
  262. package/src/hooks/utility/useEvents.ts +0 -33
  263. package/src/hooks/utility/useImmediate.ts +0 -8
  264. package/src/hooks/utility/useManualInit.ts +0 -24
  265. package/src/hooks/utility/useModule.ts +0 -15
  266. package/src/hooks/utility/useQuery.ts +0 -15
  267. package/src/hooks/utility/useUniqueEffect.ts +0 -22
  268. package/src/index.preprocess.ts +0 -82
  269. package/src/index.ts +0 -229
  270. package/src/models/DebugLogger.ts +0 -7
  271. package/src/models/GenericContract.ts +0 -169
  272. package/src/models/Orbs.ts +0 -97
  273. package/src/reac-app-env.d.ts +0 -6
  274. package/src/storybook/assets/video/txt-reversed.mp4 +0 -0
  275. package/src/storybookUtils/index.tsx +0 -53
  276. package/src/test.tsx +0 -0
  277. package/src/type-utils.ts +0 -49
  278. package/src/types.ts +0 -199
  279. package/src/utility.d.ts +0 -70
  280. package/src/utils/blockchain.ts +0 -43
  281. package/src/utils/e2e.ts +0 -55
  282. package/src/utils/flatten.ts +0 -17
  283. package/src/utils/formatters.ts +0 -36
  284. package/src/utils/html.utils.ts +0 -3
  285. package/src/utils/ownEvent.ts +0 -8
  286. package/src/utils/test.ts +0 -20
@@ -7,4 +7,4 @@ export default function Switch({ enabled, onToggle, size, disabled, ...props }:
7
7
  onToggle: (newState: boolean) => void;
8
8
  size: number;
9
9
  disabled?: boolean;
10
- } & Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">): import("react/jsx-runtime").JSX.Element;
10
+ } & Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref" | "onToggle">): import("react/jsx-runtime").JSX.Element;
@@ -35,4 +35,4 @@ function Switch(_ref) {
35
35
  type: "checkbox"
36
36
  })));
37
37
  }
38
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfcmVhY3QiLCJfaW50ZXJvcFJlcXVpcmVEZWZhdWx0IiwicmVxdWlyZSIsIl9Td2l0Y2hNb2R1bGUiLCJfZXhjbHVkZWQiLCJlIiwiX19lc01vZHVsZSIsImRlZmF1bHQiLCJfZXh0ZW5kcyIsIk9iamVjdCIsImFzc2lnbiIsImJpbmQiLCJuIiwiYXJndW1lbnRzIiwibGVuZ3RoIiwidCIsInIiLCJoYXNPd25Qcm9wZXJ0eSIsImNhbGwiLCJhcHBseSIsIl9vYmplY3RXaXRob3V0UHJvcGVydGllcyIsIm8iLCJpIiwiX29iamVjdFdpdGhvdXRQcm9wZXJ0aWVzTG9vc2UiLCJnZXRPd25Qcm9wZXJ0eVN5bWJvbHMiLCJpbmRleE9mIiwicHJvcGVydHlJc0VudW1lcmFibGUiLCJTd2l0Y2giLCJfcmVmIiwiZW5hYmxlZCIsIm9uVG9nZ2xlIiwic2l6ZSIsImRpc2FibGVkIiwicHJvcHMiLCJjcmVhdGVFbGVtZW50IiwiRnJhZ21lbnQiLCJzdHlsZSIsImZvbnRTaXplIiwiY29uY2F0IiwiY2xhc3NOYW1lIiwiU3R5bGVzIiwicm9vdCIsIm9uIiwib25DbGljayIsInRvZ2dsZXIiLCJjaGVja2VkIiwidHlwZSJdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2gudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwge1xuICBDb21wb25lbnRQcm9wcyxcbiAgRGV0YWlsZWRIVE1MUHJvcHMsXG4gIEhUTUxBdHRyaWJ1dGVzLFxufSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBTdHlsZXMgZnJvbSBcIi4vU3dpdGNoLm1vZHVsZS5zY3NzXCI7XG5cbi8qKlxuICogU3dpdGNocyBiZXR3ZWVuIHN0YXRlc1xuICoqL1xuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gU3dpdGNoKHtcbiAgZW5hYmxlZCxcbiAgb25Ub2dnbGUsXG4gIHNpemUsXG4gIGRpc2FibGVkLFxuICAuLi5wcm9wc1xufToge1xuICBlbmFibGVkOiBib29sZWFuO1xuICBvblRvZ2dsZTogKG5ld1N0YXRlOiBib29sZWFuKSA9PiB2b2lkO1xuICBzaXplOiBudW1iZXI7XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbn0gJiBPbWl0PFxuICBEZXRhaWxlZEhUTUxQcm9wczxIVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4sIEhUTUxEaXZFbGVtZW50PixcbiAgXCJyZWZcIlxuPikge1xuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2XG4gICAgICAgIHN0eWxlPXt7IGZvbnRTaXplOiBgJHtzaXplfXB4YCB9fVxuICAgICAgICBjbGFzc05hbWU9e2Ake1N0eWxlcy5yb290fSAke2VuYWJsZWQgPyBTdHlsZXMub24gOiBcIlwifSAke1xuICAgICAgICAgIGRpc2FibGVkID8gU3R5bGVzLmRpc2FibGVkIDogXCJcIlxuICAgICAgICB9YH1cbiAgICAgICAgb25DbGljaz17KCkgPT4gb25Ub2dnbGUoIWVuYWJsZWQpfVxuICAgICAgICB7Li4ucHJvcHN9XG4gICAgICA+XG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPXtTdHlsZXMudG9nZ2xlcn0gLz5cbiAgICAgICAgPGlucHV0IGNoZWNrZWQ9e2VuYWJsZWR9IHR5cGU9XCJjaGVja2JveFwiIC8+XG4gICAgICA8L2Rpdj5cbiAgICA8Lz5cbiAgKTtcbn1cbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsSUFBQUEsTUFBQSxHQUFBQyxzQkFBQSxDQUFBQyxPQUFBO0FBS0EsSUFBQUMsYUFBQSxHQUFBRixzQkFBQSxDQUFBQyxPQUFBO0FBQTBDLE1BQUFFLFNBQUE7QUFBQSxTQUFBSCx1QkFBQUksQ0FBQSxXQUFBQSxDQUFBLElBQUFBLENBQUEsQ0FBQUMsVUFBQSxHQUFBRCxDQUFBLEtBQUFFLE9BQUEsRUFBQUYsQ0FBQTtBQUFBLFNBQUFHLFNBQUEsV0FBQUEsUUFBQSxHQUFBQyxNQUFBLENBQUFDLE1BQUEsR0FBQUQsTUFBQSxDQUFBQyxNQUFBLENBQUFDLElBQUEsZUFBQUMsQ0FBQSxhQUFB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
38
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfcmVhY3QiLCJfaW50ZXJvcFJlcXVpcmVEZWZhdWx0IiwicmVxdWlyZSIsIl9Td2l0Y2hNb2R1bGUiLCJfZXhjbHVkZWQiLCJlIiwiX19lc01vZHVsZSIsImRlZmF1bHQiLCJfZXh0ZW5kcyIsIk9iamVjdCIsImFzc2lnbiIsImJpbmQiLCJuIiwiYXJndW1lbnRzIiwibGVuZ3RoIiwidCIsInIiLCJoYXNPd25Qcm9wZXJ0eSIsImNhbGwiLCJhcHBseSIsIl9vYmplY3RXaXRob3V0UHJvcGVydGllcyIsIm8iLCJpIiwiX29iamVjdFdpdGhvdXRQcm9wZXJ0aWVzTG9vc2UiLCJnZXRPd25Qcm9wZXJ0eVN5bWJvbHMiLCJpbmRleE9mIiwicHJvcGVydHlJc0VudW1lcmFibGUiLCJTd2l0Y2giLCJfcmVmIiwiZW5hYmxlZCIsIm9uVG9nZ2xlIiwic2l6ZSIsImRpc2FibGVkIiwicHJvcHMiLCJjcmVhdGVFbGVtZW50IiwiRnJhZ21lbnQiLCJzdHlsZSIsImZvbnRTaXplIiwiY29uY2F0IiwiY2xhc3NOYW1lIiwiU3R5bGVzIiwicm9vdCIsIm9uIiwib25DbGljayIsInRvZ2dsZXIiLCJjaGVja2VkIiwidHlwZSJdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2gudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwge1xuICBDb21wb25lbnRQcm9wcyxcbiAgRGV0YWlsZWRIVE1MUHJvcHMsXG4gIEhUTUxBdHRyaWJ1dGVzLFxufSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBTdHlsZXMgZnJvbSBcIi4vU3dpdGNoLm1vZHVsZS5zY3NzXCI7XG5cbi8qKlxuICogU3dpdGNocyBiZXR3ZWVuIHN0YXRlc1xuICoqL1xuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gU3dpdGNoKHtcbiAgZW5hYmxlZCxcbiAgb25Ub2dnbGUsXG4gIHNpemUsXG4gIGRpc2FibGVkLFxuICAuLi5wcm9wc1xufToge1xuICBlbmFibGVkOiBib29sZWFuO1xuICBvblRvZ2dsZTogKG5ld1N0YXRlOiBib29sZWFuKSA9PiB2b2lkO1xuICBzaXplOiBudW1iZXI7XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbn0gJiBPbWl0PFxuICBEZXRhaWxlZEhUTUxQcm9wczxIVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4sIEhUTUxEaXZFbGVtZW50PixcbiAgXCJyZWZcIiB8IFwib25Ub2dnbGVcIlxuPikge1xuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2XG4gICAgICAgIHN0eWxlPXt7IGZvbnRTaXplOiBgJHtzaXplfXB4YCB9fVxuICAgICAgICBjbGFzc05hbWU9e2Ake1N0eWxlcy5yb290fSAke2VuYWJsZWQgPyBTdHlsZXMub24gOiBcIlwifSAke1xuICAgICAgICAgIGRpc2FibGVkID8gU3R5bGVzLmRpc2FibGVkIDogXCJcIlxuICAgICAgICB9YH1cbiAgICAgICAgb25DbGljaz17KCkgPT4gb25Ub2dnbGUoIWVuYWJsZWQpfVxuICAgICAgICB7Li4ucHJvcHN9XG4gICAgICA+XG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPXtTdHlsZXMudG9nZ2xlcn0gLz5cbiAgICAgICAgPGlucHV0IGNoZWNrZWQ9e2VuYWJsZWR9IHR5cGU9XCJjaGVja2JveFwiIC8+XG4gICAgICA8L2Rpdj5cbiAgICA8Lz5cbiAgKTtcbn1cbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsSUFBQUEsTUFBQSxHQUFBQyxzQkFBQSxDQUFBQyxPQUFBO0FBS0EsSUFBQUMsYUFBQSxHQUFBRixzQkFBQSxDQUFBQyxPQUFBO0FBQTBDLE1BQUFFLFNBQUE7QUFBQSxTQUFBSCx1QkFBQUksQ0FBQSxXQUFBQSxDQUFBLElBQUFBLENBQUEsQ0FBQUMsVUFBQSxHQUFBRCxDQUFBLEtBQUFFLE9BQUEsRUFBQUYsQ0FBQTtBQUFBLFNBQUFHLFNBQUEsV0FBQUEsUUFBQSxHQUFBQyxNQUFBLENBQUFDLE1BQUEsR0FBQUQsTUFBQSxDQUFBQyxNQUFBLENBQUFDLElBQUEsZUFBQUMsQ0FBQSxhQUFBUCxDQUFBLE1BQUFBLENBQUEsR0FBQVEsU0FBQSxDQUFBQyxNQUFBLEVBQUFULENBQUEsVUFBQVUsQ0FBQSxHQUFBRixTQUFBLENBQUFSLENBQUEsWUFBQVcsQ0FBQSxJQUFBRCxDQUFBLE9BQUFFLGNBQUEsQ0FBQUMsSUFBQSxDQUFBSCxDQUFBLEVBQUFDLENBQUEsTUFBQUosQ0FBQSxDQUFBSSxDQUFBLElBQUFELENBQUEsQ0FBQUMsQ0FBQSxhQUFBSixDQUFBLEtBQUFKLFFBQUEsQ0FBQVcsS0FBQSxPQUFBTixTQUFBO0FBQUEsU0FBQU8seUJBQUFmLENBQUEsRUFBQVUsQ0FBQSxnQkFBQVYsQ0FBQSxpQkFBQWdCLENBQUEsRUFBQUwsQ0FBQSxFQUFBTSxDQUFBLEdBQUFDLDZCQUFBLENBQUFsQixDQUFBLEVBQUFVLENBQUEsT0FBQU4sTUFBQSxDQUFBZSxxQkFBQSxRQUFBWixDQUFBLEdBQUFILE1BQUEsQ0FBQWUscUJBQUEsQ0FBQW5CLENBQUEsUUFBQVcsQ0FBQSxNQUFBQSxDQUFBLEdBQUFKLENBQUEsQ0FBQUUsTUFBQSxFQUFBRSxDQUFBLElBQUFLLENBQUEsR0FBQVQsQ0FBQSxDQUFBSSxDQUFBLFVBQUFELENBQUEsQ0FBQVUsT0FBQSxDQUFBSixDQUFBLFFBQUFLLG9CQUFBLENBQUFSLElBQUEsQ0FBQWIsQ0FBQSxFQUFBZ0IsQ0FBQSxNQUFBQyxDQUFBLENBQUFELENBQUEsSUFBQWhCLENBQUEsQ0FBQWdCLENBQUEsYUFBQUMsQ0FBQTtBQUFBLFNBQUFDLDhCQUFBUCxDQUFBLEVBQUFYLENBQUEsZ0JBQUFXLENBQUEsaUJBQUFELENBQUEsZ0JBQUFILENBQUEsSUFBQUksQ0FBQSxTQUFBQyxjQUFBLENBQUFDLElBQUEsQ0FBQUYsQ0FBQSxFQUFBSixDQUFBLGdCQUFBUCxDQUFBLENBQUFvQixPQUFBLENBQUFiLENBQUEsYUFBQUcsQ0FBQSxDQUFBSCxDQUFBLElBQUFJLENBQUEsQ0FBQUosQ0FBQSxZQUFBRyxDQUFBO0FBRTFDO0FBQ0E7QUFDQTtBQUNlLFNBQVNZLE1BQU1BLENBQUFDLElBQUEsRUFjM0I7RUFBQSxJQWQ0QjtNQUM3QkMsT0FBTztNQUNQQyxRQUFRO01BQ1JDLElBQUk7TUFDSkM7SUFVRixDQUFDLEdBQUFKLElBQUE7SUFUSUssS0FBSyxHQUFBYix3QkFBQSxDQUFBUSxJQUFBLEVBQUF4QixTQUFBO0VBVVIsb0JBQ0VKLE1BQUEsQ0FBQU8sT0FBQSxDQUFBMkIsYUFBQSxDQUFBbEMsTUFBQSxDQUFBTyxPQUFBLENBQUE0QixRQUFBLHFCQUNFbkMsTUFBQSxDQUFBTyxPQUFBLENBQUEyQixhQUFBLFFBQUExQixRQUFBO0lBQ0U0QixLQUFLLEVBQUU7TUFBRUMsUUFBUSxLQUFBQyxNQUFBLENBQUtQLElBQUk7SUFBSyxDQUFFO0lBQ2pDUSxTQUFTLEtBQUFELE1BQUEsQ0FBS0UscUJBQU0sQ0FBQ0MsSUFBSSxPQUFBSCxNQUFBLENBQUlULE9BQU8sR0FBR1cscUJBQU0sQ0FBQ0UsRUFBRSxHQUFHLEVBQUUsT0FBQUosTUFBQSxDQUNuRE4sUUFBUSxHQUFHUSxxQkFBTSxDQUFDUixRQUFRLEdBQUcsRUFBRSxDQUM5QjtJQUNIVyxPQUFPLEVBQUVBLENBQUEsS0FBTWIsUUFBUSxDQUFDLENBQUNELE9BQU87RUFBRSxHQUM5QkksS0FBSyxnQkFFVGpDLE1BQUEsQ0FBQU8sT0FBQSxDQUFBMkIsYUFBQTtJQUFLSyxTQUFTLEVBQUVDLHFCQUFNLENBQUNJO0VBQVEsQ0FBRSxDQUFDLGVBQ2xDNUMsTUFBQSxDQUFBTyxPQUFBLENBQUEyQixhQUFBO0lBQU9XLE9BQU8sRUFBRWhCLE9BQVE7SUFBQ2lCLElBQUksRUFBQztFQUFVLENBQUUsQ0FDdkMsQ0FDTCxDQUFDO0FBRVAiLCJpZ25vcmVMaXN0IjpbXX0=
@@ -7,4 +7,4 @@ export default function Switch({ enabled, onToggle, size, disabled, ...props }:
7
7
  onToggle: (newState: boolean) => void;
8
8
  size: number;
9
9
  disabled?: boolean;
10
- } & Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">): import("react/jsx-runtime").JSX.Element;
10
+ } & Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref" | "onToggle">): import("react/jsx-runtime").JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onepercentio/one-ui",
3
- "version": "0.29.4",
3
+ "version": "0.29.5",
4
4
  "description": "A set of reusable components created through the development of Onepercent projects",
5
5
  "repository": "git@github.com:onepercentio/one-ui.git",
6
6
  "author": "Murilo Oliveira de Araujo <murilo.araujo@onepercent.io>",
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="-7 -7 38 38">
2
- <path style="stroke: #EDEDED" stroke-linecap="round" stroke-miterlimit="10" stroke-width="3px" fill="none" d="M22.9 3.7l-15.2 16.6-6.6-7.1" />
3
- </svg>
@@ -1,2 +0,0 @@
1
- @import "./variables.scss";
2
- @import "./mixins.scss";
@@ -1,12 +0,0 @@
1
- @mixin iteractibleElement() {
2
- & {
3
- cursor: pointer;
4
- transition: transform $fast;
5
- }
6
- &:hover {
7
- transform: scale(1.2);
8
- }
9
- &:active {
10
- transform: scale(1.1);
11
- }
12
- }
@@ -1,49 +0,0 @@
1
- $digitalBlue: var(--digital-blue, #558eff);
2
- $mediumGray: var(--medium-gray, #bababa);
3
- $lightGray: var(--light-gray, #d6d6d6);
4
- $spaceBlue: var(--space-blue, #0f113a);
5
- $warningRed: var(--warning-red, #e84b4b);
6
- $sunsetPink: var(--sunset-pink, #ff3e7d);
7
- $darkestGray: var(--darkest-gray, #727272);
8
- $gray: var(--gray, #0f113a);
9
- $success: var(--success, lightgreen);
10
- $successDark: var(--success-dark, green);
11
- $mainBackgroundColor: var(--bg-color, white);
12
- $primaryColor: var(--primary-color, var(--digital-blue));
13
- $elevation: var(--card-elevation, 0px 4px 10px rgba(0, 0, 0, 0.1));
14
-
15
- $mainFontFamily: var(--main-font, Roboto);
16
- $secondaryFontFamily: var(--second-font, Manrope);
17
-
18
- $headerFillBackgroundColor: var(--header-background-color, $digitalBlue);
19
- $headerBackgroundColor: var(--header-divider-bg-color, #467eea);
20
- $headerTextColor: var(--header-text-color, #94b8ff);
21
- $headerBrightColor: var(--header-bright-color, white);
22
-
23
- $tableRowBgColor: var(--table-row-bg-color, white);
24
- $tableRowBorderColor: var(--table-row-border-color, #bec1ca);
25
-
26
- $buttonBorderRadius: var(--button-border-radius, 8px);
27
- $buttonTextColor: var(--button-text-color, white);
28
-
29
- $tooltipBackgroudColor: var(--tooltip-background-color, $digitalBlue);
30
-
31
- $checkboxBaseColor: var(--checkbox-base-color, $digitalBlue);
32
-
33
- $textDefaultColor: var(--text-default-color, $digitalBlue);
34
-
35
- $buttonPrimaryBackgroundColor: var(--button-primary-bg-color, #1e22aa);
36
-
37
- $fileInputBackgroundColor: var(--file-input-bg-color, #f2f6f7);
38
- $fileInputBorderColor: var(--file-input-border-color, #dce1e8);
39
-
40
- $avatarBackgroundColor: var(--avatar-bg-color, $lightGray);
41
-
42
- $pixelatedGuideBackground: var(--pixelated-scan-bg, var(--digital-blue));
43
-
44
- $almostInstant: var(--animation--speed-almostInstant, 50ms);
45
- $veryFast: var(--animation--speed-veryfast, 125ms);
46
- $fast: var(--animation--speed-fast, 250ms);
47
- $normal: var(--animation--speed-normal, 500ms);
48
- $slow: var(--animation--speed-slow, 1s);
49
- $verySlow: var(--animation--speed-veryslow, 2s);
@@ -1,7 +0,0 @@
1
- .resetButton {
2
- min-width: 0px !important;
3
- white-space: nowrap;
4
- display: flex;
5
- align-items: center;
6
- text-align: center;
7
- }
@@ -1,26 +0,0 @@
1
- import React, { ComponentProps, ReactElement } from "react";
2
- import AdaptiveContainer from "../AdaptiveContainer";
3
- import Button from "../Button";
4
- import Styles from "./AdaptiveButton.module.scss";
5
-
6
- /**
7
- * A button that adapts it's width according to the content size
8
- **/
9
- export default function AdaptiveButton({
10
- children,
11
- className = "",
12
- ...buttonProps
13
- }: {
14
- children: ReactElement;
15
- } & ComponentProps<typeof Button>) {
16
- return (
17
- <AdaptiveContainer
18
- containerElement={Button}
19
- className={`${Styles.resetButton} ${className}`}
20
- direction="both"
21
- {...buttonProps}
22
- >
23
- {children}
24
- </AdaptiveContainer>
25
- );
26
- }
@@ -1,2 +0,0 @@
1
- export { default } from "./AdaptiveButton";
2
- export * from "./AdaptiveButton";
@@ -1,53 +0,0 @@
1
- .resetSection {
2
- min-height: 0px;
3
- transition: width var(--adaptive-container-transition-time, 400ms) linear,
4
- height var(--adaptive-container-transition-time, 400ms) linear,
5
- min-height var(--adaptive-container-transition-time, 400ms) linear;
6
- transition-timing-function: linear;
7
- overflow: hidden;
8
- align-items: flex-start;
9
- &.h,&.both {
10
- > * {
11
- min-width: auto !important;
12
- }
13
- }
14
- &.v,&.both {
15
- > * {
16
- min-height: initial;
17
- }
18
- }
19
- }
20
-
21
- @keyframes fadeInDelayed {
22
- 0% {
23
- opacity: 0;
24
- }
25
- 50% {
26
- opacity: 0.1;
27
- }
28
- 100% {
29
- opacity: 1;
30
- }
31
- }
32
- @keyframes fadeOutDelayed {
33
- 0% {
34
- opacity: 1;
35
- }
36
- 50% {
37
- opacity: 0.1;
38
- }
39
- 100% {
40
- opacity: 0;
41
- }
42
- }
43
-
44
- .fadeInDelayed {
45
- animation-name: fadeInDelayed;
46
- animation-duration: 500ms !important;
47
- }
48
-
49
- .fadeOutAbsolute {
50
- position: absolute;
51
- animation-name: fadeOutDelayed;
52
- animation-duration: 500ms !important;
53
- }
@@ -1,200 +0,0 @@
1
- import React, {
2
- ComponentProps,
3
- ElementRef,
4
- FunctionComponent,
5
- HTMLAttributes,
6
- HTMLProps,
7
- JSX,
8
- ReactElement,
9
- useEffect,
10
- useMemo,
11
- useRef,
12
- } from "react";
13
- import { TransitionAnimationTypes } from "../Transition";
14
- import UncontrolledTransition from "../UncontrolledTransition";
15
- import Styles from "./AdaptiveContainer.module.scss";
16
-
17
- /**
18
- * A container that animates width changes across content updates
19
- **/
20
- export default function AdaptiveContainer<
21
- E extends keyof JSX.IntrinsicElements | FunctionComponent
22
- >({
23
- children,
24
- className = "",
25
- containerElement: _Wrapper = "div" as any,
26
- direction = "h",
27
- strict = true,
28
- ...otherProps
29
- }: {
30
- containerElement?: E;
31
- children: ReactElement;
32
- /**
33
- * The direction in which the content will be resized
34
- *
35
- * "h" // When the content will change in width
36
- * "v" // When the content will change in height
37
- */
38
- direction?: "h" | "v" | "both";
39
- className?: string;
40
- contentClassName?: string;
41
- /**
42
- * true: It will animate restricting to the height when it was rendered
43
- * false: It will animate trying to reach the height when it was rendered, growing in size if the content inside it changes */
44
- strict?: boolean;
45
- } & ComponentProps<E>) {
46
- const animatedProperty = useMemo(() => {
47
- if (!strict && direction !== "v")
48
- throw new Error(
49
- `Strict false only works with direction "v" at the moment`
50
- );
51
- switch (direction) {
52
- case "both":
53
- return ["width", "height"] as const
54
- case "h":
55
- return ("width" as const);
56
- case "v":
57
- return strict ? ("height" as const) : ("minHeight" as const);
58
- }
59
- }, [direction, strict]);
60
- const uncontrolledRef =
61
- useRef<ElementRef<typeof UncontrolledTransition>>(null);
62
- const buttonRef = useRef<HTMLElement>(null);
63
-
64
- useEffect(() => {
65
- const transitionContainer = uncontrolledRef.current!.sectionRef.current;
66
- if (transitionContainer)
67
- if (direction === "both") {
68
- transitionContainer.style.width = `${transitionContainer.clientWidth}px`;
69
- transitionContainer.style.height = `${transitionContainer.clientHeight}px`;
70
- } else if (direction === "h") {
71
- transitionContainer.style.width = `${transitionContainer.clientWidth}px`;
72
- transitionContainer.style[animatedProperty as "width"] = ``;
73
- } else {
74
- transitionContainer.style[
75
- animatedProperty as "height"
76
- ] = `${transitionContainer.clientHeight}px`;
77
- transitionContainer.style.width = ``;
78
- }
79
- const t = setTimeout(() => {
80
- if (uncontrolledRef.current) {
81
- const transitionContainer = uncontrolledRef.current.sectionRef.current;
82
- if (transitionContainer) {
83
- const screenThatWillEnter =
84
- transitionContainer.lastChild as HTMLDivElement;
85
-
86
- if (screenThatWillEnter) {
87
- function resetFactory(
88
- param: "minHeight" | "height" | "width",
89
- target: number
90
- ) {
91
- const resetPropertyInstance = (e: Pick<TransitionEvent, "propertyName">) => {
92
- if (e.propertyName !== param) return;
93
- setTimeout(() => {
94
- if (transitionContainer?.style[param] === `${target}px`) {
95
- transitionContainer!.style[param] = "";
96
- }
97
- }, 100);
98
-
99
- if (transitionContainer)
100
- transitionContainer.removeEventListener(
101
- "transitionend",
102
- resetPropertyInstance
103
- );
104
- };
105
- return resetPropertyInstance;
106
- }
107
- if (direction === "both") {
108
- const contentSize = {
109
- width: screenThatWillEnter.clientWidth,
110
- height: screenThatWillEnter.scrollHeight
111
- };
112
-
113
- const targetSize = {
114
- width: `${contentSize.width}px`,
115
- height: `${contentSize.height}px`
116
- };
117
-
118
- const prevSize = {
119
- width: transitionContainer.style.width,
120
- height: transitionContainer.style.height
121
- };
122
-
123
- transitionContainer.style.width = targetSize.width;
124
- transitionContainer.style.height = targetSize.height;
125
-
126
- if (Array.isArray(animatedProperty))
127
- for (let prop of animatedProperty as ('width' | 'height')[]) {
128
- const resetProperty = resetFactory(
129
- prop,
130
- contentSize[prop]
131
- );
132
- if (targetSize[prop] === prevSize[prop])
133
- resetProperty({ propertyName: prop });
134
- else
135
- transitionContainer.addEventListener(
136
- "transitionend",
137
- resetProperty
138
- );
139
- }
140
- } else if (direction === "h") {
141
- const contentWidth = screenThatWillEnter.clientWidth;
142
- const targetWidth = `${contentWidth}px`;
143
- const prevWidth = transitionContainer.style.width;
144
- transitionContainer.style.width = targetWidth;
145
- const func = resetFactory("width", contentWidth);
146
- if (targetWidth === prevWidth) func({ propertyName: "width" });
147
- else transitionContainer.addEventListener("transitionend", func);
148
- } else {
149
- const _animatedProperty = animatedProperty as "width"
150
- const contentHeight = screenThatWillEnter.scrollHeight;
151
- const targetHeight = `${contentHeight}px`;
152
- const prevHeight = transitionContainer.style[_animatedProperty];
153
- transitionContainer.style[_animatedProperty] = targetHeight;
154
- const resetProperty = resetFactory(
155
- _animatedProperty,
156
- contentHeight
157
- );
158
- if (targetHeight === prevHeight)
159
- resetProperty({ propertyName: _animatedProperty });
160
- else
161
- transitionContainer.addEventListener(
162
- "transitionend",
163
- resetProperty
164
- );
165
- }
166
- }
167
- }
168
- }
169
- }, 100);
170
- return () => clearTimeout(t);
171
- }, [children.key, direction]);
172
- const Wrapper = _Wrapper as any;
173
- const directionClass = direction in Styles ? Styles[direction] : "";
174
-
175
- return (
176
- <>
177
- <Wrapper className={`${className}`} ref={buttonRef} {...otherProps}>
178
- <UncontrolledTransition
179
- ref={uncontrolledRef}
180
- transitionType={TransitionAnimationTypes.CUSTOM}
181
- lockTransitionWidth={false}
182
- config={{
183
- backward: {
184
- elementExiting: Styles.fadeOutAbsolute,
185
- elementEntering: Styles.fadeInDelayed,
186
- },
187
- forward: {
188
- elementExiting: Styles.fadeOutAbsolute,
189
- elementEntering: Styles.fadeInDelayed,
190
- },
191
- }}
192
- className={`${Styles.resetSection} ${directionClass}`}
193
- contentClassName={otherProps.contentClassName}
194
- >
195
- {children}
196
- </UncontrolledTransition>
197
- </Wrapper>
198
- </>
199
- );
200
- }
@@ -1,2 +0,0 @@
1
- export { default } from "./AdaptiveContainer";
2
- export * from "./AdaptiveContainer";
@@ -1,147 +0,0 @@
1
- @import "../../assets/styles/index.scss";
2
-
3
- .backdrop {
4
- position: fixed;
5
- top: 0px;
6
- left: 0px;
7
- right: 0px;
8
- bottom: 0px;
9
- display: flex;
10
- align-items: center;
11
- justify-content: center;
12
- z-index: 1000;
13
- transition: backdrop-filter $veryFast linear;
14
- backdrop-filter: var(--adaptive-dialog-backdrop-backdrop, initial);
15
- pointer-events: none;
16
-
17
- @media screen and (orientation: "portrait") {
18
- align-items: flex-end;
19
- }
20
- }
21
- .backdrop,
22
- .container {
23
- animation-duration: $fast;
24
- animation-fill-mode: forwards;
25
- }
26
-
27
- .open {
28
- &.backdrop {
29
- animation-name: backdropAppear;
30
- }
31
- .container {
32
- animation-name: reveal;
33
- }
34
- @media screen and (orientation: "portrait") {
35
- .container {
36
- animation-timing-function: ease-in-out;
37
- animation-name: slideUp;
38
- transform: translateY(100%);
39
- }
40
- }
41
- }
42
-
43
- .close {
44
- &.backdrop {
45
- animation-name: backdropDismiss;
46
- }
47
-
48
- .container {
49
- animation-name: dismiss;
50
- }
51
-
52
- @media screen and (orientation: "portrait") {
53
- .container {
54
- animation-name: slideDown;
55
- }
56
- }
57
- }
58
-
59
- .container {
60
- > .closeBtn {
61
- position: absolute;
62
- right: 16px;
63
- top: 16px;
64
- background: none;
65
- border: none;
66
- width: auto;
67
- height: auto;
68
- padding: 0px !important;
69
- }
70
- padding: 16px 32px;
71
- position: relative;
72
- width: 100%;
73
- max-width: 640px;
74
- background: $mainBackgroundColor;
75
- backdrop-filter: var(--adaptive-dialog-backdrop, initial);
76
- display: flex;
77
- align-items: center;
78
- justify-content: center;
79
- flex-direction: column;
80
- max-height: 90% !important;
81
- overscroll-behavior: contain;
82
- @media screen and (orientation: "portrait") {
83
- min-height: initial;
84
- align-items: flex-start;
85
- }
86
- }
87
-
88
- @keyframes backdropAppear {
89
- 0% {
90
- background-color: #0000;
91
- }
92
-
93
- 100% {
94
- background-color: #0005;
95
- }
96
- }
97
-
98
- @keyframes backdropDismiss {
99
- 0% {
100
- background-color: #0005;
101
- }
102
-
103
- 100% {
104
- background-color: #0000;
105
- }
106
- }
107
-
108
- @keyframes reveal {
109
- 0% {
110
- opacity: 0;
111
- }
112
- 100% {
113
- opacity: 1;
114
- }
115
- }
116
-
117
- @keyframes dismiss {
118
- 0% {
119
- opacity: 1;
120
- }
121
- 100% {
122
- opacity: 0;
123
- }
124
- }
125
-
126
- @keyframes slideUp {
127
- 0% {
128
- min-height: 0px;
129
- transform: translateY(100%);
130
- }
131
-
132
- 100% {
133
- min-height: 0px;
134
- transform: translateY(0%);
135
- }
136
- }
137
-
138
- @keyframes slideDown {
139
- 0% {
140
- transform: translateY(0%);
141
- }
142
-
143
- 100% {
144
- min-height: 0px;
145
- transform: translateY(100%);
146
- }
147
- }
@@ -1,97 +0,0 @@
1
- import React, { PropsWithChildren, useEffect, useRef, useState } from "react";
2
- import ReactDOM from "react-dom";
3
- import Styles from "./AdaptiveDialog.module.scss";
4
- import MutableHamburgerButton from "../MutableHamburgerButton";
5
- import ScrollAndFocusLock from "../utilitary/ScrollAndFocusLock";
6
- import { useOneUIConfig } from "../../context/OneUIProvider";
7
-
8
- /**
9
- * This component implements a generic drawer that displays it as a drawer on mobile and as a modal on desktop
10
- **/
11
- export default function AdaptiveDialog({
12
- variant = "default",
13
- onClose,
14
- open = false,
15
- className = "",
16
- onClickOut,
17
- children,
18
- onClosed,
19
- inline = false,
20
- }: PropsWithChildren<{
21
- variant?: OnepercentUtility.UIElements.AdaptiveDialogVariants;
22
- className?: string;
23
- open: boolean;
24
- onClose?: () => void;
25
- onClickOut?: () => void;
26
- onClosed?: () => void;
27
- /**
28
- * Indicates this rendering will write the html inside the current position on dom.
29
- * If omitted or false, it will render on the document body, to prevent style bleeding */
30
- inline?: boolean;
31
- }>) {
32
- const rootDivRef = useRef<HTMLDivElement>(null);
33
- const [isVisible, setIsVisible] = useState(open);
34
- const [expanded, setExpanded] = useState(false);
35
- const variantClass = useOneUIConfig(
36
- `component.adaptiveDialog.variant.${variant}`,
37
- ""
38
- );
39
-
40
- useEffect(() => {
41
- if (open) {
42
- setIsVisible(true);
43
- const toggleVisbility = (e: AnimationEvent) => {
44
- if (e.animationName === Styles.backdropDismiss) {
45
- onClosed?.();
46
- setIsVisible(false);
47
- (e.target! as HTMLDivElement).removeEventListener(
48
- "animationend",
49
- toggleVisbility
50
- );
51
- }
52
- };
53
- rootDivRef.current!.addEventListener("animationend", toggleVisbility);
54
- }
55
- }, [open]);
56
-
57
- const globalClassName = {
58
- backdrop: useOneUIConfig("component.adaptiveDialog.backdropClassName", ""),
59
- dialog: useOneUIConfig("component.adaptiveDialog.dialogClassName", ""),
60
- };
61
- const content = (
62
- <div
63
- ref={rootDivRef}
64
- className={`${Styles.backdrop} ${open ? Styles.open : Styles.close} ${
65
- expanded ? Styles.expanded : ""
66
- } ${globalClassName.backdrop} ${variantClass}`}
67
- onClick={onClickOut}
68
- onAnimationEnd={({ target, currentTarget }) => {
69
- if (target === currentTarget)
70
- (target as HTMLDivElement).style.pointerEvents = "initial";
71
- }}
72
- >
73
- <div
74
- className={`${Styles.container} ${className} ${globalClassName.dialog}`}
75
- onClick={(e) => e.stopPropagation()}
76
- >
77
- <ScrollAndFocusLock open={open}>
78
- {onClose && (
79
- <button className={Styles.closeBtn} onClick={onClose}>
80
- <MutableHamburgerButton state="closed" size={24} />
81
- </button>
82
- )}
83
- <div onClick={() => setExpanded((p) => !p)} />
84
- {children}
85
- </ScrollAndFocusLock>
86
- </div>
87
- </div>
88
- );
89
-
90
- return isVisible || open ? (
91
- inline ? (
92
- content
93
- ) : (
94
- <>{ReactDOM.createPortal(content, document.body)}</>
95
- )
96
- ) : null;
97
- }
@@ -1,2 +0,0 @@
1
- export { default } from "./AdaptiveDialog";
2
- export * from "./AdaptiveDialog";