rsuite 6.0.0-canary-20250416 → 6.0.0-canary-20250424

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 (520) hide show
  1. package/AutoComplete/styles/index.css +32 -71
  2. package/Button/styles/index.css +4 -6
  3. package/CHANGELOG.md +15 -0
  4. package/Calendar/styles/index.css +8 -16
  5. package/CascadeTree/styles/index.css +8 -16
  6. package/Cascader/styles/index.css +36 -79
  7. package/CheckPicker/styles/index.css +32 -66
  8. package/CheckTree/styles/index.css +34 -70
  9. package/CheckTreePicker/styles/index.css +34 -70
  10. package/Checkbox/styles/index.css +7 -9
  11. package/Checkbox/styles/index.less +1 -1
  12. package/DateInput/styles/index.css +6 -9
  13. package/DatePicker/styles/index.css +38 -81
  14. package/DateRangeInput/styles/index.css +6 -9
  15. package/DateRangePicker/styles/index.css +38 -81
  16. package/Dropdown/styles/index.css +6 -10
  17. package/FormControl/styles/index.css +2 -2
  18. package/FormControl/styles/index.less +2 -2
  19. package/IconButton/styles/index.css +4 -6
  20. package/Input/styles/index.css +6 -9
  21. package/Input/styles/mixin.less +2 -3
  22. package/InputGroup/styles/index.css +7 -13
  23. package/InputGroup/styles/index.less +3 -4
  24. package/InputNumber/styles/index.css +36 -35
  25. package/InputNumber/styles/index.less +1 -67
  26. package/InputPicker/styles/index.css +32 -71
  27. package/Message/styles/index.css +5 -15
  28. package/Message/styles/index.less +4 -3
  29. package/MultiCascadeTree/styles/index.css +38 -80
  30. package/MultiCascader/styles/index.css +38 -80
  31. package/Nav/styles/index.css +8 -14
  32. package/Navbar/styles/index.css +16 -40
  33. package/NumberInput/package.json +7 -0
  34. package/NumberInput/styles/index.css +1402 -0
  35. package/NumberInput/styles/index.less +74 -0
  36. package/{InputNumber → NumberInput}/styles/mixin.less +0 -0
  37. package/Pagination/styles/index.css +34 -75
  38. package/PasswordInput/styles/index.css +6 -9
  39. package/PinInput/package.json +7 -0
  40. package/PinInput/styles/index.css +212 -0
  41. package/PinInput/styles/index.less +66 -0
  42. package/Radio/styles/index.css +7 -9
  43. package/Radio/styles/index.less +1 -1
  44. package/RangeSlider/styles/index.css +2 -0
  45. package/SelectPicker/styles/index.css +32 -71
  46. package/Sidenav/styles/index.css +30 -67
  47. package/Slider/styles/index.css +2 -0
  48. package/Slider/styles/index.less +2 -0
  49. package/Stat/styles/index.css +4 -6
  50. package/Tabs/styles/index.css +8 -14
  51. package/Tag/styles/index.css +0 -15
  52. package/TagInput/styles/index.css +34 -72
  53. package/TagPicker/styles/index.css +34 -72
  54. package/TimePicker/styles/index.css +38 -81
  55. package/TimeRangePicker/styles/index.css +38 -81
  56. package/Toggle/styles/index.css +9 -13
  57. package/Toggle/styles/index.less +3 -4
  58. package/Tree/styles/index.css +34 -75
  59. package/TreePicker/styles/index.css +34 -75
  60. package/Uploader/styles/index.css +6 -10
  61. package/cjs/Accordion/Accordion.js +2 -2
  62. package/cjs/Affix/Affix.js +1 -2
  63. package/cjs/Animation/Bounce.js +1 -2
  64. package/cjs/Animation/Collapse.js +1 -2
  65. package/cjs/Animation/Fade.js +1 -2
  66. package/cjs/Animation/Slide.js +1 -2
  67. package/cjs/AutoComplete/AutoComplete.d.ts +2 -2
  68. package/cjs/AutoComplete/AutoComplete.js +1 -2
  69. package/cjs/Avatar/Avatar.js +1 -2
  70. package/cjs/AvatarGroup/AvatarGroup.js +1 -2
  71. package/cjs/Badge/Badge.js +1 -2
  72. package/cjs/Breadcrumb/Breadcrumb.js +1 -2
  73. package/cjs/Button/Button.d.ts +2 -2
  74. package/cjs/Button/Button.js +1 -2
  75. package/cjs/ButtonGroup/ButtonGroup.d.ts +2 -2
  76. package/cjs/ButtonGroup/ButtonGroup.js +1 -2
  77. package/cjs/ButtonToolbar/ButtonToolbar.js +1 -2
  78. package/cjs/Calendar/Calendar.js +4 -4
  79. package/cjs/Calendar/CalendarBody.js +1 -4
  80. package/cjs/Calendar/CalendarContainer.js +1 -1
  81. package/cjs/Calendar/CalendarHeader.js +3 -3
  82. package/cjs/Calendar/CalendarProvider.d.ts +1 -1
  83. package/cjs/Calendar/Grid/GridCell.js +1 -2
  84. package/cjs/Calendar/Grid/GridHeaderRow.js +1 -2
  85. package/cjs/Calendar/Grid/GridRow.d.ts +2 -0
  86. package/cjs/Calendar/Grid/GridRow.js +5 -4
  87. package/cjs/Calendar/MonthDropdown/MonthDropdownItem.js +1 -2
  88. package/cjs/Calendar/hooks/useCalendar.d.ts +24 -2
  89. package/cjs/Calendar/hooks/useCalendar.js +34 -1
  90. package/cjs/Card/Card.js +1 -2
  91. package/cjs/CardGroup/CardGroup.js +1 -2
  92. package/cjs/Carousel/Carousel.js +1 -2
  93. package/cjs/CascadeTree/CascadeTree.js +1 -2
  94. package/cjs/CascadeTree/SearchView.js +1 -2
  95. package/cjs/CascadeTree/TreeView.js +1 -2
  96. package/cjs/Cascader/Cascader.js +1 -2
  97. package/cjs/CheckPicker/CheckPicker.js +1 -2
  98. package/cjs/CheckTree/CheckTree.js +1 -2
  99. package/cjs/CheckTree/CheckTreeNode.js +1 -2
  100. package/cjs/CheckTree/CheckTreeView.js +1 -2
  101. package/cjs/CheckTreePicker/CheckTreePicker.js +1 -2
  102. package/cjs/Checkbox/Checkbox.js +1 -2
  103. package/cjs/CheckboxGroup/CheckboxGroup.js +1 -2
  104. package/cjs/Container/Container.js +1 -2
  105. package/cjs/CustomProvider/CustomProvider.d.ts +1 -271
  106. package/cjs/CustomProvider/CustomProvider.js +2 -3
  107. package/cjs/CustomProvider/index.d.ts +1 -6
  108. package/cjs/CustomProvider/index.js +3 -12
  109. package/cjs/DateInput/DateInput.js +1 -2
  110. package/cjs/DateInput/hooks/useDateInputState.js +2 -2
  111. package/cjs/DatePicker/DatePicker.js +2 -3
  112. package/cjs/DatePicker/hooks/useFocus.js +1 -2
  113. package/cjs/DateRangeInput/DateRangeInput.js +1 -2
  114. package/cjs/DateRangePicker/DateRangePicker.js +2 -3
  115. package/cjs/DateRangePicker/Header.js +3 -3
  116. package/cjs/DateRangePicker/utils.d.ts +1 -1
  117. package/cjs/DateRangePicker/utils.js +1 -1
  118. package/cjs/Divider/Divider.js +1 -2
  119. package/cjs/Drawer/Drawer.js +1 -2
  120. package/cjs/Dropdown/Dropdown.js +1 -2
  121. package/cjs/Dropdown/DropdownMenu.js +1 -2
  122. package/cjs/FlexboxGrid/FlexboxGrid.js +1 -2
  123. package/cjs/Form/Form.js +1 -2
  124. package/cjs/FormControl/FormControl.js +1 -2
  125. package/cjs/FormControlLabel/FormControlLabel.js +1 -2
  126. package/cjs/FormErrorMessage/FormErrorMessage.js +1 -2
  127. package/cjs/FormGroup/FormGroup.js +1 -2
  128. package/cjs/FormHelpText/FormHelpText.js +1 -2
  129. package/cjs/FormStack/FormStack.js +1 -2
  130. package/cjs/Grid/Col.js +1 -2
  131. package/cjs/Grid/Grid.js +1 -2
  132. package/cjs/Grid/Row.js +1 -2
  133. package/cjs/Heading/Heading.js +1 -2
  134. package/cjs/Highlight/Highlight.js +2 -3
  135. package/cjs/IconButton/IconButton.js +1 -2
  136. package/cjs/Image/Image.js +2 -3
  137. package/cjs/InlineEdit/InlineEdit.js +1 -2
  138. package/cjs/Input/Input.js +3 -3
  139. package/cjs/InputGroup/InputGroup.js +1 -2
  140. package/cjs/InputNumber/index.d.ts +12 -2
  141. package/cjs/InputNumber/index.js +11 -4
  142. package/cjs/InputPicker/InputPicker.js +1 -2
  143. package/cjs/InputPicker/utils.d.ts +1 -1
  144. package/cjs/Kbd/Kbd.js +1 -2
  145. package/cjs/Link/Link.js +1 -2
  146. package/cjs/List/List.js +1 -2
  147. package/cjs/Loader/Loader.js +1 -2
  148. package/cjs/MaskedInput/MaskedInput.js +2 -2
  149. package/cjs/Message/Message.js +1 -2
  150. package/cjs/Modal/Modal.js +1 -2
  151. package/cjs/Modal/ModalHeader.js +1 -2
  152. package/cjs/MultiCascadeTree/MultiCascadeTree.js +1 -2
  153. package/cjs/MultiCascadeTree/SearchView.js +1 -2
  154. package/cjs/MultiCascadeTree/TreeView.js +1 -2
  155. package/cjs/MultiCascader/MultiCascader.js +1 -2
  156. package/cjs/Nav/Nav.js +1 -2
  157. package/cjs/Nav/NavDropdownMenu.js +1 -2
  158. package/cjs/Navbar/Navbar.d.ts +1 -1
  159. package/cjs/Navbar/Navbar.js +1 -2
  160. package/cjs/Navbar/NavbarDropdownMenu.js +1 -2
  161. package/cjs/Navbar/NavbarToggle.d.ts +8 -3
  162. package/cjs/Navbar/NavbarToggle.js +9 -14
  163. package/cjs/Notification/Notification.js +1 -2
  164. package/cjs/{InputNumber/InputNumber.d.ts → NumberInput/NumberInput.d.ts} +20 -8
  165. package/cjs/NumberInput/NumberInput.js +162 -0
  166. package/cjs/NumberInput/hooks/useEvents.d.ts +22 -0
  167. package/cjs/NumberInput/hooks/useEvents.js +114 -0
  168. package/cjs/NumberInput/hooks/useNumberInputValue.d.ts +7 -0
  169. package/cjs/NumberInput/hooks/useNumberInputValue.js +34 -0
  170. package/cjs/NumberInput/hooks/useWheelHandler.d.ts +5 -0
  171. package/cjs/NumberInput/hooks/useWheelHandler.js +25 -0
  172. package/cjs/NumberInput/index.d.ts +4 -0
  173. package/cjs/NumberInput/index.js +11 -0
  174. package/cjs/NumberInput/utils/number.d.ts +17 -0
  175. package/cjs/NumberInput/utils/number.js +67 -0
  176. package/cjs/Pagination/LimitPicker.d.ts +2 -2
  177. package/cjs/Pagination/Pagination.d.ts +2 -2
  178. package/cjs/Pagination/Pagination.js +1 -2
  179. package/cjs/Pagination/PaginationGroup.js +1 -2
  180. package/cjs/Panel/Panel.js +1 -2
  181. package/cjs/PanelGroup/PanelGroup.js +1 -2
  182. package/cjs/PasswordInput/PasswordInput.d.ts +4 -0
  183. package/cjs/PasswordInput/PasswordInput.js +5 -4
  184. package/cjs/PasswordStrengthMeter/PasswordStrengthMeter.js +1 -2
  185. package/cjs/PinInput/PinInput.d.ts +36 -0
  186. package/cjs/PinInput/PinInput.js +224 -0
  187. package/cjs/PinInput/hooks/usePinInputRefs.d.ts +12 -0
  188. package/cjs/PinInput/hooks/usePinInputRefs.js +62 -0
  189. package/cjs/PinInput/hooks/usePinValue.d.ts +14 -0
  190. package/cjs/PinInput/hooks/usePinValue.js +73 -0
  191. package/cjs/PinInput/index.d.ts +4 -0
  192. package/cjs/PinInput/index.js +9 -0
  193. package/cjs/Placeholder/PlaceholderGraph.js +1 -2
  194. package/cjs/Placeholder/PlaceholderGrid.js +1 -2
  195. package/cjs/Placeholder/PlaceholderParagraph.js +1 -2
  196. package/cjs/Popover/Popover.js +1 -2
  197. package/cjs/Progress/ProgressCircle.js +1 -2
  198. package/cjs/Progress/ProgressLine.js +1 -2
  199. package/cjs/Radio/Radio.js +1 -2
  200. package/cjs/RadioGroup/RadioGroup.js +1 -2
  201. package/cjs/RadioTile/RadioTile.js +1 -2
  202. package/cjs/RadioTileGroup/RadioTileGroup.js +1 -2
  203. package/cjs/RangeSlider/RangeSlider.js +2 -3
  204. package/cjs/Rate/Rate.js +1 -2
  205. package/cjs/SelectPicker/SelectPicker.js +1 -2
  206. package/cjs/Sidebar/Sidebar.js +1 -2
  207. package/cjs/Sidenav/ExpandedSidenavDropdownMenu.js +1 -2
  208. package/cjs/Sidenav/Sidenav.js +1 -2
  209. package/cjs/Sidenav/SidenavDropdownMenu.js +1 -2
  210. package/cjs/Slider/Slider.d.ts +5 -1
  211. package/cjs/Slider/Slider.js +13 -14
  212. package/cjs/Stack/Stack.js +1 -2
  213. package/cjs/Stat/Stat.js +1 -2
  214. package/cjs/Stat/StatValue.js +2 -2
  215. package/cjs/StatGroup/StatGroup.js +1 -2
  216. package/cjs/Steps/Steps.js +1 -2
  217. package/cjs/Table/Table.js +2 -2
  218. package/cjs/Tabs/Tabs.js +1 -2
  219. package/cjs/Tag/Tag.js +1 -2
  220. package/cjs/TagInput/TagInput.js +2 -2
  221. package/cjs/TagPicker/TagPicker.js +2 -2
  222. package/cjs/Text/Text.js +1 -2
  223. package/cjs/Textarea/Textarea.js +1 -2
  224. package/cjs/TimePicker/TimePicker.d.ts +1 -2
  225. package/cjs/TimePicker/TimePicker.js +2 -2
  226. package/cjs/TimeRangePicker/TimeRangePicker.js +2 -2
  227. package/cjs/Timeline/Timeline.js +1 -2
  228. package/cjs/Toggle/Toggle.js +1 -2
  229. package/cjs/Tooltip/Tooltip.js +1 -2
  230. package/cjs/Tree/Tree.js +1 -2
  231. package/cjs/Tree/TreeNode.js +1 -2
  232. package/cjs/Tree/TreeNodeToggle.js +1 -2
  233. package/cjs/Tree/TreeView.js +1 -2
  234. package/cjs/Tree/hooks/useFocusTree.js +1 -2
  235. package/cjs/TreePicker/TreePicker.js +1 -2
  236. package/cjs/Uploader/Uploader.js +1 -2
  237. package/cjs/Whisper/Whisper.js +2 -2
  238. package/cjs/index.d.ts +2 -0
  239. package/cjs/index.js +12 -0
  240. package/cjs/internals/Box/index.d.ts +1 -0
  241. package/cjs/internals/Box/index.js +1 -0
  242. package/cjs/internals/Burger/Burger.d.ts +16 -0
  243. package/cjs/internals/Burger/Burger.js +46 -0
  244. package/cjs/internals/Burger/index.d.ts +4 -0
  245. package/cjs/internals/Burger/index.js +11 -0
  246. package/cjs/internals/CloseButton/CloseButton.js +1 -2
  247. package/cjs/internals/Menu/Menu.js +1 -2
  248. package/cjs/internals/Menu/Menubar.js +2 -2
  249. package/cjs/internals/Picker/PickerIndicator.js +1 -2
  250. package/cjs/internals/Picker/hooks/useCombobox.d.ts +1 -1
  251. package/cjs/internals/Plaintext/Plaintext.js +1 -2
  252. package/cjs/internals/Provider/CustomContext.d.ts +253 -0
  253. package/cjs/internals/Provider/CustomContext.js +8 -0
  254. package/cjs/internals/Provider/types.d.ts +236 -0
  255. package/cjs/internals/Ripple/Ripple.js +1 -2
  256. package/cjs/internals/SafeAnchor/SafeAnchor.js +2 -2
  257. package/cjs/internals/Windowing/List.js +2 -2
  258. package/cjs/internals/hooks/index.d.ts +1 -0
  259. package/cjs/internals/hooks/index.js +3 -1
  260. package/cjs/{CustomProvider → internals/hooks}/useCustom.d.ts +4 -4
  261. package/cjs/{CustomProvider → internals/hooks}/useCustom.js +5 -5
  262. package/cjs/internals/hooks/useStyles.js +2 -2
  263. package/cjs/internals/hooks/useToggleCaret.js +2 -2
  264. package/cjs/{CustomProvider → internals/intl}/FormattedDate.js +2 -2
  265. package/cjs/{CustomProvider → internals/intl}/FormattedNumber.js +2 -2
  266. package/cjs/internals/types/picker.d.ts +2 -2
  267. package/cjs/internals/types/sizes.d.ts +2 -0
  268. package/cjs/internals/types/sizes.js +2 -1
  269. package/cjs/internals/utils/date/getWeekStartDates.d.ts +0 -1
  270. package/cjs/internals/utils/date/getWeekStartDates.js +2 -4
  271. package/cjs/internals/utils/react/createComponent.js +15 -4
  272. package/cjs/useToaster/useToaster.js +2 -5
  273. package/dist/rsuite-no-reset-rtl.css +246 -265
  274. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  275. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  276. package/dist/rsuite-no-reset.css +246 -265
  277. package/dist/rsuite-no-reset.min.css +1 -1
  278. package/dist/rsuite-no-reset.min.css.map +1 -1
  279. package/dist/rsuite-rtl.css +246 -265
  280. package/dist/rsuite-rtl.min.css +1 -1
  281. package/dist/rsuite-rtl.min.css.map +1 -1
  282. package/dist/rsuite.css +246 -265
  283. package/dist/rsuite.js +333 -223
  284. package/dist/rsuite.js.map +1 -1
  285. package/dist/rsuite.min.css +1 -1
  286. package/dist/rsuite.min.css.map +1 -1
  287. package/dist/rsuite.min.js +1 -1
  288. package/dist/rsuite.min.js.map +1 -1
  289. package/esm/Accordion/Accordion.js +1 -1
  290. package/esm/Affix/Affix.js +1 -2
  291. package/esm/Animation/Bounce.js +1 -2
  292. package/esm/Animation/Collapse.js +1 -2
  293. package/esm/Animation/Fade.js +1 -2
  294. package/esm/Animation/Slide.js +1 -2
  295. package/esm/AutoComplete/AutoComplete.d.ts +2 -2
  296. package/esm/AutoComplete/AutoComplete.js +1 -2
  297. package/esm/Avatar/Avatar.js +1 -2
  298. package/esm/AvatarGroup/AvatarGroup.js +1 -2
  299. package/esm/Badge/Badge.js +1 -2
  300. package/esm/Breadcrumb/Breadcrumb.js +1 -2
  301. package/esm/Button/Button.d.ts +2 -2
  302. package/esm/Button/Button.js +1 -2
  303. package/esm/ButtonGroup/ButtonGroup.d.ts +2 -2
  304. package/esm/ButtonGroup/ButtonGroup.js +1 -2
  305. package/esm/ButtonToolbar/ButtonToolbar.js +1 -2
  306. package/esm/Calendar/Calendar.js +3 -4
  307. package/esm/Calendar/CalendarBody.js +1 -4
  308. package/esm/Calendar/CalendarContainer.js +1 -1
  309. package/esm/Calendar/CalendarHeader.js +1 -1
  310. package/esm/Calendar/CalendarProvider.d.ts +1 -1
  311. package/esm/Calendar/Grid/GridCell.js +1 -2
  312. package/esm/Calendar/Grid/GridHeaderRow.js +1 -2
  313. package/esm/Calendar/Grid/GridRow.d.ts +2 -0
  314. package/esm/Calendar/Grid/GridRow.js +5 -4
  315. package/esm/Calendar/MonthDropdown/MonthDropdownItem.js +1 -2
  316. package/esm/Calendar/hooks/useCalendar.d.ts +24 -2
  317. package/esm/Calendar/hooks/useCalendar.js +35 -2
  318. package/esm/Card/Card.js +1 -2
  319. package/esm/CardGroup/CardGroup.js +1 -2
  320. package/esm/Carousel/Carousel.js +1 -2
  321. package/esm/CascadeTree/CascadeTree.js +1 -2
  322. package/esm/CascadeTree/SearchView.js +1 -2
  323. package/esm/CascadeTree/TreeView.js +1 -2
  324. package/esm/Cascader/Cascader.js +1 -2
  325. package/esm/CheckPicker/CheckPicker.js +1 -2
  326. package/esm/CheckTree/CheckTree.js +1 -2
  327. package/esm/CheckTree/CheckTreeNode.js +1 -2
  328. package/esm/CheckTree/CheckTreeView.js +1 -2
  329. package/esm/CheckTreePicker/CheckTreePicker.js +1 -2
  330. package/esm/Checkbox/Checkbox.js +1 -2
  331. package/esm/CheckboxGroup/CheckboxGroup.js +1 -2
  332. package/esm/Container/Container.js +1 -2
  333. package/esm/CustomProvider/CustomProvider.d.ts +1 -271
  334. package/esm/CustomProvider/CustomProvider.js +1 -1
  335. package/esm/CustomProvider/index.d.ts +1 -6
  336. package/esm/CustomProvider/index.js +0 -6
  337. package/esm/DateInput/DateInput.js +1 -2
  338. package/esm/DateInput/hooks/useDateInputState.js +1 -1
  339. package/esm/DatePicker/DatePicker.js +2 -3
  340. package/esm/DatePicker/hooks/useFocus.js +1 -2
  341. package/esm/DateRangeInput/DateRangeInput.js +1 -2
  342. package/esm/DateRangePicker/DateRangePicker.js +2 -3
  343. package/esm/DateRangePicker/Header.js +1 -1
  344. package/esm/DateRangePicker/utils.d.ts +1 -1
  345. package/esm/DateRangePicker/utils.js +1 -1
  346. package/esm/Divider/Divider.js +1 -2
  347. package/esm/Drawer/Drawer.js +1 -2
  348. package/esm/Dropdown/Dropdown.js +1 -2
  349. package/esm/Dropdown/DropdownMenu.js +1 -2
  350. package/esm/FlexboxGrid/FlexboxGrid.js +1 -2
  351. package/esm/Form/Form.js +1 -2
  352. package/esm/FormControl/FormControl.js +1 -2
  353. package/esm/FormControlLabel/FormControlLabel.js +1 -2
  354. package/esm/FormErrorMessage/FormErrorMessage.js +1 -2
  355. package/esm/FormGroup/FormGroup.js +1 -2
  356. package/esm/FormHelpText/FormHelpText.js +1 -2
  357. package/esm/FormStack/FormStack.js +1 -2
  358. package/esm/Grid/Col.js +1 -2
  359. package/esm/Grid/Grid.js +1 -2
  360. package/esm/Grid/Row.js +1 -2
  361. package/esm/Heading/Heading.js +1 -2
  362. package/esm/Highlight/Highlight.js +2 -3
  363. package/esm/IconButton/IconButton.js +1 -2
  364. package/esm/Image/Image.js +2 -3
  365. package/esm/InlineEdit/InlineEdit.js +1 -2
  366. package/esm/Input/Input.js +2 -2
  367. package/esm/InputGroup/InputGroup.js +1 -2
  368. package/esm/InputNumber/index.d.ts +12 -2
  369. package/esm/InputNumber/index.js +8 -1
  370. package/esm/InputPicker/InputPicker.js +1 -2
  371. package/esm/InputPicker/utils.d.ts +1 -1
  372. package/esm/Kbd/Kbd.js +1 -2
  373. package/esm/Link/Link.js +1 -2
  374. package/esm/List/List.js +1 -2
  375. package/esm/Loader/Loader.js +1 -2
  376. package/esm/MaskedInput/MaskedInput.js +1 -1
  377. package/esm/Message/Message.js +1 -2
  378. package/esm/Modal/Modal.js +1 -2
  379. package/esm/Modal/ModalHeader.js +1 -2
  380. package/esm/MultiCascadeTree/MultiCascadeTree.js +1 -2
  381. package/esm/MultiCascadeTree/SearchView.js +1 -2
  382. package/esm/MultiCascadeTree/TreeView.js +1 -2
  383. package/esm/MultiCascader/MultiCascader.js +1 -2
  384. package/esm/Nav/Nav.js +1 -2
  385. package/esm/Nav/NavDropdownMenu.js +1 -2
  386. package/esm/Navbar/Navbar.d.ts +1 -1
  387. package/esm/Navbar/Navbar.js +1 -2
  388. package/esm/Navbar/NavbarDropdownMenu.js +1 -2
  389. package/esm/Navbar/NavbarToggle.d.ts +8 -3
  390. package/esm/Navbar/NavbarToggle.js +10 -15
  391. package/esm/Notification/Notification.js +1 -2
  392. package/esm/{InputNumber/InputNumber.d.ts → NumberInput/NumberInput.d.ts} +20 -8
  393. package/esm/NumberInput/NumberInput.js +157 -0
  394. package/esm/NumberInput/hooks/useEvents.d.ts +22 -0
  395. package/esm/NumberInput/hooks/useEvents.js +110 -0
  396. package/esm/NumberInput/hooks/useNumberInputValue.d.ts +7 -0
  397. package/esm/NumberInput/hooks/useNumberInputValue.js +29 -0
  398. package/esm/NumberInput/hooks/useWheelHandler.d.ts +5 -0
  399. package/esm/NumberInput/hooks/useWheelHandler.js +21 -0
  400. package/esm/NumberInput/index.d.ts +4 -0
  401. package/esm/NumberInput/index.js +8 -0
  402. package/esm/NumberInput/utils/number.d.ts +17 -0
  403. package/esm/NumberInput/utils/number.js +59 -0
  404. package/esm/Pagination/LimitPicker.d.ts +2 -2
  405. package/esm/Pagination/Pagination.d.ts +2 -2
  406. package/esm/Pagination/Pagination.js +1 -2
  407. package/esm/Pagination/PaginationGroup.js +1 -2
  408. package/esm/Panel/Panel.js +1 -2
  409. package/esm/PanelGroup/PanelGroup.js +1 -2
  410. package/esm/PasswordInput/PasswordInput.d.ts +4 -0
  411. package/esm/PasswordInput/PasswordInput.js +5 -4
  412. package/esm/PasswordStrengthMeter/PasswordStrengthMeter.js +1 -2
  413. package/esm/PinInput/PinInput.d.ts +36 -0
  414. package/esm/PinInput/PinInput.js +219 -0
  415. package/esm/PinInput/hooks/usePinInputRefs.d.ts +12 -0
  416. package/esm/PinInput/hooks/usePinInputRefs.js +58 -0
  417. package/esm/PinInput/hooks/usePinValue.d.ts +14 -0
  418. package/esm/PinInput/hooks/usePinValue.js +69 -0
  419. package/esm/PinInput/index.d.ts +4 -0
  420. package/esm/PinInput/index.js +4 -0
  421. package/esm/Placeholder/PlaceholderGraph.js +1 -2
  422. package/esm/Placeholder/PlaceholderGrid.js +1 -2
  423. package/esm/Placeholder/PlaceholderParagraph.js +1 -2
  424. package/esm/Popover/Popover.js +1 -2
  425. package/esm/Progress/ProgressCircle.js +1 -2
  426. package/esm/Progress/ProgressLine.js +1 -2
  427. package/esm/Radio/Radio.js +1 -2
  428. package/esm/RadioGroup/RadioGroup.js +1 -2
  429. package/esm/RadioTile/RadioTile.js +1 -2
  430. package/esm/RadioTileGroup/RadioTileGroup.js +1 -2
  431. package/esm/RangeSlider/RangeSlider.js +1 -2
  432. package/esm/Rate/Rate.js +1 -2
  433. package/esm/SelectPicker/SelectPicker.js +1 -2
  434. package/esm/Sidebar/Sidebar.js +1 -2
  435. package/esm/Sidenav/ExpandedSidenavDropdownMenu.js +1 -2
  436. package/esm/Sidenav/Sidenav.js +1 -2
  437. package/esm/Sidenav/SidenavDropdownMenu.js +1 -2
  438. package/esm/Slider/Slider.d.ts +5 -1
  439. package/esm/Slider/Slider.js +12 -13
  440. package/esm/Stack/Stack.js +1 -2
  441. package/esm/Stat/Stat.js +1 -2
  442. package/esm/Stat/StatValue.js +1 -1
  443. package/esm/StatGroup/StatGroup.js +1 -2
  444. package/esm/Steps/Steps.js +1 -2
  445. package/esm/Table/Table.js +1 -1
  446. package/esm/Tabs/Tabs.js +1 -2
  447. package/esm/Tag/Tag.js +1 -2
  448. package/esm/TagInput/TagInput.js +1 -1
  449. package/esm/TagPicker/TagPicker.js +1 -1
  450. package/esm/Text/Text.js +1 -2
  451. package/esm/Textarea/Textarea.js +1 -2
  452. package/esm/TimePicker/TimePicker.d.ts +1 -2
  453. package/esm/TimePicker/TimePicker.js +1 -1
  454. package/esm/TimeRangePicker/TimeRangePicker.js +1 -1
  455. package/esm/Timeline/Timeline.js +1 -2
  456. package/esm/Toggle/Toggle.js +1 -2
  457. package/esm/Tooltip/Tooltip.js +1 -2
  458. package/esm/Tree/Tree.js +1 -2
  459. package/esm/Tree/TreeNode.js +1 -2
  460. package/esm/Tree/TreeNodeToggle.js +1 -2
  461. package/esm/Tree/TreeView.js +1 -2
  462. package/esm/Tree/hooks/useFocusTree.js +1 -2
  463. package/esm/TreePicker/TreePicker.js +1 -2
  464. package/esm/Uploader/Uploader.js +1 -2
  465. package/esm/Whisper/Whisper.js +1 -1
  466. package/esm/index.d.ts +2 -0
  467. package/esm/index.js +2 -0
  468. package/esm/internals/Box/index.d.ts +1 -0
  469. package/esm/internals/Box/index.js +1 -0
  470. package/esm/internals/Burger/Burger.d.ts +16 -0
  471. package/esm/internals/Burger/Burger.js +41 -0
  472. package/esm/internals/Burger/index.d.ts +4 -0
  473. package/esm/internals/Burger/index.js +8 -0
  474. package/esm/internals/CloseButton/CloseButton.js +1 -2
  475. package/esm/internals/Menu/Menu.js +1 -1
  476. package/esm/internals/Menu/Menubar.js +1 -1
  477. package/esm/internals/Picker/PickerIndicator.js +1 -2
  478. package/esm/internals/Picker/hooks/useCombobox.d.ts +1 -1
  479. package/esm/internals/Plaintext/Plaintext.js +1 -2
  480. package/esm/internals/Provider/CustomContext.d.ts +253 -0
  481. package/esm/internals/Provider/CustomContext.js +3 -0
  482. package/esm/internals/Provider/types.d.ts +236 -0
  483. package/esm/internals/Ripple/Ripple.js +1 -2
  484. package/esm/internals/SafeAnchor/SafeAnchor.js +1 -1
  485. package/esm/internals/Windowing/List.js +1 -1
  486. package/esm/internals/hooks/index.d.ts +1 -0
  487. package/esm/internals/hooks/index.js +1 -0
  488. package/esm/{CustomProvider → internals/hooks}/useCustom.d.ts +4 -4
  489. package/esm/{CustomProvider → internals/hooks}/useCustom.js +4 -4
  490. package/esm/internals/hooks/useStyles.js +1 -1
  491. package/esm/internals/hooks/useToggleCaret.js +1 -1
  492. package/esm/{CustomProvider → internals/intl}/FormattedDate.js +1 -1
  493. package/esm/{CustomProvider → internals/intl}/FormattedNumber.js +1 -1
  494. package/esm/internals/types/picker.d.ts +2 -2
  495. package/esm/internals/types/sizes.d.ts +2 -0
  496. package/esm/internals/types/sizes.js +3 -1
  497. package/esm/internals/utils/date/getWeekStartDates.d.ts +0 -1
  498. package/esm/internals/utils/date/getWeekStartDates.js +2 -4
  499. package/esm/internals/utils/react/createComponent.js +12 -2
  500. package/esm/useToaster/useToaster.js +1 -3
  501. package/internals/Burger/styles/index.less +67 -0
  502. package/internals/CloseButton/styles/index.less +0 -10
  503. package/internals/Picker/styles/index.less +13 -10
  504. package/internals/Picker/styles/mixin.less +3 -3
  505. package/package.json +3 -3
  506. package/styles/color-modes/dark.less +7 -10
  507. package/styles/color-modes/high-contrast.less +3 -6
  508. package/styles/color-modes/light.less +5 -8
  509. package/styles/index.less +3 -1
  510. package/styles/mixins/utilities.less +2 -5
  511. package/cjs/CustomProvider/types.d.ts +0 -234
  512. package/cjs/InputNumber/InputNumber.js +0 -300
  513. package/esm/CustomProvider/types.d.ts +0 -234
  514. package/esm/InputNumber/InputNumber.js +0 -293
  515. /package/cjs/{CustomProvider → internals/Provider}/types.js +0 -0
  516. /package/cjs/{CustomProvider → internals/intl}/FormattedDate.d.ts +0 -0
  517. /package/cjs/{CustomProvider → internals/intl}/FormattedNumber.d.ts +0 -0
  518. /package/esm/{CustomProvider → internals/Provider}/types.js +0 -0
  519. /package/esm/{CustomProvider → internals/intl}/FormattedDate.d.ts +0 -0
  520. /package/esm/{CustomProvider → internals/intl}/FormattedNumber.d.ts +0 -0
