@skbkontur/react-ui 3.9.4 → 3.10.0

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 (437) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/README.md +57 -0
  3. package/cjs/components/Autocomplete/Autocomplete.d.ts +1 -0
  4. package/cjs/components/Autocomplete/Autocomplete.js +11 -5
  5. package/cjs/components/Autocomplete/Autocomplete.js.map +1 -1
  6. package/cjs/components/Button/Button.d.ts +1 -0
  7. package/cjs/components/Button/Button.js +7 -3
  8. package/cjs/components/Button/Button.js.map +1 -1
  9. package/cjs/components/Center/Center.d.ts +1 -0
  10. package/cjs/components/Center/Center.js +10 -3
  11. package/cjs/components/Center/Center.js.map +1 -1
  12. package/cjs/components/Checkbox/Checkbox.d.ts +3 -2
  13. package/cjs/components/Checkbox/Checkbox.js +10 -4
  14. package/cjs/components/Checkbox/Checkbox.js.map +1 -1
  15. package/cjs/components/ComboBox/ComboBox.d.ts +2 -0
  16. package/cjs/components/ComboBox/ComboBox.js +100 -70
  17. package/cjs/components/ComboBox/ComboBox.js.map +1 -1
  18. package/cjs/components/CurrencyInput/CurrencyInput.d.ts +3 -3
  19. package/cjs/components/CurrencyInput/CurrencyInput.js +7 -4
  20. package/cjs/components/CurrencyInput/CurrencyInput.js.map +1 -1
  21. package/cjs/components/DateInput/DateInput.d.ts +1 -0
  22. package/cjs/components/DateInput/DateInput.js +6 -3
  23. package/cjs/components/DateInput/DateInput.js.map +1 -1
  24. package/cjs/components/DatePicker/DatePicker.d.ts +4 -2
  25. package/cjs/components/DatePicker/DatePicker.js +17 -7
  26. package/cjs/components/DatePicker/DatePicker.js.map +1 -1
  27. package/cjs/components/Dropdown/Dropdown.d.ts +1 -0
  28. package/cjs/components/Dropdown/Dropdown.js +11 -4
  29. package/cjs/components/Dropdown/Dropdown.js.map +1 -1
  30. package/cjs/components/DropdownMenu/DropdownMenu.d.ts +1 -0
  31. package/cjs/components/DropdownMenu/DropdownMenu.js +7 -4
  32. package/cjs/components/DropdownMenu/DropdownMenu.js.map +1 -1
  33. package/cjs/components/FxInput/FxInput.d.ts +1 -0
  34. package/cjs/components/FxInput/FxInput.js +9 -2
  35. package/cjs/components/FxInput/FxInput.js.map +1 -1
  36. package/cjs/components/Gapped/Gapped.d.ts +1 -0
  37. package/cjs/components/Gapped/Gapped.js +8 -5
  38. package/cjs/components/Gapped/Gapped.js.map +1 -1
  39. package/cjs/components/Group/Group.d.ts +1 -0
  40. package/cjs/components/Group/Group.js +10 -7
  41. package/cjs/components/Group/Group.js.map +1 -1
  42. package/cjs/components/Hint/Hint.d.ts +3 -2
  43. package/cjs/components/Hint/Hint.js +7 -4
  44. package/cjs/components/Hint/Hint.js.map +1 -1
  45. package/cjs/components/Input/Input.d.ts +4 -1
  46. package/cjs/components/Input/Input.js +13 -5
  47. package/cjs/components/Input/Input.js.map +1 -1
  48. package/cjs/components/Kebab/Kebab.d.ts +1 -0
  49. package/cjs/components/Kebab/Kebab.js +8 -5
  50. package/cjs/components/Kebab/Kebab.js.map +1 -1
  51. package/cjs/components/Link/Link.d.ts +1 -0
  52. package/cjs/components/Link/Link.js +11 -3
  53. package/cjs/components/Link/Link.js.map +1 -1
  54. package/cjs/components/Loader/Loader.d.ts +1 -0
  55. package/cjs/components/Loader/Loader.js +9 -6
  56. package/cjs/components/Loader/Loader.js.map +1 -1
  57. package/cjs/components/MenuItem/MenuItem.d.ts +1 -0
  58. package/cjs/components/MenuItem/MenuItem.js +13 -7
  59. package/cjs/components/MenuItem/MenuItem.js.map +1 -1
  60. package/cjs/components/Modal/Modal.js +1 -1
  61. package/cjs/components/Modal/Modal.js.map +1 -1
  62. package/cjs/components/Modal/ModalBody.d.ts +1 -0
  63. package/cjs/components/Modal/ModalBody.js +9 -6
  64. package/cjs/components/Modal/ModalBody.js.map +1 -1
  65. package/cjs/components/Paging/Paging.d.ts +2 -2
  66. package/cjs/components/Paging/Paging.js +6 -5
  67. package/cjs/components/Paging/Paging.js.map +1 -1
  68. package/cjs/components/PasswordInput/PasswordInput.d.ts +3 -2
  69. package/cjs/components/PasswordInput/PasswordInput.js +13 -6
  70. package/cjs/components/PasswordInput/PasswordInput.js.map +1 -1
  71. package/cjs/components/Radio/Radio.d.ts +5 -10
  72. package/cjs/components/Radio/Radio.js +11 -10
  73. package/cjs/components/Radio/Radio.js.map +1 -1
  74. package/cjs/components/RadioGroup/RadioGroup.d.ts +2 -16
  75. package/cjs/components/RadioGroup/RadioGroup.js +16 -19
  76. package/cjs/components/RadioGroup/RadioGroup.js.map +1 -1
  77. package/cjs/components/RadioGroup/RadioGroupContext.d.ts +10 -0
  78. package/cjs/components/RadioGroup/RadioGroupContext.js +21 -0
  79. package/cjs/components/RadioGroup/RadioGroupContext.js.map +1 -0
  80. package/cjs/components/ScrollContainer/ScrollContainer.d.ts +1 -0
  81. package/cjs/components/ScrollContainer/ScrollContainer.js +8 -5
  82. package/cjs/components/ScrollContainer/ScrollContainer.js.map +1 -1
  83. package/cjs/components/Select/Select.d.ts +1 -0
  84. package/cjs/components/Select/Select.js +6 -4
  85. package/cjs/components/Select/Select.js.map +1 -1
  86. package/cjs/components/SidePage/SidePage.d.ts +1 -0
  87. package/cjs/components/SidePage/SidePage.js +4 -1
  88. package/cjs/components/SidePage/SidePage.js.map +1 -1
  89. package/cjs/components/SidePage/SidePageBody.d.ts +1 -0
  90. package/cjs/components/SidePage/SidePageBody.js +9 -6
  91. package/cjs/components/SidePage/SidePageBody.js.map +1 -1
  92. package/cjs/components/SidePage/SidePageContainer.d.ts +1 -0
  93. package/cjs/components/SidePage/SidePageContainer.js +9 -6
  94. package/cjs/components/SidePage/SidePageContainer.js.map +1 -1
  95. package/cjs/components/SidePage/SidePageFooter.d.ts +1 -2
  96. package/cjs/components/SidePage/SidePageFooter.js +11 -12
  97. package/cjs/components/SidePage/SidePageFooter.js.map +1 -1
  98. package/cjs/components/SidePage/SidePageHeader.d.ts +1 -0
  99. package/cjs/components/SidePage/SidePageHeader.js +6 -3
  100. package/cjs/components/SidePage/SidePageHeader.js.map +1 -1
  101. package/cjs/components/Spinner/Spinner.d.ts +1 -0
  102. package/cjs/components/Spinner/Spinner.js +8 -5
  103. package/cjs/components/Spinner/Spinner.js.map +1 -1
  104. package/cjs/components/Sticky/Sticky.d.ts +1 -0
  105. package/cjs/components/Sticky/Sticky.js +8 -5
  106. package/cjs/components/Sticky/Sticky.js.map +1 -1
  107. package/cjs/components/Switcher/Switcher.d.ts +1 -0
  108. package/cjs/components/Switcher/Switcher.js +6 -3
  109. package/cjs/components/Switcher/Switcher.js.map +1 -1
  110. package/cjs/components/Tabs/Indicator.d.ts +1 -0
  111. package/cjs/components/Tabs/Indicator.js +16 -15
  112. package/cjs/components/Tabs/Indicator.js.map +1 -1
  113. package/cjs/components/Tabs/Tab.d.ts +2 -1
  114. package/cjs/components/Tabs/Tab.js +13 -9
  115. package/cjs/components/Tabs/Tab.js.map +1 -1
  116. package/cjs/components/Tabs/Tabs.d.ts +1 -0
  117. package/cjs/components/Tabs/Tabs.js +9 -9
  118. package/cjs/components/Tabs/Tabs.js.map +1 -1
  119. package/cjs/components/Textarea/Textarea.d.ts +1 -0
  120. package/cjs/components/Textarea/Textarea.js +12 -5
  121. package/cjs/components/Textarea/Textarea.js.map +1 -1
  122. package/cjs/components/Toast/Toast.d.ts +3 -0
  123. package/cjs/components/Toast/Toast.js +15 -4
  124. package/cjs/components/Toast/Toast.js.map +1 -1
  125. package/cjs/components/Toast/ToastView.d.ts +1 -0
  126. package/cjs/components/Toast/ToastView.js +8 -5
  127. package/cjs/components/Toast/ToastView.js.map +1 -1
  128. package/cjs/components/Toggle/Toggle.d.ts +1 -0
  129. package/cjs/components/Toggle/Toggle.js +9 -6
  130. package/cjs/components/Toggle/Toggle.js.map +1 -1
  131. package/cjs/components/Token/Token.d.ts +1 -0
  132. package/cjs/components/Token/Token.js +7 -4
  133. package/cjs/components/Token/Token.js.map +1 -1
  134. package/cjs/components/TokenInput/TokenInput.d.ts +1 -0
  135. package/cjs/components/TokenInput/TokenInput.js +11 -8
  136. package/cjs/components/TokenInput/TokenInput.js.map +1 -1
  137. package/cjs/components/Tooltip/Tooltip.d.ts +3 -1
  138. package/cjs/components/Tooltip/Tooltip.js +16 -5
  139. package/cjs/components/Tooltip/Tooltip.js.map +1 -1
  140. package/cjs/components/TooltipMenu/TooltipMenu.d.ts +1 -0
  141. package/cjs/components/TooltipMenu/TooltipMenu.js +8 -5
  142. package/cjs/components/TooltipMenu/TooltipMenu.js.map +1 -1
  143. package/cjs/internal/CommonWrapper/CommonWrapper.d.ts +9 -1
  144. package/cjs/internal/CommonWrapper/CommonWrapper.js +38 -15
  145. package/cjs/internal/CommonWrapper/CommonWrapper.js.map +1 -1
  146. package/cjs/internal/CustomComboBox/ComboBoxMenu.js +3 -2
  147. package/cjs/internal/CustomComboBox/ComboBoxMenu.js.map +1 -1
  148. package/cjs/internal/CustomComboBox/ComboBoxView.d.ts +4 -1
  149. package/cjs/internal/CustomComboBox/ComboBoxView.js +15 -5
  150. package/cjs/internal/CustomComboBox/ComboBoxView.js.map +1 -1
  151. package/cjs/internal/CustomComboBox/CustomComboBox.d.ts +1 -0
  152. package/cjs/internal/CustomComboBox/CustomComboBox.js +8 -5
  153. package/cjs/internal/CustomComboBox/CustomComboBox.js.map +1 -1
  154. package/cjs/internal/DateSelect/DateSelect.d.ts +2 -2
  155. package/cjs/internal/DateSelect/DateSelect.js +3 -3
  156. package/cjs/internal/DateSelect/DateSelect.js.map +1 -1
  157. package/cjs/internal/DropdownContainer/DropdownContainer.d.ts +4 -7
  158. package/cjs/internal/DropdownContainer/DropdownContainer.js +8 -13
  159. package/cjs/internal/DropdownContainer/DropdownContainer.js.map +1 -1
  160. package/cjs/internal/FocusTrap/FocusTrap.d.ts +1 -0
  161. package/cjs/internal/FocusTrap/FocusTrap.js +12 -9
  162. package/cjs/internal/FocusTrap/FocusTrap.js.map +1 -1
  163. package/cjs/internal/IgnoreLayerClick/IgnoreLayerClick.js +12 -4
  164. package/cjs/internal/IgnoreLayerClick/IgnoreLayerClick.js.map +1 -1
  165. package/cjs/internal/InputLikeText/InputLikeText.d.ts +1 -0
  166. package/cjs/internal/InputLikeText/InputLikeText.js +10 -3
  167. package/cjs/internal/InputLikeText/InputLikeText.js.map +1 -1
  168. package/cjs/internal/InternalMenu/InternalMenu.d.ts +2 -3
  169. package/cjs/internal/InternalMenu/InternalMenu.js +16 -22
  170. package/cjs/internal/InternalMenu/InternalMenu.js.map +1 -1
  171. package/cjs/internal/MaskedInput/MaskedInput.d.ts +2 -2
  172. package/cjs/internal/MaskedInput/MaskedInput.js +3 -3
  173. package/cjs/internal/MaskedInput/MaskedInput.js.map +1 -1
  174. package/cjs/internal/Menu/Menu.d.ts +1 -0
  175. package/cjs/internal/Menu/Menu.js +9 -6
  176. package/cjs/internal/Menu/Menu.js.map +1 -1
  177. package/cjs/internal/Popup/Popup.d.ts +4 -4
  178. package/cjs/internal/Popup/Popup.js +50 -27
  179. package/cjs/internal/Popup/Popup.js.map +1 -1
  180. package/cjs/internal/PopupMenu/PopupMenu.d.ts +1 -0
  181. package/cjs/internal/PopupMenu/PopupMenu.js +7 -4
  182. package/cjs/internal/PopupMenu/PopupMenu.js.map +1 -1
  183. package/cjs/internal/RenderContainer/RenderContainer.d.ts +1 -1
  184. package/cjs/internal/RenderContainer/RenderContainer.js +2 -1
  185. package/cjs/internal/RenderContainer/RenderContainer.js.map +1 -1
  186. package/cjs/internal/RenderContainer/RenderInnerContainer.js +2 -3
  187. package/cjs/internal/RenderContainer/RenderInnerContainer.js.map +1 -1
  188. package/cjs/internal/RenderLayer/RenderLayer.d.ts +3 -1
  189. package/cjs/internal/RenderLayer/RenderLayer.js +13 -7
  190. package/cjs/internal/RenderLayer/RenderLayer.js.map +1 -1
  191. package/cjs/internal/ThemeShowcase/ThemeShowcase.d.ts +1 -1
  192. package/cjs/internal/ThemeShowcase/ThemeShowcase.js +20 -19
  193. package/cjs/internal/ThemeShowcase/ThemeShowcase.js.map +1 -1
  194. package/cjs/internal/ZIndex/ZIndex.d.ts +2 -0
  195. package/cjs/internal/ZIndex/ZIndex.js +45 -34
  196. package/cjs/internal/ZIndex/ZIndex.js.map +1 -1
  197. package/cjs/internal/icons/16px/index.d.ts +17 -16
  198. package/cjs/internal/icons/16px/index.js +108 -51
  199. package/cjs/internal/icons/16px/index.js.map +1 -1
  200. package/cjs/lib/callChildRef/callChildRef.d.ts +3 -0
  201. package/cjs/lib/callChildRef/callChildRef.js +19 -0
  202. package/cjs/lib/callChildRef/callChildRef.js.map +1 -0
  203. package/cjs/lib/rootNode/getRootNode.d.ts +3 -0
  204. package/cjs/lib/rootNode/getRootNode.js +27 -0
  205. package/cjs/lib/rootNode/getRootNode.js.map +1 -0
  206. package/cjs/lib/rootNode/index.d.ts +2 -0
  207. package/cjs/lib/rootNode/index.js +2 -0
  208. package/cjs/lib/rootNode/index.js.map +1 -0
  209. package/cjs/lib/rootNode/rootNodeDecorator.d.ts +33 -0
  210. package/cjs/lib/rootNode/rootNodeDecorator.js +31 -0
  211. package/cjs/lib/rootNode/rootNodeDecorator.js.map +1 -0
  212. package/cjs/lib/theming/Emotion.js +1 -0
  213. package/cjs/lib/theming/Emotion.js.map +1 -1
  214. package/cjs/lib/utils.d.ts +3 -0
  215. package/cjs/lib/utils.js +15 -2
  216. package/cjs/lib/utils.js.map +1 -1
  217. package/components/Autocomplete/Autocomplete/Autocomplete.js +19 -16
  218. package/components/Autocomplete/Autocomplete/Autocomplete.js.map +1 -1
  219. package/components/Autocomplete/Autocomplete.d.ts +1 -0
  220. package/components/Button/Button/Button.js +15 -12
  221. package/components/Button/Button/Button.js.map +1 -1
  222. package/components/Button/Button.d.ts +1 -0
  223. package/components/Center/Center/Center.js +14 -9
  224. package/components/Center/Center/Center.js.map +1 -1
  225. package/components/Center/Center.d.ts +1 -0
  226. package/components/Checkbox/Checkbox/Checkbox.js +16 -10
  227. package/components/Checkbox/Checkbox/Checkbox.js.map +1 -1
  228. package/components/Checkbox/Checkbox.d.ts +3 -2
  229. package/components/ComboBox/ComboBox/ComboBox.js +38 -32
  230. package/components/ComboBox/ComboBox/ComboBox.js.map +1 -1
  231. package/components/ComboBox/ComboBox.d.ts +2 -0
  232. package/components/CurrencyInput/CurrencyInput/CurrencyInput.js +29 -27
  233. package/components/CurrencyInput/CurrencyInput/CurrencyInput.js.map +1 -1
  234. package/components/CurrencyInput/CurrencyInput.d.ts +3 -3
  235. package/components/DateInput/DateInput/DateInput.js +7 -3
  236. package/components/DateInput/DateInput/DateInput.js.map +1 -1
  237. package/components/DateInput/DateInput.d.ts +1 -0
  238. package/components/DatePicker/DatePicker/DatePicker.js +29 -22
  239. package/components/DatePicker/DatePicker/DatePicker.js.map +1 -1
  240. package/components/DatePicker/DatePicker.d.ts +4 -2
  241. package/components/Dropdown/Dropdown/Dropdown.js +15 -13
  242. package/components/Dropdown/Dropdown/Dropdown.js.map +1 -1
  243. package/components/Dropdown/Dropdown.d.ts +1 -0
  244. package/components/DropdownMenu/DropdownMenu/DropdownMenu.js +15 -9
  245. package/components/DropdownMenu/DropdownMenu/DropdownMenu.js.map +1 -1
  246. package/components/DropdownMenu/DropdownMenu.d.ts +1 -0
  247. package/components/FxInput/FxInput/FxInput.js +13 -9
  248. package/components/FxInput/FxInput/FxInput.js.map +1 -1
  249. package/components/FxInput/FxInput.d.ts +1 -0
  250. package/components/Gapped/Gapped/Gapped.js +15 -11
  251. package/components/Gapped/Gapped/Gapped.js.map +1 -1
  252. package/components/Gapped/Gapped.d.ts +1 -0
  253. package/components/Group/Group/Group.js +22 -9
  254. package/components/Group/Group/Group.js.map +1 -1
  255. package/components/Group/Group.d.ts +1 -0
  256. package/components/Hint/Hint/Hint.js +18 -12
  257. package/components/Hint/Hint/Hint.js.map +1 -1
  258. package/components/Hint/Hint.d.ts +3 -2
  259. package/components/Input/Input/Input.js +21 -14
  260. package/components/Input/Input/Input.js.map +1 -1
  261. package/components/Input/Input.d.ts +4 -1
  262. package/components/Kebab/Kebab/Kebab.js +12 -7
  263. package/components/Kebab/Kebab/Kebab.js.map +1 -1
  264. package/components/Kebab/Kebab.d.ts +1 -0
  265. package/components/Link/Link/Link.js +15 -11
  266. package/components/Link/Link/Link.js.map +1 -1
  267. package/components/Link/Link.d.ts +1 -0
  268. package/components/Loader/Loader/Loader.js +16 -11
  269. package/components/Loader/Loader/Loader.js.map +1 -1
  270. package/components/Loader/Loader.d.ts +1 -0
  271. package/components/MenuItem/MenuItem/MenuItem.js +21 -14
  272. package/components/MenuItem/MenuItem/MenuItem.js.map +1 -1
  273. package/components/MenuItem/MenuItem.d.ts +1 -0
  274. package/components/Modal/Modal/Modal.js +1 -1
  275. package/components/Modal/Modal/Modal.js.map +1 -1
  276. package/components/Modal/ModalBody/ModalBody.js +16 -10
  277. package/components/Modal/ModalBody/ModalBody.js.map +1 -1
  278. package/components/Modal/ModalBody.d.ts +1 -0
  279. package/components/Paging/Paging/Paging.js +17 -14
  280. package/components/Paging/Paging/Paging.js.map +1 -1
  281. package/components/Paging/Paging.d.ts +2 -2
  282. package/components/PasswordInput/PasswordInput/PasswordInput.js +18 -14
  283. package/components/PasswordInput/PasswordInput/PasswordInput.js.map +1 -1
  284. package/components/PasswordInput/PasswordInput.d.ts +3 -2
  285. package/components/Radio/Radio/Radio.js +17 -19
  286. package/components/Radio/Radio/Radio.js.map +1 -1
  287. package/components/Radio/Radio.d.ts +5 -10
  288. package/components/RadioGroup/RadioGroup/RadioGroup.js +35 -38
  289. package/components/RadioGroup/RadioGroup/RadioGroup.js.map +1 -1
  290. package/components/RadioGroup/RadioGroup.d.ts +2 -16
  291. package/components/RadioGroup/RadioGroupContext/RadioGroupContext.js +12 -0
  292. package/components/RadioGroup/RadioGroupContext/RadioGroupContext.js.map +1 -0
  293. package/components/RadioGroup/RadioGroupContext/package.json +6 -0
  294. package/components/RadioGroup/RadioGroupContext.d.ts +10 -0
  295. package/components/ScrollContainer/ScrollContainer/ScrollContainer.js +13 -8
  296. package/components/ScrollContainer/ScrollContainer/ScrollContainer.js.map +1 -1
  297. package/components/ScrollContainer/ScrollContainer.d.ts +1 -0
  298. package/components/Select/Select/Select.js +8 -5
  299. package/components/Select/Select/Select.js.map +1 -1
  300. package/components/Select/Select.d.ts +1 -0
  301. package/components/SidePage/SidePage/SidePage.js +6 -3
  302. package/components/SidePage/SidePage/SidePage.js.map +1 -1
  303. package/components/SidePage/SidePage.d.ts +1 -0
  304. package/components/SidePage/SidePageBody/SidePageBody.js +16 -10
  305. package/components/SidePage/SidePageBody/SidePageBody.js.map +1 -1
  306. package/components/SidePage/SidePageBody.d.ts +1 -0
  307. package/components/SidePage/SidePageContainer/SidePageContainer.js +16 -9
  308. package/components/SidePage/SidePageContainer/SidePageContainer.js.map +1 -1
  309. package/components/SidePage/SidePageContainer.d.ts +1 -0
  310. package/components/SidePage/SidePageFooter/SidePageFooter.js +22 -19
  311. package/components/SidePage/SidePageFooter/SidePageFooter.js.map +1 -1
  312. package/components/SidePage/SidePageFooter.d.ts +1 -2
  313. package/components/SidePage/SidePageHeader/SidePageHeader.js +15 -10
  314. package/components/SidePage/SidePageHeader/SidePageHeader.js.map +1 -1
  315. package/components/SidePage/SidePageHeader.d.ts +1 -0
  316. package/components/Spinner/Spinner/Spinner.js +8 -3
  317. package/components/Spinner/Spinner/Spinner.js.map +1 -1
  318. package/components/Spinner/Spinner.d.ts +1 -0
  319. package/components/Sticky/Sticky/Sticky.js +13 -8
  320. package/components/Sticky/Sticky/Sticky.js.map +1 -1
  321. package/components/Sticky/Sticky.d.ts +1 -0
  322. package/components/Switcher/Switcher/Switcher.js +11 -6
  323. package/components/Switcher/Switcher/Switcher.js.map +1 -1
  324. package/components/Switcher/Switcher.d.ts +1 -0
  325. package/components/Tabs/Indicator/Indicator.js +16 -14
  326. package/components/Tabs/Indicator/Indicator.js.map +1 -1
  327. package/components/Tabs/Indicator.d.ts +1 -0
  328. package/components/Tabs/Tab/Tab.js +31 -34
  329. package/components/Tabs/Tab/Tab.js.map +1 -1
  330. package/components/Tabs/Tab.d.ts +2 -1
  331. package/components/Tabs/Tabs/Tabs.js +20 -20
  332. package/components/Tabs/Tabs/Tabs.js.map +1 -1
  333. package/components/Tabs/Tabs.d.ts +1 -0
  334. package/components/Textarea/Textarea/Textarea.js +21 -17
  335. package/components/Textarea/Textarea/Textarea.js.map +1 -1
  336. package/components/Textarea/Textarea.d.ts +1 -0
  337. package/components/Toast/Toast/Toast.js +29 -14
  338. package/components/Toast/Toast/Toast.js.map +1 -1
  339. package/components/Toast/Toast.d.ts +3 -0
  340. package/components/Toast/ToastView/ToastView.js +10 -5
  341. package/components/Toast/ToastView/ToastView.js.map +1 -1
  342. package/components/Toast/ToastView.d.ts +1 -0
  343. package/components/Toggle/Toggle/Toggle.js +16 -11
  344. package/components/Toggle/Toggle/Toggle.js.map +1 -1
  345. package/components/Toggle/Toggle.d.ts +1 -0
  346. package/components/Token/Token/Token.js +11 -4
  347. package/components/Token/Token/Token.js.map +1 -1
  348. package/components/Token/Token.d.ts +1 -0
  349. package/components/TokenInput/TokenInput/TokenInput.js +12 -6
  350. package/components/TokenInput/TokenInput/TokenInput.js.map +1 -1
  351. package/components/TokenInput/TokenInput.d.ts +1 -0
  352. package/components/Tooltip/Tooltip/Tooltip.js +24 -15
  353. package/components/Tooltip/Tooltip/Tooltip.js.map +1 -1
  354. package/components/Tooltip/Tooltip.d.ts +3 -1
  355. package/components/TooltipMenu/TooltipMenu/TooltipMenu.js +23 -17
  356. package/components/TooltipMenu/TooltipMenu/TooltipMenu.js.map +1 -1
  357. package/components/TooltipMenu/TooltipMenu.d.ts +1 -0
  358. package/internal/CommonWrapper/CommonWrapper/CommonWrapper.js +37 -10
  359. package/internal/CommonWrapper/CommonWrapper/CommonWrapper.js.map +1 -1
  360. package/internal/CommonWrapper/CommonWrapper.d.ts +9 -1
  361. package/internal/CustomComboBox/ComboBoxMenu/ComboBoxMenu.js +5 -3
  362. package/internal/CustomComboBox/ComboBoxMenu/ComboBoxMenu.js.map +1 -1
  363. package/internal/CustomComboBox/ComboBoxView/ComboBoxView.js +23 -13
  364. package/internal/CustomComboBox/ComboBoxView/ComboBoxView.js.map +1 -1
  365. package/internal/CustomComboBox/ComboBoxView.d.ts +4 -1
  366. package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js +12 -4
  367. package/internal/CustomComboBox/CustomComboBox/CustomComboBox.js.map +1 -1
  368. package/internal/CustomComboBox/CustomComboBox.d.ts +1 -0
  369. package/internal/DateSelect/DateSelect/DateSelect.js +5 -5
  370. package/internal/DateSelect/DateSelect/DateSelect.js.map +1 -1
  371. package/internal/DateSelect/DateSelect.d.ts +2 -2
  372. package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js +11 -15
  373. package/internal/DropdownContainer/DropdownContainer/DropdownContainer.js.map +1 -1
  374. package/internal/DropdownContainer/DropdownContainer.d.ts +4 -7
  375. package/internal/FocusTrap/FocusTrap/FocusTrap.js +17 -9
  376. package/internal/FocusTrap/FocusTrap/FocusTrap.js.map +1 -1
  377. package/internal/FocusTrap/FocusTrap.d.ts +1 -0
  378. package/internal/IgnoreLayerClick/IgnoreLayerClick/IgnoreLayerClick.js +13 -7
  379. package/internal/IgnoreLayerClick/IgnoreLayerClick/IgnoreLayerClick.js.map +1 -1
  380. package/internal/InputLikeText/InputLikeText/InputLikeText.js +11 -6
  381. package/internal/InputLikeText/InputLikeText/InputLikeText.js.map +1 -1
  382. package/internal/InputLikeText/InputLikeText.d.ts +1 -0
  383. package/internal/InternalMenu/InternalMenu/InternalMenu.js +24 -25
  384. package/internal/InternalMenu/InternalMenu/InternalMenu.js.map +1 -1
  385. package/internal/InternalMenu/InternalMenu.d.ts +2 -3
  386. package/internal/MaskedInput/MaskedInput/MaskedInput.js +7 -7
  387. package/internal/MaskedInput/MaskedInput/MaskedInput.js.map +1 -1
  388. package/internal/MaskedInput/MaskedInput.d.ts +2 -2
  389. package/internal/Menu/Menu/Menu.js +11 -8
  390. package/internal/Menu/Menu/Menu.js.map +1 -1
  391. package/internal/Menu/Menu.d.ts +1 -0
  392. package/internal/Popup/Popup/Popup.js +79 -68
  393. package/internal/Popup/Popup/Popup.js.map +1 -1
  394. package/internal/Popup/Popup.d.ts +4 -4
  395. package/internal/PopupMenu/PopupMenu/PopupMenu.js +12 -7
  396. package/internal/PopupMenu/PopupMenu/PopupMenu.js.map +1 -1
  397. package/internal/PopupMenu/PopupMenu.d.ts +1 -0
  398. package/internal/RenderContainer/RenderContainer/RenderContainer.js +3 -1
  399. package/internal/RenderContainer/RenderContainer/RenderContainer.js.map +1 -1
  400. package/internal/RenderContainer/RenderContainer.d.ts +1 -1
  401. package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js +2 -3
  402. package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js.map +1 -1
  403. package/internal/RenderLayer/RenderLayer/RenderLayer.js +20 -18
  404. package/internal/RenderLayer/RenderLayer/RenderLayer.js.map +1 -1
  405. package/internal/RenderLayer/RenderLayer.d.ts +3 -1
  406. package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js +35 -43
  407. package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js.map +1 -1
  408. package/internal/ThemeShowcase/ThemeShowcase.d.ts +1 -1
  409. package/internal/ZIndex/ZIndex/ZIndex.js +20 -8
  410. package/internal/ZIndex/ZIndex/ZIndex.js.map +1 -1
  411. package/internal/ZIndex/ZIndex.d.ts +2 -0
  412. package/internal/icons/16px/index/index.js +83 -51
  413. package/internal/icons/16px/index/index.js.map +1 -1
  414. package/internal/icons/16px/index.d.ts +17 -16
  415. package/lib/callChildRef/callChildRef/callChildRef.js +14 -0
  416. package/lib/callChildRef/callChildRef/callChildRef.js.map +1 -0
  417. package/lib/callChildRef/callChildRef/package.json +6 -0
  418. package/lib/callChildRef/callChildRef.d.ts +3 -0
  419. package/lib/rootNode/getRootNode/getRootNode.js +25 -0
  420. package/lib/rootNode/getRootNode/getRootNode.js.map +1 -0
  421. package/lib/rootNode/getRootNode/package.json +6 -0
  422. package/lib/rootNode/getRootNode.d.ts +3 -0
  423. package/lib/rootNode/index/index.js +2 -0
  424. package/lib/rootNode/index/index.js.map +1 -0
  425. package/lib/rootNode/index/package.json +6 -0
  426. package/lib/rootNode/index.d.ts +2 -0
  427. package/lib/rootNode/package.json +6 -0
  428. package/lib/rootNode/rootNodeDecorator/package.json +6 -0
  429. package/lib/rootNode/rootNodeDecorator/rootNodeDecorator.js +37 -0
  430. package/lib/rootNode/rootNodeDecorator/rootNodeDecorator.js.map +1 -0
  431. package/lib/rootNode/rootNodeDecorator.d.ts +33 -0
  432. package/lib/theming/Emotion/Emotion.js +1 -0
  433. package/lib/theming/Emotion/Emotion.js.map +1 -1
  434. package/lib/utils/utils.js +11 -1
  435. package/lib/utils/utils.js.map +1 -1
  436. package/lib/utils.d.ts +3 -0
  437. package/package.json +8 -2
