rsuite 6.0.0-canary-2025032014 → 6.0.0-canary-20250416

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 (484) hide show
  1. package/AutoComplete/styles/index.css +112 -62
  2. package/AutoComplete/styles/index.less +1 -1
  3. package/Box/styles/index.css +12 -0
  4. package/CHANGELOG.md +24 -0
  5. package/Calendar/styles/index.css +11 -9
  6. package/Calendar/styles/index.less +3 -1
  7. package/Cascader/styles/index.css +112 -62
  8. package/CheckPicker/styles/index.css +112 -62
  9. package/CheckPicker/styles/index.less +1 -1
  10. package/CheckTree/styles/index.css +113 -63
  11. package/CheckTree/styles/index.less +1 -1
  12. package/CheckTreePicker/styles/index.css +113 -63
  13. package/DateInput/styles/index.css +0 -7
  14. package/DatePicker/styles/index.css +122 -74
  15. package/DatePicker/styles/index.less +5 -11
  16. package/DateRangeInput/styles/index.css +0 -7
  17. package/DateRangePicker/styles/index.css +132 -78
  18. package/DateRangePicker/styles/index.less +10 -4
  19. package/Divider/styles/index.css +2 -2
  20. package/Divider/styles/index.less +2 -2
  21. package/Grid/styles/columns.less +1 -2
  22. package/Grid/styles/grid-framework.less +1 -0
  23. package/Grid/styles/index.css +9 -4
  24. package/Grid/styles/row.less +2 -2
  25. package/Input/styles/index.css +0 -7
  26. package/Input/styles/index.less +0 -6
  27. package/Input/styles/mixin.less +0 -4
  28. package/InputGroup/styles/index.css +1 -1
  29. package/InputGroup/styles/index.less +1 -1
  30. package/InputNumber/styles/index.css +1 -8
  31. package/InputPicker/styles/index.css +121 -70
  32. package/InputPicker/styles/index.less +4 -4
  33. package/Link/package.json +7 -0
  34. package/Link/styles/index.css +32 -0
  35. package/Link/styles/index.less +39 -0
  36. package/Message/styles/index.css +9 -0
  37. package/Message/styles/index.less +11 -0
  38. package/MultiCascadeTree/styles/index.css +112 -62
  39. package/MultiCascader/styles/index.css +112 -62
  40. package/Nav/styles/index.css +1 -0
  41. package/Nav/styles/index.less +1 -0
  42. package/Pagination/styles/index.css +114 -64
  43. package/PasswordInput/package.json +7 -0
  44. package/PasswordInput/styles/index.css +172 -0
  45. package/PasswordInput/styles/index.less +1 -0
  46. package/PasswordStrengthMeter/package.json +7 -0
  47. package/PasswordStrengthMeter/styles/index.css +33 -0
  48. package/PasswordStrengthMeter/styles/index.less +39 -0
  49. package/README.md +3 -3
  50. package/RadioGroup/styles/index.css +1 -0
  51. package/RadioGroup/styles/index.less +1 -0
  52. package/RangeSlider/styles/index.css +76 -43
  53. package/Rate/styles/index.css +48 -34
  54. package/Rate/styles/index.less +32 -21
  55. package/SelectPicker/styles/index.css +112 -62
  56. package/SelectPicker/styles/index.less +1 -1
  57. package/Slider/styles/index.css +76 -43
  58. package/Slider/styles/index.less +95 -48
  59. package/Tabs/styles/index.css +1 -0
  60. package/TagInput/styles/index.css +152 -91
  61. package/TagInput/styles/index.less +1 -1
  62. package/TagPicker/styles/index.css +151 -90
  63. package/TagPicker/styles/index.less +52 -41
  64. package/Textarea/package.json +7 -0
  65. package/Textarea/styles/index.css +6 -0
  66. package/Textarea/styles/index.less +7 -0
  67. package/TimePicker/styles/index.css +122 -74
  68. package/TimeRangePicker/styles/index.css +132 -78
  69. package/Toggle/styles/index.css +146 -87
  70. package/Toggle/styles/index.less +66 -38
  71. package/Tree/styles/index.css +113 -63
  72. package/Tree/styles/index.less +1 -1
  73. package/TreePicker/styles/index.css +113 -63
  74. package/cjs/AutoComplete/AutoComplete.d.ts +1 -1
  75. package/cjs/AutoComplete/AutoComplete.js +13 -11
  76. package/cjs/Avatar/Avatar.d.ts +3 -4
  77. package/cjs/Breadcrumb/Breadcrumb.js +2 -2
  78. package/cjs/Breadcrumb/BreadcrumbItem.js +1 -1
  79. package/cjs/Button/Button.js +9 -10
  80. package/cjs/Calendar/CalendarProvider.js +0 -0
  81. package/cjs/Calendar/hooks/useCalendar.js +0 -0
  82. package/cjs/Carousel/Carousel.js +2 -2
  83. package/cjs/Cascader/Cascader.js +42 -45
  84. package/cjs/Cascader/useActive.d.ts +6 -4
  85. package/cjs/Cascader/useActive.js +10 -8
  86. package/cjs/CheckPicker/CheckPicker.js +38 -41
  87. package/cjs/CheckTreePicker/CheckTreePicker.js +20 -22
  88. package/cjs/CustomProvider/CustomProvider.d.ts +1 -4
  89. package/cjs/CustomProvider/types.d.ts +10 -2
  90. package/cjs/DatePicker/DatePicker.d.ts +1 -1
  91. package/cjs/DatePicker/DatePicker.js +28 -25
  92. package/cjs/DatePicker/utils.d.ts +3 -3
  93. package/cjs/DatePicker/utils.js +3 -3
  94. package/cjs/DateRangePicker/DateRangePicker.js +39 -33
  95. package/cjs/DateRangePicker/utils.js +0 -0
  96. package/cjs/Divider/Divider.d.ts +3 -2
  97. package/cjs/Divider/Divider.js +2 -2
  98. package/cjs/Form/hooks/useFormValidate.js +0 -0
  99. package/cjs/Form/hooks/useSchemaModel.js +2 -54
  100. package/cjs/Form/utils/constructFlatSchema.d.ts +4 -0
  101. package/cjs/Form/utils/constructFlatSchema.js +41 -0
  102. package/cjs/FormControl/hooks/useField.js +0 -0
  103. package/cjs/FormControl/utils.js +0 -0
  104. package/cjs/Grid/Row.d.ts +2 -2
  105. package/cjs/Grid/Row.js +2 -20
  106. package/cjs/Grid/types.d.ts +1 -0
  107. package/cjs/Grid/utils/styles.d.ts +6 -0
  108. package/cjs/Grid/utils/styles.js +43 -0
  109. package/cjs/Image/Image.js +12 -11
  110. package/cjs/Image/hooks/useImage.d.ts +2 -0
  111. package/cjs/Image/hooks/useImage.js +19 -43
  112. package/cjs/InlineEdit/InlineEdit.js +3 -1
  113. package/cjs/InlineEdit/useEditState.d.ts +2 -0
  114. package/cjs/InlineEdit/useEditState.js +8 -0
  115. package/cjs/Input/Input.d.ts +3 -12
  116. package/cjs/Input/Input.js +12 -73
  117. package/cjs/InputPicker/InputPicker.js +27 -28
  118. package/cjs/Link/ExternalLinkIcon.d.ts +3 -0
  119. package/cjs/Link/ExternalLinkIcon.js +23 -0
  120. package/cjs/Link/Link.d.ts +14 -0
  121. package/cjs/Link/Link.js +52 -0
  122. package/cjs/Link/index.d.ts +4 -0
  123. package/cjs/Link/index.js +11 -0
  124. package/cjs/List/List.js +6 -2
  125. package/cjs/List/helper/useSortHelper.d.ts +7 -5
  126. package/cjs/List/helper/useSortHelper.js +109 -16
  127. package/cjs/List/helper/utils.js +14 -6
  128. package/cjs/MultiCascader/MultiCascader.js +40 -43
  129. package/cjs/Nav/NavItem.js +1 -1
  130. package/cjs/Nav/NavMegaMenu.d.ts +5 -0
  131. package/cjs/Nav/NavMegaMenu.js +5 -0
  132. package/cjs/Navbar/NavbarItem.js +1 -1
  133. package/cjs/Navbar/NavbarMegaMenu.js +1 -1
  134. package/cjs/PasswordInput/PasswordInput.d.ts +14 -0
  135. package/cjs/PasswordInput/PasswordInput.js +71 -0
  136. package/cjs/PasswordInput/index.d.ts +4 -0
  137. package/cjs/PasswordInput/index.js +11 -0
  138. package/cjs/PasswordStrengthMeter/PasswordStrengthMeter.d.ts +12 -0
  139. package/cjs/PasswordStrengthMeter/PasswordStrengthMeter.js +50 -0
  140. package/cjs/PasswordStrengthMeter/index.d.ts +4 -0
  141. package/cjs/PasswordStrengthMeter/index.js +11 -0
  142. package/cjs/RangeSlider/RangeSlider.js +18 -3
  143. package/cjs/Rate/Character.d.ts +4 -3
  144. package/cjs/Rate/Character.js +19 -15
  145. package/cjs/Rate/Rate.d.ts +10 -2
  146. package/cjs/Rate/Rate.js +47 -42
  147. package/cjs/Rate/types.d.ts +8 -0
  148. package/cjs/Rate/types.js +4 -0
  149. package/cjs/Rate/useRatingStates.d.ts +20 -0
  150. package/cjs/Rate/useRatingStates.js +48 -0
  151. package/cjs/Rate/utils.d.ts +14 -3
  152. package/cjs/Rate/utils.js +50 -9
  153. package/cjs/SelectPicker/SelectPicker.js +45 -46
  154. package/cjs/Sidenav/ExpandedSidenavDropdownItem.js +1 -1
  155. package/cjs/Sidenav/SidenavItem.js +1 -1
  156. package/cjs/Slider/Graduated.d.ts +4 -0
  157. package/cjs/Slider/Graduated.js +43 -20
  158. package/cjs/Slider/Handle.d.ts +1 -1
  159. package/cjs/Slider/Handle.js +12 -12
  160. package/cjs/Slider/Slider.d.ts +16 -1
  161. package/cjs/Slider/Slider.js +7 -2
  162. package/cjs/Slider/useDrag.d.ts +1 -0
  163. package/cjs/Slider/useDrag.js +8 -3
  164. package/cjs/Steps/Steps.js +2 -2
  165. package/cjs/Tabs/Tabs.js +2 -2
  166. package/cjs/Textarea/Textarea.d.ts +32 -0
  167. package/cjs/Textarea/Textarea.js +51 -0
  168. package/cjs/Textarea/index.d.ts +4 -0
  169. package/cjs/Textarea/index.js +11 -0
  170. package/cjs/Timeline/Timeline.js +2 -2
  171. package/cjs/Toggle/Toggle.d.ts +10 -1
  172. package/cjs/Toggle/Toggle.js +12 -9
  173. package/cjs/TreePicker/TreePicker.js +18 -19
  174. package/cjs/index.d.ts +4 -1
  175. package/cjs/index.js +24 -6
  176. package/cjs/internals/Box/Box.d.ts +4 -0
  177. package/cjs/internals/Box/Box.js +1 -1
  178. package/cjs/internals/Box/utils.js +5 -1
  179. package/cjs/internals/InputBase/InputBase.d.ts +45 -0
  180. package/cjs/internals/InputBase/InputBase.js +96 -0
  181. package/cjs/internals/InputBase/index.d.ts +3 -0
  182. package/cjs/internals/InputBase/index.js +8 -0
  183. package/cjs/internals/Overlay/Modal.d.ts +1 -1
  184. package/cjs/internals/Overlay/OverlayTrigger.d.ts +4 -3
  185. package/cjs/internals/Overlay/OverlayTrigger.js +8 -3
  186. package/cjs/internals/Picker/Listbox.js +7 -9
  187. package/cjs/internals/Picker/PickerDrawer.d.ts +8 -0
  188. package/cjs/internals/Picker/PickerDrawer.js +31 -0
  189. package/cjs/internals/Picker/PickerPopup.js +5 -3
  190. package/cjs/internals/Picker/PickerToggle.d.ts +1 -0
  191. package/cjs/internals/Picker/PickerToggle.js +10 -3
  192. package/cjs/internals/Picker/PickerToggleTrigger.d.ts +51 -11
  193. package/cjs/internals/Picker/PickerToggleTrigger.js +59 -13
  194. package/cjs/internals/Picker/hooks/index.d.ts +0 -1
  195. package/cjs/internals/Picker/hooks/index.js +2 -4
  196. package/cjs/internals/Picker/hooks/useCombobox.d.ts +1 -0
  197. package/cjs/internals/Picker/hooks/useCombobox.js +3 -1
  198. package/cjs/internals/Picker/index.d.ts +1 -2
  199. package/cjs/internals/Picker/index.js +10 -12
  200. package/{esm → cjs/internals}/SafeAnchor/SafeAnchor.d.ts +2 -2
  201. package/cjs/{SafeAnchor → internals/SafeAnchor}/SafeAnchor.js +3 -3
  202. package/cjs/internals/Tree/TreeView.js +3 -4
  203. package/cjs/internals/hooks/useRootClose.js +4 -4
  204. package/cjs/internals/index.d.ts +4 -0
  205. package/cjs/internals/index.js +13 -1
  206. package/cjs/internals/types/html.d.ts +2 -0
  207. package/cjs/internals/utils/{dom.d.ts → html/dom.d.ts} +1 -0
  208. package/cjs/internals/utils/{dom.js → html/dom.js} +8 -0
  209. package/cjs/internals/utils/{events.js → html/events.js} +0 -0
  210. package/cjs/internals/utils/{htmlPropsUtils.js → html/htmlPropsUtils.js} +0 -0
  211. package/cjs/internals/utils/html/index.d.ts +4 -0
  212. package/cjs/internals/utils/html/index.js +28 -0
  213. package/cjs/internals/utils/{safeSetSelection.js → html/safeSetSelection.js} +1 -1
  214. package/cjs/internals/utils/index.d.ts +3 -15
  215. package/cjs/internals/utils/index.js +20 -49
  216. package/cjs/internals/utils/{ReactChildren.d.ts → react/ReactChildren.d.ts} +2 -8
  217. package/cjs/internals/utils/{ReactChildren.js → react/ReactChildren.js} +5 -25
  218. package/cjs/internals/utils/react/ReactIs.d.ts +7 -0
  219. package/cjs/internals/utils/react/ReactIs.js +26 -0
  220. package/{esm/internals/utils → cjs/internals/utils/react}/createComponent.d.ts +2 -2
  221. package/cjs/internals/utils/{createComponent.js → react/createComponent.js} +3 -3
  222. package/cjs/internals/utils/{deprecateComponent.js → react/deprecateComponent.js} +1 -1
  223. package/cjs/internals/utils/{forwardRef.d.ts → react/forwardRef.d.ts} +1 -1
  224. package/cjs/internals/utils/react/index.d.ts +7 -0
  225. package/cjs/internals/utils/react/index.js +46 -0
  226. package/cjs/internals/utils/{mergeRefs.js → react/mergeRefs.js} +0 -0
  227. package/cjs/internals/utils/{getStringLength.d.ts → string/getStringLength.d.ts} +0 -1
  228. package/cjs/internals/utils/{getStringLength.js → string/getStringLength.js} +1 -3
  229. package/cjs/internals/utils/string/index.d.ts +4 -0
  230. package/cjs/internals/utils/string/index.js +28 -0
  231. package/cjs/internals/utils/{stringifyReactNode.js → string/stringifyReactNode.js} +0 -0
  232. package/cjs/internals/utils/{tplTransform.js → string/tplTransform.js} +0 -0
  233. package/cjs/locales/en_GB.js +2 -2
  234. package/cjs/locales/en_US.js +2 -2
  235. package/cjs/locales/index.js +0 -0
  236. package/cjs/locales/pl_PL.js +2 -3
  237. package/cjs/useBreakpointValue/useBreakpointValue.d.ts +6 -2
  238. package/cjs/useBreakpointValue/useBreakpointValue.js +9 -4
  239. package/cjs/useMediaQuery/breakpoints.d.ts +24 -0
  240. package/cjs/useMediaQuery/breakpoints.js +248 -0
  241. package/cjs/useMediaQuery/index.d.ts +1 -1
  242. package/cjs/useMediaQuery/types.d.ts +45 -0
  243. package/cjs/useMediaQuery/types.js +4 -0
  244. package/cjs/useMediaQuery/useMediaQuery.d.ts +4 -13
  245. package/cjs/useMediaQuery/useMediaQuery.js +30 -12
  246. package/cjs/useToaster/useToaster.d.ts +1 -1
  247. package/cjs/useToaster/useToaster.js +1 -1
  248. package/dist/rsuite-no-reset-rtl.css +565 -276
  249. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  250. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  251. package/dist/rsuite-no-reset.css +565 -276
  252. package/dist/rsuite-no-reset.min.css +1 -1
  253. package/dist/rsuite-no-reset.min.css.map +1 -1
  254. package/dist/rsuite-rtl.css +565 -276
  255. package/dist/rsuite-rtl.min.css +1 -1
  256. package/dist/rsuite-rtl.min.css.map +1 -1
  257. package/dist/rsuite.css +565 -276
  258. package/dist/rsuite.js +508 -211
  259. package/dist/rsuite.js.map +1 -1
  260. package/dist/rsuite.min.css +1 -1
  261. package/dist/rsuite.min.css.map +1 -1
  262. package/dist/rsuite.min.js +1 -1
  263. package/dist/rsuite.min.js.map +1 -1
  264. package/esm/AutoComplete/AutoComplete.d.ts +1 -1
  265. package/esm/AutoComplete/AutoComplete.js +13 -11
  266. package/esm/Avatar/Avatar.d.ts +3 -4
  267. package/esm/Breadcrumb/Breadcrumb.js +3 -3
  268. package/esm/Breadcrumb/BreadcrumbItem.js +1 -1
  269. package/esm/Button/Button.js +10 -11
  270. package/esm/Calendar/CalendarProvider.js +0 -0
  271. package/esm/Calendar/hooks/useCalendar.js +0 -0
  272. package/esm/Carousel/Carousel.js +3 -3
  273. package/esm/Cascader/Cascader.js +43 -46
  274. package/esm/Cascader/useActive.d.ts +6 -4
  275. package/esm/Cascader/useActive.js +10 -8
  276. package/esm/CheckPicker/CheckPicker.js +39 -42
  277. package/esm/CheckTreePicker/CheckTreePicker.js +21 -23
  278. package/esm/CustomProvider/CustomProvider.d.ts +1 -4
  279. package/esm/CustomProvider/types.d.ts +10 -2
  280. package/esm/DatePicker/DatePicker.d.ts +1 -1
  281. package/esm/DatePicker/DatePicker.js +29 -26
  282. package/esm/DatePicker/utils.d.ts +3 -3
  283. package/esm/DatePicker/utils.js +4 -4
  284. package/esm/DateRangePicker/DateRangePicker.js +35 -29
  285. package/esm/DateRangePicker/utils.js +0 -0
  286. package/esm/Divider/Divider.d.ts +3 -2
  287. package/esm/Divider/Divider.js +2 -2
  288. package/esm/Form/hooks/useFormValidate.js +0 -0
  289. package/esm/Form/hooks/useSchemaModel.js +3 -55
  290. package/esm/Form/utils/constructFlatSchema.d.ts +4 -0
  291. package/esm/Form/utils/constructFlatSchema.js +37 -0
  292. package/esm/FormControl/hooks/useField.js +0 -0
  293. package/esm/FormControl/utils.js +0 -0
  294. package/esm/Grid/Row.d.ts +2 -2
  295. package/esm/Grid/Row.js +2 -20
  296. package/esm/Grid/types.d.ts +1 -0
  297. package/esm/Grid/utils/styles.d.ts +6 -0
  298. package/esm/Grid/utils/styles.js +37 -0
  299. package/esm/Image/Image.js +12 -11
  300. package/esm/Image/hooks/useImage.d.ts +2 -0
  301. package/esm/Image/hooks/useImage.js +20 -43
  302. package/esm/InlineEdit/InlineEdit.js +3 -1
  303. package/esm/InlineEdit/useEditState.d.ts +2 -0
  304. package/esm/InlineEdit/useEditState.js +8 -0
  305. package/esm/Input/Input.d.ts +3 -12
  306. package/esm/Input/Input.js +12 -74
  307. package/esm/InputPicker/InputPicker.js +28 -29
  308. package/esm/Link/ExternalLinkIcon.d.ts +3 -0
  309. package/esm/Link/ExternalLinkIcon.js +18 -0
  310. package/esm/Link/Link.d.ts +14 -0
  311. package/esm/Link/Link.js +47 -0
  312. package/esm/Link/index.d.ts +4 -0
  313. package/esm/Link/index.js +8 -0
  314. package/esm/List/List.js +6 -2
  315. package/esm/List/helper/useSortHelper.d.ts +7 -5
  316. package/esm/List/helper/useSortHelper.js +109 -16
  317. package/esm/List/helper/utils.js +14 -6
  318. package/esm/MultiCascader/MultiCascader.js +41 -44
  319. package/esm/Nav/NavItem.js +1 -1
  320. package/esm/Nav/NavMegaMenu.d.ts +5 -0
  321. package/esm/Nav/NavMegaMenu.js +5 -0
  322. package/esm/Navbar/NavbarItem.js +1 -1
  323. package/esm/Navbar/NavbarMegaMenu.js +1 -1
  324. package/esm/PasswordInput/PasswordInput.d.ts +14 -0
  325. package/esm/PasswordInput/PasswordInput.js +66 -0
  326. package/esm/PasswordInput/index.d.ts +4 -0
  327. package/esm/PasswordInput/index.js +8 -0
  328. package/esm/PasswordStrengthMeter/PasswordStrengthMeter.d.ts +12 -0
  329. package/esm/PasswordStrengthMeter/PasswordStrengthMeter.js +45 -0
  330. package/esm/PasswordStrengthMeter/index.d.ts +4 -0
  331. package/esm/PasswordStrengthMeter/index.js +8 -0
  332. package/esm/RangeSlider/RangeSlider.js +18 -3
  333. package/esm/Rate/Character.d.ts +4 -3
  334. package/esm/Rate/Character.js +20 -16
  335. package/esm/Rate/Rate.d.ts +10 -2
  336. package/esm/Rate/Rate.js +49 -42
  337. package/esm/Rate/types.d.ts +8 -0
  338. package/esm/Rate/types.js +2 -0
  339. package/esm/Rate/useRatingStates.d.ts +20 -0
  340. package/esm/Rate/useRatingStates.js +43 -0
  341. package/esm/Rate/utils.d.ts +14 -3
  342. package/esm/Rate/utils.js +46 -7
  343. package/esm/SelectPicker/SelectPicker.js +46 -47
  344. package/esm/Sidenav/ExpandedSidenavDropdownItem.js +1 -1
  345. package/esm/Sidenav/SidenavItem.js +1 -1
  346. package/esm/Slider/Graduated.d.ts +4 -0
  347. package/esm/Slider/Graduated.js +43 -20
  348. package/esm/Slider/Handle.d.ts +1 -1
  349. package/esm/Slider/Handle.js +12 -12
  350. package/esm/Slider/Slider.d.ts +16 -1
  351. package/esm/Slider/Slider.js +7 -2
  352. package/esm/Slider/useDrag.d.ts +1 -0
  353. package/esm/Slider/useDrag.js +8 -3
  354. package/esm/Steps/Steps.js +3 -3
  355. package/esm/Tabs/Tabs.js +3 -3
  356. package/esm/Textarea/Textarea.d.ts +32 -0
  357. package/esm/Textarea/Textarea.js +46 -0
  358. package/esm/Textarea/index.d.ts +4 -0
  359. package/esm/Textarea/index.js +8 -0
  360. package/esm/Timeline/Timeline.js +3 -3
  361. package/esm/Toggle/Toggle.d.ts +10 -1
  362. package/esm/Toggle/Toggle.js +12 -9
  363. package/esm/TreePicker/TreePicker.js +19 -20
  364. package/esm/index.d.ts +4 -1
  365. package/esm/index.js +4 -1
  366. package/esm/internals/Box/Box.d.ts +4 -0
  367. package/esm/internals/Box/Box.js +1 -1
  368. package/esm/internals/Box/utils.js +5 -1
  369. package/esm/internals/InputBase/InputBase.d.ts +45 -0
  370. package/esm/internals/InputBase/InputBase.js +89 -0
  371. package/esm/internals/InputBase/index.d.ts +3 -0
  372. package/esm/internals/InputBase/index.js +3 -0
  373. package/esm/internals/Overlay/Modal.d.ts +1 -1
  374. package/esm/internals/Overlay/OverlayTrigger.d.ts +4 -3
  375. package/esm/internals/Overlay/OverlayTrigger.js +8 -2
  376. package/esm/internals/Picker/Listbox.js +8 -10
  377. package/esm/internals/Picker/PickerDrawer.d.ts +8 -0
  378. package/esm/internals/Picker/PickerDrawer.js +26 -0
  379. package/esm/internals/Picker/PickerPopup.js +5 -3
  380. package/esm/internals/Picker/PickerToggle.d.ts +1 -0
  381. package/esm/internals/Picker/PickerToggle.js +10 -3
  382. package/esm/internals/Picker/PickerToggleTrigger.d.ts +51 -11
  383. package/esm/internals/Picker/PickerToggleTrigger.js +59 -12
  384. package/esm/internals/Picker/hooks/index.d.ts +0 -1
  385. package/esm/internals/Picker/hooks/index.js +1 -2
  386. package/esm/internals/Picker/hooks/useCombobox.d.ts +1 -0
  387. package/esm/internals/Picker/hooks/useCombobox.js +3 -1
  388. package/esm/internals/Picker/index.d.ts +1 -2
  389. package/esm/internals/Picker/index.js +1 -2
  390. package/{cjs → esm/internals}/SafeAnchor/SafeAnchor.d.ts +2 -2
  391. package/esm/{SafeAnchor → internals/SafeAnchor}/SafeAnchor.js +3 -3
  392. package/esm/internals/Tree/TreeView.js +4 -5
  393. package/esm/internals/hooks/useRootClose.js +1 -1
  394. package/esm/internals/index.d.ts +4 -0
  395. package/esm/internals/index.js +5 -0
  396. package/esm/internals/types/html.d.ts +2 -0
  397. package/esm/internals/utils/{dom.d.ts → html/dom.d.ts} +1 -0
  398. package/esm/internals/utils/{dom.js → html/dom.js} +7 -0
  399. package/esm/internals/utils/{events.js → html/events.js} +0 -0
  400. package/esm/internals/utils/{htmlPropsUtils.js → html/htmlPropsUtils.js} +0 -0
  401. package/esm/internals/utils/html/index.d.ts +4 -0
  402. package/esm/internals/utils/html/index.js +5 -0
  403. package/esm/internals/utils/{safeSetSelection.js → html/safeSetSelection.js} +1 -1
  404. package/esm/internals/utils/index.d.ts +3 -15
  405. package/esm/internals/utils/index.js +3 -14
  406. package/esm/internals/utils/{ReactChildren.d.ts → react/ReactChildren.d.ts} +2 -8
  407. package/esm/internals/utils/{ReactChildren.js → react/ReactChildren.js} +3 -21
  408. package/esm/internals/utils/react/ReactIs.d.ts +7 -0
  409. package/esm/internals/utils/react/ReactIs.js +22 -0
  410. package/{cjs/internals/utils → esm/internals/utils/react}/createComponent.d.ts +2 -2
  411. package/esm/internals/utils/{createComponent.js → react/createComponent.js} +3 -3
  412. package/esm/internals/utils/{deprecateComponent.js → react/deprecateComponent.js} +1 -1
  413. package/esm/internals/utils/{forwardRef.d.ts → react/forwardRef.d.ts} +1 -1
  414. package/esm/internals/utils/react/index.d.ts +7 -0
  415. package/esm/internals/utils/react/index.js +8 -0
  416. package/esm/internals/utils/{mergeRefs.js → react/mergeRefs.js} +0 -0
  417. package/esm/internals/utils/{getStringLength.d.ts → string/getStringLength.d.ts} +0 -1
  418. package/esm/internals/utils/{getStringLength.js → string/getStringLength.js} +1 -2
  419. package/esm/internals/utils/string/index.d.ts +4 -0
  420. package/esm/internals/utils/string/index.js +5 -0
  421. package/esm/internals/utils/{stringifyReactNode.js → string/stringifyReactNode.js} +0 -0
  422. package/esm/internals/utils/{tplTransform.js → string/tplTransform.js} +0 -0
  423. package/esm/locales/en_GB.js +2 -2
  424. package/esm/locales/en_US.js +2 -2
  425. package/esm/locales/index.js +0 -0
  426. package/esm/locales/pl_PL.js +1 -1
  427. package/esm/useBreakpointValue/useBreakpointValue.d.ts +6 -2
  428. package/esm/useBreakpointValue/useBreakpointValue.js +9 -4
  429. package/esm/useMediaQuery/breakpoints.d.ts +24 -0
  430. package/esm/useMediaQuery/breakpoints.js +244 -0
  431. package/esm/useMediaQuery/index.d.ts +1 -1
  432. package/esm/useMediaQuery/types.d.ts +45 -0
  433. package/esm/useMediaQuery/types.js +2 -0
  434. package/esm/useMediaQuery/useMediaQuery.d.ts +4 -13
  435. package/esm/useMediaQuery/useMediaQuery.js +29 -11
  436. package/esm/useToaster/useToaster.d.ts +1 -1
  437. package/esm/useToaster/useToaster.js +1 -1
  438. package/internals/Box/styles/index.less +4 -0
  439. package/internals/Picker/styles/index.less +105 -23
  440. package/internals/Picker/styles/mixin.less +6 -6
  441. package/package.json +3 -2
  442. package/styles/color-modes/dark.less +2 -2
  443. package/styles/color-modes/high-contrast.less +2 -2
  444. package/styles/color-modes/light.less +2 -2
  445. package/styles/index.less +3 -0
  446. package/styles/root.less +2 -0
  447. package/styles/variables.less +0 -24
  448. package/SafeAnchor/package.json +0 -7
  449. package/cjs/Form/hooks/useFormClassNames.d.ts +0 -5
  450. package/cjs/Form/hooks/useFormClassNames.js +0 -29
  451. package/cjs/internals/Picker/hooks/usePickerClassName.d.ts +0 -19
  452. package/cjs/internals/Picker/hooks/usePickerClassName.js +0 -45
  453. package/esm/Form/hooks/useFormClassNames.d.ts +0 -5
  454. package/esm/Form/hooks/useFormClassNames.js +0 -25
  455. package/esm/internals/Picker/hooks/usePickerClassName.d.ts +0 -19
  456. package/esm/internals/Picker/hooks/usePickerClassName.js +0 -40
  457. /package/cjs/{SafeAnchor → internals/SafeAnchor}/index.d.ts +0 -0
  458. /package/cjs/{SafeAnchor → internals/SafeAnchor}/index.js +0 -0
  459. /package/cjs/internals/utils/{events.d.ts → html/events.d.ts} +0 -0
  460. /package/cjs/internals/utils/{htmlPropsUtils.d.ts → html/htmlPropsUtils.d.ts} +0 -0
  461. /package/cjs/internals/utils/{safeSetSelection.d.ts → html/safeSetSelection.d.ts} +0 -0
  462. /package/cjs/internals/utils/{deprecateComponent.d.ts → react/deprecateComponent.d.ts} +0 -0
  463. /package/cjs/internals/utils/{forwardRef.js → react/forwardRef.js} +0 -0
  464. /package/cjs/internals/utils/{getDOMNode.d.ts → react/getDOMNode.d.ts} +0 -0
  465. /package/cjs/internals/utils/{getDOMNode.js → react/getDOMNode.js} +0 -0
  466. /package/cjs/internals/utils/{mergeRefs.d.ts → react/mergeRefs.d.ts} +0 -0
  467. /package/cjs/internals/utils/{getSafeRegExpString.d.ts → string/getSafeRegExpString.d.ts} +0 -0
  468. /package/cjs/internals/utils/{getSafeRegExpString.js → string/getSafeRegExpString.js} +0 -0
  469. /package/cjs/internals/utils/{stringifyReactNode.d.ts → string/stringifyReactNode.d.ts} +0 -0
  470. /package/cjs/internals/utils/{tplTransform.d.ts → string/tplTransform.d.ts} +0 -0
  471. /package/esm/{SafeAnchor → internals/SafeAnchor}/index.d.ts +0 -0
  472. /package/esm/{SafeAnchor → internals/SafeAnchor}/index.js +0 -0
  473. /package/esm/internals/utils/{events.d.ts → html/events.d.ts} +0 -0
  474. /package/esm/internals/utils/{htmlPropsUtils.d.ts → html/htmlPropsUtils.d.ts} +0 -0
  475. /package/esm/internals/utils/{safeSetSelection.d.ts → html/safeSetSelection.d.ts} +0 -0
  476. /package/esm/internals/utils/{deprecateComponent.d.ts → react/deprecateComponent.d.ts} +0 -0
  477. /package/esm/internals/utils/{forwardRef.js → react/forwardRef.js} +0 -0
  478. /package/esm/internals/utils/{getDOMNode.d.ts → react/getDOMNode.d.ts} +0 -0
  479. /package/esm/internals/utils/{getDOMNode.js → react/getDOMNode.js} +0 -0
  480. /package/esm/internals/utils/{mergeRefs.d.ts → react/mergeRefs.d.ts} +0 -0
  481. /package/esm/internals/utils/{getSafeRegExpString.d.ts → string/getSafeRegExpString.d.ts} +0 -0
  482. /package/esm/internals/utils/{getSafeRegExpString.js → string/getSafeRegExpString.js} +0 -0
  483. /package/esm/internals/utils/{stringifyReactNode.d.ts → string/stringifyReactNode.d.ts} +0 -0
  484. /package/esm/internals/utils/{tplTransform.d.ts → string/tplTransform.d.ts} +0 -0
