rsuite 6.0.0-canary-2025011413 → 6.0.0-canary-20250315

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 (1224) hide show
  1. package/Accordion/styles/index.css +84 -50
  2. package/AutoComplete/styles/index.css +509 -1297
  3. package/AutoComplete/styles/index.less +6 -1
  4. package/Avatar/styles/index.css +28 -161
  5. package/Avatar/styles/index.less +25 -51
  6. package/AvatarGroup/styles/index.css +120 -5
  7. package/AvatarGroup/styles/index.less +5 -5
  8. package/Badge/styles/index.css +55 -56
  9. package/Badge/styles/index.less +32 -34
  10. package/Badge/styles/variables.less +19 -0
  11. package/Box/package.json +7 -0
  12. package/Box/styles/index.css +129 -0
  13. package/Box/styles/index.less +1 -0
  14. package/Breadcrumb/styles/index.css +22 -11
  15. package/Breadcrumb/styles/index.less +13 -3
  16. package/Button/styles/index.css +107 -202
  17. package/Button/styles/index.less +44 -35
  18. package/Button/styles/mixin.less +24 -87
  19. package/Button/styles/variables.less +30 -0
  20. package/ButtonGroup/styles/index.css +8 -2
  21. package/ButtonGroup/styles/index.less +14 -2
  22. package/ButtonToolbar/styles/index.css +115 -0
  23. package/CHANGELOG.md +50 -0
  24. package/Calendar/styles/index.css +162 -257
  25. package/Calendar/styles/index.less +52 -44
  26. package/Card/styles/index.css +21 -18
  27. package/Card/styles/index.less +8 -7
  28. package/CardGroup/styles/index.css +4 -4
  29. package/CardGroup/styles/index.less +4 -4
  30. package/Carousel/styles/index.css +22 -18
  31. package/Carousel/styles/index.less +10 -10
  32. package/CascadeTree/styles/index.css +27 -21
  33. package/CascadeTree/styles/index.less +10 -8
  34. package/Cascader/styles/index.css +543 -1336
  35. package/Center/package.json +7 -0
  36. package/Center/styles/index.css +8 -0
  37. package/Center/styles/index.less +9 -0
  38. package/CheckPicker/styles/index.css +562 -1430
  39. package/CheckPicker/styles/index.less +3 -10
  40. package/CheckTree/styles/index.css +604 -1488
  41. package/CheckTree/styles/index.less +13 -33
  42. package/CheckTreePicker/styles/index.css +604 -1491
  43. package/CheckTreePicker/styles/index.less +0 -4
  44. package/Checkbox/styles/index.css +53 -122
  45. package/Checkbox/styles/index.less +32 -51
  46. package/Checkbox/styles/mixin.less +3 -20
  47. package/CheckboxGroup/styles/index.css +9 -6
  48. package/CheckboxGroup/styles/index.less +7 -7
  49. package/Col/styles/index.css +0 -20
  50. package/Col/styles/index.less +2 -14
  51. package/DateInput/styles/index.css +64 -45
  52. package/DatePicker/styles/index.css +578 -1365
  53. package/DatePicker/styles/index.less +8 -8
  54. package/DateRangeInput/styles/index.css +64 -45
  55. package/DateRangePicker/styles/index.css +585 -1372
  56. package/DateRangePicker/styles/index.less +4 -4
  57. package/Divider/styles/index.css +57 -23
  58. package/Divider/styles/index.less +60 -15
  59. package/Drawer/styles/index.css +74 -68
  60. package/Drawer/styles/index.less +69 -86
  61. package/Dropdown/styles/index.css +182 -309
  62. package/Dropdown/styles/index.less +70 -84
  63. package/Dropdown/styles/mixin.less +0 -38
  64. package/FlexboxGrid/styles/index.css +26 -1
  65. package/FlexboxGrid/styles/index.less +3 -1
  66. package/Form/styles/index.css +11 -11
  67. package/Form/styles/index.less +12 -16
  68. package/FormControl/styles/index.css +15 -6
  69. package/FormControl/styles/index.less +17 -13
  70. package/FormControlLabel/styles/index.css +8 -11
  71. package/FormControlLabel/styles/index.less +0 -4
  72. package/FormErrorMessage/styles/animation.less +4 -4
  73. package/FormErrorMessage/styles/index.css +68 -103
  74. package/FormErrorMessage/styles/index.less +90 -133
  75. package/FormGroup/styles/index.css +33 -33
  76. package/FormGroup/styles/index.less +26 -27
  77. package/FormHelpText/styles/index.css +14 -11
  78. package/FormHelpText/styles/index.less +2 -3
  79. package/Grid/styles/columns.less +22 -0
  80. package/Grid/styles/grid-framework.less +66 -5
  81. package/Grid/styles/index.css +1179 -457
  82. package/Grid/styles/index.less +6 -19
  83. package/Grid/styles/mixin.less +5 -12
  84. package/Grid/styles/row.less +42 -0
  85. package/Grid/styles/variables.less +5 -0
  86. package/Heading/styles/index.css +46 -15
  87. package/Heading/styles/index.less +17 -16
  88. package/Heading/styles/variables.less +19 -0
  89. package/Highlight/styles/index.css +1 -1
  90. package/Highlight/styles/index.less +1 -1
  91. package/IconButton/styles/index.css +142 -205
  92. package/IconButton/styles/index.less +33 -5
  93. package/Image/styles/index.css +2 -2
  94. package/Image/styles/index.less +2 -2
  95. package/InlineEdit/styles/index.css +42 -48
  96. package/InlineEdit/styles/index.less +19 -17
  97. package/Input/styles/index.css +64 -45
  98. package/Input/styles/index.less +13 -14
  99. package/Input/styles/mixin.less +43 -0
  100. package/Input/styles/variables.less +22 -0
  101. package/InputGroup/styles/index.css +182 -536
  102. package/InputGroup/styles/index.less +94 -248
  103. package/InputNumber/styles/index.css +255 -627
  104. package/InputNumber/styles/index.less +20 -41
  105. package/InputPicker/styles/index.css +589 -1417
  106. package/InputPicker/styles/index.less +23 -65
  107. package/Kbd/package.json +7 -0
  108. package/Kbd/styles/index.css +108 -0
  109. package/Kbd/styles/index.less +20 -0
  110. package/Kbd/styles/mixin.less +24 -0
  111. package/Kbd/styles/variables.less +13 -0
  112. package/List/styles/index.css +19 -15
  113. package/List/styles/index.less +7 -7
  114. package/Loader/styles/index.css +64 -172
  115. package/Loader/styles/index.less +28 -101
  116. package/Loader/styles/mixin.less +4 -25
  117. package/Loader/styles/variables.less +16 -0
  118. package/Menu/package.json +7 -0
  119. package/Menu/styles/index.css +191 -0
  120. package/Menu/styles/index.less +108 -0
  121. package/MenuItem/package.json +7 -0
  122. package/MenuSeparator/package.json +7 -0
  123. package/Message/styles/index.css +111 -174
  124. package/Message/styles/index.less +72 -99
  125. package/Modal/styles/index.css +105 -115
  126. package/Modal/styles/index.less +122 -120
  127. package/MultiCascadeTree/styles/index.css +595 -1453
  128. package/MultiCascadeTree/styles/index.less +13 -4
  129. package/MultiCascader/styles/index.css +572 -1430
  130. package/MultiCascader/styles/index.less +1 -1
  131. package/Nav/styles/index.css +214 -329
  132. package/Nav/styles/index.less +31 -19
  133. package/Navbar/styles/index.css +206 -323
  134. package/Navbar/styles/index.less +23 -12
  135. package/Notification/styles/index.css +60 -68
  136. package/Notification/styles/index.less +51 -47
  137. package/Pagination/styles/index.css +631 -1574
  138. package/Pagination/styles/index.less +6 -17
  139. package/Pagination/styles/pagination-group.less +2 -19
  140. package/Panel/styles/index.css +80 -46
  141. package/Panel/styles/index.less +25 -18
  142. package/PanelGroup/styles/index.css +14 -11
  143. package/PanelGroup/styles/index.less +3 -3
  144. package/Placeholder/styles/index.css +50 -30
  145. package/Placeholder/styles/index.less +44 -31
  146. package/Popover/styles/index.css +131 -93
  147. package/Popover/styles/index.less +95 -80
  148. package/Progress/styles/index.css +37 -41
  149. package/Progress/styles/index.less +26 -39
  150. package/Radio/styles/index.css +53 -112
  151. package/Radio/styles/index.less +35 -49
  152. package/Radio/styles/mixin.less +1 -1
  153. package/RadioGroup/styles/index.css +36 -29
  154. package/RadioGroup/styles/index.less +25 -30
  155. package/RadioTile/styles/index.css +24 -16
  156. package/RadioTile/styles/index.less +13 -8
  157. package/RangeSlider/styles/index.css +100 -93
  158. package/Rate/styles/index.css +39 -49
  159. package/Rate/styles/index.less +13 -17
  160. package/Row/styles/index.css +0 -25
  161. package/Row/styles/index.less +2 -10
  162. package/SelectPicker/styles/index.css +552 -1342
  163. package/SelectPicker/styles/index.less +2 -2
  164. package/Sidenav/styles/index.css +215 -194
  165. package/Sidenav/styles/index.less +154 -155
  166. package/Sidenav/styles/mixin.less +6 -5
  167. package/SidenavFooter/package.json +7 -0
  168. package/SidenavGroupLabel/package.json +7 -0
  169. package/Slider/styles/index.css +100 -93
  170. package/Slider/styles/index.less +24 -22
  171. package/Stack/styles/index.css +115 -0
  172. package/Stack/styles/index.less +78 -0
  173. package/Stat/styles/index.css +227 -282
  174. package/Stat/styles/index.less +21 -14
  175. package/StatGroup/styles/index.css +4 -4
  176. package/StatGroup/styles/index.less +4 -4
  177. package/Steps/styles/index.css +81 -88
  178. package/Steps/styles/index.less +83 -105
  179. package/Table/styles/index.css +36 -30
  180. package/Table/styles/index.less +18 -17
  181. package/Tabs/styles/index.css +214 -329
  182. package/Tag/styles/index.css +49 -59
  183. package/Tag/styles/index.less +37 -60
  184. package/TagGroup/styles/index.css +5 -5
  185. package/TagGroup/styles/index.less +5 -5
  186. package/TagInput/styles/index.css +901 -1816
  187. package/TagInput/styles/index.less +1 -9
  188. package/TagPicker/styles/index.css +920 -1829
  189. package/TagPicker/styles/index.less +67 -63
  190. package/Text/styles/index.css +122 -41
  191. package/Text/styles/index.less +28 -25
  192. package/Text/styles/variables.less +9 -0
  193. package/TimePicker/styles/index.css +578 -1365
  194. package/TimeRangePicker/styles/index.css +585 -1372
  195. package/Timeline/stories/styles.less +6 -6
  196. package/Timeline/styles/index.css +28 -25
  197. package/Timeline/styles/index.less +17 -17
  198. package/Toggle/styles/index.css +144 -293
  199. package/Toggle/styles/index.less +210 -115
  200. package/Tooltip/styles/index.css +75 -71
  201. package/Tooltip/styles/index.less +93 -76
  202. package/Tree/styles/indent-line.less +1 -1
  203. package/Tree/styles/index.css +573 -1361
  204. package/Tree/styles/index.less +20 -16
  205. package/Tree/styles/toggle.less +3 -7
  206. package/TreePicker/styles/index.css +573 -1361
  207. package/Uploader/styles/index.css +197 -288
  208. package/Uploader/styles/index.less +36 -31
  209. package/cjs/Affix/Affix.js +3 -3
  210. package/cjs/Animation/Bounce.js +1 -1
  211. package/cjs/Animation/Collapse.js +1 -1
  212. package/cjs/Animation/Fade.js +1 -1
  213. package/cjs/Animation/Slide.js +1 -1
  214. package/cjs/AutoComplete/AutoComplete.d.ts +5 -13
  215. package/cjs/AutoComplete/AutoComplete.js +15 -20
  216. package/cjs/Avatar/Avatar.d.ts +3 -5
  217. package/cjs/Avatar/Avatar.js +11 -6
  218. package/cjs/AvatarGroup/AvatarGroup.d.ts +2 -4
  219. package/cjs/AvatarGroup/AvatarGroup.js +6 -8
  220. package/cjs/Badge/Badge.js +8 -3
  221. package/cjs/Box/index.d.ts +4 -0
  222. package/cjs/Box/index.js +11 -0
  223. package/cjs/Breadcrumb/Breadcrumb.d.ts +4 -0
  224. package/cjs/Breadcrumb/Breadcrumb.js +11 -5
  225. package/cjs/Breadcrumb/BreadcrumbItem.d.ts +4 -0
  226. package/cjs/Breadcrumb/BreadcrumbItem.js +5 -4
  227. package/cjs/Button/Button.d.ts +3 -3
  228. package/cjs/Button/Button.js +6 -7
  229. package/cjs/ButtonGroup/ButtonGroup.d.ts +4 -2
  230. package/cjs/ButtonGroup/ButtonGroup.js +9 -5
  231. package/cjs/ButtonGroup/ButtonGroupContext.d.ts +3 -2
  232. package/cjs/ButtonToolbar/ButtonToolbar.d.ts +1 -1
  233. package/cjs/ButtonToolbar/ButtonToolbar.js +5 -6
  234. package/cjs/Calendar/Calendar.js +3 -3
  235. package/cjs/Calendar/CalendarBody.js +3 -3
  236. package/cjs/Calendar/CalendarContainer.js +3 -3
  237. package/cjs/Calendar/CalendarHeader.js +3 -3
  238. package/cjs/Calendar/Grid/Grid.js +3 -3
  239. package/cjs/Calendar/Grid/GridCell.js +1 -1
  240. package/cjs/Calendar/Grid/GridHeaderRow.js +1 -1
  241. package/cjs/Calendar/Grid/GridRow.js +1 -1
  242. package/cjs/Calendar/MonthDropdown/MonthDropdown.js +3 -3
  243. package/cjs/Calendar/MonthDropdown/MonthDropdownItem.js +3 -3
  244. package/cjs/Calendar/TimeDropdown/TimeDropdown.js +1 -1
  245. package/cjs/Card/Card.js +5 -7
  246. package/cjs/CardGroup/CardGroup.js +5 -8
  247. package/cjs/Carousel/Carousel.js +5 -4
  248. package/cjs/CascadeTree/CascadeTree.d.ts +2 -2
  249. package/cjs/CascadeTree/CascadeTree.js +3 -3
  250. package/cjs/CascadeTree/SearchView.d.ts +6 -6
  251. package/cjs/CascadeTree/SearchView.js +3 -3
  252. package/cjs/CascadeTree/TreeView.d.ts +6 -6
  253. package/cjs/CascadeTree/TreeView.js +7 -6
  254. package/cjs/CascadeTree/hooks/useSearch.d.ts +5 -5
  255. package/cjs/CascadeTree/hooks/useSearch.js +0 -0
  256. package/cjs/CascadeTree/hooks/useSelect.d.ts +6 -6
  257. package/cjs/CascadeTree/hooks/useSelect.js +0 -0
  258. package/cjs/CascadeTree/types.d.ts +10 -10
  259. package/cjs/CascadeTree/types.js +0 -0
  260. package/cjs/Cascader/Cascader.d.ts +6 -43
  261. package/cjs/Cascader/Cascader.js +7 -29
  262. package/cjs/Cascader/useActive.d.ts +1 -1
  263. package/cjs/Cascader/useActive.js +0 -0
  264. package/cjs/Center/Center.d.ts +6 -0
  265. package/cjs/Center/Center.js +34 -0
  266. package/cjs/Center/index.d.ts +4 -0
  267. package/cjs/Center/index.js +11 -0
  268. package/cjs/CheckPicker/CheckPicker.d.ts +7 -5
  269. package/cjs/CheckPicker/CheckPicker.js +16 -23
  270. package/cjs/CheckTree/CheckTreeNode.js +3 -3
  271. package/cjs/CheckTree/CheckTreeView.d.ts +1 -1
  272. package/cjs/CheckTree/CheckTreeView.js +3 -3
  273. package/cjs/CheckTreePicker/CheckTreePicker.d.ts +2 -10
  274. package/cjs/CheckTreePicker/CheckTreePicker.js +5 -17
  275. package/cjs/CheckTreePicker/hooks/useFocusState.d.ts +1 -1
  276. package/cjs/CheckTreePicker/hooks/useFocusState.js +0 -0
  277. package/cjs/Checkbox/Checkbox.d.ts +3 -3
  278. package/cjs/Checkbox/Checkbox.js +3 -3
  279. package/cjs/CheckboxGroup/CheckboxGroup.js +3 -3
  280. package/cjs/Col/index.d.ts +2 -2
  281. package/cjs/Col/index.js +1 -1
  282. package/cjs/Container/Container.js +3 -3
  283. package/cjs/CustomProvider/CustomProvider.d.ts +27 -13
  284. package/cjs/CustomProvider/CustomProvider.js +4 -4
  285. package/cjs/CustomProvider/types.d.ts +2 -0
  286. package/cjs/CustomProvider/types.js +0 -0
  287. package/cjs/DateInput/DateField.d.ts +2 -122
  288. package/cjs/DateInput/DateInput.js +1 -1
  289. package/cjs/DateInput/hooks/useDateInputState.d.ts +1 -121
  290. package/cjs/DatePicker/DatePicker.js +13 -26
  291. package/cjs/DatePicker/PredefinedRanges.d.ts +1 -1
  292. package/cjs/DatePicker/PredefinedRanges.js +1 -1
  293. package/cjs/DatePicker/Toolbar.js +5 -5
  294. package/cjs/DatePicker/hooks/useFocus.d.ts +1 -1
  295. package/cjs/DatePicker/utils.d.ts +1 -1
  296. package/cjs/DateRangeInput/DateRangeInput.js +4 -4
  297. package/cjs/DateRangePicker/DateRangePicker.d.ts +7 -1
  298. package/cjs/DateRangePicker/DateRangePicker.js +17 -20
  299. package/cjs/DateRangePicker/Header.js +1 -1
  300. package/cjs/DateRangePicker/hooks/useDateDisabled.d.ts +0 -1
  301. package/cjs/DateRangePicker/hooks/useDateDisabled.js +3 -7
  302. package/cjs/DateRangePicker/types.d.ts +1 -1
  303. package/cjs/Divider/Divider.d.ts +27 -2
  304. package/cjs/Divider/Divider.js +25 -14
  305. package/cjs/Drawer/Drawer.js +1 -1
  306. package/cjs/Dropdown/Dropdown.d.ts +36 -37
  307. package/cjs/Dropdown/Dropdown.js +11 -13
  308. package/cjs/Dropdown/DropdownItem.d.ts +9 -19
  309. package/cjs/Dropdown/DropdownItem.js +19 -14
  310. package/cjs/Dropdown/DropdownMenu.d.ts +10 -11
  311. package/cjs/Dropdown/DropdownMenu.js +11 -11
  312. package/cjs/Dropdown/DropdownSeparator.js +3 -3
  313. package/cjs/Dropdown/DropdownToggle.js +3 -3
  314. package/cjs/Dropdown/types.d.ts +32 -0
  315. package/cjs/Dropdown/types.js +4 -0
  316. package/cjs/FlexboxGrid/FlexboxGrid.d.ts +16 -2
  317. package/cjs/FlexboxGrid/FlexboxGrid.js +11 -3
  318. package/cjs/FlexboxGrid/FlexboxGridItem.d.ts +9 -2
  319. package/cjs/FlexboxGrid/FlexboxGridItem.js +5 -4
  320. package/cjs/Form/hooks/useFormClassNames.js +3 -3
  321. package/cjs/Form/hooks/useFormRef.d.ts +1 -1
  322. package/cjs/Form/hooks/useFormValidate.js +0 -0
  323. package/cjs/FormControl/FormControl.js +3 -3
  324. package/cjs/FormControl/utils.d.ts +8 -0
  325. package/cjs/FormControl/utils.js +44 -1
  326. package/cjs/FormControlLabel/FormControlLabel.js +3 -3
  327. package/cjs/FormErrorMessage/FormErrorMessage.js +7 -9
  328. package/cjs/FormGroup/FormGroup.js +3 -3
  329. package/cjs/FormHelpText/FormHelpText.js +3 -3
  330. package/cjs/Grid/Col.d.ts +22 -0
  331. package/cjs/Grid/Col.js +114 -0
  332. package/cjs/Grid/Grid.d.ts +1 -1
  333. package/cjs/Grid/Grid.js +4 -6
  334. package/cjs/Grid/Row.d.ts +16 -0
  335. package/cjs/Grid/Row.js +62 -0
  336. package/cjs/Grid/index.d.ts +6 -1
  337. package/cjs/Grid/index.js +4 -0
  338. package/cjs/Grid/types.d.ts +65 -0
  339. package/cjs/Grid/types.js +4 -0
  340. package/cjs/Heading/Heading.js +3 -3
  341. package/cjs/Highlight/Highlight.js +3 -3
  342. package/cjs/IconButton/IconButton.js +3 -3
  343. package/cjs/Image/Image.js +3 -3
  344. package/cjs/InlineEdit/EditableControls.js +1 -2
  345. package/cjs/InlineEdit/InlineEdit.js +4 -4
  346. package/cjs/InlineEdit/renderChildren.d.ts +2 -1
  347. package/cjs/InlineEdit/renderChildren.js +3 -2
  348. package/cjs/InlineEdit/useFocusEvent.d.ts +2 -2
  349. package/cjs/Input/Input.d.ts +3 -3
  350. package/cjs/Input/Input.js +7 -7
  351. package/cjs/InputGroup/InputGroup.d.ts +3 -2
  352. package/cjs/InputGroup/InputGroup.js +6 -5
  353. package/cjs/InputGroup/InputGroupAddon.js +3 -3
  354. package/cjs/InputGroup/InputGroupButton.js +3 -6
  355. package/cjs/InputNumber/InputNumber.d.ts +3 -3
  356. package/cjs/InputNumber/InputNumber.js +8 -6
  357. package/cjs/InputPicker/InputPicker.d.ts +7 -6
  358. package/cjs/InputPicker/InputPicker.js +30 -28
  359. package/cjs/InputPicker/InputSearch.d.ts +3 -3
  360. package/cjs/InputPicker/InputSearch.js +3 -3
  361. package/cjs/InputPicker/TagList.js +1 -1
  362. package/cjs/InputPicker/TextBox.js +7 -6
  363. package/cjs/InputPicker/hooks/useData.d.ts +9 -9
  364. package/cjs/InputPicker/hooks/useData.js +0 -0
  365. package/cjs/InputPicker/hooks/useInput.d.ts +3 -3
  366. package/cjs/InputPicker/hooks/useInput.js +1 -1
  367. package/cjs/InputPicker/hooks/useMaxWidth.d.ts +2 -2
  368. package/cjs/InputPicker/utils.d.ts +1 -1
  369. package/cjs/Kbd/Kbd.d.ts +15 -0
  370. package/cjs/Kbd/Kbd.js +40 -0
  371. package/cjs/Kbd/index.d.ts +4 -0
  372. package/cjs/Kbd/index.js +11 -0
  373. package/cjs/List/List.js +3 -3
  374. package/cjs/List/ListItem.js +3 -3
  375. package/cjs/List/helper/useSortHelper.d.ts +1 -1
  376. package/cjs/List/helper/useSortHelper.js +1 -1
  377. package/cjs/Loader/Loader.d.ts +2 -2
  378. package/cjs/Loader/Loader.js +7 -8
  379. package/cjs/MaskedInput/MaskedInput.d.ts +2 -1
  380. package/cjs/MaskedInput/TextMask.js +1 -1
  381. package/cjs/Menu/Menu.d.ts +18 -0
  382. package/cjs/Menu/Menu.js +56 -0
  383. package/cjs/Menu/MenuContext.d.ts +7 -0
  384. package/cjs/{internals/Overlay/OverlayContext.js → Menu/MenuContext.js} +3 -3
  385. package/cjs/Menu/MenuItem.d.ts +25 -0
  386. package/cjs/Menu/MenuItem.js +84 -0
  387. package/cjs/Menu/MenuSeparator.d.ts +12 -0
  388. package/cjs/Menu/MenuSeparator.js +33 -0
  389. package/cjs/Menu/index.d.ts +8 -0
  390. package/cjs/Menu/index.js +15 -0
  391. package/cjs/Message/Message.js +8 -8
  392. package/cjs/Modal/Modal.d.ts +2 -0
  393. package/cjs/Modal/Modal.js +6 -4
  394. package/cjs/Modal/ModalBody.js +6 -7
  395. package/cjs/Modal/ModalDialog.d.ts +2 -2
  396. package/cjs/Modal/ModalDialog.js +6 -9
  397. package/cjs/Modal/ModalFooter.js +0 -0
  398. package/cjs/Modal/ModalHeader.js +3 -3
  399. package/cjs/Modal/ModalTitle.js +3 -3
  400. package/cjs/Modal/utils.d.ts +3 -3
  401. package/cjs/Modal/utils.js +2 -2
  402. package/cjs/MultiCascadeTree/MultiCascadeTree.js +3 -3
  403. package/cjs/MultiCascadeTree/SearchView.d.ts +4 -4
  404. package/cjs/MultiCascadeTree/SearchView.js +3 -3
  405. package/cjs/MultiCascadeTree/TreeView.d.ts +6 -6
  406. package/cjs/MultiCascadeTree/TreeView.js +3 -4
  407. package/cjs/MultiCascadeTree/hooks/useCascadeValue.js +0 -0
  408. package/cjs/MultiCascadeTree/hooks/useSearch.d.ts +3 -3
  409. package/cjs/MultiCascadeTree/hooks/useSearch.js +0 -0
  410. package/cjs/MultiCascadeTree/hooks/useSelect.d.ts +9 -9
  411. package/cjs/MultiCascadeTree/hooks/useSelect.js +1 -1
  412. package/cjs/MultiCascadeTree/index.d.ts +1 -1
  413. package/cjs/MultiCascadeTree/types.d.ts +2 -2
  414. package/cjs/MultiCascadeTree/types.js +0 -0
  415. package/cjs/MultiCascadeTree/utils.d.ts +2 -2
  416. package/cjs/MultiCascadeTree/utils.js +0 -0
  417. package/cjs/MultiCascader/MultiCascader.d.ts +8 -45
  418. package/cjs/MultiCascader/MultiCascader.js +7 -29
  419. package/cjs/Nav/AdaptiveNavItem.js +8 -8
  420. package/cjs/Nav/Nav.d.ts +4 -7
  421. package/cjs/Nav/Nav.js +6 -4
  422. package/cjs/Nav/NavDropdown.d.ts +3 -3
  423. package/cjs/Nav/NavDropdown.js +11 -13
  424. package/cjs/Nav/NavDropdownItem.d.ts +3 -17
  425. package/cjs/Nav/NavDropdownItem.js +5 -5
  426. package/cjs/Nav/NavDropdownMenu.d.ts +17 -10
  427. package/cjs/Nav/NavDropdownMenu.js +5 -5
  428. package/cjs/Nav/NavDropdownToggle.js +4 -4
  429. package/cjs/Nav/NavItem.d.ts +2 -2
  430. package/cjs/Nav/NavItem.js +3 -3
  431. package/cjs/Nav/NavMegaMenu.d.ts +5 -0
  432. package/cjs/Nav/NavMegaMenu.js +24 -0
  433. package/cjs/Nav/NavMenu.js +4 -4
  434. package/cjs/Nav/index.d.ts +3 -1
  435. package/cjs/Nav/index.js +2 -0
  436. package/cjs/Navbar/Navbar.d.ts +1 -5
  437. package/cjs/Navbar/Navbar.js +3 -3
  438. package/cjs/Navbar/NavbarContent.d.ts +3 -6
  439. package/cjs/Navbar/NavbarContent.js +3 -1
  440. package/cjs/Navbar/NavbarDropdown.d.ts +1 -1
  441. package/cjs/Navbar/NavbarDropdown.js +7 -8
  442. package/cjs/Navbar/NavbarDropdownItem.d.ts +3 -17
  443. package/cjs/Navbar/NavbarDropdownItem.js +5 -5
  444. package/cjs/Navbar/NavbarDropdownMenu.d.ts +18 -10
  445. package/cjs/Navbar/NavbarDropdownMenu.js +7 -7
  446. package/cjs/Navbar/NavbarDropdownToggle.js +3 -3
  447. package/cjs/Navbar/NavbarItem.d.ts +2 -2
  448. package/cjs/Navbar/NavbarItem.js +3 -3
  449. package/cjs/Navbar/NavbarMegaMenu.d.ts +26 -0
  450. package/cjs/Navbar/NavbarMegaMenu.js +61 -0
  451. package/cjs/Notification/Notification.js +9 -17
  452. package/cjs/Pagination/LimitPicker.d.ts +2 -2
  453. package/cjs/Pagination/LimitPicker.js +1 -1
  454. package/cjs/Pagination/Pagination.d.ts +2 -2
  455. package/cjs/Pagination/Pagination.js +19 -18
  456. package/cjs/Pagination/PaginationButton.d.ts +10 -6
  457. package/cjs/Pagination/PaginationButton.js +30 -16
  458. package/cjs/Pagination/PaginationGroup.js +3 -3
  459. package/cjs/Panel/AccordionButton.js +3 -4
  460. package/cjs/Panel/Panel.js +3 -3
  461. package/cjs/Panel/PanelBody.js +3 -3
  462. package/cjs/Panel/PanelHeader.js +1 -1
  463. package/cjs/PanelGroup/PanelGroup.js +3 -3
  464. package/cjs/Placeholder/PlaceholderGraph.js +8 -9
  465. package/cjs/Placeholder/PlaceholderGrid.js +12 -11
  466. package/cjs/Placeholder/PlaceholderParagraph.js +15 -15
  467. package/cjs/Popover/Popover.js +9 -9
  468. package/cjs/Progress/ProgressCircle.js +3 -3
  469. package/cjs/Progress/ProgressLine.js +3 -3
  470. package/cjs/Radio/Radio.d.ts +3 -3
  471. package/cjs/Radio/Radio.js +3 -3
  472. package/cjs/RadioGroup/RadioGroup.js +3 -3
  473. package/cjs/RadioTile/RadioTile.d.ts +3 -3
  474. package/cjs/RadioTile/RadioTile.js +3 -4
  475. package/cjs/RadioTileGroup/RadioTileGroup.js +3 -4
  476. package/cjs/RangeSlider/RangeSlider.js +3 -3
  477. package/cjs/Rate/Character.js +3 -3
  478. package/cjs/Rate/Rate.d.ts +3 -3
  479. package/cjs/Rate/Rate.js +3 -3
  480. package/cjs/Row/index.d.ts +2 -2
  481. package/cjs/Row/index.js +1 -1
  482. package/cjs/SelectPicker/SelectPicker.d.ts +7 -17
  483. package/cjs/SelectPicker/SelectPicker.js +16 -23
  484. package/cjs/SelectPicker/index.d.ts +1 -1
  485. package/cjs/Sidebar/Sidebar.js +6 -7
  486. package/cjs/Sidenav/ExpandedSidenavDropdown.js +9 -12
  487. package/cjs/Sidenav/ExpandedSidenavDropdownItem.d.ts +2 -2
  488. package/cjs/Sidenav/ExpandedSidenavDropdownItem.js +6 -6
  489. package/cjs/Sidenav/ExpandedSidenavDropdownMenu.d.ts +2 -2
  490. package/cjs/Sidenav/ExpandedSidenavDropdownMenu.js +3 -3
  491. package/cjs/Sidenav/Sidenav.d.ts +6 -0
  492. package/cjs/Sidenav/Sidenav.js +7 -3
  493. package/cjs/Sidenav/SidenavDropdown.d.ts +3 -3
  494. package/cjs/Sidenav/SidenavDropdown.js +13 -15
  495. package/cjs/Sidenav/SidenavDropdownCollapse.js +3 -3
  496. package/cjs/Sidenav/SidenavDropdownItem.d.ts +3 -17
  497. package/cjs/Sidenav/SidenavDropdownItem.js +5 -5
  498. package/cjs/Sidenav/SidenavDropdownMenu.d.ts +11 -8
  499. package/cjs/Sidenav/SidenavDropdownMenu.js +5 -5
  500. package/cjs/Sidenav/SidenavDropdownToggle.js +11 -11
  501. package/cjs/Sidenav/SidenavFooter.d.ts +11 -0
  502. package/cjs/Sidenav/SidenavFooter.js +15 -0
  503. package/cjs/Sidenav/SidenavGroupLabel.d.ts +11 -0
  504. package/cjs/Sidenav/SidenavGroupLabel.js +15 -0
  505. package/cjs/Sidenav/SidenavItem.d.ts +28 -9
  506. package/cjs/Sidenav/SidenavItem.js +21 -12
  507. package/cjs/Sidenav/SidenavToggle.d.ts +0 -6
  508. package/cjs/Sidenav/SidenavToggle.js +12 -18
  509. package/cjs/Sidenav/index.d.ts +3 -1
  510. package/cjs/Sidenav/index.js +4 -0
  511. package/cjs/Slider/Graduated.js +1 -1
  512. package/cjs/Slider/Handle.js +3 -4
  513. package/cjs/Slider/Input.js +2 -4
  514. package/cjs/Slider/Mark.js +3 -3
  515. package/cjs/Slider/ProgressBar.js +5 -6
  516. package/cjs/Slider/Slider.js +3 -3
  517. package/cjs/Slider/useDrag.d.ts +2 -2
  518. package/cjs/Slider/useDrag.js +1 -1
  519. package/cjs/Stack/HStack.d.ts +1 -1
  520. package/cjs/Stack/HStack.js +1 -6
  521. package/cjs/Stack/Stack.d.ts +20 -25
  522. package/cjs/Stack/Stack.js +19 -35
  523. package/cjs/Stack/StackItem.d.ts +2 -5
  524. package/cjs/Stack/StackItem.js +18 -17
  525. package/cjs/Stack/VStack.d.ts +1 -1
  526. package/cjs/Stack/VStack.js +1 -6
  527. package/cjs/Stat/Stat.js +3 -3
  528. package/cjs/Stat/StatLabel.js +3 -3
  529. package/cjs/Stat/StatTrend.js +3 -3
  530. package/cjs/Stat/StatValue.js +3 -3
  531. package/cjs/StatGroup/StatGroup.js +5 -8
  532. package/cjs/Steps/StepItem.js +12 -15
  533. package/cjs/Steps/Steps.js +3 -3
  534. package/cjs/Table/Table.d.ts +2 -2
  535. package/cjs/Tabs/TabPanel.js +3 -3
  536. package/cjs/Tabs/Tabs.js +5 -4
  537. package/cjs/Tag/Tag.js +3 -5
  538. package/cjs/TagPicker/TagPicker.d.ts +10 -5
  539. package/cjs/TagPicker/TagPicker.js +9 -4
  540. package/cjs/Text/Text.d.ts +2 -9
  541. package/cjs/Text/Text.js +17 -16
  542. package/cjs/TimeRangePicker/TimeRangePicker.d.ts +1 -1
  543. package/cjs/Timeline/Timeline.js +3 -3
  544. package/cjs/Timeline/TimelineItem.js +3 -3
  545. package/cjs/Toggle/Toggle.d.ts +4 -4
  546. package/cjs/Toggle/Toggle.js +4 -4
  547. package/cjs/Tooltip/Tooltip.js +9 -8
  548. package/cjs/Tree/IndentLine.js +1 -1
  549. package/cjs/Tree/TreeNode.js +4 -7
  550. package/cjs/Tree/TreeNodeToggle.js +1 -1
  551. package/cjs/Tree/TreeView.d.ts +2 -2
  552. package/cjs/Tree/TreeView.js +3 -3
  553. package/cjs/Tree/hooks/useFocusTree.d.ts +1 -1
  554. package/cjs/TreePicker/TreePicker.d.ts +2 -10
  555. package/cjs/TreePicker/TreePicker.js +5 -17
  556. package/cjs/TreePicker/hooks/useFocusState.d.ts +1 -1
  557. package/cjs/TreePicker/hooks/useFocusState.js +0 -0
  558. package/cjs/Uploader/UploadFileItem.js +3 -3
  559. package/cjs/Uploader/UploadTrigger.d.ts +3 -1
  560. package/cjs/Uploader/UploadTrigger.js +20 -13
  561. package/cjs/Uploader/Uploader.d.ts +1 -1
  562. package/cjs/Uploader/Uploader.js +7 -7
  563. package/cjs/Uploader/utils/ajaxUpload.d.ts +1 -1
  564. package/cjs/Whisper/Whisper.d.ts +2 -1
  565. package/cjs/index.d.ts +5 -3
  566. package/cjs/index.js +30 -18
  567. package/cjs/internals/Box/Box.d.ts +43 -0
  568. package/cjs/internals/Box/Box.js +42 -0
  569. package/cjs/internals/Box/index.d.ts +3 -0
  570. package/cjs/internals/Box/index.js +8 -0
  571. package/cjs/internals/Box/utils.d.ts +18 -0
  572. package/cjs/internals/Box/utils.js +120 -0
  573. package/cjs/internals/CloseButton/CloseButton.js +3 -3
  574. package/cjs/internals/Menu/MenuItem.d.ts +1 -1
  575. package/cjs/internals/Menu/MenuItem.js +1 -1
  576. package/cjs/internals/Menu/Menubar.js +4 -1
  577. package/cjs/internals/Menu/useRenderMenuItem.d.ts +2 -0
  578. package/cjs/{Dropdown/useRenderDropdownItem.js → internals/Menu/useRenderMenuItem.js} +2 -2
  579. package/cjs/internals/Overlay/Modal.js +8 -10
  580. package/cjs/internals/Overlay/Overlay.d.ts +5 -6
  581. package/cjs/internals/Overlay/Overlay.js +25 -20
  582. package/cjs/internals/Overlay/OverlayProvider.d.ts +13 -0
  583. package/cjs/internals/Overlay/OverlayProvider.js +24 -0
  584. package/cjs/internals/Overlay/OverlayTrigger.d.ts +1 -10
  585. package/cjs/internals/Overlay/OverlayTrigger.js +6 -5
  586. package/cjs/internals/Overlay/Position.d.ts +6 -10
  587. package/cjs/internals/Overlay/Position.js +18 -18
  588. package/cjs/internals/Overlay/index.d.ts +2 -0
  589. package/cjs/internals/Overlay/index.js +13 -0
  590. package/cjs/internals/Overlay/positionUtils.d.ts +2 -20
  591. package/cjs/internals/Overlay/positionUtils.js +3 -3
  592. package/cjs/internals/Overlay/types.d.ts +37 -0
  593. package/cjs/internals/Picker/ListCheckItem.d.ts +2 -2
  594. package/cjs/internals/Picker/ListCheckItem.js +3 -3
  595. package/cjs/internals/Picker/ListItem.d.ts +2 -2
  596. package/cjs/internals/Picker/ListItem.js +3 -3
  597. package/cjs/internals/Picker/ListItemGroup.js +3 -3
  598. package/cjs/internals/Picker/Listbox.d.ts +5 -5
  599. package/cjs/internals/Picker/Listbox.js +10 -10
  600. package/cjs/internals/Picker/PickerIndicator.d.ts +3 -1
  601. package/cjs/internals/Picker/PickerIndicator.js +5 -3
  602. package/cjs/internals/Picker/PickerPopup.d.ts +2 -2
  603. package/cjs/internals/Picker/PickerPopup.js +17 -14
  604. package/cjs/internals/Picker/PickerToggle.d.ts +3 -3
  605. package/cjs/internals/Picker/PickerToggle.js +10 -5
  606. package/cjs/internals/Picker/PickerToggleTrigger.d.ts +3 -4
  607. package/cjs/internals/Picker/PickerToggleTrigger.js +15 -16
  608. package/cjs/internals/Picker/SelectedElement.js +5 -3
  609. package/cjs/internals/Picker/hooks/useCombobox.d.ts +1 -0
  610. package/cjs/internals/Picker/hooks/useCombobox.js +4 -2
  611. package/cjs/internals/Picker/hooks/usePickerClassName.d.ts +0 -2
  612. package/cjs/internals/Picker/hooks/usePickerClassName.js +3 -7
  613. package/cjs/internals/Picker/hooks/usePickerRef.d.ts +8 -8
  614. package/cjs/internals/Picker/hooks/usePickerRef.js +0 -0
  615. package/cjs/internals/Picker/index.d.ts +1 -1
  616. package/cjs/internals/Plaintext/Plaintext.js +3 -3
  617. package/cjs/internals/Ripple/Ripple.js +3 -3
  618. package/cjs/internals/ScrollView/ScrollView.js +3 -3
  619. package/cjs/internals/ScrollView/hooks/useScrollState.d.ts +2 -2
  620. package/cjs/internals/SearchBox/SearchBox.js +3 -3
  621. package/cjs/internals/StyledBox/StyledBox.d.ts +13 -0
  622. package/cjs/internals/StyledBox/StyledBox.js +28 -0
  623. package/cjs/internals/StyledBox/index.d.ts +4 -0
  624. package/cjs/internals/StyledBox/index.js +9 -0
  625. package/cjs/internals/Windowing/AutoSizer.js +1 -4
  626. package/cjs/internals/constants/index.d.ts +1 -1
  627. package/cjs/internals/constants/index.js +2 -2
  628. package/cjs/internals/hooks/index.d.ts +1 -1
  629. package/cjs/internals/hooks/index.js +3 -3
  630. package/cjs/internals/hooks/useElementResize.js +1 -1
  631. package/cjs/internals/hooks/useEnsuredRef.d.ts +1 -2
  632. package/cjs/internals/hooks/useEnsuredRef.js +1 -1
  633. package/cjs/internals/hooks/useFocus.d.ts +1 -1
  634. package/cjs/internals/hooks/useFocus.js +0 -0
  635. package/cjs/internals/hooks/useFocusVirtualListItem.d.ts +1 -1
  636. package/cjs/internals/hooks/useInternalId.js +1 -1
  637. package/cjs/internals/hooks/useRootClose.d.ts +1 -1
  638. package/cjs/internals/hooks/useRootClose.js +0 -0
  639. package/{esm/internals/hooks/useClassNames.d.ts → cjs/internals/hooks/useStyles.d.ts} +10 -5
  640. package/cjs/internals/hooks/{useClassNames.js → useStyles.js} +33 -18
  641. package/cjs/internals/hooks/useTimeout.js +1 -1
  642. package/cjs/internals/hooks/useUpdatedRef.d.ts +1 -1
  643. package/cjs/internals/types/colours.d.ts +4 -0
  644. package/cjs/internals/types/colours.js +4 -1
  645. package/cjs/internals/types/form.d.ts +9 -9
  646. package/cjs/internals/types/html.d.ts +19 -0
  647. package/cjs/internals/types/html.js +4 -0
  648. package/cjs/internals/types/index.d.ts +2 -0
  649. package/cjs/internals/types/index.js +12 -0
  650. package/cjs/internals/types/picker.d.ts +59 -19
  651. package/cjs/internals/types/placement.d.ts +1 -2
  652. package/cjs/internals/types/shared.d.ts +1 -4
  653. package/cjs/internals/types/sizes.d.ts +25 -0
  654. package/cjs/internals/types/sizes.js +26 -0
  655. package/cjs/internals/utils/colours.d.ts +10 -0
  656. package/cjs/internals/utils/colours.js +37 -2
  657. package/cjs/internals/utils/createComponent.js +3 -3
  658. package/cjs/internals/utils/getDOMNode.js +3 -8
  659. package/cjs/internals/utils/index.d.ts +5 -4
  660. package/cjs/internals/utils/index.js +25 -19
  661. package/cjs/internals/utils/placement.d.ts +21 -0
  662. package/cjs/internals/utils/{placementPolyfill.js → placement.js} +21 -2
  663. package/cjs/internals/utils/sizes.d.ts +5 -0
  664. package/cjs/internals/utils/sizes.js +21 -0
  665. package/{esm/internals/utils → cjs/internals/utils/style-sheet}/css.d.ts +2 -4
  666. package/cjs/internals/utils/{css.js → style-sheet/css.js} +1 -0
  667. package/cjs/internals/utils/style-sheet/index.d.ts +4 -0
  668. package/cjs/internals/utils/style-sheet/index.js +28 -0
  669. package/cjs/internals/utils/{prefix.js → style-sheet/prefix.js} +0 -0
  670. package/cjs/internals/utils/style-sheet/responsive.d.ts +2 -0
  671. package/cjs/internals/utils/style-sheet/responsive.js +20 -0
  672. package/cjs/internals/utils/style-sheet/styles.d.ts +16 -0
  673. package/cjs/internals/utils/style-sheet/styles.js +44 -0
  674. package/cjs/locales/index.d.ts +1 -0
  675. package/cjs/locales/index.js +4 -2
  676. package/cjs/locales/pl_PL.d.ts +151 -0
  677. package/cjs/locales/pl_PL.js +92 -0
  678. package/cjs/toaster/ToastContainer.d.ts +1 -1
  679. package/cjs/toaster/ToastContainer.js +3 -3
  680. package/cjs/toaster/hooks/useDelayedClosure.d.ts +1 -1
  681. package/cjs/toaster/hooks/useDelayedClosure.js +2 -2
  682. package/cjs/toaster/render.d.ts +2 -2
  683. package/dist/rsuite-no-reset-rtl.css +4242 -4692
  684. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  685. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  686. package/dist/rsuite-no-reset.css +4238 -4694
  687. package/dist/rsuite-no-reset.min.css +1 -1
  688. package/dist/rsuite-no-reset.min.css.map +1 -1
  689. package/dist/rsuite-rtl.css +7751 -8200
  690. package/dist/rsuite-rtl.min.css +1 -1
  691. package/dist/rsuite-rtl.min.css.map +1 -1
  692. package/dist/rsuite.css +7756 -8211
  693. package/dist/rsuite.js +718 -387
  694. package/dist/rsuite.js.map +1 -1
  695. package/dist/rsuite.min.css +1 -1
  696. package/dist/rsuite.min.css.map +1 -1
  697. package/dist/rsuite.min.js +1 -1
  698. package/dist/rsuite.min.js.LICENSE.txt +12 -27
  699. package/dist/rsuite.min.js.map +1 -1
  700. package/esm/Affix/Affix.js +4 -4
  701. package/esm/Animation/Bounce.js +2 -2
  702. package/esm/Animation/Collapse.js +2 -2
  703. package/esm/Animation/Fade.js +2 -2
  704. package/esm/Animation/Slide.js +2 -2
  705. package/esm/AutoComplete/AutoComplete.d.ts +5 -13
  706. package/esm/AutoComplete/AutoComplete.js +16 -21
  707. package/esm/Avatar/Avatar.d.ts +3 -5
  708. package/esm/Avatar/Avatar.js +12 -7
  709. package/esm/AvatarGroup/AvatarGroup.d.ts +2 -4
  710. package/esm/AvatarGroup/AvatarGroup.js +8 -10
  711. package/esm/Badge/Badge.js +9 -4
  712. package/esm/Box/index.d.ts +4 -0
  713. package/esm/Box/index.js +8 -0
  714. package/esm/Breadcrumb/Breadcrumb.d.ts +4 -0
  715. package/esm/Breadcrumb/Breadcrumb.js +12 -6
  716. package/esm/Breadcrumb/BreadcrumbItem.d.ts +4 -0
  717. package/esm/Breadcrumb/BreadcrumbItem.js +6 -5
  718. package/esm/Button/Button.d.ts +3 -3
  719. package/esm/Button/Button.js +7 -8
  720. package/esm/ButtonGroup/ButtonGroup.d.ts +4 -2
  721. package/esm/ButtonGroup/ButtonGroup.js +10 -6
  722. package/esm/ButtonGroup/ButtonGroupContext.d.ts +3 -2
  723. package/esm/ButtonToolbar/ButtonToolbar.d.ts +1 -1
  724. package/esm/ButtonToolbar/ButtonToolbar.js +6 -7
  725. package/esm/Calendar/Calendar.js +4 -4
  726. package/esm/Calendar/CalendarBody.js +4 -4
  727. package/esm/Calendar/CalendarContainer.js +4 -4
  728. package/esm/Calendar/CalendarHeader.js +4 -4
  729. package/esm/Calendar/Grid/Grid.js +4 -4
  730. package/esm/Calendar/Grid/GridCell.js +2 -2
  731. package/esm/Calendar/Grid/GridHeaderRow.js +2 -2
  732. package/esm/Calendar/Grid/GridRow.js +2 -2
  733. package/esm/Calendar/MonthDropdown/MonthDropdown.js +4 -4
  734. package/esm/Calendar/MonthDropdown/MonthDropdownItem.js +4 -4
  735. package/esm/Calendar/TimeDropdown/TimeDropdown.js +2 -2
  736. package/esm/Card/Card.js +7 -9
  737. package/esm/CardGroup/CardGroup.js +7 -10
  738. package/esm/Carousel/Carousel.js +6 -5
  739. package/esm/CascadeTree/CascadeTree.d.ts +2 -2
  740. package/esm/CascadeTree/CascadeTree.js +4 -4
  741. package/esm/CascadeTree/SearchView.d.ts +6 -6
  742. package/esm/CascadeTree/SearchView.js +4 -4
  743. package/esm/CascadeTree/TreeView.d.ts +6 -6
  744. package/esm/CascadeTree/TreeView.js +9 -8
  745. package/esm/CascadeTree/hooks/useSearch.d.ts +5 -5
  746. package/esm/CascadeTree/hooks/useSearch.js +0 -0
  747. package/esm/CascadeTree/hooks/useSelect.d.ts +6 -6
  748. package/esm/CascadeTree/hooks/useSelect.js +0 -0
  749. package/esm/CascadeTree/types.d.ts +10 -10
  750. package/esm/CascadeTree/types.js +0 -0
  751. package/esm/Cascader/Cascader.d.ts +6 -43
  752. package/esm/Cascader/Cascader.js +8 -30
  753. package/esm/Cascader/useActive.d.ts +1 -1
  754. package/esm/Cascader/useActive.js +0 -0
  755. package/esm/Center/Center.d.ts +6 -0
  756. package/esm/Center/Center.js +29 -0
  757. package/esm/Center/index.d.ts +4 -0
  758. package/esm/Center/index.js +8 -0
  759. package/esm/CheckPicker/CheckPicker.d.ts +7 -5
  760. package/esm/CheckPicker/CheckPicker.js +17 -24
  761. package/esm/CheckTree/CheckTreeNode.js +4 -4
  762. package/esm/CheckTree/CheckTreeView.d.ts +1 -1
  763. package/esm/CheckTree/CheckTreeView.js +4 -4
  764. package/esm/CheckTreePicker/CheckTreePicker.d.ts +2 -10
  765. package/esm/CheckTreePicker/CheckTreePicker.js +6 -18
  766. package/esm/CheckTreePicker/hooks/useFocusState.d.ts +1 -1
  767. package/esm/CheckTreePicker/hooks/useFocusState.js +0 -0
  768. package/esm/Checkbox/Checkbox.d.ts +3 -3
  769. package/esm/Checkbox/Checkbox.js +4 -4
  770. package/esm/CheckboxGroup/CheckboxGroup.js +4 -4
  771. package/esm/Col/index.d.ts +2 -2
  772. package/esm/Col/index.js +1 -1
  773. package/esm/Container/Container.js +4 -4
  774. package/esm/CustomProvider/CustomProvider.d.ts +27 -13
  775. package/esm/CustomProvider/CustomProvider.js +1 -1
  776. package/esm/CustomProvider/types.d.ts +2 -0
  777. package/esm/CustomProvider/types.js +0 -0
  778. package/esm/DateInput/DateField.d.ts +2 -122
  779. package/esm/DateInput/DateInput.js +1 -1
  780. package/esm/DateInput/hooks/useDateInputState.d.ts +1 -121
  781. package/esm/DatePicker/DatePicker.js +14 -27
  782. package/esm/DatePicker/PredefinedRanges.d.ts +1 -1
  783. package/esm/DatePicker/PredefinedRanges.js +1 -1
  784. package/esm/DatePicker/Toolbar.js +6 -6
  785. package/esm/DatePicker/hooks/useFocus.d.ts +1 -1
  786. package/esm/DatePicker/utils.d.ts +1 -1
  787. package/esm/DateRangeInput/DateRangeInput.js +5 -5
  788. package/esm/DateRangePicker/DateRangePicker.d.ts +7 -1
  789. package/esm/DateRangePicker/DateRangePicker.js +18 -21
  790. package/esm/DateRangePicker/Header.js +2 -2
  791. package/esm/DateRangePicker/hooks/useDateDisabled.d.ts +0 -1
  792. package/esm/DateRangePicker/hooks/useDateDisabled.js +3 -7
  793. package/esm/DateRangePicker/types.d.ts +1 -1
  794. package/esm/Divider/Divider.d.ts +27 -2
  795. package/esm/Divider/Divider.js +27 -16
  796. package/esm/Drawer/Drawer.js +2 -2
  797. package/esm/Dropdown/Dropdown.d.ts +36 -37
  798. package/esm/Dropdown/Dropdown.js +13 -15
  799. package/esm/Dropdown/DropdownItem.d.ts +9 -19
  800. package/esm/Dropdown/DropdownItem.js +20 -15
  801. package/esm/Dropdown/DropdownMenu.d.ts +10 -11
  802. package/esm/Dropdown/DropdownMenu.js +12 -12
  803. package/esm/Dropdown/DropdownSeparator.js +4 -4
  804. package/esm/Dropdown/DropdownToggle.js +4 -4
  805. package/esm/Dropdown/types.d.ts +32 -0
  806. package/esm/Dropdown/types.js +2 -0
  807. package/esm/FlexboxGrid/FlexboxGrid.d.ts +16 -2
  808. package/esm/FlexboxGrid/FlexboxGrid.js +12 -4
  809. package/esm/FlexboxGrid/FlexboxGridItem.d.ts +9 -2
  810. package/esm/FlexboxGrid/FlexboxGridItem.js +6 -5
  811. package/esm/Form/hooks/useFormClassNames.js +4 -4
  812. package/esm/Form/hooks/useFormRef.d.ts +1 -1
  813. package/esm/Form/hooks/useFormValidate.js +0 -0
  814. package/esm/FormControl/FormControl.js +4 -4
  815. package/esm/FormControl/utils.d.ts +8 -0
  816. package/esm/FormControl/utils.js +44 -1
  817. package/esm/FormControlLabel/FormControlLabel.js +4 -4
  818. package/esm/FormErrorMessage/FormErrorMessage.js +9 -11
  819. package/esm/FormGroup/FormGroup.js +4 -4
  820. package/esm/FormHelpText/FormHelpText.js +4 -4
  821. package/esm/Grid/Col.d.ts +22 -0
  822. package/esm/Grid/Col.js +107 -0
  823. package/esm/Grid/Grid.d.ts +1 -1
  824. package/esm/Grid/Grid.js +5 -7
  825. package/esm/Grid/Row.d.ts +16 -0
  826. package/esm/Grid/Row.js +57 -0
  827. package/esm/Grid/index.d.ts +6 -1
  828. package/esm/Grid/index.js +3 -1
  829. package/esm/Grid/types.d.ts +65 -0
  830. package/esm/Grid/types.js +2 -0
  831. package/esm/Heading/Heading.js +4 -4
  832. package/esm/Highlight/Highlight.js +4 -4
  833. package/esm/IconButton/IconButton.js +4 -4
  834. package/esm/Image/Image.js +4 -4
  835. package/esm/InlineEdit/EditableControls.js +1 -2
  836. package/esm/InlineEdit/InlineEdit.js +5 -5
  837. package/esm/InlineEdit/renderChildren.d.ts +2 -1
  838. package/esm/InlineEdit/renderChildren.js +3 -2
  839. package/esm/InlineEdit/useFocusEvent.d.ts +2 -2
  840. package/esm/Input/Input.d.ts +3 -3
  841. package/esm/Input/Input.js +8 -8
  842. package/esm/InputGroup/InputGroup.d.ts +3 -2
  843. package/esm/InputGroup/InputGroup.js +7 -6
  844. package/esm/InputGroup/InputGroupAddon.js +4 -4
  845. package/esm/InputGroup/InputGroupButton.js +4 -7
  846. package/esm/InputNumber/InputNumber.d.ts +3 -3
  847. package/esm/InputNumber/InputNumber.js +9 -7
  848. package/esm/InputPicker/InputPicker.d.ts +7 -6
  849. package/esm/InputPicker/InputPicker.js +32 -30
  850. package/esm/InputPicker/InputSearch.d.ts +3 -3
  851. package/esm/InputPicker/InputSearch.js +4 -4
  852. package/esm/InputPicker/TagList.js +2 -2
  853. package/esm/InputPicker/TextBox.js +8 -7
  854. package/esm/InputPicker/hooks/useData.d.ts +9 -9
  855. package/esm/InputPicker/hooks/useData.js +0 -0
  856. package/esm/InputPicker/hooks/useInput.d.ts +3 -3
  857. package/esm/InputPicker/hooks/useInput.js +1 -1
  858. package/esm/InputPicker/hooks/useMaxWidth.d.ts +2 -2
  859. package/esm/InputPicker/utils.d.ts +1 -1
  860. package/esm/Kbd/Kbd.d.ts +15 -0
  861. package/esm/Kbd/Kbd.js +35 -0
  862. package/esm/Kbd/index.d.ts +4 -0
  863. package/esm/Kbd/index.js +8 -0
  864. package/esm/List/List.js +4 -4
  865. package/esm/List/ListItem.js +4 -4
  866. package/esm/List/helper/useSortHelper.d.ts +1 -1
  867. package/esm/List/helper/useSortHelper.js +1 -1
  868. package/esm/Loader/Loader.d.ts +2 -2
  869. package/esm/Loader/Loader.js +8 -9
  870. package/esm/MaskedInput/MaskedInput.d.ts +2 -1
  871. package/esm/MaskedInput/TextMask.js +1 -1
  872. package/esm/Menu/Menu.d.ts +18 -0
  873. package/esm/Menu/Menu.js +49 -0
  874. package/esm/Menu/MenuContext.d.ts +7 -0
  875. package/esm/Menu/MenuContext.js +5 -0
  876. package/esm/Menu/MenuItem.d.ts +25 -0
  877. package/esm/Menu/MenuItem.js +77 -0
  878. package/esm/Menu/MenuSeparator.d.ts +12 -0
  879. package/esm/Menu/MenuSeparator.js +28 -0
  880. package/esm/Menu/index.d.ts +8 -0
  881. package/esm/Menu/index.js +10 -0
  882. package/esm/Message/Message.js +10 -10
  883. package/esm/Modal/Modal.d.ts +2 -0
  884. package/esm/Modal/Modal.js +7 -5
  885. package/esm/Modal/ModalBody.js +8 -9
  886. package/esm/Modal/ModalDialog.d.ts +2 -2
  887. package/esm/Modal/ModalDialog.js +7 -10
  888. package/esm/Modal/ModalFooter.js +0 -0
  889. package/esm/Modal/ModalHeader.js +4 -4
  890. package/esm/Modal/ModalTitle.js +4 -4
  891. package/esm/Modal/utils.d.ts +3 -3
  892. package/esm/Modal/utils.js +2 -2
  893. package/esm/MultiCascadeTree/MultiCascadeTree.js +4 -4
  894. package/esm/MultiCascadeTree/SearchView.d.ts +4 -4
  895. package/esm/MultiCascadeTree/SearchView.js +4 -4
  896. package/esm/MultiCascadeTree/TreeView.d.ts +6 -6
  897. package/esm/MultiCascadeTree/TreeView.js +5 -6
  898. package/esm/MultiCascadeTree/hooks/useCascadeValue.js +0 -0
  899. package/esm/MultiCascadeTree/hooks/useSearch.d.ts +3 -3
  900. package/esm/MultiCascadeTree/hooks/useSearch.js +0 -0
  901. package/esm/MultiCascadeTree/hooks/useSelect.d.ts +9 -9
  902. package/esm/MultiCascadeTree/hooks/useSelect.js +1 -1
  903. package/esm/MultiCascadeTree/index.d.ts +1 -1
  904. package/esm/MultiCascadeTree/types.d.ts +2 -2
  905. package/esm/MultiCascadeTree/types.js +0 -0
  906. package/esm/MultiCascadeTree/utils.d.ts +2 -2
  907. package/esm/MultiCascadeTree/utils.js +0 -0
  908. package/esm/MultiCascader/MultiCascader.d.ts +8 -45
  909. package/esm/MultiCascader/MultiCascader.js +8 -30
  910. package/esm/Nav/AdaptiveNavItem.js +8 -8
  911. package/esm/Nav/Nav.d.ts +4 -7
  912. package/esm/Nav/Nav.js +7 -5
  913. package/esm/Nav/NavDropdown.d.ts +3 -3
  914. package/esm/Nav/NavDropdown.js +13 -15
  915. package/esm/Nav/NavDropdownItem.d.ts +3 -17
  916. package/esm/Nav/NavDropdownItem.js +6 -6
  917. package/esm/Nav/NavDropdownMenu.d.ts +17 -10
  918. package/esm/Nav/NavDropdownMenu.js +6 -6
  919. package/esm/Nav/NavDropdownToggle.js +5 -5
  920. package/esm/Nav/NavItem.d.ts +2 -2
  921. package/esm/Nav/NavItem.js +4 -4
  922. package/esm/Nav/NavMegaMenu.d.ts +5 -0
  923. package/esm/Nav/NavMegaMenu.js +17 -0
  924. package/esm/Nav/NavMenu.js +4 -4
  925. package/esm/Nav/index.d.ts +3 -1
  926. package/esm/Nav/index.js +2 -1
  927. package/esm/Navbar/Navbar.d.ts +1 -5
  928. package/esm/Navbar/Navbar.js +4 -4
  929. package/esm/Navbar/NavbarContent.d.ts +3 -6
  930. package/esm/Navbar/NavbarContent.js +2 -1
  931. package/esm/Navbar/NavbarDropdown.d.ts +1 -1
  932. package/esm/Navbar/NavbarDropdown.js +9 -10
  933. package/esm/Navbar/NavbarDropdownItem.d.ts +3 -17
  934. package/esm/Navbar/NavbarDropdownItem.js +6 -6
  935. package/esm/Navbar/NavbarDropdownMenu.d.ts +18 -10
  936. package/esm/Navbar/NavbarDropdownMenu.js +7 -7
  937. package/esm/Navbar/NavbarDropdownToggle.js +4 -4
  938. package/esm/Navbar/NavbarItem.d.ts +2 -2
  939. package/esm/Navbar/NavbarItem.js +4 -4
  940. package/esm/Navbar/NavbarMegaMenu.d.ts +26 -0
  941. package/esm/Navbar/NavbarMegaMenu.js +54 -0
  942. package/esm/Notification/Notification.js +10 -18
  943. package/esm/Pagination/LimitPicker.d.ts +2 -2
  944. package/esm/Pagination/LimitPicker.js +1 -1
  945. package/esm/Pagination/Pagination.d.ts +2 -2
  946. package/esm/Pagination/Pagination.js +20 -19
  947. package/esm/Pagination/PaginationButton.d.ts +10 -6
  948. package/esm/Pagination/PaginationButton.js +30 -18
  949. package/esm/Pagination/PaginationGroup.js +4 -4
  950. package/esm/Panel/AccordionButton.js +4 -5
  951. package/esm/Panel/Panel.js +4 -4
  952. package/esm/Panel/PanelBody.js +4 -4
  953. package/esm/Panel/PanelHeader.js +2 -2
  954. package/esm/PanelGroup/PanelGroup.js +4 -4
  955. package/esm/Placeholder/PlaceholderGraph.js +10 -11
  956. package/esm/Placeholder/PlaceholderGrid.js +14 -13
  957. package/esm/Placeholder/PlaceholderParagraph.js +17 -17
  958. package/esm/Popover/Popover.js +9 -11
  959. package/esm/Progress/ProgressCircle.js +4 -4
  960. package/esm/Progress/ProgressLine.js +4 -4
  961. package/esm/Radio/Radio.d.ts +3 -3
  962. package/esm/Radio/Radio.js +4 -4
  963. package/esm/RadioGroup/RadioGroup.js +4 -4
  964. package/esm/RadioTile/RadioTile.d.ts +3 -3
  965. package/esm/RadioTile/RadioTile.js +4 -5
  966. package/esm/RadioTileGroup/RadioTileGroup.js +4 -5
  967. package/esm/RangeSlider/RangeSlider.js +4 -4
  968. package/esm/Rate/Character.js +4 -4
  969. package/esm/Rate/Rate.d.ts +3 -3
  970. package/esm/Rate/Rate.js +4 -4
  971. package/esm/Row/index.d.ts +2 -2
  972. package/esm/Row/index.js +1 -1
  973. package/esm/SelectPicker/SelectPicker.d.ts +7 -17
  974. package/esm/SelectPicker/SelectPicker.js +17 -24
  975. package/esm/SelectPicker/index.d.ts +1 -1
  976. package/esm/Sidebar/Sidebar.js +8 -9
  977. package/esm/Sidenav/ExpandedSidenavDropdown.js +11 -14
  978. package/esm/Sidenav/ExpandedSidenavDropdownItem.d.ts +2 -2
  979. package/esm/Sidenav/ExpandedSidenavDropdownItem.js +7 -7
  980. package/esm/Sidenav/ExpandedSidenavDropdownMenu.d.ts +2 -2
  981. package/esm/Sidenav/ExpandedSidenavDropdownMenu.js +4 -4
  982. package/esm/Sidenav/Sidenav.d.ts +6 -0
  983. package/esm/Sidenav/Sidenav.js +8 -4
  984. package/esm/Sidenav/SidenavDropdown.d.ts +3 -3
  985. package/esm/Sidenav/SidenavDropdown.js +15 -17
  986. package/esm/Sidenav/SidenavDropdownCollapse.js +4 -4
  987. package/esm/Sidenav/SidenavDropdownItem.d.ts +3 -17
  988. package/esm/Sidenav/SidenavDropdownItem.js +6 -6
  989. package/esm/Sidenav/SidenavDropdownMenu.d.ts +11 -8
  990. package/esm/Sidenav/SidenavDropdownMenu.js +6 -6
  991. package/esm/Sidenav/SidenavDropdownToggle.js +12 -12
  992. package/esm/Sidenav/SidenavFooter.d.ts +11 -0
  993. package/esm/Sidenav/SidenavFooter.js +11 -0
  994. package/esm/Sidenav/SidenavGroupLabel.d.ts +11 -0
  995. package/esm/Sidenav/SidenavGroupLabel.js +11 -0
  996. package/esm/Sidenav/SidenavItem.d.ts +28 -9
  997. package/esm/Sidenav/SidenavItem.js +23 -13
  998. package/esm/Sidenav/SidenavToggle.d.ts +0 -6
  999. package/esm/Sidenav/SidenavToggle.js +13 -19
  1000. package/esm/Sidenav/index.d.ts +3 -1
  1001. package/esm/Sidenav/index.js +3 -1
  1002. package/esm/Slider/Graduated.js +2 -2
  1003. package/esm/Slider/Handle.js +5 -6
  1004. package/esm/Slider/Input.js +2 -4
  1005. package/esm/Slider/Mark.js +4 -4
  1006. package/esm/Slider/ProgressBar.js +7 -8
  1007. package/esm/Slider/Slider.js +4 -4
  1008. package/esm/Slider/useDrag.d.ts +2 -2
  1009. package/esm/Slider/useDrag.js +1 -1
  1010. package/esm/Stack/HStack.d.ts +1 -1
  1011. package/esm/Stack/HStack.js +1 -6
  1012. package/esm/Stack/Stack.d.ts +20 -25
  1013. package/esm/Stack/Stack.js +21 -37
  1014. package/esm/Stack/StackItem.d.ts +2 -5
  1015. package/esm/Stack/StackItem.js +17 -16
  1016. package/esm/Stack/VStack.d.ts +1 -1
  1017. package/esm/Stack/VStack.js +1 -6
  1018. package/esm/Stat/Stat.js +4 -4
  1019. package/esm/Stat/StatLabel.js +4 -4
  1020. package/esm/Stat/StatTrend.js +4 -4
  1021. package/esm/Stat/StatValue.js +4 -4
  1022. package/esm/StatGroup/StatGroup.js +7 -10
  1023. package/esm/Steps/StepItem.js +14 -17
  1024. package/esm/Steps/Steps.js +4 -4
  1025. package/esm/Table/Table.d.ts +2 -2
  1026. package/esm/Tabs/TabPanel.js +4 -4
  1027. package/esm/Tabs/Tabs.js +6 -5
  1028. package/esm/Tag/Tag.js +4 -6
  1029. package/esm/TagPicker/TagPicker.d.ts +10 -5
  1030. package/esm/TagPicker/TagPicker.js +9 -4
  1031. package/esm/Text/Text.d.ts +2 -9
  1032. package/esm/Text/Text.js +18 -17
  1033. package/esm/TimeRangePicker/TimeRangePicker.d.ts +1 -1
  1034. package/esm/Timeline/Timeline.js +4 -4
  1035. package/esm/Timeline/TimelineItem.js +4 -4
  1036. package/esm/Toggle/Toggle.d.ts +4 -4
  1037. package/esm/Toggle/Toggle.js +5 -5
  1038. package/esm/Tooltip/Tooltip.js +9 -10
  1039. package/esm/Tree/IndentLine.js +2 -2
  1040. package/esm/Tree/TreeNode.js +6 -9
  1041. package/esm/Tree/TreeNodeToggle.js +2 -2
  1042. package/esm/Tree/TreeView.d.ts +2 -2
  1043. package/esm/Tree/TreeView.js +4 -4
  1044. package/esm/Tree/hooks/useFocusTree.d.ts +1 -1
  1045. package/esm/TreePicker/TreePicker.d.ts +2 -10
  1046. package/esm/TreePicker/TreePicker.js +6 -18
  1047. package/esm/TreePicker/hooks/useFocusState.d.ts +1 -1
  1048. package/esm/TreePicker/hooks/useFocusState.js +0 -0
  1049. package/esm/Uploader/UploadFileItem.js +4 -4
  1050. package/esm/Uploader/UploadTrigger.d.ts +3 -1
  1051. package/esm/Uploader/UploadTrigger.js +21 -14
  1052. package/esm/Uploader/Uploader.d.ts +1 -1
  1053. package/esm/Uploader/Uploader.js +8 -8
  1054. package/esm/Uploader/utils/ajaxUpload.d.ts +1 -1
  1055. package/esm/Whisper/Whisper.d.ts +2 -1
  1056. package/esm/index.d.ts +5 -3
  1057. package/esm/index.js +5 -3
  1058. package/esm/internals/Box/Box.d.ts +43 -0
  1059. package/esm/internals/Box/Box.js +37 -0
  1060. package/esm/internals/Box/index.d.ts +3 -0
  1061. package/esm/internals/Box/index.js +3 -0
  1062. package/esm/internals/Box/utils.d.ts +18 -0
  1063. package/esm/internals/Box/utils.js +114 -0
  1064. package/esm/internals/CloseButton/CloseButton.js +4 -4
  1065. package/esm/internals/Menu/MenuItem.d.ts +1 -1
  1066. package/esm/internals/Menu/MenuItem.js +1 -1
  1067. package/esm/internals/Menu/Menubar.js +4 -1
  1068. package/esm/internals/Menu/useRenderMenuItem.d.ts +2 -0
  1069. package/esm/{Dropdown/useRenderDropdownItem.js → internals/Menu/useRenderMenuItem.js} +1 -1
  1070. package/esm/internals/Overlay/Modal.js +9 -11
  1071. package/esm/internals/Overlay/Overlay.d.ts +5 -6
  1072. package/esm/internals/Overlay/Overlay.js +27 -22
  1073. package/esm/internals/Overlay/OverlayProvider.d.ts +13 -0
  1074. package/esm/internals/Overlay/OverlayProvider.js +16 -0
  1075. package/esm/internals/Overlay/OverlayTrigger.d.ts +1 -10
  1076. package/esm/internals/Overlay/OverlayTrigger.js +7 -6
  1077. package/esm/internals/Overlay/Position.d.ts +6 -10
  1078. package/esm/internals/Overlay/Position.js +17 -18
  1079. package/esm/internals/Overlay/index.d.ts +2 -0
  1080. package/esm/internals/Overlay/index.js +7 -0
  1081. package/esm/internals/Overlay/positionUtils.d.ts +2 -20
  1082. package/esm/internals/Overlay/positionUtils.js +3 -3
  1083. package/esm/internals/Overlay/types.d.ts +37 -0
  1084. package/esm/internals/Picker/ListCheckItem.d.ts +2 -2
  1085. package/esm/internals/Picker/ListCheckItem.js +4 -4
  1086. package/esm/internals/Picker/ListItem.d.ts +2 -2
  1087. package/esm/internals/Picker/ListItem.js +4 -4
  1088. package/esm/internals/Picker/ListItemGroup.js +4 -4
  1089. package/esm/internals/Picker/Listbox.d.ts +5 -5
  1090. package/esm/internals/Picker/Listbox.js +11 -11
  1091. package/esm/internals/Picker/PickerIndicator.d.ts +3 -1
  1092. package/esm/internals/Picker/PickerIndicator.js +6 -4
  1093. package/esm/internals/Picker/PickerPopup.d.ts +2 -2
  1094. package/esm/internals/Picker/PickerPopup.js +18 -15
  1095. package/esm/internals/Picker/PickerToggle.d.ts +3 -3
  1096. package/esm/internals/Picker/PickerToggle.js +11 -6
  1097. package/esm/internals/Picker/PickerToggleTrigger.d.ts +3 -4
  1098. package/esm/internals/Picker/PickerToggleTrigger.js +12 -15
  1099. package/esm/internals/Picker/SelectedElement.js +5 -3
  1100. package/esm/internals/Picker/hooks/useCombobox.d.ts +1 -0
  1101. package/esm/internals/Picker/hooks/useCombobox.js +5 -3
  1102. package/esm/internals/Picker/hooks/usePickerClassName.d.ts +0 -2
  1103. package/esm/internals/Picker/hooks/usePickerClassName.js +4 -8
  1104. package/esm/internals/Picker/hooks/usePickerRef.d.ts +8 -8
  1105. package/esm/internals/Picker/hooks/usePickerRef.js +0 -0
  1106. package/esm/internals/Picker/index.d.ts +1 -1
  1107. package/esm/internals/Plaintext/Plaintext.js +4 -4
  1108. package/esm/internals/Ripple/Ripple.js +4 -4
  1109. package/esm/internals/ScrollView/ScrollView.js +4 -4
  1110. package/esm/internals/ScrollView/hooks/useScrollState.d.ts +2 -2
  1111. package/esm/internals/SearchBox/SearchBox.js +4 -4
  1112. package/esm/internals/StyledBox/StyledBox.d.ts +13 -0
  1113. package/esm/internals/StyledBox/StyledBox.js +23 -0
  1114. package/esm/internals/StyledBox/index.d.ts +4 -0
  1115. package/esm/internals/StyledBox/index.js +4 -0
  1116. package/esm/internals/Windowing/AutoSizer.js +3 -6
  1117. package/esm/internals/constants/index.d.ts +1 -1
  1118. package/esm/internals/constants/index.js +1 -1
  1119. package/esm/internals/hooks/index.d.ts +1 -1
  1120. package/esm/internals/hooks/index.js +1 -1
  1121. package/esm/internals/hooks/useElementResize.js +1 -1
  1122. package/esm/internals/hooks/useEnsuredRef.d.ts +1 -2
  1123. package/esm/internals/hooks/useEnsuredRef.js +1 -1
  1124. package/esm/internals/hooks/useFocus.d.ts +1 -1
  1125. package/esm/internals/hooks/useFocus.js +0 -0
  1126. package/esm/internals/hooks/useFocusVirtualListItem.d.ts +1 -1
  1127. package/esm/internals/hooks/useInternalId.js +1 -1
  1128. package/esm/internals/hooks/useRootClose.d.ts +1 -1
  1129. package/esm/internals/hooks/useRootClose.js +0 -0
  1130. package/{cjs/internals/hooks/useClassNames.d.ts → esm/internals/hooks/useStyles.d.ts} +10 -5
  1131. package/esm/internals/hooks/{useClassNames.js → useStyles.js} +31 -16
  1132. package/esm/internals/hooks/useTimeout.js +1 -1
  1133. package/esm/internals/hooks/useUpdatedRef.d.ts +1 -1
  1134. package/esm/internals/types/colours.d.ts +4 -0
  1135. package/esm/internals/types/colours.js +9 -1
  1136. package/esm/internals/types/form.d.ts +9 -9
  1137. package/esm/internals/types/html.d.ts +19 -0
  1138. package/esm/internals/types/html.js +2 -0
  1139. package/esm/internals/types/index.d.ts +2 -0
  1140. package/esm/internals/types/index.js +3 -1
  1141. package/esm/internals/types/picker.d.ts +59 -19
  1142. package/esm/internals/types/placement.d.ts +1 -2
  1143. package/esm/internals/types/shared.d.ts +1 -4
  1144. package/esm/internals/types/sizes.d.ts +25 -0
  1145. package/esm/internals/types/sizes.js +22 -0
  1146. package/esm/internals/utils/ReactChildren.js +0 -1
  1147. package/esm/internals/utils/colours.d.ts +10 -0
  1148. package/esm/internals/utils/colours.js +35 -0
  1149. package/esm/internals/utils/createComponent.js +4 -4
  1150. package/esm/internals/utils/getDOMNode.js +3 -6
  1151. package/esm/internals/utils/index.d.ts +5 -4
  1152. package/esm/internals/utils/index.js +5 -4
  1153. package/esm/internals/utils/placement.d.ts +21 -0
  1154. package/esm/internals/utils/{placementPolyfill.js → placement.js} +20 -1
  1155. package/esm/internals/utils/sizes.d.ts +5 -0
  1156. package/esm/internals/utils/sizes.js +16 -0
  1157. package/{cjs/internals/utils → esm/internals/utils/style-sheet}/css.d.ts +2 -4
  1158. package/esm/internals/utils/{css.js → style-sheet/css.js} +1 -0
  1159. package/esm/internals/utils/style-sheet/index.d.ts +4 -0
  1160. package/esm/internals/utils/style-sheet/index.js +5 -0
  1161. package/esm/internals/utils/{prefix.js → style-sheet/prefix.js} +0 -0
  1162. package/esm/internals/utils/style-sheet/responsive.d.ts +2 -0
  1163. package/esm/internals/utils/style-sheet/responsive.js +15 -0
  1164. package/esm/internals/utils/style-sheet/styles.d.ts +16 -0
  1165. package/esm/internals/utils/style-sheet/styles.js +38 -0
  1166. package/esm/locales/index.d.ts +1 -0
  1167. package/esm/locales/index.js +2 -1
  1168. package/esm/locales/pl_PL.d.ts +151 -0
  1169. package/esm/locales/pl_PL.js +87 -0
  1170. package/esm/toaster/ToastContainer.d.ts +1 -1
  1171. package/esm/toaster/ToastContainer.js +4 -4
  1172. package/esm/toaster/hooks/useDelayedClosure.d.ts +1 -1
  1173. package/esm/toaster/hooks/useDelayedClosure.js +2 -2
  1174. package/esm/toaster/render.d.ts +2 -2
  1175. package/internals/Box/styles/index.less +157 -0
  1176. package/internals/Picker/styles/index.less +117 -176
  1177. package/internals/Picker/styles/mixin.less +10 -169
  1178. package/internals/Ripple/styles/index.less +2 -2
  1179. package/internals/ScrollView/styles/index.less +2 -2
  1180. package/locales/pl_PL/package.json +7 -0
  1181. package/package.json +5 -5
  1182. package/styles/color-modes/dark.less +17 -18
  1183. package/styles/color-modes/high-contrast.less +18 -17
  1184. package/styles/color-modes/light.less +16 -31
  1185. package/styles/common.less +3 -5
  1186. package/styles/index.less +4 -2
  1187. package/styles/mixins/combobox.less +3 -7
  1188. package/styles/mixins/listbox.less +2 -1
  1189. package/styles/mixins/utilities.less +3 -6
  1190. package/styles/normalize.less +1 -1
  1191. package/styles/root.less +77 -0
  1192. package/styles/scaffolding.less +5 -3
  1193. package/styles/typography.less +16 -16
  1194. package/styles/variables.less +331 -503
  1195. package/toaster/styles/index.css +8 -14
  1196. package/toaster/styles/index.less +6 -4
  1197. package/useToaster/styles/index.css +8 -14
  1198. package/Avatar/styles/mixin.less +0 -42
  1199. package/FlexboxGrid/stories/styles.less +0 -17
  1200. package/Form/styles/mixin.less +0 -139
  1201. package/Grid/stories/styles.less +0 -29
  1202. package/Message/styles/mixin.less +0 -41
  1203. package/Modal/styles/mixin.less +0 -4
  1204. package/Notification/styles/mixin.less +0 -19
  1205. package/TagPicker/styles/mixin.less +0 -21
  1206. package/Toggle/styles/mixin.less +0 -123
  1207. package/cjs/Col/Col.d.ts +0 -69
  1208. package/cjs/Col/Col.js +0 -62
  1209. package/cjs/Dropdown/useRenderDropdownItem.d.ts +0 -2
  1210. package/cjs/Row/Row.d.ts +0 -10
  1211. package/cjs/Row/Row.js +0 -61
  1212. package/cjs/internals/Overlay/OverlayContext.d.ts +0 -6
  1213. package/cjs/internals/utils/placementPolyfill.d.ts +0 -10
  1214. package/esm/Col/Col.d.ts +0 -69
  1215. package/esm/Col/Col.js +0 -57
  1216. package/esm/Dropdown/useRenderDropdownItem.d.ts +0 -2
  1217. package/esm/Row/Row.d.ts +0 -10
  1218. package/esm/Row/Row.js +0 -56
  1219. package/esm/internals/Overlay/OverlayContext.d.ts +0 -6
  1220. package/esm/internals/Overlay/OverlayContext.js +0 -5
  1221. package/esm/internals/utils/placementPolyfill.d.ts +0 -10
  1222. package/styles/color-modes.less +0 -18
  1223. /package/cjs/internals/utils/{prefix.d.ts → style-sheet/prefix.d.ts} +0 -0
  1224. /package/esm/internals/utils/{prefix.d.ts → style-sheet/prefix.d.ts} +0 -0