@@ -1,5 +1,4 @@
1
- "use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Indicator = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
2
- var _reactDom = require("react-dom");
1
+ "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.Indicator = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
3
2
  var _lodash = _interopRequireDefault(require("lodash.throttle"));
4
3
 
5
4
  var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
@@ -7,9 +6,10 @@ var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
7
6
  var _ThemeContext = require("../../lib/theming/ThemeContext");
8
7
 
9
8
  var _Emotion = require("../../lib/theming/Emotion");
9
+ var _rootNode = require("../../lib/rootNode");
10
10
 
11
11
  var _Indicator = require("./Indicator.styles");
12
- var _TabsContext = require("./TabsContext");var
12
+ var _TabsContext = require("./TabsContext");var _class, _class2, _temp;var
13
13
 
14
14
 
15
15
 
@@ -24,7 +24,8 @@ var _TabsContext = require("./TabsContext");var
24
24
 
25
25
 
26
26
 
27
- Indicator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Indicator, _React$Component);function Indicator() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
27
+
28
+ Indicator = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Indicator, _React$Component);function Indicator() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
28
29
 
29
30
  context = _this.context;_this.
30
31
 
@@ -39,6 +40,8 @@ Indicator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.defaul
39
40
  null;_this.
40
41
 
41
42
  removeTabUpdatesListener = null;_this.
