@true-engineering/true-react-common-ui-kit 2.7.0 → 2.7.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 (312) hide show
  1. package/LICENSE +201 -201
  2. package/dist/components/Button/Button.d.ts +2 -1
  3. package/dist/components/FiltersPane/components/Filter/Filter.d.ts +1 -1
  4. package/dist/components/FiltersPane/components/FilterValueView/FilterValueView.d.ts +1 -1
  5. package/dist/components/FiltersPane/constants.d.ts +1 -1
  6. package/dist/components/FiltersPane/types.d.ts +1 -1
  7. package/dist/components/Flag/augment.d.ts +1 -1
  8. package/dist/components/Icon/complexIcons/augment.d.ts +1 -1
  9. package/dist/components/Icon/helpers.d.ts +1 -1
  10. package/dist/components/Icon/index.d.ts +1 -0
  11. package/dist/{helpers/snippets.d.ts → components/Icon/snippet.d.ts} +1 -1
  12. package/dist/components/Icon/types.d.ts +2 -1
  13. package/dist/components/Input/Input.d.ts +2 -1
  14. package/dist/components/ListItem/types.d.ts +1 -1
  15. package/dist/components/MultiSelect/components/MultiSelectInput/MultiSelectInput.d.ts +1 -1
  16. package/dist/components/NumberInput/helpers.d.ts +1 -1
  17. package/dist/components/PhoneInput/index.d.ts +0 -1
  18. package/dist/components/ScrollIntoViewIfNeeded/ScrollIntoViewIfNeeded.d.ts +1 -1
  19. package/dist/components/Select/Select.d.ts +2 -1
  20. package/dist/components/Tooltip/Tooltip.styles.d.ts +1 -1
  21. package/dist/constants/index.d.ts +1 -0
  22. package/dist/constants/phone-info.d.ts +2 -0
  23. package/dist/helpers/index.d.ts +0 -1
  24. package/dist/helpers/phone.d.ts +1 -1
  25. package/dist/index.d.ts +1 -1
  26. package/dist/true-react-common-ui-kit.js +24569 -24569
  27. package/dist/true-react-common-ui-kit.js.map +1 -1
  28. package/dist/true-react-common-ui-kit.umd.cjs +24569 -24569
  29. package/dist/true-react-common-ui-kit.umd.cjs.map +1 -1
  30. package/dist/types.d.ts +1 -3
  31. package/dist/vite-env.d.ts +1 -1
  32. package/package.json +94 -93
  33. package/src/components/AccountInfo/AccountInfo.stories.tsx +32 -32
  34. package/src/components/AccountInfo/AccountInfo.styles.ts +55 -55
  35. package/src/components/AccountInfo/AccountInfo.tsx +76 -76
  36. package/src/components/AccountInfo/constants.ts +1 -1
  37. package/src/components/AccountInfo/index.ts +2 -2
  38. package/src/components/AddButton/AddButton.stories.tsx +21 -21
  39. package/src/components/AddButton/AddButton.styles.ts +34 -34
  40. package/src/components/AddButton/AddButton.tsx +48 -48
  41. package/src/components/AddButton/index.ts +2 -2
  42. package/src/components/Button/Button.stories.tsx +56 -56
  43. package/src/components/Button/Button.styles.ts +196 -196
  44. package/src/components/Button/Button.tsx +154 -153
  45. package/src/components/Button/constants.ts +9 -9
  46. package/src/components/Button/index.ts +3 -3
  47. package/src/components/Button/types.ts +5 -5
  48. package/src/components/Checkbox/Checkbox.stories.tsx +32 -32
  49. package/src/components/Checkbox/Checkbox.styles.ts +62 -62
  50. package/src/components/Checkbox/Checkbox.tsx +105 -105
  51. package/src/components/Checkbox/index.ts +2 -2
  52. package/src/components/CloseButton/CloseButton.styles.ts +34 -34
  53. package/src/components/CloseButton/CloseButton.tsx +35 -35
  54. package/src/components/CloseButton/index.ts +2 -2
  55. package/src/components/Colors/Colors.stories.tsx +7 -7
  56. package/src/components/Colors/Colors.styles.ts +38 -38
  57. package/src/components/Colors/Colors.tsx +26 -26
  58. package/src/components/Colors/index.ts +2 -2
  59. package/src/components/CssBaseline/CssBaseline.styles.ts +15 -15
  60. package/src/components/CssBaseline/CssBaseline.tsx +15 -15
  61. package/src/components/CssBaseline/index.ts +2 -2
  62. package/src/components/DateInput/DateInput.stories.tsx +61 -61
  63. package/src/components/DateInput/DateInput.styles.ts +14 -14
  64. package/src/components/DateInput/DateInput.tsx +82 -82
  65. package/src/components/DateInput/constants.ts +2 -2
  66. package/src/components/DateInput/index.ts +3 -3
  67. package/src/components/DatePicker/DatePicker.stories.tsx +87 -87
  68. package/src/components/DatePicker/DatePicker.styles.ts +44 -44
  69. package/src/components/DatePicker/DatePicker.tsx +309 -309
  70. package/src/components/DatePicker/components/DatePickerHeader/DatePickerHeader.styles.ts +84 -84
  71. package/src/components/DatePicker/components/DatePickerHeader/DatePickerHeader.tsx +79 -79
  72. package/src/components/DatePicker/components/DatePickerHeader/index.ts +2 -2
  73. package/src/components/DatePicker/components/PopperContainer/PopperContainer.tsx +6 -6
  74. package/src/components/DatePicker/components/PopperContainer/index.ts +1 -1
  75. package/src/components/DatePicker/components/index.ts +2 -2
  76. package/src/components/DatePicker/constants.ts +6 -6
  77. package/src/components/DatePicker/helpers.ts +23 -23
  78. package/src/components/DatePicker/index.ts +4 -4
  79. package/src/components/DatePicker/types.ts +45 -45
  80. package/src/components/Description/Description.stories.tsx +27 -27
  81. package/src/components/Description/Description.styles.ts +31 -31
  82. package/src/components/Description/Description.tsx +59 -59
  83. package/src/components/Description/constants.ts +1 -1
  84. package/src/components/Description/index.ts +2 -2
  85. package/src/components/FiltersPane/FiltersPane.stories.tsx +295 -295
  86. package/src/components/FiltersPane/FiltersPane.styles.ts +71 -71
  87. package/src/components/FiltersPane/FiltersPane.tsx +150 -150
  88. package/src/components/FiltersPane/components/Filter/Filter.tsx +203 -203
  89. package/src/components/FiltersPane/components/Filter/index.ts +1 -1
  90. package/src/components/FiltersPane/components/FilterInterval/FilterInterval.styles.ts +64 -64
  91. package/src/components/FiltersPane/components/FilterInterval/FilterInterval.tsx +141 -141
  92. package/src/components/FiltersPane/components/FilterInterval/index.ts +2 -2
  93. package/src/components/FiltersPane/components/FilterMultiSelect/FilterMultiSelect.tsx +10 -10
  94. package/src/components/FiltersPane/components/FilterMultiSelect/index.ts +1 -1
  95. package/src/components/FiltersPane/components/FilterSelect/FilterSelect.styles.ts +143 -143
  96. package/src/components/FiltersPane/components/FilterSelect/FilterSelect.tsx +346 -346
  97. package/src/components/FiltersPane/components/FilterSelect/index.ts +2 -2
  98. package/src/components/FiltersPane/components/FilterValueView/FilterValueView.styles.tsx +15 -15
  99. package/src/components/FiltersPane/components/FilterValueView/FilterValueView.tsx +163 -163
  100. package/src/components/FiltersPane/components/FilterValueView/index.tsx +2 -2
  101. package/src/components/FiltersPane/components/FilterWithDates/FilterWithDates.styles.ts +60 -60
  102. package/src/components/FiltersPane/components/FilterWithDates/FilterWithDates.tsx +181 -181
  103. package/src/components/FiltersPane/components/FilterWithDates/index.ts +2 -2
  104. package/src/components/FiltersPane/components/FilterWithPeriod/FilterWithPeriod.styles.ts +17 -17
  105. package/src/components/FiltersPane/components/FilterWithPeriod/FilterWithPeriod.tsx +174 -174
  106. package/src/components/FiltersPane/components/FilterWithPeriod/index.ts +2 -2
  107. package/src/components/FiltersPane/components/FilterWrapper/FilterWrapper.styles.ts +110 -110
  108. package/src/components/FiltersPane/components/FilterWrapper/FilterWrapper.tsx +149 -149
  109. package/src/components/FiltersPane/components/FilterWrapper/index.ts +2 -2
  110. package/src/components/FiltersPane/components/FiltersPaneSearch/FiltersPaneSearch.styles.ts +109 -109
  111. package/src/components/FiltersPane/components/FiltersPaneSearch/FiltersPaneSearch.tsx +155 -155
  112. package/src/components/FiltersPane/components/FiltersPaneSearch/index.ts +2 -2
  113. package/src/components/FiltersPane/components/index.ts +9 -9
  114. package/src/components/FiltersPane/constants.ts +137 -137
  115. package/src/components/FiltersPane/helpers.ts +26 -26
  116. package/src/components/FiltersPane/index.ts +5 -5
  117. package/src/components/FiltersPane/types.ts +156 -156
  118. package/src/components/Flag/Flag.stories.tsx +29 -29
  119. package/src/components/Flag/Flag.styles.ts +18 -18
  120. package/src/components/Flag/Flag.tsx +27 -27
  121. package/src/components/Flag/augment.d.ts +1 -1
  122. package/src/components/Flag/index.ts +2 -2
  123. package/src/components/FlexibleTable/FlexibleTable.stories.tsx +338 -338
  124. package/src/components/FlexibleTable/FlexibleTable.styles.ts +131 -131
  125. package/src/components/FlexibleTable/FlexibleTable.tsx +205 -205
  126. package/src/components/FlexibleTable/components/TableRow/TableRow.tsx +152 -152
  127. package/src/components/FlexibleTable/components/TableRow/index.ts +1 -1
  128. package/src/components/FlexibleTable/components/TableValue/TableValue.tsx +74 -74
  129. package/src/components/FlexibleTable/components/TableValue/index.ts +1 -1
  130. package/src/components/FlexibleTable/components/index.ts +2 -2
  131. package/src/components/FlexibleTable/constants.ts +1 -1
  132. package/src/components/FlexibleTable/index.ts +3 -3
  133. package/src/components/FlexibleTable/types.ts +52 -52
  134. package/src/components/Icon/Icon.stories.tsx +86 -86
  135. package/src/components/Icon/Icon.styles.ts +10 -10
  136. package/src/components/Icon/Icon.tsx +27 -27
  137. package/src/components/Icon/complexIcons/augment.d.ts +1 -1
  138. package/src/components/Icon/complexIcons/avatarGreen.svg +57 -57
  139. package/src/components/Icon/complexIcons/icons.ts +5 -5
  140. package/src/components/Icon/complexIcons/index.ts +1 -1
  141. package/src/components/Icon/components/ComplexIconBoilerplate/ComplexIconBoilerplate.tsx +16 -16
  142. package/src/components/Icon/components/ComplexIconBoilerplate/index.ts +1 -1
  143. package/src/components/Icon/components/IconBolerplate/IconBoilerplate.tsx +43 -43
  144. package/src/components/Icon/components/IconBolerplate/index.ts +1 -1
  145. package/src/components/Icon/components/index.ts +2 -2
  146. package/src/components/Icon/{helpers.ts → helpers.tsx} +9 -9
  147. package/src/components/Icon/icons-list.ts +856 -856
  148. package/src/components/Icon/index.ts +5 -4
  149. package/src/{helpers/snippets.tsx → components/Icon/snippet.tsx} +6 -6
  150. package/src/components/Icon/types.ts +18 -16
  151. package/src/components/IncrementInput/IncrementInput.stories.tsx +31 -31
  152. package/src/components/IncrementInput/IncrementInput.styles.ts +77 -77
  153. package/src/components/IncrementInput/IncrementInput.tsx +80 -80
  154. package/src/components/IncrementInput/components/ChangeButton/ChangeButton.tsx +33 -33
  155. package/src/components/IncrementInput/components/ChangeButton/index.ts +1 -1
  156. package/src/components/IncrementInput/components/index.ts +1 -1
  157. package/src/components/IncrementInput/index.ts +2 -2
  158. package/src/components/Input/Input.stories.tsx +86 -86
  159. package/src/components/Input/Input.styles.ts +307 -307
  160. package/src/components/Input/Input.tsx +308 -308
  161. package/src/components/Input/constants.ts +1 -1
  162. package/src/components/Input/index.ts +3 -3
  163. package/src/components/Input/types.ts +6 -6
  164. package/src/components/List/List.stories.tsx +63 -63
  165. package/src/components/List/List.styles.ts +14 -14
  166. package/src/components/List/List.tsx +36 -36
  167. package/src/components/List/index.ts +2 -2
  168. package/src/components/ListItem/ListItem.stories.tsx +67 -67
  169. package/src/components/ListItem/ListItem.styles.ts +48 -48
  170. package/src/components/ListItem/ListItem.tsx +45 -44
  171. package/src/components/ListItem/constants.ts +5 -5
  172. package/src/components/ListItem/index.ts +3 -3
  173. package/src/components/ListItem/types.ts +19 -19
  174. package/src/components/Modal/Modal.stories.tsx +105 -105
  175. package/src/components/Modal/Modal.styles.ts +305 -305
  176. package/src/components/Modal/Modal.tsx +184 -184
  177. package/src/components/Modal/index.ts +3 -3
  178. package/src/components/Modal/types.ts +17 -17
  179. package/src/components/MoreMenu/MoreMenu.stories.tsx +46 -46
  180. package/src/components/MoreMenu/MoreMenu.styles.ts +70 -70
  181. package/src/components/MoreMenu/MoreMenu.tsx +90 -90
  182. package/src/components/MoreMenu/index.ts +2 -2
  183. package/src/components/MultiSelect/MultiSelect.stories.tsx +46 -46
  184. package/src/components/MultiSelect/MultiSelect.styles.ts +55 -55
  185. package/src/components/MultiSelect/MultiSelect.tsx +92 -92
  186. package/src/components/MultiSelect/components/MultiSelectInput/MultiSelectInput.styles.ts +73 -73
  187. package/src/components/MultiSelect/components/MultiSelectInput/MultiSelectInput.tsx +52 -51
  188. package/src/components/MultiSelect/components/MultiSelectInput/index.ts +2 -2
  189. package/src/components/MultiSelect/components/index.ts +1 -1
  190. package/src/components/MultiSelect/index.ts +4 -4
  191. package/src/components/MultiSelect/types.ts +1 -1
  192. package/src/components/MultiSelectList/MultiSelectList.styles.ts +124 -124
  193. package/src/components/MultiSelectList/MultiSelectList.tsx +441 -441
  194. package/src/components/MultiSelectList/constants.ts +21 -21
  195. package/src/components/MultiSelectList/helpers.ts +11 -11
  196. package/src/components/MultiSelectList/index.ts +3 -3
  197. package/src/components/MultiSelectList/types.ts +15 -15
  198. package/src/components/Notification/Notification.stories.tsx +46 -46
  199. package/src/components/Notification/Notification.styles.ts +50 -50
  200. package/src/components/Notification/Notification.tsx +78 -78
  201. package/src/components/Notification/index.ts +3 -3
  202. package/src/components/Notification/types.ts +1 -1
  203. package/src/components/NumberInput/NumberInput.stories.tsx +35 -35
  204. package/src/components/NumberInput/NumberInput.tsx +133 -133
  205. package/src/components/NumberInput/helpers.ts +86 -86
  206. package/src/components/NumberInput/index.ts +1 -1
  207. package/src/components/PhoneInput/PhoneInput.stories.tsx +70 -70
  208. package/src/components/PhoneInput/PhoneInput.styles.ts +84 -84
  209. package/src/components/PhoneInput/PhoneInput.tsx +193 -193
  210. package/src/components/PhoneInput/components/PhoneInputCountryList/PhoneInputCountryList.stories.tsx +21 -21
  211. package/src/components/PhoneInput/components/PhoneInputCountryList/PhoneInputCountryList.styles.ts +100 -100
  212. package/src/components/PhoneInput/components/PhoneInputCountryList/PhoneInputCountryList.tsx +145 -145
  213. package/src/components/PhoneInput/components/PhoneInputCountryList/index.ts +2 -2
  214. package/src/components/PhoneInput/components/index.ts +1 -1
  215. package/src/components/PhoneInput/constants.ts +3 -3
  216. package/src/components/PhoneInput/index.ts +4 -5
  217. package/src/components/PhoneInput/types.ts +16 -16
  218. package/src/components/RadioButton/RadioButton.stories.tsx +46 -46
  219. package/src/components/RadioButton/RadioButton.styles.ts +37 -37
  220. package/src/components/RadioButton/RadioButton.tsx +55 -55
  221. package/src/components/RadioButton/index.ts +2 -2
  222. package/src/components/ScrollIntoViewIfNeeded/ScrollIntoViewIfNeeded.ts +54 -54
  223. package/src/components/ScrollIntoViewIfNeeded/constants.ts +12 -12
  224. package/src/components/ScrollIntoViewIfNeeded/index.ts +1 -1
  225. package/src/components/SearchInput/SearchInput.stories.tsx +23 -23
  226. package/src/components/SearchInput/SearchInput.styles.ts +50 -50
  227. package/src/components/SearchInput/SearchInput.tsx +51 -51
  228. package/src/components/SearchInput/index.ts +2 -2
  229. package/src/components/Select/MultiSelect.stories.tsx +240 -240
  230. package/src/components/Select/Select.stories.tsx +235 -235
  231. package/src/components/Select/Select.styles.ts +96 -96
  232. package/src/components/Select/Select.tsx +575 -574
  233. package/src/components/Select/components/SelectList/SelectList.styles.ts +72 -72
  234. package/src/components/Select/components/SelectList/SelectList.tsx +158 -158
  235. package/src/components/Select/components/SelectList/index.ts +2 -2
  236. package/src/components/Select/components/SelectListItem/SelectListItem.styles.ts +14 -14
  237. package/src/components/Select/components/SelectListItem/SelectListItem.tsx +68 -68
  238. package/src/components/Select/components/SelectListItem/index.ts +1 -1
  239. package/src/components/Select/components/index.ts +2 -2
  240. package/src/components/Select/constants.ts +2 -2
  241. package/src/components/Select/helpers.ts +26 -26
  242. package/src/components/Select/index.ts +4 -4
  243. package/src/components/Select/types.ts +1 -1
  244. package/src/components/SmartInput/SmartInput.stories.tsx +51 -51
  245. package/src/components/SmartInput/SmartInput.tsx +124 -124
  246. package/src/components/SmartInput/constants.ts +84 -84
  247. package/src/components/SmartInput/helpers.ts +13 -13
  248. package/src/components/SmartInput/index.ts +2 -2
  249. package/src/components/SmartInput/types.ts +11 -11
  250. package/src/components/Switch/Switch.stories.tsx +40 -40
  251. package/src/components/Switch/Switch.styles.ts +75 -75
  252. package/src/components/Switch/Switch.tsx +79 -79
  253. package/src/components/Switch/index.ts +3 -3
  254. package/src/components/Switch/types.ts +4 -4
  255. package/src/components/TextArea/TextArea.stories.tsx +35 -35
  256. package/src/components/TextArea/TextArea.styles.ts +153 -153
  257. package/src/components/TextArea/TextArea.tsx +174 -174
  258. package/src/components/TextArea/index.ts +2 -2
  259. package/src/components/TextWithInfo/TextWithInfo.stories.tsx +53 -53
  260. package/src/components/TextWithInfo/TextWithInfo.styles.ts +60 -60
  261. package/src/components/TextWithInfo/TextWithInfo.tsx +60 -60
  262. package/src/components/TextWithInfo/index.ts +2 -2
  263. package/src/components/TextWithTooltip/TextWithTooltip.stories.tsx +58 -58
  264. package/src/components/TextWithTooltip/TextWithTooltip.styles.ts +19 -19
  265. package/src/components/TextWithTooltip/TextWithTooltip.tsx +143 -143
  266. package/src/components/TextWithTooltip/index.ts +2 -2
  267. package/src/components/ThemedPreloader/ThemedPreloader.stories.tsx +41 -41
  268. package/src/components/ThemedPreloader/ThemedPreloader.styles.ts +21 -21
  269. package/src/components/ThemedPreloader/ThemedPreloader.tsx +47 -47
  270. package/src/components/ThemedPreloader/components/DefaultPreloader/DefaultPreloader.tsx +29 -29
  271. package/src/components/ThemedPreloader/components/DefaultPreloader/index.ts +1 -1
  272. package/src/components/ThemedPreloader/components/DotsPreloader/DotsPreloader.styles.ts +54 -54
  273. package/src/components/ThemedPreloader/components/DotsPreloader/DotsPreloader.tsx +18 -18
  274. package/src/components/ThemedPreloader/components/DotsPreloader/index.ts +2 -2
  275. package/src/components/ThemedPreloader/components/SvgPreloader/SvgPreloader.styles.ts +11 -11
  276. package/src/components/ThemedPreloader/components/SvgPreloader/SvgPreloader.tsx +25 -25
  277. package/src/components/ThemedPreloader/components/SvgPreloader/index.ts +2 -2
  278. package/src/components/ThemedPreloader/components/index.ts +3 -3
  279. package/src/components/ThemedPreloader/constants.ts +1 -1
  280. package/src/components/ThemedPreloader/index.ts +4 -4
  281. package/src/components/ThemedPreloader/types.ts +3 -3
  282. package/src/components/Toaster/Toaster.stories.tsx +30 -30
  283. package/src/components/Toaster/Toaster.styles.ts +59 -59
  284. package/src/components/Toaster/Toaster.tsx +108 -108
  285. package/src/components/Toaster/constants.ts +1 -1
  286. package/src/components/Toaster/index.ts +3 -3
  287. package/src/components/Toaster/types.ts +1 -1
  288. package/src/components/Tooltip/Tooltip.stories.tsx +19 -19
  289. package/src/components/Tooltip/Tooltip.styles.ts +45 -45
  290. package/src/components/Tooltip/Tooltip.tsx +35 -35
  291. package/src/components/Tooltip/index.ts +3 -3
  292. package/src/components/Tooltip/types.ts +1 -1
  293. package/src/components/index.ts +37 -37
  294. package/src/constants/index.ts +1 -0
  295. package/src/{components/PhoneInput → constants}/phone-info.ts +2147 -2147
  296. package/src/helpers/deprecated.ts +23 -23
  297. package/src/helpers/index.ts +4 -5
  298. package/src/helpers/misc.ts +158 -158
  299. package/src/helpers/phone.ts +88 -87
  300. package/src/helpers/popper-helpers.ts +17 -17
  301. package/src/hooks/index.ts +6 -6
  302. package/src/hooks/use-did-mount-effect.ts +18 -18
  303. package/src/hooks/use-dropdown.ts +82 -82
  304. package/src/hooks/use-is-mounted.ts +15 -15
  305. package/src/hooks/use-on-click-outside.ts +77 -77
  306. package/src/hooks/use-theme.ts +32 -32
  307. package/src/hooks/use-tweak-styles.ts +13 -13
  308. package/src/index.ts +6 -6
  309. package/src/theme.ts +149 -149
  310. package/src/types.ts +100 -109
  311. package/src/vite-env.d.ts +1 -1
  312. package/dist/components/PhoneInput/phone-info.d.ts +0 -2