@@ -3,6 +3,26 @@
3
3
  * @param {string} @size-name - The size name
4
4
  * @param {string} @suffix - The suffix
5
5
  */
6
+ /* stylelint-disable */
7
+ *[class*='rs-'] {
8
+ box-sizing: border-box;
9
+ }
10
+ *[class*='rs-']::before,
11
+ *[class*='rs-']::after {
12
+ box-sizing: border-box;
13
+ }
14
+ :root {
15
+ --rs-font-size-xs: 0.75rem;
16
+ --rs-font-size-sm: 0.875rem;
17
+ --rs-font-size-md: 1rem;
18
+ --rs-spacing: 0.25rem;
19
+ --rs-radius-none: 0;
20
+ --rs-radius-sm: 0.25rem;
21
+ --rs-radius-md: 0.375rem;
22
+ --rs-radius-full: calc(infinity * 1px);
23
+ --rs-shadow-none: 0 0 #0000;
24
+ --rs-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px 0 rgba(0, 0, 0, 0.1);
25
+ }
6
26
  :root,
7
27
  .rs-theme-light {
8
28
  --rs-gray-0: #fff;
@@ -87,9 +107,9 @@
87
107
  --rs-color-focus-ring: rgb(from var(--rs-primary-500) r g b / 25%);
88
108
  --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-primary-500) r g b / 25%);