43
+ setRootNode = void 0;_this.
44
+
42
45
 
43
46
 
44
47
 
@@ -107,31 +110,29 @@ Indicator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.defaul
107
110
  if (stylesUpdated) {
108
111
  _this.setState({ styles: nodeStyles });
109
112
  }
110
- }, 100);return _this;}var _proto = Indicator.prototype;_proto.componentDidMount = function componentDidMount() {this.eventListener = LayoutEvents.addListener(this.reflow);this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);this.reflow();};_proto.componentWillUnmount = function componentWillUnmount() {this.reflow.cancel();if (this.eventListener) {this.eventListener.remove();}if (this.removeTabUpdatesListener) {this.removeTabUpdatesListener();}};_proto.componentDidUpdate = function componentDidUpdate(_, prevState) {this.reflow();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this$context2 = this.context,getTab = _this$context2.getTab,activeTab = _this$context2.activeTab;var node = getTab(activeTab);var indicators = node && node.getIndicators && node.getIndicators() || { error: false, warning: false, success: false, primary: false, disabled: false };return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Indicator.styles.root(this.theme), indicators.primary && _Indicator.styles.primary(this.theme), indicators.success && _Indicator.styles.success(this.theme), indicators.warning && _Indicator.styles.warning(this.theme), indicators.error && _Indicator.styles.error(this.theme), this.props.className), style: this.state.styles });};_proto.
113
+ }, 100);return _this;}var _proto = Indicator.prototype;_proto.componentDidMount = function componentDidMount() {this.eventListener = LayoutEvents.addListener(this.reflow);this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);this.reflow();};_proto.componentWillUnmount = function componentWillUnmount() {this.reflow.cancel();if (this.eventListener) {this.eventListener.remove();}if (this.removeTabUpdatesListener) {this.removeTabUpdatesListener();}};_proto.componentDidUpdate = function componentDidUpdate(_, prevState) {this.reflow();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this$context2 = this.context,getTab = _this$context2.getTab,activeTab = _this$context2.activeTab;var node = getTab(activeTab);var indicators = node && node.getIndicators && node.getIndicators() || { error: false, warning: false, success: false, primary: false, disabled: false };return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Indicator.styles.root(this.theme), indicators.primary && _Indicator.styles.primary(this.theme), indicators.success && _Indicator.styles.success(this.theme), indicators.warning && _Indicator.styles.warning(this.theme), indicators.error && _Indicator.styles.error(this.theme), this.props.className), style: this.state.styles, ref: this.setRootNode });};_proto.
111
114
 