@@ -1432,9 +1432,6 @@
1432
1432
  background-color: var(--rs-input-disabled-bg);
1433
1433
  color: var(--rs-text-disabled);
1434
1434
  }
1435
- textarea.rs-input {
1436
- height: auto;
1437
- }
1438
1435
  .rs-input.rs-input-xs {
1439
1436
  --rs-input-font-size: var(--rs-input-font-size-xs);
1440
1437
  --rs-input-line-height: var(--rs-input-line-height-xs);
@@ -1459,10 +1456,6 @@ textarea.rs-input {
1459
1456
  --rs-input-padding-block: var(--rs-input-padding-block-lg);
1460
1457
  --rs-input-padding-inline: var(--rs-input-padding-inline-lg);
1461
1458
  }
1462
- textarea.rs-input {
1463
- overflow: auto;
1464
- resize: vertical;
1465
- }
1466
1459
  .rs-input-group {
1467
1460
  --rs-input-group-input-height-xs: calc(24px - 2px);
1468
1461
  --rs-input-group-input-height-sm: calc(30px - 2px);
@@ -1541,7 +1534,7 @@ textarea.rs-input {
1541
1534
  .rs-input-group .rs-input-number,
1542
1535
  .rs-input-group .rs-input-group-addon,
1543
1536
  .rs-input-group .rs-input-group-btn,
1544
- .rs-input-group .rs-picker-date .rs-picker-toggle {
1537
+ .rs-input-group .rs-picker[data-picker='date'] .rs-picker-toggle {
1545
1538
  border: none;
1546
1539
  border-radius: var(--rs-radius-none);
1547
1540
  outline: none;
@@ -1697,22 +1690,22 @@ textarea.rs-input {
1697
1690
  stroke: var(--rs-close-button-hover-color);
1698
1691
  stroke-width: 1;
1699
1692
  }
1700
- .rs-picker-subtle .picker-subtle-toggle {
1693
+ .rs-picker[data-variant='subtle'] .picker-subtle-toggle {
1701
1694
  --rs-picker-toggle-border-width: 0px;
1702
1695
  position: relative;
1703
1696
  z-index: 5;
1704
1697
  }
1705
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle {
1698
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle {
1706
1699
  cursor: not-allowed;
1707
1700
  }
1708
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover,
1709
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus,
1710
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active {
1701
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover,
1702
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus,
1703
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active {
1711
1704
  background: none;
1712
1705
  }
1713
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover::after,
1714
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus::after,
1715
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active::after {
1706
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover::after,
1707
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus::after,
1708
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active::after {
1716
1709
  display: none;
1717
1710
  }
1718
1711
  .rs-picker {
@@ -1720,25 +1713,23 @@ textarea.rs-input {
1720
1713
  --rs-picker-loader-size: 20px;
1721
1714
  --rs-picker-toggle-border-width: 1px;
1722
1715
  --rs-picker-toggle-bg: var(--rs-input-bg);
1723
- }
1724
- .rs-picker-toggle-wrapper {
1725
1716
  display: inline-block;
1726
1717
  vertical-align: middle;
1727
1718
  max-width: 100%;
1728
1719
  }
1729
- .rs-picker-block {
1720
+ .rs-picker[data-block='true'] {
1730
1721
  display: block;
1731
1722
  width: 100%;
1732
1723
  }
1733
- .rs-picker-disabled {
1724
+ .rs-picker[data-disabled='true'] {
1734
1725
  cursor: not-allowed;
1735
1726
  }
1736
- .rs-picker-disabled .rs-picker-toggle-value,
1737
- .rs-picker-disabled .rs-picker-toggle-indicator,
1738
- .rs-picker-disabled .rs-picker-tag-list .rs-tag {
1727
+ .rs-picker[data-disabled='true'] .rs-picker-toggle-value,
1728
+ .rs-picker[data-disabled='true'] .rs-picker-toggle-indicator,
1729
+ .rs-picker[data-disabled='true'] .rs-picker-tag-list .rs-tag {
1739
1730
  color: var(--rs-text-disabled) !important;
1740
1731
  }
1741
- .rs-picker-disabled .rs-picker-value-count {
1732
+ .rs-picker[data-disabled='true'] .rs-picker-value-count {
1742
1733
  opacity: 0.5;
1743
1734
  }
1744
1735
  .rs-picker-toggle .rs-picker-toggle-placeholder {
@@ -1748,10 +1739,6 @@ textarea.rs-input {
1748
1739
  .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value {
1749
1740
  color: var(--rs-picker-value);
1750
1741
  }
1751
- .rs-picker-countable .rs-picker-toggle-value {
1752
- display: flex;
1753
- align-items: center;
1754
- }
1755
1742
  .rs-picker-value-list {
1756
1743
  flex: 0 1 auto;
1757
1744
  overflow: hidden;
@@ -1762,11 +1749,12 @@ textarea.rs-input {
1762
1749
  margin-inline: var(--rs-picker-value-count-margin);
1763
1750
  background-color: var(--rs-picker-count-bg);
1764
1751
  color: var(--rs-picker-count-text);
1752
+ flex-shrink: 0;
1765
1753
  }
1766
1754
  .rs-picker-value-separator {
1767
1755
  margin: 0 var(--rs-spacing) 0 0;
1768
1756
  }
1769
- .rs-picker:not(.rs-picker-disabled):hover,
1757
+ .rs-picker:not([data-disabled='true']):hover,
1770
1758
  .rs-picker.rs-picker-focused {
1771
1759
  border-color: var(--rs-input-focus-border);
1772
1760
  }
@@ -1802,6 +1790,7 @@ textarea.rs-input {
1802
1790
  --rs-picker-popup-shadow: var(--rs-shadow-md);
1803
1791
  --rs-picker-popup-position-x: var(--rs-position-x);
1804
1792
  --rs-picker-popup-position-y: var(--rs-position-y);
1793
+ --rs-picker-min-width: 0;
1805
1794
  position: absolute;
1806
1795
  top: var(--rs-picker-popup-position-y);
1807
1796
  left: var(--rs-picker-popup-position-x) /* rtl:ignore */;
@@ -1815,6 +1804,7 @@ textarea.rs-input {
1815
1804
  background-color: var(--rs-bg-overlay);
1816
1805
  box-shadow: var(--rs-picker-popup-shadow);
1817
1806
  padding-block: var(--rs-picker-popup-border-radius);
1807
+ min-width: var(--rs-picker-min-width);
1818
1808
  }
1819
1809
  .rs-theme-high-contrast .rs-picker-popup {
1820
1810
  border: 1px solid var(--rs-border-primary);
@@ -1840,37 +1830,74 @@ textarea.rs-input {
1840
1830
  color: var(--rs-text-secondary);
1841
1831
  cursor: default;
1842
1832
  }
1843
- .rs-picker-default .rs-picker-toggle {
1833
+ .rs-picker-popup .rs-picker-listbox {
1834
+ max-height: var(--rs-picker-listbox-max-height);
1835
+ }
1836
+ .rs-picker-popup[data-breakpoint='xs'] {
1837
+ min-width: unset;
1838
+ width: 100%;
1839
+ height: 100%;
1840
+ overflow: auto;
1841
+ }
1842
+ .rs-picker-popup[data-breakpoint='xs'] .rs-picker-listbox {
1843
+ height: unset;
1844
+ max-height: unset;
1845
+ }
1846
+ .rs-picker-popup[data-breakpoint='xs'] .rs-tree,
1847
+ .rs-picker-popup[data-breakpoint='xs'] .rs-check-tree {
1848
+ display: flex;
1849
+ flex-direction: column;
1850
+ }
1851
+ .rs-picker-popup[data-breakpoint='xs'] .rs-tree-view,
1852
+ .rs-picker-popup[data-breakpoint='xs'] .rs-check-tree-view {
1853
+ max-height: unset;
1854
+ flex: 1 1 auto;
1855
+ }
1856
+ .rs-picker-popup[data-breakpoint='xs'] .rs-calendar-table {
1857
+ width: 100%;
1858
+ }
1859
+ .rs-picker-popup[data-breakpoint='xs'] .rs-picker-box {
1860
+ width: 100%;
1861
+ height: 100%;
1862
+ flex: 1;
1863
+ display: flex;
1864
+ flex-direction: column;
1865
+ }
1866
+ .rs-picker-popup[data-breakpoint='xs'].rs-picker-popup-date .rs-calendar,
1867
+ .rs-picker-popup[data-breakpoint='xs'] .rs-picker-daterange-panel-only-time .rs-calendar {
1868
+ height: 348px;
1869
+ }
1870
+ [data-variant='default'] .rs-picker-toggle {
1844
1871
  color: var(--rs-text-primary);
1845
1872
  border: var(--rs-picker-toggle-border-width) solid var(--rs-border-primary);
1846
1873
  }
1847
- .rs-picker-disabled .rs-picker-toggle {
1874
+ [data-disabled='true'] .rs-picker-toggle {
1848
1875
  cursor: not-allowed;
1849
1876
  }
1850
- .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):hover,
1851
- .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):focus {
1877
+ .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):hover,
1878
+ .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):focus {
1852
1879
  border-color: var(--rs-input-focus-border);
1853
1880
  }
1854
- .rs-picker-subtle .rs-picker-toggle {
1881
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle {
1855
1882
  --rs-picker-toggle-border-width: 0px;
1856
1883
  position: relative;
1857
1884
  z-index: 5;
1858
1885
  }
1859
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle {
1886
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle {
1860
1887
  cursor: not-allowed;
1861
1888
  }
1862
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover,
1863
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus,
1864
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active {
1889
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover,
1890
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus,
1891
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active {
1865
1892
  background: none;
1866
1893
  }
1867
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover::after,
1868
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus::after,
1869
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active::after {
1894
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover::after,
1895
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus::after,
1896
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active::after {
1870
1897
  display: none;
1871
1898
  }
1872
1899
  .rs-picker-toggle-label {
1873
- color: var(--rs-text-primary);
1900
+ color: var(--rs-text-secondary);
1874
1901
  }
1875
1902
  .rs-picker-toggle .rs-picker-toggle-stack {
1876
1903
  flex: 1 1 auto;
@@ -1909,44 +1936,67 @@ textarea.rs-input {
1909
1936
  .rs-picker-toggle-read-only {
1910
1937
  opacity: 0;
1911
1938
  }
1912
- .rs-picker-default .rs-picker-toggle {
1939
+ .rs-picker-toggle .rs-picker[data-variant='default'],
1940
+ .rs-picker-toggle {
1913
1941
  transition: border-color ease-in-out 0.15s;
1914
1942
  }
1915
- .rs-theme-high-contrast .rs-picker-default .rs-picker-toggle {
1943
+ .rs-theme-high-contrast .rs-picker-toggle .rs-picker[data-variant='default'],
1944
+ .rs-theme-high-contrast .rs-picker-toggle {
1916
1945
  transition: none;
1917
1946
  }
1918
- .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:hover,
1919
- .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:focus,
1920
- .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle-active {
1947
+ .rs-picker-toggle .rs-picker[data-variant='default']:hover,
1948
+ :not([data-disabled='true']) .rs-picker-toggle:hover,
1949
+ .rs-picker-toggle .rs-picker[data-variant='default']:focus,
1950
+ :not([data-disabled='true']) .rs-picker-toggle:focus,
1951
+ .rs-picker-toggle .rs-picker[data-variant='default']-active,
1952
+ :not([data-disabled='true']) .rs-picker-toggle-active {
1921
1953
  border-color: var(--rs-input-focus-border);
1922
1954
  }
1923
- .rs-picker-subtle .rs-picker-toggle {
1955
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle {
1924
1956
  color: var(--rs-btn-subtle-text);
1925
1957
  background-color: transparent;
1926
1958
  transition: none;
1927
1959
  }
1928
- .rs-picker-subtle .rs-picker-toggle:hover {
1960
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle:hover {
1929
1961
  color: var(--rs-btn-subtle-hover-text);
1930
1962
  background-color: var(--rs-btn-subtle-hover-bg);
1931
1963
  }
1932
- .rs-picker-subtle .rs-picker-toggle:active,
1933
- .rs-picker-subtle .rs-picker-toggle.rs-btn-active {
1964
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle:active,
1965
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-active {
1934
1966
  color: var(--rs-btn-subtle-active-text);
1935
1967
  background-color: var(--rs-btn-subtle-active-bg);
1936
1968
  }
1937
- .rs-picker-subtle .rs-picker-toggle:disabled,
1938
- .rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
1969
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle:disabled,
1970
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-disabled {
1939
1971
  color: var(--rs-btn-subtle-disabled-text);
1940
1972
  background: none;
1941
1973
  }
1942
- .rs-theme-high-contrast .rs-picker-subtle .rs-picker-toggle:disabled,
1943
- .rs-theme-high-contrast .rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
1974
+ .rs-theme-high-contrast .rs-picker[data-variant='subtle'] .rs-picker-toggle:disabled,
1975
+ .rs-theme-high-contrast .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-disabled {
1944
1976
  border-color: var(--rs-btn-default-disabled-boreder-color);
1945
1977
  }
1946
- .rs-picker-subtle .rs-picker-toggle-active {
1978
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle-active {
1947
1979
  background-color: var(--rs-btn-subtle-hover-bg);
1948
1980
  color: var(--rs-btn-subtle-hover-text);
1949
1981
  }
1982
+ .rs-picker-toggle[data-size='lg'] .rs-picker-clean .rs-icon {
1983
+ width: 16px;
1984
+ height: 16px;
1985
+ }
1986
+ .rs-picker-toggle[data-size='sm'] .rs-picker-clean {
1987
+ height: 18px;
1988
+ }
1989
+ .rs-picker-toggle[data-size='xs'] .rs-picker-clean {
1990
+ height: 18px;
1991
+ }
1992
+ .rs-picker-toggle[data-size='xs'] .rs-picker-clean .rs-icon {
1993
+ width: 12px;
1994
+ height: 12px;
1995
+ }
1996
+ .rs-picker-toggle[data-countable='true'] .rs-picker-toggle-value {
1997
+ display: flex;
1998
+ align-items: center;
1999
+ }
1950
2000
  .rs-picker-toggle.rs-btn {
1951
2001
  text-align: start;
1952
2002
  display: inline-flex;
@@ -1980,18 +2030,18 @@ textarea.rs-input {
1980
2030
  font-size: var(--rs-font-size-md);
1981
2031
  color: var(--rs-text-secondary);
1982
2032
  }
1983
- .rs-picker-default .rs-btn,
2033
+ .rs-picker[data-variant='default'] .rs-btn,
1984
2034
  .rs-picker-input .rs-btn,
1985
- .rs-picker-default .rs-picker-toggle,
2035
+ .rs-picker[data-variant='default'] .rs-picker-toggle,
1986
2036
  .rs-picker-input .rs-picker-toggle {
1987
2037
  background-color: var(--rs-picker-toggle-bg);
1988
2038
  }
1989
- .rs-picker-default.rs-picker-disabled,
1990
- .rs-picker-input.rs-picker-disabled {
2039
+ .rs-picker[data-variant='default'][data-disabled='true'],
2040
+ .rs-picker-input[data-disabled='true'] {
1991
2041
  --rs-picker-toggle-bg: var(--rs-input-disabled-bg);
1992
2042
  }
1993
- .rs-picker-default.rs-picker-disabled .rs-input-group,
1994
- .rs-picker-input.rs-picker-disabled .rs-input-group {
2043
+ .rs-picker[data-variant='default'][data-disabled='true'] .rs-input-group,
2044
+ .rs-picker-input[data-disabled='true'] .rs-input-group {
1995
2045
  pointer-events: none;
1996
2046
  }
1997
2047
  .rs-check-item {
@@ -2286,7 +2336,7 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
2286
2336
  color: var(--rs-text-secondary);
2287
2337
  }
2288
2338
  .rs-check-tree-view {
2289
- max-height: var(--rs-check-tree-view-max-height);
2339
+ max-height: var(--rs-tree-view-height, var(--rs-check-tree-view-max-height));
2290
2340
  overflow-y: auto;
2291
2341
  }
2292
2342
  .rs-check-tree.rs-tree-virtualized .rs-check-tree-view {
@@ -37,7 +37,7 @@
37
37
  }
38
38
 
39
39
  &-view {
40
- max-height: var(--rs-check-tree-view-max-height);
40
+ max-height: var(--rs-tree-view-height, var(--rs-check-tree-view-max-height));
41
41
  overflow-y: auto;
42
42
  }
43
43
 
@@ -1432,9 +1432,6 @@
1432
1432
  background-color: var(--rs-input-disabled-bg);
1433
1433
  color: var(--rs-text-disabled);
1434
1434
  }
1435
- textarea.rs-input {
1436
- height: auto;
1437
- }
1438
1435
  .rs-input.rs-input-xs {
1439
1436
  --rs-input-font-size: var(--rs-input-font-size-xs);
1440
1437
  --rs-input-line-height: var(--rs-input-line-height-xs);
@@ -1459,10 +1456,6 @@ textarea.rs-input {
1459
1456
  --rs-input-padding-block: var(--rs-input-padding-block-lg);
1460
1457
  --rs-input-padding-inline: var(--rs-input-padding-inline-lg);
1461
1458
  }
1462
- textarea.rs-input {
1463
- overflow: auto;
1464
- resize: vertical;
1465
- }
1466
1459
  .rs-input-group {
1467
1460
  --rs-input-group-input-height-xs: calc(24px - 2px);
1468
1461
  --rs-input-group-input-height-sm: calc(30px - 2px);
@@ -1541,7 +1534,7 @@ textarea.rs-input {
1541
1534
  .rs-input-group .rs-input-number,
1542
1535
  .rs-input-group .rs-input-group-addon,
1543
1536
  .rs-input-group .rs-input-group-btn,
1544
- .rs-input-group .rs-picker-date .rs-picker-toggle {
1537
+ .rs-input-group .rs-picker[data-picker='date'] .rs-picker-toggle {
1545
1538
  border: none;
1546
1539
  border-radius: var(--rs-radius-none);
1547
1540
  outline: none;
@@ -1697,22 +1690,22 @@ textarea.rs-input {
1697
1690
  stroke: var(--rs-close-button-hover-color);
1698
1691
  stroke-width: 1;
1699
1692
  }
1700
- .rs-picker-subtle .picker-subtle-toggle {
1693
+ .rs-picker[data-variant='subtle'] .picker-subtle-toggle {
1701
1694
  --rs-picker-toggle-border-width: 0px;
1702
1695
  position: relative;
1703
1696
  z-index: 5;
1704
1697
  }
1705
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle {
1698
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle {
1706
1699
  cursor: not-allowed;
1707
1700
  }
1708
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover,
1709
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus,
1710
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active {
1701
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover,
1702
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus,
1703
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active {
1711
1704
  background: none;
1712
1705
  }
1713
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover::after,
1714
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus::after,
1715
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active::after {
1706
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover::after,
1707
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus::after,
1708
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active::after {
1716
1709
  display: none;
1717
1710
  }
1718
1711
  .rs-picker {
@@ -1720,25 +1713,23 @@ textarea.rs-input {
1720
1713
  --rs-picker-loader-size: 20px;
1721
1714
  --rs-picker-toggle-border-width: 1px;
1722
1715
  --rs-picker-toggle-bg: var(--rs-input-bg);
1723
- }
1724
- .rs-picker-toggle-wrapper {
1725
1716
  display: inline-block;
1726
1717
  vertical-align: middle;
1727
1718
  max-width: 100%;
1728
1719
  }
1729
- .rs-picker-block {
1720
+ .rs-picker[data-block='true'] {
1730
1721
  display: block;
1731
1722
  width: 100%;
1732
1723
  }
1733
- .rs-picker-disabled {
1724
+ .rs-picker[data-disabled='true'] {
1734
1725
  cursor: not-allowed;
1735
1726
  }
1736
- .rs-picker-disabled .rs-picker-toggle-value,
1737
- .rs-picker-disabled .rs-picker-toggle-indicator,
1738
- .rs-picker-disabled .rs-picker-tag-list .rs-tag {
1727
+ .rs-picker[data-disabled='true'] .rs-picker-toggle-value,
1728
+ .rs-picker[data-disabled='true'] .rs-picker-toggle-indicator,
1729
+ .rs-picker[data-disabled='true'] .rs-picker-tag-list .rs-tag {
1739
1730
  color: var(--rs-text-disabled) !important;
1740
1731
  }
1741
- .rs-picker-disabled .rs-picker-value-count {
1732
+ .rs-picker[data-disabled='true'] .rs-picker-value-count {
1742
1733
  opacity: 0.5;
1743
1734
  }
1744
1735
  .rs-picker-toggle .rs-picker-toggle-placeholder {
@@ -1748,10 +1739,6 @@ textarea.rs-input {
1748
1739
  .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value {
1749
1740
  color: var(--rs-picker-value);
1750
1741
  }
1751
- .rs-picker-countable .rs-picker-toggle-value {
1752
- display: flex;
1753
- align-items: center;
1754
- }
1755
1742
  .rs-picker-value-list {
1756
1743
  flex: 0 1 auto;
1757
1744
  overflow: hidden;
@@ -1762,11 +1749,12 @@ textarea.rs-input {
1762
1749
  margin-inline: var(--rs-picker-value-count-margin);
1763
1750
  background-color: var(--rs-picker-count-bg);
1764
1751
  color: var(--rs-picker-count-text);
1752
+ flex-shrink: 0;
1765
1753
  }
1766
1754
  .rs-picker-value-separator {
1767
1755
  margin: 0 var(--rs-spacing) 0 0;
1768
1756
  }
1769
- .rs-picker:not(.rs-picker-disabled):hover,
1757
+ .rs-picker:not([data-disabled='true']):hover,
1770
1758
  .rs-picker.rs-picker-focused {
1771
1759
  border-color: var(--rs-input-focus-border);
1772
1760
  }
@@ -1802,6 +1790,7 @@ textarea.rs-input {
1802
1790
  --rs-picker-popup-shadow: var(--rs-shadow-md);
1803
1791
  --rs-picker-popup-position-x: var(--rs-position-x);
1804
1792
  --rs-picker-popup-position-y: var(--rs-position-y);
1793
+ --rs-picker-min-width: 0;
1805
1794
  position: absolute;
1806
1795
  top: var(--rs-picker-popup-position-y);
1807
1796
  left: var(--rs-picker-popup-position-x) /* rtl:ignore */;
@@ -1815,6 +1804,7 @@ textarea.rs-input {
1815
1804
  background-color: var(--rs-bg-overlay);
1816
1805
  box-shadow: var(--rs-picker-popup-shadow);
1817
1806
  padding-block: var(--rs-picker-popup-border-radius);
1807
+ min-width: var(--rs-picker-min-width);
1818
1808
  }
1819
1809
  .rs-theme-high-contrast .rs-picker-popup {
1820
1810
  border: 1px solid var(--rs-border-primary);
@@ -1840,37 +1830,74 @@ textarea.rs-input {
1840
1830
  color: var(--rs-text-secondary);
1841
1831
  cursor: default;
1842
1832
  }
1843
- .rs-picker-default .rs-picker-toggle {
1833
+ .rs-picker-popup .rs-picker-listbox {
1834
+ max-height: var(--rs-picker-listbox-max-height);
1835
+ }
1836
+ .rs-picker-popup[data-breakpoint='xs'] {
1837
+ min-width: unset;
1838
+ width: 100%;
1839
+ height: 100%;
1840
+ overflow: auto;
1841
+ }
1842
+ .rs-picker-popup[data-breakpoint='xs'] .rs-picker-listbox {
1843
+ height: unset;
1844
+ max-height: unset;
1845
+ }
1846
+ .rs-picker-popup[data-breakpoint='xs'] .rs-tree,
1847
+ .rs-picker-popup[data-breakpoint='xs'] .rs-check-tree {
1848
+ display: flex;
1849
+ flex-direction: column;
1850
+ }
1851
+ .rs-picker-popup[data-breakpoint='xs'] .rs-tree-view,
1852
+ .rs-picker-popup[data-breakpoint='xs'] .rs-check-tree-view {
1853
+ max-height: unset;
1854
+ flex: 1 1 auto;
1855
+ }
1856
+ .rs-picker-popup[data-breakpoint='xs'] .rs-calendar-table {
1857
+ width: 100%;
1858
+ }
1859
+ .rs-picker-popup[data-breakpoint='xs'] .rs-picker-box {
1860
+ width: 100%;
1861
+ height: 100%;
1862
+ flex: 1;
1863
+ display: flex;
1864
+ flex-direction: column;
1865
+ }
1866
+ .rs-picker-popup[data-breakpoint='xs'].rs-picker-popup-date .rs-calendar,
1867
+ .rs-picker-popup[data-breakpoint='xs'] .rs-picker-daterange-panel-only-time .rs-calendar {
1868
+ height: 348px;
1869
+ }
1870
+ [data-variant='default'] .rs-picker-toggle {
1844
1871
  color: var(--rs-text-primary);
1845
1872
  border: var(--rs-picker-toggle-border-width) solid var(--rs-border-primary);
1846
1873
  }
1847
- .rs-picker-disabled .rs-picker-toggle {
1874
+ [data-disabled='true'] .rs-picker-toggle {
1848
1875
  cursor: not-allowed;
1849
1876
  }
1850
- .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):hover,
1851
- .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):focus {
1877
+ .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):hover,
1878
+ .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):focus {
1852
1879
  border-color: var(--rs-input-focus-border);
1853
1880
  }
1854
- .rs-picker-subtle .rs-picker-toggle {
1881
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle {
1855
1882
  --rs-picker-toggle-border-width: 0px;
1856
1883
  position: relative;
1857
1884
  z-index: 5;
1858
1885
  }
1859
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle {
1886
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle {
1860
1887
  cursor: not-allowed;
1861
1888
  }
1862
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover,
1863
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus,
1864
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active {
1889
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover,
1890
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus,
1891
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active {
1865
1892
  background: none;
1866
1893
  }
1867
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover::after,
1868
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus::after,
1869
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active::after {
1894
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover::after,
1895
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus::after,
1896
+ .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active::after {
1870
1897
  display: none;
1871
1898
  }
1872
1899
  .rs-picker-toggle-label {
1873
- color: var(--rs-text-primary);
1900
+ color: var(--rs-text-secondary);
1874
1901
  }
1875
1902
  .rs-picker-toggle .rs-picker-toggle-stack {
1876
1903
  flex: 1 1 auto;
@@ -1909,44 +1936,67 @@ textarea.rs-input {
1909
1936
  .rs-picker-toggle-read-only {
1910
1937
  opacity: 0;
1911
1938
  }
1912
- .rs-picker-default .rs-picker-toggle {
1939
+ .rs-picker-toggle .rs-picker[data-variant='default'],
1940
+ .rs-picker-toggle {
1913
1941
  transition: border-color ease-in-out 0.15s;
1914
1942
  }
1915
- .rs-theme-high-contrast .rs-picker-default .rs-picker-toggle {
1943
+ .rs-theme-high-contrast .rs-picker-toggle .rs-picker[data-variant='default'],
1944
+ .rs-theme-high-contrast .rs-picker-toggle {
1916
1945
  transition: none;
1917
1946
  }
1918
- .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:hover,
1919
- .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:focus,
1920
- .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle-active {
1947
+ .rs-picker-toggle .rs-picker[data-variant='default']:hover,
1948
+ :not([data-disabled='true']) .rs-picker-toggle:hover,
1949
+ .rs-picker-toggle .rs-picker[data-variant='default']:focus,
1950
+ :not([data-disabled='true']) .rs-picker-toggle:focus,
1951
+ .rs-picker-toggle .rs-picker[data-variant='default']-active,
1952
+ :not([data-disabled='true']) .rs-picker-toggle-active {
1921
1953
  border-color: var(--rs-input-focus-border);
1922
1954
  }
1923
- .rs-picker-subtle .rs-picker-toggle {
1955
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle {
1924
1956
  color: var(--rs-btn-subtle-text);
1925
1957
  background-color: transparent;
1926
1958
  transition: none;
1927
1959
  }
1928
- .rs-picker-subtle .rs-picker-toggle:hover {
1960
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle:hover {
1929
1961
  color: var(--rs-btn-subtle-hover-text);
1930
1962
  background-color: var(--rs-btn-subtle-hover-bg);
1931
1963
  }
1932
- .rs-picker-subtle .rs-picker-toggle:active,
1933
- .rs-picker-subtle .rs-picker-toggle.rs-btn-active {
1964
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle:active,
1965
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-active {
1934
1966
  color: var(--rs-btn-subtle-active-text);
1935
1967
  background-color: var(--rs-btn-subtle-active-bg);
1936
1968
  }
1937
- .rs-picker-subtle .rs-picker-toggle:disabled,
1938
- .rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
1969
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle:disabled,
1970
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-disabled {
1939
1971
  color: var(--rs-btn-subtle-disabled-text);
1940
1972
  background: none;
1941
1973
  }
1942
- .rs-theme-high-contrast .rs-picker-subtle .rs-picker-toggle:disabled,
1943
- .rs-theme-high-contrast .rs-picker-subtle .rs-picker-toggle.rs-btn-disabled {
1974
+ .rs-theme-high-contrast .rs-picker[data-variant='subtle'] .rs-picker-toggle:disabled,
1975
+ .rs-theme-high-contrast .rs-picker[data-variant='subtle'] .rs-picker-toggle.rs-btn-disabled {
1944
1976
  border-color: var(--rs-btn-default-disabled-boreder-color);
1945
1977
  }
1946
- .rs-picker-subtle .rs-picker-toggle-active {
1978
+ .rs-picker[data-variant='subtle'] .rs-picker-toggle-active {
1947
1979
  background-color: var(--rs-btn-subtle-hover-bg);
1948
1980
  color: var(--rs-btn-subtle-hover-text);
1949
1981
  }
1982
+ .rs-picker-toggle[data-size='lg'] .rs-picker-clean .rs-icon {
1983
+ width: 16px;
1984
+ height: 16px;
1985
+ }
1986
+ .rs-picker-toggle[data-size='sm'] .rs-picker-clean {
1987
+ height: 18px;
1988
+ }
1989
+ .rs-picker-toggle[data-size='xs'] .rs-picker-clean {
1990
+ height: 18px;
1991
+ }
1992
+ .rs-picker-toggle[data-size='xs'] .rs-picker-clean .rs-icon {
1993
+ width: 12px;
1994
+ height: 12px;
1995
+ }
1996
+ .rs-picker-toggle[data-countable='true'] .rs-picker-toggle-value {
1997
+ display: flex;
1998
+ align-items: center;
1999
+ }
1950
2000
  .rs-picker-toggle.rs-btn {
1951
2001
  text-align: start;
1952
2002
  display: inline-flex;
@@ -1980,18 +2030,18 @@ textarea.rs-input {
1980
2030
  font-size: var(--rs-font-size-md);
1981
2031
  color: var(--rs-text-secondary);
1982
2032
  }
1983
- .rs-picker-default .rs-btn,
2033
+ .rs-picker[data-variant='default'] .rs-btn,
1984
2034
  .rs-picker-input .rs-btn,
1985
- .rs-picker-default .rs-picker-toggle,
2035
+ .rs-picker[data-variant='default'] .rs-picker-toggle,
1986
2036
  .rs-picker-input .rs-picker-toggle {
1987
2037
  background-color: var(--rs-picker-toggle-bg);
1988
2038
  }
1989
- .rs-picker-default.rs-picker-disabled,
1990
- .rs-picker-input.rs-picker-disabled {
2039
+ .rs-picker[data-variant='default'][data-disabled='true'],
2040
+ .rs-picker-input[data-disabled='true'] {
1991
2041
  --rs-picker-toggle-bg: var(--rs-input-disabled-bg);
1992
2042
  }
1993
- .rs-picker-default.rs-picker-disabled .rs-input-group,
1994
- .rs-picker-input.rs-picker-disabled .rs-input-group {
2043
+ .rs-picker[data-variant='default'][data-disabled='true'] .rs-input-group,
2044
+ .rs-picker-input[data-disabled='true'] .rs-input-group {
1995
2045
  pointer-events: none;
1996
2046
  }
1997
2047
  .rs-check-item {
@@ -2286,7 +2336,7 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
2286
2336
  color: var(--rs-text-secondary);
2287
2337
  }
2288
2338
  .rs-check-tree-view {
2289
- max-height: var(--rs-check-tree-view-max-height);
2339
+ max-height: var(--rs-tree-view-height, var(--rs-check-tree-view-max-height));
2290
2340
  overflow-y: auto;
2291
2341
  }
2292
2342
  .rs-check-tree.rs-tree-virtualized .rs-check-tree-view {