package/CheckTree/styles/index.css CHANGED
@@ -106,8 +106,7 @@
106
106
  --rs-bg-overlay: var(--rs-gray-0);
107
107
  --rs-state-hover-bg: var(--rs-primary-50);
108
108
  --rs-color-focus-ring: rgb(from var(--rs-primary-500) r g b / 25%);
109
- --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-primary-500) r g b / 25%);
110
- --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
109
+ --rs-state-error-outline: 2px solid rgb(from var(--rs-color-red) r g b / 25%);
111
110
  --rs-btn-default-bg: var(--rs-gray-50);
112
111
  --rs-btn-default-text: var(--rs-gray-800);
113
112
  --rs-btn-default-border-color: var(--rs-gray-200);
@@ -152,7 +151,6 @@
152
151
  --rs-checkbox-border: var(--rs-gray-300);
153
152
  --rs-checkbox-checked-bg: var(--rs-primary-500);
154
153
  --rs-checkbox-disabled-bg: var(--rs-gray-50);
155
- --rs-close-button-hover-color: var(--rs-color-red);
156
154
  --rs-picker-value: var(--rs-primary-700);
157
155
  --rs-picker-count-bg: var(--rs-primary-500);
158
156
  --rs-picker-count-text: #fff;
@@ -164,7 +162,6 @@
164
162
  :root,