@@ -1,3 +1,3 @@
1
- export * from './Toaster';
2
- export * from './types';
3
- export type { ToasterStyles } from './Toaster.styles';
1
+ export * from './Toaster';
2
+ export * from './types';
3
+ export type { ToasterStyles } from './Toaster.styles';
@@ -1 +1 @@
1
- export type ToasterType = 'error' | 'info' | 'warning' | 'ok' | 'not-ok';
1
+ export type ToasterType = 'error' | 'info' | 'warning' | 'ok' | 'not-ok';
@@ -1,19 +1,19 @@
1
- import { ComponentStory, ComponentMeta } from '@storybook/react';
2
- import { Tooltip } from './Tooltip';
3
-
4
- export default {
5
- title: 'Tooltip',
6
- component: Tooltip,
7
- args: {
8
- text: 'Tooltip Text',
9
- view: 'tooltip',
10
- type: 'info',
11
- },
12
- argTypes: {
13
- text: { control: 'text' },
14
- view: { control: 'inline-radio', options: ['tooltip', 'hint'] },
15
- type: { control: 'inline-radio', options: ['info', 'error'] },
16
- },
17
- } as ComponentMeta<typeof Tooltip>;
18
-
19
- export const Default: ComponentStory<typeof Tooltip> = (args) => <Tooltip {...args} />;
1
+ import { ComponentStory, ComponentMeta } from '@storybook/react';
2
+ import { Tooltip } from './Tooltip';
3
+
4
+ export default {
5
+ title: 'Tooltip',
6
+ component: Tooltip,
7
+ args: {
8
+ text: 'Tooltip Text',
9
+ view: 'tooltip',
10
+ type: 'info',
11
+ },
12
+ argTypes: {
13
+ text: { control: 'text' },
14
+ view: { control: 'inline-radio', options: ['tooltip', 'hint'] },
15
+ type: { control: 'inline-radio', options: ['info', 'error'] },
16
+ },
17
+ } as ComponentMeta<typeof Tooltip>;
18
+
19
+ export const Default: ComponentStory<typeof Tooltip> = (args) => <Tooltip {...args} />;
@@ -1,45 +1,45 @@
1
- import { rgba } from '../../helpers';
2
- import { colors, dimensions } from '../../theme';
3
- import { ComponentStyles } from '../../types';
4
- import { ITooltipProps } from './Tooltip';
5
-
6
- interface IStyleProps {
7
- type: NonNullable<ITooltipProps['type']>;
8
- }
9
-
10
- export const styles = {
11
- root: {
12
- display: 'inline-block',
13
- boxSizing: 'border-box',
14
- },
15
-
16
- tooltip: {
17
- fontSize: 14,
18
- padding: [18, 20],
19
- letterSpacing: 0.15,
20
- backgroundColor: ({ type }: IStyleProps): string =>
21
- type === 'error' ? colors.RED_WARNING : colors.CLASSIC_WHITE,
22
- color: ({ type }: IStyleProps): string =>
23
- type === 'error' ? colors.CLASSIC_WHITE : colors.FONT_MAIN,
24
- boxShadow: `0 0 1px ${rgba(colors.FONT_MAIN, 0.4)}, 0 -2px 6px ${rgba(
25
- colors.FONT_MAIN,
26
- 0.06,
27
- )}, 0 8px 32px -8px ${rgba(colors.FONT_MAIN, 0.3)}`,
28
- borderRadius: 12,
29
- lineHeight: 1.4,
30
- maxWidth: 320,
31
- },
32
-
33
- hint: {
34
- whiteSpace: 'nowrap',
35
- fontSize: 12,
36
- padding: [8, 12],
37
- borderRadius: dimensions.BORDER_RADIUS_SMALL,
38
- backgroundColor: ({ type }: { type: ITooltipProps['type'] }): string =>
39
- type === 'error' ? colors.RED_WARNING : colors.FONT_MEDIUM,
40
- color: colors.CLASSIC_WHITE,
41
- letterSpacing: 0.2,
42
- },
43
- };
44
-
45
- export type TooltipStyles = ComponentStyles<typeof styles, IStyleProps>;
1
+ import { rgba } from '../../helpers';
2
+ import { colors, dimensions } from '../../theme';
3
+ import { ComponentStyles } from '../../types';
4
+ import type { ITooltipProps } from './Tooltip';
5
+
6
+ interface IStyleProps {
7
+ type: NonNullable<ITooltipProps['type']>;
8
+ }
9
+
10
+ export const styles = {
11
+ root: {
12
+ display: 'inline-block',
13
+ boxSizing: 'border-box',
14
+ },
15
+
16
+ tooltip: {
17
+ fontSize: 14,
18
+ padding: [18, 20],
19
+ letterSpacing: 0.15,
20
+ backgroundColor: ({ type }: IStyleProps): string =>
21
+ type === 'error' ? colors.RED_WARNING : colors.CLASSIC_WHITE,
22
+ color: ({ type }: IStyleProps): string =>
23
+ type === 'error' ? colors.CLASSIC_WHITE : colors.FONT_MAIN,
24
+ boxShadow: `0 0 1px ${rgba(colors.FONT_MAIN, 0.4)}, 0 -2px 6px ${rgba(
25
+ colors.FONT_MAIN,
26
+ 0.06,
27
+ )}, 0 8px 32px -8px ${rgba(colors.FONT_MAIN, 0.3)}`,
28
+ borderRadius: 12,
29
+ lineHeight: 1.4,
30
+ maxWidth: 320,
31
+ },
32
+
33
+ hint: {
34
+ whiteSpace: 'nowrap',
35
+ fontSize: 12,
36
+ padding: [8, 12],
37
+ borderRadius: dimensions.BORDER_RADIUS_SMALL,
38
+ backgroundColor: ({ type }: { type: ITooltipProps['type'] }): string =>
39
+ type === 'error' ? colors.RED_WARNING : colors.FONT_MEDIUM,
40
+ color: colors.CLASSIC_WHITE,
41
+ letterSpacing: 0.2,
42
+ },
43
+ };
44
+
45
+ export type TooltipStyles = ComponentStyles<typeof styles, IStyleProps>;
@@ -1,35 +1,35 @@
1
- import { FC, ReactNode } from 'react';
2
- import clsx from 'clsx';
3
- import { addDataAttributes } from '../../helpers';
4
- import { useTheme } from '../../hooks';
5
- import { ICommonProps } from '../../types';
6
- import { styles, TooltipStyles } from './Tooltip.styles';
7
-
8
- export interface ITooltipProps extends ICommonProps {
9
- tweakStyles?: TooltipStyles;
10
- text: ReactNode;
11
- /**
12
- * @default `tooltip`
13
- */
14
- view?: 'tooltip' | 'hint';
15
- /**
16
- * @default `info`
17
- */
18
- type?: 'info' | 'error';
19
- }
20
-
21
- export const Tooltip: FC<ITooltipProps> = ({
22
- text,
23
- view = 'tooltip',
24
- type = 'info',
25
- data,
26
- tweakStyles,
27
- }) => {
28
- const { classes } = useTheme('Tooltip', styles, tweakStyles, { type });
29
-
30
- return (
31
- <div className={clsx(classes.root, classes[view])} {...addDataAttributes(data)}>
32
- {text}
33
- </div>
34
- );
35
- };
1
+ import { FC, ReactNode } from 'react';
2
+ import clsx from 'clsx';
3
+ import { addDataAttributes } from '../../helpers';
4
+ import { useTheme } from '../../hooks';
5
+ import { ICommonProps } from '../../types';
6
+ import { styles, TooltipStyles } from './Tooltip.styles';
7
+
8
+ export interface ITooltipProps extends ICommonProps {
9
+ tweakStyles?: TooltipStyles;
10
+ text: ReactNode;
11
+ /**
12
+ * @default `tooltip`
13
+ */
14
+ view?: 'tooltip' | 'hint';
15
+ /**
16
+ * @default `info`
17
+ */
18
+ type?: 'info' | 'error';
19
+ }
20
+
21
+ export const Tooltip: FC<ITooltipProps> = ({
22
+ text,
23
+ view = 'tooltip',
24
+ type = 'info',
25
+ data,
26
+ tweakStyles,
27
+ }) => {
28
+ const { classes } = useTheme('Tooltip', styles, tweakStyles, { type });
29
+
30
+ return (
31
+ <div className={clsx(classes.root, classes[view])} {...addDataAttributes(data)}>
32
+ {text}
33
+ </div>
34
+ );
35
+ };
@@ -1,3 +1,3 @@
1
- export * from './Tooltip';
2
- export * from './types';
3
- export type { TooltipStyles } from './Tooltip.styles';
1
+ export * from './Tooltip';
2
+ export * from './types';
3
+ export type { TooltipStyles } from './Tooltip.styles';
@@ -1 +1 @@
1
- export type ITooltipType = 'info' | 'warning';
1
+ export type ITooltipType = 'info' | 'warning';
@@ -1,37 +1,37 @@
1
- export * from './AccountInfo';
2
- export * from './AddButton';
3
- export * from './Button';
4
- export * from './Checkbox';
5
- export * from './CloseButton';
6
- export * from './Colors';
7
- export * from './CssBaseline';
8
- export * from './DateInput';
9
- export * from './DatePicker';
10
- export * from './Description';
11
- export * from './FiltersPane';
12
- export * from './Flag';
13
- export * from './FlexibleTable';
14
- export * from './Icon';
15
- export * from './IncrementInput';
16
- export * from './Input';
17
- export * from './List';
18
- export * from './ListItem';
19
- export * from './Modal';
20
- export * from './MoreMenu';
21
- export * from './MultiSelect';
22
- export * from './MultiSelectList';
23
- export * from './Notification';
24
- export * from './NumberInput';
25
- export * from './SearchInput';
26
- export * from './SmartInput';
27
- export * from './PhoneInput';
28
- export * from './RadioButton';
29
- export * from './Select';
30
- export * from './Switch';
31
- export * from './TextArea';
32
- export * from './TextWithInfo';
33
- export * from './TextWithTooltip';
34
- export * from './ThemedPreloader';
35
- export * from './Toaster';
36
- export * from './Tooltip';
37
- export * from './ScrollIntoViewIfNeeded';
1
+ export * from './AccountInfo';
2
+ export * from './AddButton';
3
+ export * from './Button';
4
+ export * from './Checkbox';
5
+ export * from './CloseButton';
6
+ export * from './Colors';
7
+ export * from './CssBaseline';
8
+ export * from './DateInput';
9
+ export * from './DatePicker';
10
+ export * from './Description';
11
+ export * from './FiltersPane';
12
+ export * from './Flag';
13
+ export * from './FlexibleTable';
14
+ export * from './Icon';
15
+ export * from './IncrementInput';
16
+ export * from './Input';
17
+ export * from './List';
18
+ export * from './ListItem';
19
+ export * from './Modal';
20
+ export * from './MoreMenu';
21
+ export * from './MultiSelect';
22
+ export * from './MultiSelectList';
23
+ export * from './Notification';
24
+ export * from './NumberInput';
25
+ export * from './SearchInput';
26
+ export * from './SmartInput';
27
+ export * from './PhoneInput';
28
+ export * from './RadioButton';
29
+ export * from './Select';
30
+ export * from './Switch';
31
+ export * from './TextArea';
32
+ export * from './TextWithInfo';
33
+ export * from './TextWithTooltip';
34
+ export * from './ThemedPreloader';
35
+ export * from './Toaster';
36
+ export * from './Tooltip';
37
+ export * from './ScrollIntoViewIfNeeded';
@@ -0,0 +1 @@
1
+ export * from './phone-info';