112
115
  getStyles = function getStyles(node) {
113
- if (node instanceof _react.default.Component) {
114
- node = (0, _reactDom.findDOMNode)(node);
115
- }
116
+ var htmlNode = (0, _rootNode.getRootNode)(node);
116
117
 
117
- if (node instanceof HTMLElement) {
118
- var rect = node.getBoundingClientRect();
118
+ if (htmlNode && htmlNode instanceof HTMLElement) {
119
+ var rect = htmlNode.getBoundingClientRect();
119
120
  if (this.props.vertical) {
120
121
  return {
121
122
  width: this.theme.tabBorderWidth,
122
- left: node.offsetLeft,
123
- top: node.offsetTop,
123
+ left: htmlNode.offsetLeft,
124
+ top: htmlNode.offsetTop,
124
125
  height: rect.bottom - rect.top };
125
126
 
126
127
  }
127
128
 
128
129
  var tabBorderWidth = parseInt(this.theme.tabBorderWidth, 10) || 0;
129
130
  return {
130
- left: node.offsetLeft,
131
- top: node.offsetHeight + node.offsetTop - tabBorderWidth,
131
+ left: htmlNode.offsetLeft,
132
+ top: htmlNode.offsetHeight + htmlNode.offsetTop - tabBorderWidth,
132
133
  width: rect.right - rect.left };
133
134
 
134
135
  }
135
136
 
136
137
  return {};
137
- };return Indicator;}(_react.default.Component);exports.Indicator = Indicator;Indicator.contextType = _TabsContext.TabsContext;
138
+ };return Indicator;}(_react.default.Component), _class2.contextType = _TabsContext.TabsContext, _temp)) || _class;exports.Indicator = Indicator;
@@ -1 +1 @@
1
- {"version":3,"sources":["Indicator.tsx"],"names":["Indicator","context","state","styles","theme","eventListener","removeTabUpdatesListener","reflow","getTab","activeTab","node","nodeStyles","getStyles","stylesUpdated","some","prop","setState","componentDidMount","LayoutEvents","addListener","props","tabUpdates","on","componentWillUnmount","cancel","remove","componentDidUpdate","_","prevState","render","renderMain","indicators","getIndicators","error","warning","success","primary","disabled","root","className","React","Component","HTMLElement","rect","getBoundingClientRect","vertical","width","tabBorderWidth","left","offsetLeft","top","offsetTop","height","bottom","parseInt","offsetHeight","right","contextType","TabsContext"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { findDOMNode } from 'react-dom';\nimport throttle from 'lodash.throttle';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './Indicator.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { TabIndicators } from './Tab';\n\nexport interface IndicatorProps {\n className?: string;\n tabUpdates: {\n on: (x0: () => void) => () => void;\n };\n vertical: boolean;\n}\n\nexport interface IndicatorState {\n styles: React.CSSProperties;\n}\n\nexport class Indicator extends React.Component<IndicatorProps, IndicatorState> {\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public state: IndicatorState = {\n styles: {},\n };\n\n private theme!: Theme;\n\n private eventListener: Nullable<{\n remove: () => void;\n }> = null;\n\n private removeTabUpdatesListener: Nullable<() => void> = null;\n\n public componentDidMount() {\n this.eventListener = LayoutEvents.addListener(this.reflow);\n this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);\n this.reflow();\n }\n\n public componentWillUnmount() {\n this.reflow.cancel();\n\n if (this.eventListener) {\n this.eventListener.remove();\n }\n if (this.removeTabUpdatesListener) {\n this.removeTabUpdatesListener();\n }\n }\n\n public componentDidUpdate(_: IndicatorProps, prevState: IndicatorState) {\n this.reflow();\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { getTab, activeTab } = this.context;\n const node = getTab(activeTab);\n const indicators: TabIndicators = (node && node.getIndicators && node.getIndicators()) || {\n error: false,\n warning: false,\n success: false,\n primary: false,\n disabled: false,\n };\n return (\n <div\n className={cx(\n styles.root(this.theme),\n indicators.primary && styles.primary(this.theme),\n indicators.success && styles.success(this.theme),\n indicators.warning && styles.warning(this.theme),\n indicators.error && styles.error(this.theme),\n this.props.className,\n )}\n style={this.state.styles}\n />\n );\n }\n\n private reflow = throttle(() => {\n const { getTab, activeTab } = this.context;\n const node = getTab(activeTab);\n const nodeStyles = this.getStyles(node);\n const stylesUpdated = ['left', 'top', 'width', 'height'].some(\n (prop) => nodeStyles[prop as keyof React.CSSProperties] !== this.state.styles[prop as keyof React.CSSProperties],\n );\n if (stylesUpdated) {\n this.setState({ styles: nodeStyles });\n }\n }, 100);\n\n private getStyles(node: any): React.CSSProperties {\n if (node instanceof React.Component) {\n node = findDOMNode(node);\n }\n\n if (node instanceof HTMLElement) {\n const rect = node.getBoundingClientRect();\n if (this.props.vertical) {\n return {\n width: this.theme.tabBorderWidth,\n left: node.offsetLeft,\n top: node.offsetTop,\n height: rect.bottom - rect.top,\n };\n }\n\n const tabBorderWidth = parseInt(this.theme.tabBorderWidth, 10) || 0;\n return {\n left: node.offsetLeft,\n top: node.offsetHeight + node.offsetTop - tabBorderWidth,\n width: rect.right - rect.left,\n };\n }\n\n return {};\n }\n}\n"]}
1
+ {"version":3,"sources":["Indicator.tsx"],"names":["Indicator","rootNode","context","state","styles","theme","eventListener","removeTabUpdatesListener","setRootNode","reflow","getTab","activeTab","node","nodeStyles","getStyles","stylesUpdated","some","prop","setState","componentDidMount","LayoutEvents","addListener","props","tabUpdates","on","componentWillUnmount","cancel","remove","componentDidUpdate","_","prevState","render","renderMain","indicators","getIndicators","error","warning","success","primary","disabled","root","className","htmlNode","HTMLElement","rect","getBoundingClientRect","vertical","width","tabBorderWidth","left","offsetLeft","top","offsetTop","height","bottom","parseInt","offsetHeight","right","React","Component","contextType","TabsContext"],"mappings":"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","sourcesContent":["import React from 'react';\nimport throttle from 'lodash.throttle';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Indicator.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { TabIndicators } from './Tab';\n\nexport interface IndicatorProps {\n className?: string;\n tabUpdates: {\n on: (x0: () => void) => () => void;\n };\n vertical: boolean;\n}\n\nexport interface IndicatorState {\n styles: React.CSSProperties;\n}\n\n@rootNode\nexport class Indicator extends React.Component<IndicatorProps, IndicatorState> {\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public state: IndicatorState = {\n styles: {},\n };\n\n private theme!: Theme;\n\n private eventListener: Nullable<{\n remove: () => void;\n }> = null;\n\n private removeTabUpdatesListener: Nullable<() => void> = null;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n this.eventListener = LayoutEvents.addListener(this.reflow);\n this.removeTabUpdatesListener = this.props.tabUpdates.on(this.reflow);\n this.reflow();\n }\n\n public componentWillUnmount() {\n this.reflow.cancel();\n\n if (this.eventListener) {\n this.eventListener.remove();\n }\n if (this.removeTabUpdatesListener) {\n this.removeTabUpdatesListener();\n }\n }\n\n public componentDidUpdate(_: IndicatorProps, prevState: IndicatorState) {\n this.reflow();\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { getTab, activeTab } = this.context;\n const node = getTab(activeTab);\n const indicators: TabIndicators = (node && node.getIndicators && node.getIndicators()) || {\n error: false,\n warning: false,\n success: false,\n primary: false,\n disabled: false,\n };\n return (\n <div\n className={cx(\n styles.root(this.theme),\n indicators.primary && styles.primary(this.theme),\n indicators.success && styles.success(this.theme),\n indicators.warning && styles.warning(this.theme),\n indicators.error && styles.error(this.theme),\n this.props.className,\n )}\n style={this.state.styles}\n ref={this.setRootNode}\n />\n );\n }\n\n private reflow = throttle(() => {\n const { getTab, activeTab } = this.context;\n const node = getTab(activeTab);\n const nodeStyles = this.getStyles(node);\n const stylesUpdated = ['left', 'top', 'width', 'height'].some(\n (prop) => nodeStyles[prop as keyof React.CSSProperties] !== this.state.styles[prop as keyof React.CSSProperties],\n );\n if (stylesUpdated) {\n this.setState({ styles: nodeStyles });\n }\n }, 100);\n\n private getStyles(node: any): React.CSSProperties {\n const htmlNode = getRootNode(node);\n\n if (htmlNode && htmlNode instanceof HTMLElement) {\n const rect = htmlNode.getBoundingClientRect();\n if (this.props.vertical) {\n return {\n width: this.theme.tabBorderWidth,\n left: htmlNode.offsetLeft,\n top: htmlNode.offsetTop,\n height: rect.bottom - rect.top,\n };\n }\n\n const tabBorderWidth = parseInt(this.theme.tabBorderWidth, 10) || 0;\n return {\n left: htmlNode.offsetLeft,\n top: htmlNode.offsetHeight + htmlNode.offsetTop - tabBorderWidth,\n width: rect.right - rect.left,\n };\n }\n\n return {};\n }\n}\n"]}
@@ -96,7 +96,8 @@ export declare class Tab<T extends string = string> extends React.Component<TabP
96
96
  state: TabState;
97
97
  private theme;
98
98
  private tabComponent;
99
- UNSAFE_componentWillMount(): void;
99
+ private setRootNode;
100
+ constructor(props: TabProps<T>);
100
101
  componentDidMount(): void;
101
102
  componentDidUpdate(): void;
102
103
  componentWillUnmount(): void;
@@ -1,4 +1,4 @@
1
- "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Tab = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
1
+ "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Tab = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
2
2
  var _propTypes = _interopRequireDefault(require("prop-types"));
3
3
  var _invariant = _interopRequireDefault(require("invariant"));
4
4
 
@@ -11,9 +11,10 @@ var _ThemeContext = require("../../lib/theming/ThemeContext");
11
11
 
12
12
  var _CommonWrapper = require("../../internal/CommonWrapper");
13
13
  var _Emotion = require("../../lib/theming/Emotion");
14
+ var _rootNode = require("../../lib/rootNode");
14
15
 
15
16
  var _TabsContext = require("./TabsContext");
16
- var _Tab = require("./Tab.styles");
17
+ var _Tab = require("./Tab.styles");var _class, _class2, _temp;
17
18
 
18
19
 
19
20
 
@@ -104,11 +105,10 @@ var _Tab = require("./Tab.styles");
104
105
  *
105
106
  * Works only inside Tabs component, otherwise throws
106
107
  */var
107
- Tab = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tab, _React$Component);function Tab() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
108
108
 
109
+ Tab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tab, _React$Component);
109
110
 