165
163
  .rs-theme-light {
166
164
  --rs-color-focus-ring: rgba(52, 152, 255, 0.25);
167
- --rs-state-focus-shadow: 0 0 0 3px rgba(52, 152, 255, 0.25);
168
165
  --rs-loader-ring: rgba(247, 247, 250, 0.8);
169
166
  --rs-loader-backdrop: rgba(255, 255, 255, 0.9);
170
167
  --rs-loader-ring-inverse: rgba(247, 247, 250, 0.3);
@@ -251,9 +248,8 @@
251
248
  --rs-border-primary: var(--rs-gray-600);
252
249
  --rs-bg-overlay: var(--rs-gray-700);
253
250
  --rs-state-hover-bg: var(--rs-gray-600);
254
- --rs-color-focus-ring: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
255
- --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
256
- --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
251
+ --rs-color-focus-ring: 0 0 0 2px rgb(from var(--rs-gray-500) r g b / 25%);
252
+ --rs-state-error-outline: 2px solid rgb(from var(--rs-color-red) r g b / 25%);
257
253
  --rs-btn-default-bg: var(--rs-gray-600);
258
254
  --rs-btn-default-text: var(--rs-gray-50);
259
255
  --rs-btn-default-border-color: var(--rs-gray-700);
@@ -298,7 +294,6 @@
298
294
  --rs-checkbox-border: var(--rs-gray-400);
299
295
  --rs-checkbox-checked-bg: var(--rs-primary-500);
300
296
  --rs-checkbox-disabled-bg: var(--rs-gray-500);
301
- --rs-close-button-hover-color: var(--rs-color-red);
302
297
  --rs-picker-value: var(--rs-primary-500);
303
298
  --rs-picker-count-bg: var(--rs-primary-700);
304
299
  --rs-picker-count-text: #fff;
@@ -306,8 +301,7 @@
306
301
  }