89
109
  --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
90
- --rs-shadow-overlay: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
91
110
  --rs-btn-default-bg: var(--rs-gray-50);
92
111
  --rs-btn-default-text: var(--rs-gray-800);
112
+ --rs-btn-default-border-color: var(--rs-gray-200);
93
113
  --rs-btn-default-hover-bg: var(--rs-gray-200);
94
114
  --rs-btn-default-active-bg: var(--rs-gray-300);
95
115
  --rs-btn-default-active-text: var(--rs-gray-900);
@@ -97,6 +117,7 @@
97
117
  --rs-btn-default-disabled-text: var(--rs-gray-600);
98
118
  --rs-btn-primary-bg: var(--rs-primary-500);
99
119
  --rs-btn-primary-text: var(--rs-gray-0);
120
+ --rs-btn-primary-border-color: var(--rs-primary-600);
100
121
  --rs-btn-primary-hover-bg: var(--rs-primary-600);
101
122
  --rs-btn-primary-active-bg: var(--rs-primary-700);
102
123
  --rs-btn-subtle-text: var(--rs-gray-800);
@@ -114,6 +135,7 @@
114
135
  --rs-btn-link-text: var(--rs-primary-700);
115
136
  --rs-btn-link-hover-text: var(--rs-primary-800);
116
137
  --rs-btn-link-active-text: var(--rs-primary-900);
138
+ --rs-divider-border: var(--rs-gray-200);
117
139
  --rs-loader-ring: rgb(from var(--rs-gray-50) r g b / 80%);
118
140
  --rs-loader-rotor: var(--rs-gray-500);
119
141
  --rs-loader-backdrop: rgb(from var(--rs-gray-0) r g b / 90%);
@@ -234,9 +256,9 @@
234
256
  --rs-color-focus-ring: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
235
257
  --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
236
258
  --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
237
- --rs-shadow-overlay: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
238
259
  --rs-btn-default-bg: var(--rs-gray-600);
239
260
  --rs-btn-default-text: var(--rs-gray-50);
261
+ --rs-btn-default-border-color: var(--rs-gray-700);
240
262
  --rs-btn-default-hover-bg: var(--rs-gray-500);
241
263
  --rs-btn-default-active-bg: var(--rs-gray-300);
242
264
  --rs-btn-default-active-text: var(--rs-gray-0);
@@ -244,6 +266,7 @@
244
266
  --rs-btn-default-disabled-text: var(--rs-gray-400);
245
267
  --rs-btn-primary-bg: var(--rs-primary-700);
246
268
  --rs-btn-primary-text: var(--rs-gray-0);
269
+ --rs-btn-primary-border-color: var(--rs-primary-800);
247
270
  --rs-btn-primary-hover-bg: var(--rs-primary-600);
248
271
  --rs-btn-primary-active-bg: var(--rs-primary-400);
249
272
  --rs-btn-subtle-text: var(--rs-gray-200);
@@ -261,6 +284,7 @@
261
284
  --rs-btn-link-text: var(--rs-primary-500);
262
285
  --rs-btn-link-hover-text: var(--rs-primary-400);
263
286
  --rs-btn-link-active-text: var(--rs-primary-200);
287
+ --rs-divider-border: var(--rs-gray-600);
264
288
  --rs-loader-ring: rgb(from var(--rs-gray-50) r g b / 30%);
265
289
  --rs-loader-rotor: var(--rs-gray-0);
266
290
  --rs-loader-backdrop: rgb(from var(--rs-gray-900) r g b / 83%);
@@ -379,10 +403,9 @@
379
403
  --rs-color-focus-ring: var(--rs-gray-0);
380
404
  --rs-state-focus-shadow: 0 0 0 3px var(--rs-gray-900), 0 0 0 5px var(--rs-gray-0);
381
405
  --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
382
- --rs-shadow-overlay: 0 4px 4px rgba(0, 0, 0, 0.12), 0 0 10px rgba(0, 0, 0, 0.06);
383
406
  --rs-btn-default-bg: transparent;
384
407
  --rs-btn-default-text: var(--rs-primary-500);
385
- --rs-btn-default-border: 1px solid var(--rs-primary-500);
408
+ --rs-btn-default-border-color: var(--rs-primary-500);
386
409
  --rs-btn-default-hover-bg: transparent;