110
111
 
111
- context = _this.context;_this.
112
112
 
113
113
 
114
114
 
@@ -123,12 +123,8 @@ Tab = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tab
123
123
 
124
124
 
125
125
 
126
- state = {
127
- focusedByKeyboard: false };_this.
128
126
 
129
127
 
130
- theme = void 0;_this.
131
- tabComponent = null;_this.
132
128
 
133
129
 
134
130
 
@@ -137,6 +133,14 @@ Tab = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tab
137
133
 
138
134
 
139
135
 
136
+ function Tab(props) {var _this;
137
+ _this = _React$Component.call(this, props) || this;_this.context = _this.context;_this.state = { focusedByKeyboard: false };_this.theme = void 0;_this.tabComponent = null;_this.setRootNode = void 0;_this.
138
+
139
+
140
+
141
+
142
+
143
+
140
144
 
141
145
 
142
146
 
@@ -301,4 +305,4 @@ Tab = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tab
301
305
  }
302
306
 
303
307
  _this.setState({ focusedByKeyboard: false });
304
- };return _this;}var _proto = Tab.prototype;_proto.UNSAFE_componentWillMount = function UNSAFE_componentWillMount() {(0, _invariant.default)(this.context !== _TabsContext.TabsContextDefaultValue, 'Tab should be placed inside Tabs component');};_proto.componentDidMount = function componentDidMount() {var id = this.getId();if (typeof id === 'string') {this.context.addTab(id, this.getTabInstance);}};_proto.componentDidUpdate = function componentDidUpdate() {if (this.context.activeTab === this.props.id) {this.context.notifyUpdate();}};_proto.componentWillUnmount = function componentWillUnmount() {var id = this.getId();if (typeof id === 'string') {this.context.removeTab(id);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.getIndicators = function getIndicators() {return { error: Boolean(this.props.error), warning: Boolean(this.props.warning), success: Boolean(this.props.success), primary: Boolean(this.props.primary), disabled: Boolean(this.props.disabled) };};_proto.renderMain = function renderMain() {var _cx;var _this$props = this.props,children = _this$props.children,disabled = _this$props.disabled,error = _this$props.error,warning = _this$props.warning,success = _this$props.success,primary = _this$props.primary,_this$props$component = _this$props.component,Component = _this$props$component === void 0 ? Tab.defaultProps.component : _this$props$component,href = _this$props.href;var isActive = false;var isVertical = false;var id = this.getId();if (typeof id === 'string') {isActive = this.context.activeTab === this.getId();isVertical = this.context.vertical;}var orientationStyles = isVertical ? _Tab.verticalStyles : _Tab.horizontalStyles;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(Component, { className: (0, _Emotion.cx)((_cx = {}, _cx[_Tab.styles.root(this.theme)] = true, _cx[_Tab.styles.vertical(this.theme)] = !!isVertical, _cx[orientationStyles.primary(this.theme)] = !!primary, _cx[orientationStyles.success(this.theme)] = !!success, _cx[orientationStyles.warning(this.theme)] = !!warning, _cx[orientationStyles.error(this.theme)] = !!error, _cx[_Tab.styles.active()] = !!isActive, _cx[orientationStyles.active(this.theme)] = !!isActive, _cx[_Tab.styles.disabled(this.theme)] = !!disabled, _cx[orientationStyles.disabled()] = !!disabled, _cx)), onBlur: this.handleBlur, onClick: this.switchTab, onFocus: this.handleFocus, onKeyDown: this.handleKeyDown, tabIndex: disabled ? -1 : 0, ref: (0, _utils.isFunctionalComponent)(Component) ? null : this.refTabComponent, href: href }, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: this.context.notifyUpdate }, children), this.state.focusedByKeyboard && /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Tab.styles.focus(this.theme), _Tab.globalClasses.focus) })));};return Tab;}(_react.default.Component);exports.Tab = Tab;Tab.__KONTUR_REACT_UI__ = 'Tab';Tab.contextType = _TabsContext.TabsContext;Tab.propTypes = { children: _propTypes.default.node, disabled: _propTypes.default.bool, href: _propTypes.default.string.isRequired, onClick: _propTypes.default.func, onKeyDown: _propTypes.default.func };Tab.defaultProps = { component: 'a', href: '' };
308
+ };(0, _invariant.default)(_this.context !== _TabsContext.TabsContextDefaultValue, 'Tab should be placed inside Tabs component');return _this;}var _proto = Tab.prototype;_proto.componentDidMount = function componentDidMount() {var id = this.getId();if (typeof id === 'string') {this.context.addTab(id, this.getTabInstance);}};_proto.componentDidUpdate = function componentDidUpdate() {if (this.context.activeTab === this.props.id) {this.context.notifyUpdate();}};_proto.componentWillUnmount = function componentWillUnmount() {var id = this.getId();if (typeof id === 'string') {this.context.removeTab(id);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.getIndicators = function getIndicators() {return { error: Boolean(this.props.error), warning: Boolean(this.props.warning), success: Boolean(this.props.success), primary: Boolean(this.props.primary), disabled: Boolean(this.props.disabled) };};_proto.renderMain = function renderMain() {var _cx;var _this$props = this.props,children = _this$props.children,disabled = _this$props.disabled,error = _this$props.error,warning = _this$props.warning,success = _this$props.success,primary = _this$props.primary,_this$props$component = _this$props.component,Component = _this$props$component === void 0 ? Tab.defaultProps.component : _this$props$component,href = _this$props.href;var isActive = false;var isVertical = false;var id = this.getId();if (typeof id === 'string') {isActive = this.context.activeTab === this.getId();isVertical = this.context.vertical;}var orientationStyles = isVertical ? _Tab.verticalStyles : _Tab.horizontalStyles;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(Component, { className: (0, _Emotion.cx)((_cx = {}, _cx[_Tab.styles.root(this.theme)] = true, _cx[_Tab.styles.vertical(this.theme)] = !!isVertical, _cx[orientationStyles.primary(this.theme)] = !!primary, _cx[orientationStyles.success(this.theme)] = !!success, _cx[orientationStyles.warning(this.theme)] = !!warning, _cx[orientationStyles.error(this.theme)] = !!error, _cx[_Tab.styles.active()] = !!isActive, _cx[orientationStyles.active(this.theme)] = !!isActive, _cx[_Tab.styles.disabled(this.theme)] = !!disabled, _cx[orientationStyles.disabled()] = !!disabled, _cx)), onBlur: this.handleBlur, onClick: this.switchTab, onFocus: this.handleFocus, onKeyDown: this.handleKeyDown, tabIndex: disabled ? -1 : 0, ref: (0, _utils.isFunctionalComponent)(Component) ? null : this.refTabComponent, href: href }, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: this.context.notifyUpdate }, children), this.state.focusedByKeyboard && /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Tab.styles.focus(this.theme), _Tab.globalClasses.focus) })));};return Tab;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Tab', _class2.contextType = _TabsContext.TabsContext, _class2.propTypes = { children: _propTypes.default.node, disabled: _propTypes.default.bool, href: _propTypes.default.string.isRequired, onClick: _propTypes.default.func, onKeyDown: _propTypes.default.func }, _class2.defaultProps = { component: 'a', href: '' }, _temp)) || _class;exports.Tab = Tab;
@@ -1 +1 @@
1
- {"version":3,"sources":["Tab.tsx"],"names":["Tab","context","state","focusedByKeyboard","theme","tabComponent","getUnderlyingNode","getId","props","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","onClick","defaultPrevented","component","handleKeyDown","e","onKeyDown","delta","shiftFocus","handleFocus","requestAnimationFrame","keyListener","isTabPressed","isArrowPressed","setState","handleBlur","UNSAFE_componentWillMount","TabsContextDefaultValue","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","renderMain","getIndicators","error","Boolean","warning","success","primary","children","Component","defaultProps","isActive","isVertical","vertical","orientationStyles","verticalStyles","horizontalStyles","styles","root","active","focus","globalClasses","React","__KONTUR_REACT_UI__","contextType","TabsContext","propTypes","PropTypes","node","bool","string","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport invariant from 'invariant';\n\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunctionalComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { TabsContext, TabsContextType, TabsContextDefaultValue } from './TabsContext';\nimport { styles, horizontalStyles, verticalStyles, globalClasses } from './Tab.styles';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport interface TabProps<T extends string = string> extends CommonProps {\n /**\n * Tab content\n */\n children?: React.ReactNode;\n\n /**\n * Component to use as a tab\n */\n component?: React.ComponentType<any> | string;\n\n /**\n * Link href\n */\n href?: string;\n\n /**\n * Tab identifier\n */\n id?: T;\n\n /**\n * Click event\n */\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /**\n * Click event\n */\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /**\n * Disabled indicator\n */\n disabled?: boolean;\n\n /**\n * Cостояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Cостояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * Success indicator\n */\n success?: boolean;\n\n /**\n * Primary indicator\n */\n primary?: boolean;\n\n /**\n * Style property\n */\n style?: React.CSSProperties;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\n/**\n * Tab element of Tabs component\n *\n * Can be used for creating custom tabs\n * ```js\n *\n * const RouteTab = (props) => (\n * <Tab id={props.to} component={RouteLink} {...props}/>\n * )\n *\n * const MyAwesomeTab = (props) => <Tab id={props.id}>8) {props.children}</Tab>\n * ```\n *\n * Works only inside Tabs component, otherwise throws\n */\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n href: PropTypes.string.isRequired,\n onClick: PropTypes.func,\n onKeyDown: PropTypes.func,\n };\n\n public static defaultProps = {\n component: 'a',\n href: '',\n };\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n\n public UNSAFE_componentWillMount() {\n invariant(this.context !== TabsContextDefaultValue, 'Tab should be placed inside Tabs component');\n }\n\n public componentDidMount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.addTab(id, this.getTabInstance);\n }\n }\n\n public componentDidUpdate() {\n if (this.context.activeTab === this.props.id) {\n this.context.notifyUpdate();\n }\n }\n\n public componentWillUnmount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.removeTab(id);\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getIndicators() {\n return {\n error: Boolean(this.props.error),\n warning: Boolean(this.props.warning),\n success: Boolean(this.props.success),\n primary: Boolean(this.props.primary),\n disabled: Boolean(this.props.disabled),\n };\n }\n\n public getUnderlyingNode = () => this.tabComponent;\n\n private renderMain() {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n component: Component = Tab.defaultProps.component,\n href,\n } = this.props;\n\n let isActive = false;\n let isVertical = false;\n\n const id = this.getId();\n if (typeof id === 'string') {\n isActive = this.context.activeTab === this.getId();\n isVertical = this.context.vertical;\n }\n const orientationStyles = isVertical ? verticalStyles : horizontalStyles;\n\n return (\n <CommonWrapper {...this.props}>\n <Component\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.vertical(this.theme)]: !!isVertical,\n [orientationStyles.primary(this.theme)]: !!primary,\n [orientationStyles.success(this.theme)]: !!success,\n [orientationStyles.warning(this.theme)]: !!warning,\n [orientationStyles.error(this.theme)]: !!error,\n [styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [styles.disabled(this.theme)]: !!disabled,\n [orientationStyles.disabled()]: !!disabled,\n })}\n onBlur={this.handleBlur}\n onClick={this.switchTab}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n tabIndex={disabled ? -1 : 0}\n ref={isFunctionalComponent(Component) ? null : this.refTabComponent}\n href={href}\n >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && <div className={cx(styles.focus(this.theme), globalClasses.focus)} />}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id || this.props.href;\n\n private refTabComponent = (instance: React.ReactElement<any>) => {\n this.tabComponent = instance;\n };\n\n private getTabInstance = () => this;\n\n private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n if (this.props.disabled) {\n event.preventDefault();\n return;\n }\n\n const id = this.props.id || this.props.href;\n if (this.props.onClick) {\n this.props.onClick(event);\n if (event.defaultPrevented) {\n return;\n }\n }\n if (typeof id === 'string') {\n this.context.switchTab(id);\n }\n if (this.props.component === 'a' && !this.props.href) {\n event.preventDefault();\n }\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n if (e.defaultPrevented) {\n return;\n }\n }\n const id = this.getId();\n if (typeof id !== 'string') {\n return;\n }\n if (!isKeyArrow(e)) {\n return;\n }\n e.preventDefault();\n const delta = isKeyArrowLeft(e) || isKeyArrowUp(e) ? -1 : 1;\n this.context.shiftFocus(id, delta);\n };\n\n private handleFocus = () => {\n if (this.props.disabled) {\n return;\n }\n\n // focus event fires before keyDown eventlistener\n // so we should check focusKeyPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed || keyListener.isArrowPressed) {\n this.setState({ focusedByKeyboard: true });\n }\n });\n };\n\n private handleBlur = () => {\n if (this.props.disabled) {\n return;\n }\n\n this.setState({ focusedByKeyboard: false });\n };\n}\n"]}
1
+ {"version":3,"sources":["Tab.tsx"],"names":["Tab","rootNode","props","context","state","focusedByKeyboard","theme","tabComponent","setRootNode","getUnderlyingNode","getId","id","href","refTabComponent","instance","getTabInstance","switchTab","event","disabled","preventDefault","onClick","defaultPrevented","component","handleKeyDown","e","onKeyDown","delta","shiftFocus","handleFocus","requestAnimationFrame","keyListener","isTabPressed","isArrowPressed","setState","handleBlur","TabsContextDefaultValue","componentDidMount","addTab","componentDidUpdate","activeTab","notifyUpdate","componentWillUnmount","removeTab","render","renderMain","getIndicators","error","Boolean","warning","success","primary","children","Component","defaultProps","isActive","isVertical","vertical","orientationStyles","verticalStyles","horizontalStyles","styles","root","active","focus","globalClasses","React","__KONTUR_REACT_UI__","contextType","TabsContext","propTypes","PropTypes","node","bool","string","isRequired","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport invariant from 'invariant';\n\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isKeyArrow, isKeyArrowLeft, isKeyArrowUp } from '../../lib/events/keyboard/identifiers';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunctionalComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { TabsContext, TabsContextType, TabsContextDefaultValue } from './TabsContext';\nimport { styles, horizontalStyles, verticalStyles, globalClasses } from './Tab.styles';\n\nexport interface TabIndicators {\n error: boolean;\n warning: boolean;\n success: boolean;\n primary: boolean;\n disabled: boolean;\n}\n\nexport interface TabProps<T extends string = string> extends CommonProps {\n /**\n * Tab content\n */\n children?: React.ReactNode;\n\n /**\n * Component to use as a tab\n */\n component?: React.ComponentType<any> | string;\n\n /**\n * Link href\n */\n href?: string;\n\n /**\n * Tab identifier\n */\n id?: T;\n\n /**\n * Click event\n */\n onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n\n /**\n * Click event\n */\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n /**\n * Disabled indicator\n */\n disabled?: boolean;\n\n /**\n * Cостояние валидации при ошибке.\n */\n error?: boolean;\n\n /**\n * Cостояние валидации при предупреждении.\n */\n warning?: boolean;\n\n /**\n * Success indicator\n */\n success?: boolean;\n\n /**\n * Primary indicator\n */\n primary?: boolean;\n\n /**\n * Style property\n */\n style?: React.CSSProperties;\n}\n\nexport interface TabState {\n focusedByKeyboard: boolean;\n}\n\n/**\n * Tab element of Tabs component\n *\n * Can be used for creating custom tabs\n * ```js\n *\n * const RouteTab = (props) => (\n * <Tab id={props.to} component={RouteLink} {...props}/>\n * )\n *\n * const MyAwesomeTab = (props) => <Tab id={props.id}>8) {props.children}</Tab>\n * ```\n *\n * Works only inside Tabs component, otherwise throws\n */\n@rootNode\nexport class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {\n public static __KONTUR_REACT_UI__ = 'Tab';\n\n public static contextType = TabsContext;\n public context: TabsContextType = this.context;\n\n public static propTypes = {\n children: PropTypes.node,\n disabled: PropTypes.bool,\n href: PropTypes.string.isRequired,\n onClick: PropTypes.func,\n onKeyDown: PropTypes.func,\n };\n\n public static defaultProps = {\n component: 'a',\n href: '',\n };\n\n public state: TabState = {\n focusedByKeyboard: false,\n };\n\n private theme!: Theme;\n private tabComponent: Nullable<React.ReactElement<Tab<T>>> = null;\n private setRootNode!: TSetRootNode;\n\n constructor(props: TabProps<T>) {\n super(props);\n invariant(this.context !== TabsContextDefaultValue, 'Tab should be placed inside Tabs component');\n }\n\n public componentDidMount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.addTab(id, this.getTabInstance);\n }\n }\n\n public componentDidUpdate() {\n if (this.context.activeTab === this.props.id) {\n this.context.notifyUpdate();\n }\n }\n\n public componentWillUnmount() {\n const id = this.getId();\n if (typeof id === 'string') {\n this.context.removeTab(id);\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n public getIndicators() {\n return {\n error: Boolean(this.props.error),\n warning: Boolean(this.props.warning),\n success: Boolean(this.props.success),\n primary: Boolean(this.props.primary),\n disabled: Boolean(this.props.disabled),\n };\n }\n\n public getUnderlyingNode = () => this.tabComponent;\n\n private renderMain() {\n const {\n children,\n disabled,\n error,\n warning,\n success,\n primary,\n component: Component = Tab.defaultProps.component,\n href,\n } = this.props;\n\n let isActive = false;\n let isVertical = false;\n\n const id = this.getId();\n if (typeof id === 'string') {\n isActive = this.context.activeTab === this.getId();\n isVertical = this.context.vertical;\n }\n const orientationStyles = isVertical ? verticalStyles : horizontalStyles;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <Component\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.vertical(this.theme)]: !!isVertical,\n [orientationStyles.primary(this.theme)]: !!primary,\n [orientationStyles.success(this.theme)]: !!success,\n [orientationStyles.warning(this.theme)]: !!warning,\n [orientationStyles.error(this.theme)]: !!error,\n [styles.active()]: !!isActive,\n [orientationStyles.active(this.theme)]: !!isActive,\n [styles.disabled(this.theme)]: !!disabled,\n [orientationStyles.disabled()]: !!disabled,\n })}\n onBlur={this.handleBlur}\n onClick={this.switchTab}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n tabIndex={disabled ? -1 : 0}\n ref={isFunctionalComponent(Component) ? null : this.refTabComponent}\n href={href}\n >\n <ResizeDetector onResize={this.context.notifyUpdate}>{children}</ResizeDetector>\n {this.state.focusedByKeyboard && <div className={cx(styles.focus(this.theme), globalClasses.focus)} />}\n </Component>\n </CommonWrapper>\n );\n }\n\n private getId = () => this.props.id || this.props.href;\n\n private refTabComponent = (instance: React.ReactElement<any>) => {\n this.tabComponent = instance;\n };\n\n private getTabInstance = () => this;\n\n private switchTab = (event: React.MouseEvent<HTMLElement>) => {\n if (this.props.disabled) {\n event.preventDefault();\n return;\n }\n\n const id = this.props.id || this.props.href;\n if (this.props.onClick) {\n this.props.onClick(event);\n if (event.defaultPrevented) {\n return;\n }\n }\n if (typeof id === 'string') {\n this.context.switchTab(id);\n }\n if (this.props.component === 'a' && !this.props.href) {\n event.preventDefault();\n }\n };\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (this.props.disabled) {\n return;\n }\n\n if (this.props.onKeyDown) {\n this.props.onKeyDown(e);\n if (e.defaultPrevented) {\n return;\n }\n }\n const id = this.getId();\n if (typeof id !== 'string') {\n return;\n }\n if (!isKeyArrow(e)) {\n return;\n }\n e.preventDefault();\n const delta = isKeyArrowLeft(e) || isKeyArrowUp(e) ? -1 : 1;\n this.context.shiftFocus(id, delta);\n };\n\n private handleFocus = () => {\n if (this.props.disabled) {\n return;\n }\n\n // focus event fires before keyDown eventlistener\n // so we should check focusKeyPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed || keyListener.isArrowPressed) {\n this.setState({ focusedByKeyboard: true });\n }\n });\n };\n\n private handleBlur = () => {\n if (this.props.disabled) {\n return;\n }\n\n this.setState({ focusedByKeyboard: false });\n };\n}\n"]}
@@ -51,6 +51,7 @@ export declare class Tabs<T extends string = string> extends React.Component<Tab
51
51
  private tabs;