307
302
  @supports not (color: rgb(from white r g b)) {
308
303
  .rs-theme-dark {
309
- --rs-color-focus-ring: 0 0 0 3px rgba(52, 195, 255, 0.25);
310
- --rs-state-focus-shadow: 0 0 0 3px rgba(52, 195, 255, 0.25);
304
+ --rs-color-focus-ring: 0 0 0 2px rgba(52, 195, 255, 0.25);
311
305
  --rs-loader-ring: rgba(233, 235, 240, 0.3);
312
306
  --rs-loader-backdrop: rgba(15, 19, 26, 0.83);
313
307
  --rs-loader-ring-inverse: rgba(233, 235, 240, 0.8);
@@ -395,8 +389,7 @@
395
389
  --rs-bg-overlay: var(--rs-gray-800);
396
390
  --rs-state-hover-bg: var(--rs-gray-600);
397
391
  --rs-color-focus-ring: var(--rs-gray-0);
398
- --rs-state-focus-shadow: 0 0 0 3px var(--rs-gray-900), 0 0 0 5px var(--rs-gray-0);
399
- --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
392
+ --rs-state-error-outline: 2px solid rgb(from var(--rs-color-red) r g b / 25%);
400
393
  --rs-btn-default-bg: transparent;
401
394
  --rs-btn-default-text: var(--rs-primary-500);
402
395
  --rs-btn-default-border-color: var(--rs-primary-500);
@@ -442,7 +435,6 @@
442
435
  --rs-checkbox-border: var(--rs-gray-100);
443
436
  --rs-checkbox-checked-bg: var(--rs-primary-500);
444
437
  --rs-checkbox-disabled-bg: var(--rs-gray-500);
445
- --rs-close-button-hover-color: var(--rs-color-red);
446
438
  --rs-picker-value: var(--rs-primary-500);
447
439
  --rs-picker-count-bg: var(--rs-primary-500);
448
440
  --rs-picker-count-text: var(--rs-gray-900);
@@ -513,10 +505,8 @@
513
505
  border-color: var(--rs-btn-default-border-color);
514
506
  }
515
507
  .rs-btn:focus-visible {
516
- outline: 3px solid var(--rs-color-focus-ring);
517
- }
518
- .rs-theme-high-contrast .rs-btn:focus-visible {
519
- outline-offset: 2px;
508
+ outline: 2px solid var(--rs-color-focus-ring);
509
+ outline-offset: -1px;
520
510
  }
521
511
  .rs-btn:hover {
522
512
  color: var(--rs-btn-default-hover-text);
@@ -1418,15 +1408,12 @@
1418
1408
  .rs-input::placeholder {
1419
1409
  color: var(--rs-text-secondary);
1420
1410
  }
1421
- .rs-input:focus,
1422
- .rs-input:hover:not(:disabled) {
1423
- border-color: var(--rs-input-focus-border);
1424
- }
1425
1411
  .rs-input:focus {
1426
- outline: 3px solid var(--rs-color-focus-ring);
1412
+ border-color: var(--rs-input-focus-border);
1427
1413
  }
1428
- .rs-theme-high-contrast .rs-input:focus {
1429
- outline-offset: 2px;
1414
+ .rs-input:focus-visible {
1415
+ outline: 2px solid var(--rs-color-focus-ring);
1416
+ outline-offset: -1px;
1430
1417
  }
1431
1418
  .rs-input:disabled {
1432
1419
  background-color: var(--rs-input-disabled-bg);
@@ -1511,18 +1498,14 @@
1511
1498
  .rs-theme-high-contrast .rs-input-group {
1512
1499
  transition: none;
1513
1500
  }
1514
- .rs-input-group:not(.rs-input-group-disabled):hover,
1515
1501
  .rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus,
1516
1502
  .rs-input-group:focus-within {
1517
1503
  border-color: var(--rs-input-focus-border);
1518
1504
  }
1519
1505
  .rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus,
1520
1506
  .rs-input-group:focus-within {
1521
- outline: 3px solid var(--rs-color-focus-ring);
1522
- }
1523
- .rs-theme-high-contrast .rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus,
1524
- .rs-theme-high-contrast .rs-input-group:focus-within {
1525
- outline-offset: 2px;
1507
+ outline: 2px solid var(--rs-color-focus-ring);
1508
+ outline-offset: -1px;
1526
1509
  }
1527
1510
  .rs-input-group .rs-input-group {
1528
1511
  outline: none !important;
@@ -1531,7 +1514,7 @@
1531
1514
  .rs-input-group .rs-input-group-btn {
1532
1515
  height: var(--rs-input-group-input-height);
1533
1516
  }
1534
- .rs-input-group .rs-input-number,
1517
+ .rs-input-group .rs-number-input,
1535
1518
  .rs-input-group .rs-input-group-addon,
1536
1519
  .rs-input-group .rs-input-group-btn,
1537
1520
  .rs-input-group .rs-picker[data-picker='date'] .rs-picker-toggle {
@@ -1681,15 +1664,6 @@
1681
1664
  .rs-btn-close .rs-icon {
1682
1665
  vertical-align: bottom;
1683
1666
  }
1684
- .rs-btn-close:hover,
1685
- .rs-btn-close:focus {
1686
- color: var(--rs-close-button-hover-color);
1687
- }
1688
- .rs-btn-close:hover svg path,
1689
- .rs-btn-close:focus svg path {
1690
- stroke: var(--rs-close-button-hover-color);
1691
- stroke-width: 1;
1692
- }
1693
1667
  .rs-picker[data-variant='subtle'] .picker-subtle-toggle {
1694
1668
  --rs-picker-toggle-border-width: 0px;
1695
1669
  position: relative;
@@ -1698,12 +1672,10 @@
1698
1672
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle {
1699
1673
  cursor: not-allowed;
1700
1674
  }
1701
- .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover,
1702
1675
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus,
1703
1676
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active {
1704
1677
  background: none;
1705
1678
  }
1706
- .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover::after,
1707
1679
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus::after,
1708
1680
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active::after {
1709
1681
  display: none;
@@ -1713,6 +1685,7 @@
1713
1685
  --rs-picker-loader-size: 20px;
1714
1686
  --rs-picker-toggle-border-width: 1px;
1715
1687
  --rs-picker-toggle-bg: var(--rs-input-bg);
1688
+ --rs-picker-toggle-border-color: var(--rs-border-primary);
1716
1689
  display: inline-block;
1717
1690
  vertical-align: middle;
1718
1691
  max-width: 100%;
@@ -1732,6 +1705,9 @@
1732
1705
  .rs-picker[data-disabled='true'] .rs-picker-value-count {
1733
1706
  opacity: 0.5;
1734
1707
  }
1708
+ .rs-picker[data-disabled='true'] .rs-picker-toggle {
1709
+ pointer-events: none;
1710
+ }
1735
1711
  .rs-picker-toggle .rs-picker-toggle-placeholder {
1736
1712
  color: var(--rs-text-secondary);
1737
1713
  }
@@ -1754,13 +1730,14 @@
1754
1730
  .rs-picker-value-separator {
1755
1731
  margin: 0 var(--rs-spacing) 0 0;
1756
1732
  }
1757
- .rs-picker:not([data-disabled='true']):hover,
1758
1733
  .rs-picker.rs-picker-focused {
1759
1734
  border-color: var(--rs-input-focus-border);
1760
1735
  }
1761
1736
  .rs-picker-toggle-active,
1762
1737
  .rs-picker.rs-picker-focused {
1763
- box-shadow: var(--rs-state-focus-shadow);
1738
+ --rs-picker-toggle-border-color: var(--rs-input-focus-border);
1739
+ outline: 2px solid var(--rs-color-focus-ring);
1740
+ outline-offset: -1px;
1764
1741
  }
1765
1742
  .rs-picker-label.rs-input-group-addon {
1766
1743
  color: var(--rs-text-primary);
@@ -1869,12 +1846,13 @@
1869
1846
  }
1870
1847
  [data-variant='default'] .rs-picker-toggle {
1871
1848
  color: var(--rs-text-primary);
1872
- border: var(--rs-picker-toggle-border-width) solid var(--rs-border-primary);
1849
+ border-width: var(--rs-picker-toggle-border-width);
1850
+ border-color: var(--rs-picker-toggle-border-color);
1851
+ border-style: solid;
1873
1852
  }
1874
1853
  [data-disabled='true'] .rs-picker-toggle {
1875
1854
  cursor: not-allowed;
1876
1855
  }
1877
- .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):hover,
1878
1856
  .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):focus {
1879
1857
  border-color: var(--rs-input-focus-border);
1880
1858
  }
@@ -1886,12 +1864,10 @@
1886
1864
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle {
1887
1865
  cursor: not-allowed;
1888
1866
  }
1889
- .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover,
1890
1867
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus,
1891
1868
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active {
1892
1869
  background: none;
1893
1870
  }
1894
- .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover::after,
1895
1871
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus::after,
1896
1872
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active::after {
1897
1873
  display: none;
@@ -1944,12 +1920,7 @@
1944
1920
  .rs-theme-high-contrast .rs-picker-toggle {
1945
1921
  transition: none;
1946
1922
  }
1947
- .rs-picker-toggle .rs-picker[data-variant='default']:hover,
1948
- :not([data-disabled='true']) .rs-picker-toggle:hover,
1949
- .rs-picker-toggle .rs-picker[data-variant='default']:focus,
1950
- :not([data-disabled='true']) .rs-picker-toggle:focus,
1951
- .rs-picker-toggle .rs-picker[data-variant='default']-active,
1952
- :not([data-disabled='true']) .rs-picker-toggle-active {
1923
+ .rs-picker-toggle .rs-picker[data-variant='default']:focus {
1953
1924
  border-color: var(--rs-input-focus-border);
1954
1925
  }
1955
1926
  .rs-picker[data-variant='subtle'] .rs-picker-toggle {
@@ -2010,15 +1981,13 @@
2010
1981
  align-items: center;
2011
1982
  }
2012
1983
  .rs-picker-toggle-indicator .rs-picker-clean {
2013
- display: inline-flex;
2014
- align-items: center;
2015
- height: 20px;
2016
- font-size: var(--rs-font-size-sm);
2017
- background: inherit;
2018
1984
  color: var(--rs-text-secondary);
2019
1985
  transition: 0.2s color linear;
2020
1986
  cursor: pointer;
2021
1987
  }
1988
+ .rs-picker-toggle-indicator .rs-picker-clean:hover {
1989
+ color: var(--rs-text-primary);
1990
+ }
2022
1991
  .rs-picker-toggle-indicator .rs-picker-clean.rs-btn-close {
2023
1992
  padding: 0;
2024
1993
  }
@@ -2056,17 +2025,13 @@
2056
2025
  .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover,
2057
2026
  .rs-theme-high-contrast .rs-check-item:focus,
2058
2027
  .rs-theme-high-contrast .rs-check-item.rs-check-item-focus {
2059
- outline: 3px solid var(--rs-color-focus-ring);
2028
+ outline: 2px solid var(--rs-color-focus-ring);
2029
+ outline-offset: -1px;
2060
2030
  outline-offset: -3px;
2061
2031
  outline-width: 2px;
2062
2032
  color: var(--rs-listbox-option-hover-text);
2063
2033
  text-decoration: underline;
2064
2034
  }
2065
- .rs-theme-high-contrast .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover,
2066
- .rs-theme-high-contrast .rs-theme-high-contrast .rs-check-item:focus,
2067
- .rs-theme-high-contrast .rs-theme-high-contrast .rs-check-item.rs-check-item-focus {
2068
- outline-offset: 2px;
2069
- }
2070
2035
  .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover .rs-check-tree-node-text-wrapper,
2071
2036
  .rs-theme-high-contrast .rs-check-item:focus .rs-check-tree-node-text-wrapper,
2072
2037
  .rs-theme-high-contrast .rs-check-item.rs-check-item-focus .rs-check-tree-node-text-wrapper {
@@ -2141,7 +2106,8 @@
2141
2106
  color: var(--rs-text-disabled);
2142
2107
  }
2143
2108
  .rs-checkbox [type='checkbox']:focus-visible ~ .rs-checkbox-inner::before {
2144
- box-shadow: var(--rs-state-focus-shadow);
2109
+ outline: 2px solid var(--rs-color-focus-ring);
2110
+ outline-offset: -1px;
2145
2111
  }
2146
2112
  .rs-checkbox-checker {
2147
2113
  position: relative;
@@ -2325,10 +2291,8 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
2325
2291
  width: auto;
2326
2292
  }
2327
2293
  .rs-check-tree .rs-check-tree-node-content:focus-visible .rs-checkbox-label {
2328
- outline: 3px solid var(--rs-color-focus-ring);
2329
- }
2330
- .rs-theme-high-contrast .rs-check-tree .rs-check-tree-node-content:focus-visible .rs-checkbox-label {
2331
- outline-offset: 2px;
2294
+ outline: 2px solid var(--rs-color-focus-ring);
2295
+ outline-offset: -1px;
2332
2296
  }
2333
2297
  .rs-check-tree .rs-check-tree-empty {
2334
2298
  padding-inline: calc(var(--rs-spacing) * 2);
package/CheckTreePicker/styles/index.css CHANGED
@@ -106,8 +106,7 @@
106
106
  --rs-bg-overlay: var(--rs-gray-0);
107
107
  --rs-state-hover-bg: var(--rs-primary-50);
108
108
  --rs-color-focus-ring: rgb(from var(--rs-primary-500) r g b / 25%);
109
- --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-primary-500) r g b / 25%);
110
- --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
109
+ --rs-state-error-outline: 2px solid rgb(from var(--rs-color-red) r g b / 25%);
111
110
  --rs-btn-default-bg: var(--rs-gray-50);
112
111
  --rs-btn-default-text: var(--rs-gray-800);
113
112
  --rs-btn-default-border-color: var(--rs-gray-200);
@@ -152,7 +151,6 @@
152
151
  --rs-checkbox-border: var(--rs-gray-300);
153
152
  --rs-checkbox-checked-bg: var(--rs-primary-500);
154
153
  --rs-checkbox-disabled-bg: var(--rs-gray-50);
155
- --rs-close-button-hover-color: var(--rs-color-red);
156
154
  --rs-picker-value: var(--rs-primary-700);
157
155
  --rs-picker-count-bg: var(--rs-primary-500);
158
156
  --rs-picker-count-text: #fff;
@@ -164,7 +162,6 @@
164
162
  :root,
165
163
  .rs-theme-light {
166
164
  --rs-color-focus-ring: rgba(52, 152, 255, 0.25);
167
- --rs-state-focus-shadow: 0 0 0 3px rgba(52, 152, 255, 0.25);
168
165
  --rs-loader-ring: rgba(247, 247, 250, 0.8);
169
166
  --rs-loader-backdrop: rgba(255, 255, 255, 0.9);
170
167
  --rs-loader-ring-inverse: rgba(247, 247, 250, 0.3);
@@ -251,9 +248,8 @@
251
248
  --rs-border-primary: var(--rs-gray-600);
252
249
  --rs-bg-overlay: var(--rs-gray-700);
253
250
  --rs-state-hover-bg: var(--rs-gray-600);
254
- --rs-color-focus-ring: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
255
- --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
256
- --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
251
+ --rs-color-focus-ring: 0 0 0 2px rgb(from var(--rs-gray-500) r g b / 25%);
252
+ --rs-state-error-outline: 2px solid rgb(from var(--rs-color-red) r g b / 25%);
257
253
  --rs-btn-default-bg: var(--rs-gray-600);
258
254
  --rs-btn-default-text: var(--rs-gray-50);
259
255
  --rs-btn-default-border-color: var(--rs-gray-700);
@@ -298,7 +294,6 @@
298
294
  --rs-checkbox-border: var(--rs-gray-400);
299
295
  --rs-checkbox-checked-bg: var(--rs-primary-500);
300
296
  --rs-checkbox-disabled-bg: var(--rs-gray-500);
301
- --rs-close-button-hover-color: var(--rs-color-red);
302
297
  --rs-picker-value: var(--rs-primary-500);
303
298
  --rs-picker-count-bg: var(--rs-primary-700);
304
299
  --rs-picker-count-text: #fff;
@@ -306,8 +301,7 @@
306
301
  }
307
302
  @supports not (color: rgb(from white r g b)) {
308
303
  .rs-theme-dark {
309
- --rs-color-focus-ring: 0 0 0 3px rgba(52, 195, 255, 0.25);
310
- --rs-state-focus-shadow: 0 0 0 3px rgba(52, 195, 255, 0.25);
304
+ --rs-color-focus-ring: 0 0 0 2px rgba(52, 195, 255, 0.25);
311
305
  --rs-loader-ring: rgba(233, 235, 240, 0.3);
312
306
  --rs-loader-backdrop: rgba(15, 19, 26, 0.83);
313
307
  --rs-loader-ring-inverse: rgba(233, 235, 240, 0.8);
@@ -395,8 +389,7 @@
395
389
  --rs-bg-overlay: var(--rs-gray-800);
396
390
  --rs-state-hover-bg: var(--rs-gray-600);
397
391
  --rs-color-focus-ring: var(--rs-gray-0);
398
- --rs-state-focus-shadow: 0 0 0 3px var(--rs-gray-900), 0 0 0 5px var(--rs-gray-0);
399
- --rs-state-error-outline: 3px solid rgb(from var(--rs-color-red) r g b / 25%);
392
+ --rs-state-error-outline: 2px solid rgb(from var(--rs-color-red) r g b / 25%);
400
393
  --rs-btn-default-bg: transparent;
401
394
  --rs-btn-default-text: var(--rs-primary-500);
402
395
  --rs-btn-default-border-color: var(--rs-primary-500);
@@ -442,7 +435,6 @@
442
435
  --rs-checkbox-border: var(--rs-gray-100);
443
436
  --rs-checkbox-checked-bg: var(--rs-primary-500);
444
437
  --rs-checkbox-disabled-bg: var(--rs-gray-500);
445
- --rs-close-button-hover-color: var(--rs-color-red);
446
438
  --rs-picker-value: var(--rs-primary-500);
447
439
  --rs-picker-count-bg: var(--rs-primary-500);
448
440
  --rs-picker-count-text: var(--rs-gray-900);
@@ -513,10 +505,8 @@
513
505
  border-color: var(--rs-btn-default-border-color);
514
506
  }
515
507
  .rs-btn:focus-visible {
516
- outline: 3px solid var(--rs-color-focus-ring);
517
- }
518
- .rs-theme-high-contrast .rs-btn:focus-visible {
519
- outline-offset: 2px;
508
+ outline: 2px solid var(--rs-color-focus-ring);
509
+ outline-offset: -1px;
520
510
  }
521
511
  .rs-btn:hover {
522
512
  color: var(--rs-btn-default-hover-text);
@@ -1418,15 +1408,12 @@
1418
1408
  .rs-input::placeholder {
1419
1409
  color: var(--rs-text-secondary);
1420
1410
  }
1421
- .rs-input:focus,
1422
- .rs-input:hover:not(:disabled) {
1423
- border-color: var(--rs-input-focus-border);
1424
- }
1425
1411
  .rs-input:focus {
1426
- outline: 3px solid var(--rs-color-focus-ring);
1412
+ border-color: var(--rs-input-focus-border);
1427
1413
  }
1428
- .rs-theme-high-contrast .rs-input:focus {
1429
- outline-offset: 2px;
1414
+ .rs-input:focus-visible {
1415
+ outline: 2px solid var(--rs-color-focus-ring);
1416
+ outline-offset: -1px;
1430
1417
  }
1431
1418
  .rs-input:disabled {
1432
1419
  background-color: var(--rs-input-disabled-bg);
@@ -1511,18 +1498,14 @@
1511
1498
  .rs-theme-high-contrast .rs-input-group {
1512
1499
  transition: none;
1513
1500
  }
1514
- .rs-input-group:not(.rs-input-group-disabled):hover,
1515
1501
  .rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus,
1516
1502
  .rs-input-group:focus-within {
1517
1503
  border-color: var(--rs-input-focus-border);
1518
1504
  }
1519
1505
  .rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus,
1520
1506
  .rs-input-group:focus-within {
1521
- outline: 3px solid var(--rs-color-focus-ring);
1522
- }
1523
- .rs-theme-high-contrast .rs-input-group:not(.rs-input-group-disabled).rs-input-group-focus,
1524
- .rs-theme-high-contrast .rs-input-group:focus-within {
1525
- outline-offset: 2px;
1507
+ outline: 2px solid var(--rs-color-focus-ring);
1508
+ outline-offset: -1px;
1526
1509
  }
1527
1510
  .rs-input-group .rs-input-group {
1528
1511
  outline: none !important;
@@ -1531,7 +1514,7 @@
1531
1514
  .rs-input-group .rs-input-group-btn {
1532
1515
  height: var(--rs-input-group-input-height);
1533
1516
  }
1534
- .rs-input-group .rs-input-number,
1517
+ .rs-input-group .rs-number-input,
1535
1518
  .rs-input-group .rs-input-group-addon,
1536
1519
  .rs-input-group .rs-input-group-btn,
1537
1520
  .rs-input-group .rs-picker[data-picker='date'] .rs-picker-toggle {
@@ -1681,15 +1664,6 @@
1681
1664
  .rs-btn-close .rs-icon {
1682
1665
  vertical-align: bottom;
1683
1666
  }
1684
- .rs-btn-close:hover,
1685
- .rs-btn-close:focus {
1686
- color: var(--rs-close-button-hover-color);
1687
- }
1688
- .rs-btn-close:hover svg path,
1689
- .rs-btn-close:focus svg path {
1690
- stroke: var(--rs-close-button-hover-color);
1691
- stroke-width: 1;
1692
- }
1693
1667
  .rs-picker[data-variant='subtle'] .picker-subtle-toggle {
1694
1668
  --rs-picker-toggle-border-width: 0px;
1695
1669
  position: relative;
@@ -1698,12 +1672,10 @@
1698
1672
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle {
1699
1673
  cursor: not-allowed;
1700
1674
  }
1701
- .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover,
1702
1675
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus,
1703
1676
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active {
1704
1677
  background: none;
1705
1678
  }
1706
- .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:hover::after,
1707
1679
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:focus::after,
1708
1680
  .rs-picker[data-variant='subtle'][data-disabled='true'] .picker-subtle-toggle:active::after {
1709
1681
  display: none;
@@ -1713,6 +1685,7 @@
1713
1685
  --rs-picker-loader-size: 20px;
1714
1686
  --rs-picker-toggle-border-width: 1px;
1715
1687
  --rs-picker-toggle-bg: var(--rs-input-bg);
1688
+ --rs-picker-toggle-border-color: var(--rs-border-primary);
1716
1689
  display: inline-block;
1717
1690
  vertical-align: middle;
1718
1691
  max-width: 100%;
@@ -1732,6 +1705,9 @@
1732
1705
  .rs-picker[data-disabled='true'] .rs-picker-value-count {
1733
1706
  opacity: 0.5;
1734
1707
  }
1708
+ .rs-picker[data-disabled='true'] .rs-picker-toggle {
1709
+ pointer-events: none;
1710
+ }
1735
1711
  .rs-picker-toggle .rs-picker-toggle-placeholder {
1736
1712
  color: var(--rs-text-secondary);
1737
1713
  }
@@ -1754,13 +1730,14 @@
1754
1730
  .rs-picker-value-separator {
1755
1731
  margin: 0 var(--rs-spacing) 0 0;
1756
1732
  }
1757
- .rs-picker:not([data-disabled='true']):hover,
1758
1733
  .rs-picker.rs-picker-focused {
1759
1734
  border-color: var(--rs-input-focus-border);
1760
1735
  }
1761
1736
  .rs-picker-toggle-active,
1762
1737
  .rs-picker.rs-picker-focused {
1763
- box-shadow: var(--rs-state-focus-shadow);
1738
+ --rs-picker-toggle-border-color: var(--rs-input-focus-border);
1739
+ outline: 2px solid var(--rs-color-focus-ring);
1740
+ outline-offset: -1px;
1764
1741
  }
1765
1742
  .rs-picker-label.rs-input-group-addon {
1766
1743
  color: var(--rs-text-primary);
@@ -1869,12 +1846,13 @@
1869
1846
  }
1870
1847
  [data-variant='default'] .rs-picker-toggle {
1871
1848
  color: var(--rs-text-primary);
1872
- border: var(--rs-picker-toggle-border-width) solid var(--rs-border-primary);
1849
+ border-width: var(--rs-picker-toggle-border-width);
1850
+ border-color: var(--rs-picker-toggle-border-color);
1851
+ border-style: solid;
1873
1852
  }
1874
1853
  [data-disabled='true'] .rs-picker-toggle {
1875
1854
  cursor: not-allowed;
1876
1855
  }
1877
- .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):hover,
1878
1856
  .rs-picker-toggle [data-variant='default']:not([data-disabled='true']):focus {
1879
1857
  border-color: var(--rs-input-focus-border);
1880
1858
  }
@@ -1886,12 +1864,10 @@
1886
1864
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle {
1887
1865
  cursor: not-allowed;
1888
1866
  }
1889
- .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover,
1890
1867
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus,
1891
1868
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active {
1892
1869
  background: none;
1893
1870
  }
1894
- .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:hover::after,
1895
1871
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:focus::after,
1896
1872
  .rs-picker[data-variant='subtle'][data-disabled='true'] .rs-picker-toggle:active::after {
1897
1873
  display: none;
@@ -1944,12 +1920,7 @@
1944
1920
  .rs-theme-high-contrast .rs-picker-toggle {
1945
1921
  transition: none;
1946
1922
  }
1947
- .rs-picker-toggle .rs-picker[data-variant='default']:hover,
1948
- :not([data-disabled='true']) .rs-picker-toggle:hover,
1949
- .rs-picker-toggle .rs-picker[data-variant='default']:focus,
1950
- :not([data-disabled='true']) .rs-picker-toggle:focus,
1951
- .rs-picker-toggle .rs-picker[data-variant='default']-active,
1952
- :not([data-disabled='true']) .rs-picker-toggle-active {
1923
+ .rs-picker-toggle .rs-picker[data-variant='default']:focus {
1953
1924
  border-color: var(--rs-input-focus-border);
1954
1925
  }
1955
1926
  .rs-picker[data-variant='subtle'] .rs-picker-toggle {
@@ -2010,15 +1981,13 @@
2010
1981
  align-items: center;
2011
1982
  }
2012
1983
  .rs-picker-toggle-indicator .rs-picker-clean {
2013
- display: inline-flex;
2014
- align-items: center;
2015
- height: 20px;
2016
- font-size: var(--rs-font-size-sm);
2017
- background: inherit;
2018
1984
  color: var(--rs-text-secondary);
2019
1985
  transition: 0.2s color linear;
2020
1986
  cursor: pointer;
2021
1987
  }
1988
+ .rs-picker-toggle-indicator .rs-picker-clean:hover {
1989
+ color: var(--rs-text-primary);
1990
+ }
2022
1991
  .rs-picker-toggle-indicator .rs-picker-clean.rs-btn-close {
2023
1992
  padding: 0;
2024
1993
  }
@@ -2056,17 +2025,13 @@
2056
2025
  .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover,
2057
2026
  .rs-theme-high-contrast .rs-check-item:focus,
2058
2027
  .rs-theme-high-contrast .rs-check-item.rs-check-item-focus {
2059
- outline: 3px solid var(--rs-color-focus-ring);
2028
+ outline: 2px solid var(--rs-color-focus-ring);
2029
+ outline-offset: -1px;
2060
2030
  outline-offset: -3px;
2061
2031
  outline-width: 2px;
2062
2032
  color: var(--rs-listbox-option-hover-text);
2063
2033
  text-decoration: underline;
2064
2034
  }
2065
- .rs-theme-high-contrast .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover,
2066
- .rs-theme-high-contrast .rs-theme-high-contrast .rs-check-item:focus,
2067
- .rs-theme-high-contrast .rs-theme-high-contrast .rs-check-item.rs-check-item-focus {
2068
- outline-offset: 2px;
2069
- }
2070
2035
  .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover .rs-check-tree-node-text-wrapper,
2071
2036
  .rs-theme-high-contrast .rs-check-item:focus .rs-check-tree-node-text-wrapper,
2072
2037
  .rs-theme-high-contrast .rs-check-item.rs-check-item-focus .rs-check-tree-node-text-wrapper {
@@ -2141,7 +2106,8 @@
2141
2106
  color: var(--rs-text-disabled);
2142
2107
  }
2143
2108
  .rs-checkbox [type='checkbox']:focus-visible ~ .rs-checkbox-inner::before {
2144
- box-shadow: var(--rs-state-focus-shadow);
2109
+ outline: 2px solid var(--rs-color-focus-ring);
2110
+ outline-offset: -1px;
2145
2111
  }
2146
2112
  .rs-checkbox-checker {
2147
2113
  position: relative;
@@ -2325,10 +2291,8 @@ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
2325
2291
  width: auto;
2326
2292
  }
2327
2293
  .rs-check-tree .rs-check-tree-node-content:focus-visible .rs-checkbox-label {
2328
- outline: 3px solid var(--rs-color-focus-ring);
2329
- }
2330
- .rs-theme-high-contrast .rs-check-tree .rs-check-tree-node-content:focus-visible .rs-checkbox-label {
2331
- outline-offset: 2px;
2294
+ outline: 2px solid var(--rs-color-focus-ring);
2295
+ outline-offset: -1px;
2332
2296
  }
2333
2297
  .rs-check-tree .rs-check-tree-empty {
2334
2298
  padding-inline: calc(var(--rs-spacing) * 2);
package/Checkbox/styles/index.css CHANGED
@@ -25,7 +25,6 @@
25
25
  --rs-gray-500: #939393;
26
26
  --rs-gray-600: #717273;
27
27
  --rs-gray-800: #343434;
28
- --rs-gray-900: #121212;
29
28
  --rs-primary-500: #3498ff;
30
29
  --rs-red-500: #f44336;
31
30
  --rs-orange-500: #fa8900;
@@ -35,7 +34,7 @@
35
34
  --rs-blue-500: #2196f3;
36
35
  --rs-violet-500: #673ab7;
37
36
  --rs-text-disabled: var(--rs-gray-600);
38
- --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-primary-500) r g b / 25%);
37
+ --rs-color-focus-ring: rgb(from var(--rs-primary-500) r g b / 25%);
39
38
  --rs-checkbox-icon: #fff;
40
39
  --rs-checkbox-border: var(--rs-gray-300);
41
40
  --rs-checkbox-checked-bg: var(--rs-primary-500);
@@ -44,7 +43,7 @@
44
43
  @supports not (color: rgb(from white r g b)) {
45
44
  :root,
46
45
  .rs-theme-light {
47
- --rs-state-focus-shadow: 0 0 0 3px rgba(52, 152, 255, 0.25);
46
+ --rs-color-focus-ring: rgba(52, 152, 255, 0.25);
48
47
  }
49
48
  }
50
49
  .rs-theme-dark {
@@ -56,7 +55,6 @@
56
55
  --rs-gray-500: #5c6066;
57
56
  --rs-gray-600: #3c3f43;
58
57
  --rs-gray-800: #1a1d24;
59
- --rs-gray-900: #0f131a;
60
58
  --rs-primary-500: #34c3ff;
61
59
  --rs-red-500: #f04f43;
62
60
  --rs-orange-500: #ff9800;
@@ -66,7 +64,7 @@
66
64
  --rs-blue-500: #1499ef;
67
65
  --rs-violet-500: #673ab7;
68
66
  --rs-text-disabled: var(--rs-gray-400);
69
- --rs-state-focus-shadow: 0 0 0 3px rgb(from var(--rs-gray-500) r g b / 25%);
67
+ --rs-color-focus-ring: 0 0 0 2px rgb(from var(--rs-gray-500) r g b / 25%);
70
68
  --rs-checkbox-icon: var(--rs-gray-800);
71
69
  --rs-checkbox-border: var(--rs-gray-400);
72
70
  --rs-checkbox-checked-bg: var(--rs-primary-500);
@@ -74,7 +72,7 @@
74
72
  }
75
73
  @supports not (color: rgb(from white r g b)) {
76
74
  .rs-theme-dark {
77
- --rs-state-focus-shadow: 0 0 0 3px rgba(52, 195, 255, 0.25);
75
+ --rs-color-focus-ring: 0 0 0 2px rgba(52, 195, 255, 0.25);
78
76
  }
79
77
  }
80
78
  .rs-theme-high-contrast {
@@ -86,7 +84,6 @@
86
84
  --rs-gray-500: #5c6066;
87
85
  --rs-gray-600: #3c3f43;
88
86
  --rs-gray-800: #1a1d24;
89
- --rs-gray-900: #0f131a;
90
87
  --rs-primary-500: #ffff00;
91
88
  --rs-red-500: #bd1732;
92
89
  --rs-orange-500: #ff9800;
@@ -96,7 +93,7 @@
96
93
  --rs-blue-500: #1499ef;
97
94
  --rs-violet-500: #673ab7;
98
95
  --rs-text-disabled: var(--rs-gray-400);
99
- --rs-state-focus-shadow: 0 0 0 3px var(--rs-gray-900), 0 0 0 5px var(--rs-gray-0);
96
+ --rs-color-focus-ring: var(--rs-gray-0);
100
97
  --rs-checkbox-icon: var(--rs-gray-800);
101
98
  --rs-checkbox-border: var(--rs-gray-100);
102
99
  --rs-checkbox-checked-bg: var(--rs-primary-500);
@@ -125,7 +122,8 @@
125
122
  color: var(--rs-text-disabled);
126
123
  }
127
124
  .rs-checkbox [type='checkbox']:focus-visible ~ .rs-checkbox-inner::before {
128
- box-shadow: var(--rs-state-focus-shadow);
125
+ outline: 2px solid var(--rs-color-focus-ring);
126
+ outline-offset: -1px;
129
127
  }
130
128
  .rs-checkbox-checker {
131
129
  position: relative;
package/Checkbox/styles/index.less CHANGED
@@ -7,7 +7,7 @@
7
7
  .radio-checkbox-common();
8
8
 
9
9
  [type='checkbox']:focus-visible ~ .rs-checkbox-inner::before {
10
- box-shadow: var(--rs-state-focus-shadow);
10
+ .focus-ring();
11
11
  }
12
12
  }
13
13