387
410
  --rs-btn-default-hover-text: var(--rs-primary-400);
388
411
  --rs-btn-default-active-bg: transparent;
@@ -409,6 +432,7 @@
409
432
  --rs-btn-link-text: var(--rs-primary-500);
410
433
  --rs-btn-link-hover-text: var(--rs-primary-400);
411
434
  --rs-btn-link-active-text: var(--rs-primary-200);
435
+ --rs-divider-border: var(--rs-gray-600);
412
436
  --rs-loader-ring: rgb(from var(--rs-gray-50) r g b / 30%);
413
437
  --rs-loader-rotor: var(--rs-gray-0);
414
438
  --rs-loader-backdrop: rgb(from var(--rs-gray-900) r g b / 83%);
@@ -441,262 +465,24 @@
441
465
  --rs-loader-backdrop-inverse: rgba(255, 255, 255, 0.9);
442
466
  }
443
467
  }
444
- /* stylelint-disable */
445
- *[class*='rs-'] {
446
- box-sizing: border-box;
447
- }
448
- *[class*='rs-']::before,
449
- *[class*='rs-']::after {
450
- box-sizing: border-box;
451
- }
452
- .rs-checkbox {
453
- position: relative;
454
- display: inline-block;
455
- vertical-align: middle;
456
- }
457
- .rs-checkbox-disabled label {
458
- cursor: not-allowed;
459
- }
460
- .rs-checkbox label {
461
- line-height: 1.14285714;
462
- margin-bottom: 0;
463
- font-weight: normal;
464
- cursor: pointer;
465
- }
466
- .rs-checkbox-inner::before {
467
- border-color: var(--rs-checkbox-checked-bg);
468
- }
469
- .rs-checkbox.rs-checkbox-disabled label {
470
- cursor: not-allowed;
471
- }
472
- .rs-checkbox-disabled > .rs-checkbox-checker > label {
473
- color: var(--rs-text-disabled);
474
- }
475
- .rs-checkbox-inline {
476
- position: relative;
477
- display: inline-block;
478
- margin-bottom: 0;
479
- vertical-align: middle;
480
- font-weight: normal;
481
- margin-top: 0;
482
- margin-right: 10px;
483
- }
484
- .rs-plaintext .rs-checkbox-inline:first-child {
485
- margin-left: 0;
486
- }
487
- .rs-checkbox [type='checkbox']:focus-visible ~ .rs-checkbox-inner::before {
488
- box-shadow: var(--rs-state-focus-shadow);
489
- }
490
- .rs-checkbox-checker {
491
- padding-top: 10px;
492
- padding-bottom: 10px;
493
- padding-left: 36px;
494
- min-height: 36px;
495
- line-height: 1;
496
- position: relative;
497
- }
498
- /* rtl:begin:ignore */
499
- .rs-checkbox-control::before,
500
- .rs-checkbox-control .rs-checkbox-inner::before,
501
- .rs-checkbox-control .rs-checkbox-inner::after {
502
- content: '';
503
- position: absolute;
504
- left: 0;
505
- top: 0;
506
- display: block;
507
- }
508
- .rs-checkbox-control .rs-checkbox-inner::after {
509
- opacity: 0;
510
- transform: rotate(45deg) scale(0);
511
- transition: opacity 0.2s ease-in, transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46);
512
- }
513
- .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::after {
514
- transition: none;
515
- }
516
- .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after,
517
- .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
518
- border: solid var(--rs-checkbox-icon);
519
- width: 6px;
520
- height: 9px;
521
- margin-top: 2px;
522
- margin-left: 5px;
523
- opacity: 1;
524
- }
525
- .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after {
526
- border-width: 0 2px 2px 0;
527
- transform: rotate(45deg) scale(1);
528
- }
529
- .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
530
- border-width: 0 0 2px;
531
- transform: rotate(0deg) scale(1);
532
- width: 10px;
533
- margin-top: 0;
534
- margin-left: 3px;
535
- }
536
- /* rtl:end:ignore */
537
- /* stylelint-disable-next-line */
538
- .rs-checkbox-control {
539
- position: absolute;
540
- width: 16px;
541
- height: 16px;
542
- display: inline-block;
543
- left: 10px;
544
- top: 10px;
545
- }
546
- .rs-checkbox-control [type='checkbox'] {
547
- position: absolute;
548
- opacity: 0;
549
- z-index: 1;
550
- top: -10px;
551
- right: -10px;
552
- bottom: -10px;
553
- left: -10px;
554
- min-width: 36px;
555
- min-height: 36px;
556
- }
557
- .rs-checkbox-control::before,
558
- .rs-checkbox-control .rs-checkbox-inner::before,
559
- .rs-checkbox-control .rs-checkbox-inner::after {
560
- width: 16px;
561
- height: 16px;
562
- }
563
- .rs-checkbox-control::before {
564
- border: 1px solid var(--rs-checkbox-checked-bg);
565
- background-color: transparent;
566
- border-radius: 3px;
567
- transform: scale(1);
568
- opacity: 0.7;
569
- visibility: hidden;
570
- transition: transform 0.2s linear, opacity 0.2s linear;
571
- }
572
- .rs-theme-high-contrast .rs-checkbox-control::before {
573
- transition: none;
574
- }
575
- .rs-checkbox-checked .rs-checkbox-control::before {
576
- transform: scale(1.5);
577
- opacity: 0;
578
- visibility: visible;
579
- }
580
- .rs-checkbox-control .rs-checkbox-inner::before {
581
- border: 1px solid var(--rs-checkbox-border);
582
- background-color: transparent;
583
- border-radius: 3px;
584
- transition: background 0.2s linear, border 0.2s linear, box-shadow 0.2s linear;
585
- }
586
- .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::before {
587
- transition: none;
588
- }
589
- label:hover .rs-checkbox-control .rs-checkbox-inner::before {
590
- border-color: var(--rs-checkbox-checked-bg);
591
- }
592
- .rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate) .rs-checkbox-control .rs-checkbox-inner::before {
593
- border-color: var(--rs-checkbox-disabled-bg);
594
- background-color: var(--rs-checkbox-disabled-bg);
595
- }
596
- .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
597
- .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
598
- border-color: var(--rs-checkbox-checked-bg);
599
- background-color: var(--rs-checkbox-checked-bg);
600
- }
601
- .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
602
- .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
603
- opacity: 0.5;
604
- }
605
- .rs-checkbox-red .rs-checkbox-control::before {
606
- border-color: var(--rs-red-500);
607
- }
608
- .rs-checkbox-red label:hover .rs-checkbox-inner::before {
609
- border-color: var(--rs-red-500);
610
- }
611
- .rs-checkbox-red.rs-checkbox-checked .rs-checkbox-inner::before,
612
- .rs-checkbox-red.rs-checkbox-indeterminate .rs-checkbox-inner::before {
613
- border-color: var(--rs-red-500);
614
- background-color: var(--rs-red-500);
615
- }
616
- .rs-checkbox-orange .rs-checkbox-control::before {
617
- border-color: var(--rs-orange-500);
618
- }
619
- .rs-checkbox-orange label:hover .rs-checkbox-inner::before {
620
- border-color: var(--rs-orange-500);
621
- }
622
- .rs-checkbox-orange.rs-checkbox-checked .rs-checkbox-inner::before,
623
- .rs-checkbox-orange.rs-checkbox-indeterminate .rs-checkbox-inner::before {
624
- border-color: var(--rs-orange-500);
625
- background-color: var(--rs-orange-500);
626
- }
627
- .rs-checkbox-yellow .rs-checkbox-control::before {
628
- border-color: var(--rs-yellow-500);
629
- }
630
- .rs-checkbox-yellow label:hover .rs-checkbox-inner::before {
631
- border-color: var(--rs-yellow-500);
632
- }
633
- .rs-checkbox-yellow.rs-checkbox-checked .rs-checkbox-inner::before,
634
- .rs-checkbox-yellow.rs-checkbox-indeterminate .rs-checkbox-inner::before {
635
- border-color: var(--rs-yellow-500);
636
- background-color: var(--rs-yellow-500);
637
- }
638
- .rs-checkbox-green .rs-checkbox-control::before {
639
- border-color: var(--rs-green-500);
640
- }
641
- .rs-checkbox-green label:hover .rs-checkbox-inner::before {
642
- border-color: var(--rs-green-500);
643
- }
644
- .rs-checkbox-green.rs-checkbox-checked .rs-checkbox-inner::before,
645
- .rs-checkbox-green.rs-checkbox-indeterminate .rs-checkbox-inner::before {
646
- border-color: var(--rs-green-500);
647
- background-color: var(--rs-green-500);
648
- }
649
- .rs-checkbox-cyan .rs-checkbox-control::before {
650
- border-color: var(--rs-cyan-500);
651
- }
652
- .rs-checkbox-cyan label:hover .rs-checkbox-inner::before {
653
- border-color: var(--rs-cyan-500);
654
- }
655
- .rs-checkbox-cyan.rs-checkbox-checked .rs-checkbox-inner::before,
656
- .rs-checkbox-cyan.rs-checkbox-indeterminate .rs-checkbox-inner::before {
657
- border-color: var(--rs-cyan-500);
658
- background-color: var(--rs-cyan-500);
659
- }
660
- .rs-checkbox-blue .rs-checkbox-control::before {
661
- border-color: var(--rs-blue-500);
662
- }
663
- .rs-checkbox-blue label:hover .rs-checkbox-inner::before {
664
- border-color: var(--rs-blue-500);
665
- }
666
- .rs-checkbox-blue.rs-checkbox-checked .rs-checkbox-inner::before,
667
- .rs-checkbox-blue.rs-checkbox-indeterminate .rs-checkbox-inner::before {
668
- border-color: var(--rs-blue-500);
669
- background-color: var(--rs-blue-500);
670
- }
671
- .rs-checkbox-violet .rs-checkbox-control::before {
672
- border-color: var(--rs-violet-500);
673
- }
674
- .rs-checkbox-violet label:hover .rs-checkbox-inner::before {
675
- border-color: var(--rs-violet-500);
676
- }
677
- .rs-checkbox-violet.rs-checkbox-checked .rs-checkbox-inner::before,
678
- .rs-checkbox-violet.rs-checkbox-indeterminate .rs-checkbox-inner::before {
679
- border-color: var(--rs-violet-500);
680
- background-color: var(--rs-violet-500);
681
- }
682
- .rs-picker-subtle .picker-subtle-toggle {
683
- position: relative;
684
- z-index: 5;
685
- padding-right: 32px;
686
- display: inline-block;
687
- }
688
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle {
689
- cursor: not-allowed;
690
- }
691
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover,
692
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus,
693
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active {
694
- background: none;
695
- }
696
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover::after,
697
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus::after,
698
- .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active::after {
699
- display: none;
468
+ :root {
469
+ --rs-input-font-size-xs: var(--rs-font-size-xs);
470
+ --rs-input-font-size-sm: var(--rs-font-size-sm);
471
+ --rs-input-font-size-md: var(--rs-font-size-sm);
472
+ --rs-input-font-size-lg: var(--rs-font-size-md);
473
+ --rs-input-line-height-xs: 1.66666667;
474
+ --rs-input-line-height-sm: 1.42857143;
475
+ --rs-input-line-height-md: 1.42857143;
476
+ --rs-input-line-height-lg: 1.375;
477
+ --rs-input-border-radius: var(--rs-radius-md);
478
+ --rs-input-padding-block-xs: calc(2px - 1px);
479
+ --rs-input-padding-block-sm: calc(5px - 1px);
480
+ --rs-input-padding-block-md: calc(8px - 1px);
481
+ --rs-input-padding-block-lg: calc(10px - 1px);
482
+ --rs-input-padding-inline-xs: calc(var(--rs-spacing) - 1px);
483
+ --rs-input-padding-inline-sm: calc(calc(var(--rs-spacing) * 2) - 1px);
484
+ --rs-input-padding-inline-md: calc(calc(var(--rs-spacing) * 2.5) - 1px);
485
+ --rs-input-padding-inline-lg: calc(calc(var(--rs-spacing) * 3) - 1px);
700
486
  }
701
487
  .rs-input {
702
488
  display: block;
@@ -706,15 +492,11 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
706
492
  background-image: none;
707
493
  border: 1px solid var(--rs-border-primary);
708
494
  transition: border-color ease-in-out 0.15s;
709
- border-radius: 6px;
710
- /* stylelint-disable */
711
- padding: 7px 11px;
712
- font-size: 14px;
713
- line-height: 1.42857143;
714
- /* stylelint-enable */
715
- }
716
- textarea.rs-input {
717
- height: auto;
495
+ border-radius: var(--rs-input-border-radius);
496
+ font-size: var(--rs-input-font-size);
497
+ line-height: var(--rs-input-line-height);
498
+ padding-block: var(--rs-input-padding-block);
499
+ padding-inline: var(--rs-input-padding-inline);
718
500
  }
719
501
  .rs-theme-high-contrast .rs-input {
720
502
  transition: none;
@@ -740,38 +522,35 @@ textarea.rs-input {
740
522
  color: var(--rs-text-disabled);
741
523
  }
742
524
  textarea.rs-input {
743
- overflow: auto;
744
- resize: vertical;
745
- }
746
- .rs-input-xs {
747
- /* stylelint-disable */
748
- padding: 1px 11px;
749
- font-size: 12px;
750
- line-height: 1.66666667;
751
- /* stylelint-enable */
752
- }
753
- textarea.rs-input-xs {
754
- height: auto;
755
- }
756
- .rs-input-lg {
757
- /* stylelint-disable */
758
- padding: 9px 11px;
759
- font-size: 16px;
760
- line-height: 1.375;
761
- /* stylelint-enable */
762
- }
763
- textarea.rs-input-lg {
764
525
  height: auto;
765
526
  }
766
- .rs-input-sm {
767
- /* stylelint-disable */
768
- padding: 4px 11px;
769
- font-size: 14px;
770
- line-height: 1.42857143;
771
- /* stylelint-enable */
527
+ .rs-input.rs-input-xs {
528
+ --rs-input-font-size: var(--rs-input-font-size-xs);
529
+ --rs-input-line-height: var(--rs-input-line-height-xs);
530
+ --rs-input-padding-block: var(--rs-input-padding-block-xs);
531
+ --rs-input-padding-inline: var(--rs-input-padding-inline-xs);
532
+ }
533
+ .rs-input.rs-input-sm {
534
+ --rs-input-font-size: var(--rs-input-font-size-sm);
535
+ --rs-input-line-height: var(--rs-input-line-height-sm);
536
+ --rs-input-padding-block: var(--rs-input-padding-block-sm);
537
+ --rs-input-padding-inline: var(--rs-input-padding-inline-sm);
538
+ }
539
+ .rs-input.rs-input-md {
540
+ --rs-input-font-size: var(--rs-input-font-size-md);
541
+ --rs-input-line-height: var(--rs-input-line-height-md);
542
+ --rs-input-padding-block: var(--rs-input-padding-block-md);
543
+ --rs-input-padding-inline: var(--rs-input-padding-inline-md);
544
+ }
545
+ .rs-input.rs-input-lg {
546
+ --rs-input-font-size: var(--rs-input-font-size-lg);
547
+ --rs-input-line-height: var(--rs-input-line-height-lg);
548
+ --rs-input-padding-block: var(--rs-input-padding-block-lg);
549
+ --rs-input-padding-inline: var(--rs-input-padding-inline-lg);
772
550
  }
773
- textarea.rs-input-sm {
774
- height: auto;
551
+ textarea.rs-input {
552
+ overflow: auto;
553
+ resize: vertical;
775
554
  }
776
555
  .rs-picker-select-menu-items {
777
556
  overflow-y: auto;
@@ -783,32 +562,33 @@ textarea.rs-input-sm {
783
562
  }
784
563
  .rs-picker-select-menu-items .rs-picker-menu-group:not(:first-child) {
785
564
  margin-top: 6px;
786
- border-top: 1px solid var(--rs-border-primary);
565
+ border-top: 1px solid var(--rs-divider-border);
787
566
  padding-top: 6px;
788
567
  }
789
568
  .rs-picker-select-menu-items .rs-picker-menu-group-title {
790
569
  padding: 8px 12px;
791
- padding-right: 32px;
570
+ padding-inline-end: 32px;
792
571
  position: relative;
793
572
  cursor: pointer;
794
573
  color: var(--rs-text-heading);
795
574
  }
796
575
  .rs-picker-select-menu-items .rs-picker-menu-group-title .rs-picker-menu-group-caret {
797
576
  display: inline-block;
798
- margin-left: 2px;
577
+ margin-inline-start: 2px;
799
578
  position: absolute;
800
579
  top: 8px;
801
- right: 12px;
580
+ inset-inline-end: 12px;
802
581
  color: var(--rs-text-secondary);
803
582
  }
804
583
  .rs-picker-select-menu-items .rs-picker-menu-group.folded .rs-picker-menu-group-caret {
805
584
  transform: rotate(90deg);
806
585
  }
807
586
  .rs-picker-select-menu-items .rs-picker-menu-group ~ [role='option'] > .rs-picker-select-menu-item {
808
- padding-left: 26px;
587
+ padding-inline-start: 26px;
809
588
  }
810
589
  .rs-picker-select-menu-item {
811
- display: block;
590
+ display: flex;
591
+ justify-content: space-between;
812
592
  padding: 8px 12px;
813
593
  clear: both;
814
594
  font-weight: normal;
@@ -850,7 +630,29 @@ textarea.rs-input-sm {
850
630
  }
851
631
  .grouped .rs-picker-select-menu-item,
852
632
  .rs-picker-select-menu-group-children .rs-picker-select-menu-item {
853
- padding-left: 26px;
633
+ padding-inline-start: 26px;
634
+ }
635
+ :root {
636
+ --rs-btn-size-xs: 1.5rem;
637
+ --rs-btn-size-sm: 1.875rem;
638
+ --rs-btn-size-md: 2.25rem;
639
+ --rs-btn-size-lg: 2.625rem;
640
+ --rs-btn-font-size-xs: var(--rs-font-size-xs);
641
+ --rs-btn-font-size-sm: var(--rs-font-size-sm);
642
+ --rs-btn-font-size-md: var(--rs-font-size-sm);
643
+ --rs-btn-font-size-lg: var(--rs-font-size-md);
644
+ --rs-btn-line-height-xs: 1.25rem;
645
+ --rs-btn-line-height-sm: 1.25rem;
646
+ --rs-btn-line-height-md: 1.25rem;
647
+ --rs-btn-line-height-lg: 1.375rem;
648
+ --rs-btn-padding-inline-xs: calc(var(--rs-spacing) * 2);
649
+ --rs-btn-padding-inline-sm: calc(var(--rs-spacing) * 2.5);
650
+ --rs-btn-padding-inline-md: calc(var(--rs-spacing) * 3);
651
+ --rs-btn-padding-inline-lg: calc(var(--rs-spacing) * 3.5);
652
+ --rs-btn-padding-block-xs: calc(var(--rs-spacing) / 2);
653
+ --rs-btn-padding-block-sm: calc(var(--rs-spacing) * 1.25);
654
+ --rs-btn-padding-block-md: calc(var(--rs-spacing) * 2);
655
+ --rs-btn-padding-block-lg: calc(var(--rs-spacing) * 2.5);
854
656
  }
855
657
  .rs-btn {
856
658
  display: inline-flex;
@@ -858,59 +660,33 @@ textarea.rs-input-sm {
858
660
  justify-content: center;
859
661
  margin-bottom: 0;
860
662
  font-weight: normal;
663
+ font-size: var(--rs-btn-font-size, var(--rs-font-size-sm));
664
+ line-height: var(--rs-btn-line-height, 1.25rem);
665
+ height: var(--rs-btn-size, 2.25rem);
861
666
  text-align: center;
862
667
  vertical-align: middle;
863
668
  cursor: pointer;
864
669
  white-space: nowrap;
865
670
  transition: color 0.15s ease-out, background-color 0.15s ease-out;
866
- border: var(--rs-btn-default-border, none);
671
+ border-width: 0;
672
+ border-style: solid;
673
+ border-color: var(--rs-btn-default-border-color, none);
867
674
  -webkit-user-select: none;
868
675
  -moz-user-select: none;
869
676
  user-select: none;
870
677
  text-decoration: none;
871
678
  color: var(--rs-btn-default-text);
872
679
  background-color: var(--rs-btn-default-bg);
873
- border-radius: 6px;
874
- font-size: 14px;
875
- line-height: 20px;
876
- padding: 8px 12px;
680
+ border-radius: var(--rs-radius-md);
681
+ padding-inline: var(--rs-btn-padding-inline);
682
+ padding-block: var(--rs-btn-padding-block);
877
683
  overflow: hidden;
878
684
  position: relative;
879
685
  }
880
686
  .rs-theme-high-contrast .rs-btn {
881
687
  transition: none;
882
- }
883
- .rs-btn-ghost.rs-btn {
884
- padding: 7px 11px;
885
- }
886
- .rs-btn-icon.rs-btn {
887
- padding: 10px 10px;
888
- line-height: 16px;
889
- }
890
- .rs-btn-icon.rs-btn > .rs-icon {
891
- font-size: 16px;
892
- }
893
- .rs-btn-icon-with-text.rs-btn {
894
- line-height: 20px;
895
- }
896
- .rs-btn-icon-with-text.rs-btn > .rs-icon {
897
- padding: 10px 10px;
898
- width: 36px;
899
- height: 36px;
900
- }
901
- .rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-left {
902
- padding: 8px 12px 8px 48px;
903
- }
904
- .rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-left > .rs-icon {
905
- left: 0;
906
- border-right: var(--rs-btn-default-border, none);
907
- }
908
- .rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-right {
909
- padding: 8px 48px 8px 12px;
910
- }
911
- .rs-btn-icon-with-text.rs-btn.rs-btn-icon-placement-right > .rs-icon {
912
- right: 0;
913
- border-left: var(--rs-btn-default-border, none);
688
+ border-width: 1px;
689
+ border-color: var(--rs-btn-default-border-color);
914
690
  }
915
691
  .rs-btn:focus-visible {
916
692
  outline: 3px solid var(--rs-color-focus-ring);
@@ -945,18 +721,46 @@ textarea.rs-input-sm {
945
721
  /* stylelint-enable */
946
722
  }
947
723
  }
724
+ .rs-btn.rs-btn-lg {
725
+ --rs-btn-size: var(--rs-btn-size-lg);
726
+ --rs-btn-font-size: var(--rs-btn-font-size-lg);
727
+ --rs-btn-line-height: var(--rs-btn-line-height-lg);
728
+ --rs-btn-padding-inline: var(--rs-btn-padding-inline-lg);
729
+ --rs-btn-padding-block: var(--rs-btn-padding-block-lg);
730
+ }
731
+ .rs-btn.rs-btn-md {
732
+ --rs-btn-size: var(--rs-btn-size-md);
733
+ --rs-btn-font-size: var(--rs-btn-font-size-md);
734
+ --rs-btn-line-height: var(--rs-btn-line-height-md);
735
+ --rs-btn-padding-inline: var(--rs-btn-padding-inline-md);
736
+ --rs-btn-padding-block: var(--rs-btn-padding-block-md);
737
+ }
738
+ .rs-btn.rs-btn-sm {
739
+ --rs-btn-size: var(--rs-btn-size-sm);
740
+ --rs-btn-font-size: var(--rs-btn-font-size-sm);
741
+ --rs-btn-line-height: var(--rs-btn-line-height-sm);
742
+ --rs-btn-padding-inline: var(--rs-btn-padding-inline-sm);
743
+ --rs-btn-padding-block: var(--rs-btn-padding-block-sm);
744
+ }
745
+ .rs-btn.rs-btn-xs {
746
+ --rs-btn-size: var(--rs-btn-size-xs);
747
+ --rs-btn-font-size: var(--rs-btn-font-size-xs);
748
+ --rs-btn-line-height: var(--rs-btn-line-height-xs);
749
+ --rs-btn-padding-inline: var(--rs-btn-padding-inline-xs);
750
+ --rs-btn-padding-block: var(--rs-btn-padding-block-xs);
751
+ }
948
752
  .rs-btn-start-icon {
949
753
  line-height: 0;
950
- margin-right: 5px;
754
+ margin-inline-end: 5px;
951
755
  }
952
756
  .rs-btn-end-icon {
953
757
  line-height: 0;
954
- margin-left: 5px;
758
+ margin-inline-start: 5px;
955
759
  }
956
760
  .rs-btn-primary {
957
761
  color: var(--rs-btn-primary-text);
958
762
  background-color: var(--rs-btn-primary-bg);
959
- border: none;
763
+ border-color: var(--rs-btn-primary-border-color);
960
764
  }
961
765
  .rs-btn-primary:hover {
962
766
  color: var(--rs-btn-primary-text);
@@ -980,7 +784,6 @@ textarea.rs-input-sm {
980
784
  .rs-btn-subtle {
981
785
  color: var(--rs-btn-subtle-text);
982
786
  background-color: transparent;
983
- border: none;
984
787
  }
985
788
  .rs-btn-subtle:hover {
986
789
  color: var(--rs-btn-subtle-hover-text);
@@ -1003,7 +806,6 @@ textarea.rs-input-sm {
1003
806
  .rs-btn-link {
1004
807
  color: var(--rs-btn-link-text);
1005
808
  background-color: transparent;
1006
- border: none;
1007
809
  }
1008
810
  .rs-btn-link:hover {
1009
811
  color: var(--rs-btn-link-hover-text);
@@ -1030,6 +832,7 @@ textarea.rs-input-sm {
1030
832
  color: var(--rs-btn-ghost-text);
1031
833
  background-color: transparent;
1032
834
  border: 1px solid var(--rs-btn-ghost-border);
835
+ padding-inline: calc(var(--rs-btn-padding-inline) - 1px);
1033
836
  }
1034
837
  .rs-btn-ghost:hover {
1035
838
  color: var(--rs-btn-ghost-hover-text);
@@ -1049,7 +852,7 @@ textarea.rs-input-sm {
1049
852
  background-color: transparent;
1050
853
  opacity: 0.3;
1051
854
  border-color: var(--rs-btn-ghost-border);
1052
- box-shadow: none;
855
+ box-shadow: var(--rs-shadow-none);
1053
856
  }
1054
857
  .rs-theme-high-contrast .rs-btn-ghost:disabled,
1055
858
  .rs-theme-high-contrast .rs-btn-ghost.rs-btn-disabled {
@@ -1059,6 +862,7 @@ textarea.rs-input-sm {
1059
862
  --rs-btn-primary-bg: var(--rs-red-500);
1060
863
  --rs-btn-primary-hover-bg: var(--rs-red-700);
1061
864
  --rs-btn-primary-active-bg: var(--rs-red-800);
865
+ --rs-btn-primary-border-color: var(--rs-red-700);
1062
866
  --rs-btn-subtle-hover-bg: var(--rs-red-500);
1063
867
  --rs-btn-subtle-hover-text: #e5e5ea;
1064
868
  --rs-btn-subtle-active-bg: var(--rs-red-600);
@@ -1077,6 +881,7 @@ textarea.rs-input-sm {
1077
881
  --rs-btn-primary-bg: var(--rs-red-700);
1078
882
  --rs-btn-primary-hover-bg: var(--rs-red-500);
1079
883
  --rs-btn-primary-active-bg: var(--rs-red-400);
884
+ --rs-btn-primary-border-color: var(--rs-red-800);
1080
885
  --rs-btn-subtle-hover-bg: var(--rs-red-600);
1081
886
  --rs-btn-subtle-hover-text: #fff;
1082
887
  --rs-btn-subtle-active-bg: var(--rs-red-400);
@@ -1113,6 +918,7 @@ textarea.rs-input-sm {
1113
918
  --rs-btn-primary-bg: var(--rs-orange-500);
1114
919
  --rs-btn-primary-hover-bg: var(--rs-orange-700);
1115
920
  --rs-btn-primary-active-bg: var(--rs-orange-800);
921
+ --rs-btn-primary-border-color: var(--rs-orange-700);
1116
922
  --rs-btn-subtle-hover-bg: var(--rs-orange-500);
1117
923
  --rs-btn-subtle-hover-text: #e5e5ea;
1118
924
  --rs-btn-subtle-active-bg: var(--rs-orange-600);
@@ -1131,6 +937,7 @@ textarea.rs-input-sm {
1131
937
  --rs-btn-primary-bg: var(--rs-orange-700);
1132
938
  --rs-btn-primary-hover-bg: var(--rs-orange-500);
1133
939
  --rs-btn-primary-active-bg: var(--rs-orange-400);
940
+ --rs-btn-primary-border-color: var(--rs-orange-800);
1134
941
  --rs-btn-subtle-hover-bg: var(--rs-orange-600);
1135
942
  --rs-btn-subtle-hover-text: #fff;
1136
943
  --rs-btn-subtle-active-bg: var(--rs-orange-400);
@@ -1167,6 +974,7 @@ textarea.rs-input-sm {
1167
974
  --rs-btn-primary-bg: var(--rs-yellow-500);
1168
975
  --rs-btn-primary-hover-bg: var(--rs-yellow-700);
1169
976
  --rs-btn-primary-active-bg: var(--rs-yellow-800);
977
+ --rs-btn-primary-border-color: var(--rs-yellow-700);
1170
978
  --rs-btn-subtle-hover-bg: var(--rs-yellow-500);
1171
979
  --rs-btn-subtle-hover-text: #e5e5ea;
1172
980
  --rs-btn-subtle-active-bg: var(--rs-yellow-600);
@@ -1185,6 +993,7 @@ textarea.rs-input-sm {
1185
993
  --rs-btn-primary-bg: var(--rs-yellow-700);
1186
994
  --rs-btn-primary-hover-bg: var(--rs-yellow-500);
1187
995
  --rs-btn-primary-active-bg: var(--rs-yellow-400);
996
+ --rs-btn-primary-border-color: var(--rs-yellow-800);
1188
997
  --rs-btn-subtle-hover-bg: var(--rs-yellow-600);
1189
998
  --rs-btn-subtle-hover-text: #fff;
1190
999
  --rs-btn-subtle-active-bg: var(--rs-yellow-400);
@@ -1221,6 +1030,7 @@ textarea.rs-input-sm {
1221
1030
  --rs-btn-primary-bg: var(--rs-green-500);
1222
1031
  --rs-btn-primary-hover-bg: var(--rs-green-700);
1223
1032
  --rs-btn-primary-active-bg: var(--rs-green-800);
1033
+ --rs-btn-primary-border-color: var(--rs-green-700);
1224
1034
  --rs-btn-subtle-hover-bg: var(--rs-green-500);
1225
1035
  --rs-btn-subtle-hover-text: #e5e5ea;
1226
1036
  --rs-btn-subtle-active-bg: var(--rs-green-600);
@@ -1239,6 +1049,7 @@ textarea.rs-input-sm {
1239
1049
  --rs-btn-primary-bg: var(--rs-green-700);
1240
1050
  --rs-btn-primary-hover-bg: var(--rs-green-500);
1241
1051
  --rs-btn-primary-active-bg: var(--rs-green-400);
1052
+ --rs-btn-primary-border-color: var(--rs-green-800);
1242
1053
  --rs-btn-subtle-hover-bg: var(--rs-green-600);
1243
1054
  --rs-btn-subtle-hover-text: #fff;
1244
1055
  --rs-btn-subtle-active-bg: var(--rs-green-400);
@@ -1275,6 +1086,7 @@ textarea.rs-input-sm {
1275
1086
  --rs-btn-primary-bg: var(--rs-cyan-500);
1276
1087
  --rs-btn-primary-hover-bg: var(--rs-cyan-700);
1277
1088
  --rs-btn-primary-active-bg: var(--rs-cyan-800);
1089
+ --rs-btn-primary-border-color: var(--rs-cyan-700);
1278
1090
  --rs-btn-subtle-hover-bg: var(--rs-cyan-500);
1279
1091
  --rs-btn-subtle-hover-text: #e5e5ea;
1280
1092
  --rs-btn-subtle-active-bg: var(--rs-cyan-600);
@@ -1293,6 +1105,7 @@ textarea.rs-input-sm {
1293
1105
  --rs-btn-primary-bg: var(--rs-cyan-700);
1294
1106
  --rs-btn-primary-hover-bg: var(--rs-cyan-500);
1295
1107
  --rs-btn-primary-active-bg: var(--rs-cyan-400);
1108
+ --rs-btn-primary-border-color: var(--rs-cyan-800);
1296
1109
  --rs-btn-subtle-hover-bg: var(--rs-cyan-600);
1297
1110
  --rs-btn-subtle-hover-text: #fff;
1298
1111
  --rs-btn-subtle-active-bg: var(--rs-cyan-400);
@@ -1329,6 +1142,7 @@ textarea.rs-input-sm {
1329
1142
  --rs-btn-primary-bg: var(--rs-blue-500);
1330
1143
  --rs-btn-primary-hover-bg: var(--rs-blue-700);
1331
1144
  --rs-btn-primary-active-bg: var(--rs-blue-800);
1145
+ --rs-btn-primary-border-color: var(--rs-blue-700);
1332
1146
  --rs-btn-subtle-hover-bg: var(--rs-blue-500);
1333
1147
  --rs-btn-subtle-hover-text: #e5e5ea;
1334
1148
  --rs-btn-subtle-active-bg: var(--rs-blue-600);
@@ -1347,6 +1161,7 @@ textarea.rs-input-sm {
1347
1161
  --rs-btn-primary-bg: var(--rs-blue-700);
1348
1162
  --rs-btn-primary-hover-bg: var(--rs-blue-500);
1349
1163
  --rs-btn-primary-active-bg: var(--rs-blue-400);
1164
+ --rs-btn-primary-border-color: var(--rs-blue-800);
1350
1165
  --rs-btn-subtle-hover-bg: var(--rs-blue-600);
1351
1166
  --rs-btn-subtle-hover-text: #fff;
1352
1167
  --rs-btn-subtle-active-bg: var(--rs-blue-400);
@@ -1383,6 +1198,7 @@ textarea.rs-input-sm {
1383
1198
  --rs-btn-primary-bg: var(--rs-violet-500);
1384
1199
  --rs-btn-primary-hover-bg: var(--rs-violet-700);
1385
1200
  --rs-btn-primary-active-bg: var(--rs-violet-800);
1201
+ --rs-btn-primary-border-color: var(--rs-violet-700);
1386
1202
  --rs-btn-subtle-hover-bg: var(--rs-violet-500);
1387
1203
  --rs-btn-subtle-hover-text: #e5e5ea;
1388
1204
  --rs-btn-subtle-active-bg: var(--rs-violet-600);
@@ -1401,6 +1217,7 @@ textarea.rs-input-sm {
1401
1217
  --rs-btn-primary-bg: var(--rs-violet-700);
1402
1218
  --rs-btn-primary-hover-bg: var(--rs-violet-500);
1403
1219
  --rs-btn-primary-active-bg: var(--rs-violet-400);
1220
+ --rs-btn-primary-border-color: var(--rs-violet-800);
1404
1221
  --rs-btn-subtle-hover-bg: var(--rs-violet-600);
1405
1222
  --rs-btn-subtle-hover-text: #fff;
1406
1223
  --rs-btn-subtle-active-bg: var(--rs-violet-400);
@@ -1433,202 +1250,54 @@ textarea.rs-input-sm {
1433
1250
  --rs-btn-link-hover-text: var(--rs-violet-400);
1434
1251
  --rs-btn-link-active-text: var(--rs-violet-200);
1435
1252
  }
1436
- .rs-btn-lg {
1437
- font-size: 16px;
1438
- line-height: 22px;
1439
- padding: 10px 16px;
1440
- }
1441
- .rs-btn-ghost.rs-btn-lg {
1442
- padding: 9px 15px;
1253
+ .rs-btn-block {
1254
+ width: 100%;
1443
1255
  }
1444
- .rs-btn-icon.rs-btn-lg {
1445
- padding: 11px 11px;
1446
- line-height: 20px;
1256
+ .rs-btn-block + .rs-btn-block {
1257
+ margin-top: 5px;
1447
1258
  }
1448
- .rs-btn-icon.rs-btn-lg > .rs-icon {
1449
- font-size: 20px;
1259
+ .rs-btn-loading {
1260
+ color: transparent !important;
1261
+ position: relative;
1262
+ cursor: default;
1263
+ pointer-events: none;
1450
1264
  }
1451
- .rs-btn-icon-with-text.rs-btn-lg {
1452
- line-height: 22px;
1265
+ .rs-btn-loading > .rs-btn-spin::before,
1266
+ .rs-btn-loading > .rs-btn-spin::after {
1267
+ content: '';
1268
+ position: absolute;
1269
+ width: 18px;
1270
+ height: 18px;
1271
+ margin: auto;
1272
+ top: 0;
1273
+ bottom: 0;
1274
+ inset-inline-end: 0;
1275
+ inset-inline-start: 0;
1276
+ border-radius: var(--rs-radius-full);
1277
+ z-index: 1;
1453
1278
  }
1454
- .rs-btn-icon-with-text.rs-btn-lg > .rs-icon {
1455
- padding: 11px 11px;
1456
- width: 42px;
1457
- height: 42px;
1279
+ .rs-btn-xs.rs-btn-loading > .rs-btn-spin::before,
1280
+ .rs-btn-xs.rs-btn-loading > .rs-btn-spin::after {
1281
+ width: 16px;
1282
+ height: 16px;
1458
1283
  }
1459
- .rs-btn-icon-with-text.rs-btn-lg.rs-btn-icon-placement-left {
1460
- padding: 10px 16px 10px 58px;
1284
+ .rs-btn-loading > .rs-btn-spin::before {
1285
+ border: 3px solid var(--rs-loader-ring);
1461
1286
  }
1462
- .rs-btn-icon-with-text.rs-btn-lg.rs-btn-icon-placement-left > .rs-icon {
1463
- left: 0;
1464
- border-right: var(--rs-btn-default-border, none);
1287
+ .rs-btn-primary.rs-btn-loading > .rs-btn-spin::before {
1288
+ border-color: rgba(248, 247, 250, 0.3);
1465
1289
  }
1466
- .rs-btn-icon-with-text.rs-btn-lg.rs-btn-icon-placement-right {
1467
- padding: 10px 58px 10px 16px;
1290
+ .rs-theme-high-contrast .rs-btn-primary.rs-btn-loading > .rs-btn-spin::before {
1291
+ border-color: var(--rs-loader-ring-inverse);
1468
1292
  }
1469
- .rs-btn-icon-with-text.rs-btn-lg.rs-btn-icon-placement-right > .rs-icon {
1470
- right: 0;
1471
- border-left: var(--rs-btn-default-border, none);
1293
+ .rs-btn-loading > .rs-btn-spin::after {
1294
+ border-width: 3px;
1295
+ border-color: var(--rs-loader-rotor) transparent transparent;
1296
+ border-style: solid;
1297
+ animation: buttonSpin 0.6s infinite linear;
1472
1298
  }
1473
- .rs-btn-md {
1474
- font-size: 14px;
1475
- line-height: 20px;
1476
- padding: 8px 12px;
1477
- }
1478
- .rs-btn-ghost.rs-btn-md {
1479
- padding: 7px 11px;
1480
- }
1481
- .rs-btn-icon.rs-btn-md {
1482
- padding: 10px 10px;
1483
- line-height: 16px;
1484
- }
1485
- .rs-btn-icon.rs-btn-md > .rs-icon {
1486
- font-size: 16px;
1487
- }
1488
- .rs-btn-icon-with-text.rs-btn-md {
1489
- line-height: 20px;
1490
- }
1491
- .rs-btn-icon-with-text.rs-btn-md > .rs-icon {
1492
- padding: 10px 10px;
1493
- width: 36px;
1494
- height: 36px;
1495
- }
1496
- .rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-left {
1497
- padding: 8px 12px 8px 48px;
1498
- }
1499
- .rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-left > .rs-icon {
1500
- left: 0;
1501
- border-right: var(--rs-btn-default-border, none);
1502
- }
1503
- .rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-right {
1504
- padding: 8px 48px 8px 12px;
1505
- }
1506
- .rs-btn-icon-with-text.rs-btn-md.rs-btn-icon-placement-right > .rs-icon {
1507
- right: 0;
1508
- border-left: var(--rs-btn-default-border, none);
1509
- }
1510
- .rs-btn-sm {
1511
- font-size: 14px;
1512
- line-height: 20px;
1513
- padding: 5px 10px;
1514
- }
1515
- .rs-btn-ghost.rs-btn-sm {
1516
- padding: 4px 9px;
1517
- }
1518
- .rs-btn-icon.rs-btn-sm {
1519
- padding: 7px 7px;
1520
- line-height: 16px;
1521
- }
1522
- .rs-btn-icon.rs-btn-sm > .rs-icon {
1523
- font-size: 16px;
1524
- }
1525
- .rs-btn-icon-with-text.rs-btn-sm {
1526
- line-height: 20px;
1527
- }
1528
- .rs-btn-icon-with-text.rs-btn-sm > .rs-icon {
1529
- padding: 7px 7px;
1530
- width: 30px;
1531
- height: 30px;
1532
- }
1533
- .rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-left {
1534
- padding: 5px 10px 5px 40px;
1535
- }
1536
- .rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-left > .rs-icon {
1537
- left: 0;
1538
- border-right: var(--rs-btn-default-border, none);
1539
- }
1540
- .rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-right {
1541
- padding: 5px 40px 5px 10px;
1542
- }
1543
- .rs-btn-icon-with-text.rs-btn-sm.rs-btn-icon-placement-right > .rs-icon {
1544
- right: 0;
1545
- border-left: var(--rs-btn-default-border, none);
1546
- }
1547
- .rs-btn-xs {
1548
- font-size: 12px;
1549
- line-height: 20px;
1550
- padding: 2px 8px;
1551
- }
1552
- .rs-btn-ghost.rs-btn-xs {
1553
- padding: 1px 7px;
1554
- }
1555
- .rs-btn-icon.rs-btn-xs {
1556
- padding: 6px 6px;
1557
- line-height: 12px;
1558
- }
1559
- .rs-btn-icon.rs-btn-xs > .rs-icon {
1560
- font-size: 12px;
1561
- }
1562
- .rs-btn-icon-with-text.rs-btn-xs {
1563
- line-height: 20px;
1564
- }
1565
- .rs-btn-icon-with-text.rs-btn-xs > .rs-icon {
1566
- padding: 6px 6px;
1567
- width: 24px;
1568
- height: 24px;
1569
- }
1570
- .rs-btn-icon-with-text.rs-btn-xs.rs-btn-icon-placement-left {
1571
- padding: 2px 8px 2px 32px;
1572
- }
1573
- .rs-btn-icon-with-text.rs-btn-xs.rs-btn-icon-placement-left > .rs-icon {
1574
- left: 0;
1575
- border-right: var(--rs-btn-default-border, none);
1576
- }
1577
- .rs-btn-icon-with-text.rs-btn-xs.rs-btn-icon-placement-right {
1578
- padding: 2px 32px 2px 8px;
1579
- }
1580
- .rs-btn-icon-with-text.rs-btn-xs.rs-btn-icon-placement-right > .rs-icon {
1581
- right: 0;
1582
- border-left: var(--rs-btn-default-border, none);
1583
- }
1584
- .rs-btn-block {
1585
- width: 100%;
1586
- }
1587
- .rs-btn-block + .rs-btn-block {
1588
- margin-top: 5px;
1589
- }
1590
- .rs-btn-loading {
1591
- color: transparent !important;
1592
- position: relative;
1593
- cursor: default;
1594
- pointer-events: none;
1595
- }
1596
- .rs-btn-loading > .rs-btn-spin::before,
1597
- .rs-btn-loading > .rs-btn-spin::after {
1598
- content: '';
1599
- position: absolute;
1600
- width: 18px;
1601
- height: 18px;
1602
- margin: auto;
1603
- top: 0;
1604
- right: 0;
1605
- bottom: 0;
1606
- left: 0;
1607
- border-radius: 50%;
1608
- z-index: 1;
1609
- }
1610
- .rs-btn-xs.rs-btn-loading > .rs-btn-spin::before,
1611
- .rs-btn-xs.rs-btn-loading > .rs-btn-spin::after {
1612
- width: 16px;
1613
- height: 16px;
1614
- }
1615
- .rs-btn-loading > .rs-btn-spin::before {
1616
- border: 3px solid var(--rs-loader-ring);
1617
- }
1618
- .rs-btn-primary.rs-btn-loading > .rs-btn-spin::before {
1619
- border-color: rgba(248, 247, 250, 0.3);
1620
- }
1621
- .rs-theme-high-contrast .rs-btn-primary.rs-btn-loading > .rs-btn-spin::before {
1622
- border-color: var(--rs-loader-ring-inverse);
1623
- }
1624
- .rs-btn-loading > .rs-btn-spin::after {
1625
- border-width: 3px;
1626
- border-color: var(--rs-loader-rotor) transparent transparent;
1627
- border-style: solid;
1628
- animation: buttonSpin 0.6s infinite linear;
1629
- }
1630
- .rs-btn-primary.rs-btn-loading > .rs-btn-spin::after {
1631
- border-top-color: #fff;
1299
+ .rs-btn-primary.rs-btn-loading > .rs-btn-spin::after {
1300
+ border-top-color: #fff;
1632
1301
  }
1633
1302
  .rs-theme-high-contrast .rs-btn-primary.rs-btn-loading > .rs-btn-spin::after {
1634
1303
  border-top-color: var(--rs-loader-rotor-inverse);
@@ -1642,51 +1311,159 @@ textarea.rs-input-sm {
1642
1311
  }
1643
1312
  }
1644
1313
  .rs-stack {
1314
+ --rs-stack-spacing: calc(var(--rs-spacing) * 1.5);
1315
+ --rs-stack-wrap: nowrap;
1316
+ --rs-stack-direction: row;
1317
+ --rs-stack-align: center;
1318
+ --rs-stack-justify: flex-start;
1645
1319
  display: flex;
1320
+ gap: var(--rs-stack-spacing);
1321
+ flex-wrap: var(--rs-stack-wrap);
1322
+ flex-direction: var(--rs-stack-direction);
1323
+ align-items: var(--rs-stack-align);
1324
+ justify-content: var(--rs-stack-justify);
1646
1325
  }
1647
- .rs-loader {
1648
- display: inline-block;
1326
+ .rs-stack-column {
1327
+ flex-direction: column;
1649
1328
  }
1650
- .rs-loader::before,
1651
- .rs-loader::after {
1652
- content: ' ';
1653
- display: table;
1329
+ .rs-stack-row {
1330
+ flex-direction: row;
1654
1331
  }
1655
- .rs-loader::after {
1656
- clear: both;
1332
+ .rs-stack-column-reverse {
1333
+ flex-direction: column-reverse;
1657
1334
  }
1658
- .rs-loader .rs-loader-spin {
1659
- width: 18px;
1660
- height: 18px;
1335
+ .rs-stack-row-reverse {
1336
+ flex-direction: row-reverse;
1661
1337
  }
1662
- .rs-loader .rs-loader-spin::before,
1663
- .rs-loader .rs-loader-spin::after {
1664
- width: 18px;
1665
- height: 18px;
1338
+ .rs-stack-xs-column {
1339
+ flex-direction: column;
1340
+ }
1341
+ .rs-stack-xs-row {
1342
+ flex-direction: row;
1343
+ }
1344
+ .rs-stack-xs-column-reverse {
1345
+ flex-direction: column-reverse;
1346
+ }
1347
+ .rs-stack-xs-row-reverse {
1348
+ flex-direction: row-reverse;
1349
+ }
1350
+ @media (min-width: 576px) {
1351
+ .rs-stack-sm-column {
1352
+ flex-direction: column;
1353
+ }
1354
+ .rs-stack-sm-row {
1355
+ flex-direction: row;
1356
+ }
1357
+ .rs-stack-sm-column-reverse {
1358
+ flex-direction: column-reverse;
1359
+ }
1360
+ .rs-stack-sm-row-reverse {
1361
+ flex-direction: row-reverse;
1362
+ }
1363
+ }
1364
+ @media (min-width: 768px) {
1365
+ .rs-stack-md-column {
1366
+ flex-direction: column;
1367
+ }
1368
+ .rs-stack-md-row {
1369
+ flex-direction: row;
1370
+ }
1371
+ .rs-stack-md-column-reverse {
1372
+ flex-direction: column-reverse;
1373
+ }
1374
+ .rs-stack-md-row-reverse {
1375
+ flex-direction: row-reverse;
1376
+ }
1377
+ }
1378
+ @media (min-width: 992px) {
1379
+ .rs-stack-lg-column {
1380
+ flex-direction: column;
1381
+ }
1382
+ .rs-stack-lg-row {
1383
+ flex-direction: row;
1384
+ }
1385
+ .rs-stack-lg-column-reverse {
1386
+ flex-direction: column-reverse;
1387
+ }
1388
+ .rs-stack-lg-row-reverse {
1389
+ flex-direction: row-reverse;
1390
+ }
1391
+ }
1392
+ @media (min-width: 1200px) {
1393
+ .rs-stack-xl-column {
1394
+ flex-direction: column;
1395
+ }
1396
+ .rs-stack-xl-row {
1397
+ flex-direction: row;
1398
+ }
1399
+ .rs-stack-xl-column-reverse {
1400
+ flex-direction: column-reverse;
1401
+ }
1402
+ .rs-stack-xl-row-reverse {
1403
+ flex-direction: row-reverse;
1404
+ }
1666
1405
  }
1667
- .rs-loader .rs-loader-content {
1668
- font-size: 12px;
1669
- line-height: 1.5;
1406
+ @media (min-width: 1400px) {
1407
+ .rs-stack-xxl-column {
1408
+ flex-direction: column;
1409
+ }
1410
+ .rs-stack-xxl-row {
1411
+ flex-direction: row;
1412
+ }
1413
+ .rs-stack-xxl-column-reverse {
1414
+ flex-direction: column-reverse;
1415
+ }
1416
+ .rs-stack-xxl-row-reverse {
1417
+ flex-direction: row-reverse;
1418
+ }
1670
1419
  }
1671
- .rs-loader .rs-loader-vertical .rs-loader .rs-loader {
1672
- height: 48px;
1420
+ .rs-stack-item {
1421
+ align-self: var(--rs-stack-item-align-self);
1422
+ order: var(--rs-stack-item-order);
1423
+ flex: var(--rs-stack-item-flex);
1424
+ flex-grow: var(--rs-stack-item-grow);
1425
+ flex-shrink: var(--rs-stack-item-shrink);
1426
+ flex-basis: var(--rs-stack-item-flex-basis);
1427
+ }
1428
+ :root {
1429
+ --rs-loader-duration-fast: 0.4s;
1430
+ --rs-loader-duration-normal: 0.6s;
1431
+ --rs-loader-duration-slow: 0.8s;
1432
+ --rs-loader-duration-paused: paused;
1433
+ --rs-loader-size-xs: 1rem;
1434
+ --rs-loader-size-sm: 1.125rem;
1435
+ --rs-loader-size-md: 2.25rem;
1436
+ --rs-loader-size-lg: 4rem;
1437
+ --rs-loader-font-size-xs: var(--rs-font-size-xs);
1438
+ --rs-loader-font-size-sm: var(--rs-font-size-sm);
1439
+ --rs-loader-font-size-md: var(--rs-font-size-sm);
1440
+ --rs-loader-font-size-lg: var(--rs-font-size-md);
1673
1441
  }
1674
- .rs-loader .rs-loader-vertical .rs-loader .rs-loader-content {
1675
- line-height: 1.66666667;
1442
+ .rs-loader {
1443
+ display: inline-flex;
1444
+ align-items: center;
1445
+ justify-content: center;
1446
+ gap: calc(var(--rs-spacing) * 3);
1676
1447
  }
1677
1448
  .rs-loader-spin {
1678
1449
  position: relative;
1679
1450
  display: inline-block;
1680
- float: left;
1451
+ width: var(--rs-loader-size);
1452
+ height: var(--rs-loader-size);
1453
+ }
1454
+ .rs-loader-spin::before,
1455
+ .rs-loader-spin::after {
1456
+ width: var(--rs-loader-size);
1457
+ height: var(--rs-loader-size);
1681
1458
  }
1682
1459
  .rs-loader-spin::before,
1683
1460
  .rs-loader-spin::after {
1684
1461
  content: '';
1685
1462
  position: absolute;
1686
- left: 0;
1687
- right: 0;
1463
+ inset-inline-start: 0;
1464
+ inset-inline-end: 0;
1688
1465
  display: block;
1689
- border-radius: 50%;
1466
+ border-radius: var(--rs-radius-full);
1690
1467
  }
1691
1468
  .rs-loader-spin::before {
1692
1469
  border: 3px solid var(--rs-loader-ring);
@@ -1698,46 +1475,19 @@ textarea.rs-input-sm {
1698
1475
  animation: loaderSpin 0.6s infinite linear;
1699
1476
  }
1700
1477
  .rs-loader-content {
1701
- float: left;
1702
- display: inline-block;
1703
- }
1704
- .rs-loader-spin + .rs-loader-content {
1705
- margin-left: 12px;
1706
- }
1707
- .rs-loader-xs .rs-loader-spin + .rs-loader-content {
1708
- margin-left: 10px;
1478
+ font-size: var(--rs-loader-font-size);
1709
1479
  }
1710
1480
  .rs-loader-backdrop {
1711
1481
  position: absolute;
1712
1482
  top: 0;
1713
- left: 0;
1483
+ inset-inline-start: 0;
1714
1484
  width: 100%;
1715
1485
  height: 100%;
1716
1486
  background: var(--rs-loader-backdrop);
1717
1487
  }
1718
- .rs-loader-vertical {
1719
- width: auto;
1720
- display: inline-block;
1721
- }
1722
1488
  .rs-loader-vertical .rs-loader {
1723
1489
  flex-direction: column;
1724
1490
  }
1725
- .rs-loader-vertical .rs-loader-spin {
1726
- margin: 0 auto;
1727
- }
1728
- .rs-loader-vertical .rs-loader-content {
1729
- line-height: 1.66666667;
1730
- text-align: center;
1731
- }
1732
- .rs-loader-vertical .rs-loader-spin,
1733
- .rs-loader-vertical .rs-loader-content {
1734
- display: block;
1735
- float: none;
1736
- }
1737
- .rs-loader-vertical .rs-loader-spin + .rs-loader-content {
1738
- margin-left: 0;
1739
- margin-top: 10px;
1740
- }
1741
1491
  .rs-loader-inverse .rs-loader-content {
1742
1492
  color: var(--rs-text-inverse);
1743
1493
  }
@@ -1751,132 +1501,48 @@ textarea.rs-input-sm {
1751
1501
  border-top-color: var(--rs-loader-rotor-inverse);
1752
1502
  }
1753
1503
  .rs-loader-speed-fast .rs-loader-spin::after {
1754
- animation-duration: 0.4s;
1504
+ animation-duration: var(--rs-loader-duration-fast);
1755
1505
  }
1756
1506
  .rs-loader-speed-normal .rs-loader-spin::after {
1757
- animation-duration: 0.6s;
1507
+ animation-duration: var(--rs-loader-duration-normal);
1758
1508
  }
1759
1509
  .rs-loader-speed-slow .rs-loader-spin::after {
1760
- animation-duration: 0.8s;
1510
+ animation-duration: var(--rs-loader-duration-slow);
1761
1511
  }
1762
1512
  .rs-loader-speed-paused .rs-loader-spin::after {
1763
- animation-play-state: paused;
1513
+ animation-play-state: var(--rs-loader-duration-paused);
1764
1514
  }
1765
- .rs-loader-center,
1766
- .rs-loader-backdrop-wrapper {
1515
+ .rs-loader-center {
1767
1516
  position: absolute;
1768
1517
  top: 0;
1769
- left: 0;
1770
- right: 0;
1771
1518
  bottom: 0;
1519
+ inset-inline-start: 0;
1520
+ inset-inline-end: 0;
1772
1521
  margin: auto;
1773
1522
  width: 100%;
1774
1523
  height: 100%;
1775
- }
1776
- .rs-loader-center .rs-loader,
1777
- .rs-loader-backdrop-wrapper .rs-loader {
1778
- display: flex;
1779
- align-items: center;
1780
- justify-content: center;
1781
- width: 100%;
1782
- height: 100%;
1783
- }
1784
- .rs-loader-center:not(.rs-loader-vertical) .rs-loader,
1785
- .rs-loader-backdrop-wrapper:not(.rs-loader-vertical) .rs-loader {
1786
- display: flex;
1787
- }
1788
- .rs-loader-center.rs-loader-vertical .rs-loader,
1789
- .rs-loader-backdrop-wrapper.rs-loader-vertical .rs-loader {
1790
1524
  display: flex;
1791
1525
  align-items: center;
1792
1526
  justify-content: center;
1793
- width: 100%;
1794
- height: 100%;
1795
1527
  }
1796
- .rs-loader-center .rs-loader-content,
1797
- .rs-loader-backdrop-wrapper .rs-loader-content {
1528
+ .rs-loader-center .rs-loader-content {
1798
1529
  z-index: 1;
1799
1530
  }
1800
- .rs-loader-lg .rs-loader-spin {
1801
- width: 64px;
1802
- height: 64px;
1803
- }
1804
- .rs-loader-lg .rs-loader-spin::before,
1805
- .rs-loader-lg .rs-loader-spin::after {
1806
- width: 64px;
1807
- height: 64px;
1808
- }
1809
- .rs-loader-lg .rs-loader-content {
1810
- font-size: 16px;
1811
- line-height: 4;
1812
- }
1813
- .rs-loader-lg .rs-loader-vertical .rs-loader-lg .rs-loader {
1814
- height: 94px;
1815
- }
1816
- .rs-loader-lg .rs-loader-vertical .rs-loader-lg .rs-loader-content {
1817
- line-height: 1.25;
1818
- }
1819
- .rs-loader-md .rs-loader-spin {
1820
- width: 36px;
1821
- height: 36px;
1822
- }
1823
- .rs-loader-md .rs-loader-spin::before,
1824
- .rs-loader-md .rs-loader-spin::after {
1825
- width: 36px;
1826
- height: 36px;
1827
- }
1828
- .rs-loader-md .rs-loader-content {
1829
- font-size: 14px;
1830
- line-height: 2.57142857;
1831
- }
1832
- .rs-loader-md .rs-loader-vertical .rs-loader-md .rs-loader {
1833
- height: 66px;
1834
- }
1835
- .rs-loader-md .rs-loader-vertical .rs-loader-md .rs-loader-content {
1836
- line-height: 1.42857143;
1837
- }
1838
- .rs-loader-sm .rs-loader-spin {
1839
- width: 18px;
1840
- height: 18px;
1841
- }
1842
- .rs-loader-sm .rs-loader-spin::before,
1843
- .rs-loader-sm .rs-loader-spin::after {
1844
- width: 18px;
1845
- height: 18px;
1846
- }
1847
- .rs-loader-sm .rs-loader-content {
1848
- font-size: 14px;
1849
- line-height: 1.28571429;
1850
- }
1851
- .rs-loader-sm .rs-loader-vertical .rs-loader-sm .rs-loader {
1852
- height: 48px;
1531
+ .rs-loader-xs {
1532
+ --rs-loader-size: var(--rs-loader-size-xs);
1533
+ --rs-loader-font-size: var(--rs-loader-font-size-xs);
1853
1534
  }
1854
- .rs-loader-sm .rs-loader-vertical .rs-loader-sm .rs-loader-content {
1855
- line-height: 1.42857143;
1856
- }
1857
- .rs-loader-xs .rs-loader-spin {
1858
- width: 16px;
1859
- height: 16px;
1860
- }
1861
- .rs-loader-xs .rs-loader-spin::before,
1862
- .rs-loader-xs .rs-loader-spin::after {
1863
- width: 16px;
1864
- height: 16px;
1865
- }
1866
- .rs-loader-xs .rs-loader-content {
1867
- font-size: 12px;
1868
- line-height: 1.33333333;
1535
+ .rs-loader-sm {
1536
+ --rs-loader-size: var(--rs-loader-size-sm);
1537
+ --rs-loader-font-size: var(--rs-loader-font-size-sm);
1869
1538
  }
1870
- .rs-loader-xs .rs-loader-vertical .rs-loader-xs .rs-loader {
1871
- height: 46px;
1539
+ .rs-loader-md {
1540
+ --rs-loader-size: var(--rs-loader-size-md);
1541
+ --rs-loader-font-size: var(--rs-loader-font-size-md);
1872
1542
  }
1873
- .rs-loader-xs .rs-loader-vertical .rs-loader-xs .rs-loader-content {
1874
- line-height: 1.66666667;
1875
- }
1876
- .rs-loader-wrapper {
1877
- display: inline-block;
1878
- width: auto;
1879
- line-height: 0;
1543
+ .rs-loader-lg {
1544
+ --rs-loader-size: var(--rs-loader-size-lg);
1545
+ --rs-loader-font-size: var(--rs-loader-font-size-lg);
1880
1546
  }
1881
1547
  @keyframes loaderSpin {
1882
1548
  from {
@@ -1887,14 +1553,56 @@ textarea.rs-input-sm {
1887
1553
  }
1888
1554
  }
1889
1555
  .rs-input-group {
1556
+ --rs-input-group-input-height-xs: calc(24px - 2px);
1557
+ --rs-input-group-input-height-sm: calc(30px - 2px);
1558
+ --rs-input-group-input-height-md: calc(36px - 2px);
1559
+ --rs-input-group-input-height-lg: calc(42px - 2px);
1560
+ --rs-input-group-inside-btn-m-x-xs: calc(2px / 2);
1561
+ --rs-input-group-inside-btn-m-x-sm: calc(5px / 2);
1562
+ --rs-input-group-inside-btn-m-x-md: calc(8px / 2);
1563
+ --rs-input-group-inside-btn-m-x-lg: calc(10px / 2);
1564
+ --rs-input-group-inside-btn-p-x-xs: calc(8px / 2);
1565
+ --rs-input-group-inside-btn-p-x-sm: calc(10px / 2);
1566
+ --rs-input-group-inside-btn-p-x-md: calc(12px / 2);
1567
+ --rs-input-group-inside-btn-p-x-lg: calc(16px / 2);
1568
+ --rs-input-group-border-radius: var(--rs-radius-md);
1569
+ --rs-input-group-font-size-xs: var(--rs-font-size-xs);
1570
+ --rs-input-group-font-size-sm: var(--rs-font-size-sm);
1571
+ --rs-input-group-font-size-md: var(--rs-font-size-sm);
1572
+ --rs-input-group-font-size-lg: var(--rs-font-size-md);
1890
1573
  position: relative;
1891
1574
  display: flex;
1892
- border-radius: 6px;
1575
+ border-radius: var(--rs-input-group-border-radius);
1893
1576
  transition: border-color ease-in-out 0.15s;
1894
1577
  width: 100%;
1895
1578
  cursor: text;
1896
1579
  color: var(--rs-text-primary);
1897
1580
  border: 1px solid var(--rs-border-primary);
1581
+ overflow: hidden;
1582
+ }
1583
+ .rs-input-group.rs-input-group-xs {
1584
+ --rs-input-group-input-height: var(--rs-input-group-input-height-xs);
1585
+ --rs-input-group-inside-btn-spacing: var(--rs-input-group-inside-btn-m-x-xs);
1586
+ --rs-input-group-inside-btn-padding: var(--rs-input-group-inside-btn-p-x-xs);
1587
+ --rs-input-group-font-size: var(--rs-input-group-font-size-xs);
1588
+ }
1589
+ .rs-input-group.rs-input-group-sm {
1590
+ --rs-input-group-input-height: var(--rs-input-group-input-height-sm);
1591
+ --rs-input-group-inside-btn-spacing: var(--rs-input-group-inside-btn-m-x-sm);
1592
+ --rs-input-group-inside-btn-padding: var(--rs-input-group-inside-btn-p-x-sm);
1593
+ --rs-input-group-font-size: var(--rs-input-group-font-size-sm);
1594
+ }
1595
+ .rs-input-group.rs-input-group-md {
1596
+ --rs-input-group-input-height: var(--rs-input-group-input-height-md);
1597
+ --rs-input-group-inside-btn-spacing: var(--rs-input-group-inside-btn-m-x-md);
1598
+ --rs-input-group-inside-btn-padding: var(--rs-input-group-inside-btn-p-x-md);
1599
+ --rs-input-group-font-size: var(--rs-input-group-font-size-md);
1600
+ }
1601
+ .rs-input-group.rs-input-group-lg {
1602
+ --rs-input-group-input-height: var(--rs-input-group-input-height-lg);
1603
+ --rs-input-group-inside-btn-spacing: var(--rs-input-group-inside-btn-m-x-lg);
1604
+ --rs-input-group-inside-btn-padding: var(--rs-input-group-inside-btn-p-x-lg);
1605
+ --rs-input-group-font-size: var(--rs-input-group-font-size-lg);
1898
1606
  }
1899
1607
  .rs-theme-high-contrast .rs-input-group {
1900
1608
  transition: none;
@@ -1916,45 +1624,17 @@ textarea.rs-input-sm {
1916
1624
  outline: none !important;
1917
1625
  border-color: transparent !important;
1918
1626
  }
1627
+ .rs-input-group .rs-input-group-btn {
1628
+ height: var(--rs-input-group-input-height);
1629
+ }
1919
1630
  .rs-input-group .rs-input-number,
1920
1631
  .rs-input-group .rs-input-group-addon,
1921
1632
  .rs-input-group .rs-input-group-btn,
1922
1633
  .rs-input-group .rs-picker-date .rs-picker-toggle {
1923
1634
  border: none;
1924
- border-radius: 0;
1925
- outline: none;
1926
- }
1927
- .rs-input-group:not(.rs-input-group-inside) .rs-input {
1928
- border: none;
1929
- border-radius: 0;
1635
+ border-radius: var(--rs-radius-none);
1930
1636
  outline: none;
1931
1637
  }
1932
- .rs-input-group:not(.rs-input-group-inside) .rs-input-number:not(:last-child) .rs-input-number-btn-group-vertical {
1933
- border-radius: 0;
1934
- }
1935
- .rs-input-group:not(.rs-input-group-inside) .rs-input-number:not(:last-child) .rs-input-number-touchspin-up {
1936
- border-top-right-radius: 0;
1937
- }
1938
- .rs-input-group:not(.rs-input-group-inside) .rs-input-number:not(:last-child) .rs-input-number-touchspin-down {
1939
- border-bottom-right-radius: 0;
1940
- }
1941
- .rs-input-group:not(.rs-input-group-inside) .rs-input-number:not(:first-child) .rs-input {
1942
- border-radius: 0 !important;
1943
- }
1944
- .rs-input-group:not(.rs-input-group-inside) > :first-child,
1945
- .rs-input-group:not(.rs-input-group-inside) .rs-auto-complete:first-child .rs-input,
1946
- .rs-input-group:not(.rs-input-group-inside) .rs-picker-date:first-child .rs-picker-toggle,
1947
- .rs-input-group:not(.rs-input-group-inside) .rs-form-control-wrapper:first-child > .rs-input {
1948
- border-bottom-left-radius: 6px;
1949
- border-top-left-radius: 6px;
1950
- }
1951
- .rs-input-group:not(.rs-input-group-inside) > :last-child,
1952
- .rs-input-group:not(.rs-input-group-inside) .rs-auto-complete:last-child .rs-input,
1953
- .rs-input-group:not(.rs-input-group-inside) .rs-picker-date:last-child .rs-picker-toggle,
1954
- .rs-input-group:not(.rs-input-group-inside) .rs-form-control-wrapper:last-child > .rs-input {
1955
- border-bottom-right-radius: 6px;
1956
- border-top-right-radius: 6px;
1957
- }
1958
1638
  .rs-input-group > .rs-input,
1959
1639
  .rs-input-group > .rs-form-control-wrapper {
1960
1640
  flex: 1 1 auto;
@@ -1964,19 +1644,17 @@ textarea.rs-input-sm {
1964
1644
  }
1965
1645
  .rs-input-group > .rs-input {
1966
1646
  position: relative;
1647
+ height: var(--rs-input-group-input-height);
1648
+ border: none;
1649
+ border-radius: var(--rs-radius-none);
1650
+ outline: none;
1967
1651
  }
1968
- .rs-input-group input.rs-input ~ .rs-input-group-addon,
1969
- .rs-input-group .rs-form-control-wrapper ~ .rs-input-group-addon {
1970
- border-left: none;
1971
- left: auto;
1972
- right: 0;
1973
- }
1974
- .rs-input-group input.rs-input ~ .rs-input-group-addon:not(:last-child),
1975
- .rs-input-group .rs-form-control-wrapper ~ .rs-input-group-addon:not(:last-child) {
1976
- border-right: 0;
1652
+ .rs-input-group > .rs-input-group-addon > .rs-icon {
1653
+ font-size: inherit;
1977
1654
  }
1978
1655
  .rs-input-group.rs-input-group-inside {
1979
1656
  width: 100%;
1657
+ align-items: center;
1980
1658
  background-color: var(--rs-input-bg);
1981
1659
  }
1982
1660
  .rs-input-group.rs-input-group-inside .rs-input {
@@ -1991,13 +1669,13 @@ textarea.rs-input-sm {
1991
1669
  width: auto;
1992
1670
  }
1993
1671
  .rs-input-group.rs-input-group-inside .rs-input-group-btn {
1672
+ border-radius: var(--rs-input-group-border-radius);
1673
+ height: calc(var(--rs-input-group-input-height) - var(--rs-input-group-inside-btn-spacing) * 2);
1674
+ margin-inline: var(--rs-input-group-inside-btn-spacing);
1675
+ padding-inline: var(--rs-input-group-inside-btn-padding);
1994
1676
  color: var(--rs-btn-subtle-text);
1995
1677
  background-color: transparent;
1996
- border: none;
1997
1678
  color: inherit;
1998
- height: 34px;
1999
- padding: 7px 11px;
2000
- border-radius: 0 6px 6px 0;
2001
1679
  }
2002
1680
  .rs-input-group.rs-input-group-inside .rs-input-group-btn:hover {
2003
1681
  color: var(--rs-btn-subtle-hover-text);
@@ -2017,50 +1695,20 @@ textarea.rs-input-sm {
2017
1695
  .rs-theme-high-contrast .rs-input-group.rs-input-group-inside .rs-input-group-btn.rs-btn-disabled {
2018
1696
  border-color: var(--rs-btn-default-disabled-boreder-color);
2019
1697
  }
2020
- .rs-input-group.rs-input-group-inside .rs-input-group-btn > .rs-icon {
2021
- font-size: 14px;
2022
- line-height: 1.42857143;
2023
- }
2024
1698
  .rs-input-group.rs-input-group-inside .rs-input-group-btn:focus {
2025
1699
  outline: none;
2026
1700
  }
2027
- .rs-input-group.rs-input-group-inside .rs-input-group-btn:first-child {
2028
- border-bottom-left-radius: 6px;
2029
- border-top-left-radius: 6px;
2030
- }
2031
- .rs-input-group.rs-input-group-inside .rs-input-group-btn:last-child {
2032
- border-bottom-right-radius: 6px;
2033
- border-top-right-radius: 6px;
2034
- }
2035
1701
  .rs-input-group.rs-input-group-inside .rs-input-group-addon {
2036
- top: 0;
2037
1702
  background: none;
2038
1703
  border: none;
2039
- padding: 10px 12px;
2040
- }
2041
- .rs-input-group.rs-input-group-inside .rs-input-group-addon.rs-input-group-btn {
2042
- padding: 8px 13px;
2043
- }
2044
- .rs-input-group.rs-input-group-inside .rs-input-group-btn ~ input.rs-input,
2045
- .rs-input-group.rs-input-group-inside .rs-input-group-addon ~ input.rs-input,
2046
- .rs-input-group.rs-input-group-inside .rs-input-group-btn ~ .rs-auto-complete > input.rs-input,
2047
- .rs-input-group.rs-input-group-inside .rs-input-group-addon ~ .rs-auto-complete > input.rs-input,
2048
- .rs-input-group.rs-input-group-inside .rs-input-group-addon ~ .rs-form-control-wrapper > input.rs-input,
2049
- .rs-input-group.rs-input-group-inside .rs-input-group-btn ~ .rs-form-control-wrapper > input.rs-input {
2050
- padding-left: 0;
2051
- padding-right: 12px;
2052
- }
2053
- .rs-input-group.rs-input-group-inside input.rs-input ~ .rs-input-group-btn,
2054
- .rs-input-group.rs-input-group-inside .rs-auto-complete ~ .rs-input-group-addon,
2055
- .rs-input-group.rs-input-group-inside .rs-form-control-wrapper ~ .rs-input-group-addon,
2056
- .rs-input-group.rs-input-group-inside .rs-form-control-wrapper ~ .rs-input-group-btn {
2057
- left: inherit;
2058
- right: 0;
2059
- }
2060
- .rs-input-group.rs-input-group-inside .rs-auto-complete ~ .rs-input-group-btn,
2061
- .rs-input-group.rs-input-group-inside .rs-form-control-wrapper ~ .rs-input-group-btn {
2062
- left: inherit;
2063
- right: 1px;
1704
+ }
1705
+ .rs-input-group.rs-input-group-inside .rs-input:not(:first-child),
1706
+ .rs-input-group.rs-input-group-inside .rs-auto-complete:not(:first-child) .rs-input {
1707
+ padding-inline-start: 0;
1708
+ }
1709
+ .rs-input-group.rs-input-group-inside .rs-input:not(:last-child),
1710
+ .rs-input-group.rs-input-group-inside .rs-auto-complete:not(:last-child) .rs-input {
1711
+ padding-inline-end: 0;
2064
1712
  }
2065
1713
  .rs-input-group.rs-input-group-disabled {
2066
1714
  background-color: var(--rs-input-disabled-bg);
@@ -2072,321 +1720,86 @@ textarea.rs-input-sm {
2072
1720
  .rs-input-group.rs-input-group-disabled .rs-input-group-addon {
2073
1721
  color: inherit;
2074
1722
  }
2075
- .rs-input-group-lg > .rs-input {
2076
- /* stylelint-disable */
2077
- padding: 9px 11px;
2078
- font-size: 16px;
2079
- line-height: 1.375;
2080
- /* stylelint-enable */
1723
+ .rs-input-group-addon {
1724
+ flex: 0 0 auto;
1725
+ display: flex;
1726
+ align-items: center;
1727
+ justify-content: center;
1728
+ white-space: nowrap;
1729
+ vertical-align: middle;
1730
+ color: var(--rs-text-primary);
1731
+ font-size: var(--rs-input-group-font-size);
1732
+ font-weight: normal;
1733
+ line-height: 1;
1734
+ text-align: center;
1735
+ background-color: var(--rs-btn-default-bg);
1736
+ padding-inline: var(--rs-spacing);
1737
+ min-width: var(--rs-input-group-input-height);
2081
1738
  }
2082
- textarea.rs-input-group-lg > .rs-input {
2083
- height: auto;
1739
+ .rs-input-group-addon.rs-input-sm {
1740
+ padding: 5px 10px;
1741
+ font-size: var(--rs-font-size-sm);
2084
1742
  }
2085
- .rs-input-group-lg.rs-input-group-inside > .rs-input {
2086
- padding-right: 0;
1743
+ .rs-input-group-addon.rs-input-xs {
1744
+ padding: 8px 8px;
1745
+ font-size: var(--rs-font-size-xs);
2087
1746
  }
2088
- .rs-input-group-lg.rs-input-group > .rs-input {
2089
- height: 40px;
1747
+ .rs-input-group-addon.rs-input-lg {
1748
+ padding: 10px 16px;
1749
+ font-size: var(--rs-font-size-md);
2090
1750
  }
2091
- .rs-input-group-lg.rs-input-group > .rs-input-group-addon {
2092
- height: 40px;
1751
+ .rs-input-group-addon input[type='radio'],
1752
+ .rs-input-group-addon input[type='checkbox'] {
1753
+ margin-top: 0;
2093
1754
  }
2094
- .rs-input-group-lg.rs-input-group > .rs-input-group-addon > .rs-icon {
2095
- font-size: inherit;
1755
+ .rs-input-group-btn {
1756
+ display: flex;
1757
+ align-items: center;
1758
+ position: relative;
1759
+ line-height: 1;
1760
+ white-space: nowrap;
1761
+ border-radius: var(--rs-radius-none);
1762
+ font-size: var(--rs-input-group-font-size);
2096
1763
  }
2097
- .rs-input-group-lg.rs-input-group:not(.rs-input-group-inside) > .rs-input-group-addon {
2098
- padding-top: 8px;
2099
- padding-bottom: 8px;
1764
+ .rs-highlight-mark {
1765
+ background-color: var(--rs-text-highlight-bg);
1766
+ padding: 0 0.2em;
1767
+ font-weight: bolder;
1768
+ border-radius: var(--rs-radius-sm);
2100
1769
  }
2101
- .rs-input-group-md > .rs-input {
2102
- /* stylelint-disable */
2103
- padding: 7px 11px;
2104
- font-size: 14px;
2105
- line-height: 1.42857143;
2106
- /* stylelint-enable */
1770
+ .rs-btn-close {
1771
+ border: none;
1772
+ outline: none !important;
1773
+ background: transparent;
1774
+ line-height: 1;
1775
+ cursor: pointer;
2107
1776
  }
2108
- textarea.rs-input-group-md > .rs-input {
2109
- height: auto;
1777
+ .rs-btn-close .rs-icon {
1778
+ vertical-align: bottom;
2110
1779
  }
2111
- .rs-input-group-md.rs-input-group-inside > .rs-input {
2112
- padding-right: 0;
1780
+ .rs-btn-close:hover,
1781
+ .rs-btn-close:focus {
1782
+ color: var(--rs-close-button-hover-color);
2113
1783
  }
2114
- .rs-input-group-md.rs-input-group > .rs-input {
2115
- height: 34px;
1784
+ .rs-btn-close:hover svg path,
1785
+ .rs-btn-close:focus svg path {
1786
+ stroke: var(--rs-close-button-hover-color);
1787
+ stroke-width: 1;
2116
1788
  }
2117
- .rs-input-group-md.rs-input-group > .rs-input-group-addon {
2118
- height: 34px;
1789
+ .rs-picker {
1790
+ --rs-picker-value-count-margin: var(--rs-spacing);
1791
+ --rs-picker-loader-size: 20px;
1792
+ --rs-picker-toggle-border-width: 1px;
1793
+ --rs-picker-toggle-bg: var(--rs-input-bg);
2119
1794
  }
2120
- .rs-input-group-md.rs-input-group > .rs-input-group-addon > .rs-icon {
2121
- font-size: inherit;
1795
+ .rs-picker-toggle-wrapper {
1796
+ display: inline-block;
1797
+ vertical-align: middle;
1798
+ max-width: 100%;
2122
1799
  }
2123
- .rs-input-group-md.rs-input-group:not(.rs-input-group-inside) > .rs-input-group-addon {
2124
- padding-top: 6px;
2125
- padding-bottom: 6px;
2126
- }
2127
- .rs-input-group-sm > .rs-input {
2128
- /* stylelint-disable */
2129
- padding: 4px 11px;
2130
- font-size: 14px;
2131
- line-height: 1.42857143;
2132
- /* stylelint-enable */
2133
- }
2134
- textarea.rs-input-group-sm > .rs-input {
2135
- height: auto;
2136
- }
2137
- .rs-input-group-sm.rs-input-group-inside > .rs-input {
2138
- padding-right: 0;
2139
- }
2140
- .rs-input-group-sm.rs-input-group > .rs-input {
2141
- height: 28px;
2142
- }
2143
- .rs-input-group-sm.rs-input-group > .rs-input-group-addon {
2144
- height: 28px;
2145
- }
2146
- .rs-input-group-sm.rs-input-group > .rs-input-group-addon > .rs-icon {
2147
- font-size: inherit;
2148
- }
2149
- .rs-input-group-sm.rs-input-group:not(.rs-input-group-inside) > .rs-input-group-addon {
2150
- padding-top: 3px;
2151
- padding-bottom: 3px;
2152
- }
2153
- .rs-input-group-xs > .rs-input {
2154
- /* stylelint-disable */
2155
- padding: 1px 11px;
2156
- font-size: 12px;
2157
- line-height: 1.66666667;
2158
- /* stylelint-enable */
2159
- }
2160
- textarea.rs-input-group-xs > .rs-input {
2161
- height: auto;
2162
- }
2163
- .rs-input-group-xs.rs-input-group-inside > .rs-input {
2164
- padding-right: 0;
2165
- }
2166
- .rs-input-group-xs.rs-input-group > .rs-input {
2167
- height: 22px;
2168
- }
2169
- .rs-input-group-xs.rs-input-group > .rs-input-group-addon {
2170
- height: 22px;
2171
- }
2172
- .rs-input-group-xs.rs-input-group > .rs-input-group-addon > .rs-icon {
2173
- font-size: inherit;
2174
- }
2175
- .rs-input-group.rs-input-group-lg > .rs-input-group-addon {
2176
- /* stylelint-disable */
2177
- padding: 9px 11px;
2178
- font-size: 16px;
2179
- line-height: 1.375;
2180
- /* stylelint-enable */
2181
- min-width: 44px;
2182
- padding-left: 15px;
2183
- padding-right: 15px;
2184
- }
2185
- textarea.rs-input-group.rs-input-group-lg > .rs-input-group-addon {
2186
- height: auto;
2187
- }
2188
- .rs-input-group.rs-input-group-md > .rs-input-group-addon {
2189
- /* stylelint-disable */
2190
- padding: 7px 11px;
2191
- font-size: 14px;
2192
- line-height: 1.42857143;
2193
- /* stylelint-enable */
2194
- min-width: 36px;
2195
- padding-left: 11px;
2196
- padding-right: 11px;
2197
- }
2198
- textarea.rs-input-group.rs-input-group-md > .rs-input-group-addon {
2199
- height: auto;
2200
- }
2201
- .rs-input-group.rs-input-group-sm > .rs-input-group-addon {
2202
- /* stylelint-disable */
2203
- padding: 4px 11px;
2204
- font-size: 14px;
2205
- line-height: 1.42857143;
2206
- /* stylelint-enable */
2207
- min-width: 32px;
2208
- padding-left: 9px;
2209
- padding-right: 9px;
2210
- }
2211
- textarea.rs-input-group.rs-input-group-sm > .rs-input-group-addon {
2212
- height: auto;
2213
- }
2214
- .rs-input-group.rs-input-group-xs > .rs-input-group-addon {
2215
- /* stylelint-disable */
2216
- padding: 1px 11px;
2217
- font-size: 12px;
2218
- line-height: 1.66666667;
2219
- /* stylelint-enable */
2220
- min-width: 28px;
2221
- padding-left: 7px;
2222
- padding-right: 7px;
2223
- }
2224
- textarea.rs-input-group.rs-input-group-xs > .rs-input-group-addon {
2225
- height: auto;
2226
- }
2227
- .rs-input-group-inside.rs-input-group-lg > .rs-input-group-btn {
2228
- /* stylelint-disable */
2229
- padding: 9px 11px;
2230
- font-size: 16px;
2231
- line-height: 1.375;
2232
- /* stylelint-enable */
2233
- height: 40px;
2234
- padding: 9px 15px;
2235
- border-radius: 0 6px 6px 0;
2236
- }
2237
- textarea.rs-input-group-inside.rs-input-group-lg > .rs-input-group-btn {
2238
- height: auto;
2239
- }
2240
- .rs-input-group-inside.rs-input-group-lg > .rs-input-group-btn > .rs-icon {
2241
- font-size: 16px;
2242
- line-height: 1.375;
2243
- }
2244
- .rs-input-group-inside.rs-input-group-md > .rs-input-group-btn {
2245
- /* stylelint-disable */
2246
- font-size: 14px;
2247
- line-height: 1.42857143;
2248
- /* stylelint-enable */
2249
- height: 34px;
2250
- padding: 7px 11px;
2251
- border-radius: 0 6px 6px 0;
2252
- }
2253
- textarea.rs-input-group-inside.rs-input-group-md > .rs-input-group-btn {
2254
- height: auto;
2255
- }
2256
- .rs-input-group-inside.rs-input-group-md > .rs-input-group-btn > .rs-icon {
2257
- font-size: 14px;
2258
- line-height: 1.42857143;
2259
- }
2260
- .rs-input-group-inside.rs-input-group-sm > .rs-input-group-btn {
2261
- /* stylelint-disable */
2262
- padding: 4px 11px;
2263
- font-size: 14px;
2264
- line-height: 1.42857143;
2265
- /* stylelint-enable */
2266
- height: 28px;
2267
- padding: 4px 9px;
2268
- border-radius: 0 6px 6px 0;
2269
- }
2270
- textarea.rs-input-group-inside.rs-input-group-sm > .rs-input-group-btn {
2271
- height: auto;
2272
- }
2273
- .rs-input-group-inside.rs-input-group-sm > .rs-input-group-btn > .rs-icon {
2274
- font-size: 12px;
2275
- line-height: 1.66666667;
2276
- }
2277
- .rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2278
- /* stylelint-disable */
2279
- padding: 1px 11px;
2280
- font-size: 12px;
2281
- line-height: 1.66666667;
2282
- /* stylelint-enable */
2283
- height: 22px;
2284
- padding: 1px 7px;
2285
- border-radius: 0 6px 6px 0;
2286
- }
2287
- textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2288
- height: auto;
2289
- }
2290
- .rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn > .rs-icon {
2291
- font-size: 12px;
2292
- line-height: 1.66666667;
2293
- }
2294
- .rs-input-group-addon:not(:first-child):not(:last-child),
2295
- .rs-input-group-btn:not(:first-child):not(:last-child),
2296
- .rs-input-group:not(.rs-input-group-inside) .rs-input:not(:first-child):not(:last-child) {
2297
- border-radius: 0;
2298
- }
2299
- .rs-input-group-addon {
2300
- flex: 0 0 auto;
2301
- display: flex;
2302
- align-items: center;
2303
- white-space: nowrap;
2304
- vertical-align: middle;
2305
- color: var(--rs-text-primary);
2306
- padding: 8px 12px;
2307
- font-size: 14px;
2308
- font-weight: normal;
2309
- line-height: 1;
2310
- text-align: center;
2311
- background-color: var(--rs-btn-default-bg);
2312
- border: 1px solid var(--rs-border-primary);
2313
- border-radius: 6px;
2314
- }
2315
- .rs-input-group-addon.rs-input-sm {
2316
- padding: 5px 10px;
2317
- font-size: 12px;
2318
- border-radius: 6px;
2319
- }
2320
- .rs-input-group-addon.rs-input-xs {
2321
- padding: 8px 8px;
2322
- font-size: 12px;
2323
- border-radius: 6px;
2324
- }
2325
- .rs-input-group-addon.rs-input-lg {
2326
- padding: 10px 16px;
2327
- font-size: 16px;
2328
- border-radius: 6px;
2329
- }
2330
- .rs-input-group-addon input[type='radio'],
2331
- .rs-input-group-addon input[type='checkbox'] {
2332
- margin-top: 0;
2333
- }
2334
- .rs-input-group-btn {
2335
- position: relative;
2336
- line-height: 1;
2337
- white-space: nowrap;
2338
- border-radius: 0;
2339
- }
2340
- .rs-input-group-btn > .rs-btn {
2341
- position: relative;
2342
- }
2343
- .rs-input-group-btn > .rs-btn + .rs-btn {
2344
- margin-left: -1px;
2345
- }
2346
- .rs-input-group-btn:first-child > .rs-btn,
2347
- .rs-input-group-btn:first-child > .rs-btn-group {
2348
- margin-right: -1px;
2349
- border-right: medium none;
2350
- }
2351
- .rs-input-group-btn:last-child > .rs-btn,
2352
- .rs-input-group-btn:last-child > .rs-btn-group {
2353
- margin-left: -1px;
2354
- }
2355
- .rs-highlight-mark {
2356
- background-color: var(--rs-text-highlight-bg);
2357
- padding: 0 0.2em;
2358
- font-weight: bolder;
2359
- border-radius: 4px;
2360
- }
2361
- .rs-btn-close {
2362
- border: none;
2363
- outline: none !important;
2364
- background: transparent;
2365
- line-height: 1;
2366
- cursor: pointer;
2367
- }
2368
- .rs-btn-close .rs-icon {
2369
- vertical-align: bottom;
2370
- }
2371
- .rs-btn-close:hover,
2372
- .rs-btn-close:focus {
2373
- color: var(--rs-close-button-hover-color);
2374
- }
2375
- .rs-btn-close:hover svg path,
2376
- .rs-btn-close:focus svg path {
2377
- stroke: var(--rs-close-button-hover-color);
2378
- stroke-width: 1;
2379
- }
2380
- .rs-picker-toggle-wrapper {
2381
- display: inline-block;
2382
- vertical-align: middle;
2383
- max-width: 100%;
2384
- }
2385
- .rs-picker-toggle.rs-btn .rs-ripple-pond {
2386
- display: none !important;
2387
- }
2388
- .rs-picker-block {
2389
- display: block;
1800
+ .rs-picker-block {
1801
+ display: block;
1802
+ width: 100%;
2390
1803
  }
2391
1804
  .rs-picker-disabled {
2392
1805
  cursor: not-allowed;
@@ -2406,13 +1819,9 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2406
1819
  .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value {
2407
1820
  color: var(--rs-picker-value);
2408
1821
  }
2409
- .rs-picker-none {
2410
- padding: 6px 12px 12px;
2411
- color: var(--rs-text-secondary);
2412
- cursor: default;
2413
- }
2414
1822
  .rs-picker-countable .rs-picker-toggle-value {
2415
1823
  display: flex;
1824
+ align-items: center;
2416
1825
  }
2417
1826
  .rs-picker-value-list {
2418
1827
  flex: 0 1 auto;
@@ -2421,15 +1830,12 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2421
1830
  white-space: nowrap;
2422
1831
  }
2423
1832
  .rs-picker-value-count {
2424
- margin: 0 4px;
1833
+ margin-inline: var(--rs-picker-value-count-margin);
2425
1834
  background-color: var(--rs-picker-count-bg);
2426
1835
  color: var(--rs-picker-count-text);
2427
- border-radius: 10px;
2428
- padding: 0 8px;
2429
- line-height: 20px;
2430
1836
  }
2431
1837
  .rs-picker-value-separator {
2432
- margin: 0 4px 0 0;
1838
+ margin: 0 var(--rs-spacing) 0 0;
2433
1839
  }
2434
1840
  .rs-picker:not(.rs-picker-disabled):hover,
2435
1841
  .rs-picker.rs-picker-focused {
@@ -2441,11 +1847,11 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2441
1847
  }
2442
1848
  .rs-picker-label.rs-input-group-addon {
2443
1849
  color: var(--rs-text-primary);
2444
- padding-right: 4px !important;
1850
+ padding-inline-end: 4px !important;
2445
1851
  }
2446
1852
  .rs-picker-loader {
2447
- width: 14px;
2448
- height: 14px;
1853
+ width: var(--rs-picker-loader-size);
1854
+ height: var(--rs-picker-loader-size);
2449
1855
  display: flex;
2450
1856
  align-items: center;
2451
1857
  }
@@ -2459,123 +1865,117 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2459
1865
  border-color: var(--rs-picker-state-error);
2460
1866
  outline: var(--rs-picker-state-error-outline);
2461
1867
  }
2462
- .rs-picker-toggle {
2463
- display: inline-flex;
2464
- align-items: center;
2465
- justify-content: center;
2466
- margin-bottom: 0;
2467
- font-weight: normal;
2468
- text-align: center;
2469
- vertical-align: middle;
2470
- cursor: pointer;
2471
- white-space: nowrap;
2472
- transition: color 0.15s ease-out, background-color 0.15s ease-out;
2473
- border: var(--rs-btn-default-border, none);
2474
- -webkit-user-select: none;
2475
- -moz-user-select: none;
2476
- user-select: none;
2477
- text-decoration: none;
2478
- color: var(--rs-btn-default-text);
2479
- background-color: var(--rs-btn-default-bg);
2480
- border-radius: 6px;
2481
- font-size: 14px;
2482
- line-height: 20px;
2483
- padding: 8px 12px;
1868
+ .rs-picker-popup {
1869
+ --rs-picker-popup-none-padding: calc(var(--rs-spacing) * 3);
1870
+ --rs-picker-popup-border-radius: var(--rs-radius-md);
1871
+ --rs-picker-search-box-padding: calc(var(--rs-spacing) * 1.5) calc(var(--rs-spacing) * 3);
1872
+ --rs-picker-popup-z-index: 7;
1873
+ --rs-picker-popup-shadow: var(--rs-shadow-md);
1874
+ --rs-picker-popup-position-x: var(--rs-position-x);
1875
+ --rs-picker-popup-position-y: var(--rs-position-y);
1876
+ position: absolute;
1877
+ top: var(--rs-picker-popup-position-y);
1878
+ left: var(--rs-picker-popup-position-x) /* rtl:ignore */;
1879
+ text-align: start;
2484
1880
  overflow: hidden;
2485
- position: relative;
2486
- }
2487
- .rs-theme-high-contrast .rs-picker-toggle {
2488
1881
  transition: none;
1882
+ display: flex;
1883
+ flex-direction: column;
1884
+ z-index: var(--rs-picker-popup-z-index);
1885
+ border-radius: var(--rs-picker-popup-border-radius);
1886
+ background-color: var(--rs-bg-overlay);
1887
+ box-shadow: var(--rs-picker-popup-shadow);
1888
+ padding-block: var(--rs-picker-popup-border-radius);
2489
1889
  }
2490
- .rs-btn-ghost.rs-picker-toggle {
2491
- padding: 7px 11px;
1890
+ .rs-theme-high-contrast .rs-picker-popup {
1891
+ border: 1px solid var(--rs-border-primary);
2492
1892
  }
2493
- .rs-btn-icon.rs-picker-toggle {
2494
- padding: 10px 10px;
2495
- line-height: 16px;
1893
+ .rs-modal-open .rs-picker-popup {
1894
+ --rs-picker-popup-z-index: calc(1050 + 5);
2496
1895
  }
2497
- .rs-btn-icon.rs-picker-toggle > .rs-icon {
2498
- font-size: 16px;
1896
+ .rs-drawer-open .rs-picker-popup {
1897
+ --rs-picker-popup-z-index: calc(1050 + 5);
2499
1898
  }
2500
- .rs-btn-icon-with-text.rs-picker-toggle {
2501
- line-height: 20px;
1899
+ .rs-picker-popup.rs-picker-inline {
1900
+ position: relative;
1901
+ box-shadow: none;
2502
1902
  }
2503
- .rs-btn-icon-with-text.rs-picker-toggle > .rs-icon {
2504
- padding: 10px 10px;
2505
- width: 36px;
2506
- height: 36px;
1903
+ .rs-picker-popup .rs-search-box {
1904
+ padding: var(--rs-picker-search-box-padding);
2507
1905
  }
2508
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-icon-placement-left {
2509
- padding: 8px 12px 8px 48px;
1906
+ .rs-picker-popup .rs-highlight .rs-highlight-mark {
1907
+ padding: 0;
2510
1908
  }
2511
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-icon-placement-left > .rs-icon {
2512
- left: 0;
2513
- border-right: var(--rs-btn-default-border, none);
1909
+ .rs-picker-popup .rs-picker-none {
1910
+ padding: var(--rs-picker-popup-none-padding);
1911
+ color: var(--rs-text-secondary);
1912
+ cursor: default;
2514
1913
  }
2515
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-icon-placement-right {
2516
- padding: 8px 48px 8px 12px;
1914
+ .rs-picker-default .rs-picker-toggle {
1915
+ color: var(--rs-text-primary);
1916
+ border: var(--rs-picker-toggle-border-width) solid var(--rs-border-primary);
2517
1917
  }
2518
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-icon-placement-right > .rs-icon {
2519
- right: 0;
2520
- border-left: var(--rs-btn-default-border, none);
1918
+ .rs-picker-disabled .rs-picker-toggle {
1919
+ cursor: not-allowed;
2521
1920
  }
2522
- .rs-picker-toggle:focus-visible {
2523
- outline: 3px solid var(--rs-color-focus-ring);
1921
+ .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):hover,
1922
+ .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):focus {
1923
+ border-color: var(--rs-input-focus-border);
2524
1924
  }
2525
- .rs-theme-high-contrast .rs-picker-toggle:focus-visible {
2526
- outline-offset: 2px;
1925
+ .rs-picker-subtle .rs-picker-toggle {
1926
+ --rs-picker-toggle-border-width: 0px;
1927
+ position: relative;
1928
+ z-index: 5;
2527
1929
  }
2528
- .rs-picker-toggle:hover {
2529
- color: var(--rs-btn-default-hover-text);
2530
- background-color: var(--rs-btn-default-hover-bg);
2531
- text-decoration: none;
1930
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle {
1931
+ cursor: not-allowed;
2532
1932
  }
2533
- .rs-picker-toggle:active,
2534
- .rs-picker-toggle.rs-btn-active {
2535
- color: var(--rs-btn-default-active-text);
2536
- background-color: var(--rs-btn-default-active-bg);
1933
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover,
1934
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus,
1935
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active {
1936
+ background: none;
2537
1937
  }
2538
- .rs-picker-toggle:disabled,
2539
- .rs-picker-toggle.rs-btn-disabled {
2540
- cursor: not-allowed;
2541
- color: var(--rs-btn-default-disabled-text);
2542
- background-color: var(--rs-btn-default-disabled-bg);
1938
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover::after,
1939
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus::after,
1940
+ .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active::after {
1941
+ display: none;
2543
1942
  }
2544
- .rs-theme-high-contrast .rs-picker-toggle:disabled,
2545
- .rs-theme-high-contrast .rs-picker-toggle.rs-btn-disabled {
2546
- border-color: var(--rs-btn-default-disabled-boreder-color);
1943
+ .rs-picker-toggle-label {
1944
+ color: var(--rs-text-primary);
2547
1945
  }
2548
- @media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) {
2549
- .rs-picker-toggle {
2550
- /* stylelint-disable */
2551
- -webkit-mask-image: -webkit-radial-gradient(white, black);
2552
- /* stylelint-enable */
2553
- }
1946
+ .rs-picker-toggle .rs-picker-toggle-stack {
1947
+ flex: 1 1 auto;
1948
+ gap: calc(var(--rs-spacing) * 2);
1949
+ overflow: hidden;
2554
1950
  }
2555
- .rs-picker-default .rs-picker-toggle {
2556
- padding: 7px 11px;
1951
+ .rs-picker-toggle-value {
1952
+ display: block;
1953
+ overflow: hidden;
1954
+ text-overflow: ellipsis;
1955
+ white-space: nowrap;
1956
+ width: 100%;
2557
1957
  }
2558
1958
  .rs-picker-toggle-textbox {
2559
1959
  position: absolute;
2560
1960
  width: 100%;
2561
1961
  height: 100%;
2562
- left: 0;
1962
+ inset-inline-start: 0;
2563
1963
  top: 0;
2564
1964
  border: 1px solid #0000;
2565
- padding-left: 10px;
2566
- padding-right: 32px;
1965
+ padding-inline-start: 10px;
1966
+ padding-inline-end: 32px;
2567
1967
  color: var(--rs-text-primary);
2568
1968
  background-color: var(--rs-input-bg);
2569
1969
  outline: none;
2570
1970
  }
2571
1971
  .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-textbox {
2572
- padding-left: 14px;
1972
+ padding-inline-start: 14px;
2573
1973
  }
2574
1974
  .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-textbox {
2575
- padding-left: 8px;
1975
+ padding-inline-start: 8px;
2576
1976
  }
2577
1977
  .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-textbox {
2578
- padding-left: 6px;
1978
+ padding-inline-start: 6px;
2579
1979
  }
2580
1980
  .rs-picker-toggle-read-only {
2581
1981
  opacity: 0;
@@ -2594,7 +1994,6 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2594
1994
  .rs-picker-subtle .rs-picker-toggle {
2595
1995
  color: var(--rs-btn-subtle-text);
2596
1996
  background-color: transparent;
2597
- border: none;
2598
1997
  transition: none;
2599
1998
  }
2600
1999
  .rs-picker-subtle .rs-picker-toggle:hover {
@@ -2619,481 +2018,48 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
2619
2018
  background-color: var(--rs-btn-subtle-hover-bg);
2620
2019
  color: var(--rs-btn-subtle-hover-text);
2621
2020
  }
2622
- /* stylelint-disable-next-line */
2623
- .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn {
2624
- padding-right: 32px;
2625
- }
2626
- .rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn {
2627
- padding-right: 32px;
2628
- }
2629
- .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-caret-icon,
2630
- .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-clean {
2631
- top: 8px;
2632
- right: 12px;
2633
- }
2634
- .rs-picker-default .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-caret-icon,
2635
- .rs-picker-default .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-clean {
2636
- top: 7px;
2637
- }
2638
- .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-loader {
2639
- top: 8px;
2640
- right: 12px;
2641
- }
2642
- .rs-picker-default .rs-picker-toggle.rs-btn {
2643
- padding-top: 7px;
2644
- padding-bottom: 7px;
2645
- }
2646
- .rs-picker-date .rs-picker-toggle.rs-btn,
2647
- .rs-picker-daterange .rs-picker-toggle.rs-btn {
2648
- padding-right: 36px;
2649
- }
2650
- .rs-picker-date .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-clean,
2651
- .rs-picker-daterange .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-clean,
2652
- .rs-picker-date .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-caret-icon,
2653
- .rs-picker-daterange .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-caret-icon {
2654
- top: 8px;
2655
- right: 12px;
2656
- }
2657
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-clean,
2658
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-clean,
2659
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-caret-icon,
2660
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn .rs-picker-toggle-indicator .rs-picker-caret-icon {
2661
- top: 7px;
2662
- }
2663
- .rs-picker-toggle.rs-btn-lg {
2664
- font-size: 16px;
2665
- line-height: 22px;
2666
- padding: 10px 16px;
2667
- }
2668
- .rs-btn-ghost.rs-picker-toggle.rs-btn-lg {
2669
- padding: 9px 15px;
2670
- }
2671
- .rs-btn-icon.rs-picker-toggle.rs-btn-lg {
2672
- padding: 11px 11px;
2673
- line-height: 20px;
2674
- }
2675
- .rs-btn-icon.rs-picker-toggle.rs-btn-lg > .rs-icon {
2676
- font-size: 20px;
2677
- }
2678
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-lg {
2679
- line-height: 22px;
2680
- }
2681
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-lg > .rs-icon {
2682
- padding: 11px 11px;
2683
- width: 42px;
2684
- height: 42px;
2685
- }
2686
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-lg.rs-btn-icon-placement-left {
2687
- padding: 10px 16px 10px 58px;
2688
- }
2689
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-lg.rs-btn-icon-placement-left > .rs-icon {
2690
- left: 0;
2691
- border-right: var(--rs-btn-default-border, none);
2692
- }
2693
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-lg.rs-btn-icon-placement-right {
2694
- padding: 10px 58px 10px 16px;
2695
- }
2696
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-lg.rs-btn-icon-placement-right > .rs-icon {
2697
- right: 0;
2698
- border-left: var(--rs-btn-default-border, none);
2699
- }
2700
- .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-lg {
2701
- padding-right: 36px;
2702
- }
2703
- .rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-lg {
2704
- padding-right: 36px;
2705
- }
2706
- .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-caret-icon,
2707
- .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-clean {
2708
- top: 10px;
2709
- right: 16px;
2710
- }
2711
- .rs-picker-default .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-caret-icon,
2712
- .rs-picker-default .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-clean {
2713
- top: 9px;
2714
- }
2715
- .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-loader {
2716
- top: 10px;
2717
- right: 16px;
2718
- }
2719
- .rs-picker-default .rs-picker-toggle.rs-btn-lg {
2720
- padding-top: 9px;
2721
- padding-bottom: 9px;
2722
- }
2723
- .rs-picker-default .rs-picker-toggle.rs-btn-lg {
2724
- padding-left: 15px;
2725
- }
2726
- .rs-picker-date .rs-picker-toggle.rs-btn-lg,
2727
- .rs-picker-daterange .rs-picker-toggle.rs-btn-lg {
2728
- padding-right: 42px;
2729
- }
2730
- .rs-picker-date .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-clean,
2731
- .rs-picker-daterange .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-clean,
2732
- .rs-picker-date .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-caret-icon,
2733
- .rs-picker-daterange .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-caret-icon {
2734
- top: 10px;
2735
- right: 16px;
2736
- }
2737
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-clean,
2738
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-clean,
2739
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-caret-icon,
2740
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-indicator .rs-picker-caret-icon {
2741
- top: 9px;
2742
- }
2743
- .rs-picker-toggle.rs-btn-lg .rs-picker-value-count {
2744
- line-height: 22px;
2745
- }
2746
- .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-md {
2747
- padding-right: 32px;
2748
- }
2749
- .rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-md {
2750
- padding-right: 32px;
2751
- }
2752
- .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-caret-icon,
2753
- .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-clean {
2754
- top: 8px;
2755
- right: 12px;
2756
- }
2757
- .rs-picker-default .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-caret-icon,
2758
- .rs-picker-default .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-clean {
2759
- top: 7px;
2760
- }
2761
- .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-loader {
2762
- top: 8px;
2763
- right: 12px;
2764
- }
2765
- .rs-picker-default .rs-picker-toggle.rs-btn-md {
2766
- padding-top: 7px;
2767
- padding-bottom: 7px;
2768
- }
2769
- .rs-picker-default .rs-picker-toggle.rs-btn-md {
2770
- padding-left: 11px;
2771
- }
2772
- .rs-picker-date .rs-picker-toggle.rs-btn-md,
2773
- .rs-picker-daterange .rs-picker-toggle.rs-btn-md {
2774
- padding-right: 36px;
2775
- }
2776
- .rs-picker-date .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-clean,
2777
- .rs-picker-daterange .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-clean,
2778
- .rs-picker-date .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-caret-icon,
2779
- .rs-picker-daterange .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-caret-icon {
2780
- top: 8px;
2781
- right: 12px;
2782
- }
2783
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-clean,
2784
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-clean,
2785
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-caret-icon,
2786
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-md .rs-picker-toggle-indicator .rs-picker-caret-icon {
2787
- top: 7px;
2788
- }
2789
- .rs-picker-toggle.rs-btn-sm {
2790
- font-size: 14px;
2791
- line-height: 20px;
2792
- padding: 5px 10px;
2793
- }
2794
- .rs-btn-ghost.rs-picker-toggle.rs-btn-sm {
2795
- padding: 4px 9px;
2796
- }
2797
- .rs-btn-icon.rs-picker-toggle.rs-btn-sm {
2798
- padding: 7px 7px;
2799
- line-height: 16px;
2800
- }
2801
- .rs-btn-icon.rs-picker-toggle.rs-btn-sm > .rs-icon {
2802
- font-size: 16px;
2803
- }
2804
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-sm {
2805
- line-height: 20px;
2806
- }
2807
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-sm > .rs-icon {
2808
- padding: 7px 7px;
2809
- width: 30px;
2810
- height: 30px;
2811
- }
2812
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-sm.rs-btn-icon-placement-left {
2813
- padding: 5px 10px 5px 40px;
2814
- }
2815
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-sm.rs-btn-icon-placement-left > .rs-icon {
2816
- left: 0;
2817
- border-right: var(--rs-btn-default-border, none);
2818
- }
2819
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-sm.rs-btn-icon-placement-right {
2820
- padding: 5px 40px 5px 10px;
2821
- }
2822
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-sm.rs-btn-icon-placement-right > .rs-icon {
2823
- right: 0;
2824
- border-left: var(--rs-btn-default-border, none);
2825
- }
2826
- .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-sm {
2827
- padding-right: 30px;
2828
- }
2829
- .rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-sm {
2830
- padding-right: 30px;
2831
- }
2832
- .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-caret-icon,
2833
- .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-clean {
2834
- top: 5px;
2835
- right: 10px;
2836
- }
2837
- .rs-picker-default .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-caret-icon,
2838
- .rs-picker-default .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-clean {
2839
- top: 4px;
2840
- }
2841
- .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-loader {
2842
- top: 5px;
2843
- right: 10px;
2844
- }
2845
- .rs-picker-default .rs-picker-toggle.rs-btn-sm {
2846
- padding-top: 4px;
2847
- padding-bottom: 4px;
2848
- }
2849
- .rs-picker-default .rs-picker-toggle.rs-btn-sm {
2850
- padding-left: 9px;
2851
- }
2852
- .rs-picker-date .rs-picker-toggle.rs-btn-sm,
2853
- .rs-picker-daterange .rs-picker-toggle.rs-btn-sm {
2854
- padding-right: 34px;
2855
- }
2856
- .rs-picker-date .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-clean,
2857
- .rs-picker-daterange .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-clean,
2858
- .rs-picker-date .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-caret-icon,
2859
- .rs-picker-daterange .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-caret-icon {
2860
- top: 4px;
2861
- right: 10px;
2862
- }
2863
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-clean,
2864
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-clean,
2865
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-caret-icon,
2866
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-indicator .rs-picker-caret-icon {
2867
- top: 3px;
2868
- }
2869
- .rs-picker-toggle.rs-btn-xs {
2870
- font-size: 12px;
2871
- line-height: 20px;
2872
- padding: 2px 8px;
2873
- }
2874
- .rs-btn-ghost.rs-picker-toggle.rs-btn-xs {
2875
- padding: 1px 7px;
2876
- }
2877
- .rs-btn-icon.rs-picker-toggle.rs-btn-xs {
2878
- padding: 6px 6px;
2879
- line-height: 12px;
2880
- }
2881
- .rs-btn-icon.rs-picker-toggle.rs-btn-xs > .rs-icon {
2882
- font-size: 12px;
2883
- }
2884
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-xs {
2885
- line-height: 20px;
2886
- }
2887
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-xs > .rs-icon {
2888
- padding: 6px 6px;
2889
- width: 24px;
2890
- height: 24px;
2891
- }
2892
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-xs.rs-btn-icon-placement-left {
2893
- padding: 2px 8px 2px 32px;
2894
- }
2895
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-xs.rs-btn-icon-placement-left > .rs-icon {
2896
- left: 0;
2897
- border-right: var(--rs-btn-default-border, none);
2898
- }
2899
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-xs.rs-btn-icon-placement-right {
2900
- padding: 2px 32px 2px 8px;
2901
- }
2902
- .rs-btn-icon-with-text.rs-picker-toggle.rs-btn-xs.rs-btn-icon-placement-right > .rs-icon {
2903
- right: 0;
2904
- border-left: var(--rs-btn-default-border, none);
2905
- }
2906
- .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-xs {
2907
- padding-right: 28px;
2908
- }
2909
- .rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-xs {
2910
- padding-right: 28px;
2911
- }
2912
- .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-caret-icon,
2913
- .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-clean {
2914
- top: 2px;
2915
- right: 8px;
2916
- }
2917
- .rs-picker-default .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-caret-icon,
2918
- .rs-picker-default .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-clean {
2919
- top: 1px;
2920
- }
2921
- .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-loader {
2922
- top: 2px;
2923
- right: 8px;
2924
- }
2925
- .rs-picker-default .rs-picker-toggle.rs-btn-xs {
2926
- padding-top: 1px;
2927
- padding-bottom: 1px;
2928
- }
2929
- .rs-picker-default .rs-picker-toggle.rs-btn-xs {
2930
- padding-left: 7px;
2931
- }
2932
- .rs-picker-date .rs-picker-toggle.rs-btn-xs,
2933
- .rs-picker-daterange .rs-picker-toggle.rs-btn-xs {
2934
- padding-right: 30px;
2935
- }
2936
- .rs-picker-date .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-clean,
2937
- .rs-picker-daterange .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-clean,
2938
- .rs-picker-date .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-caret-icon,
2939
- .rs-picker-daterange .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-caret-icon {
2940
- top: 2px;
2941
- right: 8px;
2942
- }
2943
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-clean,
2944
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-clean,
2945
- .rs-picker-subtle .rs-picker-date .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-caret-icon,
2946
- .rs-picker-subtle .rs-picker-daterange .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-indicator .rs-picker-caret-icon {
2947
- top: 1px;
2948
- }
2949
- /* stylelint-disable-next-line */
2950
- .rs-picker-toggle {
2951
- overflow: hidden;
2952
- text-overflow: ellipsis;
2953
- white-space: nowrap;
2954
- width: 100%;
2955
- }
2956
- .rs-picker-default .rs-picker-toggle {
2957
- position: relative;
2958
- z-index: 5;
2959
- padding-right: 32px;
2960
- display: inline-block;
2961
- color: var(--rs-text-primary);
2962
- border: 1px solid var(--rs-border-primary);
2963
- }
2964
- .rs-picker-disabled .rs-picker-toggle {
2965
- cursor: not-allowed;
2966
- }
2967
- .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):hover,
2968
- .rs-picker-toggle .rs-picker-default:not(.rs-picker-disabled):focus {
2969
- border-color: var(--rs-input-focus-border);
2970
- }
2971
- .rs-picker-subtle .rs-picker-toggle {
2972
- position: relative;
2973
- z-index: 5;
2974
- padding-right: 32px;
2975
- display: inline-block;
2976
- }
2977
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle {
2978
- cursor: not-allowed;
2979
- }
2980
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover,
2981
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus,
2982
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active {
2983
- background: none;
2984
- }
2985
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:hover::after,
2986
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:focus::after,
2987
- .rs-picker-subtle.rs-picker-disabled .rs-picker-toggle:active::after {
2988
- display: none;
2989
- }
2990
2021
  .rs-picker-toggle.rs-btn {
2022
+ text-align: start;
2023
+ display: inline-flex;
2991
2024
  width: 100%;
2992
- text-align: left;
2993
- }
2994
- .rs-picker-toggle-label {
2995
- color: var(--rs-text-primary);
2996
- }
2997
- .rs-picker-toggle-label::after {
2998
- content: ':';
2999
- margin: 0 4px 0 2px;
3000
- }
3001
- .rs-picker-toggle-value {
3002
- display: block;
3003
- overflow: hidden;
3004
- text-overflow: ellipsis;
3005
- white-space: nowrap;
3006
- width: 100%;
2025
+ align-items: center;
2026
+ justify-content: flex-start;
2027
+ padding-inline: calc(var(--rs-btn-padding-inline) - var(--rs-picker-toggle-border-width));
3007
2028
  }
3008
- .rs-picker-cleanable.rs-picker-has-value .rs-picker-toggle {
3009
- padding-right: 44px;
2029
+ .rs-picker-toggle-indicator {
2030
+ display: inline-flex;
2031
+ align-items: center;
3010
2032
  }
3011
2033
  .rs-picker-toggle-indicator .rs-picker-clean {
3012
- display: flex;
2034
+ display: inline-flex;
3013
2035
  align-items: center;
3014
- margin-left: 2px;
3015
- position: absolute;
3016
- top: 8px;
3017
- right: 30px;
3018
2036
  height: 20px;
3019
- font-size: 12px;
2037
+ font-size: var(--rs-font-size-sm);
3020
2038
  background: inherit;
3021
2039
  color: var(--rs-text-secondary);
3022
2040
  transition: 0.2s color linear;
3023
2041
  cursor: pointer;
3024
2042
  }
3025
2043
  .rs-picker-toggle-indicator .rs-picker-clean.rs-btn-close {
3026
- padding: 4px 0;
3027
- }
3028
- .rs-picker-date .rs-picker-toggle-indicator .rs-picker-clean,
3029
- .rs-picker-daterange .rs-picker-toggle-indicator .rs-picker-clean {
3030
- right: 38px;
2044
+ padding: 0;
3031
2045
  }
3032
2046
  .rs-picker-toggle-indicator .rs-picker-caret-icon {
3033
- display: flex;
2047
+ display: inline-flex;
3034
2048
  align-items: center;
3035
- margin-left: 2px;
3036
- position: absolute;
3037
- top: 8px;
3038
- right: 12px;
3039
2049
  height: 20px;
3040
- font-size: 12px;
3041
- font-size: 16px;
2050
+ font-size: var(--rs-font-size-sm);
2051
+ font-size: var(--rs-font-size-md);
3042
2052
  color: var(--rs-text-secondary);
3043
2053
  }
3044
- .rs-picker-toggle-indicator .rs-picker-loader {
3045
- display: flex;
3046
- align-items: center;
3047
- margin-left: 2px;
3048
- position: absolute;
3049
- top: 8px;
3050
- right: 12px;
3051
- height: 20px;
3052
- font-size: 12px;
3053
- }
3054
- .rs-picker-popup {
3055
- position: absolute;
3056
- text-align: left;
3057
- z-index: 7;
3058
- border-radius: 6px;
3059
- background-color: var(--rs-bg-overlay);
3060
- box-shadow: var(--rs-shadow-overlay);
3061
- overflow: hidden;
3062
- transition: none;
3063
- display: flex;
3064
- flex-direction: column;
3065
- padding: 6px 0;
3066
- }
3067
- .rs-theme-high-contrast .rs-picker-popup {
3068
- border: 1px solid var(--rs-border-primary);
3069
- }
3070
- .rs-modal-open .rs-picker-popup {
3071
- z-index: 1055;
3072
- }
3073
- .rs-drawer-open .rs-picker-popup {
3074
- z-index: 1055;
3075
- }
3076
- .rs-picker-popup.rs-picker-inline {
3077
- position: relative;
3078
- box-shadow: none;
3079
- }
3080
- .rs-picker-popup .rs-search-box {
3081
- padding: 6px 12px 6px;
3082
- }
3083
- .rs-picker-popup .rs-highlight .rs-highlight-mark {
3084
- padding: 0;
3085
- }
3086
2054
  .rs-picker-default .rs-btn,
3087
2055
  .rs-picker-input .rs-btn,
3088
2056
  .rs-picker-default .rs-picker-toggle,
3089
2057
  .rs-picker-input .rs-picker-toggle {
3090
- background-color: var(--rs-input-bg) !important;
2058
+ background-color: var(--rs-picker-toggle-bg);
3091
2059
  }
3092
- .rs-picker-default.rs-picker-disabled .rs-picker-toggle,
3093
- .rs-picker-input.rs-picker-disabled .rs-picker-toggle,
3094
- .rs-picker-default.rs-picker-disabled .rs-btn,
3095
- .rs-picker-input.rs-picker-disabled .rs-btn {
3096
- background-color: var(--rs-input-disabled-bg) !important;
2060
+ .rs-picker-default.rs-picker-disabled,
2061
+ .rs-picker-input.rs-picker-disabled {
2062
+ --rs-picker-toggle-bg: var(--rs-input-disabled-bg);
3097
2063
  }
3098
2064
  .rs-picker-default.rs-picker-disabled .rs-input-group,
3099
2065
  .rs-picker-input.rs-picker-disabled .rs-input-group {
@@ -3128,14 +2094,13 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3128
2094
  text-decoration: underline;
3129
2095
  }
3130
2096
  .rs-check-item .rs-checkbox-checker {
3131
- padding: 0;
2097
+ display: flex;
3132
2098
  }
3133
2099
  .rs-check-item .rs-checkbox-checker > label {
3134
- position: relative;
3135
2100
  cursor: pointer;
3136
- display: block;
3137
- padding: 8px 12px 8px 38px;
3138
- line-height: 20px;
2101
+ width: 100%;
2102
+ padding-inline: var(--rs-check-item-padding-inline);
2103
+ padding-block: var(--rs-check-item-padding-block);
3139
2104
  }
3140
2105
  .rs-theme-high-contrast .rs-check-item .rs-checkbox-checker > label {
3141
2106
  transition: none;
@@ -3151,14 +2116,11 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3151
2116
  }
3152
2117
  .grouped .rs-check-item .rs-checkbox-checker > label,
3153
2118
  .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker > label {
3154
- padding-left: 52px;
3155
- }
3156
- .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3157
- left: 12px;
2119
+ padding-inline-start: 52px;
3158
2120
  }
3159
2121
  .grouped .rs-check-item .rs-checkbox-checker .rs-checkbox-control,
3160
2122
  .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3161
- left: 26px;
2123
+ inset-inline-start: 26px;
3162
2124
  }
3163
2125
  .rs-picker-menu-group {
3164
2126
  background-color: var(--rs-listbox-option-group-bg);
@@ -3178,257 +2140,380 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3178
2140
  white-space: nowrap;
3179
2141
  }
3180
2142
  .rs-picker-input {
2143
+ --rs-picker-textbox-margin-inline: var(--rs-picker-input-height);
3181
2144
  position: relative;
3182
2145
  border: 1px solid var(--rs-border-primary);
3183
- border-radius: 6px;
2146
+ border-radius: var(--rs-radius-md);
3184
2147
  transition: border-color ease-in-out 0.15s;
3185
2148
  background-color: var(--rs-input-bg);
2149
+ overflow: hidden;
3186
2150
  }
3187
2151
  .rs-picker-input .rs-picker-toggle {
3188
2152
  border: none !important;
3189
- background: transparent !important;
3190
- height: 34px;
2153
+ height: var(--rs-picker-input-height);
3191
2154
  cursor: text;
3192
2155
  }
3193
- .rs-picker-input .rs-picker-toggle-clean,
3194
- .rs-picker-input .rs-picker-toggle-caret {
3195
- top: 7px;
3196
- }
3197
- .rs-picker-input .rs-picker-toggle .rs-ripple-pond {
3198
- display: none;
3199
- }
3200
2156
  .rs-picker-input:not(.rs-picker-disabled) .rs-picker-toggle {
3201
2157
  position: absolute !important;
3202
2158
  }
3203
- .rs-picker-input .rs-picker-toggle.rs-btn-lg {
3204
- height: 40px;
3205
- }
3206
- .rs-picker-input .rs-picker-toggle.rs-btn-md {
3207
- height: 34px;
3208
- }
3209
- .rs-picker-input .rs-picker-toggle.rs-btn-sm {
3210
- height: 28px;
3211
- }
3212
- .rs-picker-input .rs-picker-toggle.rs-btn-xs {
3213
- height: 22px;
3214
- }
3215
- .rs-picker-textbox {
3216
- margin-right: 32px;
3217
- min-height: 34px;
3218
- }
3219
- .rs-picker-cleanable .rs-picker-textbox {
3220
- margin-right: 44px;
2159
+ .rs-picker-input.rs-picker-input-xs {
2160
+ --rs-picker-input-height: calc(var(--rs-btn-size-xs) - 2px);
2161
+ --rs-picker-search-input-font-size: var(--rs-input-font-size-xs);
2162
+ --rs-picker-search-input-line-height: var(--rs-input-line-height-xs);
2163
+ --rs-picker-search-input-padding-block: var(--rs-input-padding-block-xs);
2164
+ --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-xs);
2165
+ }
2166
+ .rs-picker-input.rs-picker-input-sm {
2167
+ --rs-picker-input-height: calc(var(--rs-btn-size-sm) - 2px);
2168
+ --rs-picker-search-input-font-size: var(--rs-input-font-size-sm);
2169
+ --rs-picker-search-input-line-height: var(--rs-input-line-height-sm);
2170
+ --rs-picker-search-input-padding-block: var(--rs-input-padding-block-sm);
2171
+ --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-sm);
2172
+ }
2173
+ .rs-picker-input.rs-picker-input-md {
2174
+ --rs-picker-input-height: calc(var(--rs-btn-size-md) - 2px);
2175
+ --rs-picker-search-input-font-size: var(--rs-input-font-size-md);
2176
+ --rs-picker-search-input-line-height: var(--rs-input-line-height-md);
2177
+ --rs-picker-search-input-padding-block: var(--rs-input-padding-block-md);
2178
+ --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-md);
2179
+ }
2180
+ .rs-picker-input.rs-picker-input-lg {
2181
+ --rs-picker-input-height: calc(var(--rs-btn-size-lg) - 2px);
2182
+ --rs-picker-search-input-font-size: var(--rs-input-font-size-lg);
2183
+ --rs-picker-search-input-line-height: var(--rs-input-line-height-lg);
2184
+ --rs-picker-search-input-padding-block: var(--rs-input-padding-block-lg);
2185
+ --rs-picker-search-input-padding-inline: var(--rs-input-padding-inline-lg);
2186
+ }
2187
+ .rs-picker-input .rs-picker-textbox {
2188
+ margin-inline-end: var(--rs-picker-textbox-margin-inline);
3221
2189
  }
3222
2190
  .rs-picker-search {
3223
2191
  border: none;
3224
2192
  width: 100%;
3225
2193
  }
3226
2194
  .rs-picker-search-input {
3227
- /* stylelint-disable */
3228
- padding: 7px 11px;
3229
- font-size: 14px;
3230
- line-height: 1.42857143;
3231
- /* stylelint-enable */
2195
+ font-size: var(--rs-picker-search-input-font-size);
2196
+ line-height: var(--rs-picker-search-input-line-height);
2197
+ padding-block: var(--rs-picker-search-input-padding-block);
2198
+ padding-inline: var(--rs-picker-search-input-padding-inline);
3232
2199
  background: none;
3233
2200
  outline: none;
3234
2201
  border: none;
3235
2202
  width: 100%;
3236
2203
  position: relative;
3237
- padding-right: 0;
3238
- }
3239
- textarea.rs-picker-search-input {
3240
- height: auto;
3241
- }
3242
- .rs-picker-tag .rs-picker-search-input {
3243
- font-size: 14px;
3244
- line-height: 1.42857143;
3245
- padding: 2px 12px 2px 11px;
3246
- }
3247
- .rs-picker-tag .rs-picker-search-input > input {
3248
- background: none;
3249
- outline: none;
3250
- border: none;
3251
- width: 100%;
2204
+ padding-inline-end: 0;
3252
2205
  }
3253
2206
  .rs-picker-focused .rs-picker-search-input {
3254
2207
  z-index: 6;
3255
2208
  }
3256
- .rs-picker-input-lg .rs-picker-search-input {
3257
- padding: 8px 16px;
3258
- font-size: 16px;
3259
- line-height: 1.375;
2209
+ .rs-checkbox {
2210
+ --rs-checkbox-size: 16px;
2211
+ position: relative;
2212
+ display: inline-flex;
2213
+ align-items: center;
2214
+ }
2215
+ .rs-checkbox-disabled label {
2216
+ cursor: not-allowed;
3260
2217
  }
3261
- .rs-picker-input-lg .rs-picker-textbox {
3262
- min-height: 40px;
2218
+ .rs-checkbox label {
2219
+ font-weight: normal;
2220
+ cursor: pointer;
3263
2221
  }
3264
- .rs-picker-input-md .rs-picker-search-input {
3265
- padding: 7px 12px;
3266
- font-size: 14px;
3267
- line-height: 1.42857143;
2222
+ .rs-checkbox-inner::before {
2223
+ border-color: var(--rs-checkbox-checked-bg);
3268
2224
  }
3269
- .rs-picker-input-sm .rs-picker-search-input {
3270
- padding: 4px 10px;
3271
- font-size: 14px;
3272
- line-height: 1.42857143;
2225
+ .rs-checkbox.rs-checkbox-disabled label {
2226
+ cursor: not-allowed;
3273
2227
  }
3274
- .rs-picker-input-sm .rs-picker-textbox {
3275
- min-height: 28px;
2228
+ .rs-checkbox-disabled > .rs-checkbox-checker > label {
2229
+ color: var(--rs-text-disabled);
3276
2230
  }
3277
- .rs-picker-input-xs .rs-picker-search-input {
3278
- padding: 1px 8px;
3279
- font-size: 12px;
3280
- line-height: 1.66666667;
2231
+ .rs-checkbox [type='checkbox']:focus-visible ~ .rs-checkbox-inner::before {
2232
+ box-shadow: var(--rs-state-focus-shadow);
3281
2233
  }
3282
- .rs-picker-input-xs .rs-picker-textbox {
3283
- min-height: 22px;
2234
+ .rs-checkbox-checker {
2235
+ position: relative;
2236
+ display: inline-flex;
3284
2237
  }
3285
- .rs-picker-tag .rs-picker-toggle {
3286
- left: 0;
3287
- cursor: text;
2238
+ .rs-checkbox-checker > label {
2239
+ display: inline-flex;
2240
+ align-items: center;
2241
+ gap: calc(var(--rs-spacing) * 2);
3288
2242
  }
3289
- .rs-picker-tag.rs-picker-disabled .rs-picker-toggle {
2243
+ .rs-checkbox-control::before,
2244
+ .rs-checkbox-control .rs-checkbox-inner::before,
2245
+ .rs-checkbox-control .rs-checkbox-inner::after {
2246
+ content: '';
3290
2247
  position: absolute;
2248
+ inset-inline-start: 0;
2249
+ top: 0;
2250
+ display: block;
3291
2251
  }
3292
- .rs-picker-tag .rs-tag {
3293
- max-width: calc(100% - 6px);
3294
- vertical-align: top;
3295
- overflow: hidden;
3296
- text-overflow: ellipsis;
3297
- white-space: nowrap;
2252
+ .rs-checkbox-control .rs-checkbox-inner::after {
2253
+ opacity: 0;
2254
+ transform: rotate(45deg) scale(0);
2255
+ transition: opacity 0.2s ease-in, transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46);
3298
2256
  }
3299
- .rs-picker-tag .rs-picker-search-input,
3300
- .rs-picker-tag .rs-tag {
3301
- margin-top: 5px;
2257
+ .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::after {
2258
+ transition: none;
3302
2259
  }
3303
- .rs-picker-tag.rs-picker-has-value .rs-picker-search-input {
3304
- padding-left: 6px;
2260
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after,
2261
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
2262
+ border: solid var(--rs-checkbox-icon);
2263
+ width: 6px;
2264
+ height: 9px;
2265
+ margin-top: 2px;
2266
+ margin-inline-start: 5px;
2267
+ opacity: 1;
3305
2268
  }
3306
- .rs-picker-tag .rs-picker-search,
3307
- .rs-picker-tag .rs-picker-search-input,
3308
- .rs-picker-tag .rs-picker-search-input > input {
3309
- display: inline-block;
3310
- width: auto;
3311
- min-width: 14px;
2269
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after {
2270
+ border-width: 0 2px 2px 0;
2271
+ transform: rotate(45deg) scale(1);
3312
2272
  }
3313
- .rs-picker-tag .rs-picker-search-input > input {
3314
- padding: 0;
2273
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
2274
+ border-width: 0 0 2px;
2275
+ transform: rotate(0deg) scale(1);
2276
+ width: 10px;
2277
+ margin-top: 0;
2278
+ margin-inline-start: 3px;
3315
2279
  }
3316
- .rs-picker-tag .rs-picker-textbox {
2280
+ .rs-checkbox-control {
3317
2281
  position: relative;
3318
- z-index: 6;
3319
- padding-bottom: 5px;
2282
+ display: inline-flex;
3320
2283
  }
3321
- .rs-picker-tag-list {
3322
- display: contents;
2284
+ .rs-checkbox-control [type='checkbox'] {
2285
+ opacity: 0;
2286
+ width: var(--rs-checkbox-size);
2287
+ height: var(--rs-checkbox-size);
2288
+ z-index: 1;
3323
2289
  }
3324
- .rs-plaintext .rs-tag {
3325
- margin: 0;
2290
+ .rs-checkbox-control::before,
2291
+ .rs-checkbox-control .rs-checkbox-inner::before,
2292
+ .rs-checkbox-control .rs-checkbox-inner::after {
2293
+ width: var(--rs-checkbox-size);
2294
+ height: var(--rs-checkbox-size);
3326
2295
  }
3327
- .rs-picker-tag .rs-picker-textbox,
3328
- .rs-picker-tag-md .rs-picker-textbox {
3329
- padding-bottom: 5px;
2296
+ .rs-checkbox-control::before {
2297
+ border: 1px solid var(--rs-checkbox-checked-bg);
2298
+ background-color: transparent;
2299
+ border-radius: var(--rs-radius-sm);
2300
+ transform: scale(1);
2301
+ opacity: 0.7;
2302
+ visibility: hidden;
2303
+ transition: transform 0.2s linear, opacity 0.2s linear;
3330
2304
  }
3331
- .rs-picker-tag .rs-picker-textbox .rs-picker-search-input,
3332
- .rs-picker-tag-md .rs-picker-textbox .rs-picker-search-input {
3333
- padding-left: 12px;
3334
- margin-top: 5px;
3335
- font-size: 14px;
2305
+ .rs-theme-high-contrast .rs-checkbox-control::before {
2306
+ transition: none;
3336
2307
  }
3337
- .rs-picker-tag .rs-picker-textbox input,
3338
- .rs-picker-tag-md .rs-picker-textbox input {
3339
- height: 18px;
2308
+ .rs-checkbox-checked .rs-checkbox-control::before {
2309
+ transform: scale(1.5);
2310
+ opacity: 0;
2311
+ visibility: visible;
3340
2312
  }
3341
- .rs-picker-tag .rs-picker-toggle,
3342
- .rs-picker-tag-md .rs-picker-toggle {
3343
- padding-top: 7px;
3344
- padding-bottom: 7px;
3345
- box-shadow: none;
2313
+ .rs-checkbox-control .rs-checkbox-inner::before {
2314
+ border: 1px solid var(--rs-checkbox-border);
2315
+ background-color: transparent;
2316
+ border-radius: var(--rs-radius-sm);
2317
+ transition: background 0.2s linear, border 0.2s linear, box-shadow 0.2s linear;
3346
2318
  }
3347
- .rs-picker-tag .rs-picker-tag-list .rs-tag-md,
3348
- .rs-picker-tag-md .rs-picker-tag-list .rs-tag-md {
3349
- margin-top: 5px;
3350
- margin-left: 5px;
2319
+ .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::before {
2320
+ transition: none;
3351
2321
  }
3352
- .rs-picker-tag-lg .rs-picker-textbox {
3353
- padding-bottom: 7px;
2322
+ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
2323
+ border-color: var(--rs-checkbox-checked-bg);
3354
2324
  }
3355
- .rs-picker-tag-lg .rs-picker-textbox .rs-picker-search-input {
3356
- padding-left: 16px;
3357
- margin-top: 7px;
3358
- font-size: 16px;
2325
+ .rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate) .rs-checkbox-control .rs-checkbox-inner::before {
2326
+ border-color: var(--rs-checkbox-disabled-bg);
2327
+ background-color: var(--rs-checkbox-disabled-bg);
3359
2328
  }
3360
- .rs-picker-tag-lg .rs-picker-textbox input {
3361
- height: 20px;
2329
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
2330
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
2331
+ border-color: var(--rs-checkbox-checked-bg);
2332
+ background-color: var(--rs-checkbox-checked-bg);
3362
2333
  }
3363
- .rs-picker-tag-lg .rs-picker-toggle {
3364
- padding-top: 9px;
3365
- padding-bottom: 9px;
3366
- box-shadow: none;
2334
+ .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
2335
+ .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
2336
+ opacity: 0.5;
2337
+ }
2338
+ .rs-checkbox-red {
2339
+ --rs-checkbox-checked-bg: var(--rs-red-500);
2340
+ --rs-checkbox-border: var(--rs-red-500);
2341
+ }
2342
+ .rs-checkbox-orange {
2343
+ --rs-checkbox-checked-bg: var(--rs-orange-500);
2344
+ --rs-checkbox-border: var(--rs-orange-500);
3367
2345
  }
3368
- .rs-picker-tag-lg .rs-picker-textbox {
3369
- min-height: 40px;
2346
+ .rs-checkbox-yellow {
2347
+ --rs-checkbox-checked-bg: var(--rs-yellow-500);
2348
+ --rs-checkbox-border: var(--rs-yellow-500);
2349
+ }
2350
+ .rs-checkbox-green {
2351
+ --rs-checkbox-checked-bg: var(--rs-green-500);
2352
+ --rs-checkbox-border: var(--rs-green-500);
2353
+ }
2354
+ .rs-checkbox-cyan {
2355
+ --rs-checkbox-checked-bg: var(--rs-cyan-500);
2356
+ --rs-checkbox-border: var(--rs-cyan-500);
2357
+ }
2358
+ .rs-checkbox-blue {
2359
+ --rs-checkbox-checked-bg: var(--rs-blue-500);
2360
+ --rs-checkbox-border: var(--rs-blue-500);
2361
+ }
2362
+ .rs-checkbox-violet {
2363
+ --rs-checkbox-checked-bg: var(--rs-violet-500);
2364
+ --rs-checkbox-border: var(--rs-violet-500);
2365
+ }
2366
+ .rs-picker-check-menu-items {
2367
+ --rs-check-item-padding-inline: calc(var(--rs-spacing) * 3);
2368
+ --rs-check-item-padding-block: calc(var(--rs-spacing) * 2);
2369
+ overflow-y: auto;
2370
+ }
2371
+ .rs-picker-check-menu-items ul {
2372
+ list-style: none;
2373
+ margin: 0;
2374
+ padding: 0;
3370
2375
  }
3371
- .rs-picker-tag-lg .rs-picker-tag-list .rs-tag-lg {
2376
+ .rs-picker-check-menu-items .rs-picker-menu-group:not(:first-child) {
3372
2377
  margin-top: 6px;
3373
- margin-left: 6px;
2378
+ border-top: 1px solid var(--rs-divider-border);
2379
+ padding-top: 6px;
3374
2380
  }
3375
- .rs-picker-tag-sm .rs-picker-textbox {
3376
- padding-bottom: 2px;
2381
+ .rs-picker-check-menu-items .rs-picker-menu-group-title {
2382
+ padding: 8px 12px;
2383
+ padding-inline-end: 32px;
2384
+ position: relative;
2385
+ cursor: pointer;
2386
+ color: var(--rs-text-heading);
3377
2387
  }
3378
- .rs-picker-tag-sm .rs-picker-textbox .rs-picker-search-input {
3379
- padding-left: 10px;
3380
- margin-top: 2px;
3381
- font-size: 14px;
2388
+ .rs-picker-check-menu-items .rs-picker-menu-group-title .rs-picker-menu-group-caret {
2389
+ display: inline-block;
2390
+ margin-inline-start: 2px;
2391
+ position: absolute;
2392
+ top: 8px;
2393
+ inset-inline-end: 12px;
2394
+ color: var(--rs-text-secondary);
3382
2395
  }
3383
- .rs-picker-tag-sm .rs-picker-textbox input {
3384
- height: 18px;
2396
+ .rs-picker-check-menu-items .rs-picker-menu-group.folded .rs-picker-menu-group-caret {
2397
+ transform: rotate(90deg);
3385
2398
  }
3386
- .rs-picker-tag-sm .rs-picker-toggle {
3387
- padding-top: 4px;
3388
- padding-bottom: 4px;
3389
- box-shadow: none;
2399
+ .rs-picker-check-menu-items .rs-check-item.rs-checkbox-checked .rs-checkbox-checker > label {
2400
+ font-weight: bold;
3390
2401
  }
3391
- .rs-picker-tag-sm .rs-picker-textbox {
3392
- min-height: 28px;
2402
+ .rs-picker-subtle .picker-subtle-toggle {
2403
+ --rs-picker-toggle-border-width: 0px;
2404
+ position: relative;
2405
+ z-index: 5;
3393
2406
  }
3394
- .rs-picker-tag-sm .rs-picker-tag-list .rs-tag-sm {
3395
- margin-top: 4px;
3396
- margin-left: 4px;
2407
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle {
2408
+ cursor: not-allowed;
3397
2409
  }
3398
- .rs-picker-tag-xs .rs-picker-textbox {
3399
- padding-bottom: -1px;
2410
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover,
2411
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus,
2412
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active {
2413
+ background: none;
3400
2414
  }
3401
- .rs-picker-tag-xs .rs-picker-textbox .rs-picker-search-input {
3402
- padding-left: 8px;
3403
- margin-top: -1px;
3404
- font-size: 12px;
2415
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:hover::after,
2416
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:focus::after,
2417
+ .rs-picker-subtle.rs-picker-disabled .picker-subtle-toggle:active::after {
2418
+ display: none;
3405
2419
  }
3406
- .rs-picker-tag-xs .rs-picker-textbox input {
3407
- height: 18px;
2420
+ .rs-picker-tag {
2421
+ --rs-tag-picker-input-font-size-xs: var(--rs-font-size-xs);
2422
+ --rs-tag-picker-input-font-size-sm: var(--rs-font-size-sm);
2423
+ --rs-tag-picker-input-font-size-md: var(--rs-font-size-sm);
2424
+ --rs-tag-picker-input-font-size-lg: var(--rs-font-size-md);
2425
+ --rs-tag-border-radius: var(--rs-radius-sm);
2426
+ --rs-tag-picker-padding-block: calc(8px - 1px);
3408
2427
  }
3409
- .rs-picker-tag-xs .rs-picker-toggle {
3410
- padding-top: 1px;
3411
- padding-bottom: 1px;
2428
+ .rs-picker-tag .rs-picker-toggle {
2429
+ inset-inline-start: 0;
2430
+ cursor: text;
3412
2431
  box-shadow: none;
2432
+ padding-block: var(--rs-tag-picker-padding-block);
3413
2433
  }
3414
- .rs-picker-tag-xs .rs-picker-textbox {
3415
- min-height: 22px;
3416
- padding-bottom: 1px;
2434
+ .rs-picker-tag.rs-picker-disabled .rs-picker-toggle {
2435
+ position: absolute;
2436
+ height: 100%;
2437
+ }
2438
+ .rs-picker-tag .rs-tag {
2439
+ vertical-align: top;
2440
+ overflow: hidden;
2441
+ text-overflow: ellipsis;
2442
+ white-space: nowrap;
2443
+ }
2444
+ .rs-picker-tag .rs-picker-search > input {
2445
+ background: none;
2446
+ outline: none;
2447
+ border: none;
2448
+ width: 100%;
2449
+ }
2450
+ .rs-picker-tag .rs-picker-search,
2451
+ .rs-picker-tag .rs-picker-search-input,
2452
+ .rs-picker-tag .rs-picker-search-input > input {
2453
+ display: inline-block;
2454
+ width: auto;
2455
+ min-width: 14px;
2456
+ }
2457
+ .rs-picker-tag .rs-picker-search-input > input {
2458
+ padding: 0;
2459
+ border: transparent;
2460
+ background: transparent;
2461
+ }
2462
+ .rs-picker-tag .rs-picker-textbox {
2463
+ min-height: var(--rs-picker-textbox-min-height, 34px);
2464
+ margin-inline-end: var(--rs-picker-textbox-min-height);
2465
+ position: relative;
2466
+ z-index: 6;
3417
2467
  }
3418
- .rs-picker-tag-xs .rs-picker-textbox .rs-picker-search-input {
3419
- padding-top: 1px;
3420
- padding-bottom: 1px;
2468
+ .rs-picker-tag .rs-picker-textbox .rs-picker-search-input {
2469
+ font-size: var(--rs-tag-picker-input-font-size, 0.875rem);
2470
+ padding: var(--rs-tag-picker-input-padding, 2px 4px);
3421
2471
  }
3422
- .rs-picker-tag-xs .rs-picker-tag-list .rs-tag-sm {
3423
- margin-top: 1px;
3424
- margin-left: 2px;
2472
+ .rs-picker-tag .rs-picker-tag-list {
2473
+ display: inline-flex;
2474
+ flex-wrap: wrap;
2475
+ align-items: flex-start;
2476
+ gap: var(--rs-tag-spacing, 4px);
2477
+ padding: var(--rs-tag-list-padding, 4px);
3425
2478
  }
3426
- .rs-picker-disabled-options .rs-picker-toggle {
3427
- padding-right: 32px !important;
2479
+ .rs-picker-tag .rs-picker-tag-list .rs-tag {
2480
+ border-radius: var(--rs-tag-border-radius);
3428
2481
  }
3429
- .rs-picker-disabled-options .rs-picker-textbox {
3430
- margin-right: 32px !important;
2482
+ .rs-plaintext .rs-tag {
2483
+ margin: 0;
3431
2484
  }
3432
- .rs-picker-disabled-options .rs-picker-clean {
3433
- right: 10px !important;
2485
+ .rs-picker-tag-lg {
2486
+ --rs-tag-spacing: 5px;
2487
+ --rs-tag-list-padding: 5px;
2488
+ --rs-picker-textbox-min-height: 40px;
2489
+ --rs-tag-picker-input-font-size: var(--rs-tag-picker-input-font-size-lg);
2490
+ --rs-tag-picker-input-padding: 3px 5px;
2491
+ --rs-tag-picker-padding-block: var(--rs-btn-padding-block-lg);
2492
+ }
2493
+ .rs-picker-tag-md {
2494
+ --rs-tag-spacing: 5px;
2495
+ --rs-tag-list-padding: 5px;
2496
+ --rs-picker-textbox-min-height: 34px;
2497
+ --rs-tag-picker-input-font-size: var(--rs-tag-picker-input-font-size-md);
2498
+ --rs-tag-picker-input-padding: 2px 4px;
2499
+ --rs-tag-picker-padding-block: var(--rs-btn-padding-block-md);
2500
+ }
2501
+ .rs-picker-tag-sm {
2502
+ --rs-tag-spacing: 4px;
2503
+ --rs-tag-list-padding: 4px;
2504
+ --rs-picker-textbox-min-height: 28px;
2505
+ --rs-tag-picker-input-font-size: var(--rs-tag-picker-input-font-size-sm);
2506
+ --rs-tag-picker-input-padding: 0 2px;
2507
+ --rs-tag-picker-padding-block: var(--rs-btn-padding-block-sm);
2508
+ }
2509
+ .rs-picker-tag-xs {
2510
+ --rs-tag-spacing: 2px;
2511
+ --rs-tag-list-padding: 1px;
2512
+ --rs-picker-textbox-min-height: 22px;
2513
+ --rs-tag-picker-input-font-size: var(--rs-tag-picker-input-font-size-xs);
2514
+ --rs-tag-picker-input-padding: 0 1px;
2515
+ --rs-tag-picker-padding-block: var(--rs-btn-padding-block-xs);
2516
+ }
2517
+ .rs-picker-disabled-options {
2518
+ --rs-picker-textbox-margin-inline: var(--rs-picker-textbox-min-height);
3434
2519
  }