52
52
  private tabUpdates;
53
53
  private listeners;
54
+ private setRootNode;
54
55
  render(): JSX.Element;
55
56
  private shiftFocus;
56
57
  private notifyUpdate;
@@ -1,16 +1,17 @@
1
- "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Tabs = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
2
- var _reactDom = require("react-dom");
1
+ "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Tabs = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
3
2
  var _propTypes = _interopRequireDefault(require("prop-types"));
4
3
 
5
4
  var _ThemeContext = require("../../lib/theming/ThemeContext");
6
5
 
7
6
  var _CommonWrapper = require("../../internal/CommonWrapper");
8
7
  var _Emotion = require("../../lib/theming/Emotion");
8
+ var _getRootNode = require("../../lib/rootNode/getRootNode");
9
+ var _rootNode = require("../../lib/rootNode");
9
10
 
10
11
  var _Indicator = require("./Indicator");
11
12
  var _Tabs = require("./Tabs.styles");
12
13
  var _TabsContext = require("./TabsContext");
13
- var _Tab = require("./Tab");
14
+ var _Tab = require("./Tab");var _class, _class2, _temp;
14
15
 
15
16
 
16
17
 
@@ -50,7 +51,8 @@ var _Tab = require("./Tab");
50
51
  *
51
52
  * contains static property `Tab`
52
53
  */var
53
- Tabs = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tabs, _React$Component);function Tabs() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
54
+
55
+ Tabs = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Tabs, _React$Component);function Tabs() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
54
56
 
55
57
 
56
58
 
@@ -83,6 +85,7 @@ Tabs = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Ta
83
85
 
84
86
 
85
87
  listeners = [];_this.
88
+ setRootNode = void 0;_this.
86
89
 
87
90
 
88
91
 
@@ -124,10 +127,7 @@ Tabs = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Ta
124
127
  var tab = tabs[newIndex];
125
128
 
126
129
  var tabNode = tab.getNode();
127
- var htmlNode = null;
128
- if (tabNode instanceof _react.default.Component) {
129
- htmlNode = (0, _reactDom.findDOMNode)(tabNode);
130
- }
130
+ var htmlNode = (0, _getRootNode.getRootNode)(tabNode);
131
131
 
132
132
  if (htmlNode && htmlNode instanceof HTMLElement && typeof htmlNode.focus === 'function') {
133
133
  htmlNode.focus();
@@ -156,4 +156,4 @@ Tabs = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Ta
156
156
 
157
157
  removeTab = function (id) {
158
158
  _this.tabs = _this.tabs.filter(function (tab) {return tab.id !== id;});
159
- };return _this;}var _proto = Tabs.prototype;_proto.render = function render() {var _this2 = this;var _this$props2 = this.props,vertical = _this$props2.vertical,value = _this$props2.value,width = _this$props2.width,children = _this$props2.children,indicatorClassName = _this$props2.indicatorClassName;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, _this2.props, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Tabs.styles.root(_this2.theme), vertical && _Tabs.styles.vertical()), style: { width: width } }, /*#__PURE__*/_react.default.createElement(_TabsContext.TabsContext.Provider, { value: { vertical: vertical, activeTab: value, getTab: _this2.getTab, addTab: _this2.addTab, removeTab: _this2.removeTab, notifyUpdate: _this2.notifyUpdate, shiftFocus: _this2.shiftFocus, switchTab: _this2.switchTab } }, children, /*#__PURE__*/_react.default.createElement(_Indicator.Indicator, { className: indicatorClassName, tabUpdates: _this2.tabUpdates, vertical: vertical }))));});};return Tabs;}(_react.default.Component);exports.Tabs = Tabs;Tabs.__KONTUR_REACT_UI__ = 'Tabs';Tabs.propTypes = { children: _propTypes.default.node, indicatorClassName: _propTypes.default.string, value: _propTypes.default.string.isRequired, vertical: _propTypes.default.bool, width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]) };Tabs.defaultProps = { vertical: false };Tabs.Tab = _Tab.Tab;
159
+ };return _this;}var _proto = Tabs.prototype;_proto.render = function render() {var _this2 = this;var _this$props2 = this.props,vertical = _this$props2.vertical,value = _this$props2.value,width = _this$props2.width,children = _this$props2.children,indicatorClassName = _this$props2.indicatorClassName;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.props), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Tabs.styles.root(_this2.theme), vertical && _Tabs.styles.vertical()), style: { width: width } }, /*#__PURE__*/_react.default.createElement(_TabsContext.TabsContext.Provider, { value: { vertical: vertical, activeTab: value, getTab: _this2.getTab, addTab: _this2.addTab, removeTab: _this2.removeTab, notifyUpdate: _this2.notifyUpdate, shiftFocus: _this2.shiftFocus, switchTab: _this2.switchTab } }, children, /*#__PURE__*/_react.default.createElement(_Indicator.Indicator, { className: indicatorClassName, tabUpdates: _this2.tabUpdates, vertical: vertical }))));});};return Tabs;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Tabs', _class2.propTypes = { children: _propTypes.default.node, indicatorClassName: _propTypes.default.string, value: _propTypes.default.string.isRequired, vertical: _propTypes.default.bool, width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]) }, _class2.defaultProps = { vertical: false }, _class2.Tab = _Tab.Tab, _temp)) || _class;exports.Tabs = Tabs;
@@ -1 +1 @@
1
- {"version":3,"sources":["Tabs.tsx"],"names":["Tabs","theme","tabs","tabUpdates","on","cb","index","listeners","push","splice","shiftFocus","fromTab","delta","findIndex","x","id","newIndex","Math","max","min","length","tab","tabNode","getNode","htmlNode","React","Component","HTMLElement","focus","notifyUpdate","forEach","switchTab","props","onValueChange","value","getTab","find","addTab","concat","removeTab","filter","render","vertical","width","children","indicatorClassName","styles","root","activeTab","__KONTUR_REACT_UI__","propTypes","PropTypes","node","string","isRequired","bool","oneOfType","number","defaultProps","Tab"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { findDOMNode } from 'react-dom';\nimport PropTypes from 'prop-types';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { Indicator } from './Indicator';\nimport { styles } from './Tabs.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { Tab } from './Tab';\n\nexport interface TabsProps<T extends string = string> extends CommonProps {\n /**\n * Tab component should be child of Tabs component\n */\n children?: React.ReactNode;\n\n /**\n * Classname of indicator\n */\n indicatorClassName?: string;\n\n /**\n * Tabs change event\n */\n onValueChange?: (value: T) => void;\n\n /**\n * Active tab identifier\n */\n value: T;\n\n /**\n * Vertical indicator\n * @default false\n */\n vertical: boolean;\n\n /**\n * Width of tabs container\n */\n width?: number | string;\n}\n\n/**\n * Tabs wrapper\n *\n * contains static property `Tab`\n */\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n\n public static propTypes = {\n children: PropTypes.node,\n indicatorClassName: PropTypes.string,\n value: PropTypes.string.isRequired,\n vertical: PropTypes.bool,\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n };\n public static defaultProps = {\n vertical: false,\n };\n\n public static Tab = Tab;\n\n private theme!: Theme;\n\n private tabs: Array<{\n getNode: () => Tab<T> | null;\n id: T;\n }> = [];\n\n private tabUpdates = {\n on: (cb: () => void) => {\n const index = this.listeners.push(cb);\n return () => {\n this.listeners.splice(index, 1);\n };\n },\n };\n\n private listeners: Array<() => void> = [];\n\n public render(): JSX.Element {\n const { vertical, value, width, children, indicatorClassName } = this.props;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper {...this.props}>\n <div className={cx(styles.root(this.theme), vertical && styles.vertical())} style={{ width }}>\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\n getTab: this.getTab,\n addTab: this.addTab,\n removeTab: this.removeTab,\n notifyUpdate: this.notifyUpdate,\n shiftFocus: this.shiftFocus,\n switchTab: this.switchTab,\n }}\n >\n {children}\n <Indicator className={indicatorClassName} tabUpdates={this.tabUpdates} vertical={vertical} />\n </TabsContext.Provider>\n </div>\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private shiftFocus: TabsContextType<T>['shiftFocus'] = (fromTab, delta) => {\n const { tabs } = this;\n const index = tabs.findIndex((x) => x.id === fromTab);\n const newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));\n const tab = tabs[newIndex];\n\n const tabNode = tab.getNode();\n let htmlNode = null;\n if (tabNode instanceof React.Component) {\n htmlNode = findDOMNode(tabNode);\n }\n\n if (htmlNode && htmlNode instanceof HTMLElement && typeof htmlNode.focus === 'function') {\n htmlNode.focus();\n }\n };\n\n private notifyUpdate: TabsContextType<T>['notifyUpdate'] = () => {\n this.listeners.forEach((cb) => cb());\n };\n\n private switchTab: TabsContextType<T>['switchTab'] = (id) => {\n const { onValueChange, value } = this.props;\n if (id !== value && onValueChange) {\n onValueChange(id);\n }\n };\n\n private getTab: TabsContextType<T>['getTab'] = (id) => {\n const { getNode = null } = this.tabs.find((x) => x.id === id) || {};\n return getNode && getNode();\n };\n\n private addTab: TabsContextType<T>['addTab'] = (id, getNode) => {\n this.tabs = this.tabs.concat({ id, getNode });\n };\n\n private removeTab: TabsContextType<T>['removeTab'] = (id) => {\n this.tabs = this.tabs.filter((tab) => tab.id !== id);\n };\n}\n"]}
1
+ {"version":3,"sources":["Tabs.tsx"],"names":["Tabs","rootNode","theme","tabs","tabUpdates","on","cb","index","listeners","push","splice","setRootNode","shiftFocus","fromTab","delta","findIndex","x","id","newIndex","Math","max","min","length","tab","tabNode","getNode","htmlNode","HTMLElement","focus","notifyUpdate","forEach","switchTab","props","onValueChange","value","getTab","find","addTab","concat","removeTab","filter","render","vertical","width","children","indicatorClassName","styles","root","activeTab","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","node","string","isRequired","bool","oneOfType","number","defaultProps","Tab"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode } from '../../lib/rootNode/getRootNode';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { Indicator } from './Indicator';\nimport { styles } from './Tabs.styles';\nimport { TabsContext, TabsContextType } from './TabsContext';\nimport { Tab } from './Tab';\n\nexport interface TabsProps<T extends string = string> extends CommonProps {\n /**\n * Tab component should be child of Tabs component\n */\n children?: React.ReactNode;\n\n /**\n * Classname of indicator\n */\n indicatorClassName?: string;\n\n /**\n * Tabs change event\n */\n onValueChange?: (value: T) => void;\n\n /**\n * Active tab identifier\n */\n value: T;\n\n /**\n * Vertical indicator\n * @default false\n */\n vertical: boolean;\n\n /**\n * Width of tabs container\n */\n width?: number | string;\n}\n\n/**\n * Tabs wrapper\n *\n * contains static property `Tab`\n */\n@rootNode\nexport class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {\n public static __KONTUR_REACT_UI__ = 'Tabs';\n\n public static propTypes = {\n children: PropTypes.node,\n indicatorClassName: PropTypes.string,\n value: PropTypes.string.isRequired,\n vertical: PropTypes.bool,\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n };\n public static defaultProps = {\n vertical: false,\n };\n\n public static Tab = Tab;\n\n private theme!: Theme;\n\n private tabs: Array<{\n getNode: () => Tab<T> | null;\n id: T;\n }> = [];\n\n private tabUpdates = {\n on: (cb: () => void) => {\n const index = this.listeners.push(cb);\n return () => {\n this.listeners.splice(index, 1);\n };\n },\n };\n\n private listeners: Array<() => void> = [];\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n const { vertical, value, width, children, indicatorClassName } = this.props;\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={cx(styles.root(this.theme), vertical && styles.vertical())} style={{ width }}>\n <TabsContext.Provider\n value={{\n vertical,\n activeTab: value,\n getTab: this.getTab,\n addTab: this.addTab,\n removeTab: this.removeTab,\n notifyUpdate: this.notifyUpdate,\n shiftFocus: this.shiftFocus,\n switchTab: this.switchTab,\n }}\n >\n {children}\n <Indicator className={indicatorClassName} tabUpdates={this.tabUpdates} vertical={vertical} />\n </TabsContext.Provider>\n </div>\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private shiftFocus: TabsContextType<T>['shiftFocus'] = (fromTab, delta) => {\n const { tabs } = this;\n const index = tabs.findIndex((x) => x.id === fromTab);\n const newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));\n const tab = tabs[newIndex];\n\n const tabNode = tab.getNode();\n const htmlNode = getRootNode(tabNode);\n\n if (htmlNode && htmlNode instanceof HTMLElement && typeof htmlNode.focus === 'function') {\n htmlNode.focus();\n }\n };\n\n private notifyUpdate: TabsContextType<T>['notifyUpdate'] = () => {\n this.listeners.forEach((cb) => cb());\n };\n\n private switchTab: TabsContextType<T>['switchTab'] = (id) => {\n const { onValueChange, value } = this.props;\n if (id !== value && onValueChange) {\n onValueChange(id);\n }\n };\n\n private getTab: TabsContextType<T>['getTab'] = (id) => {\n const { getNode = null } = this.tabs.find((x) => x.id === id) || {};\n return getNode && getNode();\n };\n\n private addTab: TabsContextType<T>['addTab'] = (id, getNode) => {\n this.tabs = this.tabs.concat({ id, getNode });\n };\n\n private removeTab: TabsContextType<T>['removeTab'] = (id) => {\n this.tabs = this.tabs.filter((tab) => tab.id !== id);\n };\n}\n"]}
@@ -143,6 +143,7 @@ export declare class Textarea extends React.Component<TextareaProps, TextareaSta
143
143
  private counter;
144
144
  private layoutEvents;
145
145
  private textareaObserver;
146
+ private setRootNode;
146
147
  private getAutoResizeThrottleWait;
147
148
  private isAnimationsDisabled;
148
149
  componentDidMount(): void;
@@ -1,4 +1,4 @@
1
- "use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Textarea = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
1
+ "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.Textarea = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
2
2
  var _propTypes = _interopRequireDefault(require("prop-types"));
3
3
  var _lodash = _interopRequireDefault(require("lodash.throttle"));
4
4
  var _raf = _interopRequireDefault(require("raf"));
@@ -15,10 +15,11 @@ var _client = require("../../lib/client");
15
15
  var _CommonWrapper = require("../../internal/CommonWrapper");
16
16
  var _currentEnvironment = require("../../lib/currentEnvironment");
17
17
  var _Emotion = require("../../lib/theming/Emotion");
18
+ var _rootNode = require("../../lib/rootNode");
18
19
 
19
20
  var _TextareaHelpers = require("./TextareaHelpers");
20
21
  var _Textarea = require("./Textarea.styles");
21
- var _TextareaCounter = require("./TextareaCounter");
22
+ var _TextareaCounter = require("./TextareaCounter");var _class, _class2, _temp;
22
23
 
23
24
  var DEFAULT_WIDTH = 250;
24
25
  var AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;
@@ -117,7 +118,8 @@ var AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;
117
118
  *
118
119
  * ** `className` и `style` игнорируются**
119
120
  */var
120
- Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Textarea, _React$Component);function Textarea() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
121
+
122
+ Textarea = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Textarea, _React$Component);function Textarea() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
121
123
 
122
124
 
123
125
 
@@ -198,6 +200,11 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
198
200
  counter = void 0;_this.
199
201
  layoutEvents = void 0;_this.
200
202
  textareaObserver = _client.isBrowser ? new MutationObserver(_this.reflowCounter) : null;_this.
203
+ setRootNode = void 0;_this.
204
+
205
+
206
+
207
+
201
208
 
202
209
 
203
210
 
@@ -530,7 +537,7 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
530
537
  }
531
538
  };return _this;}var _proto = Textarea.prototype;_proto.getAutoResizeThrottleWait = function getAutoResizeThrottleWait(props) {if (props === void 0) {props = this.props;} // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты
532
539
  // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120
533
- return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;};_proto.isAnimationsDisabled = function isAnimationsDisabled(_temp) {var _ref2 = _temp === void 0 ? this.props : _temp,disableAnimations = _ref2.disableAnimations,extraRow = _ref2.extraRow;return disableAnimations || !extraRow;};_proto.componentDidMount = function componentDidMount() {if (this.props.autoResize) {this.autoResize();this.layoutEvents = LayoutEvents.addListener(this.autoResize);}if (this.node && this.props.showLengthCounter && this.textareaObserver) {this.textareaObserver.observe(this.node, { attributes: true });}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.layoutEvents) {this.layoutEvents.remove();}if (this.props.showLengthCounter && this.textareaObserver) {this.textareaObserver.disconnect();}this.cancelDelayedSelectAll();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {this.autoResize.cancel();this.autoResize = (0, _lodash.default)(this.autoResizeHandler, this.getAutoResizeThrottleWait());}if (this.props.autoResize && (this.props.rows !== prevProps.rows || this.props.maxRows !== prevProps.maxRows || this.props.value !== prevProps.value)) {this.autoResize();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, _this2.props, _this2.renderMain);});} /**
540
+ return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;};_proto.isAnimationsDisabled = function isAnimationsDisabled(_temp2) {var _ref2 = _temp2 === void 0 ? this.props : _temp2,disableAnimations = _ref2.disableAnimations,extraRow = _ref2.extraRow;return disableAnimations || !extraRow;};_proto.componentDidMount = function componentDidMount() {if (this.props.autoResize) {this.autoResize();this.layoutEvents = LayoutEvents.addListener(this.autoResize);}if (this.node && this.props.showLengthCounter && this.textareaObserver) {this.textareaObserver.observe(this.node, { attributes: true });}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.layoutEvents) {this.layoutEvents.remove();}if (this.props.showLengthCounter && this.textareaObserver) {this.textareaObserver.disconnect();}this.cancelDelayedSelectAll();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {this.autoResize.cancel();this.autoResize = (0, _lodash.default)(this.autoResizeHandler, this.getAutoResizeThrottleWait());}if (this.props.autoResize && (this.props.rows !== prevProps.rows || this.props.maxRows !== prevProps.maxRows || this.props.value !== prevProps.value)) {this.autoResize();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.props), _this2.renderMain);});} /**
534
541
  * @public
535
542
  */;_proto.focus = function focus() {if (this.node) {this.node.focus();}} /**
536
543
  * @public
@@ -538,4 +545,4 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
538
545
  * @public
539
546
  * @param {number} start
540
547
  * @param {number} end
541
- */;return Textarea;}(_react.default.Component);exports.Textarea = Textarea;Textarea.__KONTUR_REACT_UI__ = 'Textarea';Textarea.propTypes = { error: _propTypes.default.bool, warning: _propTypes.default.bool, disabled: _propTypes.default.bool, autoResize: _propTypes.default.bool, extraRow: _propTypes.default.bool, disableAnimations: _propTypes.default.bool, maxRows: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), resize: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), id: _propTypes.default.string, name: _propTypes.default.string, title: _propTypes.default.string, spellCheck: _propTypes.default.bool, role: _propTypes.default.string, maxLength: _propTypes.default.number, tabIndex: _propTypes.default.number, rows: _propTypes.default.number, placeholder: _propTypes.default.string, value: _propTypes.default.string, defaultValue: _propTypes.default.string, onValueChange: _propTypes.default.func, onMouseEnter: _propTypes.default.func, onMouseLeave: _propTypes.default.func, onMouseOver: _propTypes.default.func, onMouseMove: _propTypes.default.func, onMouseOut: _propTypes.default.func, onMouseUp: _propTypes.default.func, onMouseDown: _propTypes.default.func, onClick: _propTypes.default.func, onDoubleClick: _propTypes.default.func, onKeyDown: _propTypes.default.func, onKeyPress: _propTypes.default.func, onKeyUp: _propTypes.default.func, onInput: _propTypes.default.func, onFocus: _propTypes.default.func, onBlur: _propTypes.default.func, onScroll: _propTypes.default.func, onWheel: _propTypes.default.func, onCut: _propTypes.default.func, onPaste: _propTypes.default.func, onCopy: _propTypes.default.func };Textarea.defaultProps = { rows: 3, maxRows: 15, extraRow: true, disableAnimations: _currentEnvironment.isTestEnv };
548
+ */;return Textarea;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Textarea', _class2.propTypes = { error: _propTypes.default.bool, warning: _propTypes.default.bool, disabled: _propTypes.default.bool, autoResize: _propTypes.default.bool, extraRow: _propTypes.default.bool, disableAnimations: _propTypes.default.bool, maxRows: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), resize: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), id: _propTypes.default.string, name: _propTypes.default.string, title: _propTypes.default.string, spellCheck: _propTypes.default.bool, role: _propTypes.default.string, maxLength: _propTypes.default.number, tabIndex: _propTypes.default.number, rows: _propTypes.default.number, placeholder: _propTypes.default.string, value: _propTypes.default.string, defaultValue: _propTypes.default.string, onValueChange: _propTypes.default.func, onMouseEnter: _propTypes.default.func, onMouseLeave: _propTypes.default.func, onMouseOver: _propTypes.default.func, onMouseMove: _propTypes.default.func, onMouseOut: _propTypes.default.func, onMouseUp: _propTypes.default.func, onMouseDown: _propTypes.default.func, onClick: _propTypes.default.func, onDoubleClick: _propTypes.default.func, onKeyDown: _propTypes.default.func, onKeyPress: _propTypes.default.func, onKeyUp: _propTypes.default.func, onInput: _propTypes.default.func, onFocus: _propTypes.default.func, onBlur: _propTypes.default.func, onScroll: _propTypes.default.func, onWheel: _propTypes.default.func, onCut: _propTypes.default.func, onPaste: _propTypes.default.func, onCopy: _propTypes.default.func }, _class2.defaultProps = { rows: 3, maxRows: 15, extraRow: true, disableAnimations: _currentEnvironment.isTestEnv }, _temp)) || _class;exports.Textarea = Textarea;